npm - @atom-learning/components - Versions diffs - 4.0.0-beta.10 → 4.0.0-beta.11 - Mend

@atom-learning/components 4.0.0-beta.10 → 4.0.0-beta.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (67) hide show

package/dist/components/accordion/AccordionTrigger.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{ChevronDown as n}from"@atom-learning/icons";import{Trigger as s}from"@radix-ui/react-accordion";import e from"react";import{ColorScheme as c}from"../../experiments/color-scheme/ColorScheme.js";import{styled as o}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import{focusVisibleStyleBlock as d}from"../../utilities/style/focus-visible-style-block.js";import"../../utilities/style/keyframe-animations.js";import{Icon as m}from"../icon/Icon.js";const l=o(m,{transition:"transform 300ms",'[data-state="open"] > &':{transform:"rotate(180deg)"},'[data-state="closed"] > &':{transform:"rotate(0deg)"}}),p=o(s,{border:0,py:"$3",px:"$4",width:"100%",display:"flex",justifyContent:"space-between",alignItems:"center",cursor:"pointer",bg:"$interactive2",color:"$interactiveForeground","&[data-disabled]":{opacity:.3,cursor:"not-allowed"},"&:not([data-disabled])":{"&:active, &:hover, &:focus-visible":{bg:"$interactive3"},"&:focus-visible":{...d()}},'&[data-state="open"]':{borderRadius:"$0 $0 0 0"},'&[data-state="closed"]':{borderRadius:"$0"}}),f=({children:t,colorScheme:a={},asChild:r,...i})=>e.createElement(c,{asChild:!0,accent:"grey1",interactive:"loContrast",...a},e.createElement(p,{asChild:r,...i},r?t:e.createElement(e.Fragment,null,t,e.createElement(l,{is:n,"data-testid":"accordion-chevron"}))));export{f as AccordionTrigger};
+import{ChevronDown as n}from"@atom-learning/icons";import{Trigger as s}from"@radix-ui/react-accordion";import e from"react";import{ColorScheme as c}from"../../experiments/color-scheme/ColorScheme.js";import{styled as r}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import{focusVisibleStyleBlock as d}from"../../utilities/style/focus-visible-style-block.js";import"../../utilities/style/keyframe-animations.js";import{Icon as m}from"../icon/Icon.js";const l=r(m,{transition:"transform 300ms",'[data-state="open"] > &':{transform:"rotate(180deg)"},'[data-state="closed"] > &':{transform:"rotate(0deg)"}}),p=r(s,{border:0,py:"$3",px:"$4",width:"100%",display:"flex",justifyContent:"space-between",alignItems:"center",cursor:"pointer",bg:"$interactive2",color:"$interactiveForeground","&[disabled]":{opacity:.3,cursor:"not-allowed"},"&:not([disabled])":{"&:active, &:hover, &:focus-visible":{bg:"$interactive3"},"&:focus-visible":{...d()}},'&[data-state="open"]':{borderRadius:"$0 $0 0 0"},'&[data-state="closed"]':{borderRadius:"$0"}}),f=({children:t,colorScheme:i={},asChild:o,...a})=>e.createElement(c,{asChild:!0,accent:"grey1",interactive:"loContrast",...i},e.createElement(p,{asChild:o,...a},o?t:e.createElement(e.Fragment,null,t,e.createElement(l,{is:n,"data-testid":"accordion-chevron"}))));export{f as AccordionTrigger};
 //# sourceMappingURL=AccordionTrigger.js.map

package/dist/components/accordion/AccordionTrigger.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AccordionTrigger.js","sources":["../../../src/components/accordion/AccordionTrigger.tsx"],"sourcesContent":["import { ChevronDown } from '@atom-learning/icons'\nimport { Trigger } from '@radix-ui/react-accordion'\nimport React from 'react'\n\nimport { ColorScheme, TcolorScheme } from '~/experiments/color-scheme'\nimport { styled } from '~/stitches'\nimport { focusVisibleStyleBlock } from '~/utilities'\n\nimport { Icon } from '../icon'\n\nconst RotatingIcon = styled(Icon, {\n transition: 'transform 300ms',\n '[data-state=\"open\"] > &': {\n transform: 'rotate(180deg)'\n },\n '[data-state=\"closed\"] > &': {\n transform: 'rotate(0deg)'\n }\n})\n\nconst StyledTrigger = styled(Trigger, {\n border: 0,\n py: '$3',\n px: '$4',\n width: '100%',\n display: 'flex',\n justifyContent: 'space-between',\n alignItems: 'center',\n cursor: 'pointer',\n bg: '$interactive2',\n color: '$interactiveForeground',\n '&[~~data-~~disabled]': {\n opacity: 0.3,\n cursor: 'not-allowed'\n },\n '&:not([~~data-~~disabled])': {\n '&:active, &:hover, &:focus-visible': {\n bg: '$interactive3'\n },\n '&:focus-visible': {\n ...focusVisibleStyleBlock()\n }\n },\n '&[data-state=\"open\"]': {\n borderRadius: '$0 $0 0 0'\n },\n '&[data-state=\"closed\"]': {\n borderRadius: '$0'\n }\n})\n\nexport const AccordionTrigger = ({\n children,\n colorScheme = {},\n asChild,\n ...remainingProps\n}: React.ComponentProps<typeof StyledTrigger> & {\n colorScheme?: TcolorScheme\n}) => (\n <ColorScheme asChild accent=\"grey1\" interactive=\"loContrast\" {...colorScheme}>\n <StyledTrigger asChild={asChild} {...remainingProps}>\n {asChild ? (\n children\n ) : (\n <>\n {children}\n <RotatingIcon is={ChevronDown} data-testid=\"accordion-chevron\" />\n </>\n )}\n </StyledTrigger>\n </ColorScheme>\n)\n"],"names":["RotatingIcon","styled","Icon","StyledTrigger","Trigger","focusVisibleStyleBlock","AccordionTrigger","children","colorScheme","asChild","remainingProps","React","ColorScheme","ChevronDown"],"mappings":"8iBAUA,MAAMA,EAAeC,EAAOC,EAAM,CAChC,WAAY,kBACZ,0BAA2B,CACzB,UAAW,gBACb,EACA,4BAA6B,CAC3B,UAAW,cACb,CACF,CAAC,EAEKC,EAAgBF,EAAOG,EAAS,CACpC,OAAQ,EACR,GAAI,KACJ,GAAI,KACJ,MAAO,OACP,QAAS,OACT,eAAgB,gBAChB,WAAY,SACZ,OAAQ,UACR,GAAI,gBACJ,MAAO,yBACP,~~mBAAoB~~,~~CAClB~~,QAAS,GACT,OAAQ,aACV,EACA,~~yBAA0B~~,~~CACxB~~,qCAAsC,CACpC,GAAI,eACN,EACA,kBAAmB,CACjB,GAAGC,EACL,CAAA,CACF,EACA,uBAAwB,CACtB,aAAc,WAChB,EACA,yBAA0B,CACxB,aAAc,IAChB,CACF,CAAC,EAEYC,EAAmB,CAAC,CAC/B,SAAAC,EACA,YAAAC,EAAc,CAAC,EACf,QAAAC,KACGC,CACL,IAGEC,EAAA,cAACC,EAAA,CAAY,QAAO,GAAC,OAAO,QAAQ,YAAY,aAAc,GAAGJ,GAC/DG,EAAA,cAACR,EAAA,CAAc,QAASM,EAAU,GAAGC,CAClCD,EAAAA,EACCF,EAEAI,EAAA,cAAAA,EAAA,SAAA,KACGJ,EACDI,EAAA,cAACX,EAAA,CAAa,GAAIa,EAAa,cAAY,mBAAoB,CAAA,CACjE,CAEJ,CACF"}
1	+ {"version":3,"file":"AccordionTrigger.js","sources":["../../../src/components/accordion/AccordionTrigger.tsx"],"sourcesContent":["import { ChevronDown } from '@atom-learning/icons'\nimport { Trigger } from '@radix-ui/react-accordion'\nimport React from 'react'\n\nimport { ColorScheme, TcolorScheme } from '~/experiments/color-scheme'\nimport { styled } from '~/stitches'\nimport { focusVisibleStyleBlock } from '~/utilities'\n\nimport { Icon } from '../icon'\n\nconst RotatingIcon = styled(Icon, {\n transition: 'transform 300ms',\n '[data-state=\"open\"] > &': {\n transform: 'rotate(180deg)'\n },\n '[data-state=\"closed\"] > &': {\n transform: 'rotate(0deg)'\n }\n})\n\nconst StyledTrigger = styled(Trigger, {\n border: 0,\n py: '$3',\n px: '$4',\n width: '100%',\n display: 'flex',\n justifyContent: 'space-between',\n alignItems: 'center',\n cursor: 'pointer',\n bg: '$interactive2',\n color: '$interactiveForeground',\n '&[disabled]': {\n opacity: 0.3,\n cursor: 'not-allowed'\n },\n '&:not([disabled])': {\n '&:active, &:hover, &:focus-visible': {\n bg: '$interactive3'\n },\n '&:focus-visible': {\n ...focusVisibleStyleBlock()\n }\n },\n '&[data-state=\"open\"]': {\n borderRadius: '$0 $0 0 0'\n },\n '&[data-state=\"closed\"]': {\n borderRadius: '$0'\n }\n})\n\nexport const AccordionTrigger = ({\n children,\n colorScheme = {},\n asChild,\n ...remainingProps\n}: React.ComponentProps<typeof StyledTrigger> & {\n colorScheme?: TcolorScheme\n}) => (\n <ColorScheme asChild accent=\"grey1\" interactive=\"loContrast\" {...colorScheme}>\n <StyledTrigger asChild={asChild} {...remainingProps}>\n {asChild ? (\n children\n ) : (\n <>\n {children}\n <RotatingIcon is={ChevronDown} data-testid=\"accordion-chevron\" />\n </>\n )}\n </StyledTrigger>\n </ColorScheme>\n)\n"],"names":["RotatingIcon","styled","Icon","StyledTrigger","Trigger","focusVisibleStyleBlock","AccordionTrigger","children","colorScheme","asChild","remainingProps","React","ColorScheme","ChevronDown"],"mappings":"8iBAUA,MAAMA,EAAeC,EAAOC,EAAM,CAChC,WAAY,kBACZ,0BAA2B,CACzB,UAAW,gBACb,EACA,4BAA6B,CAC3B,UAAW,cACb,CACF,CAAC,EAEKC,EAAgBF,EAAOG,EAAS,CACpC,OAAQ,EACR,GAAI,KACJ,GAAI,KACJ,MAAO,OACP,QAAS,OACT,eAAgB,gBAChB,WAAY,SACZ,OAAQ,UACR,GAAI,gBACJ,MAAO,yBACP,cAAe,CACb,QAAS,GACT,OAAQ,aACV,EACA,oBAAqB,CACnB,qCAAsC,CACpC,GAAI,eACN,EACA,kBAAmB,CACjB,GAAGC,EACL,CAAA,CACF,EACA,uBAAwB,CACtB,aAAc,WAChB,EACA,yBAA0B,CACxB,aAAc,IAChB,CACF,CAAC,EAEYC,EAAmB,CAAC,CAC/B,SAAAC,EACA,YAAAC,EAAc,CAAC,EACf,QAAAC,KACGC,CACL,IAGEC,EAAA,cAACC,EAAA,CAAY,QAAO,GAAC,OAAO,QAAQ,YAAY,aAAc,GAAGJ,GAC/DG,EAAA,cAACR,EAAA,CAAc,QAASM,EAAU,GAAGC,CAClCD,EAAAA,EACCF,EAEAI,EAAA,cAAAA,EAAA,SAAA,KACGJ,EACDI,EAAA,cAACX,EAAA,CAAa,GAAIa,EAAa,cAAY,mBAAoB,CAAA,CACjE,CAEJ,CACF"}

package/dist/components/action-icon/ActionIcon.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import u from"invariant";import*as n from"react";import{styled as w}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import"../../utilities/style/keyframe-animations.js";import{disabledStyle as k}from"../../utilities/style/disabledStyle.js";import{getExternalAnchorProps as D}from"../../utilities/uri/index.js";import{Icon as m}from"../icon/Icon.js";import{ActionIconSizeMap as z}from"./ActionIcon.constants.js";import{OptionalTooltipWrapper as M}from"../../utilities/optional-tooltip-wrapper/OptionalTooltipWrapper.js";const o=(r,a,i,e)=>({theme:r,appearance:"simple",css:{bg:"transparent",color:a,"&:not(:disabled):hover, &:not(:disabled):focus":{color:i},"&:not(:disabled):active":{color:e}}}),t=(r,a,i,e)=>({theme:r,appearance:"solid",css:{bg:a,color:"white","&:not(:disabled):hover, &:not(:disabled):focus":{bg:i,color:"white"},"&:not(:disabled):active":{bg:e}}}),p=(r,a,i,e)=>({theme:r,appearance:"outline",css:{border:"1px solid",borderColor:"currentColor",color:a,"&:not(:disabled):hover, &:not(:disabled):focus":{color:i},"&:not(:disabled):active":{color:e}}}),v=w("button",{alignItems:"center",appearance:"none",bg:"white",border:"unset",borderRadius:"$0",boxSizing:"border-box",cursor:"pointer",display:"flex",flexShrink:0,justifyContent:"center",p:"unset",transition:"all 100ms ease-out","&[disabled]":k,variants:{theme:{neutral:{},primary:{},success:{},warning:{},danger:{}},appearance:{simple:{},outline:{},solid:{}},size:{xs:{size:"$2"},sm:{size:"$3"},md:{size:"$4"},lg:{size:"$5"}},isRounded:{true:{borderRadius:"$round"}}},compoundVariants:[o("neutral","$grey700","$primary900","$primary1000"),o("primary","$primary800","$primary900","$primary1000"),o("primaryDark","$primary1000","$primary1100","$primary1200"),o("success","$success","$successMid","$successDark"),o("warning","$warning","$warningMid","$warningDark"),o("danger","$danger","$dangerMid","$dangerDark"),t("primary","$primary800","$primary900","$primary1000"),t("primaryDark","$primary1000","$primary1100","$primary1200"),t("success","$success","$successMid","$successDark"),t("warning","$warning","$warningMid","$warningDark"),t("danger","$danger","$dangerMid","$dangerDark"),p("primary","$primary800","$primary900","$primary1000"),p("primaryDark","$primary1000","$primary1100","$primary1200"),p("success","$success","$successMid","$successDark"),p("warning","$warning","$warningMid","$warningDark"),p("danger","$danger","$dangerMid","$dangerDark")]}),d=n.forwardRef(({children:r,theme:a="primary",appearance:i="simple",size:e="sm",label:$,href:l,disabled:c,hasTooltip:g=!0,tooltipSide:b,...h},f)=>{const y=`A single ${m.displayName} component is permitted as a child of ${d.displayName}`;return u(n.Children.count(r)===1,y),n.createElement(M,{hasTooltip:g,label:$,tooltipSide:b},n.createElement(v,{...l?{as:"a",href:c?null:l,onClick:void 0,"aria-disabled":!!c}:{type:"button"},...D(l),...h,"aria-label":$,theme:a,appearance:i,size:e,ref:f,disabled:c},n.Children.map(r,s=>{if(!n.isValidElement(s))throw new Error(y);return u(s.type===m,`Children of type ${s==null?void 0:s.type} aren't permitted. Only an ${m.displayName} component is allowed in ${d.displayName}`),n.cloneElement(s,{size:z[e],css:{...s.props.css?s.props.css:{}}})})))});d.displayName="ActionIcon";export{d as ActionIcon};
+import u from"invariant";import*as n from"react";import{styled as w}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import"../../utilities/style/keyframe-animations.js";import{disabledStyle as k}from"../../utilities/style/disabledStyle.js";import{getExternalAnchorProps as D}from"../../utilities/uri/index.js";import{Icon as m}from"../icon/Icon.js";import{ActionIconSizeMap as v}from"./ActionIcon.constants.js";import{OptionalTooltipWrapper as z}from"../../utilities/optional-tooltip-wrapper/OptionalTooltipWrapper.js";const o=(r,a,i,e)=>({theme:r,appearance:"simple",css:{bg:"transparent",color:a,"&:not(:disabled):hover, &:not(:disabled):focus":{color:i},"&:not(:disabled):active":{color:e}}}),t=(r,a,i,e)=>({theme:r,appearance:"solid",css:{bg:a,color:"white","&:not(:disabled):hover, &:not(:disabled):focus":{bg:i,color:"white"},"&:not(:disabled):active":{bg:e}}}),p=(r,a,i,e)=>({theme:r,appearance:"outline",css:{border:"1px solid",borderColor:"currentColor",color:a,"&:not(:disabled):hover, &:not(:disabled):focus":{color:i},"&:not(:disabled):active":{color:e}}}),M=w("button",{alignItems:"center",appearance:"none",bg:"white",border:"unset",borderRadius:"$0",boxSizing:"border-box",cursor:"pointer",display:"flex",flexShrink:0,justifyContent:"center",p:"unset",transition:"all 100ms ease-out","&[disabled]":k,variants:{theme:{neutral:{},primary:{},success:{},warning:{},danger:{}},appearance:{simple:{},outline:{},solid:{}},size:{xs:{size:"$2"},sm:{size:"$3"},md:{size:"$4"},lg:{size:"$5"}},isRounded:{true:{borderRadius:"$round"}}},compoundVariants:[o("neutral","$grey700","$primary900","$primary1000"),o("primary","$primary800","$primary900","$primary1000"),o("primaryDark","$primary1000","$primary1100","$primary1200"),o("success","$success","$successMid","$successDark"),o("warning","$warning","$warningMid","$warningDark"),o("danger","$danger","$dangerMid","$dangerDark"),t("primary","$primary800","$primary900","$primary1000"),t("primaryDark","$primary1000","$primary1100","$primary1200"),t("success","$success","$successMid","$successDark"),t("warning","$warning","$warningMid","$warningDark"),t("danger","$danger","$dangerMid","$dangerDark"),p("primary","$primary800","$primary900","$primary1000"),p("primaryDark","$primary1000","$primary1100","$primary1200"),p("success","$success","$successMid","$successDark"),p("warning","$warning","$warningMid","$warningDark"),p("danger","$danger","$dangerMid","$dangerDark")]}),d=n.forwardRef(({children:r,theme:a="primary",appearance:i="simple",size:e="sm",label:$,href:l,disabled:c,hasTooltip:g=!0,tooltipSide:b,...h},f)=>{const y=`A single ${m.displayName} component is permitted as a child of ${d.displayName}`;return u(n.Children.count(r)===1,y),n.createElement(z,{hasTooltip:g,label:$,tooltipSide:b},n.createElement(M,{...l?{as:"a",href:c?null:l,onClick:void 0,"aria-disabled":!!c}:{type:"button"},...D(l),...h,"aria-label":$,theme:a,appearance:i,size:e,ref:f,disabled:c},n.Children.map(r,s=>{if(!n.isValidElement(s))throw new Error(y);return u(s.type===m,`Children of type ${s==null?void 0:s.type} aren't permitted. Only an ${m.displayName} component is allowed in ${d.displayName}`),n.cloneElement(s,{size:v[e],css:{...s.props.css?s.props.css:{}}})})))});d.displayName="ActionIcon";export{d as ActionIcon};
 //# sourceMappingURL=ActionIcon.js.map

