npm - @atom-learning/components - Versions diffs - 3.3.1 → 3.5.0 - Mend

@atom-learning/components 3.3.1 → 3.5.0

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 (58) hide show

package/dist/components/banner/banner-regular/BannerRegularDismiss.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BannerRegularDismiss.js","sources":["../../../../src/components/banner/banner-regular/BannerRegularDismiss.tsx"],"sourcesContent":["import { Close } from '@atom-learning/icons'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { overrideStitchesVariantValue } from '~/utilities/override-stitches-variant-value/overrideStitchesVariantValue'\n\nimport { ActionIcon } from '../../action-icon'\nimport { Icon } from '../../icon'\nimport { Banner } from '../Banner'\nimport { useBannerContext } from '../BannerContext'\n\nconst toActionIconSize = {\n sm: 'md',\n md: 'sm'\n}\n\nconst StyledDismiss = styled(ActionIcon, {\n zIndex: 1,\n position: 'absolute',\n top: '$3',\n right: '$3'\n})\n\~~nexport~~ ~~const~~ ~~BannerRegularDismiss:~~ ~~React.FC~~<\n React.ComponentProps<typeof ~~ActionIcon~~>\n> = ({ label = 'dismiss', ...rest }) => {\n const { size, setHasDismiss } = useBannerContext()\n\n React.useEffect(() => {\n setHasDismiss(true)\n return () => {\n setHasDismiss(false)\n }\n }, [setHasDismiss])\n\n const actionIconSize = React.useMemo(\n () => overrideStitchesVariantValue(size, (s) => toActionIconSize[s]),\n [size]\n )\n\n return (\n <Banner.Dismiss asChild>\n <StyledDismiss\n label={label}\n size={actionIconSize}\n hasTooltip={false}\n isRounded\n theme=\"neutral\"\n appearance=\"solid\"\n {...rest}\n >\n <Icon is={Close} />\n </StyledDismiss>\n </Banner.Dismiss>\n )\n}\n\nBannerRegularDismiss.displayName = 'BannerRegularDismiss'\n"],"names":["toActionIconSize","StyledDismiss","styled","ActionIcon","BannerRegularDismiss","label","rest","size","setHasDismiss","useBannerContext","React","actionIconSize","overrideStitchesVariantValue","s","Banner","Icon","Close"],"mappings":"ybAWA,MAAMA,EAAmB,CACvB,GAAI,KACJ,GAAI,IACN,EAEMC,EAAgBC,EAAOC,EAAY,CACvC,OAAQ,EACR,SAAU,WACV,IAAK,KACL,MAAO,IACT,CAAC,~~EAEYC~~,~~EAET~~,CAAC,~~CAAE~~,MAAAC,EAAQ,~~aAAcC~~,~~CAAK~~,~~IAAM~~,~~CACtC~~,KAAM,CAAE,KAAAC,EAAM,cAAAC,CAAc,EAAIC,EAAiB,EAEjDC,EAAM,UAAU,KACdF,EAAc,EAAI,EACX,IAAM,CACXA,EAAc,EAAK,CACrB,GACC,CAACA,CAAa,CAAC,EAElB,MAAMG,EAAiBD,EAAM,QAC3B,IAAME,EAA6BL,EAAOM,GAAMb,EAAiBa,EAAE,EACnE,CAACN,CAAI,CACP,EAEA,OACEG,EAAA,cAACI,EAAO,QAAP,CAAe,QAAO,EACrBJ,EAAAA,EAAA,cAACT,EAAA,CACC,MAAOI,EACP,KAAMM,EACN,WAAY,GACZ,UAAS,GACT,MAAM,UACN,WAAW,QACV,GAAGL,CAEJI,EAAAA,EAAA,cAACK,EAAA,CAAK,GAAIC,CAAAA,CAAO,CACnB,CACF,CAEJ,EAEAZ,EAAqB,YAAc"}
1	+ {"version":3,"file":"BannerRegularDismiss.js","sources":["../../../../src/components/banner/banner-regular/BannerRegularDismiss.tsx"],"sourcesContent":["import { Close } from '@atom-learning/icons'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { overrideStitchesVariantValue } from '~/utilities/override-stitches-variant-value/overrideStitchesVariantValue'\n\nimport { ActionIcon } from '../../action-icon'\nimport { Icon } from '../../icon'\nimport { Banner } from '../Banner'\nimport { useBannerContext } from '../BannerContext'\n\nconst toActionIconSize = {\n sm: 'md',\n md: 'sm'\n}\n\nconst StyledDismiss = styled(ActionIcon, {\n zIndex: 1,\n position: 'absolute',\n top: '$3',\n right: '$3'\n})\n\ntype BannerRegularDismissProps = Omit<\n React.ComponentProps<typeof StyledDismiss>,\n 'children' \| 'onClick' \| 'href'\n>\n\nexport const BannerRegularDismiss = ({\n label = 'dismiss',\n ...rest\n}: BannerRegularDismissProps) => {\n const { size, setHasDismiss } = useBannerContext()\n\n React.useEffect(() => {\n setHasDismiss(true)\n return () => {\n setHasDismiss(false)\n }\n }, [setHasDismiss])\n\n const actionIconSize = React.useMemo(\n () => overrideStitchesVariantValue(size, (s) => toActionIconSize[s]),\n [size]\n )\n\n return (\n <Banner.Dismiss asChild>\n <StyledDismiss\n label={label}\n size={actionIconSize}\n hasTooltip={false}\n isRounded\n theme=\"neutral\"\n appearance=\"solid\"\n {...rest}\n >\n <Icon is={Close} />\n </StyledDismiss>\n </Banner.Dismiss>\n )\n}\n\nBannerRegularDismiss.displayName = 'BannerRegularDismiss'\n"],"names":["toActionIconSize","StyledDismiss","styled","ActionIcon","BannerRegularDismiss","label","rest","size","setHasDismiss","useBannerContext","React","actionIconSize","overrideStitchesVariantValue","s","Banner","Icon","Close"],"mappings":"ybAWA,MAAMA,EAAmB,CACvB,GAAI,KACJ,GAAI,IACN,EAEMC,EAAgBC,EAAOC,EAAY,CACvC,OAAQ,EACR,SAAU,WACV,IAAK,KACL,MAAO,IACT,CAAC,EAOYC,EAAuB,CAAC,CACnC,MAAAC,EAAQ,aACLC,CACL,IAAiC,CAC/B,KAAM,CAAE,KAAAC,EAAM,cAAAC,CAAc,EAAIC,EAAiB,EAEjDC,EAAM,UAAU,KACdF,EAAc,EAAI,EACX,IAAM,CACXA,EAAc,EAAK,CACrB,GACC,CAACA,CAAa,CAAC,EAElB,MAAMG,EAAiBD,EAAM,QAC3B,IAAME,EAA6BL,EAAOM,GAAMb,EAAiBa,EAAE,EACnE,CAACN,CAAI,CACP,EAEA,OACEG,EAAA,cAACI,EAAO,QAAP,CAAe,QAAO,EACrBJ,EAAAA,EAAA,cAACT,EAAA,CACC,MAAOI,EACP,KAAMM,EACN,WAAY,GACZ,UAAS,GACT,MAAM,UACN,WAAW,QACV,GAAGL,CAEJI,EAAAA,EAAA,cAACK,EAAA,CAAK,GAAIC,CAAAA,CAAO,CACnB,CACF,CAEJ,EAEAZ,EAAqB,YAAc"}

package/dist/components/banner/banner-slim/BannerSlimButton.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import*as e from"react";import{overrideStitchesVariantValue as a}from"../../../utilities/override-stitches-variant-value/overrideStitchesVariantValue.js";import{Button as u}from"../../button/Button.js";import{useBannerContext as l}from"../BannerContext.js";const r=({css:m,...o})=>{const{emphasis:n,size:t}=l(),s=e.useMemo(()=>a(t,i=>i==="sm"),[t]);return e.createElement(u,{size:"md",fullWidth:s,theme:n==="highContrast"?"neutral":"primary",css:{ml:"auto",...m},...o})};r.displayName="BannerSlimButton";export{r as BannerSlimButton};
+import*as e from"react";import{overrideStitchesVariantValue as a}from"../../../utilities/override-stitches-variant-value/overrideStitchesVariantValue.js";import{Button as l}from"../../button/Button.js";import{useBannerContext as u}from"../BannerContext.js";const r=({css:m,...o})=>{const{emphasis:n,size:t}=u(),s=e.useMemo(()=>a(t,i=>i==="sm"),[t]);return e.createElement(l,{size:"md",fullWidth:s,theme:n==="bold"?"neutral":"primary",css:{ml:"auto",...m},...o})};r.displayName="BannerSlimButton";export{r as BannerSlimButton};
 //# sourceMappingURL=BannerSlimButton.js.map

package/dist/components/banner/banner-slim/BannerSlimButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BannerSlimButton.js","sources":["../../../../src/components/banner/banner-slim/BannerSlimButton.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { overrideStitchesVariantValue } from '~/utilities/override-stitches-variant-value/overrideStitchesVariantValue'\n\nimport { Button } from '../../button'\nimport { useBannerContext } from '../BannerContext'\n\nexport const BannerSlimButton: React.FC<\n React.ComponentProps<typeof Button>\n> = ({ css, ...props }) => {\n const { emphasis, size } = useBannerContext()\n\n const fullWidth = React.useMemo(\n () => overrideStitchesVariantValue(size, (s) => s === 'sm'),\n [size]\n )\n\n return (\n <Button\n size=\"md\"\n fullWidth={fullWidth}\n theme={emphasis === '~~highContrast~~' ? 'neutral' : 'primary'}\n css={{ ml: 'auto', ...css }}\n {...props}\n />\n )\n}\n\nBannerSlimButton.displayName = 'BannerSlimButton'\n"],"names":["BannerSlimButton","css","props","emphasis","size","useBannerContext","fullWidth","React","overrideStitchesVariantValue","s","Button"],"mappings":"uQAOaA,EAET,CAAC,CAAE,IAAAC,KAAQC,CAAM,IAAM,CACzB,KAAM,CAAE,SAAAC,EAAU,KAAAC,CAAK,EAAIC,EAAAA,EAErBC,EAAYC,EAAM,QACtB,IAAMC,EAA6BJ,EAAOK,GAAMA,IAAM,IAAI,EAC1D,CAACL,CAAI,CACP,EAEA,OACEG,EAAA,cAACG,EAAA,CACC,KAAK,KACL,UAAWJ,EACX,MAAOH,IAAa,~~eAAiB~~,UAAY,~~UACjD~~,IAAK,CAAE,GAAI,OAAQ,GAAGF,CAAI,EACzB,GAAGC,CAAAA,CACN,CAEJ,EAEAF,EAAiB,YAAc"}
1	+ {"version":3,"file":"BannerSlimButton.js","sources":["../../../../src/components/banner/banner-slim/BannerSlimButton.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { overrideStitchesVariantValue } from '~/utilities/override-stitches-variant-value/overrideStitchesVariantValue'\n\nimport { Button } from '../../button'\nimport { useBannerContext } from '../BannerContext'\n\nexport const BannerSlimButton: React.FC<\n React.ComponentProps<typeof Button>\n> = ({ css, ...props }) => {\n const { emphasis, size } = useBannerContext()\n\n const fullWidth = React.useMemo(\n () => overrideStitchesVariantValue(size, (s) => s === 'sm'),\n [size]\n )\n\n return (\n <Button\n size=\"md\"\n fullWidth={fullWidth}\n theme={emphasis === 'bold' ? 'neutral' : 'primary'}\n css={{ ml: 'auto', ...css }}\n {...props}\n />\n )\n}\n\nBannerSlimButton.displayName = 'BannerSlimButton'\n"],"names":["BannerSlimButton","css","props","emphasis","size","useBannerContext","fullWidth","React","overrideStitchesVariantValue","s","Button"],"mappings":"uQAOaA,EAET,CAAC,CAAE,IAAAC,KAAQC,CAAM,IAAM,CACzB,KAAM,CAAE,SAAAC,EAAU,KAAAC,CAAK,EAAIC,EAAAA,EAErBC,EAAYC,EAAM,QACtB,IAAMC,EAA6BJ,EAAOK,GAAMA,IAAM,IAAI,EAC1D,CAACL,CAAI,CACP,EAEA,OACEG,EAAA,cAACG,EAAA,CACC,KAAK,KACL,UAAWJ,EACX,MAAOH,IAAa,OAAS,UAAY,UACzC,IAAK,CAAE,GAAI,OAAQ,GAAGF,CAAI,EACzB,GAAGC,CAAAA,CACN,CAEJ,EAEAF,EAAiB,YAAc"}

package/dist/components/banner/banner-slim/BannerSlimContainer.d.ts CHANGED Viewed

