npm - @atom-learning/components - Versions diffs - 6.0.0-beta.2 → 6.0.0-beta.4 - Mend

@atom-learning/components 6.0.0-beta.2 → 6.0.0-beta.4

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

package/dist/components/table/TableStickyColumnsContainer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TableStickyColumnsContainer.js","sources":["../../../src/components/table/TableStickyColumnsContainer.tsx"],"sourcesContent":["import React from 'react'\n\nimport { CSS } from '~/stitches'\n\nimport { Box } from '../box'\nimport { useStickyColumnsCss } from './useStickyColumnsCss'\n\nexport const TableStickyColumnsContainer = ({\n children,\n numberOfStickyColumns = 0,\n css,\n ...restProps\n}: React.PropsWithChildren<{\n numberOfStickyColumns?: number\n css?: CSS\n}>) => {\n const [hasScroll, setHasScroll] = React.useState<boolean>(false)\n const wrapperRef = React.useRef(null)\n const { columnsCss } = useStickyColumnsCss({\n numberOfStickyColumns,\n wrapperRef\n })\n\n const handleScroll = (event: React.UIEvent<HTMLDivElement>) => {\n const newHasScroll ~~=\n~~ event.currentTarget.~~scrollWidth~~ > ~~event.currentTarget.clientWidth~~\n if (newHasScroll !== hasScroll) {\n setHasScroll(newHasScroll)\n }\n }\n\n return (\n <Box\n onScroll={handleScroll}\n role=\"scrollbar\"\n ref={wrapperRef}\n css={{\n overflow: 'auto',\n maxWidth: '100%',\n ...columnsCss,\n [`& td:nth-child(${numberOfStickyColumns}), th:nth-child(${numberOfStickyColumns})`]:\n {\n ...(hasScroll && {\n boxShadow: '$colors$alpha200 -2px -3px 9px 1px',\n clipPath: 'inset(0px -10px 0px 0px)'\n })\n },\n '& td': {\n bg: 'inherit'\n },\n ...css\n }}\n {...restProps}\n >\n {children}\n </Box>\n )\n}\n"],"names":["TableStickyColumnsContainer","children","numberOfStickyColumns","css","restProps","hasScroll","setHasScroll","React","wrapperRef","columnsCss","useStickyColumnsCss","Box","event","newHasScroll"],"mappings":"wHAOa,MAAAA,EAA8B,CAAC,CAC1C,SAAAC,EACA,sBAAAC,EAAwB,EACxB,IAAAC,KACGC,CACL,IAGO,CACL,KAAM,CAACC,EAAWC,CAAY,EAAIC,EAAM,SAAkB,EAAK,EACzDC,EAAaD,EAAM,OAAO,IAAI,EAC9B,CAAE,WAAAE,CAAW,EAAIC,EAAoB,CACzC,sBAAAR,EACA,WAAAM,CACF,CAAC,~~EAUD~~,OACED,EAAA,cAACI,EAAA,CACC,~~SAVkBC~~,GAAyC,CAC7D,MAAMC,~~EACJD~~,EAAM,cAAc,~~YAAcA~~,~~EAAM~~,~~cAAc,YACpDC,~~IAAiBR,GACnBC,EAAaO,CAAY,CAE7B,EAKI,KAAK,YACL,IAAKL,EACL,IAAK,CACH,SAAU,OACV,SAAU,OACV,GAAGC,EACH,CAAC,kBAAkBP,oBAAwCA,MACzD,CACE,GAAIG,GAAa,CACf,UAAW,qCACX,SAAU,0BACZ,CACF,EACF,OAAQ,CACN,GAAI,SACN,EACA,GAAGF,CACL,EACC,GAAGC,CAEHH,EAAAA,CACH,CAEJ"}
1	+ {"version":3,"file":"TableStickyColumnsContainer.js","sources":["../../../src/components/table/TableStickyColumnsContainer.tsx"],"sourcesContent":["import React from 'react'\n\nimport { CSS } from '~/stitches'\n\nimport { Box } from '../box'\nimport { useStickyColumnsCss } from './useStickyColumnsCss'\n\nexport const TableStickyColumnsContainer = ({\n children,\n numberOfStickyColumns = 0,\n css,\n ...restProps\n}: React.PropsWithChildren<{\n numberOfStickyColumns?: number\n css?: CSS\n}>) => {\n const [hasScroll, setHasScroll] = React.useState<boolean>(false)\n const wrapperRef = React.useRef(null)\n const { columnsCss } = useStickyColumnsCss({\n numberOfStickyColumns,\n wrapperRef\n })\n\n const handleScroll = (event: React.UIEvent<HTMLDivElement>) => {\n const newHasScroll = event.currentTarget.scrollLeft > 0\n if (newHasScroll !== hasScroll) {\n setHasScroll(newHasScroll)\n }\n }\n\n return (\n <Box\n onScroll={handleScroll}\n role=\"scrollbar\"\n ref={wrapperRef}\n css={{\n overflow: 'auto',\n overscrollBehaviorX: 'contain',\n maxWidth: '100%',\n position: 'relative',\n ...columnsCss,\n [`& td:nth-child(${numberOfStickyColumns}), th:nth-child(${numberOfStickyColumns})`]:\n {\n ...(hasScroll && {\n boxShadow: '$colors$alpha200 -2px -3px 9px 1px',\n clipPath: 'inset(0px -10px 0px 0px)'\n })\n },\n '& td': {\n bg: 'inherit'\n },\n ...css\n }}\n {...restProps}\n >\n {children}\n </Box>\n )\n}\n"],"names":["TableStickyColumnsContainer","children","numberOfStickyColumns","css","restProps","hasScroll","setHasScroll","React","wrapperRef","columnsCss","useStickyColumnsCss","Box","event","newHasScroll"],"mappings":"wHAOa,MAAAA,EAA8B,CAAC,CAC1C,SAAAC,EACA,sBAAAC,EAAwB,EACxB,IAAAC,KACGC,CACL,IAGO,CACL,KAAM,CAACC,EAAWC,CAAY,EAAIC,EAAM,SAAkB,EAAK,EACzDC,EAAaD,EAAM,OAAO,IAAI,EAC9B,CAAE,WAAAE,CAAW,EAAIC,EAAoB,CACzC,sBAAAR,EACA,WAAAM,CACF,CAAC,EASD,OACED,EAAA,cAACI,EAAA,CACC,SATkBC,GAAyC,CAC7D,MAAMC,EAAeD,EAAM,cAAc,WAAa,EAClDC,IAAiBR,GACnBC,EAAaO,CAAY,CAE7B,EAKI,KAAK,YACL,IAAKL,EACL,IAAK,CACH,SAAU,OACV,oBAAqB,UACrB,SAAU,OACV,SAAU,WACV,GAAGC,EACH,CAAC,kBAAkBP,oBAAwCA,MACzD,CACE,GAAIG,GAAa,CACf,UAAW,qCACX,SAAU,0BACZ,CACF,EACF,OAAQ,CACN,GAAI,SACN,EACA,GAAGF,CACL,EACC,GAAGC,CAEHH,EAAAA,CACH,CAEJ"}

package/dist/components/textarea/Textarea.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import*as e from"react";import{styled as n}from"../../stitches.js";const t=n("textarea",{boxShadow:"none",fontSize:"$md",appearance:"none",boxSizing:"border-box",color:"$grey1000",fontFamily:"$body",fontWeight:400,lineHeight:1.4,m:0,minHeight:"$7",px:"$3",py:"calc($2 + $1)",resize:"vertical",width:"100%","&[disabled]":{backgroundColor:"$grey200",color:"$grey800",cursor:"not-allowed"},"&::placeholder":{color:"$grey700",opacity:1},variants:{appearance:{standard:{background:"white",border:"1px solid $grey800",borderRadius:"$0","&:focus-within":{borderColor:"$primary800",outline:"none"}},modern:{background:"$grey100",border:"none",borderRadius:"$1","&:focus-within":{outline:"2px solid $blue800",outlineOffset:1,zIndex:1}}},state:{error:{}}},defaultVariants:{appearance:"standard"},compoundVariants:[{state:"error",appearance:"standard",css:{borderColor:"$danger"}},{state:"error",appearance:"modern",css:{bg:"$dangerLight","&:focus-within":{outlineColor:"$danger"}}}]}),r=e.forwardRef((o,a)=>e.createElement(t,{...o,ref:a}));r.displayName="Textarea";export{r as Textarea};
+import*as e from"react";import{styled as n}from"../../stitches.js";const t=n("textarea",{boxShadow:"none",fontSize:"$md",appearance:"none",borderRadius:"$1",boxSizing:"border-box",color:"$grey1000",fontFamily:"$body",fontWeight:400,lineHeight:1.4,m:0,minHeight:"$7",px:"$3",py:"calc($2 + $1)",resize:"vertical",width:"100%","&[disabled]":{backgroundColor:"$grey200",color:"$grey800",cursor:"not-allowed"},"&::placeholder":{color:"$grey700",opacity:1},variants:{appearance:{standard:{background:"white",border:"1px solid $grey800","&:focus-within":{borderColor:"$primary800",outline:"none"}},modern:{background:"$grey100",border:"none","&:focus-within":{outline:"2px solid $blue800",outlineOffset:1,zIndex:1}}},state:{error:{}}},defaultVariants:{appearance:"standard"},compoundVariants:[{state:"error",appearance:"standard",css:{borderColor:"$danger"}},{state:"error",appearance:"modern",css:{bg:"$dangerLight","&:focus-within":{outlineColor:"$danger"}}}]}),r=e.forwardRef((o,a)=>e.createElement(t,{...o,ref:a}));r.displayName="Textarea";export{r as Textarea};
 //# sourceMappingURL=Textarea.js.map

