@atom-learning/components - npm Package Compare versions

Comparing version 0.1.0-alpha.5 to 0.1.0-alpha.5.1

dist/components/index.d.ts

		@@ -5,2 +5,3 @@ export { Box } from './box';
		export { Flex } from './flex';
		export { Form, ValidationOptions } from './form';
		export { Grid } from './grid';
		@@ -7,0 +8,0 @@ export { Heading } from './heading';

dist/index.js

		@@ -1,1 +0,1 @@
		"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@atom-learning/theme"),t=require("@stitches/react"),r=require("react"),o=require("@radix-ui/react-visually-hidden"),a=require("@radix-ui/react-checkbox"),n=require("@radix-ui/react-icons"),i=require("@radix-ui/react-progress"),s=require("@radix-ui/react-radio-group"),l=require("react-player/vimeo");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=c(e),p=c(l);const m={p:()=>e=>({padding:e}),pt:()=>e=>({paddingTop:e}),pr:()=>e=>({paddingRight:e}),pb:()=>e=>({paddingBottom:e}),pl:()=>e=>({paddingLeft:e}),px:()=>e=>({paddingLeft:e,paddingRight:e}),py:()=>e=>({paddingTop:e,paddingBottom:e}),m:()=>e=>({margin:e}),mt:()=>e=>({marginTop:e}),mr:()=>e=>({marginRight:e}),mb:()=>e=>({marginBottom:e}),ml:()=>e=>({marginLeft:e}),mx:()=>e=>({marginLeft:e,marginRight:e}),my:()=>e=>({marginTop:e,marginBottom:e}),bg:()=>e=>({background:e}),size:()=>e=>{if(Array.isArray(e)){const[t,r]=e;return{height:t,width:r}}return{height:e,width:e}}},h={sm:"@media (min-width: 550px)",md:"@media (min-width: 800px)",lg:"@media (min-width: 1100px)",xl:"@media (min-width: 1350px)",motion:"@media (prefers-reduced-motion)",hover:"@media (hover: hover)"},u=t.createCss({theme:d.default,utils:m,conditions:h}),{css:g,getCssString:b,global:y,keyframes:$,styled:f,theme:x}=u,v=f("div",{});v.displayName="Box";const w=f("div",{display:"flex"});w.displayName="Flex";const k=f("div",{animationName:`${$({"0%":{opacity:0},"30%":{opacity:1},"50%":{opacity:1},"80%":{opacity:0},"100%":{opacity:0}})}`,animationDuration:"1s",animationFillMode:"both",animationIterationCount:"infinite",animationTimingFunction:"linear",backgroundColor:"currentColor",borderRadius:"100%","&:nth-child(1)":{animationDelay:"-300ms"},"&:nth-child(2)":{animationDelay:"-150ms"},"&:nth-child(3)":{animationDelay:0},variants:{size:{sm:{size:"4px",mx:"2px"},md:{size:"6px",mx:"2px"},lg:{size:"8px",mx:"3px"}}}}),C=({css:e={},message:t="Loading",size:a="md"})=>r.createElement(w,{css:{justifyContent:"center",...e},role:"alert"},r.createElement(o.Root,null,t),r.createElement(k,{size:a}),r.createElement(k,{size:a}),r.createElement(k,{size:a})),E=(e,t)=>({boxShadow:"inset 0 0 0 2px",color:e,backgroundColor:"white","&:not([disabled]):hover, &:not([disabled]):focus":{textDecoration:"none",color:t,backgroundColor:"white"},"&:active":{color:e},"&[disabled]":{backgroundColor:"white",color:t}}),z=(e,t)=>({backgroundColor:e,color:"white","&:not([disabled]):hover, &:not([disabled]):focus":{backgroundColor:t},"&:active":{backgroundColor:e},"&[disabled]":{backgroundColor:"$tonal300",color:"$tonal600"}}),j=f("button",{background:"unset",border:"none",borderRadius:"$0",cursor:"pointer",display:"flex",justifyContent:"center",alignItems:"center",fontFamily:"$sans",fontSize:"$md",fontWeight:500,height:"$2",letterSpacing:"0.02em",lineHeight:1.4,transition:"all 125ms ease-out",textDecoration:"none",px:"$4",py:"$2",whiteSpace:"nowrap",width:"max-content","&[disabled]":{opacity:.35,cursor:"not-allowed"},variants:{theme:{primary:{},secondary:{},tertiary:{},success:{},warning:{},danger:{}},appearance:{solid:{},outline:{}},isLoading:{true:{cursor:"not-allowed",opacity:.5}},fullWidth:{true:{width:"100%"}}},compoundVariants:[{theme:"primary",appearance:"solid",css:z("$primary500","$primary900")},{theme:"secondary",appearance:"solid",css:z("$secondary500","$secondary700")},{theme:"tertiary",appearance:"solid",css:z("$tertiary500","$tertiary700")},{theme:"success",appearance:"solid",css:z("$success","$successDark")},{theme:"warning",appearance:"solid",css:z("$warning","$warningDark")},{theme:"danger",appearance:"solid",css:z("$danger","$dangerDark")},{theme:"primary",appearance:"outline",css:E("$primary500","$primary900")},{theme:"secondary",appearance:"outline",css:E("$secondary500","$secondary900")},{theme:"tertiary",appearance:"outline",css:E("$tertiary500","$tertiary700")}]}),S=({theme:e="primary",appearance:t="solid",isLoading:o,type:a="button",children:n,onClick:i,...s})=>r.createElement(j,Object.assign({theme:e,appearance:t,isLoading:o\|\|!1,onClick:i?()=>{return e=i,void(o\|\|e());var e}:void 0,type:a},s),"boolean"==typeof o?r.createElement(r.Fragment,null,r.createElement(C,{css:{opacity:o?1:0,position:"absolute",transition:"opacity 150ms ease-out"}}),r.createElement(v,{as:"span",css:o?{opacity:0,transition:"opacity 150ms ease-out"}:{}},n)):n);S.displayName="Button";const O=f(a.Root,{appearance:"none",backgroundColor:"transparent",border:"none",borderRadius:"$0",boxShadow:"inset 0 0 0 2px $colors$secondary300",color:"white",cursor:"pointer",height:"$0",width:"$0",padding:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"all 100ms ease-out",'&[data-state="unchecked"]:focus, &[data-state="unchecked"]:hover':{backgroundColor:"$tonal300",boxShadow:"inset 0 0 0 2px $colors$secondary700",outline:"none"},'&[data-state="checked"]':{backgroundColor:"$secondary300"},'&[data-state="checked"]:hover, &[data-state="unchecked"]:focus':{backgroundColor:"$secondary700",boxShadow:"inset 0 0 0 2px $colors$secondary700",outline:"none"},"&:focus-within":{outline:"none"}}),_=e=>r.createElement(O,Object.assign({},e),r.createElement(a.Indicator,{as:n.CheckIcon}));_.displayName="Checkbox";const R=f("div",{display:"grid"});R.displayName="Grid";const L=e=>({"&::before":{content:"''",marginBottom:e,display:"table"},"&::after":{content:"''",marginTop:e,display:"table"}}),N=f("h1",{color:"$tonal-900",fontFamily:"$sans",fontWeight:700,margin:0,variants:{size:{xs:{fontSize:"$md",lineHeight:1.625,...L("-0.4489em")},sm:{fontSize:"$lg",lineHeight:1.52,...L("-0.3983em")},md:{fontSize:"$xl",lineHeight:1.42,...L("-0.3506em")},lg:{fontSize:"$xxl",lineHeight:1.35,...L("-0.312em")}}}}),I=({as:e="h2",size:t="md",...o})=>r.createElement(N,Object.assign({as:e,size:t},o));I.displayName="Heading";const W=f("svg",{color:"currentcolor",display:"inline-block",verticalAlign:"middle",variants:{size:{sm:{height:16,width:16},md:{height:24,width:24},lg:{height:32,width:32}}}}),F=({is:e,size:t="sm",...o})=>r.createElement(W,Object.assign({size:t,viewBox:"0 0 24 24","aria-hidden":"true"},o,{as:e}));function B(){return(B=Object.assign\|\|function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o])}return e}).apply(this,arguments)}var P=r.createElement("path",{d:"M20 6L9 17l-5-5"});function H(){return(H=Object.assign\|\|function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o])}return e}).apply(this,arguments)}var T=r.createElement("path",{d:"M17.94 17.94A10.07 10.07 0 0112 20c-7 0-11-8-11-8a18.45 18.45 0 015.06-5.94M9.9 4.24A9.12 9.12 0 0112 4c7 0 11 8 11 8a18.5 18.5 0 01-2.16 3.19m-6.72-1.07a3 3 0 11-4.24-4.24M1 1l22 22"});function q(e){return r.createElement("svg",H({xmlns:"http://www.w3.org/2000/svg",width:24,height:24,fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,className:"eye_svg__feather eye_svg__feather-eye-off"},e),T)}function M(){return(M=Object.assign\|\|function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o])}return e}).apply(this,arguments)}var D=r.createElement("path",{d:"M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"}),A=r.createElement("circle",{cx:12,cy:12,r:3});function V(e){return r.createElement("svg",M({xmlns:"http://www.w3.org/2000/svg",width:24,height:24,fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,className:"eye-off_svg__feather eye-off_svg__feather-eye"},e),D,A)}function G(){return(G=Object.assign\|\|function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o])}return e}).apply(this,arguments)}var U=r.createElement("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6"});function K(){return(K=Object.assign\|\|function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o])}return e}).apply(this,arguments)}var X=r.createElement("path",{d:"M18 6L6 18M6 6l12 12"});const J=f("img",{verticalAlign:"middle",maxWidth:"100%","&[width]":{width:"auto"},"&[width][height]":{height:"auto"},'&[src$=".svg"]':{width:"100%",height:"auto",maxWidth:"none"}});J.displayName="Image";const Q=f("input",{appearance:"none",border:"1px solid $tonal500",borderRadius:"$0",boxShadow:"none",boxSizing:"border-box",color:"$tonal900",cursor:"text",display:"block",fontFamily:"$sans",fontSize:"$md",height:"$2",width:"100%",p:"$3",transition:"all 100ms ease-out","&:focus":{borderColor:"$primary900",boxShadow:"inset 0 0 0 1px $colors$primary900",outline:"none"},"&[disabled]":{backgroundColor:"$tonal300",color:"$tonal700",cursor:"not-allowed"},variants:{state:{error:{border:"1px solid $danger"}}}}),Y=r.forwardRef((({type:e="text",...t},o)=>"number"===e?r.createElement(Q,Object.assign({type:"text",inputMode:"numeric",pattern:"[0-9]",ref:o},t)):r.createElement(Q,Object.assign({type:e},t,{ref:o}))));Y.displayName="Input";const Z=({applyCapsize:e=!0}={})=>({sm:{fontSize:"$sm",lineHeight:1.53},md:{fontSize:"$md",lineHeight:1.625,...e?L("-0.4489em"):{}},lg:{fontSize:"$lg",lineHeight:1.52,...e?L("-0.3983em"):{}}}),ee=f("p",{color:"$tonal900",fontFamily:"$sans",fontWeight:400,margin:0,maxWidth:"60ch",variants:{size:Z()}}),te=({as:e="p",size:t="md",...o})=>r.createElement(ee,Object.assign({as:e,size:t},o));te.displayName="Text";const{sm:re,md:oe}=Z(),ae=f("label",{color:"$secondary300",display:"block",fontFamily:"$sans",fontWeight:500,margin:0,variants:{size:{sm:re,md:oe}}}),ne=f("span",{color:"$danger",ml:"$1"}),ie=({size:e="md",children:t,required:o,...a})=>r.createElement(ae,Object.assign({size:e},a),t,o&&r.createElement(ne,null,""));ie.displayName="Label";const se=({css:e,...t})=>r.createElement(te,Object.assign({css:{color:"$danger",...e},size:"sm"},t)),le=({css:e,label:t,name:o,error:a,required:n=!1,register:i=null,validation:s,...l})=>{let c;return i&&s?c=i(s):i&&(c=i),r.createElement(v,{css:e},r.createElement(ie,{css:{mb:"$2"},htmlFor:o,required:n},t),r.createElement(Y,Object.assign({id:o,name:o,ref:c},a&&{state:"error"},l)),a&&r.createElement(se,{css:{mt:"$1"}},a))};le.displayName="InputField";const ce=f("a",{color:"$primary500",fontFamily:"$sans",textDecoration:"none",cursor:"pointer","&:focus, &:hover":{color:"$primary900",textDecoration:"underline"},"&:active, &:visited":{color:"$primary500"},variants:{size:Z({applyCapsize:!1})}}),de=r.forwardRef((({size:e="md",...t},o)=>r.createElement(ce,Object.assign({size:e},t,{ref:o}))));de.displayName="Link";const pe=f("li",{}),me=f("ul",{fontFamily:"$sans",pl:"$3",[`& ${pe}`]:{pl:"$2","&::marker":{content:'"•"',fontWeight:"bold"},"&:not(:last-child)":{mb:"$2"}},variants:{theme:{tonal:{[`& ${pe}`]:{"&::marker":{color:"$tonal900"}}},primary:{[`& ${pe}`]:{"&::marker":{color:"$primary500"}}},secondary:{[`& ${pe}`]:{"&::marker":{color:"$secondary500"}}}},size:Z()}}),he=({theme:e="tonal",size:t="md",...o})=>r.createElement(me,Object.assign({theme:e,size:t},o));he.Item=pe;const ue=({css:e={},error:t="",label:o="Password",name:a="password",hidePasswordText:n="Hide password",showPasswordText:i="Show password",prompt:s,required:l=!1,register:c,validation:d,...p})=>{const[m,h]=r.useState(!1);let u;return c&&d?u=c(d):c&&(u=c),r.createElement(v,{css:{position:"relative",...e}},r.createElement(w,{css:{justifyContent:"space-between",alignItems:"center",mb:"$2"}},r.createElement(ie,{htmlFor:a,required:l},o),s&&r.createElement(de,{href:s.link,size:"sm"},s.label)),r.createElement(v,{css:{position:"relative"}},r.createElement(Y,Object.assign({type:m?"text":"password",css:{pr:"$sizes$2"},autoComplete:"current-password",name:a,id:a,required:l,ref:u},p)),r.createElement(ge,{"aria-label":m?n:i,onClick:()=>h((e=>!e)),onMouseDown:e=>e.preventDefault(),type:"button"},r.createElement(F,{css:{color:"$tonal700"},is:m?q:V}))),t&&r.createElement(se,{css:{mt:"$2"}},t))};ue.displayName="PasswordField";const ge=f("button",{border:"none",padding:0,background:"none",cursor:"pointer",position:"absolute",bottom:0,right:0,size:"$2"}),be=e=>({"&::after":{borderStyle:"solid",borderColor:"transparent",content:"''",height:0,pointerEvents:"none",position:"absolute",top:"100%",width:0,borderTopColor:"white",borderWidth:8,ml:-8,...e},"&::before":{borderStyle:"solid",borderColor:"transparent",content:"''",height:0,pointerEvents:"none",position:"absolute",top:"100%",width:0,borderTopColor:"$tonal400",borderWidth:9,ml:-9,...e}}),ye=f("span",{position:"relative"}),$e=f("div",{boxShadow:"$0",borderRadius:"$1",backgroundColor:"white",border:"1px solid $tonal400",bottom:"calc(100% + $3)",listStyleType:"none",minWidth:140,maxWidth:354,p:"$3",position:"absolute",transition:"all 150ms ease-in-out",width:"max-content",opacity:0,visibility:"hidden",variants:{align:{left:{...be({left:40}),left:0,transformOrigin:"60px bottom",transform:"translate(-20px, $2) scale(0.9)"},center:{...be({left:"50%"}),transformOrigin:"center bottom",transform:"translate(-50%, $2) scale(0.9)"},right:{...be({right:31}),right:0,transformOrigin:"calc(100% - 51px) bottom",transform:"translate(0, $2) scale(0.9)"}},visibility:{true:{opacity:1,visibility:"visible"}}}}),fe=({id:e,children:t,content:o,align:a="center",defaultOpen:n=!1,...i})=>{const s=r.useRef(null),[l,c]=r.useState(n),d=`popover-trigger-${e\|\|Math.random().toString(36).substr(2,9)}`,p=()=>{c(!l)},m=e=>{void 0===e.keyCode\|\|32!==e.keyCode&&13!==e.keyCode\|\|c(!l)},h=r.forwardRef(((e,t)=>r.createElement("span",Object.assign({id:d,"aria-expanded":l,role:"button",tabIndex:0,"aria-label":"popover trigger",onClick:p,onKeyPress:m,ref:t},e))));return r.createElement(ye,Object.assign({},i),r.createElement(h,{ref:s},t),r.createElement($e,{role:"tooltip",align:a,"aria-labelledby":d,"aria-hidden":!l,visibility:l},o))};fe.displayName="Popover";const xe=e=>({background:"$tonal300",color:e}),ve=e=>({border:"1px solid $tonal400",background:"white",color:e}),we=f(i.Root,{borderRadius:25,height:12,position:"relative",overflow:"hidden",width:"100%",variants:{appearance:{outline:{},solid:{}},theme:{primary:{},secondary:{},tertiary:{},success:{},warning:{},danger:{}}},compoundVariants:[{theme:"primary",appearance:"solid",css:xe("$primary500")},{theme:"secondary",appearance:"solid",css:xe("$secondary500")},{theme:"tertiary",appearance:"solid",css:xe("$tertiary500")},{theme:"success",appearance:"solid",css:xe("$success")},{theme:"warning",appearance:"solid",css:xe("$warning")},{theme:"danger",appearance:"solid",css:xe("$danger")},{theme:"primary",appearance:"outline",css:ve("$primary500")},{theme:"secondary",appearance:"outline",css:ve("$secondary500")},{theme:"tertiary",appearance:"outline",css:ve("$tertiary500")},{theme:"success",appearance:"outline",css:ve("$success")},{theme:"warning",appearance:"outline",css:ve("$warning")},{theme:"danger",appearance:"outline",css:ve("$danger")}]}),ke=f(i.Indicator,{boxSizing:"border-box",position:"absolute",backgroundColor:"currentcolor",height:"100%"}),Ce=({value:e,appearance:t="outline",theme:o="primary",...a})=>r.createElement(we,Object.assign({appearance:t,theme:o},a),r.createElement(ke,{style:{width:`${e}%`}}));Ce.displayName="ProgressBar";const Ee=f(s.Item,{appearance:"none",backgroundColor:"transparent",padding:0,borderRadius:"50%",borderColor:"$secondary300",borderWidth:2,borderStyle:"solid",width:"$0",height:"$0",display:"inline-flex",alignItems:"center",justifyContent:"center",verticalAlign:"middle","&:focus":{outline:"none"},":checked + &":{backgroundColor:"$secondary300"},"[disabled] + &":{backgroundColor:"$tonal600",border:"2px solid $tonal600"}}),ze=f(s.Indicator,{width:8,height:8,borderRadius:"50%",backgroundColor:"white"}),je=e=>r.createElement(Ee,Object.assign({},e),r.createElement(ze,null));je.displayName="RadioButton";const Se=f(s.Root,{}),Oe=e=>r.createElement(Se,Object.assign({},e));Oe.displayName="RadioButtonGroup";const _e=f("select",{appearance:"none",backgroundColor:"white",backgroundImage:`url(data:image/svg+xml;charset=US-ASCII,${encodeURIComponent('<svg xmlns="http://www.w3.org/2000/svg" width="292.4" height="292.4"><path fill="#1066b2" d="M287 69a18 18 0 00-13-5H18c-5 0-9 2-12 5a18 18 0 00-6 13c0 5 2 10 5 13l128 128c4 4 8 5 13 5s9-1 13-5L287 95c4-3 5-8 5-13s-2-9-5-13z"/></svg>')})`,backgroundPosition:"right 16px top 50%, 0 0",backgroundRepeat:"no-repeat, repeat",backgroundSize:"0.65em auto, 100%",borderRadius:"$0",border:"1px solid $tonal500",display:"block",fontFamily:"$sans",fontSize:"$md",fontWeight:400,height:"$2",letterSpacing:"0.01em",lineHeight:"1.4",px:"$3",py:"$2",transition:"all 75ms ease-out",width:"100%","&:hover":{cursor:"pointer"},"&:focus":{boxShadow:"inset 0 0 0 1px $colors$primary900",borderColor:"$primary900",outline:"none"},"&::-ms-expand":{display:"none"},"&[disabled], > option[disabled]":{opacity:"0.7",backgroundColor:"$tonal300",cursor:"not-allowed"}}),Re=({options:e,defaultOption:t,...o})=>r.createElement(_e,Object.assign({},o),t&&r.createElement("option",null," ",t),e&&e.map((e=>r.createElement("option",{key:e.value,value:e.value,disabled:e.disabled},e.label))));Re.displayName="Select";const Le=f("textarea",{appearance:"none",border:"1px solid $tonal500",borderRadius:"$0",boxShadow:"none",color:"$tonal900",fontFamily:"$sans",fontSize:"$md",fontWeight:400,letterSpacing:"0.01em",lineHeight:1.4,minHeight:100,px:"$3",py:"$2",resize:"vertical",transition:"all 75ms ease-out",width:"100%","&:focus":{borderColor:"$primary900",boxShadow:"inset 0 0 0 1px $colors$primary900",outline:"none"},"&[disabled]":{opacity:.7,backgroundColor:"$tonal300"}});Le.displayName="Textarea";const Ne=f(p.default,{}),Ie=({externalId:e,ratio:t=9/16,...o})=>r.createElement(v,{css:{position:"relative",paddingTop:100*t+"%",overflow:"hidden",height:0,width:"100%"}},r.createElement(Ne,Object.assign({role:"figure",url:`https://player.vimeo.com/video/${e}`},o,{height:"100%",width:"100%",css:{position:"absolute",top:0,left:0}})));Ie.displayName="Video",exports.Box=v,exports.Button=S,exports.Check=function(e){return r.createElement("svg",B({xmlns:"http://www.w3.org/2000/svg",width:24,height:24,fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",className:"check_svg__feather check_svg__feather-check"},e),P)},exports.Checkbox=_,exports.Flex=w,exports.Grid=R,exports.Heading=I,exports.Home=function(e){return r.createElement("svg",G({className:"home_svg__w-6 home_svg__h-6",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg"},e),U)},exports.Icon=F,exports.Image=J,exports.Input=Y,exports.InputField=le,exports.Label=ie,exports.Link=de,exports.List=he,exports.Loader=C,exports.PasswordField=ue,exports.Popover=fe,exports.ProgressBar=Ce,exports.RadioButton=je,exports.RadioButtonGroup=Oe,exports.Select=Re,exports.Text=te,exports.Textarea=Le,exports.ValidationError=se,exports.Video=Ie,exports.X=function(e){return r.createElement("svg",K({xmlns:"http://www.w3.org/2000/svg",width:24,height:24,fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",className:"x_svg__feather x_svg__feather-x"},e),X)},exports.conditions=h,exports.css=g,exports.getCssString=b,exports.globalCss=y,exports.keyframes=$,exports.styled=f,exports.theme=x,exports.utils=m;
		"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@atom-learning/theme"),t=require("@stitches/react"),r=require("react"),o=require("@radix-ui/react-visually-hidden"),a=require("@radix-ui/react-checkbox"),n=require("@radix-ui/react-icons"),i=require("react-hook-form"),s=require("@radix-ui/react-progress"),l=require("@radix-ui/react-radio-group"),c=require("react-player/vimeo");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=d(e),m=d(c);const h={p:()=>e=>({padding:e}),pt:()=>e=>({paddingTop:e}),pr:()=>e=>({paddingRight:e}),pb:()=>e=>({paddingBottom:e}),pl:()=>e=>({paddingLeft:e}),px:()=>e=>({paddingLeft:e,paddingRight:e}),py:()=>e=>({paddingTop:e,paddingBottom:e}),m:()=>e=>({margin:e}),mt:()=>e=>({marginTop:e}),mr:()=>e=>({marginRight:e}),mb:()=>e=>({marginBottom:e}),ml:()=>e=>({marginLeft:e}),mx:()=>e=>({marginLeft:e,marginRight:e}),my:()=>e=>({marginTop:e,marginBottom:e}),bg:()=>e=>({background:e}),size:()=>e=>{if(Array.isArray(e)){const[t,r]=e;return{height:t,width:r}}return{height:e,width:e}}},u={sm:"@media (min-width: 550px)",md:"@media (min-width: 800px)",lg:"@media (min-width: 1100px)",xl:"@media (min-width: 1350px)",motion:"@media (prefers-reduced-motion)",hover:"@media (hover: hover)"},g=t.createCss({theme:p.default,utils:h,conditions:u}),{css:b,getCssString:y,global:f,keyframes:$,styled:x,theme:v}=g,w=x("div",{});w.displayName="Box";const k=x("div",{display:"flex"});k.displayName="Flex";const E=x("div",{animationName:`${$({"0%":{opacity:0},"30%":{opacity:1},"50%":{opacity:1},"80%":{opacity:0},"100%":{opacity:0}})}`,animationDuration:"1s",animationFillMode:"both",animationIterationCount:"infinite",animationTimingFunction:"linear",backgroundColor:"currentColor",borderRadius:"100%","&:nth-child(1)":{animationDelay:"-300ms"},"&:nth-child(2)":{animationDelay:"-150ms"},"&:nth-child(3)":{animationDelay:0},variants:{size:{sm:{size:"4px",mx:"2px"},md:{size:"6px",mx:"2px"},lg:{size:"8px",mx:"3px"}}}}),C=({css:e={},message:t="Loading",size:a="md"})=>r.createElement(k,{css:{justifyContent:"center",...e},role:"alert"},r.createElement(o.Root,null,t),r.createElement(E,{size:a}),r.createElement(E,{size:a}),r.createElement(E,{size:a})),z=(e,t)=>({boxShadow:"inset 0 0 0 2px",color:e,backgroundColor:"white","&:not([disabled]):hover, &:not([disabled]):focus":{textDecoration:"none",color:t,backgroundColor:"white"},"&:active":{color:e},"&[disabled]":{backgroundColor:"white",color:t}}),S=(e,t)=>({backgroundColor:e,color:"white","&:not([disabled]):hover, &:not([disabled]):focus":{backgroundColor:t},"&:active":{backgroundColor:e},"&[disabled]":{backgroundColor:"$tonal300",color:"$tonal600"}}),j=x("button",{background:"unset",border:"none",borderRadius:"$0",cursor:"pointer",display:"flex",justifyContent:"center",alignItems:"center",fontFamily:"$sans",fontSize:"$md",fontWeight:500,height:"$2",letterSpacing:"0.02em",lineHeight:1.4,transition:"all 125ms ease-out",textDecoration:"none",px:"$4",py:"$2",whiteSpace:"nowrap",width:"max-content","&[disabled]":{opacity:.35,cursor:"not-allowed"},variants:{theme:{primary:{},secondary:{},tertiary:{},success:{},warning:{},danger:{}},appearance:{solid:{},outline:{}},isLoading:{true:{cursor:"not-allowed",opacity:.5}},fullWidth:{true:{width:"100%"}}},compoundVariants:[{theme:"primary",appearance:"solid",css:S("$primary500","$primary900")},{theme:"secondary",appearance:"solid",css:S("$secondary500","$secondary700")},{theme:"tertiary",appearance:"solid",css:S("$tertiary500","$tertiary700")},{theme:"success",appearance:"solid",css:S("$success","$successDark")},{theme:"warning",appearance:"solid",css:S("$warning","$warningDark")},{theme:"danger",appearance:"solid",css:S("$danger","$dangerDark")},{theme:"primary",appearance:"outline",css:z("$primary500","$primary900")},{theme:"secondary",appearance:"outline",css:z("$secondary500","$secondary900")},{theme:"tertiary",appearance:"outline",css:z("$tertiary500","$tertiary700")}]}),O=({theme:e="primary",appearance:t="solid",isLoading:o,type:a="button",children:n,onClick:i,...s})=>r.createElement(j,Object.assign({theme:e,appearance:t,isLoading:o\|\|!1,onClick:i?()=>{return e=i,void(o\|\|e());var e}:void 0,type:a},s),"boolean"==typeof o?r.createElement(r.Fragment,null,r.createElement(C,{css:{opacity:o?1:0,position:"absolute",transition:"opacity 150ms ease-out"}}),r.createElement(w,{as:"span",css:o?{opacity:0,transition:"opacity 150ms ease-out"}:{}},n)):n);O.displayName="Button";const _=x(a.Root,{appearance:"none",backgroundColor:"transparent",border:"none",borderRadius:"$0",boxShadow:"inset 0 0 0 2px $colors$secondary300",color:"white",cursor:"pointer",height:"$0",width:"$0",padding:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"all 100ms ease-out",'&[data-state="unchecked"]:focus, &[data-state="unchecked"]:hover':{backgroundColor:"$tonal300",boxShadow:"inset 0 0 0 2px $colors$secondary700",outline:"none"},'&[data-state="checked"]':{backgroundColor:"$secondary300"},'&[data-state="checked"]:hover, &[data-state="unchecked"]:focus':{backgroundColor:"$secondary700",boxShadow:"inset 0 0 0 2px $colors$secondary700",outline:"none"},"&:focus-within":{outline:"none"}}),R=e=>r.createElement(_,Object.assign({},e),r.createElement(a.Indicator,{as:n.CheckIcon}));R.displayName="Checkbox";const L=x("form",{}),N=({children:e,defaultValues:t={},onSubmit:o,validationMode:a="onBlur",...n})=>{const{errors:s,handleSubmit:l,register:c}=i.useForm({defaultValues:t,mode:a});return r.createElement(L,Object.assign({"aria-label":"form"},n,{onSubmit:l(o)}),r.Children.map(e,(e=>{const{validation:t,...o}=e.props;if(!o.name)return e;const a=s[o.name];return r.createElement(e.type,{...o,error:a?a.message:void 0,register:c,key:o.name,required:t?!!t.required:!!o.required,validation:t})})))};N.displayName="Form";const I=x("div",{display:"grid"});I.displayName="Grid";const F=e=>({"&::before":{content:"''",marginBottom:e,display:"table"},"&::after":{content:"''",marginTop:e,display:"table"}}),W=x("h1",{color:"$tonal-900",fontFamily:"$sans",fontWeight:700,margin:0,variants:{size:{xs:{fontSize:"$md",lineHeight:1.625,...F("-0.4489em")},sm:{fontSize:"$lg",lineHeight:1.52,...F("-0.3983em")},md:{fontSize:"$xl",lineHeight:1.42,...F("-0.3506em")},lg:{fontSize:"$xxl",lineHeight:1.35,...F("-0.312em")}}}}),q=({as:e="h2",size:t="md",...o})=>r.createElement(W,Object.assign({as:e,size:t},o));q.displayName="Heading";const B=x("svg",{color:"currentcolor",display:"inline-block",verticalAlign:"middle",variants:{size:{sm:{height:16,width:16},md:{height:24,width:24},lg:{height:32,width:32}}}}),P=({is:e,size:t="sm",...o})=>r.createElement(B,Object.assign({size:t,viewBox:"0 0 24 24","aria-hidden":"true"},o,{as:e}));function H(){return(H=Object.assign\|\|function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o])}return e}).apply(this,arguments)}var M=r.createElement("path",{d:"M20 6L9 17l-5-5"});function T(){return(T=Object.assign\|\|function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o])}return e}).apply(this,arguments)}var D=r.createElement("path",{d:"M17.94 17.94A10.07 10.07 0 0112 20c-7 0-11-8-11-8a18.45 18.45 0 015.06-5.94M9.9 4.24A9.12 9.12 0 0112 4c7 0 11 8 11 8a18.5 18.5 0 01-2.16 3.19m-6.72-1.07a3 3 0 11-4.24-4.24M1 1l22 22"});function A(e){return r.createElement("svg",T({xmlns:"http://www.w3.org/2000/svg",width:24,height:24,fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,className:"eye_svg__feather eye_svg__feather-eye-off"},e),D)}function V(){return(V=Object.assign\|\|function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o])}return e}).apply(this,arguments)}var G=r.createElement("path",{d:"M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"}),U=r.createElement("circle",{cx:12,cy:12,r:3});function K(e){return r.createElement("svg",V({xmlns:"http://www.w3.org/2000/svg",width:24,height:24,fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,className:"eye-off_svg__feather eye-off_svg__feather-eye"},e),G,U)}function X(){return(X=Object.assign\|\|function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o])}return e}).apply(this,arguments)}var J=r.createElement("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6"});function Q(){return(Q=Object.assign\|\|function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o])}return e}).apply(this,arguments)}var Y=r.createElement("path",{d:"M18 6L6 18M6 6l12 12"});const Z=x("img",{verticalAlign:"middle",maxWidth:"100%","&[width]":{width:"auto"},"&[width][height]":{height:"auto"},'&[src$=".svg"]':{width:"100%",height:"auto",maxWidth:"none"}});Z.displayName="Image";const ee=x("input",{appearance:"none",border:"1px solid $tonal500",borderRadius:"$0",boxShadow:"none",boxSizing:"border-box",color:"$tonal900",cursor:"text",display:"block",fontFamily:"$sans",fontSize:"$md",height:"$2",width:"100%",p:"$3",transition:"all 100ms ease-out","&:focus":{borderColor:"$primary900",boxShadow:"inset 0 0 0 1px $colors$primary900",outline:"none"},"&[disabled]":{backgroundColor:"$tonal300",color:"$tonal700",cursor:"not-allowed"},variants:{state:{error:{border:"1px solid $danger"}}}}),te=r.forwardRef((({type:e="text",...t},o)=>"number"===e?r.createElement(ee,Object.assign({type:"text",inputMode:"numeric",pattern:"[0-9]",ref:o},t)):r.createElement(ee,Object.assign({type:e},t,{ref:o}))));te.displayName="Input";const re=({applyCapsize:e=!0}={})=>({sm:{fontSize:"$sm",lineHeight:1.53},md:{fontSize:"$md",lineHeight:1.625,...e?F("-0.4489em"):{}},lg:{fontSize:"$lg",lineHeight:1.52,...e?F("-0.3983em"):{}}}),oe=x("p",{color:"$tonal900",fontFamily:"$sans",fontWeight:400,margin:0,maxWidth:"60ch",variants:{size:re()}}),ae=({as:e="p",size:t="md",...o})=>r.createElement(oe,Object.assign({as:e,size:t},o));ae.displayName="Text";const{sm:ne,md:ie}=re(),se=x("label",{color:"$secondary300",display:"block",fontFamily:"$sans",fontWeight:500,margin:0,variants:{size:{sm:ne,md:ie}}}),le=x("span",{color:"$danger",ml:"$1"}),ce=({size:e="md",children:t,required:o,...a})=>r.createElement(se,Object.assign({size:e},a),t,o&&r.createElement(le,null,""));ce.displayName="Label";const de=({css:e,...t})=>r.createElement(ae,Object.assign({css:{color:"$danger",...e},size:"sm"},t)),pe=({css:e,label:t,name:o,error:a,required:n=!1,register:i=null,validation:s,...l})=>{let c;return i&&s?c=i(s):i&&(c=i),r.createElement(w,{css:e},r.createElement(ce,{css:{mb:"$2"},htmlFor:o,required:n},t),r.createElement(te,Object.assign({id:o,name:o,ref:c},a&&{state:"error"},l)),a&&r.createElement(de,{css:{mt:"$1"}},a))};pe.displayName="InputField";const me=x("a",{color:"$primary500",fontFamily:"$sans",textDecoration:"none",cursor:"pointer","&:focus, &:hover":{color:"$primary900",textDecoration:"underline"},"&:active, &:visited":{color:"$primary500"},variants:{size:re({applyCapsize:!1})}}),he=r.forwardRef((({size:e="md",...t},o)=>r.createElement(me,Object.assign({size:e},t,{ref:o}))));he.displayName="Link";const ue=x("li",{}),ge=x("ul",{fontFamily:"$sans",pl:"$3",[`& ${ue}`]:{pl:"$2","&::marker":{content:'"•"',fontWeight:"bold"},"&:not(:last-child)":{mb:"$2"}},variants:{theme:{tonal:{[`& ${ue}`]:{"&::marker":{color:"$tonal900"}}},primary:{[`& ${ue}`]:{"&::marker":{color:"$primary500"}}},secondary:{[`& ${ue}`]:{"&::marker":{color:"$secondary500"}}}},size:re()}}),be=({theme:e="tonal",size:t="md",...o})=>r.createElement(ge,Object.assign({theme:e,size:t},o));be.Item=ue;const ye=({css:e={},error:t="",label:o="Password",name:a="password",hidePasswordText:n="Hide password",showPasswordText:i="Show password",prompt:s,required:l=!1,register:c,validation:d,...p})=>{const[m,h]=r.useState(!1);let u;return c&&d?u=c(d):c&&(u=c),r.createElement(w,{css:{position:"relative",...e}},r.createElement(k,{css:{justifyContent:"space-between",alignItems:"center",mb:"$2"}},r.createElement(ce,{htmlFor:a,required:l},o),s&&r.createElement(he,{href:s.link,size:"sm"},s.label)),r.createElement(w,{css:{position:"relative"}},r.createElement(te,Object.assign({type:m?"text":"password",css:{pr:"$sizes$2"},autoComplete:"current-password",name:a,id:a,required:l,ref:u},p)),r.createElement(fe,{"aria-label":m?n:i,onClick:()=>h((e=>!e)),onMouseDown:e=>e.preventDefault(),type:"button"},r.createElement(P,{css:{color:"$tonal700"},is:m?A:K}))),t&&r.createElement(de,{css:{mt:"$2"}},t))};ye.displayName="PasswordField";const fe=x("button",{border:"none",padding:0,background:"none",cursor:"pointer",position:"absolute",bottom:0,right:0,size:"$2"}),$e=e=>({"&::after":{borderStyle:"solid",borderColor:"transparent",content:"''",height:0,pointerEvents:"none",position:"absolute",top:"100%",width:0,borderTopColor:"white",borderWidth:8,ml:-8,...e},"&::before":{borderStyle:"solid",borderColor:"transparent",content:"''",height:0,pointerEvents:"none",position:"absolute",top:"100%",width:0,borderTopColor:"$tonal400",borderWidth:9,ml:-9,...e}}),xe=x("span",{position:"relative"}),ve=x("div",{boxShadow:"$0",borderRadius:"$1",backgroundColor:"white",border:"1px solid $tonal400",bottom:"calc(100% + $3)",listStyleType:"none",minWidth:140,maxWidth:354,p:"$3",position:"absolute",transition:"all 150ms ease-in-out",width:"max-content",opacity:0,visibility:"hidden",variants:{align:{left:{...$e({left:40}),left:0,transformOrigin:"60px bottom",transform:"translate(-20px, $2) scale(0.9)"},center:{...$e({left:"50%"}),transformOrigin:"center bottom",transform:"translate(-50%, $2) scale(0.9)"},right:{...$e({right:31}),right:0,transformOrigin:"calc(100% - 51px) bottom",transform:"translate(0, $2) scale(0.9)"}},visibility:{true:{opacity:1,visibility:"visible"}}}}),we=({id:e,children:t,content:o,align:a="center",defaultOpen:n=!1,...i})=>{const s=r.useRef(null),[l,c]=r.useState(n),d=`popover-trigger-${e\|\|Math.random().toString(36).substr(2,9)}`,p=()=>{c(!l)},m=e=>{void 0===e.keyCode\|\|32!==e.keyCode&&13!==e.keyCode\|\|c(!l)},h=r.forwardRef(((e,t)=>r.createElement("span",Object.assign({id:d,"aria-expanded":l,role:"button",tabIndex:0,"aria-label":"popover trigger",onClick:p,onKeyPress:m,ref:t},e))));return r.createElement(xe,Object.assign({},i),r.createElement(h,{ref:s},t),r.createElement(ve,{role:"tooltip",align:a,"aria-labelledby":d,"aria-hidden":!l,visibility:l},o))};we.displayName="Popover";const ke=e=>({background:"$tonal300",color:e}),Ee=e=>({border:"1px solid $tonal400",background:"white",color:e}),Ce=x(s.Root,{borderRadius:25,height:12,position:"relative",overflow:"hidden",width:"100%",variants:{appearance:{outline:{},solid:{}},theme:{primary:{},secondary:{},tertiary:{},success:{},warning:{},danger:{}}},compoundVariants:[{theme:"primary",appearance:"solid",css:ke("$primary500")},{theme:"secondary",appearance:"solid",css:ke("$secondary500")},{theme:"tertiary",appearance:"solid",css:ke("$tertiary500")},{theme:"success",appearance:"solid",css:ke("$success")},{theme:"warning",appearance:"solid",css:ke("$warning")},{theme:"danger",appearance:"solid",css:ke("$danger")},{theme:"primary",appearance:"outline",css:Ee("$primary500")},{theme:"secondary",appearance:"outline",css:Ee("$secondary500")},{theme:"tertiary",appearance:"outline",css:Ee("$tertiary500")},{theme:"success",appearance:"outline",css:Ee("$success")},{theme:"warning",appearance:"outline",css:Ee("$warning")},{theme:"danger",appearance:"outline",css:Ee("$danger")}]}),ze=x(s.Indicator,{boxSizing:"border-box",position:"absolute",backgroundColor:"currentcolor",height:"100%"}),Se=({value:e,appearance:t="outline",theme:o="primary",...a})=>r.createElement(Ce,Object.assign({appearance:t,theme:o},a),r.createElement(ze,{style:{width:`${e}%`}}));Se.displayName="ProgressBar";const je=x(l.Item,{appearance:"none",backgroundColor:"transparent",padding:0,borderRadius:"50%",borderColor:"$secondary300",borderWidth:2,borderStyle:"solid",width:"$0",height:"$0",display:"inline-flex",alignItems:"center",justifyContent:"center",verticalAlign:"middle","&:focus":{outline:"none"},":checked + &":{backgroundColor:"$secondary300"},"[disabled] + &":{backgroundColor:"$tonal600",border:"2px solid $tonal600"}}),Oe=x(l.Indicator,{width:8,height:8,borderRadius:"50%",backgroundColor:"white"}),_e=e=>r.createElement(je,Object.assign({},e),r.createElement(Oe,null));_e.displayName="RadioButton";const Re=x(l.Root,{}),Le=e=>r.createElement(Re,Object.assign({},e));Le.displayName="RadioButtonGroup";const Ne=x("select",{appearance:"none",backgroundColor:"white",backgroundImage:`url(data:image/svg+xml;charset=US-ASCII,${encodeURIComponent('<svg xmlns="http://www.w3.org/2000/svg" width="292.4" height="292.4"><path fill="#1066b2" d="M287 69a18 18 0 00-13-5H18c-5 0-9 2-12 5a18 18 0 00-6 13c0 5 2 10 5 13l128 128c4 4 8 5 13 5s9-1 13-5L287 95c4-3 5-8 5-13s-2-9-5-13z"/></svg>')})`,backgroundPosition:"right 16px top 50%, 0 0",backgroundRepeat:"no-repeat, repeat",backgroundSize:"0.65em auto, 100%",borderRadius:"$0",border:"1px solid $tonal500",display:"block",fontFamily:"$sans",fontSize:"$md",fontWeight:400,height:"$2",letterSpacing:"0.01em",lineHeight:"1.4",px:"$3",py:"$2",transition:"all 75ms ease-out",width:"100%","&:hover":{cursor:"pointer"},"&:focus":{boxShadow:"inset 0 0 0 1px $colors$primary900",borderColor:"$primary900",outline:"none"},"&::-ms-expand":{display:"none"},"&[disabled], > option[disabled]":{opacity:"0.7",backgroundColor:"$tonal300",cursor:"not-allowed"}}),Ie=({options:e,defaultOption:t,...o})=>r.createElement(Ne,Object.assign({},o),t&&r.createElement("option",null," ",t),e&&e.map((e=>r.createElement("option",{key:e.value,value:e.value,disabled:e.disabled},e.label))));Ie.displayName="Select";const Fe=x("textarea",{appearance:"none",border:"1px solid $tonal500",borderRadius:"$0",boxShadow:"none",color:"$tonal900",fontFamily:"$sans",fontSize:"$md",fontWeight:400,letterSpacing:"0.01em",lineHeight:1.4,minHeight:100,px:"$3",py:"$2",resize:"vertical",transition:"all 75ms ease-out",width:"100%","&:focus":{borderColor:"$primary900",boxShadow:"inset 0 0 0 1px $colors$primary900",outline:"none"},"&[disabled]":{opacity:.7,backgroundColor:"$tonal300"}});Fe.displayName="Textarea";const We=x(m.default,{}),qe=({externalId:e,ratio:t=9/16,...o})=>r.createElement(w,{css:{position:"relative",paddingTop:100*t+"%",overflow:"hidden",height:0,width:"100%"}},r.createElement(We,Object.assign({role:"figure",url:`https://player.vimeo.com/video/${e}`},o,{height:"100%",width:"100%",css:{position:"absolute",top:0,left:0}})));qe.displayName="Video",exports.Box=w,exports.Button=O,exports.Check=function(e){return r.createElement("svg",H({xmlns:"http://www.w3.org/2000/svg",width:24,height:24,fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",className:"check_svg__feather check_svg__feather-check"},e),M)},exports.Checkbox=R,exports.Flex=k,exports.Form=N,exports.Grid=I,exports.Heading=q,exports.Home=function(e){return r.createElement("svg",X({className:"home_svg__w-6 home_svg__h-6",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg"},e),J)},exports.Icon=P,exports.Image=Z,exports.Input=te,exports.InputField=pe,exports.Label=ce,exports.Link=he,exports.List=be,exports.Loader=C,exports.PasswordField=ye,exports.Popover=we,exports.ProgressBar=Se,exports.RadioButton=_e,exports.RadioButtonGroup=Le,exports.Select=Ie,exports.Text=ae,exports.Textarea=Fe,exports.ValidationError=de,exports.Video=qe,exports.X=function(e){return r.createElement("svg",Q({xmlns:"http://www.w3.org/2000/svg",width:24,height:24,fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",className:"x_svg__feather x_svg__feather-x"},e),Y)},exports.conditions=u,exports.css=b,exports.getCssString=y,exports.globalCss=f,exports.keyframes=$,exports.styled=x,exports.theme=v,exports.utils=h;

dist/index.modern.js

		@@ -1,1 +0,1 @@
		import e from"@atom-learning/theme";import{createCss as o}from"@stitches/react";import{createElement as t,Fragment as a,forwardRef as r,useState as i,useRef as n}from"react";import{Root as s}from"@radix-ui/react-visually-hidden";import{Root as l,Indicator as d}from"@radix-ui/react-checkbox";import{CheckIcon as c}from"@radix-ui/react-icons";import{Root as p,Indicator as m}from"@radix-ui/react-progress";import{Item as h,Indicator as g,Root as u}from"@radix-ui/react-radio-group";import y from"react-player/vimeo";const b={p:()=>e=>({padding:e}),pt:()=>e=>({paddingTop:e}),pr:()=>e=>({paddingRight:e}),pb:()=>e=>({paddingBottom:e}),pl:()=>e=>({paddingLeft:e}),px:()=>e=>({paddingLeft:e,paddingRight:e}),py:()=>e=>({paddingTop:e,paddingBottom:e}),m:()=>e=>({margin:e}),mt:()=>e=>({marginTop:e}),mr:()=>e=>({marginRight:e}),mb:()=>e=>({marginBottom:e}),ml:()=>e=>({marginLeft:e}),mx:()=>e=>({marginLeft:e,marginRight:e}),my:()=>e=>({marginTop:e,marginBottom:e}),bg:()=>e=>({background:e}),size:()=>e=>{if(Array.isArray(e)){const[o,t]=e;return{height:o,width:t}}return{height:e,width:e}}},$={sm:"@media (min-width: 550px)",md:"@media (min-width: 800px)",lg:"@media (min-width: 1100px)",xl:"@media (min-width: 1350px)",motion:"@media (prefers-reduced-motion)",hover:"@media (hover: hover)"},f=o({theme:e,utils:b,conditions:$}),{css:v,getCssString:w,global:x,keyframes:k,styled:C,theme:z}=f,j=C("div",{});j.displayName="Box";const O=C("div",{display:"flex"});O.displayName="Flex";const S=C("div",{animationName:`${k({"0%":{opacity:0},"30%":{opacity:1},"50%":{opacity:1},"80%":{opacity:0},"100%":{opacity:0}})}`,animationDuration:"1s",animationFillMode:"both",animationIterationCount:"infinite",animationTimingFunction:"linear",backgroundColor:"currentColor",borderRadius:"100%","&:nth-child(1)":{animationDelay:"-300ms"},"&:nth-child(2)":{animationDelay:"-150ms"},"&:nth-child(3)":{animationDelay:0},variants:{size:{sm:{size:"4px",mx:"2px"},md:{size:"6px",mx:"2px"},lg:{size:"8px",mx:"3px"}}}}),_=({css:e={},message:o="Loading",size:a="md"})=>t(O,{css:{justifyContent:"center",...e},role:"alert"},t(s,null,o),t(S,{size:a}),t(S,{size:a}),t(S,{size:a})),N=(e,o)=>({boxShadow:"inset 0 0 0 2px",color:e,backgroundColor:"white","&:not([disabled]):hover, &:not([disabled]):focus":{textDecoration:"none",color:o,backgroundColor:"white"},"&:active":{color:e},"&[disabled]":{backgroundColor:"white",color:o}}),L=(e,o)=>({backgroundColor:e,color:"white","&:not([disabled]):hover, &:not([disabled]):focus":{backgroundColor:o},"&:active":{backgroundColor:e},"&[disabled]":{backgroundColor:"$tonal300",color:"$tonal600"}}),R=C("button",{background:"unset",border:"none",borderRadius:"$0",cursor:"pointer",display:"flex",justifyContent:"center",alignItems:"center",fontFamily:"$sans",fontSize:"$md",fontWeight:500,height:"$2",letterSpacing:"0.02em",lineHeight:1.4,transition:"all 125ms ease-out",textDecoration:"none",px:"$4",py:"$2",whiteSpace:"nowrap",width:"max-content","&[disabled]":{opacity:.35,cursor:"not-allowed"},variants:{theme:{primary:{},secondary:{},tertiary:{},success:{},warning:{},danger:{}},appearance:{solid:{},outline:{}},isLoading:{true:{cursor:"not-allowed",opacity:.5}},fullWidth:{true:{width:"100%"}}},compoundVariants:[{theme:"primary",appearance:"solid",css:L("$primary500","$primary900")},{theme:"secondary",appearance:"solid",css:L("$secondary500","$secondary700")},{theme:"tertiary",appearance:"solid",css:L("$tertiary500","$tertiary700")},{theme:"success",appearance:"solid",css:L("$success","$successDark")},{theme:"warning",appearance:"solid",css:L("$warning","$warningDark")},{theme:"danger",appearance:"solid",css:L("$danger","$dangerDark")},{theme:"primary",appearance:"outline",css:N("$primary500","$primary900")},{theme:"secondary",appearance:"outline",css:N("$secondary500","$secondary900")},{theme:"tertiary",appearance:"outline",css:N("$tertiary500","$tertiary700")}]}),W=({theme:e="primary",appearance:o="solid",isLoading:r,type:i="button",children:n,onClick:s,...l})=>t(R,Object.assign({theme:e,appearance:o,isLoading:r\|\|!1,onClick:s?()=>{return e=s,void(r\|\|e());var e}:void 0,type:i},l),"boolean"==typeof r?t(a,null,t(_,{css:{opacity:r?1:0,position:"absolute",transition:"opacity 150ms ease-out"}}),t(j,{as:"span",css:r?{opacity:0,transition:"opacity 150ms ease-out"}:{}},n)):n);W.displayName="Button";const I=C(l,{appearance:"none",backgroundColor:"transparent",border:"none",borderRadius:"$0",boxShadow:"inset 0 0 0 2px $colors$secondary300",color:"white",cursor:"pointer",height:"$0",width:"$0",padding:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"all 100ms ease-out",'&[data-state="unchecked"]:focus, &[data-state="unchecked"]:hover':{backgroundColor:"$tonal300",boxShadow:"inset 0 0 0 2px $colors$secondary700",outline:"none"},'&[data-state="checked"]':{backgroundColor:"$secondary300"},'&[data-state="checked"]:hover, &[data-state="unchecked"]:focus':{backgroundColor:"$secondary700",boxShadow:"inset 0 0 0 2px $colors$secondary700",outline:"none"},"&:focus-within":{outline:"none"}}),F=e=>t(I,Object.assign({},e),t(d,{as:c}));F.displayName="Checkbox";const H=C("div",{display:"grid"});H.displayName="Grid";const M=e=>({"&::before":{content:"''",marginBottom:e,display:"table"},"&::after":{content:"''",marginTop:e,display:"table"}}),T=C("h1",{color:"$tonal-900",fontFamily:"$sans",fontWeight:700,margin:0,variants:{size:{xs:{fontSize:"$md",lineHeight:1.625,...M("-0.4489em")},sm:{fontSize:"$lg",lineHeight:1.52,...M("-0.3983em")},md:{fontSize:"$xl",lineHeight:1.42,...M("-0.3506em")},lg:{fontSize:"$xxl",lineHeight:1.35,...M("-0.312em")}}}}),D=({as:e="h2",size:o="md",...a})=>t(T,Object.assign({as:e,size:o},a));D.displayName="Heading";const P=C("svg",{color:"currentcolor",display:"inline-block",verticalAlign:"middle",variants:{size:{sm:{height:16,width:16},md:{height:24,width:24},lg:{height:32,width:32}}}}),B=({is:e,size:o="sm",...a})=>t(P,Object.assign({size:o,viewBox:"0 0 24 24","aria-hidden":"true"},a,{as:e}));function A(){return(A=Object.assign\|\|function(e){for(var o=1;o<arguments.length;o++){var t=arguments[o];for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&(e[a]=t[a])}return e}).apply(this,arguments)}var q=t("path",{d:"M20 6L9 17l-5-5"});function V(e){return t("svg",A({xmlns:"http://www.w3.org/2000/svg",width:24,height:24,fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",className:"check_svg__feather check_svg__feather-check"},e),q)}function E(){return(E=Object.assign\|\|function(e){for(var o=1;o<arguments.length;o++){var t=arguments[o];for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&(e[a]=t[a])}return e}).apply(this,arguments)}var G=t("path",{d:"M17.94 17.94A10.07 10.07 0 0112 20c-7 0-11-8-11-8a18.45 18.45 0 015.06-5.94M9.9 4.24A9.12 9.12 0 0112 4c7 0 11 8 11 8a18.5 18.5 0 01-2.16 3.19m-6.72-1.07a3 3 0 11-4.24-4.24M1 1l22 22"});function U(e){return t("svg",E({xmlns:"http://www.w3.org/2000/svg",width:24,height:24,fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,className:"eye_svg__feather eye_svg__feather-eye-off"},e),G)}function K(){return(K=Object.assign\|\|function(e){for(var o=1;o<arguments.length;o++){var t=arguments[o];for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&(e[a]=t[a])}return e}).apply(this,arguments)}var X=t("path",{d:"M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"}),J=t("circle",{cx:12,cy:12,r:3});function Q(e){return t("svg",K({xmlns:"http://www.w3.org/2000/svg",width:24,height:24,fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,className:"eye-off_svg__feather eye-off_svg__feather-eye"},e),X,J)}function Y(){return(Y=Object.assign\|\|function(e){for(var o=1;o<arguments.length;o++){var t=arguments[o];for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&(e[a]=t[a])}return e}).apply(this,arguments)}var Z=t("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6"});function ee(e){return t("svg",Y({className:"home_svg__w-6 home_svg__h-6",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg"},e),Z)}function oe(){return(oe=Object.assign\|\|function(e){for(var o=1;o<arguments.length;o++){var t=arguments[o];for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&(e[a]=t[a])}return e}).apply(this,arguments)}var te=t("path",{d:"M18 6L6 18M6 6l12 12"});function ae(e){return t("svg",oe({xmlns:"http://www.w3.org/2000/svg",width:24,height:24,fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",className:"x_svg__feather x_svg__feather-x"},e),te)}const re=C("img",{verticalAlign:"middle",maxWidth:"100%","&[width]":{width:"auto"},"&[width][height]":{height:"auto"},'&[src$=".svg"]':{width:"100%",height:"auto",maxWidth:"none"}});re.displayName="Image";const ie=C("input",{appearance:"none",border:"1px solid $tonal500",borderRadius:"$0",boxShadow:"none",boxSizing:"border-box",color:"$tonal900",cursor:"text",display:"block",fontFamily:"$sans",fontSize:"$md",height:"$2",width:"100%",p:"$3",transition:"all 100ms ease-out","&:focus":{borderColor:"$primary900",boxShadow:"inset 0 0 0 1px $colors$primary900",outline:"none"},"&[disabled]":{backgroundColor:"$tonal300",color:"$tonal700",cursor:"not-allowed"},variants:{state:{error:{border:"1px solid $danger"}}}}),ne=r((({type:e="text",...o},a)=>t(ie,"number"===e?Object.assign({type:"text",inputMode:"numeric",pattern:"[0-9]",ref:a},o):Object.assign({type:e},o,{ref:a}))));ne.displayName="Input";const se=({applyCapsize:e=!0}={})=>({sm:{fontSize:"$sm",lineHeight:1.53},md:{fontSize:"$md",lineHeight:1.625,...e?M("-0.4489em"):{}},lg:{fontSize:"$lg",lineHeight:1.52,...e?M("-0.3983em"):{}}}),le=C("p",{color:"$tonal900",fontFamily:"$sans",fontWeight:400,margin:0,maxWidth:"60ch",variants:{size:se()}}),de=({as:e="p",size:o="md",...a})=>t(le,Object.assign({as:e,size:o},a));de.displayName="Text";const{sm:ce,md:pe}=se(),me=C("label",{color:"$secondary300",display:"block",fontFamily:"$sans",fontWeight:500,margin:0,variants:{size:{sm:ce,md:pe}}}),he=C("span",{color:"$danger",ml:"$1"}),ge=({size:e="md",children:o,required:a,...r})=>t(me,Object.assign({size:e},r),o,a&&t(he,null,""));ge.displayName="Label";const ue=({css:e,...o})=>t(de,Object.assign({css:{color:"$danger",...e},size:"sm"},o)),ye=({css:e,label:o,name:a,error:r,required:i=!1,register:n=null,validation:s,...l})=>{let d;return n&&s?d=n(s):n&&(d=n),t(j,{css:e},t(ge,{css:{mb:"$2"},htmlFor:a,required:i},o),t(ne,Object.assign({id:a,name:a,ref:d},r&&{state:"error"},l)),r&&t(ue,{css:{mt:"$1"}},r))};ye.displayName="InputField";const be=C("a",{color:"$primary500",fontFamily:"$sans",textDecoration:"none",cursor:"pointer","&:focus, &:hover":{color:"$primary900",textDecoration:"underline"},"&:active, &:visited":{color:"$primary500"},variants:{size:se({applyCapsize:!1})}}),$e=r((({size:e="md",...o},a)=>t(be,Object.assign({size:e},o,{ref:a}))));$e.displayName="Link";const fe=C("li",{}),ve=C("ul",{fontFamily:"$sans",pl:"$3",[`& ${fe}`]:{pl:"$2","&::marker":{content:'"•"',fontWeight:"bold"},"&:not(:last-child)":{mb:"$2"}},variants:{theme:{tonal:{[`& ${fe}`]:{"&::marker":{color:"$tonal900"}}},primary:{[`& ${fe}`]:{"&::marker":{color:"$primary500"}}},secondary:{[`& ${fe}`]:{"&::marker":{color:"$secondary500"}}}},size:se()}}),we=({theme:e="tonal",size:o="md",...a})=>t(ve,Object.assign({theme:e,size:o},a));we.Item=fe;const xe=({css:e={},error:o="",label:a="Password",name:r="password",hidePasswordText:n="Hide password",showPasswordText:s="Show password",prompt:l,required:d=!1,register:c,validation:p,...m})=>{const[h,g]=i(!1);let u;return c&&p?u=c(p):c&&(u=c),t(j,{css:{position:"relative",...e}},t(O,{css:{justifyContent:"space-between",alignItems:"center",mb:"$2"}},t(ge,{htmlFor:r,required:d},a),l&&t($e,{href:l.link,size:"sm"},l.label)),t(j,{css:{position:"relative"}},t(ne,Object.assign({type:h?"text":"password",css:{pr:"$sizes$2"},autoComplete:"current-password",name:r,id:r,required:d,ref:u},m)),t(ke,{"aria-label":h?n:s,onClick:()=>g((e=>!e)),onMouseDown:e=>e.preventDefault(),type:"button"},t(B,{css:{color:"$tonal700"},is:h?U:Q}))),o&&t(ue,{css:{mt:"$2"}},o))};xe.displayName="PasswordField";const ke=C("button",{border:"none",padding:0,background:"none",cursor:"pointer",position:"absolute",bottom:0,right:0,size:"$2"}),Ce=e=>({"&::after":{borderStyle:"solid",borderColor:"transparent",content:"''",height:0,pointerEvents:"none",position:"absolute",top:"100%",width:0,borderTopColor:"white",borderWidth:8,ml:-8,...e},"&::before":{borderStyle:"solid",borderColor:"transparent",content:"''",height:0,pointerEvents:"none",position:"absolute",top:"100%",width:0,borderTopColor:"$tonal400",borderWidth:9,ml:-9,...e}}),ze=C("span",{position:"relative"}),je=C("div",{boxShadow:"$0",borderRadius:"$1",backgroundColor:"white",border:"1px solid $tonal400",bottom:"calc(100% + $3)",listStyleType:"none",minWidth:140,maxWidth:354,p:"$3",position:"absolute",transition:"all 150ms ease-in-out",width:"max-content",opacity:0,visibility:"hidden",variants:{align:{left:{...Ce({left:40}),left:0,transformOrigin:"60px bottom",transform:"translate(-20px, $2) scale(0.9)"},center:{...Ce({left:"50%"}),transformOrigin:"center bottom",transform:"translate(-50%, $2) scale(0.9)"},right:{...Ce({right:31}),right:0,transformOrigin:"calc(100% - 51px) bottom",transform:"translate(0, $2) scale(0.9)"}},visibility:{true:{opacity:1,visibility:"visible"}}}}),Oe=({id:e,children:o,content:a,align:s="center",defaultOpen:l=!1,...d})=>{const c=n(null),[p,m]=i(l),h=`popover-trigger-${e\|\|Math.random().toString(36).substr(2,9)}`,g=()=>{m(!p)},u=e=>{void 0===e.keyCode\|\|32!==e.keyCode&&13!==e.keyCode\|\|m(!p)},y=r(((e,o)=>t("span",Object.assign({id:h,"aria-expanded":p,role:"button",tabIndex:0,"aria-label":"popover trigger",onClick:g,onKeyPress:u,ref:o},e))));return t(ze,Object.assign({},d),t(y,{ref:c},o),t(je,{role:"tooltip",align:s,"aria-labelledby":h,"aria-hidden":!p,visibility:p},a))};Oe.displayName="Popover";const Se=e=>({background:"$tonal300",color:e}),_e=e=>({border:"1px solid $tonal400",background:"white",color:e}),Ne=C(p,{borderRadius:25,height:12,position:"relative",overflow:"hidden",width:"100%",variants:{appearance:{outline:{},solid:{}},theme:{primary:{},secondary:{},tertiary:{},success:{},warning:{},danger:{}}},compoundVariants:[{theme:"primary",appearance:"solid",css:Se("$primary500")},{theme:"secondary",appearance:"solid",css:Se("$secondary500")},{theme:"tertiary",appearance:"solid",css:Se("$tertiary500")},{theme:"success",appearance:"solid",css:Se("$success")},{theme:"warning",appearance:"solid",css:Se("$warning")},{theme:"danger",appearance:"solid",css:Se("$danger")},{theme:"primary",appearance:"outline",css:_e("$primary500")},{theme:"secondary",appearance:"outline",css:_e("$secondary500")},{theme:"tertiary",appearance:"outline",css:_e("$tertiary500")},{theme:"success",appearance:"outline",css:_e("$success")},{theme:"warning",appearance:"outline",css:_e("$warning")},{theme:"danger",appearance:"outline",css:_e("$danger")}]}),Le=C(m,{boxSizing:"border-box",position:"absolute",backgroundColor:"currentcolor",height:"100%"}),Re=({value:e,appearance:o="outline",theme:a="primary",...r})=>t(Ne,Object.assign({appearance:o,theme:a},r),t(Le,{style:{width:`${e}%`}}));Re.displayName="ProgressBar";const We=C(h,{appearance:"none",backgroundColor:"transparent",padding:0,borderRadius:"50%",borderColor:"$secondary300",borderWidth:2,borderStyle:"solid",width:"$0",height:"$0",display:"inline-flex",alignItems:"center",justifyContent:"center",verticalAlign:"middle","&:focus":{outline:"none"},":checked + &":{backgroundColor:"$secondary300"},"[disabled] + &":{backgroundColor:"$tonal600",border:"2px solid $tonal600"}}),Ie=C(g,{width:8,height:8,borderRadius:"50%",backgroundColor:"white"}),Fe=e=>t(We,Object.assign({},e),t(Ie,null));Fe.displayName="RadioButton";const He=C(u,{}),Me=e=>t(He,Object.assign({},e));Me.displayName="RadioButtonGroup";const Te=C("select",{appearance:"none",backgroundColor:"white",backgroundImage:`url(data:image/svg+xml;charset=US-ASCII,${encodeURIComponent('<svg xmlns="http://www.w3.org/2000/svg" width="292.4" height="292.4"><path fill="#1066b2" d="M287 69a18 18 0 00-13-5H18c-5 0-9 2-12 5a18 18 0 00-6 13c0 5 2 10 5 13l128 128c4 4 8 5 13 5s9-1 13-5L287 95c4-3 5-8 5-13s-2-9-5-13z"/></svg>')})`,backgroundPosition:"right 16px top 50%, 0 0",backgroundRepeat:"no-repeat, repeat",backgroundSize:"0.65em auto, 100%",borderRadius:"$0",border:"1px solid $tonal500",display:"block",fontFamily:"$sans",fontSize:"$md",fontWeight:400,height:"$2",letterSpacing:"0.01em",lineHeight:"1.4",px:"$3",py:"$2",transition:"all 75ms ease-out",width:"100%","&:hover":{cursor:"pointer"},"&:focus":{boxShadow:"inset 0 0 0 1px $colors$primary900",borderColor:"$primary900",outline:"none"},"&::-ms-expand":{display:"none"},"&[disabled], > option[disabled]":{opacity:"0.7",backgroundColor:"$tonal300",cursor:"not-allowed"}}),De=({options:e,defaultOption:o,...a})=>t(Te,Object.assign({},a),o&&t("option",null," ",o),e&&e.map((e=>t("option",{key:e.value,value:e.value,disabled:e.disabled},e.label))));De.displayName="Select";const Pe=C("textarea",{appearance:"none",border:"1px solid $tonal500",borderRadius:"$0",boxShadow:"none",color:"$tonal900",fontFamily:"$sans",fontSize:"$md",fontWeight:400,letterSpacing:"0.01em",lineHeight:1.4,minHeight:100,px:"$3",py:"$2",resize:"vertical",transition:"all 75ms ease-out",width:"100%","&:focus":{borderColor:"$primary900",boxShadow:"inset 0 0 0 1px $colors$primary900",outline:"none"},"&[disabled]":{opacity:.7,backgroundColor:"$tonal300"}});Pe.displayName="Textarea";const Be=C(y,{}),Ae=({externalId:e,ratio:o=9/16,...a})=>t(j,{css:{position:"relative",paddingTop:100*o+"%",overflow:"hidden",height:0,width:"100%"}},t(Be,Object.assign({role:"figure",url:`https://player.vimeo.com/video/${e}`},a,{height:"100%",width:"100%",css:{position:"absolute",top:0,left:0}})));Ae.displayName="Video";export{j as Box,W as Button,V as Check,F as Checkbox,O as Flex,H as Grid,D as Heading,ee as Home,B as Icon,re as Image,ne as Input,ye as InputField,ge as Label,$e as Link,we as List,_ as Loader,xe as PasswordField,Oe as Popover,Re as ProgressBar,Fe as RadioButton,Me as RadioButtonGroup,De as Select,de as Text,Pe as Textarea,ue as ValidationError,Ae as Video,ae as X,$ as conditions,v as css,w as getCssString,x as globalCss,k as keyframes,C as styled,z as theme,b as utils};
		import e from"@atom-learning/theme";import{createCss as o}from"@stitches/react";import{createElement as t,Fragment as a,Children as r,forwardRef as i,useState as n,useRef as s}from"react";import{Root as l}from"@radix-ui/react-visually-hidden";import{Root as d,Indicator as c}from"@radix-ui/react-checkbox";import{CheckIcon as p}from"@radix-ui/react-icons";import{useForm as m}from"react-hook-form";import{Root as h,Indicator as g}from"@radix-ui/react-progress";import{Item as u,Indicator as b,Root as y}from"@radix-ui/react-radio-group";import $ from"react-player/vimeo";const f={p:()=>e=>({padding:e}),pt:()=>e=>({paddingTop:e}),pr:()=>e=>({paddingRight:e}),pb:()=>e=>({paddingBottom:e}),pl:()=>e=>({paddingLeft:e}),px:()=>e=>({paddingLeft:e,paddingRight:e}),py:()=>e=>({paddingTop:e,paddingBottom:e}),m:()=>e=>({margin:e}),mt:()=>e=>({marginTop:e}),mr:()=>e=>({marginRight:e}),mb:()=>e=>({marginBottom:e}),ml:()=>e=>({marginLeft:e}),mx:()=>e=>({marginLeft:e,marginRight:e}),my:()=>e=>({marginTop:e,marginBottom:e}),bg:()=>e=>({background:e}),size:()=>e=>{if(Array.isArray(e)){const[o,t]=e;return{height:o,width:t}}return{height:e,width:e}}},v={sm:"@media (min-width: 550px)",md:"@media (min-width: 800px)",lg:"@media (min-width: 1100px)",xl:"@media (min-width: 1350px)",motion:"@media (prefers-reduced-motion)",hover:"@media (hover: hover)"},w=o({theme:e,utils:f,conditions:v}),{css:x,getCssString:k,global:C,keyframes:z,styled:j,theme:O}=w,S=j("div",{});S.displayName="Box";const _=j("div",{display:"flex"});_.displayName="Flex";const N=j("div",{animationName:`${z({"0%":{opacity:0},"30%":{opacity:1},"50%":{opacity:1},"80%":{opacity:0},"100%":{opacity:0}})}`,animationDuration:"1s",animationFillMode:"both",animationIterationCount:"infinite",animationTimingFunction:"linear",backgroundColor:"currentColor",borderRadius:"100%","&:nth-child(1)":{animationDelay:"-300ms"},"&:nth-child(2)":{animationDelay:"-150ms"},"&:nth-child(3)":{animationDelay:0},variants:{size:{sm:{size:"4px",mx:"2px"},md:{size:"6px",mx:"2px"},lg:{size:"8px",mx:"3px"}}}}),L=({css:e={},message:o="Loading",size:a="md"})=>t(_,{css:{justifyContent:"center",...e},role:"alert"},t(l,null,o),t(N,{size:a}),t(N,{size:a}),t(N,{size:a})),R=(e,o)=>({boxShadow:"inset 0 0 0 2px",color:e,backgroundColor:"white","&:not([disabled]):hover, &:not([disabled]):focus":{textDecoration:"none",color:o,backgroundColor:"white"},"&:active":{color:e},"&[disabled]":{backgroundColor:"white",color:o}}),W=(e,o)=>({backgroundColor:e,color:"white","&:not([disabled]):hover, &:not([disabled]):focus":{backgroundColor:o},"&:active":{backgroundColor:e},"&[disabled]":{backgroundColor:"$tonal300",color:"$tonal600"}}),F=j("button",{background:"unset",border:"none",borderRadius:"$0",cursor:"pointer",display:"flex",justifyContent:"center",alignItems:"center",fontFamily:"$sans",fontSize:"$md",fontWeight:500,height:"$2",letterSpacing:"0.02em",lineHeight:1.4,transition:"all 125ms ease-out",textDecoration:"none",px:"$4",py:"$2",whiteSpace:"nowrap",width:"max-content","&[disabled]":{opacity:.35,cursor:"not-allowed"},variants:{theme:{primary:{},secondary:{},tertiary:{},success:{},warning:{},danger:{}},appearance:{solid:{},outline:{}},isLoading:{true:{cursor:"not-allowed",opacity:.5}},fullWidth:{true:{width:"100%"}}},compoundVariants:[{theme:"primary",appearance:"solid",css:W("$primary500","$primary900")},{theme:"secondary",appearance:"solid",css:W("$secondary500","$secondary700")},{theme:"tertiary",appearance:"solid",css:W("$tertiary500","$tertiary700")},{theme:"success",appearance:"solid",css:W("$success","$successDark")},{theme:"warning",appearance:"solid",css:W("$warning","$warningDark")},{theme:"danger",appearance:"solid",css:W("$danger","$dangerDark")},{theme:"primary",appearance:"outline",css:R("$primary500","$primary900")},{theme:"secondary",appearance:"outline",css:R("$secondary500","$secondary900")},{theme:"tertiary",appearance:"outline",css:R("$tertiary500","$tertiary700")}]}),I=({theme:e="primary",appearance:o="solid",isLoading:r,type:i="button",children:n,onClick:s,...l})=>t(F,Object.assign({theme:e,appearance:o,isLoading:r\|\|!1,onClick:s?()=>{return e=s,void(r\|\|e());var e}:void 0,type:i},l),"boolean"==typeof r?t(a,null,t(L,{css:{opacity:r?1:0,position:"absolute",transition:"opacity 150ms ease-out"}}),t(S,{as:"span",css:r?{opacity:0,transition:"opacity 150ms ease-out"}:{}},n)):n);I.displayName="Button";const H=j(d,{appearance:"none",backgroundColor:"transparent",border:"none",borderRadius:"$0",boxShadow:"inset 0 0 0 2px $colors$secondary300",color:"white",cursor:"pointer",height:"$0",width:"$0",padding:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"all 100ms ease-out",'&[data-state="unchecked"]:focus, &[data-state="unchecked"]:hover':{backgroundColor:"$tonal300",boxShadow:"inset 0 0 0 2px $colors$secondary700",outline:"none"},'&[data-state="checked"]':{backgroundColor:"$secondary300"},'&[data-state="checked"]:hover, &[data-state="unchecked"]:focus':{backgroundColor:"$secondary700",boxShadow:"inset 0 0 0 2px $colors$secondary700",outline:"none"},"&:focus-within":{outline:"none"}}),M=e=>t(H,Object.assign({},e),t(c,{as:p}));M.displayName="Checkbox";const T=j("form",{}),B=({children:e,defaultValues:o={},onSubmit:a,validationMode:i="onBlur",...n})=>{const{errors:s,handleSubmit:l,register:d}=m({defaultValues:o,mode:i});return t(T,Object.assign({"aria-label":"form"},n,{onSubmit:l(a)}),r.map(e,(e=>{const{validation:o,...a}=e.props;if(!a.name)return e;const r=s[a.name];return t(e.type,{...a,error:r?r.message:void 0,register:d,key:a.name,required:o?!!o.required:!!a.required,validation:o})})))};B.displayName="Form";const D=j("div",{display:"grid"});D.displayName="Grid";const P=e=>({"&::before":{content:"''",marginBottom:e,display:"table"},"&::after":{content:"''",marginTop:e,display:"table"}}),q=j("h1",{color:"$tonal-900",fontFamily:"$sans",fontWeight:700,margin:0,variants:{size:{xs:{fontSize:"$md",lineHeight:1.625,...P("-0.4489em")},sm:{fontSize:"$lg",lineHeight:1.52,...P("-0.3983em")},md:{fontSize:"$xl",lineHeight:1.42,...P("-0.3506em")},lg:{fontSize:"$xxl",lineHeight:1.35,...P("-0.312em")}}}}),A=({as:e="h2",size:o="md",...a})=>t(q,Object.assign({as:e,size:o},a));A.displayName="Heading";const V=j("svg",{color:"currentcolor",display:"inline-block",verticalAlign:"middle",variants:{size:{sm:{height:16,width:16},md:{height:24,width:24},lg:{height:32,width:32}}}}),E=({is:e,size:o="sm",...a})=>t(V,Object.assign({size:o,viewBox:"0 0 24 24","aria-hidden":"true"},a,{as:e}));function G(){return(G=Object.assign\|\|function(e){for(var o=1;o<arguments.length;o++){var t=arguments[o];for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&(e[a]=t[a])}return e}).apply(this,arguments)}var U=t("path",{d:"M20 6L9 17l-5-5"});function K(e){return t("svg",G({xmlns:"http://www.w3.org/2000/svg",width:24,height:24,fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",className:"check_svg__feather check_svg__feather-check"},e),U)}function X(){return(X=Object.assign\|\|function(e){for(var o=1;o<arguments.length;o++){var t=arguments[o];for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&(e[a]=t[a])}return e}).apply(this,arguments)}var J=t("path",{d:"M17.94 17.94A10.07 10.07 0 0112 20c-7 0-11-8-11-8a18.45 18.45 0 015.06-5.94M9.9 4.24A9.12 9.12 0 0112 4c7 0 11 8 11 8a18.5 18.5 0 01-2.16 3.19m-6.72-1.07a3 3 0 11-4.24-4.24M1 1l22 22"});function Q(e){return t("svg",X({xmlns:"http://www.w3.org/2000/svg",width:24,height:24,fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,className:"eye_svg__feather eye_svg__feather-eye-off"},e),J)}function Y(){return(Y=Object.assign\|\|function(e){for(var o=1;o<arguments.length;o++){var t=arguments[o];for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&(e[a]=t[a])}return e}).apply(this,arguments)}var Z=t("path",{d:"M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"}),ee=t("circle",{cx:12,cy:12,r:3});function oe(e){return t("svg",Y({xmlns:"http://www.w3.org/2000/svg",width:24,height:24,fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,className:"eye-off_svg__feather eye-off_svg__feather-eye"},e),Z,ee)}function te(){return(te=Object.assign\|\|function(e){for(var o=1;o<arguments.length;o++){var t=arguments[o];for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&(e[a]=t[a])}return e}).apply(this,arguments)}var ae=t("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6"});function re(e){return t("svg",te({className:"home_svg__w-6 home_svg__h-6",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg"},e),ae)}function ie(){return(ie=Object.assign\|\|function(e){for(var o=1;o<arguments.length;o++){var t=arguments[o];for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&(e[a]=t[a])}return e}).apply(this,arguments)}var ne=t("path",{d:"M18 6L6 18M6 6l12 12"});function se(e){return t("svg",ie({xmlns:"http://www.w3.org/2000/svg",width:24,height:24,fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",className:"x_svg__feather x_svg__feather-x"},e),ne)}const le=j("img",{verticalAlign:"middle",maxWidth:"100%","&[width]":{width:"auto"},"&[width][height]":{height:"auto"},'&[src$=".svg"]':{width:"100%",height:"auto",maxWidth:"none"}});le.displayName="Image";const de=j("input",{appearance:"none",border:"1px solid $tonal500",borderRadius:"$0",boxShadow:"none",boxSizing:"border-box",color:"$tonal900",cursor:"text",display:"block",fontFamily:"$sans",fontSize:"$md",height:"$2",width:"100%",p:"$3",transition:"all 100ms ease-out","&:focus":{borderColor:"$primary900",boxShadow:"inset 0 0 0 1px $colors$primary900",outline:"none"},"&[disabled]":{backgroundColor:"$tonal300",color:"$tonal700",cursor:"not-allowed"},variants:{state:{error:{border:"1px solid $danger"}}}}),ce=i((({type:e="text",...o},a)=>t(de,"number"===e?Object.assign({type:"text",inputMode:"numeric",pattern:"[0-9]",ref:a},o):Object.assign({type:e},o,{ref:a}))));ce.displayName="Input";const pe=({applyCapsize:e=!0}={})=>({sm:{fontSize:"$sm",lineHeight:1.53},md:{fontSize:"$md",lineHeight:1.625,...e?P("-0.4489em"):{}},lg:{fontSize:"$lg",lineHeight:1.52,...e?P("-0.3983em"):{}}}),me=j("p",{color:"$tonal900",fontFamily:"$sans",fontWeight:400,margin:0,maxWidth:"60ch",variants:{size:pe()}}),he=({as:e="p",size:o="md",...a})=>t(me,Object.assign({as:e,size:o},a));he.displayName="Text";const{sm:ge,md:ue}=pe(),be=j("label",{color:"$secondary300",display:"block",fontFamily:"$sans",fontWeight:500,margin:0,variants:{size:{sm:ge,md:ue}}}),ye=j("span",{color:"$danger",ml:"$1"}),$e=({size:e="md",children:o,required:a,...r})=>t(be,Object.assign({size:e},r),o,a&&t(ye,null,""));$e.displayName="Label";const fe=({css:e,...o})=>t(he,Object.assign({css:{color:"$danger",...e},size:"sm"},o)),ve=({css:e,label:o,name:a,error:r,required:i=!1,register:n=null,validation:s,...l})=>{let d;return n&&s?d=n(s):n&&(d=n),t(S,{css:e},t($e,{css:{mb:"$2"},htmlFor:a,required:i},o),t(ce,Object.assign({id:a,name:a,ref:d},r&&{state:"error"},l)),r&&t(fe,{css:{mt:"$1"}},r))};ve.displayName="InputField";const we=j("a",{color:"$primary500",fontFamily:"$sans",textDecoration:"none",cursor:"pointer","&:focus, &:hover":{color:"$primary900",textDecoration:"underline"},"&:active, &:visited":{color:"$primary500"},variants:{size:pe({applyCapsize:!1})}}),xe=i((({size:e="md",...o},a)=>t(we,Object.assign({size:e},o,{ref:a}))));xe.displayName="Link";const ke=j("li",{}),Ce=j("ul",{fontFamily:"$sans",pl:"$3",[`& ${ke}`]:{pl:"$2","&::marker":{content:'"•"',fontWeight:"bold"},"&:not(:last-child)":{mb:"$2"}},variants:{theme:{tonal:{[`& ${ke}`]:{"&::marker":{color:"$tonal900"}}},primary:{[`& ${ke}`]:{"&::marker":{color:"$primary500"}}},secondary:{[`& ${ke}`]:{"&::marker":{color:"$secondary500"}}}},size:pe()}}),ze=({theme:e="tonal",size:o="md",...a})=>t(Ce,Object.assign({theme:e,size:o},a));ze.Item=ke;const je=({css:e={},error:o="",label:a="Password",name:r="password",hidePasswordText:i="Hide password",showPasswordText:s="Show password",prompt:l,required:d=!1,register:c,validation:p,...m})=>{const[h,g]=n(!1);let u;return c&&p?u=c(p):c&&(u=c),t(S,{css:{position:"relative",...e}},t(_,{css:{justifyContent:"space-between",alignItems:"center",mb:"$2"}},t($e,{htmlFor:r,required:d},a),l&&t(xe,{href:l.link,size:"sm"},l.label)),t(S,{css:{position:"relative"}},t(ce,Object.assign({type:h?"text":"password",css:{pr:"$sizes$2"},autoComplete:"current-password",name:r,id:r,required:d,ref:u},m)),t(Oe,{"aria-label":h?i:s,onClick:()=>g((e=>!e)),onMouseDown:e=>e.preventDefault(),type:"button"},t(E,{css:{color:"$tonal700"},is:h?Q:oe}))),o&&t(fe,{css:{mt:"$2"}},o))};je.displayName="PasswordField";const Oe=j("button",{border:"none",padding:0,background:"none",cursor:"pointer",position:"absolute",bottom:0,right:0,size:"$2"}),Se=e=>({"&::after":{borderStyle:"solid",borderColor:"transparent",content:"''",height:0,pointerEvents:"none",position:"absolute",top:"100%",width:0,borderTopColor:"white",borderWidth:8,ml:-8,...e},"&::before":{borderStyle:"solid",borderColor:"transparent",content:"''",height:0,pointerEvents:"none",position:"absolute",top:"100%",width:0,borderTopColor:"$tonal400",borderWidth:9,ml:-9,...e}}),_e=j("span",{position:"relative"}),Ne=j("div",{boxShadow:"$0",borderRadius:"$1",backgroundColor:"white",border:"1px solid $tonal400",bottom:"calc(100% + $3)",listStyleType:"none",minWidth:140,maxWidth:354,p:"$3",position:"absolute",transition:"all 150ms ease-in-out",width:"max-content",opacity:0,visibility:"hidden",variants:{align:{left:{...Se({left:40}),left:0,transformOrigin:"60px bottom",transform:"translate(-20px, $2) scale(0.9)"},center:{...Se({left:"50%"}),transformOrigin:"center bottom",transform:"translate(-50%, $2) scale(0.9)"},right:{...Se({right:31}),right:0,transformOrigin:"calc(100% - 51px) bottom",transform:"translate(0, $2) scale(0.9)"}},visibility:{true:{opacity:1,visibility:"visible"}}}}),Le=({id:e,children:o,content:a,align:r="center",defaultOpen:l=!1,...d})=>{const c=s(null),[p,m]=n(l),h=`popover-trigger-${e\|\|Math.random().toString(36).substr(2,9)}`,g=()=>{m(!p)},u=e=>{void 0===e.keyCode\|\|32!==e.keyCode&&13!==e.keyCode\|\|m(!p)},b=i(((e,o)=>t("span",Object.assign({id:h,"aria-expanded":p,role:"button",tabIndex:0,"aria-label":"popover trigger",onClick:g,onKeyPress:u,ref:o},e))));return t(_e,Object.assign({},d),t(b,{ref:c},o),t(Ne,{role:"tooltip",align:r,"aria-labelledby":h,"aria-hidden":!p,visibility:p},a))};Le.displayName="Popover";const Re=e=>({background:"$tonal300",color:e}),We=e=>({border:"1px solid $tonal400",background:"white",color:e}),Fe=j(h,{borderRadius:25,height:12,position:"relative",overflow:"hidden",width:"100%",variants:{appearance:{outline:{},solid:{}},theme:{primary:{},secondary:{},tertiary:{},success:{},warning:{},danger:{}}},compoundVariants:[{theme:"primary",appearance:"solid",css:Re("$primary500")},{theme:"secondary",appearance:"solid",css:Re("$secondary500")},{theme:"tertiary",appearance:"solid",css:Re("$tertiary500")},{theme:"success",appearance:"solid",css:Re("$success")},{theme:"warning",appearance:"solid",css:Re("$warning")},{theme:"danger",appearance:"solid",css:Re("$danger")},{theme:"primary",appearance:"outline",css:We("$primary500")},{theme:"secondary",appearance:"outline",css:We("$secondary500")},{theme:"tertiary",appearance:"outline",css:We("$tertiary500")},{theme:"success",appearance:"outline",css:We("$success")},{theme:"warning",appearance:"outline",css:We("$warning")},{theme:"danger",appearance:"outline",css:We("$danger")}]}),Ie=j(g,{boxSizing:"border-box",position:"absolute",backgroundColor:"currentcolor",height:"100%"}),He=({value:e,appearance:o="outline",theme:a="primary",...r})=>t(Fe,Object.assign({appearance:o,theme:a},r),t(Ie,{style:{width:`${e}%`}}));He.displayName="ProgressBar";const Me=j(u,{appearance:"none",backgroundColor:"transparent",padding:0,borderRadius:"50%",borderColor:"$secondary300",borderWidth:2,borderStyle:"solid",width:"$0",height:"$0",display:"inline-flex",alignItems:"center",justifyContent:"center",verticalAlign:"middle","&:focus":{outline:"none"},":checked + &":{backgroundColor:"$secondary300"},"[disabled] + &":{backgroundColor:"$tonal600",border:"2px solid $tonal600"}}),Te=j(b,{width:8,height:8,borderRadius:"50%",backgroundColor:"white"}),Be=e=>t(Me,Object.assign({},e),t(Te,null));Be.displayName="RadioButton";const De=j(y,{}),Pe=e=>t(De,Object.assign({},e));Pe.displayName="RadioButtonGroup";const qe=j("select",{appearance:"none",backgroundColor:"white",backgroundImage:`url(data:image/svg+xml;charset=US-ASCII,${encodeURIComponent('<svg xmlns="http://www.w3.org/2000/svg" width="292.4" height="292.4"><path fill="#1066b2" d="M287 69a18 18 0 00-13-5H18c-5 0-9 2-12 5a18 18 0 00-6 13c0 5 2 10 5 13l128 128c4 4 8 5 13 5s9-1 13-5L287 95c4-3 5-8 5-13s-2-9-5-13z"/></svg>')})`,backgroundPosition:"right 16px top 50%, 0 0",backgroundRepeat:"no-repeat, repeat",backgroundSize:"0.65em auto, 100%",borderRadius:"$0",border:"1px solid $tonal500",display:"block",fontFamily:"$sans",fontSize:"$md",fontWeight:400,height:"$2",letterSpacing:"0.01em",lineHeight:"1.4",px:"$3",py:"$2",transition:"all 75ms ease-out",width:"100%","&:hover":{cursor:"pointer"},"&:focus":{boxShadow:"inset 0 0 0 1px $colors$primary900",borderColor:"$primary900",outline:"none"},"&::-ms-expand":{display:"none"},"&[disabled], > option[disabled]":{opacity:"0.7",backgroundColor:"$tonal300",cursor:"not-allowed"}}),Ae=({options:e,defaultOption:o,...a})=>t(qe,Object.assign({},a),o&&t("option",null," ",o),e&&e.map((e=>t("option",{key:e.value,value:e.value,disabled:e.disabled},e.label))));Ae.displayName="Select";const Ve=j("textarea",{appearance:"none",border:"1px solid $tonal500",borderRadius:"$0",boxShadow:"none",color:"$tonal900",fontFamily:"$sans",fontSize:"$md",fontWeight:400,letterSpacing:"0.01em",lineHeight:1.4,minHeight:100,px:"$3",py:"$2",resize:"vertical",transition:"all 75ms ease-out",width:"100%","&:focus":{borderColor:"$primary900",boxShadow:"inset 0 0 0 1px $colors$primary900",outline:"none"},"&[disabled]":{opacity:.7,backgroundColor:"$tonal300"}});Ve.displayName="Textarea";const Ee=j($,{}),Ge=({externalId:e,ratio:o=9/16,...a})=>t(S,{css:{position:"relative",paddingTop:100*o+"%",overflow:"hidden",height:0,width:"100%"}},t(Ee,Object.assign({role:"figure",url:`https://player.vimeo.com/video/${e}`},a,{height:"100%",width:"100%",css:{position:"absolute",top:0,left:0}})));Ge.displayName="Video";export{S as Box,I as Button,K as Check,M as Checkbox,_ as Flex,B as Form,D as Grid,A as Heading,re as Home,E as Icon,le as Image,ce as Input,ve as InputField,$e as Label,xe as Link,ze as List,L as Loader,je as PasswordField,Le as Popover,He as ProgressBar,Be as RadioButton,Pe as RadioButtonGroup,Ae as Select,he as Text,Ve as Textarea,fe as ValidationError,Ge as Video,se as X,v as conditions,x as css,k as getCssString,C as globalCss,z as keyframes,j as styled,O as theme,f as utils};

package.json

		@@ -6,3 +6,3 @@ {
		"module": "dist/index.modern.js",
		"version": "0.1.0-alpha.5",
		"version": "0.1.0-alpha.5.1",
		"description": "",
		@@ -9,0 +9,0 @@ "files": [

dist/docgen.json

Sorry, the diff of this file is too big to display

@atom-learning/components - npm Package Compare versions

New alerts

Fixed alerts

Improved metrics