@@ -320,8 +320,9 @@ declare const StyledBannerSlimContainer: import("@stitches/react/types/styled-co
         marginBottom: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
     };
 }>>;
+declare type TBannerSlimContainerProps = Omit<React.ComponentProps<typeof StyledBannerSlimContainer>, 'direction' | 'align' | 'wrap' | 'gap' | 'justify'>;
 export declare const BannerSlimContainer: {
-    (props: React.ComponentProps<typeof StyledBannerSlimContainer>): JSX.Element;
+    (props: TBannerSlimContainerProps): JSX.Element;
     displayName: string;
 };
 export {};

package/dist/components/banner/banner-slim/BannerSlimContainer.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import*as n from"react";import{styled as p}from"../../../stitches.js";import{overrideStitchesVariantValue as o}from"../../../utilities/override-stitches-variant-value/overrideStitchesVariantValue.js";import{BannerContainer as d}from"../BannerContainer.js";import{useBannerContext as l}from"../BannerContext.js";const u={sm:"column",md:"row"},c={sm:"flex-start",md:"center"},f={sm:"wrap",md:"nowrap"},w=p(d,{p:"$4",variants:{sizeWorkaround:{sm:{},md:{px:"$24"}}}}),m=t=>{const{size:r}=l(),a=n.useMemo(()=>o(r,e=>u[e]),[r]),i=n.useMemo(()=>o(r,e=>c[e]),[r]),s=n.useMemo(()=>o(r,e=>f[e]),[r]);return n.createElement(w,{direction:a,align:i,sizeWorkaround:r,gap:4,wrap:s,...t})};m.displayName="BannerSlimContainer";export{m as BannerSlimContainer};
+import*as n from"react";import{styled as p}from"../../../stitches.js";import{overrideStitchesVariantValue as o}from"../../../utilities/override-stitches-variant-value/overrideStitchesVariantValue.js";import{BannerContainer as d}from"../BannerContainer.js";import{useBannerContext as u}from"../BannerContext.js";const c={sm:"column",md:"row"},l={sm:"flex-start",md:"center"},f={sm:"wrap",md:"nowrap"},w=p(d,{p:"$4",variants:{sizeWorkaround:{sm:{},md:{px:"$24"}}}}),m=t=>{const{size:r}=u(),a=n.useMemo(()=>o(r,e=>c[e]),[r]),i=n.useMemo(()=>o(r,e=>l[e]),[r]),s=n.useMemo(()=>o(r,e=>f[e]),[r]);return n.createElement(w,{direction:a,align:i,sizeWorkaround:r,gap:4,wrap:s,...t})};m.displayName="BannerSlimContainer";export{m as BannerSlimContainer};
 //# sourceMappingURL=BannerSlimContainer.js.map

package/dist/components/banner/banner-slim/BannerSlimContainer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BannerSlimContainer.js","sources":["../../../../src/components/banner/banner-slim/BannerSlimContainer.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { overrideStitchesVariantValue } from '~/utilities/override-stitches-variant-value/overrideStitchesVariantValue'\n\nimport { BannerContainer } from '../BannerContainer'\nimport { useBannerContext } from '../BannerContext'\n\nconst toDirection = {\n sm: 'column',\n md: 'row'\n}\n\nconst toAlign = {\n sm: 'flex-start',\n md: 'center'\n}\n\nconst toWrap = {\n sm: 'wrap',\n md: 'nowrap'\n}\n\nconst StyledBannerSlimContainer = styled(BannerContainer, {\n p: '$4',\n variants: {\n sizeWorkaround: {\n sm: {},\n md: {\n px: '$24'\n }\n }\n }\n})\n\nexport const BannerSlimContainer = (\n props: ~~React.ComponentProps<typeof StyledBannerSlimContainer>\~~n): JSX.Element => {\n const { size } = useBannerContext()\n\n const direction = React.useMemo(\n () => overrideStitchesVariantValue(size, (s) => toDirection[s]),\n [size]\n )\n\n const align = React.useMemo(\n () => overrideStitchesVariantValue(size, (s) => toAlign[s]),\n [size]\n )\n\n const wrap = React.useMemo(\n () => overrideStitchesVariantValue(size, (s) => toWrap[s]),\n [size]\n )\n\n return (\n <StyledBannerSlimContainer\n direction={direction}\n align={align}\n sizeWorkaround={size}\n gap={4}\n wrap={wrap}\n {...props}\n />\n )\n}\n\nBannerSlimContainer.displayName = 'BannerSlimContainer'\n"],"names":["toDirection","toAlign","toWrap","StyledBannerSlimContainer","styled","BannerContainer","BannerSlimContainer","props","size","useBannerContext","direction","React","overrideStitchesVariantValue","s","align","wrap"],"mappings":"uTAQA,MAAMA,EAAc,CAClB,GAAI,SACJ,GAAI,KACN,EAEMC,EAAU,CACd,GAAI,aACJ,GAAI,QACN,EAEMC,EAAS,CACb,GAAI,OACJ,GAAI,QACN,EAEMC,EAA4BC,EAAOC,EAAiB,CACxD,EAAG,KACH,SAAU,CACR,eAAgB,CACd,GAAI,CAAA,EACJ,GAAI,CACF,GAAI,KACN,CACF,CACF,CACF,CAAC,~~EAEYC~~,EACXC,GACgB,CAChB,KAAM,CAAE,KAAAC,CAAK,EAAIC,EAAiB,EAE5BC,EAAYC,EAAM,QACtB,IAAMC,EAA6BJ,EAAOK,GAAMb,EAAYa,EAAE,EAC9D,CAACL,CAAI,CACP,EAEMM,EAAQH,EAAM,QAClB,IAAMC,EAA6BJ,EAAOK,GAAMZ,EAAQY,EAAE,EAC1D,CAACL,CAAI,CACP,EAEMO,EAAOJ,EAAM,QACjB,IAAMC,EAA6BJ,EAAOK,GAAMX,EAAOW,EAAE,EACzD,CAACL,CAAI,CACP,EAEA,OACEG,EAAA,cAACR,EAAA,CACC,UAAWO,EACX,MAAOI,EACP,eAAgBN,EAChB,IAAK,EACL,KAAMO,EACL,GAAGR,CAAAA,CACN,CAEJ,EAEAD,EAAoB,YAAc"}
1	+ {"version":3,"file":"BannerSlimContainer.js","sources":["../../../../src/components/banner/banner-slim/BannerSlimContainer.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { overrideStitchesVariantValue } from '~/utilities/override-stitches-variant-value/overrideStitchesVariantValue'\n\nimport { BannerContainer } from '../BannerContainer'\nimport { useBannerContext } from '../BannerContext'\n\nconst toDirection = {\n sm: 'column',\n md: 'row'\n}\n\nconst toAlign = {\n sm: 'flex-start',\n md: 'center'\n}\n\nconst toWrap = {\n sm: 'wrap',\n md: 'nowrap'\n}\n\nconst StyledBannerSlimContainer = styled(BannerContainer, {\n p: '$4',\n variants: {\n sizeWorkaround: {\n sm: {},\n md: {\n px: '$24'\n }\n }\n }\n})\n\ntype TBannerSlimContainerProps = Omit<\n React.ComponentProps<typeof StyledBannerSlimContainer>,\n 'direction' \| 'align' \| 'wrap' \| 'gap' \| 'justify'\n>\n\nexport const BannerSlimContainer = (\n props: TBannerSlimContainerProps\n): JSX.Element => {\n const { size } = useBannerContext()\n\n const direction = React.useMemo(\n () => overrideStitchesVariantValue(size, (s) => toDirection[s]),\n [size]\n )\n\n const align = React.useMemo(\n () => overrideStitchesVariantValue(size, (s) => toAlign[s]),\n [size]\n )\n\n const wrap = React.useMemo(\n () => overrideStitchesVariantValue(size, (s) => toWrap[s]),\n [size]\n )\n\n return (\n <StyledBannerSlimContainer\n direction={direction}\n align={align}\n sizeWorkaround={size}\n gap={4}\n wrap={wrap}\n {...props}\n />\n )\n}\n\nBannerSlimContainer.displayName = 'BannerSlimContainer'\n"],"names":["toDirection","toAlign","toWrap","StyledBannerSlimContainer","styled","BannerContainer","BannerSlimContainer","props","size","useBannerContext","direction","React","overrideStitchesVariantValue","s","align","wrap"],"mappings":"uTAQA,MAAMA,EAAc,CAClB,GAAI,SACJ,GAAI,KACN,EAEMC,EAAU,CACd,GAAI,aACJ,GAAI,QACN,EAEMC,EAAS,CACb,GAAI,OACJ,GAAI,QACN,EAEMC,EAA4BC,EAAOC,EAAiB,CACxD,EAAG,KACH,SAAU,CACR,eAAgB,CACd,GAAI,CAAA,EACJ,GAAI,CACF,GAAI,KACN,CACF,CACF,CACF,CAAC,EAOYC,EACXC,GACgB,CAChB,KAAM,CAAE,KAAAC,CAAK,EAAIC,EAAiB,EAE5BC,EAAYC,EAAM,QACtB,IAAMC,EAA6BJ,EAAOK,GAAMb,EAAYa,EAAE,EAC9D,CAACL,CAAI,CACP,EAEMM,EAAQH,EAAM,QAClB,IAAMC,EAA6BJ,EAAOK,GAAMZ,EAAQY,EAAE,EAC1D,CAACL,CAAI,CACP,EAEMO,EAAOJ,EAAM,QACjB,IAAMC,EAA6BJ,EAAOK,GAAMX,EAAOW,EAAE,EACzD,CAACL,CAAI,CACP,EAEA,OACEG,EAAA,cAACR,EAAA,CACC,UAAWO,EACX,MAAOI,EACP,eAAgBN,EAChB,IAAK,EACL,KAAMO,EACL,GAAGR,CAAAA,CACN,CAEJ,EAEAD,EAAoB,YAAc"}

package/dist/components/banner/banner-slim/BannerSlimDismiss.d.ts CHANGED Viewed

@@ -344,7 +344,7 @@ declare const StyledDismiss: import("@stitches/react/types/styled-component").St
     children: React.ReactNode;
     label: string;
 } & Omit<import("../../../utilities/optional-tooltip-wrapper").TOptionalTooltipWrapperProps, "label"> & import("../../../types").NavigatorActions, "appearance" | "color" | "translate" | "size" | "css" | "theme" | "onBlur" | "onChange" | "onSubmit" | "form" | "label" | "slot" | "style" | "title" | "key" | "name" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "as" | "disabled" | "value" | "type" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "hasTooltip" | "tooltipSide" | "isRounded" | keyof import("../../../types").NavigatorActions> & React.RefAttributes<HTMLButtonElement>>, {
-    emphasis?: "highContrast" | undefined;
+    emphasis?: "bold" | undefined;
     containerSize?: "sm" | "md" | undefined;
 }, {
     sm: string;
@@ -665,7 +665,7 @@ declare const StyledDismiss: import("@stitches/react/types/styled-component").St
         marginBottom: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
     };
 }>>;