package/dist/components/textarea/Textarea.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Textarea.js","sources":["../../../src/components/textarea/Textarea.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nconst StyledTextarea = styled('textarea', {\n boxShadow: 'none', // remove iOS default styling\n fontSize: '$md', // prevent iOS zooming on focus\n appearance: 'none',\n boxSizing: 'border-box',\n color: '$grey1000',\n fontFamily: '$body',\n fontWeight: 400,\n lineHeight: 1.4,\n m: 0,\n minHeight: '$7',\n px: '$3',\n py: 'calc($2 + $1)', // offset the line height of the text\n resize: 'vertical',\n width: '100%',\n '&[disabled]': {\n backgroundColor: '$grey200',\n color: '$grey800',\n cursor: 'not-allowed'\n },\n '&::placeholder': {\n color: '$grey700',\n opacity: 1\n },\n variants: {\n appearance: {\n standard: {\n background: 'white',\n border: '1px solid $grey800',\n ~~borderRadius:~~ '~~$0',\n '~~&:focus-within': {\n borderColor: '$primary800',\n outline: 'none'\n }\n },\n modern: {\n background: '$grey100',\n border: 'none',\n ~~borderRadius:~~ '~~$1',\n '~~&:focus-within': {\n outline: '2px solid $blue800',\n outlineOffset: 1,\n zIndex: 1\n }\n }\n },\n state: {\n error: {}\n }\n },\n defaultVariants: {\n appearance: 'standard'\n },\n compoundVariants: [\n {\n state: 'error',\n appearance: 'standard',\n css: { borderColor: '$danger' }\n },\n {\n state: 'error',\n appearance: 'modern',\n css: {\n bg: '$dangerLight',\n '&:focus-within': {\n outlineColor: '$danger'\n }\n }\n }\n ]\n})\n\nexport type TextareaProps = React.ComponentProps<typeof StyledTextarea>\n\nexport const Textarea: React.ForwardRefExoticComponent<TextareaProps> =\n React.forwardRef((props, ref) => <StyledTextarea {...props} ref={ref} />)\n\nTextarea.displayName = 'Textarea'\n"],"names":["StyledTextarea","styled","Textarea","React","props","ref"],"mappings":"mEAIA,MAAMA,EAAiBC,EAAO,WAAY,CACxC,UAAW,OACX,SAAU,MACV,WAAY,OACZ,UAAW,aACX,MAAO,YACP,WAAY,QACZ,WAAY,IACZ,WAAY,IACZ,EAAG,EACH,UAAW,KACX,GAAI,KACJ,GAAI,gBACJ,OAAQ,WACR,MAAO,OACP,cAAe,CACb,gBAAiB,WACjB,MAAO,WACP,OAAQ,aACV,EACA,iBAAkB,CAChB,MAAO,WACP,QAAS,CACX,EACA,SAAU,CACR,WAAY,CACV,SAAU,CACR,WAAY,QACZ,OAAQ,qBACR,~~aAAc,KACd,~~iBAAkB,CAChB,YAAa,cACb,QAAS,MACX,CACF,EACA,OAAQ,CACN,WAAY,WACZ,OAAQ,OACR,~~aAAc,KACd,~~iBAAkB,CAChB,QAAS,qBACT,cAAe,EACf,OAAQ,CACV,CACF,CACF,EACA,MAAO,CACL,MAAO,CAAA,CACT,CACF,EACA,gBAAiB,CACf,WAAY,UACd,EACA,iBAAkB,CAChB,CACE,MAAO,QACP,WAAY,WACZ,IAAK,CAAE,YAAa,SAAU,CAChC,EACA,CACE,MAAO,QACP,WAAY,SACZ,IAAK,CACH,GAAI,eACJ,iBAAkB,CAChB,aAAc,SAChB,CACF,CACF,CACF,CACF,CAAC,EAIYC,EACXC,EAAM,WAAW,CAACC,EAAOC,IAAQF,EAAA,cAACH,EAAA,CAAgB,GAAGI,EAAO,IAAKC,CAAAA,CAAK,CAAE,EAE1EH,EAAS,YAAc"}
1	+ {"version":3,"file":"Textarea.js","sources":["../../../src/components/textarea/Textarea.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nconst StyledTextarea = styled('textarea', {\n boxShadow: 'none', // remove iOS default styling\n fontSize: '$md', // prevent iOS zooming on focus\n appearance: 'none',\n borderRadius: '$1',\n boxSizing: 'border-box',\n color: '$grey1000',\n fontFamily: '$body',\n fontWeight: 400,\n lineHeight: 1.4,\n m: 0,\n minHeight: '$7',\n px: '$3',\n py: 'calc($2 + $1)', // offset the line height of the text\n resize: 'vertical',\n width: '100%',\n '&[disabled]': {\n backgroundColor: '$grey200',\n color: '$grey800',\n cursor: 'not-allowed'\n },\n '&::placeholder': {\n color: '$grey700',\n opacity: 1\n },\n variants: {\n appearance: {\n standard: {\n background: 'white',\n border: '1px solid $grey800',\n '&:focus-within': {\n borderColor: '$primary800',\n outline: 'none'\n }\n },\n modern: {\n background: '$grey100',\n border: 'none',\n '&:focus-within': {\n outline: '2px solid $blue800',\n outlineOffset: 1,\n zIndex: 1\n }\n }\n },\n state: {\n error: {}\n }\n },\n defaultVariants: {\n appearance: 'standard'\n },\n compoundVariants: [\n {\n state: 'error',\n appearance: 'standard',\n css: { borderColor: '$danger' }\n },\n {\n state: 'error',\n appearance: 'modern',\n css: {\n bg: '$dangerLight',\n '&:focus-within': {\n outlineColor: '$danger'\n }\n }\n }\n ]\n})\n\nexport type TextareaProps = React.ComponentProps<typeof StyledTextarea>\n\nexport const Textarea: React.ForwardRefExoticComponent<TextareaProps> =\n React.forwardRef((props, ref) => <StyledTextarea {...props} ref={ref} />)\n\nTextarea.displayName = 'Textarea'\n"],"names":["StyledTextarea","styled","Textarea","React","props","ref"],"mappings":"mEAIA,MAAMA,EAAiBC,EAAO,WAAY,CACxC,UAAW,OACX,SAAU,MACV,WAAY,OACZ,aAAc,KACd,UAAW,aACX,MAAO,YACP,WAAY,QACZ,WAAY,IACZ,WAAY,IACZ,EAAG,EACH,UAAW,KACX,GAAI,KACJ,GAAI,gBACJ,OAAQ,WACR,MAAO,OACP,cAAe,CACb,gBAAiB,WACjB,MAAO,WACP,OAAQ,aACV,EACA,iBAAkB,CAChB,MAAO,WACP,QAAS,CACX,EACA,SAAU,CACR,WAAY,CACV,SAAU,CACR,WAAY,QACZ,OAAQ,qBACR,iBAAkB,CAChB,YAAa,cACb,QAAS,MACX,CACF,EACA,OAAQ,CACN,WAAY,WACZ,OAAQ,OACR,iBAAkB,CAChB,QAAS,qBACT,cAAe,EACf,OAAQ,CACV,CACF,CACF,EACA,MAAO,CACL,MAAO,CAAA,CACT,CACF,EACA,gBAAiB,CACf,WAAY,UACd,EACA,iBAAkB,CAChB,CACE,MAAO,QACP,WAAY,WACZ,IAAK,CAAE,YAAa,SAAU,CAChC,EACA,CACE,MAAO,QACP,WAAY,SACZ,IAAK,CACH,GAAI,eACJ,iBAAkB,CAChB,aAAc,SAChB,CACF,CACF,CACF,CACF,CAAC,EAIYC,EACXC,EAAM,WAAW,CAACC,EAAOC,IAAQF,EAAA,cAACH,EAAA,CAAgB,GAAGI,EAAO,IAAKC,CAAAA,CAAK,CAAE,EAE1EH,EAAS,YAAc"}

package/dist/components/toggle-group/ToggleGroupButton.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import*as t from"react";import{styled as f}from"../../stitches.js";import{Icon as r}from"../icon/Icon.js";import{StyledItem as h}from"./ToggleGroupItem.js";const s={sm:"32px",md:"40px",lg:"48px"},u={sm:"$4",md:"$5",lg:"$5"},x={sm:"$2",md:"$3",lg:"$3"},m=n=>({fontSize:`$${n}`,px:u[n],minHeight:s[n],"& > *:not(:last-child)":{mr:x[n]}}),d=f(h,{flexGrow:1,display:"flex",alignItems:"center",justifyContent:"center",fontWeight:600,lineHeight:1,py:"$1",variants:{size:{sm:m("sm"),md:m("md"),lg:m("lg")},isIconOnly:{true:{}},theme:{standard:{},modern:{}}},compoundVariants:[{isIconOnly:!0,size:"sm",css:{minWidth:s.sm,p:0}},{isIconOnly:!0,size:"md",css:{minWidth:s.md,p:0}},{isIconOnly:!0,size:"lg",css:{minWidth:s.lg,p:0}}]}),z=t.forwardRef(({size:n="md",theme:p="standard",children:a,...c},y)=>{var o;const i=t.Children.toArray(a),l=i.length<=1,g=l&&t.isValidElement(i[0])&&((o=i[0])==null?void 0:o.type)===r;return t.createElement(d,{ref:y,size:n,isIconOnly:g,theme:p,...c},i.map(e=>!l&&(typeof e=="string"||typeof e=="number")?t.createElement("span",{key:e},e):t.isValidElement(e)&&(e==null?void 0:e.type)===r?t.cloneElement(e,{...e.props,size:n}):e))});export{d as StyledButton,z as ToggleGroupButton};
+import*as s from"react";import{styled as g}from"../../stitches.js";import{Icon as r}from"../icon/Icon.js";import{StyledItem as f}from"./ToggleGroupItem.js";const i={sm:"32px",md:"40px",lg:"48px"},I={sm:"$4",md:"$5",lg:"$5"},u={sm:"$2",md:"$3",lg:"$3"},t=n=>({fontSize:`$${n}`,px:I[n],minHeight:i[n],"& > *:not(:last-child)":{mr:u[n]}}),d=g(f,{flexGrow:1,display:"flex",alignItems:"center",justifyContent:"center",fontWeight:600,lineHeight:1,py:"$1",variants:{size:{sm:t("sm"),md:t("md"),lg:t("lg")},isIconOnly:{true:{}},theme:{standard:{},modern:{}}},compoundVariants:[{isIconOnly:!0,size:"sm",css:{minWidth:i.sm,p:0}},{isIconOnly:!0,size:"md",css:{minWidth:i.md,p:0}},{isIconOnly:!0,size:"lg",css:{minWidth:i.lg,p:0}},{isIconOnly:!0,size:"sm",theme:"modern",css:{minWidth:i.md,p:0}},{isIconOnly:!0,size:"md",theme:"modern",css:{minWidth:i.lg,p:0}},{isIconOnly:!0,size:"lg",theme:"modern",css:{minWidth:"60px",p:0}}]}),z=s.forwardRef(({size:n="md",theme:p="standard",children:c,...a},y)=>{var o;const m=s.Children.toArray(c),l=m.length<=1,h=l&&s.isValidElement(m[0])&&((o=m[0])==null?void 0:o.type)===r;return s.createElement(d,{ref:y,size:n,isIconOnly:h,theme:p,...a},m.map(e=>!l&&(typeof e=="string"||typeof e=="number")?s.createElement("span",{key:e},e):s.isValidElement(e)&&(e==null?void 0:e.type)===r?s.cloneElement(e,{...e.props,size:n}):e))});export{d as StyledButton,z as ToggleGroupButton};
 //# sourceMappingURL=ToggleGroupButton.js.map

package/dist/components/toggle-group/ToggleGroupButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ToggleGroupButton.js","sources":["../../../src/components/toggle-group/ToggleGroupButton.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { Icon } from '../icon'\nimport { StyledItem } from './ToggleGroupItem'\n\nconst minHeight = {\n sm: '32px',\n md: '40px',\n lg: '48px'\n}\n\nconst px = {\n sm: '$4',\n md: '$5',\n lg: '$5'\n}\n\nconst spacingBetweenElements = {\n sm: '$2',\n md: '$3',\n lg: '$3'\n}\n\nconst getSizeVariant = (size: string) => ({\n fontSize: `$${size}`,\n px: px[size],\n minHeight: minHeight[size],\n '& > *:not(:last-child)': {\n mr: spacingBetweenElements[size]\n }\n})\n\nexport const StyledButton = styled(StyledItem, {\n flexGrow: 1,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n fontWeight: 600,\n lineHeight: 1,\n py: '$1',\n variants: {\n size: {\n sm: getSizeVariant('sm'),\n md: getSizeVariant('md'),\n lg: getSizeVariant('lg')\n },\n isIconOnly: {\n true: {}\n },\n theme: {\n standard: {},\n modern: {}\n }\n },\n compoundVariants: [\n {\n isIconOnly: true,\n size: 'sm',\n css: {\n minWidth: minHeight.sm,\n p: 0\n }\n },\n {\n isIconOnly: true,\n size: 'md',\n css: {\n minWidth: minHeight.md,\n p: 0\n }\n },\n {\n isIconOnly: true,\n size: 'lg',\n css: {\n minWidth: minHeight.lg,\n p: 0\n }\n }\n ]\n})\n\nexport const ToggleGroupButton: React.ForwardRefExoticComponent<\n React.ComponentProps<typeof StyledButton>\n> = React.forwardRef(\n ({ size = 'md', theme = 'standard', children, ...rest }, ref) => {\n const childrenArray = React.Children.toArray(children)\n const isSingleChild = childrenArray.length <= 1\n const isIconOnly =\n isSingleChild &&\n React.isValidElement(childrenArray[0]) &&\n childrenArray[0]?.type === Icon\n\n return (\n <StyledButton\n ref={ref}\n size={size}\n isIconOnly={isIconOnly}\n theme={theme}\n {...rest}\n >\n {\n childrenArray.map((child) => {\n if (\n !isSingleChild &&\n (typeof child === 'string' \|\| typeof child === 'number')\n )\n return <span key={child}>{child}</span>\n if (React.isValidElement(child)) {\n if (child?.type === Icon)\n return React.cloneElement(child, { ...child.props, size })\n }\n return child\n }) as React.ReactElement[]\n }\n </StyledButton>\n )\n }\n)\n"],"names":["minHeight","px","spacingBetweenElements","getSizeVariant","size","StyledButton","styled","StyledItem","ToggleGroupButton","React","theme","children","rest","ref","_a","childrenArray","isSingleChild","isIconOnly","Icon","child"],"mappings":"4JAOA,MAAMA,EAAY,CAChB,GAAI,OACJ,GAAI,OACJ,GAAI,MACN,EAEMC,EAAK,CACT,GAAI,KACJ,GAAI,KACJ,GAAI,IACN,EAEMC,EAAyB,CAC7B,GAAI,KACJ,GAAI,KACJ,GAAI,IACN,EAEMC,EAAkBC,IAAkB,CACxC,SAAU,IAAIA,IACd,GAAIH,EAAGG,GACP,UAAWJ,EAAUI,GACrB,yBAA0B,CACxB,GAAIF,EAAuBE,EAC7B,CACF,GAEaC,EAAeC,EAAOC,EAAY,CAC7C,SAAU,EACV,QAAS,OACT,WAAY,SACZ,eAAgB,SAChB,WAAY,IACZ,WAAY,EACZ,GAAI,KACJ,SAAU,CACR,KAAM,CACJ,GAAIJ,EAAe,IAAI,EACvB,GAAIA,EAAe,IAAI,EACvB,GAAIA,EAAe,IAAI,CACzB,EACA,WAAY,CACV,KAAM,CACR,CAAA,EACA,MAAO,CACL,SAAU,CAAA,EACV,OAAQ,CACV,~~CAAA,~~CACF,EACA,iBAAkB,CAChB,CACE,WAAY,GACZ,KAAM,KACN,IAAK,CACH,SAAUH,EAAU,GACpB,EAAG,CACL,CACF,EACA,CACE,WAAY,GACZ,KAAM,KACN,IAAK,CACH,SAAUA,EAAU,GACpB,EAAG,CACL,CACF,EACA,CACE,WAAY,GACZ,KAAM,KACN,IAAK,CACH,SAAUA,EAAU,GACpB,EAAG,CACL,CACF,CACF,CACF,CAAC,EAEYQ,EAETC,EAAM,WACR,CAAC,CAAE,KAAAL,EAAO,KAAM,MAAAM,EAAQ,WAAY,SAAAC,KAAaC,CAAK,EAAGC,IAAQ,~~CAvFnE~~,IAAAC,~~EAwFI~~,MAAMC,EAAgBN,EAAM,SAAS,QAAQE,CAAQ,EAC/CK,EAAgBD,EAAc,QAAU,EACxCE,EACJD,GACAP,EAAM,eAAeM,EAAc,EAAE,KACrCD,EAAAC,EAAc,KAAd,~~KAAA~~,~~OAAAD~~,EAAkB,QAASI,EAE7B,OACET,EAAA,cAACJ,EACC,CAAA,IAAKQ,EACL,KAAMT,EACN,WAAYa,EACZ,MAAOP,EACN,GAAGE,CAGFG,EAAAA,EAAc,IAAKI,GAEf,CAACH,IACA,OAAOG,GAAU,UAAY,OAAOA,GAAU,UAExCV,EAAA,cAAC,~~OAAA~~,~~CAAK~~,IAAKU,~~CAAAA~~,~~EAAQA,~~CAAM,EAC9BV,EAAM,eAAeU,CAAK,IACxBA,GAAA,~~KAAA~~,OAAAA,EAAO,QAASD,EACXT,EAAM,aAAaU,EAAO,CAAE,GAAGA,EAAM,MAAO,KAAAf,CAAK,CAAC,EAEtDe,CACR,CAEL,CAEJ,CACF"}
1	+ {"version":3,"file":"ToggleGroupButton.js","sources":["../../../src/components/toggle-group/ToggleGroupButton.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { Icon } from '../icon'\nimport { StyledItem } from './ToggleGroupItem'\n\nconst minHeight = {\n sm: '32px',\n md: '40px',\n lg: '48px'\n}\n\nconst px = {\n sm: '$4',\n md: '$5',\n lg: '$5'\n}\n\nconst spacingBetweenElements = {\n sm: '$2',\n md: '$3',\n lg: '$3'\n}\n\nconst getSizeVariant = (size: string) => ({\n fontSize: `$${size}`,\n px: px[size],\n minHeight: minHeight[size],\n '& > *:not(:last-child)': {\n mr: spacingBetweenElements[size]\n }\n})\n\nexport const StyledButton = styled(StyledItem, {\n flexGrow: 1,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n fontWeight: 600,\n lineHeight: 1,\n py: '$1',\n variants: {\n size: {\n sm: getSizeVariant('sm'),\n md: getSizeVariant('md'),\n lg: getSizeVariant('lg')\n },\n isIconOnly: {\n true: {}\n },\n theme: {\n standard: {},\n modern: {}\n }\n },\n compoundVariants: [\n {\n isIconOnly: true,\n size: 'sm',\n css: {\n minWidth: minHeight.sm,\n p: 0\n }\n },\n {\n isIconOnly: true,\n size: 'md',\n css: {\n minWidth: minHeight.md,\n p: 0\n }\n },\n {\n isIconOnly: true,\n size: 'lg',\n css: {\n minWidth: minHeight.lg,\n p: 0\n }\n },\n {\n isIconOnly: true,\n size: 'sm',\n theme: 'modern',\n css: {\n minWidth: minHeight.md,\n p: 0\n }\n },\n {\n isIconOnly: true,\n size: 'md',\n theme: 'modern',\n css: {\n minWidth: minHeight.lg,\n p: 0\n }\n },\n {\n isIconOnly: true,\n size: 'lg',\n theme: 'modern',\n css: {\n minWidth: '60px',\n p: 0\n }\n }\n ]\n})\n\nexport const ToggleGroupButton: React.ForwardRefExoticComponent<\n React.ComponentProps<typeof StyledButton>\n> = React.forwardRef(\n ({ size = 'md', theme = 'standard', children, ...rest }, ref) => {\n const childrenArray = React.Children.toArray(children)\n const isSingleChild = childrenArray.length <= 1\n const isIconOnly =\n isSingleChild &&\n React.isValidElement(childrenArray[0]) &&\n childrenArray[0]?.type === Icon\n\n return (\n <StyledButton\n ref={ref}\n size={size}\n isIconOnly={isIconOnly}\n theme={theme}\n {...rest}\n >\n {\n childrenArray.map((child) => {\n if (\n !isSingleChild &&\n (typeof child === 'string' \|\| typeof child === 'number')\n )\n return <span key={child}>{child}</span>\n if (React.isValidElement(child)) {\n if (child?.type === Icon)\n return React.cloneElement(child, { ...child.props, size })\n }\n return child\n }) as React.ReactElement[]\n }\n </StyledButton>\n )\n }\n)\n"],"names":["minHeight","px","spacingBetweenElements","getSizeVariant","size","StyledButton","styled","StyledItem","ToggleGroupButton","React","theme","children","rest","ref","_a","childrenArray","isSingleChild","isIconOnly","Icon","child"],"mappings":"4JAOA,MAAMA,EAAY,CAChB,GAAI,OACJ,GAAI,OACJ,GAAI,MACN,EAEMC,EAAK,CACT,GAAI,KACJ,GAAI,KACJ,GAAI,IACN,EAEMC,EAAyB,CAC7B,GAAI,KACJ,GAAI,KACJ,GAAI,IACN,EAEMC,EAAkBC,IAAkB,CACxC,SAAU,IAAIA,IACd,GAAIH,EAAGG,GACP,UAAWJ,EAAUI,GACrB,yBAA0B,CACxB,GAAIF,EAAuBE,EAC7B,CACF,GAEaC,EAAeC,EAAOC,EAAY,CAC7C,SAAU,EACV,QAAS,OACT,WAAY,SACZ,eAAgB,SAChB,WAAY,IACZ,WAAY,EACZ,GAAI,KACJ,SAAU,CACR,KAAM,CACJ,GAAIJ,EAAe,IAAI,EACvB,GAAIA,EAAe,IAAI,EACvB,GAAIA,EAAe,IAAI,CACzB,EACA,WAAY,CACV,KAAM,CACR,CAAA,EACA,MAAO,CACL,SAAU,CAAA,EACV,OAAQ,CAAA,CACV,CACF,EACA,iBAAkB,CAChB,CACE,WAAY,GACZ,KAAM,KACN,IAAK,CACH,SAAUH,EAAU,GACpB,EAAG,CACL,CACF,EACA,CACE,WAAY,GACZ,KAAM,KACN,IAAK,CACH,SAAUA,EAAU,GACpB,EAAG,CACL,CACF,EACA,CACE,WAAY,GACZ,KAAM,KACN,IAAK,CACH,SAAUA,EAAU,GACpB,EAAG,CACL,CACF,EACA,CACE,WAAY,GACZ,KAAM,KACN,MAAO,SACP,IAAK,CACH,SAAUA,EAAU,GACpB,EAAG,CACL,CACF,EACA,CACE,WAAY,GACZ,KAAM,KACN,MAAO,SACP,IAAK,CACH,SAAUA,EAAU,GACpB,EAAG,CACL,CACF,EACA,CACE,WAAY,GACZ,KAAM,KACN,MAAO,SACP,IAAK,CACH,SAAU,OACV,EAAG,CACL,CACF,CACF,CACF,CAAC,EAEYQ,EAETC,EAAM,WACR,CAAC,CAAE,KAAAL,EAAO,KAAM,MAAAM,EAAQ,WAAY,SAAAC,KAAaC,CAAK,EAAGC,IAAQ,CAlHnE,IAAAC,EAmHI,MAAMC,EAAgBN,EAAM,SAAS,QAAQE,CAAQ,EAC/CK,EAAgBD,EAAc,QAAU,EACxCE,EACJD,GACAP,EAAM,eAAeM,EAAc,EAAE,KACrCD,EAAAC,EAAc,KAAd,KAAAD,OAAAA,EAAkB,QAASI,EAE7B,OACET,EAAA,cAACJ,EACC,CAAA,IAAKQ,EACL,KAAMT,EACN,WAAYa,EACZ,MAAOP,EACN,GAAGE,CAGFG,EAAAA,EAAc,IAAKI,GAEf,CAACH,IACA,OAAOG,GAAU,UAAY,OAAOA,GAAU,UAExCV,EAAA,cAAC,OAAK,CAAA,IAAKU,GAAQA,CAAM,EAC9BV,EAAM,eAAeU,CAAK,IACxBA,GAAA,KAAAA,OAAAA,EAAO,QAASD,EACXT,EAAM,aAAaU,EAAO,CAAE,GAAGA,EAAM,MAAO,KAAAf,CAAK,CAAC,EAEtDe,CACR,CAEL,CAEJ,CACF"}

package/dist/components/toggle-group/ToggleGroupRoot.d.ts CHANGED Viewed

@@ -7,7 +7,7 @@ type RootType = {
 export declare const StyledRoot: import("@atom-learning/stitches-react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<((import("@radix-ui/react-toggle-group").ToggleGroupSingleProps | import("@radix-ui/react-toggle-group").ToggleGroupMultipleProps) & React.RefAttributes<HTMLDivElement>) & {
     disableDeselect?: boolean;
 }>, {
-    isFullWidth?: boolean | "true" | undefined;
+    isFullWidth?: boolean | "true" | "false" | undefined;
     hasGap?: boolean | "true" | "false" | undefined;
     direction?: "row" | "column" | undefined;
     theme?: "standard" | "modern" | undefined;

package/dist/components/toggle-group/ToggleGroupRoot.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import*as t from"react";import{Flex as f}from"../flex/Flex.js";import{styled as u}from"../../stitches.js";import{ToggleGroup as b}from"../../utilities/radix-overrides/toggle-group/index.js";import{StyledItem as o}from"./ToggleGroupItem.js";const n=u(b.Root,{width:"fit-content",variants:{isFullWidth:{true:{width:"100%",[`& ${o}`]:{flexBasis:0,flexGrow:1}}},hasGap:{true:{[`& ${o}`]:{borderRadius:"$0"}},false:{borderRadius:"$1",[`& ${o}`]:{position:"relative","&:not(:last-child)::before":{content:"",position:"absolute"}}}},direction:{column:{},row:{}},theme:{standard:{},modern:{bg:"$grey200"}}},compoundVariants:[{hasGap:!1,direction:"row",theme:"standard",css:{[`& ${o}`]:{"&:not(:last-child)::before":{top:"-1px",height:"calc(100% + 2px)",width:"1px",right:"0",transform:"translateX(150%)"},"&:not(:first-child)":{borderLeftColor:"transparent"},"&:not(:last-child)":{borderRightColor:"transparent"},"&:first-child":{borderTopLeftRadius:"$1",borderBottomLeftRadius:"$1"},"&:last-child":{borderTopRightRadius:"$1",borderBottomRightRadius:"$1"}}}},{hasGap:!1,direction:"column",theme:"standard",css:{[`& ${o}`]:{"&:not(:last-child)::before":{bottom:0,left:"-1px",height:"1px",width:"calc(100% + 2px)",transform:"translateY(150%)"},"&:first-child":{borderTopLeftRadius:"$0",borderTopRightRadius:"$0"},"&:last-child":{borderBottomLeftRadius:"$0",borderBottomRightRadius:"$0"},"&:not(:first-child)":{borderTopColor:"transparent"},"&:not(:last-child)":{borderBottomColor:"transparent"}}}},{hasGap:!1,theme:"modern",css:{}},{hasGap:!1,theme:"standard",css:{bg:"white",[`& ${o}`]:{bg:"transparent",borderRadius:0}}}]}),R=r=>r==="horizontal"?"row":"column",g=t.forwardRef(({orientation:r="horizontal",gap:a,isFullWidth:l,children:h,theme:i="standard",wrap:p,...m},c)=>{const d=typeof a=="number",s=R(r);return t.createElement(n,{ref:c,direction:s,hasGap:d,isFullWidth:l,orientation:r,theme:i,...m},t.createElement(f,{direction:s,gap:d?a:void 0,wrap:p||"nowrap"},t.Children.toArray(h).map(e=>t.isValidElement(e)?t.cloneElement(e,{...e.props,theme:i}):e)))});export{n as StyledRoot,g as ToggleGroupRoot};
+import*as t from"react";import{Flex as f}from"../flex/Flex.js";import{styled as u}from"../../stitches.js";import{ToggleGroup as b}from"../../utilities/radix-overrides/toggle-group/index.js";import{StyledItem as o}from"./ToggleGroupItem.js";const n=u(b.Root,{width:"fit-content",variants:{isFullWidth:{true:{width:"100%",[`& ${o}`]:{flexBasis:0,flexGrow:1}},false:{width:"auto"}},hasGap:{true:{[`& ${o}`]:{borderRadius:"$0"}},false:{borderRadius:"$1",[`& ${o}`]:{position:"relative","&:not(:last-child)::before":{content:"",position:"absolute"}}}},direction:{column:{},row:{}},theme:{standard:{},modern:{bg:"$grey200"}}},compoundVariants:[{hasGap:!1,direction:"row",theme:"standard",css:{[`& ${o}`]:{"&:not(:last-child)::before":{top:"-1px",height:"calc(100% + 2px)",width:"1px",right:"0",transform:"translateX(150%)"},"&:not(:first-child)":{borderLeftColor:"transparent"},"&:not(:last-child)":{borderRightColor:"transparent"},"&:first-child":{borderTopLeftRadius:"$1",borderBottomLeftRadius:"$1"},"&:last-child":{borderTopRightRadius:"$1",borderBottomRightRadius:"$1"}}}},{hasGap:!1,direction:"column",theme:"standard",css:{[`& ${o}`]:{"&:not(:last-child)::before":{bottom:0,left:"-1px",height:"1px",width:"calc(100% + 2px)",transform:"translateY(150%)"},"&:first-child":{borderTopLeftRadius:"$0",borderTopRightRadius:"$0"},"&:last-child":{borderBottomLeftRadius:"$0",borderBottomRightRadius:"$0"},"&:not(:first-child)":{borderTopColor:"transparent"},"&:not(:last-child)":{borderBottomColor:"transparent"}}}},{hasGap:!1,theme:"modern",css:{}},{hasGap:!1,theme:"standard",css:{bg:"white",[`& ${o}`]:{bg:"transparent",borderRadius:0}}}]}),R=r=>r==="horizontal"?"row":"column",g=t.forwardRef(({orientation:r="horizontal",gap:a,isFullWidth:l,children:h,theme:i="standard",wrap:p,...m},c)=>{const d=typeof a=="number",s=R(r);return t.createElement(n,{ref:c,direction:s,hasGap:d,isFullWidth:l,orientation:r,theme:i,...m},t.createElement(f,{direction:s,gap:d?a:void 0,wrap:p||"nowrap"},t.Children.toArray(h).map(e=>t.isValidElement(e)?t.cloneElement(e,{...e.props,theme:i}):e)))});export{n as StyledRoot,g as ToggleGroupRoot};
 //# sourceMappingURL=ToggleGroupRoot.js.map

package/dist/components/toggle-group/ToggleGroupRoot.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ToggleGroupRoot.js","sources":["../../../src/components/toggle-group/ToggleGroupRoot.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Flex } from '~/components/flex'\nimport { styled } from '~/stitches'\nimport { ToggleGroup } from '~/utilities/radix-overrides/toggle-group'\n\nimport { StyledItem } from './ToggleGroupItem'\n\ntype RootType = {\n orientation?: 'horizontal' \| 'vertical'\n isFullWidth?: boolean\n}\n\nexport const StyledRoot = styled(ToggleGroup.Root, {\n width: 'fit-content',\n variants: {\n isFullWidth: {\n true: {\n width: '100%',\n [`& ${StyledItem}`]: {\n flexBasis: 0,\n flexGrow: 1\n }\n }\n },\n hasGap: {\n true: {\n [`& ${StyledItem}`]: {\n borderRadius: '$0'\n }\n },\n false: {\n borderRadius: '$1',\n [`& ${StyledItem}`]: {\n position: 'relative',\n '&:not(:last-child)::before': {\n content: '',\n position: 'absolute'\n }\n }\n }\n },\n direction: {\n column: {},\n row: {}\n },\n theme: {\n standard: {},\n modern: { bg: '$grey200' }\n }\n },\n compoundVariants: [\n {\n hasGap: false,\n direction: 'row',\n theme: 'standard',\n css: {\n [`& ${StyledItem}`]: {\n '&:not(:last-child)::before': {\n top: '-1px',\n height: 'calc(100% + 2px)',\n width: '1px',\n right: '0',\n transform: 'translateX(150%)'\n },\n '&:not(:first-child)': {\n borderLeftColor: 'transparent'\n },\n '&:not(:last-child)': {\n borderRightColor: 'transparent'\n },\n '&:first-child': {\n borderTopLeftRadius: '$1',\n borderBottomLeftRadius: '$1'\n },\n '&:last-child': {\n borderTopRightRadius: '$1',\n borderBottomRightRadius: '$1'\n }\n }\n }\n },\n {\n hasGap: false,\n direction: 'column',\n theme: 'standard',\n css: {\n [`& ${StyledItem}`]: {\n '&:not(:last-child)::before': {\n bottom: 0,\n left: '-1px',\n height: '1px',\n width: 'calc(100% + 2px)',\n transform: 'translateY(150%)'\n },\n '&:first-child': {\n borderTopLeftRadius: '$0',\n borderTopRightRadius: '$0'\n },\n '&:last-child': {\n borderBottomLeftRadius: '$0',\n borderBottomRightRadius: '$0'\n },\n '&:not(:first-child)': {\n borderTopColor: 'transparent'\n },\n '&:not(:last-child)': {\n borderBottomColor: 'transparent'\n }\n }\n }\n },\n {\n hasGap: false,\n theme: 'modern',\n css: {}\n },\n {\n hasGap: false,\n theme: 'standard',\n css: {\n bg: 'white',\n [`& ${StyledItem}`]: {\n bg: 'transparent',\n borderRadius: 0\n }\n }\n }\n ]\n})\n\nconst orientationToDirection = (orientation) =>\n orientation === 'horizontal' ? 'row' : 'column'\n\nexport const ToggleGroupRoot: React.ForwardRefExoticComponent<\n Pick<React.ComponentProps<typeof Flex>, 'gap' \| 'wrap'> &\n React.ComponentProps<typeof StyledRoot> &\n RootType\n> = React.forwardRef(\n (\n {\n orientation = 'horizontal',\n gap,\n isFullWidth,\n children,\n theme = 'standard',\n wrap,\n ...rest\n },\n ref\n ) => {\n const hasGap = typeof gap === 'number'\n const direction = orientationToDirection(orientation)\n return (\n <StyledRoot\n ref={ref}\n direction={direction}\n hasGap={hasGap}\n isFullWidth={isFullWidth}\n orientation={orientation}\n theme={theme}\n {...rest}\n >\n <Flex\n direction={direction}\n gap={hasGap ? gap : undefined}\n wrap={wrap \|\| 'nowrap'}\n >\n {\n React.Children.toArray(children).map((child) => {\n if (React.isValidElement(child)) {\n return React.cloneElement(child, { ...child.props, theme })\n }\n return child\n }) as React.ReactElement[]\n }\n </Flex>\n </StyledRoot>\n )\n }\n)\n"],"names":["StyledRoot","styled","ToggleGroup","StyledItem","orientationToDirection","orientation","ToggleGroupRoot","React","gap","isFullWidth","children","theme","wrap","rest","ref","hasGap","direction","Flex","child"],"mappings":"gPAaO,MAAMA,EAAaC,EAAOC,EAAY,KAAM,CACjD,MAAO,cACP,SAAU,CACR,YAAa,CACX,KAAM,CACJ,MAAO,OACP,CAAC,KAAKC,KAAe,CACnB,UAAW,EACX,SAAU,CACZ,CACF,CACF,EACA,OAAQ,CACN,KAAM,CACJ,CAAC,KAAKA,KAAe,CACnB,aAAc,IAChB,CACF,EACA,MAAO,CACL,aAAc,KACd,CAAC,KAAKA,KAAe,CACnB,SAAU,WACV,6BAA8B,CAC5B,QAAS,GACT,SAAU,UACZ,CACF,CACF,CACF,EACA,UAAW,CACT,OAAQ,~~CAAC~~,~~EACT,~~IAAK,CACP,~~CAAA,~~EACA,MAAO,CACL,SAAU,~~CAAA~~,~~EACV~~,OAAQ,CAAE,GAAI,UAAW,CAC3B,CACF,EACA,iBAAkB,CAChB,CACE,OAAQ,GACR,UAAW,MACX,MAAO,WACP,IAAK,CACH,CAAC,KAAKA,KAAe,CACnB,6BAA8B,CAC5B,IAAK,OACL,OAAQ,mBACR,MAAO,MACP,MAAO,IACP,UAAW,kBACb,EACA,sBAAuB,CACrB,gBAAiB,aACnB,EACA,qBAAsB,CACpB,iBAAkB,aACpB,EACA,gBAAiB,CACf,oBAAqB,KACrB,uBAAwB,IAC1B,EACA,eAAgB,CACd,qBAAsB,KACtB,wBAAyB,IAC3B,CACF,CACF,CACF,EACA,CACE,OAAQ,GACR,UAAW,SACX,MAAO,WACP,IAAK,CACH,CAAC,KAAKA,KAAe,CACnB,6BAA8B,CAC5B,OAAQ,EACR,KAAM,OACN,OAAQ,MACR,MAAO,mBACP,UAAW,kBACb,EACA,gBAAiB,CACf,oBAAqB,KACrB,qBAAsB,IACxB,EACA,eAAgB,CACd,uBAAwB,KACxB,wBAAyB,IAC3B,EACA,sBAAuB,CACrB,eAAgB,aAClB,EACA,qBAAsB,CACpB,kBAAmB,aACrB,CACF,CACF,CACF,EACA,CACE,OAAQ,GACR,MAAO,SACP,IAAK,~~EACP~~,EACA,CACE,OAAQ,GACR,MAAO,WACP,IAAK,CACH,GAAI,QACJ,CAAC,KAAKA,KAAe,CACnB,GAAI,cACJ,aAAc,CAChB,CACF,CACF,CACF,CACF,CAAC,EAEKC,EAA0BC,GAC9BA,IAAgB,aAAe,MAAQ,SAE5BC,EAITC,EAAM,WACR,CACE,CACE,YAAAF,EAAc,aACd,IAAAG,EACA,YAAAC,EACA,SAAAC,EACA,MAAAC,EAAQ,WACR,KAAAC,KACGC,CACL,EACAC,IACG,CACH,MAAMC,EAAS,OAAOP,GAAQ,SACxBQ,EAAYZ,EAAuBC,CAAW,EACpD,OACEE,EAAA,cAACP,EACC,CAAA,IAAKc,EACL,UAAWE,EACX,OAAQD,EACR,YAAaN,EACb,YAAaJ,EACb,MAAOM,EACN,GAAGE,CAAAA,EAEJN,EAAA,cAACU,EAAA,CACC,UAAWD,EACX,IAAKD,EAASP,EAAM,OACpB,KAAMI,GAAQ,QAAA,EAGZL,EAAM,SAAS,QAAQG,CAAQ,EAAE,IAAKQ,GAChCX,EAAM,eAAeW,CAAK,EACrBX,EAAM,aAAaW,EAAO,CAAE,GAAGA,EAAM,MAAO,MAAAP,CAAM,CAAC,EAErDO,CACR,CAEL,CACF,CAEJ,CACF"}
1	+ {"version":3,"file":"ToggleGroupRoot.js","sources":["../../../src/components/toggle-group/ToggleGroupRoot.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Flex } from '~/components/flex'\nimport { styled } from '~/stitches'\nimport { ToggleGroup } from '~/utilities/radix-overrides/toggle-group'\n\nimport { StyledItem } from './ToggleGroupItem'\n\ntype RootType = {\n orientation?: 'horizontal' \| 'vertical'\n isFullWidth?: boolean\n}\n\nexport const StyledRoot = styled(ToggleGroup.Root, {\n width: 'fit-content',\n variants: {\n isFullWidth: {\n true: {\n width: '100%',\n [`& ${StyledItem}`]: {\n flexBasis: 0,\n flexGrow: 1\n }\n },\n false: {\n width: 'auto'\n }\n },\n hasGap: {\n true: {\n [`& ${StyledItem}`]: {\n borderRadius: '$0'\n }\n },\n false: {\n borderRadius: '$1',\n [`& ${StyledItem}`]: {\n position: 'relative',\n '&:not(:last-child)::before': {\n content: '',\n position: 'absolute'\n }\n }\n }\n },\n direction: {\n column: {},\n row: {}\n },\n theme: {\n standard: {},\n modern: { bg: '$grey200' }\n }\n },\n compoundVariants: [\n {\n hasGap: false,\n direction: 'row',\n theme: 'standard',\n css: {\n [`& ${StyledItem}`]: {\n '&:not(:last-child)::before': {\n top: '-1px',\n height: 'calc(100% + 2px)',\n width: '1px',\n right: '0',\n transform: 'translateX(150%)'\n },\n '&:not(:first-child)': {\n borderLeftColor: 'transparent'\n },\n '&:not(:last-child)': {\n borderRightColor: 'transparent'\n },\n '&:first-child': {\n borderTopLeftRadius: '$1',\n borderBottomLeftRadius: '$1'\n },\n '&:last-child': {\n borderTopRightRadius: '$1',\n borderBottomRightRadius: '$1'\n }\n }\n }\n },\n {\n hasGap: false,\n direction: 'column',\n theme: 'standard',\n css: {\n [`& ${StyledItem}`]: {\n '&:not(:last-child)::before': {\n bottom: 0,\n left: '-1px',\n height: '1px',\n width: 'calc(100% + 2px)',\n transform: 'translateY(150%)'\n },\n '&:first-child': {\n borderTopLeftRadius: '$0',\n borderTopRightRadius: '$0'\n },\n '&:last-child': {\n borderBottomLeftRadius: '$0',\n borderBottomRightRadius: '$0'\n },\n '&:not(:first-child)': {\n borderTopColor: 'transparent'\n },\n '&:not(:last-child)': {\n borderBottomColor: 'transparent'\n }\n }\n }\n },\n {\n hasGap: false,\n theme: 'modern',\n css: {}\n },\n {\n hasGap: false,\n theme: 'standard',\n css: {\n bg: 'white',\n [`& ${StyledItem}`]: {\n bg: 'transparent',\n borderRadius: 0\n }\n }\n }\n ]\n})\n\nconst orientationToDirection = (orientation) =>\n orientation === 'horizontal' ? 'row' : 'column'\n\nexport const ToggleGroupRoot: React.ForwardRefExoticComponent<\n Pick<React.ComponentProps<typeof Flex>, 'gap' \| 'wrap'> &\n React.ComponentProps<typeof StyledRoot> &\n RootType\n> = React.forwardRef(\n (\n {\n orientation = 'horizontal',\n gap,\n isFullWidth,\n children,\n theme = 'standard',\n wrap,\n ...rest\n },\n ref\n ) => {\n const hasGap = typeof gap === 'number'\n const direction = orientationToDirection(orientation)\n return (\n <StyledRoot\n ref={ref}\n direction={direction}\n hasGap={hasGap}\n isFullWidth={isFullWidth}\n orientation={orientation}\n theme={theme}\n {...rest}\n >\n <Flex\n direction={direction}\n gap={hasGap ? gap : undefined}\n wrap={wrap \|\| 'nowrap'}\n >\n {\n React.Children.toArray(children).map((child) => {\n if (React.isValidElement(child)) {\n return React.cloneElement(child, { ...child.props, theme })\n }\n return child\n }) as React.ReactElement[]\n }\n </Flex>\n </StyledRoot>\n )\n }\n)\n"],"names":["StyledRoot","styled","ToggleGroup","StyledItem","orientationToDirection","orientation","ToggleGroupRoot","React","gap","isFullWidth","children","theme","wrap","rest","ref","hasGap","direction","Flex","child"],"mappings":"gPAaO,MAAMA,EAAaC,EAAOC,EAAY,KAAM,CACjD,MAAO,cACP,SAAU,CACR,YAAa,CACX,KAAM,CACJ,MAAO,OACP,CAAC,KAAKC,KAAe,CACnB,UAAW,EACX,SAAU,CACZ,CACF,EACA,MAAO,CACL,MAAO,MACT,CACF,EACA,OAAQ,CACN,KAAM,CACJ,CAAC,KAAKA,KAAe,CACnB,aAAc,IAChB,CACF,EACA,MAAO,CACL,aAAc,KACd,CAAC,KAAKA,KAAe,CACnB,SAAU,WACV,6BAA8B,CAC5B,QAAS,GACT,SAAU,UACZ,CACF,CACF,CACF,EACA,UAAW,CACT,OAAQ,GACR,IAAK,CAAA,CACP,EACA,MAAO,CACL,SAAU,CAAC,EACX,OAAQ,CAAE,GAAI,UAAW,CAC3B,CACF,EACA,iBAAkB,CAChB,CACE,OAAQ,GACR,UAAW,MACX,MAAO,WACP,IAAK,CACH,CAAC,KAAKA,KAAe,CACnB,6BAA8B,CAC5B,IAAK,OACL,OAAQ,mBACR,MAAO,MACP,MAAO,IACP,UAAW,kBACb,EACA,sBAAuB,CACrB,gBAAiB,aACnB,EACA,qBAAsB,CACpB,iBAAkB,aACpB,EACA,gBAAiB,CACf,oBAAqB,KACrB,uBAAwB,IAC1B,EACA,eAAgB,CACd,qBAAsB,KACtB,wBAAyB,IAC3B,CACF,CACF,CACF,EACA,CACE,OAAQ,GACR,UAAW,SACX,MAAO,WACP,IAAK,CACH,CAAC,KAAKA,KAAe,CACnB,6BAA8B,CAC5B,OAAQ,EACR,KAAM,OACN,OAAQ,MACR,MAAO,mBACP,UAAW,kBACb,EACA,gBAAiB,CACf,oBAAqB,KACrB,qBAAsB,IACxB,EACA,eAAgB,CACd,uBAAwB,KACxB,wBAAyB,IAC3B,EACA,sBAAuB,CACrB,eAAgB,aAClB,EACA,qBAAsB,CACpB,kBAAmB,aACrB,CACF,CACF,CACF,EACA,CACE,OAAQ,GACR,MAAO,SACP,IAAK,CACP,CAAA,EACA,CACE,OAAQ,GACR,MAAO,WACP,IAAK,CACH,GAAI,QACJ,CAAC,KAAKA,KAAe,CACnB,GAAI,cACJ,aAAc,CAChB,CACF,CACF,CACF,CACF,CAAC,EAEKC,EAA0BC,GAC9BA,IAAgB,aAAe,MAAQ,SAE5BC,EAITC,EAAM,WACR,CACE,CACE,YAAAF,EAAc,aACd,IAAAG,EACA,YAAAC,EACA,SAAAC,EACA,MAAAC,EAAQ,WACR,KAAAC,KACGC,CACL,EACAC,IACG,CACH,MAAMC,EAAS,OAAOP,GAAQ,SACxBQ,EAAYZ,EAAuBC,CAAW,EACpD,OACEE,EAAA,cAACP,EACC,CAAA,IAAKc,EACL,UAAWE,EACX,OAAQD,EACR,YAAaN,EACb,YAAaJ,EACb,MAAOM,EACN,GAAGE,CAAAA,EAEJN,EAAA,cAACU,EAAA,CACC,UAAWD,EACX,IAAKD,EAASP,EAAM,OACpB,KAAMI,GAAQ,QAAA,EAGZL,EAAM,SAAS,QAAQG,CAAQ,EAAE,IAAKQ,GAChCX,EAAM,eAAeW,CAAK,EACrBX,EAAM,aAAaW,EAAO,CAAE,GAAGA,EAAM,MAAO,MAAAP,CAAM,CAAC,EAErDO,CACR,CAEL,CACF,CAEJ,CACF"}

package/dist/components/toggle-group/index.d.ts CHANGED Viewed

@@ -1498,7 +1498,7 @@ export declare const ToggleGroup: {
     }, "gap" | "wrap"> & ((Omit<import("@radix-ui/react-toggle-group").ToggleGroupSingleProps & import("react").RefAttributes<HTMLDivElement> & {
         disableDeselect?: boolean;
     }, "direction" | "css" | "theme" | "isFullWidth" | "hasGap"> & import("@atom-learning/stitches-react/types/styled-component").TransformProps<{
-        isFullWidth?: boolean | "true" | undefined;
+        isFullWidth?: boolean | "true" | "false" | undefined;
         hasGap?: boolean | "true" | "false" | undefined;
         direction?: "row" | "column" | undefined;
         theme?: "standard" | "modern" | undefined;
@@ -1875,7 +1875,7 @@ export declare const ToggleGroup: {
     }) | (Omit<import("@radix-ui/react-toggle-group").ToggleGroupMultipleProps & import("react").RefAttributes<HTMLDivElement> & {
         disableDeselect?: boolean;
     }, "direction" | "css" | "theme" | "isFullWidth" | "hasGap"> & import("@atom-learning/stitches-react/types/styled-component").TransformProps<{
-        isFullWidth?: boolean | "true" | undefined;
+        isFullWidth?: boolean | "true" | "false" | undefined;
         hasGap?: boolean | "true" | "false" | undefined;
         direction?: "row" | "column" | undefined;
         theme?: "standard" | "modern" | undefined;

package/dist/components/top-bar/TopBar.d.ts CHANGED Viewed

@@ -1504,7 +1504,7 @@ export declare const TopBar: {
     ActionIcon: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
         ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
     }, "appearance" | "size" | "css" | "theme" | "isRounded"> & import("@atom-learning/stitches-react/types/styled-component").TransformProps<{
-        theme?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
+        theme?: "success" | "danger" | "warning" | "neutral" | "primary" | "white" | undefined;
         appearance?: "outline" | "solid" | "simple" | undefined;
         size?: "xs" | "sm" | "md" | "lg" | undefined;
         isRounded?: boolean | "true" | undefined;
@@ -1879,7 +1879,7 @@ export declare const TopBar: {
             };
         }> | undefined;
     }, "appearance" | "size" | "theme" | "label" | "children" | "as" | keyof import("../../types").NavigatorActions | "hasTooltip" | "tooltipSide" | "isRounded"> & import("@atom-learning/stitches-react/types/styled-component").TransformProps<{
-        theme?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
+        theme?: "success" | "danger" | "warning" | "neutral" | "primary" | "white" | undefined;
         appearance?: "outline" | "solid" | "simple" | undefined;
         size?: "xs" | "sm" | "md" | "lg" | undefined;
         isRounded?: boolean | "true" | undefined;

package/dist/components/top-bar/TopBar.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import*as r from"react";import{styled as o}from"../../stitches.js";import{useWindowScrollPosition as p}from"../../utilities/hooks/useWindowScrollPosition.js";import{Divider as m}from"../divider/Divider.js";import{Flex as c}from"../flex/Flex.js";import{colorSchemes as l}from"./stitches.topBar.colorscheme.config.js";import{TopBarActionIcon as f}from"./TopBarActionIcon.js";import{TopBarBrand as h,TopBarBrandLogo as g,TopBarBrandName as x}from"./TopBarBrand.js";const b=()=>r.createElement(m,{orientation:"vertical",css:{height:"$2",bg:"$divider"}}),u=o("div",{bg:"$background",position:"sticky",display:"flex",alignItems:"center",zIndex:1,transition:"box-shadow .2s ease-out",variants:{hasScrolled:{true:{boxShadow:"0px 4px 4px -2px rgba(31, 31, 31, 0.1);"}},size:{md:{height:"$6"},lg:{height:"$7"}},diffused:{true:{"@supports (background-color: color-mix(in hsl, white 50%, transparent))":{bg:"color-mix(in hsl, $background 70%, transparent)",backdropFilter:"blur(8px)"}}},appearance:{standard:{width:"100vw",top:"0",borderBottom:"1px solid $borderBottom"},rounded:{width:"100%",top:"$2",p:"$2",border:"1px solid #ffffff",borderRadius:"$round"}}}}),B=o(c,{alignItems:"center",height:"$4",mx:"$4",width:"100%","@md":{mx:"$5"}}),e=({size:t="md",diffused:a,className:i=l.light,appearance:d="standard",...n})=>{const{y:s}=p();return r.createElement(u,{className:i,hasScrolled:!!s,diffused:a,appearance:d,size:t},r.createElement(B,{...n}))},$=Object.assign(e,{Brand:h,BrandLogo:g,BrandName:x,ActionIcon:f,Divider:b});e.displayName="TopBar";export{$ as TopBar};
+import*as r from"react";import{styled as o}from"../../stitches.js";import{useWindowScrollPosition as p}from"../../utilities/hooks/useWindowScrollPosition.js";import{Divider as m}from"../divider/Divider.js";import{Flex as c}from"../flex/Flex.js";import{colorSchemes as l}from"./stitches.topBar.colorscheme.config.js";import{TopBarActionIcon as f}from"./TopBarActionIcon.js";import{TopBarBrand as h,TopBarBrandLogo as x,TopBarBrandName as g}from"./TopBarBrand.js";const b=()=>r.createElement(m,{orientation:"vertical",css:{height:"$2",bg:"$divider"}}),u=o("div",{bg:"$background",position:"sticky",display:"flex",alignItems:"center",zIndex:1,transition:"box-shadow .2s ease-out",variants:{hasScrolled:{true:{boxShadow:"0px 4px 4px -2px rgba(31, 31, 31, 0.1)"}},size:{md:{height:"$6"},lg:{height:"$7"}},diffused:{true:{"@supports (background-color: color-mix(in hsl, white 50%, transparent))":{bg:"color-mix(in hsl, $background 70%, transparent)",backdropFilter:"blur(8px)"}}},appearance:{standard:{width:"100vw",maxWidth:"100%",top:"0",borderBottom:"1px solid $borderBottom"},rounded:{width:"100%",top:"$2",p:"$2",border:"1px solid #ffffff",borderRadius:"$round"}}}}),B=o(c,{alignItems:"center",height:"$4",mx:"$4",width:"100%","@md":{mx:"$5"}}),e=({size:t="md",diffused:a,className:i=l.light,appearance:d="standard",...n})=>{const{y:s}=p();return r.createElement(u,{className:i,hasScrolled:!!s,diffused:a,appearance:d,size:t},r.createElement(B,{...n}))},$=Object.assign(e,{Brand:h,BrandLogo:x,BrandName:g,ActionIcon:f,Divider:b});e.displayName="TopBar";export{$ as TopBar};
 //# sourceMappingURL=TopBar.js.map

package/dist/components/top-bar/TopBar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TopBar.js","sources":["../../../src/components/top-bar/TopBar.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { CSS, styled } from '~/stitches'\nimport { useWindowScrollPosition } from '~/utilities/hooks/useWindowScrollPosition'\n\nimport { Divider } from '../divider'\nimport { Flex } from '../flex'\nimport { colorSchemes as topBarColorSchemes } from './stitches.topBar.colorscheme.config'\nimport { TopBarActionIcon } from './TopBarActionIcon'\nimport { TopBarBrand, TopBarBrandLogo, TopBarBrandName } from './TopBarBrand'\n\nconst TopBarDivider = () => (\n <Divider orientation=\"vertical\" css={{ height: '$2', bg: '$divider' }} />\n)\n\nconst StyledRoot = styled('div', {\n bg: '$background',\n position: 'sticky',\n display: 'flex',\n alignItems: 'center',\n\n zIndex: 1,\n transition: 'box-shadow .2s ease-out',\n variants: {\n hasScrolled: {\n true: { boxShadow: '0px 4px 4px -2px rgba(31, 31, 31, 0.1);' }\n },\n size: {\n md: { height: '$6' },\n lg: { height: '$7' }\n },\n diffused: {\n true: {\n '@supports (background-color: color-mix(in hsl, white 50%, transparent))':\n {\n bg: 'color-mix(in hsl, $background 70%, transparent)',\n backdropFilter: 'blur(8px)'\n }\n }\n },\n appearance: {\n standard: {\n width: '100vw',\n top: '0',\n borderBottom: '1px solid $borderBottom'\n },\n rounded: {\n width: '100%',\n top: '$2',\n p: '$2',\n border: '1px solid #ffffff',\n borderRadius: '$round'\n }\n }\n }\n})\n\nconst Container = styled(Flex, {\n alignItems: 'center',\n height: '$4',\n mx: '$4',\n width: '100%',\n '@md': {\n mx: '$5'\n }\n})\n\ntype StyledRootProps = React.ComponentProps<typeof StyledRoot>\n\ntype TopBarProps = StyledRootProps & {\n css?: CSS\n className?: string\n}\n\nconst TopBarComponent = ({\n size = 'md',\n diffused,\n className = topBarColorSchemes['light'],\n appearance = 'standard',\n ...props\n}: React.PropsWithChildren<TopBarProps>) => {\n const { y: scrollPositionY } = useWindowScrollPosition()\n\n return (\n <StyledRoot\n className={className}\n hasScrolled={!!scrollPositionY}\n diffused={diffused}\n appearance={appearance}\n size={size}\n >\n <Container {...props} />\n </StyledRoot>\n )\n}\n\nexport const TopBar = Object.assign(TopBarComponent, {\n Brand: TopBarBrand,\n BrandLogo: TopBarBrandLogo,\n BrandName: TopBarBrandName,\n ActionIcon: TopBarActionIcon,\n Divider: TopBarDivider\n})\n\nTopBarComponent.displayName = 'TopBar'\n"],"names":["TopBarDivider","React","Divider","StyledRoot","styled","Container","Flex","TopBarComponent","size","diffused","className","topBarColorSchemes","appearance","props","scrollPositionY","useWindowScrollPosition","TopBar","TopBarBrand","TopBarBrandLogo","TopBarBrandName","TopBarActionIcon"],"mappings":"8cAWA,MAAMA,EAAgB,IACpBC,EAAA,cAACC,EAAA,CAAQ,YAAY,WAAW,IAAK,CAAE,OAAQ,KAAM,GAAI,UAAW,CAAA,CAAG,EAGnEC,EAAaC,EAAO,MAAO,CAC/B,GAAI,cACJ,SAAU,SACV,QAAS,OACT,WAAY,SAEZ,OAAQ,EACR,WAAY,0BACZ,SAAU,CACR,YAAa,CACX,KAAM,CAAE,UAAW,~~yCAA0C~~,~~CAC/D~~,EACA,KAAM,CACJ,GAAI,CAAE,OAAQ,IAAK,EACnB,GAAI,CAAE,OAAQ,IAAK,CACrB,EACA,SAAU,CACR,KAAM,CACJ,0EACE,CACE,GAAI,kDACJ,eAAgB,WAClB,CACJ,CACF,EACA,WAAY,CACV,SAAU,CACR,MAAO,QACP,IAAK,IACL,aAAc,yBAChB,EACA,QAAS,CACP,MAAO,OACP,IAAK,KACL,EAAG,KACH,OAAQ,oBACR,aAAc,QAChB,CACF,CACF,CACF,CAAC,EAEKC,EAAYD,EAAOE,EAAM,CAC7B,WAAY,SACZ,OAAQ,KACR,GAAI,KACJ,MAAO,OACP,MAAO,CACL,GAAI,IACN,CACF,CAAC,EASKC,EAAkB,CAAC,CACvB,KAAAC,EAAO,KACP,SAAAC,EACA,UAAAC,EAAYC,EAAmB,MAC/B,WAAAC,EAAa,cACVC,CACL,IAA4C,CAC1C,KAAM,CAAE,EAAGC,CAAgB,EAAIC,~~IAE/B~~,OACEd,EAAA,cAACE,EAAA,CACC,UAAWO,EACX,YAAa,CAAC,CAACI,EACf,SAAUL,EACV,WAAYG,EACZ,KAAMJ,~~CAAAA~~,~~EAENP~~,EAAA,cAACI,EAAA,CAAW,GAAGQ,CAAO,~~CAAA,~~CACxB,CAEJ,EAEaG,EAAS,OAAO,OAAOT,EAAiB,CACnD,MAAOU,EACP,UAAWC,EACX,UAAWC,EACX,WAAYC,EACZ,QAASpB,CACX,CAAC,EAEDO,EAAgB,YAAc"}
1	+ {"version":3,"file":"TopBar.js","sources":["../../../src/components/top-bar/TopBar.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { CSS, styled } from '~/stitches'\nimport { useWindowScrollPosition } from '~/utilities/hooks/useWindowScrollPosition'\n\nimport { Divider } from '../divider'\nimport { Flex } from '../flex'\nimport { colorSchemes as topBarColorSchemes } from './stitches.topBar.colorscheme.config'\nimport { TopBarActionIcon } from './TopBarActionIcon'\nimport { TopBarBrand, TopBarBrandLogo, TopBarBrandName } from './TopBarBrand'\n\nconst TopBarDivider = () => (\n <Divider orientation=\"vertical\" css={{ height: '$2', bg: '$divider' }} />\n)\n\nconst StyledRoot = styled('div', {\n bg: '$background',\n position: 'sticky',\n display: 'flex',\n alignItems: 'center',\n\n zIndex: 1,\n transition: 'box-shadow .2s ease-out',\n variants: {\n hasScrolled: {\n true: { boxShadow: '0px 4px 4px -2px rgba(31, 31, 31, 0.1)' }\n },\n size: {\n md: { height: '$6' },\n lg: { height: '$7' }\n },\n diffused: {\n true: {\n '@supports (background-color: color-mix(in hsl, white 50%, transparent))':\n {\n bg: 'color-mix(in hsl, $background 70%, transparent)',\n backdropFilter: 'blur(8px)'\n }\n }\n },\n appearance: {\n standard: {\n width: '100vw',\n maxWidth: '100%',\n top: '0',\n borderBottom: '1px solid $borderBottom'\n },\n rounded: {\n width: '100%',\n top: '$2',\n p: '$2',\n border: '1px solid #ffffff',\n borderRadius: '$round'\n }\n }\n }\n})\n\nconst Container = styled(Flex, {\n alignItems: 'center',\n height: '$4',\n mx: '$4',\n width: '100%',\n '@md': {\n mx: '$5'\n }\n})\n\ntype StyledRootProps = React.ComponentProps<typeof StyledRoot>\n\ntype TopBarProps = StyledRootProps & {\n css?: CSS\n className?: string\n}\n\nconst TopBarComponent = ({\n size = 'md',\n diffused,\n className = topBarColorSchemes['light'],\n appearance = 'standard',\n ...props\n}: React.PropsWithChildren<TopBarProps>) => {\n const { y: scrollPositionY } = useWindowScrollPosition()\n\n return (\n <StyledRoot\n className={className}\n hasScrolled={!!scrollPositionY}\n diffused={diffused}\n appearance={appearance}\n size={size}\n >\n <Container {...props} />\n </StyledRoot>\n )\n}\n\nexport const TopBar = Object.assign(TopBarComponent, {\n Brand: TopBarBrand,\n BrandLogo: TopBarBrandLogo,\n BrandName: TopBarBrandName,\n ActionIcon: TopBarActionIcon,\n Divider: TopBarDivider\n})\n\nTopBarComponent.displayName = 'TopBar'\n"],"names":["TopBarDivider","React","Divider","StyledRoot","styled","Container","Flex","TopBarComponent","size","diffused","className","topBarColorSchemes","appearance","props","scrollPositionY","useWindowScrollPosition","TopBar","TopBarBrand","TopBarBrandLogo","TopBarBrandName","TopBarActionIcon"],"mappings":"8cAWA,MAAMA,EAAgB,IACpBC,EAAA,cAACC,EAAA,CAAQ,YAAY,WAAW,IAAK,CAAE,OAAQ,KAAM,GAAI,UAAW,CAAA,CAAG,EAGnEC,EAAaC,EAAO,MAAO,CAC/B,GAAI,cACJ,SAAU,SACV,QAAS,OACT,WAAY,SAEZ,OAAQ,EACR,WAAY,0BACZ,SAAU,CACR,YAAa,CACX,KAAM,CAAE,UAAW,wCAAyC,CAC9D,EACA,KAAM,CACJ,GAAI,CAAE,OAAQ,IAAK,EACnB,GAAI,CAAE,OAAQ,IAAK,CACrB,EACA,SAAU,CACR,KAAM,CACJ,0EACE,CACE,GAAI,kDACJ,eAAgB,WAClB,CACJ,CACF,EACA,WAAY,CACV,SAAU,CACR,MAAO,QACP,SAAU,OACV,IAAK,IACL,aAAc,yBAChB,EACA,QAAS,CACP,MAAO,OACP,IAAK,KACL,EAAG,KACH,OAAQ,oBACR,aAAc,QAChB,CACF,CACF,CACF,CAAC,EAEKC,EAAYD,EAAOE,EAAM,CAC7B,WAAY,SACZ,OAAQ,KACR,GAAI,KACJ,MAAO,OACP,MAAO,CACL,GAAI,IACN,CACF,CAAC,EASKC,EAAkB,CAAC,CACvB,KAAAC,EAAO,KACP,SAAAC,EACA,UAAAC,EAAYC,EAAmB,MAC/B,WAAAC,EAAa,cACVC,CACL,IAA4C,CAC1C,KAAM,CAAE,EAAGC,CAAgB,EAAIC,EAAwB,EAEvD,OACEd,EAAA,cAACE,EAAA,CACC,UAAWO,EACX,YAAa,CAAC,CAACI,EACf,SAAUL,EACV,WAAYG,EACZ,KAAMJ,CAENP,EAAAA,EAAA,cAACI,EAAA,CAAW,GAAGQ,CAAAA,CAAO,CACxB,CAEJ,EAEaG,EAAS,OAAO,OAAOT,EAAiB,CACnD,MAAOU,EACP,UAAWC,EACX,UAAWC,EACX,WAAYC,EACZ,QAASpB,CACX,CAAC,EAEDO,EAAgB,YAAc"}