package/dist/components/action-icon/ActionIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ActionIcon.js","sources":["../../../src/components/action-icon/ActionIcon.tsx"],"sourcesContent":["import type { VariantProps } from '@atom-learning/stitches-react'\nimport invariant from 'invariant'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { NavigatorActions } from '~/types'\nimport { disabledStyle, Override } from '~/utilities'\nimport type { TOptionalTooltipWrapperProps } from '~/utilities/optional-tooltip-wrapper'\nimport { OptionalTooltipWrapper } from '~/utilities/optional-tooltip-wrapper'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { Icon } from '../icon/Icon'\nimport { ActionIconSizeMap } from './ActionIcon.constants'\n\nconst getSimpleVariant = (\n theme: string,\n base: string,\n interact: string,\n active: string\n) => ({\n theme,\n appearance: 'simple',\n css: {\n bg: 'transparent',\n color: base,\n '&:not(:disabled):hover, &:not(:disabled):focus': { color: interact },\n '&:not(:disabled):active': { color: active }\n }\n})\n\nconst getSolidVariant = (\n theme: string,\n base: string,\n interact: string,\n active: string\n) => ({\n theme,\n appearance: 'solid',\n css: {\n bg: base,\n color: 'white',\n '&:not(:disabled):hover, &:not(:disabled):focus': {\n bg: interact,\n color: 'white'\n },\n '&:not(:disabled):active': { bg: active }\n }\n})\n\nconst getOutlineVariant = (\n theme: string,\n base: string,\n interact: string,\n active: string\n) => ({\n theme,\n appearance: 'outline',\n css: {\n border: '1px solid',\n borderColor: 'currentColor',\n color: base,\n '&:not(:disabled):hover, &:not(:disabled):focus': { color: interact },\n '&:not(:disabled):active': { color: active }\n }\n})\n\nconst StyledButton = styled('button', {\n alignItems: 'center',\n appearance: 'none',\n bg: 'white',\n border: 'unset',\n borderRadius: '$0',\n boxSizing: 'border-box',\n cursor: 'pointer',\n display: 'flex',\n flexShrink: 0,\n justifyContent: 'center',\n p: 'unset',\n transition: 'all 100ms ease-out',\n '&[disabled]': disabledStyle,\n variants: {\n theme: {\n neutral: {},\n primary: {},\n success: {},\n warning: {},\n danger: {}\n },\n appearance: {\n simple: {},\n outline: {},\n solid: {}\n },\n size: {\n xs: { size: '$2' },\n sm: { size: '$3' },\n md: { size: '$4' },\n lg: { size: '$5' }\n },\n isRounded: {\n true: {\n borderRadius: '$round'\n }\n }\n },\n\n // prettier-ignore\n compoundVariants: [\n getSimpleVariant('neutral', '$grey700', '$primary900', '$primary1000'),\n getSimpleVariant('primary', '$primary800', '$primary900', '$primary1000'),\n getSimpleVariant('primaryDark', '$primary1000', '$primary1100', '$primary1200'),\n getSimpleVariant('success', '$success', '$successMid', '$successDark'),\n getSimpleVariant('warning', '$warning', '$warningMid', '$warningDark'),\n getSimpleVariant('danger', '$danger', '$dangerMid', '$dangerDark'),\n\n getSolidVariant('primary', '$primary800', '$primary900', '$primary1000'),\n getSolidVariant('primaryDark', '$primary1000', '$primary1100', '$primary1200'),\n getSolidVariant('success', '$success', '$successMid', '$successDark'),\n getSolidVariant('warning', '$warning', '$warningMid', '$warningDark'),\n getSolidVariant('danger', '$danger', '$dangerMid', '$dangerDark'),\n\n getOutlineVariant('primary', '$primary800', '$primary900', '$primary1000'),\n getOutlineVariant('primaryDark', '$primary1000', '$primary1100', '$primary1200'),\n getOutlineVariant('success', '$success', '$successMid', '$successDark'),\n getOutlineVariant('warning', '$warning', '$warningMid', '$warningDark'),\n getOutlineVariant('danger', '$danger', '$dangerMid', '$dangerDark')\n ]\n})\n\ntype ActionIconProps = Override<\n React.ComponentProps<typeof StyledButton>,\n VariantProps<typeof StyledButton> & {\n as?: string \| React.ReactNode\n children: React.ReactNode\n label: string\n } & Omit<TOptionalTooltipWrapperProps, 'label'> &\n NavigatorActions\n>\n\nexport const ActionIcon: React.ForwardRefExoticComponent<ActionIconProps> =\n React.forwardRef(\n (\n {\n children,\n theme = 'primary',\n appearance = 'simple',\n size = 'sm',\n label,\n href,\n disabled,\n hasTooltip = true,\n tooltipSide,\n ...remainingProps\n },\n ref\n ) => {\n const INVALID_CHILDREN_MESSAGE = `A single ${Icon.displayName} component is permitted as a child of ${ActionIcon.displayName}`\n\n invariant(React.Children.count(children) === 1, INVALID_CHILDREN_MESSAGE)\n\n const optionalLinkProps = href\n ? ({\n as: 'a',\n href: disabled ? null : href,\n onClick: undefined,\n 'aria-disabled': !!disabled\n } as const)\n : ({ type: 'button' } as const)\n\n return (\n <OptionalTooltipWrapper\n hasTooltip={hasTooltip}\n label={label}\n tooltipSide={tooltipSide}\n >\n <StyledButton\n {...optionalLinkProps}\n {...getExternalAnchorProps(href)}\n {...remainingProps}\n aria-label={label}\n theme={theme}\n appearance={appearance}\n size={size}\n ref={ref}\n disabled={disabled}\n >\n {React.Children.map(children, (child) => {\n // TS needs this check for any following code to access child.type\n // even with optional chaining\n if (!React.isValidElement(child)) {\n throw new Error(INVALID_CHILDREN_MESSAGE)\n }\n\n invariant(\n child.type === Icon,\n `Children of type ${child?.type} aren't permitted. Only an ${Icon.displayName} component is allowed in ${ActionIcon.displayName}`\n )\n\n return React.cloneElement(child, {\n size: ActionIconSizeMap[size as string],\n css: { ...(child.props.css ? child.props.css : {}) }\n })\n })}\n </StyledButton>\n </OptionalTooltipWrapper>\n )\n }\n )\n\nActionIcon.displayName = 'ActionIcon'\n"],"names":["getSimpleVariant","theme","base","interact","active","getSolidVariant","getOutlineVariant","StyledButton","styled","disabledStyle","ActionIcon","React","children","appearance","size","label","href","disabled","hasTooltip","tooltipSide","remainingProps","ref","INVALID_CHILDREN_MESSAGE","Icon","invariant","OptionalTooltipWrapper","getExternalAnchorProps","child","ActionIconSizeMap"],"mappings":"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~~aAAagB~~,~~EAAO~~,~~CAC/B~~,KAAMC,EAAkBd,GACxB,IAAK,CAAE,GAAIa,EAAM,MAAM,IAAMA,EAAM,MAAM,IAAM,EAAI,CACrD,~~CAAC~~,~~CACH~~,CAAC,CACH,CACF,CAEJ,CACF,EAEFjB,EAAW,YAAc"}
1	+ {"version":3,"file":"ActionIcon.js","sources":["../../../src/components/action-icon/ActionIcon.tsx"],"sourcesContent":["import type { VariantProps } from '@atom-learning/stitches-react'\nimport invariant from 'invariant'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { NavigatorActions } from '~/types'\nimport { disabledStyle, Override } from '~/utilities'\nimport type { TOptionalTooltipWrapperProps } from '~/utilities/optional-tooltip-wrapper'\nimport { OptionalTooltipWrapper } from '~/utilities/optional-tooltip-wrapper'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { Icon } from '../icon/Icon'\nimport { ActionIconSizeMap } from './ActionIcon.constants'\n\nconst getSimpleVariant = (\n theme: string,\n base: string,\n interact: string,\n active: string\n) => ({\n theme,\n appearance: 'simple',\n css: {\n bg: 'transparent',\n color: base,\n '&:not(:disabled):hover, &:not(:disabled):focus': { color: interact },\n '&:not(:disabled):active': { color: active }\n }\n})\n\nconst getSolidVariant = (\n theme: string,\n base: string,\n interact: string,\n active: string\n) => ({\n theme,\n appearance: 'solid',\n css: {\n bg: base,\n color: 'white',\n '&:not(:disabled):hover, &:not(:disabled):focus': {\n bg: interact,\n color: 'white'\n },\n '&:not(:disabled):active': { bg: active }\n }\n})\n\nconst getOutlineVariant = (\n theme: string,\n base: string,\n interact: string,\n active: string\n) => ({\n theme,\n appearance: 'outline',\n css: {\n border: '1px solid',\n borderColor: 'currentColor',\n color: base,\n '&:not(:disabled):hover, &:not(:disabled):focus': { color: interact },\n '&:not(:disabled):active': { color: active }\n }\n})\n\nconst StyledButton = styled('button', {\n alignItems: 'center',\n appearance: 'none',\n bg: 'white',\n border: 'unset',\n borderRadius: '$0',\n boxSizing: 'border-box',\n cursor: 'pointer',\n display: 'flex',\n flexShrink: 0,\n justifyContent: 'center',\n p: 'unset',\n transition: 'all 100ms ease-out',\n '&[disabled]': disabledStyle,\n variants: {\n theme: {\n neutral: {},\n primary: {},\n success: {},\n warning: {},\n danger: {}\n },\n appearance: {\n simple: {},\n outline: {},\n solid: {}\n },\n size: {\n xs: { size: '$2' },\n sm: { size: '$3' },\n md: { size: '$4' },\n lg: { size: '$5' }\n },\n isRounded: {\n true: {\n borderRadius: '$round'\n }\n }\n },\n\n // prettier-ignore\n compoundVariants: [\n getSimpleVariant('neutral', '$grey700', '$primary900', '$primary1000'),\n getSimpleVariant('primary', '$primary800', '$primary900', '$primary1000'),\n getSimpleVariant('primaryDark', '$primary1000', '$primary1100', '$primary1200'),\n getSimpleVariant('success', '$success', '$successMid', '$successDark'),\n getSimpleVariant('warning', '$warning', '$warningMid', '$warningDark'),\n getSimpleVariant('danger', '$danger', '$dangerMid', '$dangerDark'),\n\n getSolidVariant('primary', '$primary800', '$primary900', '$primary1000'),\n getSolidVariant('primaryDark', '$primary1000', '$primary1100', '$primary1200'),\n getSolidVariant('success', '$success', '$successMid', '$successDark'),\n getSolidVariant('warning', '$warning', '$warningMid', '$warningDark'),\n getSolidVariant('danger', '$danger', '$dangerMid', '$dangerDark'),\n\n getOutlineVariant('primary', '$primary800', '$primary900', '$primary1000'),\n getOutlineVariant('primaryDark', '$primary1000', '$primary1100', '$primary1200'),\n getOutlineVariant('success', '$success', '$successMid', '$successDark'),\n getOutlineVariant('warning', '$warning', '$warningMid', '$warningDark'),\n getOutlineVariant('danger', '$danger', '$dangerMid', '$dangerDark')\n ]\n})\n\ntype ActionIconProps = Override<\n React.ComponentProps<typeof StyledButton>,\n VariantProps<typeof StyledButton> & {\n as?: string \| React.ReactNode\n children: React.ReactNode\n label: string\n } & Omit<TOptionalTooltipWrapperProps, 'label'> &\n NavigatorActions\n>\n\nexport const ActionIcon: React.ForwardRefExoticComponent<ActionIconProps> =\n React.forwardRef(\n (\n {\n children,\n theme = 'primary',\n appearance = 'simple',\n size = 'sm',\n label,\n href,\n disabled,\n hasTooltip = true,\n tooltipSide,\n ...remainingProps\n },\n ref\n ) => {\n const INVALID_CHILDREN_MESSAGE = `A single ${Icon.displayName} component is permitted as a child of ${ActionIcon.displayName}`\n\n invariant(React.Children.count(children) === 1, INVALID_CHILDREN_MESSAGE)\n\n const optionalLinkProps = href\n ? ({\n as: 'a',\n href: disabled ? null : href,\n onClick: undefined,\n 'aria-disabled': !!disabled\n } as const)\n : ({ type: 'button' } as const)\n\n return (\n <OptionalTooltipWrapper\n hasTooltip={hasTooltip}\n label={label}\n tooltipSide={tooltipSide}\n >\n <StyledButton\n {...optionalLinkProps}\n {...getExternalAnchorProps(href)}\n {...remainingProps}\n aria-label={label}\n theme={theme}\n appearance={appearance}\n size={size}\n ref={ref}\n disabled={disabled}\n >\n {React.Children.map(children, (child) => {\n // TS needs this check for any following code to access child.type\n // even with optional chaining\n if (!React.isValidElement(child)) {\n throw new Error(INVALID_CHILDREN_MESSAGE)\n }\n\n invariant(\n child.type === Icon,\n `Children of type ${child?.type} aren't permitted. Only an ${Icon.displayName} component is allowed in ${ActionIcon.displayName}`\n )\n\n return React.cloneElement(\n child as React.ReactElement<React.ComponentProps<typeof Icon>>,\n {\n size: ActionIconSizeMap[size as string],\n css: { ...(child.props.css ? child.props.css : {}) }\n }\n )\n })}\n </StyledButton>\n </OptionalTooltipWrapper>\n )\n }\n )\n\nActionIcon.displayName = 'ActionIcon'\n"],"names":["getSimpleVariant","theme","base","interact","active","getSolidVariant","getOutlineVariant","StyledButton","styled","disabledStyle","ActionIcon","React","children","appearance","size","label","href","disabled","hasTooltip","tooltipSide","remainingProps","ref","INVALID_CHILDREN_MESSAGE","Icon","invariant","OptionalTooltipWrapper","getExternalAnchorProps","child","ActionIconSizeMap"],"mappings":"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"}

package/dist/components/calendar/Calendar.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{ChevronLeft as _,ChevronRight as H}from"@atom-learning/icons";import{useDayzed as J}from"dayzed";import*as e from"react";import{ActionIcon as w}from"../action-icon/ActionIcon.js";import{Box as $}from"../box/Box.js";import{Button as x}from"../button/Button.js";import{Flex as C}from"../flex/Flex.js";import{Icon as Y}from"../icon/Icon.js";import{Text as K}from"../text/Text.js";import{styled as F}from"../../stitches.js";import{monthNamesShort as Q,weekdayNamesShort as V,DEFAULT_LABELS as X}from"./constants.js";import{Day as Z}from"./Day.js";const h=F("div",{display:"grid",gridTemplateColumns:"repeat(7, 1fr)",gridGap:"$1 $2"}),ee=F(x,{color:"$grey1000",p:"$3",width:"$6",variants:{selected:{false:{color:"$grey1000 !important",fontWeight:"400","&:hover":{bg:"$grey200 !important",color:"$grey1000 !important"},"&[disabled]":{bg:"white !important"}}}}}),te=(i,c)=>{const u=i.slice(0,c);return i.slice(c).concat(u)},S=({css:i,refDateSelected:c,refDateToday:u,firstDayOfWeek:y=0,monthNames:N=Q,weekdayNames:T=V,labels:f=X,date:n=new Date,minDate:l,maxDate:s,setYear:A,...L})=>{const[a,E]=e.useState(!1),[m,k]=e.useState(n==null?void 0:n.getFullYear()),O=t=>{const r=n;r.setFullYear(t),A(r),E(!1)},z=l&&m-16<=l.getFullYear(),B=s&&m>=s.getFullYear(),I=Array.from({length:16},(t,r)=>{const o=m-r;return s&&o>s.getFullYear()||l&&o<l.getFullYear()?0:o}),{calendars:d,getBackProps:M,getForwardProps:G,getDateProps:P}=J({firstDayOfWeek:y,showOutsideDays:!0,date:n,minDate:l,maxDate:s,...L});return d.length?e.createElement($,{css:{position:"relative",width:"min-content",mt:"-$1",...i}},e.createElement(C,{css:{position:"absolute",top:0,right:"-$1"}},e.createElement(w,{label:f[a?"previousYear":"previous"],theme:"neutral",size:"md",...!a&&M({calendars:d}),...a&&{onClick:()=>k(m-16)},disabled:a&&z},e.createElement(Y,{is:_})),e.createElement(w,{label:f[a?"nextYear":"next"],theme:"neutral",size:"md",...!a&&G({calendars:d}),...a&&{onClick:()=>k(m+16)},disabled:a&&B},e.createElement(Y,{is:H}))),a&&e.createElement(h,{css:{gridTemplateColumns:"repeat(4, 1fr)",pt:"$7",direction:"rtl",gridGap:"$3 $1"}},I.map((t,r)=>{const o=t===n.getFullYear();return t?e.createElement(ee,{key:`${t}${r}`,theme:o?"primary":"neutral",onClick:()=>O(t),selected:o},t):e.createElement($,{key:r,css:{width:"$6",height:"$4"}})})),!a&&d.map(({month:t,year:r,weeks:o})=>e.createElement($,{key:`${t}${r}`},e.createElement(C,{css:{height:"$4",alignItems:"center",mb:"$4"}},e.createElement(x,{theme:"neutral",css:{px:"0",color:"$grey1000"},onClick:()=>E(!0)},N[t]," ",r)),e.createElement(h,{css:{mb:"$3"}},te(T,y).map(p=>e.createElement(K,{as:"span",size:"sm",weight:"bold",key:`${t}${r}${p}`,css:{textAlign:"center"}},p))),e.createElement(h,null,o.map((p,W)=>p.map((g,j)=>{const D=`${t}${r}${W}${j}`;if(!g)return e.createElement("div",{key:D});const{date:R,selected:b,today:v,prevMonth:U,nextMonth:q}=g;return e.createElement(Z,{isOutsideMonth:U||q,isSelected:b,isToday:v,key:D,ref:b?c:v?u:null,...P({dateObj:g}),type:"button"},R.getDate())})))))):null};S.displayName="Calendar";export{S as Calendar};
+import{ChevronLeft as _,ChevronRight as H}from"@atom-learning/icons";import{useDayzed as J}from"dayzed";import*as e from"react";import{ActionIcon as w}from"../action-icon/ActionIcon.js";import{Box as $}from"../box/Box.js";import{Button as x}from"../button/Button.js";import{Flex as C}from"../flex/Flex.js";import{Icon as Y}from"../icon/Icon.js";import{Text as K}from"../text/Text.js";import{styled as F}from"../../stitches.js";import{monthNamesShort as Q,weekdayNamesShort as V,DEFAULT_LABELS as X}from"./constants.js";import{Day as Z}from"./Day.js";const h=F("div",{display:"grid",gridTemplateColumns:"repeat(7, 1fr)",gridGap:"$1 $2"}),ee=F(x,{color:"$grey1000",p:"$3",width:"$6",variants:{selected:{false:{color:"$grey1000 !important",fontWeight:400,"&:hover":{bg:"$grey200 !important",color:"$grey1000 !important"},"&[disabled]":{bg:"white !important"}}}}}),te=(i,c)=>{const u=i.slice(0,c);return i.slice(c).concat(u)},S=({css:i,refDateSelected:c,refDateToday:u,firstDayOfWeek:y=0,monthNames:N=Q,weekdayNames:T=V,labels:f=X,date:n=new Date,minDate:l,maxDate:s,setYear:A,...L})=>{const[a,E]=e.useState(!1),[m,k]=e.useState(n==null?void 0:n.getFullYear()),O=t=>{const r=n;r.setFullYear(t),A(r),E(!1)},z=l&&m-16<=l.getFullYear(),B=s&&m>=s.getFullYear(),I=Array.from({length:16},(t,r)=>{const o=m-r;return s&&o>s.getFullYear()||l&&o<l.getFullYear()?0:o}),{calendars:d,getBackProps:M,getForwardProps:G,getDateProps:P}=J({firstDayOfWeek:y,showOutsideDays:!0,date:n,minDate:l,maxDate:s,...L});return d.length?e.createElement($,{css:{position:"relative",width:"min-content",mt:"-$1",...i}},e.createElement(C,{css:{position:"absolute",top:0,right:"-$1"}},e.createElement(w,{label:f[a?"previousYear":"previous"],theme:"neutral",size:"md",...!a&&M({calendars:d}),...a&&{onClick:()=>k(m-16)},disabled:a&&z},e.createElement(Y,{is:_})),e.createElement(w,{label:f[a?"nextYear":"next"],theme:"neutral",size:"md",...!a&&G({calendars:d}),...a&&{onClick:()=>k(m+16)},disabled:a&&B},e.createElement(Y,{is:H}))),a&&e.createElement(h,{css:{gridTemplateColumns:"repeat(4, 1fr)",pt:"$7",direction:"rtl",gridGap:"$3 $1"}},I.map((t,r)=>{const o=t===n.getFullYear();return t?e.createElement(ee,{key:`${t}${r}`,theme:o?"primary":"neutral",onClick:()=>O(t),selected:o},t):e.createElement($,{key:r,css:{width:"$6",height:"$4"}})})),!a&&d.map(({month:t,year:r,weeks:o})=>e.createElement($,{key:`${t}${r}`},e.createElement(C,{css:{height:"$4",alignItems:"center",mb:"$4"}},e.createElement(x,{theme:"neutral",css:{px:"0",color:"$grey1000"},onClick:()=>E(!0)},N[t]," ",r)),e.createElement(h,{css:{mb:"$3"}},te(T,y).map(p=>e.createElement(K,{as:"span",size:"sm",weight:"bold",key:`${t}${r}${p}`,css:{textAlign:"center"}},p))),e.createElement(h,null,o.map((p,W)=>p.map((g,j)=>{const D=`${t}${r}${W}${j}`;if(!g)return e.createElement("div",{key:D});const{date:R,selected:b,today:v,prevMonth:U,nextMonth:q}=g;return e.createElement(Z,{isOutsideMonth:U||q,isSelected:b,isToday:v,key:D,ref:b?c:v?u:null,...P({dateObj:g}),type:"button"},R.getDate())})))))):null};S.displayName="Calendar";export{S as Calendar};
 //# sourceMappingURL=Calendar.js.map

package/dist/components/calendar/Calendar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Calendar.js","sources":["../../../src/components/calendar/Calendar.tsx"],"sourcesContent":["import { ChevronLeft, ChevronRight } from '@atom-learning/icons'\nimport type { Props as DayzedInterface } from 'dayzed'\nimport { useDayzed } from 'dayzed'\nimport * as React from 'react'\n\nimport { ActionIcon } from '~/components/action-icon'\nimport { Box } from '~/components/box'\nimport { Button } from '~/components/button'\nimport { Flex } from '~/components/flex'\nimport { Icon } from '~/components/icon'\nimport { Text } from '~/components/text'\nimport type { CSS } from '~/stitches'\nimport { styled } from '~/stitches'\n\nimport { DEFAULT_LABELS, monthNamesShort, weekdayNamesShort } from './constants'\nimport { Day } from './Day'\n\nconst Grid = styled('div', {\n display: 'grid',\n gridTemplateColumns: 'repeat(7, 1fr)',\n gridGap: '$1 $2'\n})\n\nconst StyledButton = styled(Button, {\n color: '$grey1000',\n p: '$3',\n width: '$6',\n variants: {\n selected: {\n false: {\n color: '$grey1000 !important',\n fontWeight: '400',\n '&:hover': {\n bg: '$grey200 !important',\n color: '$grey1000 !important'\n },\n '&[disabled]': { bg: 'white !important' }\n }\n }\n }\n})\n\nexport type CalendarTranslationProps = {\n monthNames?: string[]\n weekdayNames?: string[]\n labels?: {\n open: string\n next: string\n previous: string\n nextYear: string\n previousYear: string\n }\n}\n\ntype CalendarProps = DayzedInterface &\n CalendarTranslationProps & {\n css?: CSS\n refDateToday?: React.RefObject<HTMLButtonElement>\n refDateSelected?: React.RefObject<HTMLButtonElement>\n setYear: (date: Date) => Promise<void>\n }\n\nconst offsetWeekdayNames = (\n weekdayNames: string[],\n firstDayOfWeek: number\n): string[] => {\n const start = weekdayNames.slice(0, firstDayOfWeek)\n const end = weekdayNames.slice(firstDayOfWeek)\n return end.concat(start)\n}\n\nexport const Calendar = ({\n css,\n refDateSelected,\n refDateToday,\n firstDayOfWeek = 0,\n monthNames = monthNamesShort,\n weekdayNames = weekdayNamesShort,\n labels = DEFAULT_LABELS,\n date = new Date(),\n minDate,\n maxDate,\n setYear,\n ...remainingProps\n}: CalendarProps) => {\n const [showYears, setShowYears] = React.useState<boolean>(false)\n const [currentYear, setCurrentYear] = React.useState<number>(\n date?.getFullYear()\n )\n\n const handleSetYear = (year: number): void => {\n const newDate = date\n newDate.setFullYear(year)\n setYear(newDate)\n setShowYears(false)\n }\n\n const isAtMinYear = minDate && currentYear - 16 <= minDate.getFullYear()\n const isAtMaxYear = maxDate && currentYear >= maxDate.getFullYear()\n\n const yearList = Array.from({ length: 16 }, (_, i) => {\n const year = currentYear - i\n if (\n (maxDate && year > maxDate.getFullYear()) \|\|\n (minDate && year < minDate.getFullYear())\n )\n return 0\n return year\n })\n\n const { calendars, getBackProps, getForwardProps, getDateProps } = useDayzed({\n firstDayOfWeek,\n showOutsideDays: true,\n date,\n minDate,\n maxDate,\n ...remainingProps\n })\n\n if (!calendars.length) return null\n\n return (\n <Box\n css={{ position: 'relative', width: 'min-content', mt: '-$1', ...css }}\n >\n <Flex css={{ position: 'absolute', top: 0, right: '-$1' }}>\n <ActionIcon\n label={labels[showYears ? 'previousYear' : 'previous']}\n theme=\"neutral\"\n size=\"md\"\n {...(!showYears && getBackProps({ calendars }))}\n {...(showYears && {\n onClick: () => setCurrentYear(currentYear - 16)\n })}\n disabled={showYears && isAtMinYear}\n >\n <Icon is={ChevronLeft} />\n </ActionIcon>\n <ActionIcon\n label={labels[showYears ? 'nextYear' : 'next']}\n theme=\"neutral\"\n size=\"md\"\n {...(!showYears && getForwardProps({ calendars }))}\n {...(showYears && {\n onClick: () => setCurrentYear(currentYear + 16)\n })}\n disabled={showYears && isAtMaxYear}\n >\n <Icon is={ChevronRight} />\n </ActionIcon>\n </Flex>\n {showYears && (\n <Grid\n css={{\n gridTemplateColumns: 'repeat(4, 1fr)',\n pt: '$7',\n direction: 'rtl',\n gridGap: '$3 $1'\n }}\n >\n {yearList.map((year, i) => {\n const isCurrentYear = year === date.getFullYear()\n if (!year)\n return <Box key={i} css={{ width: '$6', height: '$4' }} />\n\n return (\n <StyledButton\n key={`${year}${i}`}\n theme={isCurrentYear ? 'primary' : 'neutral'}\n onClick={() => handleSetYear(year)}\n selected={isCurrentYear}\n >\n {year}\n </StyledButton>\n )\n })}\n </Grid>\n )}\n {!showYears &&\n calendars.map(({ month, year, weeks }) => (\n <Box key={`${month}${year}`}>\n <Flex css={{ height: '$4', alignItems: 'center', mb: '$4' }}>\n <Button\n theme=\"neutral\"\n css={{ px: '0', color: '$grey1000' }}\n onClick={() => setShowYears(true)}\n >\n {monthNames[month]} {year}\n </Button>\n </Flex>\n <Grid css={{ mb: '$3' }}>\n {offsetWeekdayNames(weekdayNames, firstDayOfWeek).map(\n (weekday) => (\n <Text\n as=\"span\"\n size=\"sm\"\n weight=\"bold\"\n key={`${month}${year}${weekday}`}\n css={{ textAlign: 'center' }}\n >\n {weekday}\n </Text>\n )\n )}\n </Grid>\n <Grid>\n {weeks.map((week, weekIndex) =>\n week.map((dateObj, index) => {\n const key = `${month}${year}${weekIndex}${index}`\n\n if (!dateObj) return <div key={key} />\n\n const { date, selected, today, prevMonth, nextMonth } =\n dateObj\n\n return (\n <Day\n isOutsideMonth={prevMonth \|\| nextMonth}\n isSelected={selected}\n isToday={today}\n key={key}\n ref={\n selected ? refDateSelected : today ? refDateToday : null\n }\n {...getDateProps({ dateObj })}\n type=\"button\"\n >\n {date.getDate()}\n </Day>\n )\n })\n )}\n </Grid>\n </Box>\n ))}\n </Box>\n )\n}\n\nCalendar.displayName = 'Calendar'\n"],"names":["Grid","styled","StyledButton","Button","offsetWeekdayNames","weekdayNames","firstDayOfWeek","start","Calendar","css","refDateSelected","refDateToday","monthNames","monthNamesShort","weekdayNamesShort","labels","DEFAULT_LABELS","date","minDate","maxDate","setYear","remainingProps","showYears","setShowYears","React","currentYear","setCurrentYear","handleSetYear","year","newDate","isAtMinYear","isAtMaxYear","yearList","_","i","calendars","getBackProps","getForwardProps","getDateProps","useDayzed","Box","Flex","ActionIcon","Icon","ChevronLeft","ChevronRight","isCurrentYear","month","weeks","weekday","Text","week","weekIndex","dateObj","index","key","selected","today","prevMonth","nextMonth","Day"],"mappings":"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"}
1	+ {"version":3,"file":"Calendar.js","sources":["../../../src/components/calendar/Calendar.tsx"],"sourcesContent":["import { ChevronLeft, ChevronRight } from '@atom-learning/icons'\nimport type { Props as DayzedInterface } from 'dayzed'\nimport { useDayzed } from 'dayzed'\nimport * as React from 'react'\n\nimport { ActionIcon } from '~/components/action-icon'\nimport { Box } from '~/components/box'\nimport { Button } from '~/components/button'\nimport { Flex } from '~/components/flex'\nimport { Icon } from '~/components/icon'\nimport { Text } from '~/components/text'\nimport type { CSS } from '~/stitches'\nimport { styled } from '~/stitches'\n\nimport { DEFAULT_LABELS, monthNamesShort, weekdayNamesShort } from './constants'\nimport { Day } from './Day'\n\nconst Grid = styled('div', {\n display: 'grid',\n gridTemplateColumns: 'repeat(7, 1fr)',\n gridGap: '$1 $2'\n})\n\nconst StyledButton = styled(Button, {\n color: '$grey1000',\n p: '$3',\n width: '$6',\n variants: {\n selected: {\n false: {\n color: '$grey1000 !important',\n fontWeight: 400,\n '&:hover': {\n bg: '$grey200 !important',\n color: '$grey1000 !important'\n },\n '&[disabled]': { bg: 'white !important' }\n }\n }\n }\n})\n\nexport type CalendarTranslationProps = {\n monthNames?: string[]\n weekdayNames?: string[]\n labels?: {\n open: string\n next: string\n previous: string\n nextYear: string\n previousYear: string\n }\n}\n\ntype CalendarProps = DayzedInterface &\n CalendarTranslationProps & {\n css?: CSS\n refDateToday?: React.RefObject<HTMLButtonElement>\n refDateSelected?: React.RefObject<HTMLButtonElement>\n setYear: (date: Date) => Promise<void>\n }\n\nconst offsetWeekdayNames = (\n weekdayNames: string[],\n firstDayOfWeek: number\n): string[] => {\n const start = weekdayNames.slice(0, firstDayOfWeek)\n const end = weekdayNames.slice(firstDayOfWeek)\n return end.concat(start)\n}\n\nexport const Calendar = ({\n css,\n refDateSelected,\n refDateToday,\n firstDayOfWeek = 0,\n monthNames = monthNamesShort,\n weekdayNames = weekdayNamesShort,\n labels = DEFAULT_LABELS,\n date = new Date(),\n minDate,\n maxDate,\n setYear,\n ...remainingProps\n}: CalendarProps) => {\n const [showYears, setShowYears] = React.useState<boolean>(false)\n const [currentYear, setCurrentYear] = React.useState<number>(\n date?.getFullYear()\n )\n\n const handleSetYear = (year: number): void => {\n const newDate = date\n newDate.setFullYear(year)\n setYear(newDate)\n setShowYears(false)\n }\n\n const isAtMinYear = minDate && currentYear - 16 <= minDate.getFullYear()\n const isAtMaxYear = maxDate && currentYear >= maxDate.getFullYear()\n\n const yearList = Array.from({ length: 16 }, (_, i) => {\n const year = currentYear - i\n if (\n (maxDate && year > maxDate.getFullYear()) \|\|\n (minDate && year < minDate.getFullYear())\n )\n return 0\n return year\n })\n\n const { calendars, getBackProps, getForwardProps, getDateProps } = useDayzed({\n firstDayOfWeek,\n showOutsideDays: true,\n date,\n minDate,\n maxDate,\n ...remainingProps\n })\n\n if (!calendars.length) return null\n\n return (\n <Box\n css={{ position: 'relative', width: 'min-content', mt: '-$1', ...css }}\n >\n <Flex css={{ position: 'absolute', top: 0, right: '-$1' }}>\n <ActionIcon\n label={labels[showYears ? 'previousYear' : 'previous']}\n theme=\"neutral\"\n size=\"md\"\n {...(!showYears && getBackProps({ calendars }))}\n {...(showYears && {\n onClick: () => setCurrentYear(currentYear - 16)\n })}\n disabled={showYears && isAtMinYear}\n >\n <Icon is={ChevronLeft} />\n </ActionIcon>\n <ActionIcon\n label={labels[showYears ? 'nextYear' : 'next']}\n theme=\"neutral\"\n size=\"md\"\n {...(!showYears && getForwardProps({ calendars }))}\n {...(showYears && {\n onClick: () => setCurrentYear(currentYear + 16)\n })}\n disabled={showYears && isAtMaxYear}\n >\n <Icon is={ChevronRight} />\n </ActionIcon>\n </Flex>\n {showYears && (\n <Grid\n css={{\n gridTemplateColumns: 'repeat(4, 1fr)',\n pt: '$7',\n direction: 'rtl',\n gridGap: '$3 $1'\n }}\n >\n {yearList.map((year, i) => {\n const isCurrentYear = year === date.getFullYear()\n if (!year)\n return <Box key={i} css={{ width: '$6', height: '$4' }} />\n\n return (\n <StyledButton\n key={`${year}${i}`}\n theme={isCurrentYear ? 'primary' : 'neutral'}\n onClick={() => handleSetYear(year)}\n selected={isCurrentYear}\n >\n {year}\n </StyledButton>\n )\n })}\n </Grid>\n )}\n {!showYears &&\n calendars.map(({ month, year, weeks }) => (\n <Box key={`${month}${year}`}>\n <Flex css={{ height: '$4', alignItems: 'center', mb: '$4' }}>\n <Button\n theme=\"neutral\"\n css={{ px: '0', color: '$grey1000' }}\n onClick={() => setShowYears(true)}\n >\n {monthNames[month]} {year}\n </Button>\n </Flex>\n <Grid css={{ mb: '$3' }}>\n {offsetWeekdayNames(weekdayNames, firstDayOfWeek).map(\n (weekday) => (\n <Text\n as=\"span\"\n size=\"sm\"\n weight=\"bold\"\n key={`${month}${year}${weekday}`}\n css={{ textAlign: 'center' }}\n >\n {weekday}\n </Text>\n )\n )}\n </Grid>\n <Grid>\n {weeks.map((week, weekIndex) =>\n week.map((dateObj, index) => {\n const key = `${month}${year}${weekIndex}${index}`\n\n if (!dateObj) return <div key={key} />\n\n const { date, selected, today, prevMonth, nextMonth } =\n dateObj\n\n return (\n <Day\n isOutsideMonth={prevMonth \|\| nextMonth}\n isSelected={selected}\n isToday={today}\n key={key}\n ref={\n selected ? refDateSelected : today ? refDateToday : null\n }\n {...getDateProps({ dateObj })}\n type=\"button\"\n >\n {date.getDate()}\n </Day>\n )\n })\n )}\n </Grid>\n </Box>\n ))}\n </Box>\n )\n}\n\nCalendar.displayName = 'Calendar'\n"],"names":["Grid","styled","StyledButton","Button","offsetWeekdayNames","weekdayNames","firstDayOfWeek","start","Calendar","css","refDateSelected","refDateToday","monthNames","monthNamesShort","weekdayNamesShort","labels","DEFAULT_LABELS","date","minDate","maxDate","setYear","remainingProps","showYears","setShowYears","React","currentYear","setCurrentYear","handleSetYear","year","newDate","isAtMinYear","isAtMaxYear","yearList","_","i","calendars","getBackProps","getForwardProps","getDateProps","useDayzed","Box","Flex","ActionIcon","Icon","ChevronLeft","ChevronRight","isCurrentYear","month","weeks","weekday","Text","week","weekIndex","dateObj","index","key","selected","today","prevMonth","nextMonth","Day"],"mappings":"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"}

package/dist/components/chip/Chip.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import*as e from"react";import{Box as x}from"../box/Box.js";import{Flex as C}from"../flex/Flex.js";import{Icon as l}from"../icon/Icon.js";import{getTextVariant as s}from"../text/Text.js";import{styled as c}from"../../stitches.js";import{overrideStitchesVariantValue as g}from"../../utilities/override-stitches-variant-value/overrideStitchesVariantValue.js";const p={overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},d=c("span",{display:"inline-flex",alignItems:"center",px:"$1",flexGrow:1,...p,"& > *:not(:last-child)":{mr:"$1"}}),z={sm:"sm",md:"sm",lg:"md"},m=t=>{const r=e.useContext(a),{size:o}=r,n=e.useMemo(()=>g(o,i=>z[i]),[o]);return e.createElement(l,{...t,size:n})},u=({children:t,...r})=>{const o=e.Children.toArray(t),n=o.length<=1;return e.createElement(d,{...r},o.map((i,$)=>!n&&typeof i=="string"?e.createElement(x,{as:"span",css:p,key:i},i):e.isValidElement(i)&&i.type===l?e.createElement(m,{key:`icon-${$}`,...i.props}):i))},h=c(C,{px:"$2",border:"1px solid",borderRadius:"$0",alignItems:"center",fontFamily:"$body",maxWidth:"100%",borderColor:"$primary800",color:"$primary900",bg:"$primary100","&[data-disabled]":{opacity:"0.3",pointerEvents:"none"},variants:{size:{sm:{height:"$2",...s({size:"sm"})},md:{height:"$3",...s({size:"sm"})},lg:{height:"$4",...s({size:"md"})}}}}),a=e.createContext({}),y=({size:t,children:r})=>{const o=e.useMemo(()=>({size:t}),[t]);return e.createElement(a.Provider,{value:o},r)},f=e.forwardRef(({size:t="md",...r},o)=>e.createElement(y,{size:t},e.createElement(h,{ref:o,size:t,...r}))),E=Object.assign(f,{Content:u,Icon:m});f.displayName="Chip";export{E as Chip,m as ChipIcon,a as ChipRootContext,y as ChipRootProvider,d as StyledChipContent,h as StyledRoot};
+import*as e from"react";import{Box as x}from"../box/Box.js";import{Flex as C}from"../flex/Flex.js";import{Icon as l}from"../icon/Icon.js";import{getTextVariant as s}from"../text/Text.js";import{styled as c}from"../../stitches.js";import{overrideStitchesVariantValue as g}from"../../utilities/override-stitches-variant-value/overrideStitchesVariantValue.js";const p={overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},d=c("span",{display:"inline-flex",alignItems:"center",px:"$1",flexGrow:1,...p,"& > *:not(:last-child)":{mr:"$1"}}),z={sm:"sm",md:"sm",lg:"md"},m=t=>{const r=e.useContext(a),{size:o}=r,n=e.useMemo(()=>g(o,i=>z[i]),[o]);return e.createElement(l,{...t,size:n})},u=({children:t,...r})=>{const o=e.Children.toArray(t),n=o.length<=1;return e.createElement(d,{...r},o.map((i,$)=>!n&&typeof i=="string"?e.createElement(x,{as:"span",css:p,key:i},i):e.isValidElement(i)&&i.type===l?e.createElement(m,{key:`icon-${$}`,...i.props}):i))},h=c(C,{px:"$2",border:"1px solid",borderRadius:"$0",alignItems:"center",fontFamily:"$body",maxWidth:"100%",borderColor:"$primary800",color:"$primary900",bg:"$primary100","&[disabled]":{opacity:"0.3",pointerEvents:"none"},variants:{size:{sm:{height:"$2",...s({size:"sm"})},md:{height:"$3",...s({size:"sm"})},lg:{height:"$4",...s({size:"md"})}}}}),a=e.createContext({}),y=({size:t,children:r})=>{const o=e.useMemo(()=>({size:t}),[t]);return e.createElement(a.Provider,{value:o},r)},f=e.forwardRef(({size:t="md",...r},o)=>e.createElement(y,{size:t},e.createElement(h,{ref:o,size:t,...r}))),E=Object.assign(f,{Content:u,Icon:m});f.displayName="Chip";export{E as Chip,m as ChipIcon,a as ChipRootContext,y as ChipRootProvider,d as StyledChipContent,h as StyledRoot};
 //# sourceMappingURL=Chip.js.map

package/dist/components/chip/Chip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Chip.js","sources":["../../../src/components/chip/Chip.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Box } from '~/components/box'\nimport { Flex } from '~/components/flex'\nimport { Icon } from '~/components/icon'\nimport { getTextVariant } from '~/components/text'\nimport { styled } from '~/stitches'\nimport { overrideStitchesVariantValue } from '~/utilities/override-stitches-variant-value/overrideStitchesVariantValue'\n\nconst overflowElipsis = {\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap'\n}\nexport const StyledChipContent = styled('span', {\n display: 'inline-flex',\n alignItems: 'center',\n px: '$1',\n flexGrow: 1,\n ...overflowElipsis,\n '& > *:not(:last-child)': {\n mr: '$1'\n }\n})\n\nconst toIconSize = { sm: 'sm', md: 'sm', lg: 'md' }\n\nexport const ChipIcon = (props: React.ComponentProps<typeof Icon>) => {\n const rootContext = React.useContext(ChipRootContext)\n const { size } = rootContext\n const iconSize = React.useMemo(\n () => overrideStitchesVariantValue(size, (s) => toIconSize[s]),\n [size]\n )\n return <Icon {...props} size={iconSize} />\n}\n\nconst ChipContent = ({ children, ...rest }) => {\n const childrenArray = React.Children.toArray(children)\n const isSingleChild = childrenArray.length <= 1\n return (\n <StyledChipContent {...rest}>\n {\n childrenArray.map((child, index) => {\n if (!isSingleChild && typeof child === 'string')\n return (\n <Box as=\"span\" css={overflowElipsis} key={child}>\n {child}\n </Box>\n )\n if (React.isValidElement(child) && child.type === Icon) {\n return <ChipIcon key={`icon-${index}`} {...child.props} />\n }\n return child\n }) as React.ReactElement[]\n }\n </StyledChipContent>\n )\n}\n\nexport const StyledRoot = styled(Flex, {\n px: '$2',\n border: '1px solid',\n borderRadius: '$0',\n alignItems: 'center',\n fontFamily: '$body',\n maxWidth: '100%',\n borderColor: '$primary800',\n color: '$primary900',\n bg: '$primary100',\n '&[~~data-~~disabled]': {\n opacity: '0.3',\n pointerEvents: 'none'\n },\n variants: {\n size: {\n sm: {\n height: '$2',\n ...getTextVariant({ size: 'sm' })\n },\n md: {\n height: '$3',\n ...getTextVariant({ size: 'sm' })\n },\n lg: {\n height: '$4',\n ...getTextVariant({ size: 'md' })\n }\n }\n }\n})\n\nexport type TChipRootContext = React.ComponentProps<typeof StyledRoot>\nexport type TChipRootProviderProps = TChipRootContext\n\nexport const ChipRootContext = React.createContext<TChipRootContext>({})\n\nexport const ChipRootProvider = ({\n size,\n children\n}: TChipRootProviderProps) => {\n const value = React.useMemo<TChipRootContext>(() => ({ size }), [size])\n return (\n <ChipRootContext.Provider value={value}>\n {children}\n </ChipRootContext.Provider>\n )\n}\n\nexport type TChipRootProps = TChipRootProviderProps\n\nconst ChipRoot: React.ForwardRefExoticComponent<TChipRootProps> =\n React.forwardRef(({ size = 'md', ...rest }, ref) => {\n return (\n <ChipRootProvider size={size}>\n <StyledRoot ref={ref} size={size} {...rest} />\n </ChipRootProvider>\n )\n })\n\nexport const Chip = Object.assign(ChipRoot, {\n Content: ChipContent,\n Icon: ChipIcon\n})\n\nChipRoot.displayName = 'Chip'\n"],"names":["overflowElipsis","StyledChipContent","styled","toIconSize","ChipIcon","props","rootContext","React","ChipRootContext","size","iconSize","overrideStitchesVariantValue","s","Icon","ChipContent","children","rest","childrenArray","isSingleChild","child","index","Box","StyledRoot","Flex","getTextVariant","ChipRootProvider","value","ChipRoot","ref","Chip"],"mappings":"qWASA,MAAMA,EAAkB,CACtB,SAAU,SACV,aAAc,WACd,WAAY,QACd,EACaC,EAAoBC,EAAO,OAAQ,CAC9C,QAAS,cACT,WAAY,SACZ,GAAI,KACJ,SAAU,EACV,GAAGF,EACH,yBAA0B,CACxB,GAAI,IACN,CACF,CAAC,EAEKG,EAAa,CAAE,GAAI,KAAM,GAAI,KAAM,GAAI,IAAK,EAErCC,EAAYC,GAA6C,CACpE,MAAMC,EAAcC,EAAM,WAAWC,CAAe,EAC9C,CAAE,KAAAC,CAAK,EAAIH,EACXI,EAAWH,EAAM,QACrB,IAAMI,EAA6BF,EAAOG,GAAMT,EAAWS,EAAE,EAC7D,CAACH,CAAI,CACP,EACA,OAAOF,EAAA,cAACM,EAAA,CAAM,GAAGR,EAAO,KAAMK,EAAU,CAC1C,EAEMI,EAAc,CAAC,CAAE,SAAAC,KAAaC,CAAK,IAAM,CAC7C,MAAMC,EAAgBV,EAAM,SAAS,QAAQQ,CAAQ,EAC/CG,EAAgBD,EAAc,QAAU,EAC9C,OACEV,EAAA,cAACN,GAAmB,GAAGe,CAAAA,EAEnBC,EAAc,IAAI,CAACE,EAAOC,IACpB,CAACF,GAAiB,OAAOC,GAAU,SAEnCZ,EAAA,cAACc,EAAA,CAAI,GAAG,OAAO,IAAKrB,EAAiB,IAAKmB,CACvCA,EAAAA,CACH,EAEAZ,EAAM,eAAeY,CAAK,GAAKA,EAAM,OAASN,EACzCN,EAAA,cAACH,EAAA,CAAS,IAAK,QAAQgB,IAAU,GAAGD,EAAM,KAAO,CAAA,EAEnDA,CACR,CAEL,CAEJ,EAEaG,EAAapB,EAAOqB,EAAM,CACrC,GAAI,KACJ,OAAQ,YACR,aAAc,KACd,WAAY,SACZ,WAAY,QACZ,SAAU,OACV,YAAa,cACb,MAAO,cACP,GAAI,cACJ,~~mBAAoB~~,~~CAClB~~,QAAS,MACT,cAAe,MACjB,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CACF,OAAQ,KACR,GAAGC,EAAe,CAAE,KAAM,IAAK,CAAC,CAClC,EACA,GAAI,CACF,OAAQ,KACR,GAAGA,EAAe,CAAE,KAAM,IAAK,CAAC,CAClC,EACA,GAAI,CACF,OAAQ,KACR,GAAGA,EAAe,CAAE,KAAM,IAAK,CAAC,CAClC,CACF,CACF,CACF,CAAC,EAKYhB,EAAkBD,EAAM,cAAgC,CAAA,CAAE,EAE1DkB,EAAmB,CAAC,CAC/B,KAAAhB,EACA,SAAAM,CACF,IAA8B,CAC5B,MAAMW,EAAQnB,EAAM,QAA0B,KAAO,CAAE,KAAAE,CAAK,GAAI,CAACA,CAAI,CAAC,EACtE,OACEF,EAAA,cAACC,EAAgB,SAAhB,CAAyB,MAAOkB,GAC9BX,CACH,CAEJ,EAIMY,EACJpB,EAAM,WAAW,CAAC,CAAE,KAAAE,EAAO,QAASO,CAAK,EAAGY,IAExCrB,EAAA,cAACkB,GAAiB,KAAMhB,CAAAA,EACtBF,EAAA,cAACe,EAAA,CAAW,IAAKM,EAAK,KAAMnB,EAAO,GAAGO,EAAM,CAC9C,CAEH,EAEUa,EAAO,OAAO,OAAOF,EAAU,CAC1C,QAASb,EACT,KAAMV,CACR,CAAC,EAEDuB,EAAS,YAAc"}
1	+ {"version":3,"file":"Chip.js","sources":["../../../src/components/chip/Chip.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Box } from '~/components/box'\nimport { Flex } from '~/components/flex'\nimport { Icon } from '~/components/icon'\nimport { getTextVariant } from '~/components/text'\nimport { styled } from '~/stitches'\nimport { overrideStitchesVariantValue } from '~/utilities/override-stitches-variant-value/overrideStitchesVariantValue'\n\nconst overflowElipsis = {\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap'\n}\nexport const StyledChipContent = styled('span', {\n display: 'inline-flex',\n alignItems: 'center',\n px: '$1',\n flexGrow: 1,\n ...overflowElipsis,\n '& > *:not(:last-child)': {\n mr: '$1'\n }\n})\n\nconst toIconSize = { sm: 'sm', md: 'sm', lg: 'md' }\n\nexport const ChipIcon = (props: React.ComponentProps<typeof Icon>) => {\n const rootContext = React.useContext(ChipRootContext)\n const { size } = rootContext\n const iconSize = React.useMemo(\n () => overrideStitchesVariantValue(size, (s) => toIconSize[s]),\n [size]\n )\n return <Icon {...props} size={iconSize} />\n}\n\nconst ChipContent = ({ children, ...rest }) => {\n const childrenArray = React.Children.toArray(children)\n const isSingleChild = childrenArray.length <= 1\n return (\n <StyledChipContent {...rest}>\n {\n childrenArray.map((child, index) => {\n if (!isSingleChild && typeof child === 'string')\n return (\n <Box as=\"span\" css={overflowElipsis} key={child}>\n {child}\n </Box>\n )\n if (React.isValidElement(child) && child.type === Icon) {\n return <ChipIcon key={`icon-${index}`} {...child.props} />\n }\n return child\n }) as React.ReactElement[]\n }\n </StyledChipContent>\n )\n}\n\nexport const StyledRoot = styled(Flex, {\n px: '$2',\n border: '1px solid',\n borderRadius: '$0',\n alignItems: 'center',\n fontFamily: '$body',\n maxWidth: '100%',\n borderColor: '$primary800',\n color: '$primary900',\n bg: '$primary100',\n '&[disabled]': {\n opacity: '0.3',\n pointerEvents: 'none'\n },\n variants: {\n size: {\n sm: {\n height: '$2',\n ...getTextVariant({ size: 'sm' })\n },\n md: {\n height: '$3',\n ...getTextVariant({ size: 'sm' })\n },\n lg: {\n height: '$4',\n ...getTextVariant({ size: 'md' })\n }\n }\n }\n})\n\nexport type TChipRootContext = React.ComponentProps<typeof StyledRoot>\nexport type TChipRootProviderProps = TChipRootContext\n\nexport const ChipRootContext = React.createContext<TChipRootContext>({})\n\nexport const ChipRootProvider = ({\n size,\n children\n}: TChipRootProviderProps) => {\n const value = React.useMemo<TChipRootContext>(() => ({ size }), [size])\n return (\n <ChipRootContext.Provider value={value}>\n {children}\n </ChipRootContext.Provider>\n )\n}\n\nexport type TChipRootProps = TChipRootProviderProps\n\nconst ChipRoot: React.ForwardRefExoticComponent<TChipRootProps> =\n React.forwardRef(({ size = 'md', ...rest }, ref) => {\n return (\n <ChipRootProvider size={size}>\n <StyledRoot ref={ref} size={size} {...rest} />\n </ChipRootProvider>\n )\n })\n\nexport const Chip = Object.assign(ChipRoot, {\n Content: ChipContent,\n Icon: ChipIcon\n})\n\nChipRoot.displayName = 'Chip'\n"],"names":["overflowElipsis","StyledChipContent","styled","toIconSize","ChipIcon","props","rootContext","React","ChipRootContext","size","iconSize","overrideStitchesVariantValue","s","Icon","ChipContent","children","rest","childrenArray","isSingleChild","child","index","Box","StyledRoot","Flex","getTextVariant","ChipRootProvider","value","ChipRoot","ref","Chip"],"mappings":"qWASA,MAAMA,EAAkB,CACtB,SAAU,SACV,aAAc,WACd,WAAY,QACd,EACaC,EAAoBC,EAAO,OAAQ,CAC9C,QAAS,cACT,WAAY,SACZ,GAAI,KACJ,SAAU,EACV,GAAGF,EACH,yBAA0B,CACxB,GAAI,IACN,CACF,CAAC,EAEKG,EAAa,CAAE,GAAI,KAAM,GAAI,KAAM,GAAI,IAAK,EAErCC,EAAYC,GAA6C,CACpE,MAAMC,EAAcC,EAAM,WAAWC,CAAe,EAC9C,CAAE,KAAAC,CAAK,EAAIH,EACXI,EAAWH,EAAM,QACrB,IAAMI,EAA6BF,EAAOG,GAAMT,EAAWS,EAAE,EAC7D,CAACH,CAAI,CACP,EACA,OAAOF,EAAA,cAACM,EAAA,CAAM,GAAGR,EAAO,KAAMK,EAAU,CAC1C,EAEMI,EAAc,CAAC,CAAE,SAAAC,KAAaC,CAAK,IAAM,CAC7C,MAAMC,EAAgBV,EAAM,SAAS,QAAQQ,CAAQ,EAC/CG,EAAgBD,EAAc,QAAU,EAC9C,OACEV,EAAA,cAACN,GAAmB,GAAGe,CAAAA,EAEnBC,EAAc,IAAI,CAACE,EAAOC,IACpB,CAACF,GAAiB,OAAOC,GAAU,SAEnCZ,EAAA,cAACc,EAAA,CAAI,GAAG,OAAO,IAAKrB,EAAiB,IAAKmB,CACvCA,EAAAA,CACH,EAEAZ,EAAM,eAAeY,CAAK,GAAKA,EAAM,OAASN,EACzCN,EAAA,cAACH,EAAA,CAAS,IAAK,QAAQgB,IAAU,GAAGD,EAAM,KAAO,CAAA,EAEnDA,CACR,CAEL,CAEJ,EAEaG,EAAapB,EAAOqB,EAAM,CACrC,GAAI,KACJ,OAAQ,YACR,aAAc,KACd,WAAY,SACZ,WAAY,QACZ,SAAU,OACV,YAAa,cACb,MAAO,cACP,GAAI,cACJ,cAAe,CACb,QAAS,MACT,cAAe,MACjB,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CACF,OAAQ,KACR,GAAGC,EAAe,CAAE,KAAM,IAAK,CAAC,CAClC,EACA,GAAI,CACF,OAAQ,KACR,GAAGA,EAAe,CAAE,KAAM,IAAK,CAAC,CAClC,EACA,GAAI,CACF,OAAQ,KACR,GAAGA,EAAe,CAAE,KAAM,IAAK,CAAC,CAClC,CACF,CACF,CACF,CAAC,EAKYhB,EAAkBD,EAAM,cAAgC,CAAA,CAAE,EAE1DkB,EAAmB,CAAC,CAC/B,KAAAhB,EACA,SAAAM,CACF,IAA8B,CAC5B,MAAMW,EAAQnB,EAAM,QAA0B,KAAO,CAAE,KAAAE,CAAK,GAAI,CAACA,CAAI,CAAC,EACtE,OACEF,EAAA,cAACC,EAAgB,SAAhB,CAAyB,MAAOkB,GAC9BX,CACH,CAEJ,EAIMY,EACJpB,EAAM,WAAW,CAAC,CAAE,KAAAE,EAAO,QAASO,CAAK,EAAGY,IAExCrB,EAAA,cAACkB,GAAiB,KAAMhB,CAAAA,EACtBF,EAAA,cAACe,EAAA,CAAW,IAAKM,EAAK,KAAMnB,EAAO,GAAGO,EAAM,CAC9C,CAEH,EAEUa,EAAO,OAAO,OAAOF,EAAU,CAC1C,QAASb,EACT,KAAMV,CACR,CAAC,EAEDuB,EAAS,YAAc"}

package/dist/components/data-table/DataTable.d.ts CHANGED Viewed

@@ -1039,7 +1039,7 @@ export declare const DataTable: (({ columns, data: dataProp, getAsyncData, defau
     } & {
         numberOfStickyColumns?: number | undefined;
         scrollContainerCss?: import("../..").CSS | undefined;
-        controlColumnCount?: number | undefined;
+        scrollContainerkey?: string | undefined;
         maxRowDepth?: number | undefined;
     }, "children" | "numberOfStickyColumns"> & Partial<Pick<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & {
         ref?: ((instance: HTMLTableSectionElement | null) => void) | import("react").RefObject<HTMLTableSectionElement> | null | undefined;

package/dist/components/data-table/DataTableTable.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import*as e from"react";import{Table as h}from"../table/Table.js";import{DataTable as l}from"./DataTable.js";import{AsyncDataState as D}from"./DataTable.types.js";import{useDataTable as E}from"./DataTableContext.js";import{DataTableLoading as T}from"./DataTableLoading.js";const k=({sortable:m,striped:c,theme:i,css:p,scrollOptions:t={numberOfStickyColumns:0,hasStickyHeader:!1},...d})=>{const{asyncDataState:u,getTotalRows:b,getCanSomeRowsExpand:o,getGroupedRowModel:y,enableRowSelection:r}=E(),n=u===D.PENDING,C=!n&&b()===0,f=()=>y().flatRows.reduce((a,s)=>(s.depth>a&&(a=s.depth),a),0),S=()=>o()&&!!r?2:o()||!!r?1:0;return C?null:e.createElement(e.Fragment,null,e.createElement(T,null),e.createElement(h,{...d,numberOfStickyColumns:t.numberOfStickyColumns,scrollContainerCss:t.scrollContainerCss,controlColumnCount:S(),maxRowDepth:f(),css:{...p,...n&&{opacity:.5,pointerEvents:"none",transition:"opacity 250ms linear 150ms"}}},e.createElement(l.Head,{theme:i,sortable:m,isSticky:t.hasStickyHeader,css:t.headerCss}),e.createElement(l.Body,{striped:c})))};export{k as DataTableTable};
+import*as e from"react";import{Table as f}from"../table/Table.js";import{DataTable as s}from"./DataTable.js";import{AsyncDataState as S}from"./DataTable.types.js";import{useDataTable as E}from"./DataTableContext.js";import{DataTableLoading as k}from"./DataTableLoading.js";const D=({sortable:l,striped:m,theme:c,css:i,scrollOptions:t={numberOfStickyColumns:0,hasStickyHeader:!1},...p})=>{const{asyncDataState:u,getTotalRows:b,getCanSomeRowsExpand:r,enableRowSelection:n,tableId:y}=E(),o=u===S.PENDING,C=!o&&b()===0,d=()=>{let a=0;return r()&&!!n?a=2:(r()||!!n)&&(a=1),`${y}_${a}_control_columns`};return C?null:e.createElement(e.Fragment,null,e.createElement(k,null),e.createElement(f,{...p,numberOfStickyColumns:t.numberOfStickyColumns,scrollContainerCss:t.scrollContainerCss,scrollContainerkey:d(),css:{...i,...o&&{opacity:.5,pointerEvents:"none",transition:"opacity 250ms linear 150ms"}}},e.createElement(s.Head,{theme:c,sortable:l,isSticky:t.hasStickyHeader,css:t.headerCss}),e.createElement(s.Body,{striped:m})))};export{D as DataTableTable};
 //# sourceMappingURL=DataTableTable.js.map

package/dist/components/data-table/DataTableTable.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DataTableTable.js","sources":["../../../src/components/data-table/DataTableTable.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { CSS } from '~/stitches'\n\nimport { Table } from '../table'\nimport { TableBody } from '../table/TableBody'\nimport { DataTable } from './DataTable'\nimport { AsyncDataState } from './DataTable.types'\nimport { useDataTable } from './DataTableContext'\nimport { DataTableHead } from './DataTableHead'\nimport { DataTableLoading } from './DataTableLoading'\n\nexport type DataTableTableProps = Omit<\n React.ComponentProps<typeof Table>,\n 'children' \| 'numberOfStickyColumns'\n> &\n Partial<\n Pick<React.ComponentProps<typeof DataTableHead>, 'theme' \| 'sortable'>\n > &\n Partial<Pick<React.ComponentProps<typeof TableBody>, 'striped'>> & {\n scrollOptions?: {\n hasStickyHeader?: boolean\n headerCss?: CSS\n numberOfStickyColumns?: number\n scrollContainerCss?: CSS\n }\n }\n\nexport const DataTableTable = ({\n sortable,\n striped,\n theme,\n css,\n scrollOptions = {\n numberOfStickyColumns: 0,\n hasStickyHeader: false\n },\n ...props\n}: DataTableTableProps) => {\n const {\n asyncDataState,\n getTotalRows,\n getCanSomeRowsExpand,\n ~~getGroupedRowModel~~,\n ~~enableRowSelection~~\n } = useDataTable()\n const isPending = asyncDataState === AsyncDataState.PENDING\n const isEmpty = !isPending && getTotalRows() === 0\n\n const ~~getMaxRowDepth~~ = () => {\n ~~return~~ ~~getGroupedRowModel().flatRows.reduce((acc,~~ ~~curr) => {\n if (curr.depth > acc) {\n acc~~ = ~~curr.depth\n }\n\n return acc\n },~~ 0)\n }\n~~\n const getControlColumnsCount = (): number => {\n~~ if (getCanSomeRowsExpand() && !!enableRowSelection) ~~return~~ 2\n\n if (getCanSomeRowsExpand() \|\| !!enableRowSelection) ~~return~~ 1\n\n return 0\n }\n\n if (isEmpty) return null\n\n return (\n <>\n <DataTableLoading />\n\n <Table\n {...props}\n numberOfStickyColumns={scrollOptions.numberOfStickyColumns}\n scrollContainerCss={scrollOptions.scrollContainerCss}\n ~~controlColumnCount~~={~~getControlColumnsCount~~()}\n ~~maxRowDepth={getMaxRowDepth()}\n~~ css={{\n ...css,\n ...(isPending && {\n opacity: 0.5,\n pointerEvents: 'none',\n transition: 'opacity 250ms linear 150ms'\n })\n }}\n >\n <DataTable.Head\n theme={theme}\n sortable={sortable}\n isSticky={scrollOptions.hasStickyHeader}\n css={scrollOptions.headerCss}\n />\n <DataTable.Body striped={striped} />\n </Table>\n </>\n )\n}\n"],"names":["DataTableTable","sortable","striped","theme","css","scrollOptions","props","asyncDataState","getTotalRows","getCanSomeRowsExpand","~~getGroupedRowModel~~","~~enableRowSelection~~","useDataTable","isPending","AsyncDataState","isEmpty","~~getMaxRowDepth~~","~~acc~~","~~curr","getControlColumnsCount","~~React","DataTableLoading","Table","DataTable"],"mappings":"~~uRA4BaA~~,EAAiB,CAAC,CAC7B,SAAAC,EACA,QAAAC,EACA,MAAAC,EACA,IAAAC,EACA,cAAAC,EAAgB,CACd,sBAAuB,EACvB,gBAAiB,EACnB,KACGC,CACL,IAA2B,CACzB,KAAM,CACJ,eAAAC,EACA,aAAAC,EACA,qBAAAC,EACA,mBAAAC,EACA,~~mBAAAC~~,CACF,EAAIC,~~EACEC~~,~~EAAAA~~,EAAYN,IAAmBO,EAAe,QAC9CC,EAAU,CAACF,GAAaL,~~MAAmB~~,EAE3CQ,~~EAAiB~~,~~IACdN~~,~~IAAqB~~,~~SAAS~~,~~OAAO~~,~~CAACO~~,~~EAAKC~~,~~KAC5CA~~,~~EAAK~~,~~MAAQD~~,~~IACfA~~,~~EAAMC~~,~~EAAK~~,~~OAGND~~,~~GACN~~,~~CAAC~~,~~EAGAE,EAAyB,IACzBV,EAAAA,GAA0B,~~CAAC,~~CAACE~~,~~EAA2B~~,~~EAEvDF~~,~~KAA0B~~,~~CAAC~~,~~CAACE~~,~~EAA2B~~,~~EAEpD~~,~~EAGT~~,~~OAAII,~~EAAgB,~~KAGlBK~~,EAAA,cAAAA,EAAA,~~SAAA~~,~~KACEA~~,EAAA,cAACC,EAAA,IAAiB,EAElBD,EAAA,cAACE,EAAA,CACE,~~GAAGhB~~,EACJ,sBAAuBD,EAAc,sBACrC,mBAAoBA,EAAc,mBAClC,~~mBAAoBc~~,~~EAAuB~~,~~EAC3C~~,~~YAAaH,IACb,~~IAAK,CACH,GAAGZ,EACH,GAAIS,GAAa,CACf,QAAS,GACT,cAAe,OACf,WAAY,4BACd,CACF,~~CAEAO~~,~~EAAAA~~,EAAA,cAACG,EAAU,KAAV,CACC,~~MAAOpB~~,EACP,SAAUF,EACV,SAAUI,EAAc,gBACxB,IAAKA,EAAc,~~SAAA~~,~~CACrB~~,~~EACAe~~,EAAA,cAACG,EAAU,KAAV,CAAe,~~QAASrB~~,CAAS,CAAA,CACpC,CACF,CAEJ"}
1	+ {"version":3,"file":"DataTableTable.js","sources":["../../../src/components/data-table/DataTableTable.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { CSS } from '~/stitches'\n\nimport { Table } from '../table'\nimport { TableBody } from '../table/TableBody'\nimport { DataTable } from './DataTable'\nimport { AsyncDataState } from './DataTable.types'\nimport { useDataTable } from './DataTableContext'\nimport { DataTableHead } from './DataTableHead'\nimport { DataTableLoading } from './DataTableLoading'\n\nexport type DataTableTableProps = Omit<\n React.ComponentProps<typeof Table>,\n 'children' \| 'numberOfStickyColumns'\n> &\n Partial<\n Pick<React.ComponentProps<typeof DataTableHead>, 'theme' \| 'sortable'>\n > &\n Partial<Pick<React.ComponentProps<typeof TableBody>, 'striped'>> & {\n scrollOptions?: {\n hasStickyHeader?: boolean\n headerCss?: CSS\n numberOfStickyColumns?: number\n scrollContainerCss?: CSS\n }\n }\n\nexport const DataTableTable = ({\n sortable,\n striped,\n theme,\n css,\n scrollOptions = {\n numberOfStickyColumns: 0,\n hasStickyHeader: false\n },\n ...props\n}: DataTableTableProps) => {\n const {\n asyncDataState,\n getTotalRows,\n getCanSomeRowsExpand,\n enableRowSelection,\n tableId\n } = useDataTable()\n\n const isPending = asyncDataState === AsyncDataState.PENDING\n const isEmpty = !isPending && getTotalRows() === 0\n\n const buildScrollContainerKey = (): string => {\n let controlColumnCount = 0\n\n if (getCanSomeRowsExpand() && !!enableRowSelection) {\n controlColumnCount = 2\n } else if (getCanSomeRowsExpand() \|\| !!enableRowSelection) {\n controlColumnCount = 1\n }\n\n return `${tableId}_${controlColumnCount}_control_columns`\n }\n\n if (isEmpty) return null\n\n return (\n <>\n <DataTableLoading />\n\n <Table\n {...props}\n numberOfStickyColumns={scrollOptions.numberOfStickyColumns}\n scrollContainerCss={scrollOptions.scrollContainerCss}\n scrollContainerkey={buildScrollContainerKey()}\n css={{\n ...css,\n ...(isPending && {\n opacity: 0.5,\n pointerEvents: 'none',\n transition: 'opacity 250ms linear 150ms'\n })\n }}\n >\n <DataTable.Head\n theme={theme}\n sortable={sortable}\n isSticky={scrollOptions.hasStickyHeader}\n css={scrollOptions.headerCss}\n />\n <DataTable.Body striped={striped} />\n </Table>\n </>\n )\n}\n"],"names":["DataTableTable","sortable","striped","theme","css","scrollOptions","props","asyncDataState","getTotalRows","getCanSomeRowsExpand","enableRowSelection","tableId","useDataTable","isPending","AsyncDataState","isEmpty","buildScrollContainerKey","controlColumnCount","React","DataTableLoading","Table","DataTable"],"mappings":"iRA4BO,MAAMA,EAAiB,CAAC,CAC7B,SAAAC,EACA,QAAAC,EACA,MAAAC,EACA,IAAAC,EACA,cAAAC,EAAgB,CACd,sBAAuB,EACvB,gBAAiB,EACnB,KACGC,CACL,IAA2B,CACzB,KAAM,CACJ,eAAAC,EACA,aAAAC,EACA,qBAAAC,EACA,mBAAAC,EACA,QAAAC,CACF,EAAIC,EAAa,EAEXC,EAAYN,IAAmBO,EAAe,QAC9CC,EAAU,CAACF,GAAaL,EAAmB,IAAA,EAE3CQ,EAA0B,IAAc,CAC5C,IAAIC,EAAqB,EAEzB,OAAIR,EAAAA,GAA0B,CAAC,CAACC,EAC9BO,EAAqB,GACZR,EAAqB,GAAK,CAAC,CAACC,KACrCO,EAAqB,GAGhB,GAAGN,KAAWM,mBACvB,EAEA,OAAIF,EAAgB,KAGlBG,EAAA,cAAAA,EAAA,SACEA,KAAAA,EAAA,cAACC,EAAA,IAAiB,EAElBD,EAAA,cAACE,EAAA,CACE,GAAGd,EACJ,sBAAuBD,EAAc,sBACrC,mBAAoBA,EAAc,mBAClC,mBAAoBW,EAAwB,EAC5C,IAAK,CACH,GAAGZ,EACH,GAAIS,GAAa,CACf,QAAS,GACT,cAAe,OACf,WAAY,4BACd,CACF,CAAA,EAEAK,EAAA,cAACG,EAAU,KAAV,CACC,MAAOlB,EACP,SAAUF,EACV,SAAUI,EAAc,gBACxB,IAAKA,EAAc,SACrB,CAAA,EACAa,EAAA,cAACG,EAAU,KAAV,CAAe,QAASnB,CAAS,CAAA,CACpC,CACF,CAEJ"}

package/dist/components/dialog/DialogContent.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{Close as f}from"@atom-learning/icons";import{Overlay as u,Content as v,Portal as x,Close as g}from"@radix-ui/react-dialog";import*as t from"react";import{DIALOG_Z_INDEX as b}from"../../constants/zIndices.js";import{keyframes as r,styled as s}from"../../stitches.js";import{backdropOverlay as w}from"../../utilities/style/backdrop-overlay.js";import{ActionIcon as D}from"../action-icon/ActionIcon.js";import{Icon as $}from"../icon/Icon.js";import{DialogBackground as l}from"./DialogBackground.js";const o="translate3d(-50%, -50%, 0)",n="translate3d(-50%, 50vh, 0)",m="modal_overlay",z=r({"0%":{transform:n},"100%":{transform:o}}),C=r({"0%":{transform:o},"100%":{transform:n}}),y=s(u,w),E=s(v,{bg:"white",borderRadius:"$1",boxShadow:"$3",boxSizing:"border-box",left:"50%",maxWidth:"90vw",maxHeight:"90vh",overflowY:"auto",p:"$5",position:"fixed",top:"50%",transform:o,zIndex:b,"&:focus":{outline:"none"},"@allowMotion":{'&[data-state="open"]':{animation:`${z} 550ms cubic-bezier(0.22, 1, 0.36, 1)`},'&[data-state="closed"]':{animation:`${C} 550ms cubic-bezier(0.22, 1, 0.36, 1)`}},variants:{size:{xs:{width:"380px"},sm:{width:"480px"},md:{width:"600px"},lg:{width:"800px"},xl:{width:"1100px"},fullscreen:{width:"100vw",height:"100vh",maxWidth:"100vw",maxHeight:"100vh",borderRadius:"unset","@supports (height: 100svh)":{height:"100svh",maxHeight:"100svh"}}}}}),I=({size:d="sm",children:i,closeDialogText:h="Close dialog",showCloseButton:p=!0,...c})=>t.createElement(x,null,t.createElement(y,{id:m},t.Children.map(i,e=>(e==null?void 0:e.type)===l&&e),t.createElement(E,{size:d,"aria-label":"Dialog",onPointerDownOutside:e=>{const a=e.target;(a==null?void 0:a.id)!==m&&e.preventDefault()},...c},p&&t.createElement(D,{as:g,css:{position:"absolute",right:"$4",top:"$4",size:"$5"},label:h,hasTooltip:!1,size:"md",theme:"neutral"},t.createElement($,{is:f})),t.Children.map(i,e=>(e==null?void 0:e.type)!==l&&e))));export{I as DialogContent};
+import{Close as g}from"@atom-learning/icons";import{Overlay as x,Content as f,Portal as v,Close as b}from"@radix-ui/react-dialog";import*as e from"react";import{DIALOG_Z_INDEX as w}from"../../constants/zIndices.js";import{keyframes as s,styled as l}from"../../stitches.js";import{backdropOverlay as $}from"../../utilities/style/backdrop-overlay.js";import{ActionIcon as z}from"../action-icon/ActionIcon.js";import{Icon as C}from"../icon/Icon.js";import{DialogBackground as n}from"./DialogBackground.js";const i="translate3d(-50%, -50%, 0)",m="translate3d(-50%, 50vh, 0)",d="modal_overlay",D=s({"0%":{transform:m},"100%":{transform:i}}),y=s({"0%":{transform:i},"100%":{transform:m}}),E=l(x,$),o={width:"auto",height:"auto",maxWidth:"auto",maxHeight:"auto","@supports (height: 100svh)":{height:"auto",maxHeight:"auto"}},I=l(f,{bg:"white",boxShadow:"$3",boxSizing:"border-box",left:"50%",maxWidth:"90vw",maxHeight:"90vh",overflowY:"auto",p:"$5",position:"fixed",top:"50%",transform:i,zIndex:w,"&:focus":{outline:"none"},"@allowMotion":{'&[data-state="open"]':{animation:`${D} 550ms cubic-bezier(0.22, 1, 0.36, 1)`},'&[data-state="closed"]':{animation:`${y} 550ms cubic-bezier(0.22, 1, 0.36, 1)`}},variants:{size:{xs:{...o,borderRadius:"$1",width:"380px"},sm:{...o,borderRadius:"$1",width:"480px"},md:{...o,borderRadius:"$1",width:"600px"},lg:{...o,borderRadius:"$1",width:"800px"},xl:{...o,borderRadius:"$1",width:"1100px"},fullscreen:{width:"100vw",height:"100vh",maxWidth:"100vw",maxHeight:"100vh","@supports (height: 100svh)":{height:"100svh",maxHeight:"100svh"}}}}}),H=({size:h="sm",children:a,closeDialogText:p="Close dialog",showCloseButton:u=!0,...c})=>e.createElement(v,null,e.createElement(E,{id:d},e.Children.map(a,t=>(t==null?void 0:t.type)===n&&t),e.createElement(I,{size:h,"aria-label":"Dialog",onPointerDownOutside:t=>{const r=t.target;(r==null?void 0:r.id)!==d&&t.preventDefault()},...c},u&&e.createElement(z,{as:b,css:{position:"absolute",right:"$4",top:"$4",size:"$5"},label:p,hasTooltip:!1,size:"md",theme:"neutral"},e.createElement(C,{is:g})),e.Children.map(a,t=>(t==null?void 0:t.type)!==n&&t))));export{H as DialogContent};
 //# sourceMappingURL=DialogContent.js.map

package/dist/components/dialog/DialogContent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DialogContent.js","sources":["../../../src/components/dialog/DialogContent.tsx"],"sourcesContent":["import { Close as CloseIcon } from '@atom-learning/icons'\nimport { Close, Content, Overlay, Portal } from '@radix-ui/react-dialog'\nimport * as React from 'react'\n\nimport { DIALOG_Z_INDEX } from '~/constants/zIndices'\nimport { keyframes, styled } from '~/stitches'\nimport { backdropOverlay } from '~/utilities/style/backdrop-overlay'\n\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Icon } from '../icon/Icon'\nimport { DialogBackground } from './DialogBackground'\n\nconst contentOnScreen = 'translate3d(-50%, -50%, 0)'\nconst contentOffScreen = 'translate3d(-50%, 50vh, 0)'\nconst modalOverlayId = 'modal_overlay'\n\nconst slideIn = keyframes({\n '0%': { transform: contentOffScreen },\n '100%': { transform: contentOnScreen }\n})\nconst slideOut = keyframes({\n '0%': { transform: contentOnScreen },\n '100%': { transform: contentOffScreen }\n})\n\nconst StyledDialogOverlay = styled(Overlay, backdropOverlay)\n\nconst StyledDialogContent = styled(Content, {\n bg: 'white',\n ~~borderRadius: '$1',\n~~ boxShadow: '$3',\n boxSizing: 'border-box',\n left: '50%',\n maxWidth: '90vw',\n maxHeight: '90vh',\n overflowY: 'auto',\n p: '$5',\n position: 'fixed',\n top: '50%',\n transform: contentOnScreen,\n zIndex: DIALOG_Z_INDEX,\n '&:focus': {\n outline: 'none'\n },\n '@allowMotion': {\n '&[data-state=\"open\"]': {\n animation: `${slideIn} 550ms cubic-bezier(0.22, 1, 0.36, 1)`\n },\n '&[data-state=\"closed\"]': {\n animation: `${slideOut} 550ms cubic-bezier(0.22, 1, 0.36, 1)`\n }\n },\n variants: {\n size: {\n xs: { width: '380px' },\n sm: { width: '480px' },\n md: { width: '600px' },\n lg: { width: '800px' },\n xl: { width: '1100px' },\n fullscreen: {\n width: '100vw',\n height: '100vh',\n maxWidth: '100vw',\n maxHeight: '100vh',\n ~~borderRadius:~~ '~~unset',\n '~~@supports (height: 100svh)': {\n height: '100svh',\n maxHeight: '100svh'\n }\n }\n }\n }\n})\n\ntype DialogContentProps = React.ComponentProps<typeof StyledDialogContent> & {\n closeDialogText?: string\n showCloseButton?: boolean\n}\n\nexport const DialogContent = ({\n size = 'sm',\n children,\n closeDialogText = 'Close dialog',\n showCloseButton = true,\n ...remainingProps\n}: DialogContentProps) => (\n <Portal>\n <StyledDialogOverlay id={modalOverlayId}>\n {React.Children.map(\n children,\n (child?: React.ReactElement) =>\n child?.type === DialogBackground && child\n )}\n <StyledDialogContent\n size={size}\n aria-label=\"Dialog\"\n onPointerDownOutside={(event) => {\n const element = event.target as HTMLElement\n if (element?.id !== modalOverlayId) {\n event.preventDefault()\n }\n }}\n {...remainingProps}\n >\n {showCloseButton && (\n <ActionIcon\n as={Close}\n css={{ position: 'absolute', right: '$4', top: '$4', size: '$5' }}\n label={closeDialogText}\n hasTooltip={false}\n size=\"md\"\n theme=\"neutral\"\n >\n <Icon is={CloseIcon} />\n </ActionIcon>\n )}\n {React.Children.map(\n children,\n (child?: React.ReactElement) =>\n child?.type !== DialogBackground && child\n )}\n </StyledDialogContent>\n </StyledDialogOverlay>\n </Portal>\n)\n"],"names":["contentOnScreen","contentOffScreen","modalOverlayId","slideIn","keyframes","slideOut","StyledDialogOverlay","styled","Overlay","backdropOverlay","StyledDialogContent","Content","DIALOG_Z_INDEX","DialogContent","size","children","closeDialogText","showCloseButton","remainingProps","React","Portal","child","DialogBackground","event","element","ActionIcon","Close","Icon","CloseIcon"],"mappings":"ufAYA,MAAMA,EAAkB,6BAClBC,EAAmB,6BACnBC,EAAiB,gBAEjBC,EAAUC,EAAU,CACxB,KAAM,CAAE,UAAWH,CAAiB,EACpC,OAAQ,CAAE,UAAWD,CAAgB,CACvC,CAAC,EACKK,EAAWD,EAAU,CACzB,KAAM,CAAE,UAAWJ,CAAgB,EACnC,OAAQ,CAAE,UAAWC,CAAiB,CACxC,CAAC,EAEKK,EAAsBC,EAAOC,EAASC,CAAe,EAErDC,~~EAAsBH~~,~~EAAOI~~,EAAS,CAC1C,GAAI,QACJ,~~aAAc,KACd,~~UAAW,KACX,UAAW,aACX,KAAM,MACN,SAAU,OACV,UAAW,OACX,UAAW,OACX,EAAG,KACH,SAAU,QACV,IAAK,MACL,~~UAAWX~~,EACX,~~OAAQY~~,EACR,UAAW,CACT,QAAS,MACX,EACA,eAAgB,CACd,uBAAwB,CACtB,UAAW,~~GAAGT~~,wCAChB,EACA,yBAA0B,CACxB,UAAW,GAAGE,wCAChB,CACF,EACA,SAAU,CACR,KAAM,CACJ,GAAI,~~CAAE~~,MAAO,~~OAAQ~~,~~EACrB~~,GAAI,~~CAAE~~,MAAO,~~OAAQ~~,~~EACrB~~,GAAI,~~CAAE~~,MAAO,~~OAAQ~~,~~EACrB~~,GAAI,~~CAAE~~,MAAO,~~OAAQ~~,~~EACrB~~,GAAI,~~CAAE~~,MAAO,~~QAAS~~,~~EACtB~~,WAAY,CACV,MAAO,QACP,OAAQ,QACR,SAAU,QACV,UAAW,QACX,~~aAAc,QACd,~~6BAA8B,CAC5B,OAAQ,SACR,UAAW,QACb,CACF,CACF,CACF,CACF,CAAC,~~EAOYQ~~,EAAgB,CAAC,CAC5B,KAAAC,EAAO,KACP,SAAAC,EACA,gBAAAC,EAAkB,eAClB,gBAAAC,EAAkB,MACfC,CACL,IACEC,EAAA,cAACC,EAAA,KACCD,EAAA,~~cAACb~~,EAAA,CAAoB,GAAIJ,~~CACtBiB~~,~~EAAAA,~~EAAM,SAAS,IACdJ,EACCM,IACCA,GAAA,~~KAAAA~~,OAAAA,EAAO,QAASC,GAAoBD,CACxC,EACAF,EAAA,cAACT,EAAA,CACC,KAAMI,EACN,aAAW,SACX,qBAAuBS,GAAU,CAC/B,MAAMC,EAAUD,EAAM,QAClBC,GAAA,KAAAA,OAAAA,EAAS,~~MAAOtB~~,~~GAClBqB~~,EAAM,~~eAAA~~,~~CAEV~~,EACC,GAAGL,~~CAEHD~~,~~EAAAA~~,GACCE,EAAA,cAACM,EAAA,CACC,GAAIC,EACJ,IAAK,CAAE,SAAU,WAAY,MAAO,KAAM,IAAK,KAAM,KAAM,IAAK,EAChE,MAAOV,EACP,WAAY,GACZ,KAAK,KACL,MAAM,SAENG,EAAAA,EAAA,cAACQ,EAAA,CAAK,GAAIC,CAAAA,CAAW,CACvB,EAEDT,EAAM,SAAS,IACdJ,EACCM,IACCA,GAAA,~~KAAA~~,~~OAAAA,~~EAAO,QAASC,GAAoBD,CACxC,CACF,CACF,CACF"}
1	+ {"version":3,"file":"DialogContent.js","sources":["../../../src/components/dialog/DialogContent.tsx"],"sourcesContent":["import { Close as CloseIcon } from '@atom-learning/icons'\nimport { Close, Content, Overlay, Portal } from '@radix-ui/react-dialog'\nimport * as React from 'react'\n\nimport { DIALOG_Z_INDEX } from '~/constants/zIndices'\nimport { keyframes, styled } from '~/stitches'\nimport { backdropOverlay } from '~/utilities/style/backdrop-overlay'\n\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Icon } from '../icon/Icon'\nimport { DialogBackground } from './DialogBackground'\n\nconst contentOnScreen = 'translate3d(-50%, -50%, 0)'\nconst contentOffScreen = 'translate3d(-50%, 50vh, 0)'\nconst modalOverlayId = 'modal_overlay'\n\nconst slideIn = keyframes({\n '0%': { transform: contentOffScreen },\n '100%': { transform: contentOnScreen }\n})\nconst slideOut = keyframes({\n '0%': { transform: contentOnScreen },\n '100%': { transform: contentOffScreen }\n})\n\nconst StyledDialogOverlay = styled(Overlay, backdropOverlay)\n\nconst sizeReset = {\n width: 'auto',\n height: 'auto',\n maxWidth: 'auto',\n maxHeight: 'auto',\n '@supports (height: 100svh)': {\n height: 'auto',\n maxHeight: 'auto'\n }\n}\nconst StyledDialogContent = styled(Content, {\n bg: 'white',\n boxShadow: '$3',\n boxSizing: 'border-box',\n left: '50%',\n maxWidth: '90vw',\n maxHeight: '90vh',\n overflowY: 'auto',\n p: '$5',\n position: 'fixed',\n top: '50%',\n transform: contentOnScreen,\n zIndex: DIALOG_Z_INDEX,\n '&:focus': {\n outline: 'none'\n },\n '@allowMotion': {\n '&[data-state=\"open\"]': {\n animation: `${slideIn} 550ms cubic-bezier(0.22, 1, 0.36, 1)`\n },\n '&[data-state=\"closed\"]': {\n animation: `${slideOut} 550ms cubic-bezier(0.22, 1, 0.36, 1)`\n }\n },\n variants: {\n size: {\n xs: {\n ...sizeReset,\n borderRadius: '$1',\n width: '380px'\n },\n sm: {\n ...sizeReset,\n borderRadius: '$1',\n width: '480px'\n },\n md: {\n ...sizeReset,\n borderRadius: '$1',\n width: '600px'\n },\n lg: {\n ...sizeReset,\n borderRadius: '$1',\n width: '800px'\n },\n xl: {\n ...sizeReset,\n borderRadius: '$1',\n width: '1100px'\n },\n fullscreen: {\n width: '100vw',\n height: '100vh',\n maxWidth: '100vw',\n maxHeight: '100vh',\n '@supports (height: 100svh)': {\n height: '100svh',\n maxHeight: '100svh'\n }\n }\n }\n }\n})\n\ntype DialogContentProps = React.ComponentProps<typeof StyledDialogContent> & {\n closeDialogText?: string\n showCloseButton?: boolean\n}\n\nexport const DialogContent = ({\n size = 'sm',\n children,\n closeDialogText = 'Close dialog',\n showCloseButton = true,\n ...remainingProps\n}: DialogContentProps) => (\n <Portal>\n <StyledDialogOverlay id={modalOverlayId}>\n {React.Children.map(\n children,\n (child?: React.ReactElement) =>\n child?.type === DialogBackground && child\n )}\n <StyledDialogContent\n size={size}\n aria-label=\"Dialog\"\n onPointerDownOutside={(event) => {\n const element = event.target as HTMLElement\n if (element?.id !== modalOverlayId) {\n event.preventDefault()\n }\n }}\n {...remainingProps}\n >\n {showCloseButton && (\n <ActionIcon\n as={Close}\n css={{ position: 'absolute', right: '$4', top: '$4', size: '$5' }}\n label={closeDialogText}\n hasTooltip={false}\n size=\"md\"\n theme=\"neutral\"\n >\n <Icon is={CloseIcon} />\n </ActionIcon>\n )}\n {React.Children.map(\n children,\n (child?: React.ReactElement) =>\n child?.type !== DialogBackground && child\n )}\n </StyledDialogContent>\n </StyledDialogOverlay>\n </Portal>\n)\n"],"names":["contentOnScreen","contentOffScreen","modalOverlayId","slideIn","keyframes","slideOut","StyledDialogOverlay","styled","Overlay","backdropOverlay","sizeReset","StyledDialogContent","Content","DIALOG_Z_INDEX","DialogContent","size","children","closeDialogText","showCloseButton","remainingProps","React","Portal","child","DialogBackground","event","element","ActionIcon","Close","Icon","CloseIcon"],"mappings":"ufAYA,MAAMA,EAAkB,6BAClBC,EAAmB,6BACnBC,EAAiB,gBAEjBC,EAAUC,EAAU,CACxB,KAAM,CAAE,UAAWH,CAAiB,EACpC,OAAQ,CAAE,UAAWD,CAAgB,CACvC,CAAC,EACKK,EAAWD,EAAU,CACzB,KAAM,CAAE,UAAWJ,CAAgB,EACnC,OAAQ,CAAE,UAAWC,CAAiB,CACxC,CAAC,EAEKK,EAAsBC,EAAOC,EAASC,CAAe,EAErDC,EAAY,CAChB,MAAO,OACP,OAAQ,OACR,SAAU,OACV,UAAW,OACX,6BAA8B,CAC5B,OAAQ,OACR,UAAW,MACb,CACF,EACMC,EAAsBJ,EAAOK,EAAS,CAC1C,GAAI,QACJ,UAAW,KACX,UAAW,aACX,KAAM,MACN,SAAU,OACV,UAAW,OACX,UAAW,OACX,EAAG,KACH,SAAU,QACV,IAAK,MACL,UAAWZ,EACX,OAAQa,EACR,UAAW,CACT,QAAS,MACX,EACA,eAAgB,CACd,uBAAwB,CACtB,UAAW,GAAGV,wCAChB,EACA,yBAA0B,CACxB,UAAW,GAAGE,wCAChB,CACF,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CACF,GAAGK,EACH,aAAc,KACd,MAAO,OACT,EACA,GAAI,CACF,GAAGA,EACH,aAAc,KACd,MAAO,OACT,EACA,GAAI,CACF,GAAGA,EACH,aAAc,KACd,MAAO,OACT,EACA,GAAI,CACF,GAAGA,EACH,aAAc,KACd,MAAO,OACT,EACA,GAAI,CACF,GAAGA,EACH,aAAc,KACd,MAAO,QACT,EACA,WAAY,CACV,MAAO,QACP,OAAQ,QACR,SAAU,QACV,UAAW,QACX,6BAA8B,CAC5B,OAAQ,SACR,UAAW,QACb,CACF,CACF,CACF,CACF,CAAC,EAOYI,EAAgB,CAAC,CAC5B,KAAAC,EAAO,KACP,SAAAC,EACA,gBAAAC,EAAkB,eAClB,gBAAAC,EAAkB,MACfC,CACL,IACEC,EAAA,cAACC,EAAA,KACCD,EAAA,cAACd,EAAA,CAAoB,GAAIJ,GACtBkB,EAAM,SAAS,IACdJ,EACCM,IACCA,GAAA,KAAA,OAAAA,EAAO,QAASC,GAAoBD,CACxC,EACAF,EAAA,cAACT,EAAA,CACC,KAAMI,EACN,aAAW,SACX,qBAAuBS,GAAU,CAC/B,MAAMC,EAAUD,EAAM,QAClBC,GAAA,KAAAA,OAAAA,EAAS,MAAOvB,GAClBsB,EAAM,eAEV,CAAA,EACC,GAAGL,CAAAA,EAEHD,GACCE,EAAA,cAACM,EAAA,CACC,GAAIC,EACJ,IAAK,CAAE,SAAU,WAAY,MAAO,KAAM,IAAK,KAAM,KAAM,IAAK,EAChE,MAAOV,EACP,WAAY,GACZ,KAAK,KACL,MAAM,SAENG,EAAAA,EAAA,cAACQ,EAAA,CAAK,GAAIC,CAAAA,CAAW,CACvB,EAEDT,EAAM,SAAS,IACdJ,EACCM,IACCA,GAAA,YAAAA,EAAO,QAASC,GAAoBD,CACxC,CACF,CACF,CACF"}

package/dist/components/empty-state/EmptyStateBody.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import*as t from"react";import{Text as m}from"../text/Text.js";import{styled as r}from"../../stitches.js";import{EmptyStateContext as s}from"./EmptyState.context.js";const i=r(m,{color:"$grey800",fontWeight:"400",variants:{size:{xs:{fontSize:"$sm",mb:"$4"},sm:{fontSize:"$sm",mb:"$4"},md:{fontSize:"$sm",mb:"$4"},lg:{fontSize:"$md",mb:"calc($4 + $2)"},xl:{fontSize:"$md",mb:"calc($4 + $2)"}}}}),n=e=>{const{size:o}=t.useContext(s);return t.createElement(i,{size:o,...e})};export{n as EmptyStateBody};
+import*as t from"react";import{Text as m}from"../text/Text.js";import{styled as r}from"../../stitches.js";import{EmptyStateContext as s}from"./EmptyState.context.js";const i=r(m,{color:"$grey800",fontWeight:400,variants:{size:{xs:{fontSize:"$sm",mb:"$4"},sm:{fontSize:"$sm",mb:"$4"},md:{fontSize:"$sm",mb:"$4"},lg:{fontSize:"$md",mb:"calc($4 + $2)"},xl:{fontSize:"$md",mb:"calc($4 + $2)"}}}}),n=e=>{const{size:o}=t.useContext(s);return t.createElement(i,{size:o,...e})};export{n as EmptyStateBody};
 //# sourceMappingURL=EmptyStateBody.js.map

package/dist/components/empty-state/EmptyStateBody.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EmptyStateBody.js","sources":["../../../src/components/empty-state/EmptyStateBody.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Text } from '~/components/text'\nimport { styled } from '~/stitches'\n\nimport { EmptyStateContext } from './EmptyState.context'\n\nconst StyledEmptyStateBody = styled(Text, {\n color: '$grey800',\n fontWeight: '400',\n variants: {\n size: {\n xs: {\n fontSize: '$sm',\n mb: '$4'\n },\n sm: {\n fontSize: '$sm',\n mb: '$4'\n },\n md: {\n fontSize: '$sm',\n mb: '$4'\n },\n lg: {\n fontSize: '$md',\n mb: 'calc($4 + $2)'\n },\n xl: {\n fontSize: '$md',\n mb: 'calc($4 + $2)'\n }\n }\n }\n})\n\ntype EmptyStateBodyProps = React.ComponentProps<typeof StyledEmptyStateBody> & {\n as?: React.ComponentType \| React.ElementType\n}\n\nexport const EmptyStateBody = (props: EmptyStateBodyProps) => {\n const { size } = React.useContext(EmptyStateContext)\n return <StyledEmptyStateBody size={size} {...props} />\n}\n"],"names":["StyledEmptyStateBody","styled","Text","EmptyStateBody","props","size","React","EmptyStateContext"],"mappings":"sKAOA,MAAMA,EAAuBC,EAAOC,EAAM,CACxC,MAAO,WACP,WAAY,~~MACZ~~,SAAU,CACR,KAAM,CACJ,GAAI,CACF,SAAU,MACV,GAAI,IACN,EACA,GAAI,CACF,SAAU,MACV,GAAI,IACN,EACA,GAAI,CACF,SAAU,MACV,GAAI,IACN,EACA,GAAI,CACF,SAAU,MACV,GAAI,eACN,EACA,GAAI,CACF,SAAU,MACV,GAAI,eACN,CACF,CACF,CACF,CAAC,EAMYC,EAAkBC,GAA+B,CAC5D,KAAM,CAAE,KAAAC,CAAK,EAAIC,EAAM,WAAWC,CAAiB,EACnD,OAAOD,EAAA,cAACN,EAAA,CAAqB,KAAMK,EAAO,GAAGD,EAAO,CACtD"}
1	+ {"version":3,"file":"EmptyStateBody.js","sources":["../../../src/components/empty-state/EmptyStateBody.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Text } from '~/components/text'\nimport { styled } from '~/stitches'\n\nimport { EmptyStateContext } from './EmptyState.context'\n\nconst StyledEmptyStateBody = styled(Text, {\n color: '$grey800',\n fontWeight: 400,\n variants: {\n size: {\n xs: {\n fontSize: '$sm',\n mb: '$4'\n },\n sm: {\n fontSize: '$sm',\n mb: '$4'\n },\n md: {\n fontSize: '$sm',\n mb: '$4'\n },\n lg: {\n fontSize: '$md',\n mb: 'calc($4 + $2)'\n },\n xl: {\n fontSize: '$md',\n mb: 'calc($4 + $2)'\n }\n }\n }\n})\n\ntype EmptyStateBodyProps = React.ComponentProps<typeof StyledEmptyStateBody> & {\n as?: React.ComponentType \| React.ElementType\n}\n\nexport const EmptyStateBody = (props: EmptyStateBodyProps) => {\n const { size } = React.useContext(EmptyStateContext)\n return <StyledEmptyStateBody size={size} {...props} />\n}\n"],"names":["StyledEmptyStateBody","styled","Text","EmptyStateBody","props","size","React","EmptyStateContext"],"mappings":"sKAOA,MAAMA,EAAuBC,EAAOC,EAAM,CACxC,MAAO,WACP,WAAY,IACZ,SAAU,CACR,KAAM,CACJ,GAAI,CACF,SAAU,MACV,GAAI,IACN,EACA,GAAI,CACF,SAAU,MACV,GAAI,IACN,EACA,GAAI,CACF,SAAU,MACV,GAAI,IACN,EACA,GAAI,CACF,SAAU,MACV,GAAI,eACN,EACA,GAAI,CACF,SAAU,MACV,GAAI,eACN,CACF,CACF,CACF,CAAC,EAMYC,EAAkBC,GAA+B,CAC5D,KAAM,CAAE,KAAAC,CAAK,EAAIC,EAAM,WAAWC,CAAiB,EACnD,OAAOD,EAAA,cAACN,EAAA,CAAqB,KAAMK,EAAO,GAAGD,EAAO,CACtD"}

package/dist/components/empty-state/EmptyStateTitle.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import*as t from"react";import{styled as m}from"../../stitches.js";import{EmptyStateContext as n}from"./EmptyState.context.js";const i=m("h2",{color:"$grey800",fontFamily:"$body",fontWeight:"600",m:0,variants:{size:{xs:{fontSize:"$md",mb:"$3"},sm:{fontSize:"$md",mb:"$3"},md:{fontSize:"$md",mb:"$3"},lg:{fontSize:"$lg",mb:"$4"},xl:{fontSize:"$lg",mb:"$4"}}}}),r=e=>{const{size:o}=t.useContext(n);return t.createElement(i,{size:o,...e})};export{r as EmptyStateTitle};
+import*as t from"react";import{styled as m}from"../../stitches.js";import{EmptyStateContext as n}from"./EmptyState.context.js";const i=m("h2",{color:"$grey800",fontFamily:"$body",fontWeight:600,m:0,variants:{size:{xs:{fontSize:"$md",mb:"$3"},sm:{fontSize:"$md",mb:"$3"},md:{fontSize:"$md",mb:"$3"},lg:{fontSize:"$lg",mb:"$4"},xl:{fontSize:"$lg",mb:"$4"}}}}),r=e=>{const{size:o}=t.useContext(n);return t.createElement(i,{size:o,...e})};export{r as EmptyStateTitle};
 //# sourceMappingURL=EmptyStateTitle.js.map

package/dist/components/empty-state/EmptyStateTitle.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EmptyStateTitle.js","sources":["../../../src/components/empty-state/EmptyStateTitle.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { EmptyStateContext } from './EmptyState.context'\n\nconst StyledEmptyStateTitle = styled('h2', {\n color: '$grey800',\n fontFamily: '$body',\n fontWeight: '600',\n m: 0,\n variants: {\n size: {\n xs: {\n fontSize: '$md',\n mb: '$3'\n },\n sm: {\n fontSize: '$md',\n mb: '$3'\n },\n md: {\n fontSize: '$md',\n mb: '$3'\n },\n lg: {\n fontSize: '$lg',\n mb: '$4'\n },\n xl: {\n fontSize: '$lg',\n mb: '$4'\n }\n }\n }\n})\n\ntype EmptyStateTitleProps = React.ComponentProps<\n typeof StyledEmptyStateTitle\n> & {\n as?: React.ComponentType \| React.ElementType\n}\n\nexport const EmptyStateTitle = (props: EmptyStateTitleProps) => {\n const { size } = React.useContext(EmptyStateContext)\n return <StyledEmptyStateTitle size={size} {...props} />\n}\n"],"names":["StyledEmptyStateTitle","styled","EmptyStateTitle","props","size","React","EmptyStateContext"],"mappings":"+HAMA,MAAMA,EAAwBC,EAAO,KAAM,CACzC,MAAO,WACP,WAAY,QACZ,WAAY,~~MACZ~~,EAAG,EACH,SAAU,CACR,KAAM,CACJ,GAAI,CACF,SAAU,MACV,GAAI,IACN,EACA,GAAI,CACF,SAAU,MACV,GAAI,IACN,EACA,GAAI,CACF,SAAU,MACV,GAAI,IACN,EACA,GAAI,CACF,SAAU,MACV,GAAI,IACN,EACA,GAAI,CACF,SAAU,MACV,GAAI,IACN,CACF,CACF,CACF,CAAC,EAQYC,EAAmBC,GAAgC,CAC9D,KAAM,CAAE,KAAAC,CAAK,EAAIC,EAAM,WAAWC,CAAiB,EACnD,OAAOD,EAAA,cAACL,EAAA,CAAsB,KAAMI,EAAO,GAAGD,EAAO,CACvD"}
1	+ {"version":3,"file":"EmptyStateTitle.js","sources":["../../../src/components/empty-state/EmptyStateTitle.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { EmptyStateContext } from './EmptyState.context'\n\nconst StyledEmptyStateTitle = styled('h2', {\n color: '$grey800',\n fontFamily: '$body',\n fontWeight: 600,\n m: 0,\n variants: {\n size: {\n xs: {\n fontSize: '$md',\n mb: '$3'\n },\n sm: {\n fontSize: '$md',\n mb: '$3'\n },\n md: {\n fontSize: '$md',\n mb: '$3'\n },\n lg: {\n fontSize: '$lg',\n mb: '$4'\n },\n xl: {\n fontSize: '$lg',\n mb: '$4'\n }\n }\n }\n})\n\ntype EmptyStateTitleProps = React.ComponentProps<\n typeof StyledEmptyStateTitle\n> & {\n as?: React.ComponentType \| React.ElementType\n}\n\nexport const EmptyStateTitle = (props: EmptyStateTitleProps) => {\n const { size } = React.useContext(EmptyStateContext)\n return <StyledEmptyStateTitle size={size} {...props} />\n}\n"],"names":["StyledEmptyStateTitle","styled","EmptyStateTitle","props","size","React","EmptyStateContext"],"mappings":"+HAMA,MAAMA,EAAwBC,EAAO,KAAM,CACzC,MAAO,WACP,WAAY,QACZ,WAAY,IACZ,EAAG,EACH,SAAU,CACR,KAAM,CACJ,GAAI,CACF,SAAU,MACV,GAAI,IACN,EACA,GAAI,CACF,SAAU,MACV,GAAI,IACN,EACA,GAAI,CACF,SAAU,MACV,GAAI,IACN,EACA,GAAI,CACF,SAAU,MACV,GAAI,IACN,EACA,GAAI,CACF,SAAU,MACV,GAAI,IACN,CACF,CACF,CACF,CAAC,EAQYC,EAAmBC,GAAgC,CAC9D,KAAM,CAAE,KAAAC,CAAK,EAAIC,EAAM,WAAWC,CAAiB,EACnD,OAAOD,EAAA,cAACL,EAAA,CAAsB,KAAMI,EAAO,GAAGD,EAAO,CACvD"}

package/dist/components/index.d.ts CHANGED Viewed

@@ -83,3 +83,4 @@ export { Tooltip } from './tooltip';
 export { TopBar } from './top-bar';
 export { Tree } from './tree';
 export { Video } from './video';
+export { KeyboardShortcut } from './keyboard-shortcut';

package/dist/components/input/Input.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import*as r from"react";import{styled as m}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import"../../utilities/style/keyframe-animations.js";import{overrideStitchesVariantValue as l}from"../../utilities/override-stitches-variant-value/overrideStitchesVariantValue.js";import{disabledStyle as c}from"../../utilities/style/disabledStyle.js";import{Flex as b}from"../flex/Flex.js";import{Text as g}from"../text/Text.js";const s=m(b,{background:"white",color:"$grey1000",border:"1px solid $grey800",borderRadius:"$0",transition:"background 100ms ease-out, borderColor 100ms ease-out",width:"100%","&:focus-within":{borderColor:"$blue800"},variants:{size:{sm:{height:"$3"},md:{height:"$4"},lg:{height:"$5"},xl:{height:"$6"}},disabled:{true:c},state:{error:{borderColor:"$danger"}}}});s.displayName="InputBackground";const h=m.withConfig({shouldForwardStitchesProp:e=>["as"].includes(e)})(g,{appearance:"none",border:"none",background:"none",backgroundImage:"none",backgroundColor:"transparent",boxShadow:"none",boxSizing:"border-box","&:focus":{outline:"none"},px:"$3",size:"100%"}),f={sm:"sm",md:"md",lg:"md",xl:"lg"},a=r.forwardRef(({type:e="text",css:d,size:o,...t},n)=>{const i=r.useMemo(()=>l(o,u=>f[u]),[o]);return r.createElement(h,{ref:n,as:"input",type:e==="number"?"text":e,inputMode:e==="number"?"numeric":void 0,pattern:e==="number"?"[0-9]*":void 0,size:i,...t})});a.displayName="InputText";const p=r.forwardRef(({size:e="md",state:d,disabled:o,css:t,...n},i)=>r.createElement(s,{size:e,disabled:o,state:d,css:t},r.createElement(a,{size:e,ref:i,disabled:o,...n})));p.displayName="Input";export{p as Input,s as InputBackground,a as InputText};
+import*as r from"react";import{styled as l}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import"../../utilities/style/keyframe-animations.js";import{overrideStitchesVariantValue as u}from"../../utilities/override-stitches-variant-value/overrideStitchesVariantValue.js";import{disabledStyle as c}from"../../utilities/style/disabledStyle.js";import{Flex as b}from"../flex/Flex.js";import{Text as g}from"../text/Text.js";const d=l(b,{background:"white",color:"$grey1000",border:"1px solid $grey800",borderRadius:"$0",transition:"background 100ms ease-out, borderColor 100ms ease-out",width:"100%","&:focus-within":{borderColor:"$blue800"},variants:{size:{sm:{height:"$3"},md:{height:"$4"},lg:{height:"$5"},xl:{height:"$6"}},disabled:{true:c},state:{error:{borderColor:"$danger"}}}});d.displayName="InputBackground";const h=l.withConfig({shouldForwardStitchesProp:e=>["as"].includes(e)})(g,{appearance:"none",border:"none",background:"none",backgroundImage:"none",backgroundColor:"transparent",boxShadow:"none",boxSizing:"border-box","&:focus":{outline:"none"},px:"$3",size:"100%"}),f={sm:"sm",md:"md",lg:"md",xl:"lg"},m=r.forwardRef(({type:e="text",css:s,size:o,...t},n)=>{const i=r.useMemo(()=>u(o,a=>f[a]),[o]);return r.createElement(h,{ref:n,as:"input",type:e==="number"?"text":e,inputMode:e==="number"?"numeric":void 0,pattern:e==="number"?"[0-9]*":void 0,size:i,...t})});m.displayName="InputText";const p=r.forwardRef(({className:e,size:s="md",state:o,disabled:t,css:n,...i},a)=>r.createElement(d,{size:s,disabled:t,state:o,css:n,className:e},r.createElement(m,{size:s,ref:a,disabled:t,...i})));p.displayName="Input";export{p as Input,d as InputBackground,m as InputText};
 //# sourceMappingURL=Input.js.map

package/dist/components/input/Input.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Input.js","sources":["../../../src/components/input/Input.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { disabledStyle } from '~/utilities'\nimport { overrideStitchesVariantValue } from '~/utilities/override-stitches-variant-value/overrideStitchesVariantValue'\n\nimport { Flex } from '../flex'\nimport { Text } from '../text'\n\nexport const InputBackground = styled(Flex, {\n background: 'white',\n color: '$grey1000',\n border: '1px solid $grey800',\n borderRadius: '$0',\n transition: 'background 100ms ease-out, borderColor 100ms ease-out',\n width: '100%',\n '&:focus-within': {\n borderColor: '$blue800'\n },\n variants: {\n size: {\n sm: {\n height: '$3'\n },\n md: {\n height: '$4'\n },\n lg: {\n height: '$5'\n },\n xl: {\n height: '$6'\n }\n },\n disabled: {\n true: disabledStyle\n },\n state: {\n error: {\n borderColor: '$danger'\n }\n }\n }\n})\n\nInputBackground.displayName = 'InputBackground'\n\nconst StyledInputText = styled.withConfig({\n shouldForwardStitchesProp: (propName) => ['as'].includes(propName)\n})(Text as unknown as 'input', {\n // unsets\n appearance: 'none',\n border: 'none',\n background: 'none',\n backgroundImage: 'none',\n backgroundColor: 'transparent',\n boxShadow: 'none', // prevent default iOS default styling\n boxSizing: 'border-box',\n '&:focus': {\n outline: 'none'\n },\n //\n px: '$3',\n size: '100%'\n})\n\nexport type InputTextProps = Omit<\n React.ComponentProps<typeof StyledInputText>,\n 'size' \| 'type' \| 'as'\n> & {\n size: React.ComponentProps<typeof Text>['size']\n // override default 'type' property to prevent Input from being used to render\n // checkboxes, radios etc — we have dedicated components for them\n type?: 'text' \| 'number' \| 'email' \| 'password' \| 'tel' \| 'url' \| 'search'\n as?: never\n}\n\nconst toTextSize = {\n sm: 'sm',\n md: 'md',\n lg: 'md',\n xl: 'lg'\n}\n\nexport const InputText: React.ForwardRefExoticComponent<InputTextProps> =\n React.forwardRef(({ type = 'text', css, size, ...rest }, ref) => {\n const textSize = React.useMemo(\n () => overrideStitchesVariantValue(size, (s) => toTextSize[s]),\n [size]\n )\n\n return (\n <StyledInputText\n ref={ref}\n as=\"input\"\n type={type === 'number' ? 'text' : type}\n inputMode={type === 'number' ? 'numeric' : undefined}\n pattern={type === 'number' ? '[0-9]*' : undefined}\n size={textSize}\n {...rest}\n />\n )\n })\n\nInputText.displayName = 'InputText'\n\ntype InputBackgroundProps = React.ComponentProps<typeof InputBackground>\nexport type InputProps = Omit<\n React.ComponentProps<typeof InputText>,\n 'size' \| 'state'\n> & {\n size?: InputBackgroundProps['size']\n state?: InputBackgroundProps['state']\n}\n\nexport const Input: React.ForwardRefExoticComponent<InputProps> =\n React.forwardRef(({ size = 'md', state, disabled, css, ...rest }, ref) => {\n return (\n <InputBackground size={size} disabled={disabled} state={state} css={css}>\n <InputText size={size} ref={ref} disabled={disabled} {...rest} />\n </InputBackground>\n )\n })\n\nInput.displayName = 'Input'\n"],"names":["InputBackground","styled","Flex","disabledStyle","StyledInputText","propName","Text","toTextSize","InputText","React","type","css","size","rest","ref","textSize","overrideStitchesVariantValue","s","Input","state","disabled"],"mappings":"+~~gBASO~~,~~MAAMA~~,EAAkBC,EAAOC,EAAM,CAC1C,WAAY,QACZ,MAAO,YACP,OAAQ,qBACR,aAAc,KACd,WAAY,wDACZ,MAAO,OACP,iBAAkB,CAChB,YAAa,UACf,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CACF,OAAQ,IACV,EACA,GAAI,CACF,OAAQ,IACV,EACA,GAAI,CACF,OAAQ,IACV,EACA,GAAI,CACF,OAAQ,IACV,CACF,EACA,SAAU,CACR,KAAMC,CACR,EACA,MAAO,CACL,MAAO,CACL,YAAa,SACf,CACF,CACF,CACF,CAAC,EAEDH,EAAgB,YAAc,kBAE9B,MAAMI,EAAkBH,EAAO,WAAW,CACxC,0BAA4BI,GAAa,CAAC,IAAI,EAAE,SAASA,CAAQ,CACnE,CAAC,EAAEC,EAA4B,CAE7B,WAAY,OACZ,OAAQ,OACR,WAAY,OACZ,gBAAiB,OACjB,gBAAiB,cACjB,UAAW,OACX,UAAW,aACX,UAAW,CACT,QAAS,MACX,EAEA,GAAI,KACJ,KAAM,MACR,CAAC,EAaKC,EAAa,CACjB,GAAI,KACJ,GAAI,KACJ,GAAI,KACJ,GAAI,IACN,EAEaC,EACXC,EAAM,WAAW,CAAC,CAAE,KAAAC,EAAO,OAAQ,IAAAC,EAAK,KAAAC,KAASC,CAAK,EAAGC,IAAQ,CAC/D,MAAMC,EAAWN,EAAM,QACrB,IAAMO,EAA6BJ,EAAOK,GAAMV,EAAWU,EAAE,EAC7D,CAACL,CAAI,CACP,EAEA,OACEH,EAAA,cAACL,EAAA,CACC,IAAKU,EACL,GAAG,QACH,KAAMJ,IAAS,SAAW,OAASA,EACnC,UAAWA,IAAS,SAAW,UAAY,OAC3C,QAASA,IAAS,SAAW,SAAW,OACxC,KAAMK,EACL,GAAGF,~~CAAAA,~~CACN,CAEJ,CAAC,EAEHL,EAAU,YAAc,~~YAWX~~,~~MAAAU~~,EACXT,EAAM,~~WAAW~~,CAAC,CAAE,~~KAAAG~~,EAAO,KAAM,~~MAAAO~~,EAAO,SAAAC,EAAU,~~IAAAT~~,KAAQE,CAAK,EAAGC,~~IAE9DL~~,EAAA,cAACT,~~EAAgB~~,~~CAAA~~,KAAMY,~~EAAM~~,~~SAAUQ~~,~~EAAU~~,MAAOD,~~EAAO~~,~~IAAKR~~,~~CAClEF~~,~~EAAAA~~,EAAA,cAACD,~~EAAA~~,~~CAAU~~,KAAMI,EAAM,IAAKE,EAAK,~~SAAUM~~,EAAW,~~GAAGP~~,~~CAAAA,~~CAAM,CACjE,~~CAEH~~,~~EAEHK~~,EAAM,YAAc"}
1	+ {"version":3,"file":"Input.js","sources":["../../../src/components/input/Input.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { disabledStyle } from '~/utilities'\nimport { overrideStitchesVariantValue } from '~/utilities/override-stitches-variant-value/overrideStitchesVariantValue'\n\nimport { Flex } from '../flex'\nimport { Text } from '../text'\n\nexport const InputBackground = styled(Flex, {\n background: 'white',\n color: '$grey1000',\n border: '1px solid $grey800',\n borderRadius: '$0',\n transition: 'background 100ms ease-out, borderColor 100ms ease-out',\n width: '100%',\n '&:focus-within': {\n borderColor: '$blue800'\n },\n variants: {\n size: {\n sm: {\n height: '$3'\n },\n md: {\n height: '$4'\n },\n lg: {\n height: '$5'\n },\n xl: {\n height: '$6'\n }\n },\n disabled: {\n true: disabledStyle\n },\n state: {\n error: {\n borderColor: '$danger'\n }\n }\n }\n})\n\nInputBackground.displayName = 'InputBackground'\n\nconst StyledInputText = styled.withConfig({\n shouldForwardStitchesProp: (propName) => ['as'].includes(propName)\n})(Text as unknown as 'input', {\n // unsets\n appearance: 'none',\n border: 'none',\n background: 'none',\n backgroundImage: 'none',\n backgroundColor: 'transparent',\n boxShadow: 'none', // prevent default iOS default styling\n boxSizing: 'border-box',\n '&:focus': {\n outline: 'none'\n },\n //\n px: '$3',\n size: '100%'\n})\n\nexport type InputTextProps = Omit<\n React.ComponentProps<typeof StyledInputText>,\n 'size' \| 'type' \| 'as'\n> & {\n size: React.ComponentProps<typeof Text>['size']\n // override default 'type' property to prevent Input from being used to render\n // checkboxes, radios etc — we have dedicated components for them\n type?: 'text' \| 'number' \| 'email' \| 'password' \| 'tel' \| 'url' \| 'search'\n as?: never\n}\n\nconst toTextSize = {\n sm: 'sm',\n md: 'md',\n lg: 'md',\n xl: 'lg'\n}\n\nexport const InputText: React.ForwardRefExoticComponent<InputTextProps> =\n React.forwardRef(({ type = 'text', css, size, ...rest }, ref) => {\n const textSize = React.useMemo(\n () => overrideStitchesVariantValue(size, (s) => toTextSize[s]),\n [size]\n )\n\n return (\n <StyledInputText\n ref={ref}\n as=\"input\"\n type={type === 'number' ? 'text' : type}\n inputMode={type === 'number' ? 'numeric' : undefined}\n pattern={type === 'number' ? '[0-9]*' : undefined}\n size={textSize}\n {...rest}\n />\n )\n })\n\nInputText.displayName = 'InputText'\n\ntype InputBackgroundProps = React.ComponentProps<typeof InputBackground>\nexport type InputProps = Omit<\n React.ComponentProps<typeof InputText>,\n 'size' \| 'state'\n> & {\n size?: InputBackgroundProps['size']\n state?: InputBackgroundProps['state']\n}\n\nexport const Input: React.ForwardRefExoticComponent<InputProps> =\n React.forwardRef(\n ({ className, size = 'md', state, disabled, css, ...rest }, ref) => {\n return (\n <InputBackground\n size={size}\n disabled={disabled}\n state={state}\n css={css}\n className={className}\n >\n <InputText size={size} ref={ref} disabled={disabled} {...rest} />\n </InputBackground>\n )\n }\n )\n\nInput.displayName = 'Input'\n"],"names":["InputBackground","styled","Flex","disabledStyle","StyledInputText","propName","Text","toTextSize","InputText","React","type","css","size","rest","ref","textSize","overrideStitchesVariantValue","s","Input","className","state","disabled"],"mappings":"+gBASa,MAAAA,EAAkBC,EAAOC,EAAM,CAC1C,WAAY,QACZ,MAAO,YACP,OAAQ,qBACR,aAAc,KACd,WAAY,wDACZ,MAAO,OACP,iBAAkB,CAChB,YAAa,UACf,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CACF,OAAQ,IACV,EACA,GAAI,CACF,OAAQ,IACV,EACA,GAAI,CACF,OAAQ,IACV,EACA,GAAI,CACF,OAAQ,IACV,CACF,EACA,SAAU,CACR,KAAMC,CACR,EACA,MAAO,CACL,MAAO,CACL,YAAa,SACf,CACF,CACF,CACF,CAAC,EAEDH,EAAgB,YAAc,kBAE9B,MAAMI,EAAkBH,EAAO,WAAW,CACxC,0BAA4BI,GAAa,CAAC,IAAI,EAAE,SAASA,CAAQ,CACnE,CAAC,EAAEC,EAA4B,CAE7B,WAAY,OACZ,OAAQ,OACR,WAAY,OACZ,gBAAiB,OACjB,gBAAiB,cACjB,UAAW,OACX,UAAW,aACX,UAAW,CACT,QAAS,MACX,EAEA,GAAI,KACJ,KAAM,MACR,CAAC,EAaKC,EAAa,CACjB,GAAI,KACJ,GAAI,KACJ,GAAI,KACJ,GAAI,IACN,EAEaC,EACXC,EAAM,WAAW,CAAC,CAAE,KAAAC,EAAO,OAAQ,IAAAC,EAAK,KAAAC,KAASC,CAAK,EAAGC,IAAQ,CAC/D,MAAMC,EAAWN,EAAM,QACrB,IAAMO,EAA6BJ,EAAOK,GAAMV,EAAWU,EAAE,EAC7D,CAACL,CAAI,CACP,EAEA,OACEH,EAAA,cAACL,EAAA,CACC,IAAKU,EACL,GAAG,QACH,KAAMJ,IAAS,SAAW,OAASA,EACnC,UAAWA,IAAS,SAAW,UAAY,OAC3C,QAASA,IAAS,SAAW,SAAW,OACxC,KAAMK,EACL,GAAGF,CACN,CAAA,CAEJ,CAAC,EAEHL,EAAU,YAAc,YAWjB,MAAMU,EACXT,EAAM,WACJ,CAAC,CAAE,UAAAU,EAAW,KAAAP,EAAO,KAAM,MAAAQ,EAAO,SAAAC,EAAU,IAAAV,KAAQE,CAAK,EAAGC,IAExDL,EAAA,cAACT,EAAA,CACC,KAAMY,EACN,SAAUS,EACV,MAAOD,EACP,IAAKT,EACL,UAAWQ,CAAAA,EAEXV,EAAA,cAACD,EAAU,CAAA,KAAMI,EAAM,IAAKE,EAAK,SAAUO,EAAW,GAAGR,CAAM,CAAA,CACjE,CAGN,EAEFK,EAAM,YAAc"}