-declare type TBannerSlimDismissProps = React.ComponentProps<typeof StyledDismiss>;
+declare type TBannerSlimDismissProps = Omit<React.ComponentProps<typeof StyledDismiss>, 'children' | 'onClick' | 'href'>;
 export declare const BannerSlimDismiss: {
     ({ label, ...rest }: TBannerSlimDismissProps): JSX.Element;
     displayName: string;

package/dist/components/banner/banner-slim/BannerSlimDismiss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{Close as n}from"@atom-learning/icons";import*as i from"react";import{styled as a}from"../../../stitches.js";import{ActionIcon as l}from"../../action-icon/ActionIcon.js";import{Icon as p}from"../../icon/Icon.js";import{Banner as c}from"../Banner.js";import{useBannerContext as h}from"../BannerContext.js";const f=a(l,{flexShrink:0,variants:{emphasis:{highContrast:{color:"white !important"}},containerSize:{sm:{position:"absolute",top:"$4",right:"$4"},md:{position:"static"}}}}),s=({label:t="dismiss",...o})=>{const{size:m,setHasDismiss:e,emphasis:r}=h();return i.useEffect(()=>(e(!0),()=>{e(!1)}),[e]),i.createElement(c.Dismiss,{asChild:!0},i.createElement(f,{label:t,size:"md",hasTooltip:!1,isRounded:!0,theme:"neutral",containerSize:m,emphasis:r,...o},i.createElement(p,{is:n})))};s.displayName="BannerSlimDismiss";export{s as BannerSlimDismiss};
+import{Close as n}from"@atom-learning/icons";import*as e from"react";import{styled as a}from"../../../stitches.js";import{ActionIcon as l}from"../../action-icon/ActionIcon.js";import{Icon as p}from"../../icon/Icon.js";import{Banner as c}from"../Banner.js";import{useBannerContext as d}from"../BannerContext.js";const f=a(l,{flexShrink:0,variants:{emphasis:{bold:{color:"white !important"}},containerSize:{sm:{position:"absolute",top:"$4",right:"$4"},md:{position:"static"}}}}),s=({label:t="dismiss",...o})=>{const{size:m,setHasDismiss:i,emphasis:r}=d();return e.useEffect(()=>(i(!0),()=>{i(!1)}),[i]),e.createElement(c.Dismiss,{asChild:!0},e.createElement(f,{label:t,size:"md",hasTooltip:!1,isRounded:!0,theme:"neutral",containerSize:m,emphasis:r,...o},e.createElement(p,{is:n})))};s.displayName="BannerSlimDismiss";export{s as BannerSlimDismiss};
 //# sourceMappingURL=BannerSlimDismiss.js.map

package/dist/components/banner/banner-slim/BannerSlimDismiss.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BannerSlimDismiss.js","sources":["../../../../src/components/banner/banner-slim/BannerSlimDismiss.tsx"],"sourcesContent":["import { Close } from '@atom-learning/icons'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { ActionIcon } from '../../action-icon'\nimport { Icon } from '../../icon'\nimport { Banner } from '../Banner'\nimport { useBannerContext } from '../BannerContext'\n\nconst StyledDismiss = styled(ActionIcon, {\n flexShrink: 0,\n variants: {\n emphasis: {\n ~~highContrast~~: {\n color: 'white !important'\n }\n },\n containerSize: {\n sm: { position: 'absolute', top: '$4', right: '$4' },\n md: { position: 'static' }\n }\n }\n})\n\ntype TBannerSlimDismissProps = React.ComponentProps<typeof StyledDismiss>\n\nexport const BannerSlimDismiss = ({\n label = 'dismiss',\n ...rest\n}: TBannerSlimDismissProps): JSX.Element => {\n const { size, setHasDismiss, emphasis } = useBannerContext()\n\n React.useEffect(() => {\n setHasDismiss(true)\n return () => {\n setHasDismiss(false)\n }\n }, [setHasDismiss])\n\n return (\n <Banner.Dismiss asChild>\n <StyledDismiss\n label={label}\n size=\"md\"\n hasTooltip={false}\n isRounded\n theme=\"neutral\"\n containerSize={size}\n emphasis={emphasis as TBannerSlimDismissProps['emphasis']}\n {...rest}\n >\n <Icon is={Close} />\n </StyledDismiss>\n </Banner.Dismiss>\n )\n}\n\nBannerSlimDismiss.displayName = 'BannerSlimDismiss'\n"],"names":["StyledDismiss","styled","ActionIcon","BannerSlimDismiss","label","rest","size","setHasDismiss","emphasis","useBannerContext","React","Banner","Icon","Close"],"mappings":"uTAUA,MAAMA,EAAgBC,EAAOC,EAAY,CACvC,WAAY,EACZ,SAAU,CACR,SAAU,CACR,~~aAAc~~,~~CACZ~~,MAAO,kBACT,CACF,EACA,cAAe,CACb,GAAI,CAAE,SAAU,WAAY,IAAK,KAAM,MAAO,IAAK,EACnD,GAAI,CAAE,SAAU,QAAS,CAC3B,CACF,CACF,CAAC,~~EAIYC~~,EAAoB,CAAC,CAChC,MAAAC,EAAQ,aACLC,CACL,IAA4C,CAC1C,KAAM,CAAE,KAAAC,EAAM,cAAAC,EAAe,SAAAC,CAAS,EAAIC,IAE1C,OAAAC,EAAM,UAAU,KACdH,EAAc,EAAI,EACX,IAAM,CACXA,EAAc,EAAK,CACrB,GACC,CAACA,CAAa,CAAC,EAGhBG,EAAA,cAACC,EAAO,QAAP,CAAe,QAAO,EACrBD,EAAAA,EAAA,cAACV,EAAA,CACC,MAAOI,EACP,KAAK,KACL,WAAY,GACZ,UAAS,GACT,MAAM,UACN,cAAeE,EACf,SAAUE,EACT,GAAGH,CAEJK,EAAAA,EAAA,cAACE,EAAA,CAAK,GAAIC,CAAAA,CAAO,CACnB,CACF,CAEJ,EAEAV,EAAkB,YAAc"}
1	+ {"version":3,"file":"BannerSlimDismiss.js","sources":["../../../../src/components/banner/banner-slim/BannerSlimDismiss.tsx"],"sourcesContent":["import { Close } from '@atom-learning/icons'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { ActionIcon } from '../../action-icon'\nimport { Icon } from '../../icon'\nimport { Banner } from '../Banner'\nimport { useBannerContext } from '../BannerContext'\n\nconst StyledDismiss = styled(ActionIcon, {\n flexShrink: 0,\n variants: {\n emphasis: {\n bold: {\n color: 'white !important'\n }\n },\n containerSize: {\n sm: { position: 'absolute', top: '$4', right: '$4' },\n md: { position: 'static' }\n }\n }\n})\n\ntype TBannerSlimDismissProps = Omit<\n React.ComponentProps<typeof StyledDismiss>,\n 'children' \| 'onClick' \| 'href'\n>\n\nexport const BannerSlimDismiss = ({\n label = 'dismiss',\n ...rest\n}: TBannerSlimDismissProps): JSX.Element => {\n const { size, setHasDismiss, emphasis } = useBannerContext()\n\n React.useEffect(() => {\n setHasDismiss(true)\n return () => {\n setHasDismiss(false)\n }\n }, [setHasDismiss])\n\n return (\n <Banner.Dismiss asChild>\n <StyledDismiss\n label={label}\n size=\"md\"\n hasTooltip={false}\n isRounded\n theme=\"neutral\"\n containerSize={size}\n emphasis={emphasis as TBannerSlimDismissProps['emphasis']}\n {...rest}\n >\n <Icon is={Close} />\n </StyledDismiss>\n </Banner.Dismiss>\n )\n}\n\nBannerSlimDismiss.displayName = 'BannerSlimDismiss'\n"],"names":["StyledDismiss","styled","ActionIcon","BannerSlimDismiss","label","rest","size","setHasDismiss","emphasis","useBannerContext","React","Banner","Icon","Close"],"mappings":"uTAUA,MAAMA,EAAgBC,EAAOC,EAAY,CACvC,WAAY,EACZ,SAAU,CACR,SAAU,CACR,KAAM,CACJ,MAAO,kBACT,CACF,EACA,cAAe,CACb,GAAI,CAAE,SAAU,WAAY,IAAK,KAAM,MAAO,IAAK,EACnD,GAAI,CAAE,SAAU,QAAS,CAC3B,CACF,CACF,CAAC,EAOYC,EAAoB,CAAC,CAChC,MAAAC,EAAQ,aACLC,CACL,IAA4C,CAC1C,KAAM,CAAE,KAAAC,EAAM,cAAAC,EAAe,SAAAC,CAAS,EAAIC,IAE1C,OAAAC,EAAM,UAAU,KACdH,EAAc,EAAI,EACX,IAAM,CACXA,EAAc,EAAK,CACrB,GACC,CAACA,CAAa,CAAC,EAGhBG,EAAA,cAACC,EAAO,QAAP,CAAe,QAAO,EACrBD,EAAAA,EAAA,cAACV,EAAA,CACC,MAAOI,EACP,KAAK,KACL,WAAY,GACZ,UAAS,GACT,MAAM,UACN,cAAeE,EACf,SAAUE,EACT,GAAGH,CAEJK,EAAAA,EAAA,cAACE,EAAA,CAAK,GAAIC,CAAAA,CAAO,CACnB,CACF,CAEJ,EAEAV,EAAkB,YAAc"}

package/dist/components/button/Button.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{darken as n,opacify as s}from"color2k";import*as t from"react";import{StyledIcon as c}from"../icon/Icon.js";import{Loader as y}from"../loader/Loader.js";import{styled as m,theme as l}from"../../stitches.js";import{getExternalAnchorProps as f}from"../../utilities/uri/index.js";const d=(e,a,r)=>({border:"1px solid",borderColor:"currentColor",color:e,"&[disabled]":{borderColor:"$tonal400",color:"$tonal400",cursor:"not-allowed"},"&:not([disabled]):hover, &:not([disabled]):focus":{textDecoration:"none",color:a},"&:not([disabled]):active":{color:r}}),i=(e,a,r,o="white")=>({bg:e,color:o,"&[disabled]":{bg:"$tonal100",color:"$tonal400",cursor:"not-allowed"},"&:not([disabled]):hover, &:not([disabled]):focus":{bg:a,color:o},"&:not([disabled]):active":{bg:r}}),h=m("button",{alignItems:"center",bg:"unset",border:"unset",borderRadius:"$0",cursor:"pointer",display:"flex",fontFamily:"$body",fontWeight:600,justifyContent:"center",p:"unset",textDecoration:"none",transition:"all 100ms ease-out",whiteSpace:"nowrap",width:"max-content",variants:{theme:{primary:{},secondary:{},success:{},warning:{},danger:{},neutral:{}},appearance:{solid:{},outline:{}},size:{sm:{fontSize:"$sm",lineHeight:1.53,height:"$3",px:"$4",gap:"$2",[`& ${c}`]:{size:16}},md:{fontSize:"$md",lineHeight:1.5,height:"$4",px:"$5",gap:"$3",[`& ${c}`]:{size:20}},lg:{fontSize:"$lg",lineHeight:1.5,height:"$5",px:"$5",gap:"$3",[`& ${c}`]:{size:22}}},isLoading:{true:{cursor:"not-allowed",opacity:.6,pointerEvents:"none"}},fullWidth:{false:{width:"max-content"},true:{width:"100%"}}},compoundVariants:[{theme:"primary",appearance:"solid",css:i("$primary","$primaryMid","$primaryDark")},{theme:"secondary",appearance:"solid",css:i("$primaryDark",n(l.colors.primaryDark.value,.1),n(l.colors.primaryDark.value,.15))},{theme:"success",appearance:"solid",css:i("$success","$successMid","$successDark")},{theme:"warning",appearance:"solid",css:i("$warning","$warningMid","$warningDark","$tonal500")},{theme:"danger",appearance:"solid",css:i("$danger","$dangerMid","$dangerDark")},{theme:"neutral",appearance:"solid",css:i("white",s("white",-.1),s("white",-.25),"$primary")},{theme:"primary",appearance:"outline",css:d("$primary","$primaryMid","$primaryDark")},{theme:"neutral",appearance:"outline",css:d("white",s("white",-.2),s("white",-.35))},{theme:"secondary",appearance:"outline",css:d("$primaryDark",n(l.colors.primaryDark.value,.1),n(l.colors.primaryDark.value,.15))}],defaultVariants:{appearance:"solid",size:"md",theme:"primary"}}),b=m("span",{alignItems:"center",display:"flex",justifyContent:"center",visibility:"hidden",variants:{size:{sm:{gap:"$2"},md:{gap:"$3"},lg:{gap:"$3"}}},defaultVariants:{size:"md"}}),w=({size:e,children:a})=>t.createElement(t.Fragment,null,t.createElement(y,{css:{position:"absolute"}}),t.createElement(b,{size:e},a)),u=t.forwardRef(({children:e,as:a,href:r,isLoading:o=!1,onClick:$,...p},g)=>t.createElement(h,{as:a||(r?"a":void 0),href:r,isLoading:o,onClick:o?void 0:$,type:r?void 0:"button",...p,...f(r),ref:g},o?t.createElement(w,{size:p.size},e):e));u.displayName="Button";export{u as Button,h as StyledButton};
+import{darken as n,opacify as s}from"color2k";import*as i from"react";import{StyledIcon as d}from"../icon/Icon.js";import{Loader as f}from"../loader/Loader.js";import{styled as h,theme as l}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"../../utilities/style/keyframe-animations.js";import{disabledStyle as c}from"../../utilities/style/disabledStyle.js";import{getExternalAnchorProps as b}from"../../utilities/uri/index.js";const p=(e,r,a)=>({border:"1px solid",borderColor:"currentColor",color:e,"&[disabled]":c,"&:not([disabled]):hover, &:not([disabled]):focus":{textDecoration:"none",color:r},"&:not([disabled]):active":{color:a}}),o=(e,r,a,t="white")=>({bg:e,color:t,"&[disabled]":c,"&:not([disabled]):hover, &:not([disabled]):focus":{bg:r,color:t},"&:not([disabled]):active":{bg:a}}),u=h("button",{alignItems:"center",bg:"unset",border:"unset",borderRadius:"$0",cursor:"pointer",display:"flex",fontFamily:"$body",fontWeight:600,justifyContent:"center",p:"unset",textDecoration:"none",transition:"all 100ms ease-out",whiteSpace:"nowrap",width:"max-content","&[disabled]":c,variants:{theme:{primary:{},secondary:{},success:{},warning:{},danger:{},neutral:{}},appearance:{solid:{},outline:{}},size:{sm:{fontSize:"$sm",lineHeight:1.53,height:"$3",px:"$4",gap:"$2",[`& ${d}`]:{size:16}},md:{fontSize:"$md",lineHeight:1.5,height:"$4",px:"$5",gap:"$3",[`& ${d}`]:{size:20}},lg:{fontSize:"$lg",lineHeight:1.5,height:"$5",px:"$5",gap:"$3",[`& ${d}`]:{size:22}}},isLoading:{true:{cursor:"not-allowed",opacity:.6,pointerEvents:"none"}},fullWidth:{false:{width:"max-content"},true:{width:"100%"}}},compoundVariants:[{theme:"primary",appearance:"solid",css:o("$primary","$primaryMid","$primaryDark")},{theme:"secondary",appearance:"solid",css:o("$primaryDark",n(l.colors.primaryDark.value,.1),n(l.colors.primaryDark.value,.15))},{theme:"success",appearance:"solid",css:o("$success","$successMid","$successDark")},{theme:"warning",appearance:"solid",css:o("$warning","$warningMid","$warningDark","$tonal500")},{theme:"danger",appearance:"solid",css:o("$danger","$dangerMid","$dangerDark")},{theme:"neutral",appearance:"solid",css:o("white",s("white",-.1),s("white",-.25),"$primary")},{theme:"primary",appearance:"outline",css:p("$primary","$primaryMid","$primaryDark")},{theme:"neutral",appearance:"outline",css:p("white",s("white",-.2),s("white",-.35))},{theme:"secondary",appearance:"outline",css:p("$primaryDark",n(l.colors.primaryDark.value,.1),n(l.colors.primaryDark.value,.15))}],defaultVariants:{appearance:"solid",size:"md",theme:"primary"}}),w=h("span",{alignItems:"center",display:"flex",justifyContent:"center",visibility:"hidden",variants:{size:{sm:{gap:"$2"},md:{gap:"$3"},lg:{gap:"$3"}}},defaultVariants:{size:"md"}}),v=({size:e,children:r})=>i.createElement(i.Fragment,null,i.createElement(f,{css:{position:"absolute"}}),i.createElement(w,{size:e},r)),$=i.forwardRef(({children:e,as:r,href:a,isLoading:t=!1,onClick:g,...m},y)=>i.createElement(u,{as:r||(a?"a":void 0),href:a,isLoading:t,onClick:t?void 0:g,type:a?void 0:"button",...m,...b(a),ref:y},t?i.createElement(v,{size:m.size},e):e));$.displayName="Button";export{$ as Button,u as StyledButton};
 //# sourceMappingURL=Button.js.map

package/dist/components/button/Button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.js","sources":["../../../src/components/button/Button.tsx"],"sourcesContent":["import type { VariantProps } from '@stitches/react'\nimport { darken, opacify } from 'color2k'\nimport * as React from 'react'\n\nimport { Box } from '~/components/box'\nimport { StyledIcon } from '~/components/icon'\nimport { Loader } from '~/components/loader'\nimport { styled, theme } from '~/stitches'\nimport { NavigatorActions } from '~/types'\nimport { Override } from '~/utilities'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nconst getButtonOutlineVariant = (\n base: string,\n interact: string,\n active: string\n) => ({\n border: '1px solid',\n borderColor: 'currentColor',\n color: base,\n '&[disabled]': ~~{\n borderColor: '$tonal400'~~,\n ~~color: '$tonal400',\n cursor: 'not-allowed'\n~~ ~~},\n~~ '&:not([disabled]):hover, &:not([disabled]):focus': {\n textDecoration: 'none',\n color: interact\n },\n '&:not([disabled]):active': {\n color: active\n }\n})\n\nconst getButtonSolidVariant = (\n base: string,\n interact: string,\n active: string,\n text = 'white'\n) => ({\n bg: base,\n color: text,\n '&[disabled]': ~~{\n bg: '$tonal100'~~,\n ~~color: '$tonal400',\n cursor: 'not-allowed'\n~~ ~~},\n~~ '&:not([disabled]):hover, &:not([disabled]):focus': {\n bg: interact,\n color: text\n },\n '&:not([disabled]):active': {\n bg: active\n }\n})\n\nexport const StyledButton = styled('button', {\n alignItems: 'center',\n bg: 'unset',\n border: 'unset',\n borderRadius: '$0',\n cursor: 'pointer',\n display: 'flex',\n fontFamily: '$body',\n fontWeight: 600,\n justifyContent: 'center',\n p: 'unset',\n textDecoration: 'none',\n transition: 'all 100ms ease-out',\n whiteSpace: 'nowrap',\n width: 'max-content',\n variants: {\n theme: {\n primary: {},\n secondary: {},\n success: {},\n warning: {},\n danger: {},\n neutral: {}\n },\n appearance: {\n solid: {},\n outline: {}\n },\n size: {\n sm: {\n fontSize: '$sm',\n lineHeight: 1.53,\n height: '$3',\n px: '$4',\n gap: '$2',\n [`& ${StyledIcon}`]: { size: 16 }\n },\n md: {\n fontSize: '$md',\n lineHeight: 1.5,\n height: '$4',\n px: '$5',\n gap: '$3',\n [`& ${StyledIcon}`]: { size: 20 }\n },\n lg: {\n fontSize: '$lg',\n lineHeight: 1.5,\n height: '$5',\n px: '$5',\n gap: '$3',\n [`& ${StyledIcon}`]: { size: 22 }\n }\n },\n isLoading: {\n true: {\n cursor: 'not-allowed',\n opacity: 0.6,\n pointerEvents: 'none'\n }\n },\n fullWidth: {\n false: {\n width: 'max-content'\n },\n true: {\n width: '100%'\n }\n }\n },\n\n compoundVariants: [\n {\n theme: 'primary',\n appearance: 'solid',\n css: getButtonSolidVariant('$primary', '$primaryMid', '$primaryDark')\n },\n {\n theme: 'secondary',\n appearance: 'solid',\n css: getButtonSolidVariant(\n '$primaryDark',\n darken(theme.colors.primaryDark.value, 0.1),\n darken(theme.colors.primaryDark.value, 0.15)\n )\n },\n {\n theme: 'success',\n appearance: 'solid',\n css: getButtonSolidVariant('$success', '$successMid', '$successDark')\n },\n {\n theme: 'warning',\n appearance: 'solid',\n css: getButtonSolidVariant(\n '$warning',\n '$warningMid',\n '$warningDark',\n '$tonal500'\n )\n },\n {\n theme: 'danger',\n appearance: 'solid',\n css: getButtonSolidVariant('$danger', '$dangerMid', '$dangerDark')\n },\n {\n theme: 'neutral',\n appearance: 'solid',\n css: getButtonSolidVariant(\n 'white',\n opacify('white', -0.1),\n opacify('white', -0.25),\n '$primary'\n )\n },\n {\n theme: 'primary',\n appearance: 'outline',\n css: getButtonOutlineVariant('$primary', '$primaryMid', '$primaryDark')\n },\n {\n theme: 'neutral',\n appearance: 'outline',\n css: getButtonOutlineVariant(\n 'white',\n opacify('white', -0.2),\n opacify('white', -0.35)\n )\n },\n {\n theme: 'secondary',\n appearance: 'outline',\n css: getButtonOutlineVariant(\n '$primaryDark',\n darken(theme.colors.primaryDark.value, 0.1),\n darken(theme.colors.primaryDark.value, 0.15)\n )\n }\n ],\n\n defaultVariants: {\n appearance: 'solid',\n size: 'md',\n theme: 'primary'\n }\n})\n\nconst LoaderContentsWrapper = styled('span', {\n alignItems: 'center',\n display: 'flex',\n justifyContent: 'center',\n visibility: 'hidden',\n variants: {\n size: {\n sm: { gap: '$2' },\n md: { gap: '$3' },\n lg: { gap: '$3' }\n }\n },\n defaultVariants: {\n size: 'md'\n }\n})\n\nconst WithLoader = ({\n size,\n children\n}: React.ComponentProps<typeof LoaderContentsWrapper>) => (\n <>\n <Loader css={{ position: 'absolute' }} />\n <LoaderContentsWrapper size={size}>{children}</LoaderContentsWrapper>\n </>\n)\n\ntype ButtonProps = Override<\n React.ComponentProps<typeof StyledButton>,\n VariantProps<typeof StyledButton> & {\n as?: React.ComponentType \| React.ElementType\n children: React.ReactNode\n href?: string\n isLoading?: boolean\n } & NavigatorActions\n>\n\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n ({ children, as, href, isLoading = false, onClick, ...rest }, ref) => (\n <StyledButton\n as={as \|\| (href ? 'a' : undefined)}\n href={href}\n isLoading={isLoading}\n onClick={!isLoading ? onClick : undefined}\n type={!href ? 'button' : undefined}\n {...rest}\n {...getExternalAnchorProps(href)}\n ref={ref}\n >\n {isLoading ? (\n <WithLoader size={rest.size}>{children}</WithLoader>\n ) : (\n children\n )}\n </StyledButton>\n )\n) as React.FC<ButtonProps>\n\nButton.displayName = 'Button'\n"],"names":["getButtonOutlineVariant","base","interact","active","getButtonSolidVariant","text","StyledButton","styled","StyledIcon","darken","theme","opacify","LoaderContentsWrapper","WithLoader","size","children","React","Loader","Button","as","href","isLoading","onClick","rest","ref","getExternalAnchorProps"],"mappings":"~~4RAYA~~,MAAMA,EAA0B,CAC9BC,EACAC,EACAC,KACI,CACJ,OAAQ,YACR,YAAa,eACb,MAAOF,EACP,~~cAAe~~,~~CACb~~,~~YAAa,YACb,MAAO,YACP,OAAQ,aACV,EACA,~~mDAAoD,CAClD,eAAgB,OAChB,~~MAAOC~~,CACT,EACA,2BAA4B,CAC1B,MAAOC,CACT,CACF,~~GAEMC~~,EAAwB,~~CAC5BH~~,EACAC,EACAC,~~EACAE~~,EAAO,WACH,CACJ,~~GAAIJ~~,EACJ,~~MAAOI~~,EACP,~~cAAe~~,~~CACb~~,~~GAAI,YACJ,MAAO,YACP,OAAQ,aACV,EACA,~~mDAAoD,CAClD,~~GAAIH~~,EACJ,~~MAAOG~~,CACT,EACA,2BAA4B,CAC1B,~~GAAIF~~,CACN,CACF,~~GAEaG~~,EAAeC,EAAO,SAAU,CAC3C,WAAY,SACZ,GAAI,QACJ,OAAQ,QACR,aAAc,KACd,OAAQ,UACR,QAAS,OACT,WAAY,QACZ,WAAY,IACZ,eAAgB,SAChB,EAAG,QACH,eAAgB,OAChB,WAAY,qBACZ,WAAY,SACZ,MAAO,cACP,SAAU,CACR,MAAO,CACL,QAAS,~~CACT~~,~~EAAA~~,UAAW,~~CAAC~~,~~EACZ,~~QAAS,~~CAAA~~,~~EACT,~~QAAS,CAAA,EACT,OAAQ,CACR,EAAA,QAAS,~~EACX~~,EACA,WAAY,CACV,MAAO,CAAA,EACP,QAAS,CAAA,~~CACX,~~EACA,KAAM,CACJ,GAAI,CACF,SAAU,MACV,WAAY,KACZ,OAAQ,KACR,GAAI,KACJ,IAAK,KACL,CAAC,~~KAAKC~~,KAAe,CAAE,KAAM,EAAG,CAClC,EACA,GAAI,CACF,SAAU,MACV,WAAY,IACZ,OAAQ,KACR,GAAI,KACJ,IAAK,KACL,CAAC,KAAKA,KAAe,CAAE,KAAM,EAAG,CAClC,EACA,GAAI,CACF,SAAU,MACV,WAAY,IACZ,OAAQ,KACR,GAAI,KACJ,IAAK,KACL,CAAC,KAAKA,KAAe,CAAE,KAAM,EAAG,CAClC,CACF,EACA,UAAW,CACT,KAAM,CACJ,OAAQ,cACR,QAAS,GACT,cAAe,MACjB,CACF,EACA,UAAW,CACT,MAAO,CACL,MAAO,aACT,EACA,KAAM,CACJ,MAAO,MACT,CACF,CACF,EAEA,iBAAkB,CAChB,CACE,MAAO,UACP,WAAY,QACZ,IAAKJ,EAAsB,WAAY,cAAe,cAAc,CACtE,EACA,CACE,MAAO,YACP,WAAY,QACZ,IAAKA,EACH,eACAK,EAAOC,EAAM,OAAO,YAAY,MAAO,EAAG,EAC1CD,EAAOC,EAAM,OAAO,YAAY,MAAO,GAAI,CAC7C,CACF,EACA,CACE,MAAO,UACP,WAAY,QACZ,IAAKN,EAAsB,WAAY,cAAe,cAAc,CACtE,EACA,CACE,MAAO,UACP,WAAY,QACZ,IAAKA,EACH,WACA,cACA,eACA,WACF,CACF,EACA,CACE,MAAO,SACP,WAAY,QACZ,IAAKA,EAAsB,UAAW,aAAc,aAAa,CACnE,EACA,CACE,MAAO,UACP,WAAY,QACZ,IAAKA,EACH,QACAO,EAAQ,QAAS,GAAI,EACrBA,EAAQ,QAAS,IAAK,EACtB,UACF,CACF,EACA,CACE,MAAO,UACP,WAAY,UACZ,~~IAAKX~~,EAAwB,WAAY,cAAe,cAAc,CACxE,EACA,CACE,MAAO,UACP,WAAY,UACZ,IAAKA,EACH,~~QACAW~~,EAAQ,QAAS,GAAI,EACrBA,EAAQ,QAAS,IAAK,CACxB,CACF,EACA,CACE,MAAO,YACP,WAAY,UACZ,~~IAAKX~~,EACH,~~eACAS~~,EAAOC,EAAM,OAAO,YAAY,MAAO,EAAG,EAC1CD,EAAOC,EAAM,OAAO,YAAY,MAAO,GAAI,CAC7C,CACF,CACF,EAEA,gBAAiB,CACf,WAAY,QACZ,KAAM,KACN,MAAO,SACT,CACF,CAAC,EAEKE,EAAwBL,EAAO,OAAQ,CAC3C,WAAY,SACZ,QAAS,OACT,eAAgB,SAChB,WAAY,SACZ,SAAU,CACR,KAAM,CACJ,GAAI,CAAE,IAAK,IAAK,EAChB,GAAI,CAAE,IAAK,IAAK,EAChB,GAAI,CAAE,IAAK,IAAK,CAClB,CACF,EACA,gBAAiB,CACf,KAAM,IACR,CACF,CAAC,EAEKM,EAAa,CAAC,CAClB,KAAAC,EACA,SAAAC,CACF,IACEC,EAAA,cAAAA,EAAA,~~SACEA~~,~~KAAAA~~,EAAA,cAACC,EAAA,CAAO,IAAK,CAAE,SAAU,UAAW,CAAA,~~CAAG,~~EACvCD,EAAA,cAACJ,EAAA,CAAsB,KAAME,~~CAAAA~~,~~EAAOC~~,CAAS,CAC/C,EAaWG,EAASF,EAAM,WAC1B,CAAC,CAAE,SAAAD,EAAU,GAAAI,EAAI,KAAAC,EAAM,UAAAC,EAAY,GAAO,QAAAC,KAAYC,CAAK,EAAGC,IAC5DR,EAAA,cAACV,~~EACC~~,~~CAAA~~,GAAIa,IAAOC,EAAO,IAAM,QACxB,KAAMA,EACN,UAAWC,EACX,QAAUA,EAAsB,OAAVC,EACtB,KAAOF,EAAkB,OAAX,SACb,GAAGG,EACH,GAAGE,EAAuBL,CAAI,EAC/B,IAAKI,~~CAAAA~~,~~EAEJH~~,EACCL,EAAA,cAACH,EAAA,CAAW,KAAMU,EAAK,IAAOR,EAAAA,CAAS,EAEvCA,CAEJ,CAEJ,EAEAG,EAAO,YAAc"}
1	+ {"version":3,"file":"Button.js","sources":["../../../src/components/button/Button.tsx"],"sourcesContent":["import type { VariantProps } from '@stitches/react'\nimport { darken, opacify } from 'color2k'\nimport * as React from 'react'\n\nimport { Box } from '~/components/box'\nimport { StyledIcon } from '~/components/icon'\nimport { Loader } from '~/components/loader'\nimport { styled, theme } from '~/stitches'\nimport { NavigatorActions } from '~/types'\nimport { disabledStyle, Override } from '~/utilities'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nconst getButtonOutlineVariant = (\n base: string,\n interact: string,\n active: string\n) => ({\n border: '1px solid',\n borderColor: 'currentColor',\n color: base,\n '&[disabled]': disabledStyle,\n '&:not([disabled]):hover, &:not([disabled]):focus': {\n textDecoration: 'none',\n color: interact\n },\n '&:not([disabled]):active': {\n color: active\n }\n})\n\nconst getButtonSolidVariant = (\n base: string,\n interact: string,\n active: string,\n text = 'white'\n) => ({\n bg: base,\n color: text,\n '&[disabled]': disabledStyle,\n '&:not([disabled]):hover, &:not([disabled]):focus': {\n bg: interact,\n color: text\n },\n '&:not([disabled]):active': {\n bg: active\n }\n})\n\nexport const StyledButton = styled('button', {\n alignItems: 'center',\n bg: 'unset',\n border: 'unset',\n borderRadius: '$0',\n cursor: 'pointer',\n display: 'flex',\n fontFamily: '$body',\n fontWeight: 600,\n justifyContent: 'center',\n p: 'unset',\n textDecoration: 'none',\n transition: 'all 100ms ease-out',\n whiteSpace: 'nowrap',\n width: 'max-content',\n '&[disabled]': disabledStyle,\n variants: {\n theme: {\n primary: {},\n secondary: {},\n success: {},\n warning: {},\n danger: {},\n neutral: {}\n },\n appearance: {\n solid: {},\n outline: {}\n },\n size: {\n sm: {\n fontSize: '$sm',\n lineHeight: 1.53,\n height: '$3',\n px: '$4',\n gap: '$2',\n [`& ${StyledIcon}`]: { size: 16 }\n },\n md: {\n fontSize: '$md',\n lineHeight: 1.5,\n height: '$4',\n px: '$5',\n gap: '$3',\n [`& ${StyledIcon}`]: { size: 20 }\n },\n lg: {\n fontSize: '$lg',\n lineHeight: 1.5,\n height: '$5',\n px: '$5',\n gap: '$3',\n [`& ${StyledIcon}`]: { size: 22 }\n }\n },\n isLoading: {\n true: {\n cursor: 'not-allowed',\n opacity: 0.6,\n pointerEvents: 'none'\n }\n },\n fullWidth: {\n false: {\n width: 'max-content'\n },\n true: {\n width: '100%'\n }\n }\n },\n\n compoundVariants: [\n {\n theme: 'primary',\n appearance: 'solid',\n css: getButtonSolidVariant('$primary', '$primaryMid', '$primaryDark')\n },\n {\n theme: 'secondary',\n appearance: 'solid',\n css: getButtonSolidVariant(\n '$primaryDark',\n darken(theme.colors.primaryDark.value, 0.1),\n darken(theme.colors.primaryDark.value, 0.15)\n )\n },\n {\n theme: 'success',\n appearance: 'solid',\n css: getButtonSolidVariant('$success', '$successMid', '$successDark')\n },\n {\n theme: 'warning',\n appearance: 'solid',\n css: getButtonSolidVariant(\n '$warning',\n '$warningMid',\n '$warningDark',\n '$tonal500'\n )\n },\n {\n theme: 'danger',\n appearance: 'solid',\n css: getButtonSolidVariant('$danger', '$dangerMid', '$dangerDark')\n },\n {\n theme: 'neutral',\n appearance: 'solid',\n css: getButtonSolidVariant(\n 'white',\n opacify('white', -0.1),\n opacify('white', -0.25),\n '$primary'\n )\n },\n {\n theme: 'primary',\n appearance: 'outline',\n css: getButtonOutlineVariant('$primary', '$primaryMid', '$primaryDark')\n },\n {\n theme: 'neutral',\n appearance: 'outline',\n css: getButtonOutlineVariant(\n 'white',\n opacify('white', -0.2),\n opacify('white', -0.35)\n )\n },\n {\n theme: 'secondary',\n appearance: 'outline',\n css: getButtonOutlineVariant(\n '$primaryDark',\n darken(theme.colors.primaryDark.value, 0.1),\n darken(theme.colors.primaryDark.value, 0.15)\n )\n }\n ],\n\n defaultVariants: {\n appearance: 'solid',\n size: 'md',\n theme: 'primary'\n }\n})\n\nconst LoaderContentsWrapper = styled('span', {\n alignItems: 'center',\n display: 'flex',\n justifyContent: 'center',\n visibility: 'hidden',\n variants: {\n size: {\n sm: { gap: '$2' },\n md: { gap: '$3' },\n lg: { gap: '$3' }\n }\n },\n defaultVariants: {\n size: 'md'\n }\n})\n\nconst WithLoader = ({\n size,\n children\n}: React.ComponentProps<typeof LoaderContentsWrapper>) => (\n <>\n <Loader css={{ position: 'absolute' }} />\n <LoaderContentsWrapper size={size}>{children}</LoaderContentsWrapper>\n </>\n)\n\ntype ButtonProps = Override<\n React.ComponentProps<typeof StyledButton>,\n VariantProps<typeof StyledButton> & {\n as?: React.ComponentType \| React.ElementType\n children: React.ReactNode\n href?: string\n isLoading?: boolean\n } & NavigatorActions\n>\n\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n ({ children, as, href, isLoading = false, onClick, ...rest }, ref) => (\n <StyledButton\n as={as \|\| (href ? 'a' : undefined)}\n href={href}\n isLoading={isLoading}\n onClick={!isLoading ? onClick : undefined}\n type={!href ? 'button' : undefined}\n {...rest}\n {...getExternalAnchorProps(href)}\n ref={ref}\n >\n {isLoading ? (\n <WithLoader size={rest.size}>{children}</WithLoader>\n ) : (\n children\n )}\n </StyledButton>\n )\n) as React.FC<ButtonProps>\n\nButton.displayName = 'Button'\n"],"names":["getButtonOutlineVariant","base","interact","active","disabledStyle","getButtonSolidVariant","text","StyledButton","styled","StyledIcon","darken","theme","opacify","LoaderContentsWrapper","WithLoader","size","children","React","Loader","Button","as","href","isLoading","onClick","rest","ref","getExternalAnchorProps"],"mappings":"2gBAYA,MAAMA,EAA0B,CAC9BC,EACAC,EACAC,KACI,CACJ,OAAQ,YACR,YAAa,eACb,MAAOF,EACP,cAAeG,EACf,mDAAoD,CAClD,eAAgB,OAChB,MAAOF,CACT,EACA,2BAA4B,CAC1B,MAAOC,CACT,CACF,GAEME,EAAwB,CAC5BJ,EACAC,EACAC,EACAG,EAAO,WACH,CACJ,GAAIL,EACJ,MAAOK,EACP,cAAeF,EACf,mDAAoD,CAClD,GAAIF,EACJ,MAAOI,CACT,EACA,2BAA4B,CAC1B,GAAIH,CACN,CACF,GAEaI,EAAeC,EAAO,SAAU,CAC3C,WAAY,SACZ,GAAI,QACJ,OAAQ,QACR,aAAc,KACd,OAAQ,UACR,QAAS,OACT,WAAY,QACZ,WAAY,IACZ,eAAgB,SAChB,EAAG,QACH,eAAgB,OAChB,WAAY,qBACZ,WAAY,SACZ,MAAO,cACP,cAAeJ,EACf,SAAU,CACR,MAAO,CACL,QAAS,CAAA,EACT,UAAW,GACX,QAAS,GACT,QAAS,CAAA,EACT,OAAQ,CACR,EAAA,QAAS,CACX,CAAA,EACA,WAAY,CACV,MAAO,CAAA,EACP,QAAS,CACX,CAAA,EACA,KAAM,CACJ,GAAI,CACF,SAAU,MACV,WAAY,KACZ,OAAQ,KACR,GAAI,KACJ,IAAK,KACL,CAAC,KAAKK,KAAe,CAAE,KAAM,EAAG,CAClC,EACA,GAAI,CACF,SAAU,MACV,WAAY,IACZ,OAAQ,KACR,GAAI,KACJ,IAAK,KACL,CAAC,KAAKA,KAAe,CAAE,KAAM,EAAG,CAClC,EACA,GAAI,CACF,SAAU,MACV,WAAY,IACZ,OAAQ,KACR,GAAI,KACJ,IAAK,KACL,CAAC,KAAKA,KAAe,CAAE,KAAM,EAAG,CAClC,CACF,EACA,UAAW,CACT,KAAM,CACJ,OAAQ,cACR,QAAS,GACT,cAAe,MACjB,CACF,EACA,UAAW,CACT,MAAO,CACL,MAAO,aACT,EACA,KAAM,CACJ,MAAO,MACT,CACF,CACF,EAEA,iBAAkB,CAChB,CACE,MAAO,UACP,WAAY,QACZ,IAAKJ,EAAsB,WAAY,cAAe,cAAc,CACtE,EACA,CACE,MAAO,YACP,WAAY,QACZ,IAAKA,EACH,eACAK,EAAOC,EAAM,OAAO,YAAY,MAAO,EAAG,EAC1CD,EAAOC,EAAM,OAAO,YAAY,MAAO,GAAI,CAC7C,CACF,EACA,CACE,MAAO,UACP,WAAY,QACZ,IAAKN,EAAsB,WAAY,cAAe,cAAc,CACtE,EACA,CACE,MAAO,UACP,WAAY,QACZ,IAAKA,EACH,WACA,cACA,eACA,WACF,CACF,EACA,CACE,MAAO,SACP,WAAY,QACZ,IAAKA,EAAsB,UAAW,aAAc,aAAa,CACnE,EACA,CACE,MAAO,UACP,WAAY,QACZ,IAAKA,EACH,QACAO,EAAQ,QAAS,GAAI,EACrBA,EAAQ,QAAS,IAAK,EACtB,UACF,CACF,EACA,CACE,MAAO,UACP,WAAY,UACZ,IAAKZ,EAAwB,WAAY,cAAe,cAAc,CACxE,EACA,CACE,MAAO,UACP,WAAY,UACZ,IAAKA,EACH,QACAY,EAAQ,QAAS,GAAI,EACrBA,EAAQ,QAAS,IAAK,CACxB,CACF,EACA,CACE,MAAO,YACP,WAAY,UACZ,IAAKZ,EACH,eACAU,EAAOC,EAAM,OAAO,YAAY,MAAO,EAAG,EAC1CD,EAAOC,EAAM,OAAO,YAAY,MAAO,GAAI,CAC7C,CACF,CACF,EAEA,gBAAiB,CACf,WAAY,QACZ,KAAM,KACN,MAAO,SACT,CACF,CAAC,EAEKE,EAAwBL,EAAO,OAAQ,CAC3C,WAAY,SACZ,QAAS,OACT,eAAgB,SAChB,WAAY,SACZ,SAAU,CACR,KAAM,CACJ,GAAI,CAAE,IAAK,IAAK,EAChB,GAAI,CAAE,IAAK,IAAK,EAChB,GAAI,CAAE,IAAK,IAAK,CAClB,CACF,EACA,gBAAiB,CACf,KAAM,IACR,CACF,CAAC,EAEKM,EAAa,CAAC,CAClB,KAAAC,EACA,SAAAC,CACF,IACEC,EAAA,cAAAA,EAAA,SAAA,KACEA,EAAA,cAACC,EAAA,CAAO,IAAK,CAAE,SAAU,UAAW,CAAG,CAAA,EACvCD,EAAA,cAACJ,EAAA,CAAsB,KAAME,CAAOC,EAAAA,CAAS,CAC/C,EAaWG,EAASF,EAAM,WAC1B,CAAC,CAAE,SAAAD,EAAU,GAAAI,EAAI,KAAAC,EAAM,UAAAC,EAAY,GAAO,QAAAC,KAAYC,CAAK,EAAGC,IAC5DR,EAAA,cAACV,EAAA,CACC,GAAIa,IAAOC,EAAO,IAAM,QACxB,KAAMA,EACN,UAAWC,EACX,QAAUA,EAAsB,OAAVC,EACtB,KAAOF,EAAkB,OAAX,SACb,GAAGG,EACH,GAAGE,EAAuBL,CAAI,EAC/B,IAAKI,CAEJH,EAAAA,EACCL,EAAA,cAACH,EAAA,CAAW,KAAMU,EAAK,IAAOR,EAAAA,CAAS,EAEvCA,CAEJ,CAEJ,EAEAG,EAAO,YAAc"}

package/dist/components/checkbox/Checkbox.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{Minus as d,Ok as m}from"@atom-learning/icons";import*as t from"@radix-ui/react-checkbox";import*as o from"react";import{styled as a}from"../../stitches.js";import{overrideStitchesVariantValue as c}from"../../utilities/override-stitches-variant-value/overrideStitchesVariantValue.js";import{Icon as p}from"../icon/Icon.js";const u=a(t.Indicator,{position:"absolute",top:"50%",left:"50%",transform:"translateX(-50%) translateY(-50%)"}),f=a(t.Root,{appearance:"none",position:"relative",backgroundColor:"transparent",border:"1px solid $colors$tonal400",borderRadius:"3px",color:"white",cursor:"pointer",size:"$1",p:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"all 50ms ease-out",'&[data-state="checked"]':{backgroundColor:"$primary",borderColor:"$primary"},'&[data-state="indeterminate"]':{backgroundColor:"$primary",borderColor:"$primary"},"&:focus":{outline:"2px solid $primary",outlineOffset:"1px"},"&[disabled]":{backgroundColor:"$tonal100",borderColor:"$tonal400",cursor:"not-allowed",color:"$tonal400"},variants:{state:{error:{borderColor:"$danger"}},size:{md:{size:"$1"},lg:{size:"$2",mt:"-$1"}}}}),b={md:"sm",lg:"md"},i=o.forwardRef(({size:r="md",...e},s)=>{const n=o.useMemo(()=>c(r,l=>b[l]),[r]);return o.createElement(f,{...e,size:r,ref:s},o.createElement(u,{asChild:!0},o.createElement(p,{is:e.checked==="indeterminate"?d:m,css:{strokeWidth:"3"},size:n})))});i.displayName="Checkbox";export{i as Checkbox};
+import{Minus as l,Ok as d}from"@atom-learning/icons";import*as t from"@radix-ui/react-checkbox";import*as r from"react";import{styled as i}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 p}from"../../utilities/override-stitches-variant-value/overrideStitchesVariantValue.js";import{disabledStyle as c}from"../../utilities/style/disabledStyle.js";import{Icon as f}from"../icon/Icon.js";const u=i(t.Indicator,{position:"absolute",top:"50%",left:"50%",transform:"translateX(-50%) translateY(-50%)"}),b=i(t.Root,{appearance:"none",position:"relative",backgroundColor:"transparent",border:"1px solid $colors$tonal400",borderRadius:"3px",color:"white",cursor:"pointer",size:"$1",p:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"all 50ms ease-out",'&[data-state="checked"]':{backgroundColor:"$primary",borderColor:"$primary"},'&[data-state="indeterminate"]':{backgroundColor:"$primary",borderColor:"$primary"},"&:focus":{outline:"2px solid $primary",outlineOffset:"1px"},"&[disabled]":c,variants:{state:{error:{borderColor:"$danger"}},size:{md:{size:"$1"},lg:{size:"$2",mt:"-$1"}}}}),C={md:"sm",lg:"md"},a=r.forwardRef(({size:e="md",...o},s)=>{const n=r.useMemo(()=>p(e,m=>C[m]),[e]);return r.createElement(b,{...o,size:e,ref:s},r.createElement(u,{asChild:!0},r.createElement(f,{is:o.checked==="indeterminate"?l:d,css:{strokeWidth:"3"},size:n})))});a.displayName="Checkbox";export{a as Checkbox};
 //# sourceMappingURL=Checkbox.js.map

package/dist/components/checkbox/Checkbox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Checkbox.js","sources":["../../../src/components/checkbox/Checkbox.tsx"],"sourcesContent":["import { Minus, Ok } from '@atom-learning/icons'\nimport * as RadixCheckbox from '@radix-ui/react-checkbox'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { overrideStitchesVariantValue } from '~/utilities/override-stitches-variant-value/overrideStitchesVariantValue'\n\nimport { Icon } from '../icon'\n\nconst StyledIndicator = styled(RadixCheckbox.Indicator, {\n position: 'absolute',\n top: '50%',\n left: '50%',\n transform: 'translateX(-50%) translateY(-50%)'\n})\n\nconst StyledCheckbox = styled(RadixCheckbox.Root, {\n appearance: 'none',\n position: 'relative',\n backgroundColor: 'transparent',\n border: '1px solid $colors$tonal400',\n borderRadius: '3px',\n color: 'white',\n cursor: 'pointer',\n size: '$1',\n p: 0,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n transition: 'all 50ms ease-out',\n '&[data-state=\"checked\"]': {\n backgroundColor: '$primary',\n borderColor: '$primary'\n },\n '&[data-state=\"indeterminate\"]': {\n backgroundColor: '$primary',\n borderColor: '$primary'\n },\n '&:focus': {\n outline: '2px solid $primary',\n outlineOffset: '1px'\n },\n '&[disabled]': ~~{\n backgroundColor: '$tonal100'~~,\n ~~borderColor: '$tonal400',\n cursor: 'not-allowed',\n color: '$tonal400'\n~~ ~~},\n~~ variants: {\n state: {\n error: {\n borderColor: '$danger'\n }\n },\n size: {\n md: {\n size: '$1'\n },\n lg: {\n size: '$2',\n mt: '-$1'\n }\n }\n }\n})\n\nconst toIconSize = {\n md: 'sm',\n lg: 'md'\n}\n\ntype CheckboxProps = React.ComponentProps<typeof StyledCheckbox>\n\nexport const Checkbox: React.FC<CheckboxProps> = React.forwardRef(\n ({ size = 'md', ...props }, ref) => {\n const iconSize = React.useMemo(\n () => overrideStitchesVariantValue(size, (s) => toIconSize[s]),\n [size]\n )\n\n return (\n <StyledCheckbox {...props} size={size} ref={ref}>\n <StyledIndicator asChild>\n <Icon\n is={props.checked === 'indeterminate' ? Minus : Ok}\n css={{\n strokeWidth: '3'\n }}\n size={iconSize}\n />\n </StyledIndicator>\n </StyledCheckbox>\n )\n }\n)\n\nCheckbox.displayName = 'Checkbox'\n"],"names":["StyledIndicator","styled","RadixCheckbox","StyledCheckbox","toIconSize","Checkbox","React","size","props","ref","iconSize","overrideStitchesVariantValue","s","Icon","Minus","Ok"],"mappings":"~~yUASA~~,MAAMA,EAAkBC,EAAOC,EAAc,UAAW,CACtD,SAAU,WACV,IAAK,MACL,KAAM,MACN,UAAW,mCACb,CAAC,EAEKC,EAAiBF,EAAOC,EAAc,KAAM,CAChD,WAAY,OACZ,SAAU,WACV,gBAAiB,cACjB,OAAQ,6BACR,aAAc,MACd,MAAO,QACP,OAAQ,UACR,KAAM,KACN,EAAG,EACH,QAAS,OACT,WAAY,SACZ,eAAgB,SAChB,WAAY,oBACZ,0BAA2B,CACzB,gBAAiB,WACjB,YAAa,UACf,EACA,gCAAiC,CAC/B,gBAAiB,WACjB,YAAa,UACf,EACA,UAAW,CACT,QAAS,qBACT,cAAe,KACjB,EACA,~~cAAe~~,~~CACb~~,~~gBAAiB,YACjB,YAAa,YACb,OAAQ,cACR,MAAO,WACT,EACA,~~SAAU,CACR,MAAO,CACL,MAAO,CACL,YAAa,SACf,CACF,EACA,KAAM,CACJ,GAAI,CACF,KAAM,IACR,EACA,GAAI,CACF,KAAM,KACN,GAAI,KACN,CACF,CACF,CACF,CAAC,~~EAEKE~~,EAAa,CACjB,GAAI,KACJ,GAAI,IACN,EAIaC,EAAoCC,EAAM,WACrD,CAAC,CAAE,KAAAC,EAAO,QAASC,CAAM,EAAGC,IAAQ,CAClC,MAAMC,EAAWJ,EAAM,QACrB,IAAMK,EAA6BJ,EAAOK,GAAMR,EAAWQ,EAAE,EAC7D,CAACL,CAAI,CACP,EAEA,OACED,EAAA,~~cAACH~~,EAAA,CAAgB,~~GAAGK~~,EAAO,KAAMD,EAAM,IAAKE,~~CAAAA~~,~~EAC1CH~~,EAAA,~~cAACN~~,EAAA,CAAgB,QAAO,~~EACtBM~~,~~EAAAA,~~EAAA,cAACO,EAAA,CACC,GAAIL,EAAM,UAAY,gBAAkBM,EAAQC,EAChD,IAAK,CACH,YAAa,GACf,EACA,KAAML,CACR,CAAA,CACF,CACF,CAEJ,CACF,EAEAL,EAAS,YAAc"}
1	+ {"version":3,"file":"Checkbox.js","sources":["../../../src/components/checkbox/Checkbox.tsx"],"sourcesContent":["import { Minus, Ok } from '@atom-learning/icons'\nimport * as RadixCheckbox from '@radix-ui/react-checkbox'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { disabledStyle } from '~/utilities'\nimport { overrideStitchesVariantValue } from '~/utilities/override-stitches-variant-value/overrideStitchesVariantValue'\n\nimport { Icon } from '../icon'\n\nconst StyledIndicator = styled(RadixCheckbox.Indicator, {\n position: 'absolute',\n top: '50%',\n left: '50%',\n transform: 'translateX(-50%) translateY(-50%)'\n})\n\nconst StyledCheckbox = styled(RadixCheckbox.Root, {\n appearance: 'none',\n position: 'relative',\n backgroundColor: 'transparent',\n border: '1px solid $colors$tonal400',\n borderRadius: '3px',\n color: 'white',\n cursor: 'pointer',\n size: '$1',\n p: 0,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n transition: 'all 50ms ease-out',\n '&[data-state=\"checked\"]': {\n backgroundColor: '$primary',\n borderColor: '$primary'\n },\n '&[data-state=\"indeterminate\"]': {\n backgroundColor: '$primary',\n borderColor: '$primary'\n },\n '&:focus': {\n outline: '2px solid $primary',\n outlineOffset: '1px'\n },\n '&[disabled]': disabledStyle,\n variants: {\n state: {\n error: {\n borderColor: '$danger'\n }\n },\n size: {\n md: {\n size: '$1'\n },\n lg: {\n size: '$2',\n mt: '-$1'\n }\n }\n }\n})\n\nconst toIconSize = {\n md: 'sm',\n lg: 'md'\n}\n\ntype CheckboxProps = React.ComponentProps<typeof StyledCheckbox>\n\nexport const Checkbox: React.FC<CheckboxProps> = React.forwardRef(\n ({ size = 'md', ...props }, ref) => {\n const iconSize = React.useMemo(\n () => overrideStitchesVariantValue(size, (s) => toIconSize[s]),\n [size]\n )\n\n return (\n <StyledCheckbox {...props} size={size} ref={ref}>\n <StyledIndicator asChild>\n <Icon\n is={props.checked === 'indeterminate' ? Minus : Ok}\n css={{\n strokeWidth: '3'\n }}\n size={iconSize}\n />\n </StyledIndicator>\n </StyledCheckbox>\n )\n }\n)\n\nCheckbox.displayName = 'Checkbox'\n"],"names":["StyledIndicator","styled","RadixCheckbox","StyledCheckbox","disabledStyle","toIconSize","Checkbox","React","size","props","ref","iconSize","overrideStitchesVariantValue","s","Icon","Minus","Ok"],"mappings":"wkBAUA,MAAMA,EAAkBC,EAAOC,EAAc,UAAW,CACtD,SAAU,WACV,IAAK,MACL,KAAM,MACN,UAAW,mCACb,CAAC,EAEKC,EAAiBF,EAAOC,EAAc,KAAM,CAChD,WAAY,OACZ,SAAU,WACV,gBAAiB,cACjB,OAAQ,6BACR,aAAc,MACd,MAAO,QACP,OAAQ,UACR,KAAM,KACN,EAAG,EACH,QAAS,OACT,WAAY,SACZ,eAAgB,SAChB,WAAY,oBACZ,0BAA2B,CACzB,gBAAiB,WACjB,YAAa,UACf,EACA,gCAAiC,CAC/B,gBAAiB,WACjB,YAAa,UACf,EACA,UAAW,CACT,QAAS,qBACT,cAAe,KACjB,EACA,cAAeE,EACf,SAAU,CACR,MAAO,CACL,MAAO,CACL,YAAa,SACf,CACF,EACA,KAAM,CACJ,GAAI,CACF,KAAM,IACR,EACA,GAAI,CACF,KAAM,KACN,GAAI,KACN,CACF,CACF,CACF,CAAC,EAEKC,EAAa,CACjB,GAAI,KACJ,GAAI,IACN,EAIaC,EAAoCC,EAAM,WACrD,CAAC,CAAE,KAAAC,EAAO,QAASC,CAAM,EAAGC,IAAQ,CAClC,MAAMC,EAAWJ,EAAM,QACrB,IAAMK,EAA6BJ,EAAOK,GAAMR,EAAWQ,EAAE,EAC7D,CAACL,CAAI,CACP,EAEA,OACED,EAAA,cAACJ,EAAA,CAAgB,GAAGM,EAAO,KAAMD,EAAM,IAAKE,CAC1CH,EAAAA,EAAA,cAACP,EAAA,CAAgB,QAAO,IACtBO,EAAA,cAACO,EAAA,CACC,GAAIL,EAAM,UAAY,gBAAkBM,EAAQC,EAChD,IAAK,CACH,YAAa,GACf,EACA,KAAML,CACR,CAAA,CACF,CACF,CAEJ,CACF,EAEAL,EAAS,YAAc"}

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

@@ -1,2 +1,2 @@
-import{ChevronDown as c,ChevronRight as m}from"@atom-learning/icons";import*as t from"react";import{styled as s}from"../../stitches.js";import{Icon as p}from"../icon/Icon.js";import{Table as o}from"../table/Table.js";import{useDataTable as g}from"./DataTableContext.js";import{DataTableDataCell as C}from"./DataTableDataCell.js";import{DataTableRowSelectionCheckbox as S}from"./DataTableRowSelectionCheckbox.js";const b=s(o.Row,{bg:"initial",variants:{isSelected:{true:{bg:"$blue100 !important"}}}}),h=({row:e})=>{const{enableRowSelection:l,getCanSomeRowsExpand:n}=g(),r=e.getToggleExpandedHandler(),i=e.getToggleSelectedHandler(),d=()=>e.getIsSomeSelected()?"indeterminate":e.getIsSelected();return t.createElement(b,{isSelected:e.getIsSelected()},n()&&t.createElement(o.Cell,{"data-testid":`expand-icon-${e.id}`,css:{width:"$4",cursor:e.getCanExpand()?"pointer":"auto"},onClick:r},e.getCanExpand()&&t.createElement(p,{is:e.getIsExpanded()?c:m})),l&&e.getCanSelect()&&t.createElement(o.Cell,{css:{width:"$4"}},t.createElement(S,{rowDepth:e.depth,rowId:e.id,checked:d(),onCheckedChange:i})),e.getVisibleCells().map((a,w)=>t.createElement(C,{key:a.id,cell:a})))};export{h as DataTableRow};
+import{ChevronDown as d,ChevronRight as m}from"@atom-learning/icons";import*as t from"react";import{styled as s}from"../../stitches.js";import{Icon as g}from"../icon/Icon.js";import{Table as o}from"../table/Table.js";import{useDataTable as p}from"./DataTableContext.js";import{DataTableDataCell as C}from"./DataTableDataCell.js";import{DataTableRowSelectionCheckbox as b}from"./DataTableRowSelectionCheckbox.js";const E=s(o.Row,{bg:"initial",variants:{isSelected:{true:{bg:"$blue100 !important"}}}}),S=({row:e})=>{const{enableRowSelection:l,getCanSomeRowsExpand:n}=p(),r=e.getToggleExpandedHandler(),i=e.getToggleSelectedHandler(),c=()=>e.getIsSomeSelected()?"indeterminate":e.getIsSelected();return t.createElement(E,{isSelected:e.getIsSelected()},n()&&t.createElement(o.Cell,{"data-testid":`expand-icon-${e.id}`,css:{width:"$4",cursor:e.getCanExpand()?"pointer":"auto"},onClick:r},e.getCanExpand()&&t.createElement(g,{is:e.getIsExpanded()?d:m})),l&&t.createElement(o.Cell,{css:{width:"$4"}},t.createElement(b,{row:e,checked:c(),onCheckedChange:i})),e.getVisibleCells().map((a,w)=>t.createElement(C,{key:a.id,cell:a})))};export{S as DataTableRow};
 //# sourceMappingURL=DataTableRow.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"DataTableRow.js","sources":["../../../src/components/data-table/DataTableRow.tsx"],"sourcesContent":["import { ChevronDown, ChevronRight } from '@atom-learning/icons'\nimport type { Row } from '@tanstack/react-table'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { ~~Box } from '../box'\nimport {~~ Icon } from '../icon'\nimport { Table } from '../table'\nimport { useDataTable } from './DataTableContext'\nimport { DataTableDataCell } from './DataTableDataCell'\nimport { DataTableRowSelectionCheckbox } from './DataTableRowSelectionCheckbox'\n\nexport type DataTableRowProps = React.ComponentProps<typeof Table.Row> & {\n row: Row<Record<string, unknown>>\n}\n\nconst StyledRow = styled(Table.Row, {\n bg: 'initial',\n variants: {\n isSelected: {\n true: {\n // the !important rule is needed because the bg property is set elsewhere and it's more specific than this one would be without the !important modifier.\n bg: '$blue100 !important'\n }\n }\n }\n})\n\nexport const DataTableRow: React.FC<DataTableRowProps> = ({ row }) => {\n const { enableRowSelection, getCanSomeRowsExpand } = useDataTable()\n\n const toggleExpandHandler = row.getToggleExpandedHandler()\n const toggleSelectHandler = row.getToggleSelectedHandler()\n\n const getCheckedState = (): boolean \| 'indeterminate' => {\n if (row.getIsSomeSelected()) return 'indeterminate'\n return row.getIsSelected()\n }\n\n return (\n <StyledRow isSelected={row.getIsSelected()}>\n {getCanSomeRowsExpand() && (\n <Table.Cell\n data-testid={`expand-icon-${row.id}`}\n css={{ width: '$4', cursor: row.getCanExpand() ? 'pointer' : 'auto' }}\n onClick={toggleExpandHandler}\n >\n {row.getCanExpand() && (\n <Icon is={row.getIsExpanded() ? ChevronDown : ChevronRight} />\n )}\n </Table.Cell>\n )}\n\n {enableRowSelection && ~~row.getCanSelect~~(~~) && (~~\n <Table.Cell css={{ width: '$4' }}>\n <DataTableRowSelectionCheckbox\n ~~rowDepth={~~row~~.depth}\n rowId~~={row~~.id~~}\n checked={getCheckedState()}\n onCheckedChange={toggleSelectHandler}\n />\n </Table.Cell>\n )}\n {row.getVisibleCells().map((cell, i) => {\n return <DataTableDataCell key={cell.id} cell={cell} />\n })}\n </StyledRow>\n )\n}\n"],"names":["StyledRow","styled","Table","DataTableRow","row","enableRowSelection","getCanSomeRowsExpand","useDataTable","toggleExpandHandler","toggleSelectHandler","getCheckedState","React","Icon","ChevronDown","ChevronRight","DataTableRowSelectionCheckbox","cell","i","DataTableDataCell"],"mappings":"~~4ZAiBA~~,MAAMA,EAAYC,EAAOC,EAAM,IAAK,CAClC,GAAI,UACJ,SAAU,CACR,WAAY,CACV,KAAM,CAEJ,GAAI,qBACN,CACF,CACF,CACF,CAAC,EAEYC,EAA4C,CAAC,CAAE,IAAAC,CAAI,IAAM,CACpE,KAAM,CAAE,mBAAAC,EAAoB,qBAAAC,CAAqB,EAAIC,~~IAE/CC~~,EAAsBJ,EAAI,2BAC1BK,EAAsBL,EAAI,~~2BAE1BM~~,EAAkB,IAClBN,EAAI,~~kBAAkB~~,~~EAAU,~~gBAC7BA,EAAI,~~cAAA~~,~~EAGb,~~OACEO,EAAA,cAACX,EAAA,CAAU,WAAYI,EAAI,~~eACxBE~~,~~EAAAA~~,~~EAAAA~~,~~GACCK~~,EAAA,cAACT,EAAM,KAAN,CACC,cAAa,eAAeE,EAAI,KAChC,IAAK,CAAE,MAAO,KAAM,OAAQA,EAAI,aAAa,EAAI,UAAY,MAAO,EACpE,QAASI,CAERJ,EAAAA,EAAI,~~gBACHO~~,EAAA,cAACC,EAAA,CAAK,GAAIR,EAAI,gBAAkBS,EAAcC,CAAAA,CAAc,CAEhE,EAGDT,~~GAAsBD~~,~~EAAI,aAAa,GACtCO,~~EAAA,cAACT,EAAM,KAAN,CAAW,IAAK,CAAE,MAAO,IAAK,CAC7BS,EAAAA,EAAA,cAACI,EAAA,CACC,~~SAAUX~~,~~EAAI~~,~~MACd,MAAOA,EAAI,GACX,~~QAASM,~~EAAgB~~,~~EACzB~~,gBAAiBD,CACnB,CAAA,CACF,EAEDL,EAAI,kBAAkB,IAAI,CAACY,EAAMC,IACzBN,EAAA,cAACO,EAAA,CAAkB,IAAKF,EAAK,GAAI,KAAMA,CAAM,CAAA,CACrD,CACH,CAEJ"}
1	+ {"version":3,"file":"DataTableRow.js","sources":["../../../src/components/data-table/DataTableRow.tsx"],"sourcesContent":["import { ChevronDown, ChevronRight } from '@atom-learning/icons'\nimport type { Row } from '@tanstack/react-table'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { Icon } from '../icon'\nimport { Table } from '../table'\nimport { useDataTable } from './DataTableContext'\nimport { DataTableDataCell } from './DataTableDataCell'\nimport { DataTableRowSelectionCheckbox } from './DataTableRowSelectionCheckbox'\n\nexport type DataTableRowProps = React.ComponentProps<typeof Table.Row> & {\n row: Row<Record<string, unknown>>\n}\n\nconst StyledRow = styled(Table.Row, {\n bg: 'initial',\n variants: {\n isSelected: {\n true: {\n // the !important rule is needed because the bg property is set elsewhere and it's more specific than this one would be without the !important modifier.\n bg: '$blue100 !important'\n }\n }\n }\n})\n\nexport const DataTableRow: React.FC<DataTableRowProps> = ({ row }) => {\n const { enableRowSelection, getCanSomeRowsExpand } = useDataTable()\n\n const toggleExpandHandler = row.getToggleExpandedHandler()\n const toggleSelectHandler = row.getToggleSelectedHandler()\n\n const getCheckedState = (): boolean \| 'indeterminate' => {\n if (row.getIsSomeSelected()) return 'indeterminate'\n return row.getIsSelected()\n }\n\n return (\n <StyledRow isSelected={row.getIsSelected()}>\n {getCanSomeRowsExpand() && (\n <Table.Cell\n data-testid={`expand-icon-${row.id}`}\n css={{ width: '$4', cursor: row.getCanExpand() ? 'pointer' : 'auto' }}\n onClick={toggleExpandHandler}\n >\n {row.getCanExpand() && (\n <Icon is={row.getIsExpanded() ? ChevronDown : ChevronRight} />\n )}\n </Table.Cell>\n )}\n\n {enableRowSelection && (\n <Table.Cell css={{ width: '$4' }}>\n <DataTableRowSelectionCheckbox\n row={row}\n checked={getCheckedState()}\n onCheckedChange={toggleSelectHandler}\n />\n </Table.Cell>\n )}\n {row.getVisibleCells().map((cell, i) => {\n return <DataTableDataCell key={cell.id} cell={cell} />\n })}\n </StyledRow>\n )\n}\n"],"names":["StyledRow","styled","Table","DataTableRow","row","enableRowSelection","getCanSomeRowsExpand","useDataTable","toggleExpandHandler","toggleSelectHandler","getCheckedState","React","Icon","ChevronDown","ChevronRight","DataTableRowSelectionCheckbox","cell","i","DataTableDataCell"],"mappings":"4ZAgBA,MAAMA,EAAYC,EAAOC,EAAM,IAAK,CAClC,GAAI,UACJ,SAAU,CACR,WAAY,CACV,KAAM,CAEJ,GAAI,qBACN,CACF,CACF,CACF,CAAC,EAEYC,EAA4C,CAAC,CAAE,IAAAC,CAAI,IAAM,CACpE,KAAM,CAAE,mBAAAC,EAAoB,qBAAAC,CAAqB,EAAIC,EAAa,EAE5DC,EAAsBJ,EAAI,2BAC1BK,EAAsBL,EAAI,yBAE1BM,EAAAA,EAAkB,IAClBN,EAAI,oBAA4B,gBAC7BA,EAAI,gBAGb,OACEO,EAAA,cAACX,EAAA,CAAU,WAAYI,EAAI,cAAc,CAAA,EACtCE,EACCK,GAAAA,EAAA,cAACT,EAAM,KAAN,CACC,cAAa,eAAeE,EAAI,KAChC,IAAK,CAAE,MAAO,KAAM,OAAQA,EAAI,aAAa,EAAI,UAAY,MAAO,EACpE,QAASI,CAERJ,EAAAA,EAAI,aACHO,GAAAA,EAAA,cAACC,EAAA,CAAK,GAAIR,EAAI,gBAAkBS,EAAcC,CAAAA,CAAc,CAEhE,EAGDT,GACCM,EAAA,cAACT,EAAM,KAAN,CAAW,IAAK,CAAE,MAAO,IAAK,CAC7BS,EAAAA,EAAA,cAACI,EAAA,CACC,IAAKX,EACL,QAASM,EACT,EAAA,gBAAiBD,CACnB,CAAA,CACF,EAEDL,EAAI,kBAAkB,IAAI,CAACY,EAAMC,IACzBN,EAAA,cAACO,EAAA,CAAkB,IAAKF,EAAK,GAAI,KAAMA,CAAM,CAAA,CACrD,CACH,CAEJ"}

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

@@ -1,10 +1,10 @@
+import type { Row } from '@tanstack/react-table';
 import * as React from 'react';
 interface DataTableRowSelectionCheckboxProps {
+    row: Row<Record<string, unknown>>;
     checked: boolean | 'indeterminate';
     onCheckedChange: (value: boolean) => void;
-    rowId: string;
     label?: string;
-    rowDepth: number;
 }
-export declare const DataTableRowSelectionCheckbox: ({ rowDepth, rowId, checked, onCheckedChange, label }: DataTableRowSelectionCheckboxProps) => React.ReactElement;
+export declare const DataTableRowSelectionCheckbox: ({ row, checked, onCheckedChange, label }: DataTableRowSelectionCheckboxProps) => React.ReactElement;
 export {};

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

@@ -1,2 +1,2 @@
-import*as n from"@radix-ui/react-visually-hidden";import*as e from"react";import{Checkbox as m}from"../checkbox/Checkbox.js";import{Label as s}from"../label/Label.js";import{useDataTable as h}from"./DataTableContext.js";const i=({rowDepth:t,rowId:o,checked:a,onCheckedChange:l,label:c=`Row ${o} selection`})=>{const{tableId:r}=h();return e.createElement(e.Fragment,null,e.createElement(n.Root,null,e.createElement(s,{htmlFor:`${r}_row_${o}_selection`},c)),e.createElement(m,{css:{ml:t?`$${t*2}`:0},checked:a,onCheckedChange:l,name:`${r}_row_${o}_selection`}))};export{i as DataTableRowSelectionCheckbox};
+import*as c from"@radix-ui/react-visually-hidden";import*as t from"react";import{Checkbox as n}from"../checkbox/Checkbox.js";import{Label as m}from"../label/Label.js";import{useDataTable as i}from"./DataTableContext.js";const d=({row:e,checked:l,onCheckedChange:r,label:a=`Row ${e.id} selection`})=>{const{tableId:o}=i();return t.createElement(t.Fragment,null,t.createElement(c.Root,null,t.createElement(m,{htmlFor:`${o}_row_${e.id}_selection`},a)),t.createElement(n,{css:{ml:e.depth?`$${e.depth*2}`:0},checked:l,onCheckedChange:r,name:`${o}_row_${e.id}_selection`,disabled:!e.getCanSelect()}))};export{d as DataTableRowSelectionCheckbox};
 //# sourceMappingURL=DataTableRowSelectionCheckbox.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"DataTableRowSelectionCheckbox.js","sources":["../../../src/components/data-table/DataTableRowSelectionCheckbox.tsx"],"sourcesContent":["import * as VisuallyHidden from '@radix-ui/react-visually-hidden'\nimport * as React from 'react'\n\nimport { Checkbox } from '../checkbox'\nimport { Label } from '../label'\nimport { useDataTable } from './DataTableContext'\n\ninterface DataTableRowSelectionCheckboxProps {\n checked: boolean \| 'indeterminate'\n onCheckedChange: (value: boolean) => void\n ~~rowId: string\n~~ label?: string\n ~~rowDepth: number\n~~}\n\nexport const DataTableRowSelectionCheckbox = ({\n ~~rowDepth~~,\n ~~rowId,\n~~ checked,\n onCheckedChange,\n label = `Row ${~~rowId~~} selection`\n}: DataTableRowSelectionCheckboxProps): React.ReactElement => {\n const { tableId } = useDataTable()\n\n return (\n <>\n <VisuallyHidden.Root>\n <Label htmlFor={`${tableId}_row_${~~rowId~~}_selection`}>{label}</Label>\n </VisuallyHidden.Root>\n <Checkbox\n css={{ ml: ~~rowDepth~~ ? `$${~~rowDepth~~ * 2}` : 0 }}\n checked={checked}\n onCheckedChange={onCheckedChange}\n name={`${tableId}_row_${~~rowId~~}_selection`}\n />\n </>\n )\n}\n"],"names":["DataTableRowSelectionCheckbox","~~rowDepth~~","~~rowId","~~checked","onCheckedChange","label","tableId","useDataTable","React","VisuallyHidden","Label","Checkbox"],"mappings":"~~kOAeaA~~,EAAgC,CAAC,CAC5C,~~SAAAC~~,EACA,~~MAAAC,EACA,~~QAAAC,EACA,gBAAAC,EACA,MAAAC,EAAQ,OAAOH,~~aACjB~~,IAA8D,CAC5D,KAAM,CAAE,QAAAI,CAAQ,EAAIC,~~EAAa~~,~~EAEjC~~,OACEC,EAAA,cAAAA,EAAA,SAAA,KACEA,EAAA,cAACC,EAAe,KAAf,KACCD,EAAA,cAACE,EAAA,CAAM,QAAS,GAAGJ,SAAeJ,~~aAAoBG~~,EAAAA,CAAM,~~CAC9D~~,EACAG,EAAA,cAACG,EAAA,CACC,IAAK,CAAE,~~GAAIV~~,~~EAAW~~,IAAIA,~~EAAW~~,IAAM,CAAE,~~EAC7C~~,~~QAASE~~,EACT,gBAAiBC,EACjB,KAAM,GAAGE,SAAeJ,~~aAAAA~~,~~CAC1B~~,CACF,CAEJ"}
1	+ {"version":3,"file":"DataTableRowSelectionCheckbox.js","sources":["../../../src/components/data-table/DataTableRowSelectionCheckbox.tsx"],"sourcesContent":["import * as VisuallyHidden from '@radix-ui/react-visually-hidden'\nimport type { Row } from '@tanstack/react-table'\nimport * as React from 'react'\n\nimport { Checkbox } from '../checkbox'\nimport { Label } from '../label'\nimport { useDataTable } from './DataTableContext'\n\ninterface DataTableRowSelectionCheckboxProps {\n row: Row<Record<string, unknown>>\n checked: boolean \| 'indeterminate'\n onCheckedChange: (value: boolean) => void\n label?: string\n}\n\nexport const DataTableRowSelectionCheckbox = ({\n row,\n checked,\n onCheckedChange,\n label = `Row ${row.id} selection`\n}: DataTableRowSelectionCheckboxProps): React.ReactElement => {\n const { tableId } = useDataTable()\n\n return (\n <>\n <VisuallyHidden.Root>\n <Label htmlFor={`${tableId}_row_${row.id}_selection`}>{label}</Label>\n </VisuallyHidden.Root>\n <Checkbox\n css={{ ml: row.depth ? `$${row.depth * 2}` : 0 }}\n checked={checked}\n onCheckedChange={onCheckedChange}\n name={`${tableId}_row_${row.id}_selection`}\n disabled={!row.getCanSelect()}\n />\n </>\n )\n}\n"],"names":["DataTableRowSelectionCheckbox","row","checked","onCheckedChange","label","tableId","useDataTable","React","VisuallyHidden","Label","Checkbox"],"mappings":"4NAea,MAAAA,EAAgC,CAAC,CAC5C,IAAAC,EACA,QAAAC,EACA,gBAAAC,EACA,MAAAC,EAAQ,OAAOH,EAAI,cACrB,IAA8D,CAC5D,KAAM,CAAE,QAAAI,CAAQ,EAAIC,EAAAA,EAEpB,OACEC,EAAA,cAAAA,EAAA,SAAA,KACEA,EAAA,cAACC,EAAe,KAAf,KACCD,EAAA,cAACE,EAAA,CAAM,QAAS,GAAGJ,SAAeJ,EAAI,cAAiBG,EAAAA,CAAM,CAC/D,EACAG,EAAA,cAACG,EAAA,CACC,IAAK,CAAE,GAAIT,EAAI,MAAQ,IAAIA,EAAI,MAAQ,IAAM,CAAE,EAC/C,QAASC,EACT,gBAAiBC,EACjB,KAAM,GAAGE,SAAeJ,EAAI,eAC5B,SAAU,CAACA,EAAI,aACjB,CAAA,CAAA,CACF,CAEJ"}