@atom-learning/components 6.0.0-beta.5 → 6.0.0-beta.6

package/dist/components/data-table/pagination/Pagination.js

@@ -1,2 +1,2 @@
-import*as e from"react";import{styled as S}from"../../../stitches.js";import{Pagination as w}from"../../pagination/Pagination.js";import{Text as y}from"../../text/Text.js";import{AsyncDataState as $}from"../DataTable.types.js";import{useDataTable as D}from"../DataTableContext.js";const h=S("nav",{display:"flex",flexDirection:"column",justifyContent:"space-between",alignItems:"center",fontVariantNumeric:"tabular-nums",flexWrap:"wrap",width:"100%",gap:"$4",mt:"$4","@md":{flexDirection:"row"}}),r=({colorScheme:m,...s})=>{const{applyPagination:a,getState:g,getRowModel:l,getPageCount:n,setPageIndex:c,getTotalRows:o,asyncDataState:p}=D();e.useEffect(()=>{a()},[a]);const{pagination:t}=g(),f=p!==$.PENDING&&o()===0,d=n()>1;if(f||!d)return null;const i=t.pageIndex*t.pageSize+1,u=i+l().rows.length-1,P=x=>{c(x-1)};return e.createElement(h,{...s},e.createElement(y,{size:"sm"},`${i.toString()} - ${u.toString()} of ${o()} items`),e.createElement(w,{colorScheme:m,selectedPage:t.pageIndex+1,pagesCount:n(),onSelectedPageChange:P}))};r.displayName="Pagination";export{r as Pagination};
+import*as e from"react";import{styled as S}from"../../../styled.js";import{Pagination as w}from"../../pagination/Pagination.js";import{Text as y}from"../../text/Text.js";import{AsyncDataState as E}from"../DataTable.types.js";import{useDataTable as b}from"../DataTableContext.js";const h=S("nav",{base:["flex","flex-col","justify-between","items-center","tabular-nums","flex-wrap","w-full","gap-4","mt-4","md:flex-row"]}),i=({colorScheme:c,...l})=>{const{applyPagination:a,getState:m,getRowModel:s,getPageCount:o,setPageIndex:g,getTotalRows:n,asyncDataState:p}=b();e.useEffect(()=>{a()},[a]);const{pagination:t}=m(),f=p!==E.PENDING&&n()===0,u=o()>1;if(f||!u)return null;const r=t.pageIndex*t.pageSize+1,P=r+s().rows.length-1,d=x=>{g(x-1)};return e.createElement(h,{...l},e.createElement(y,{size:"sm"},"".concat(r.toString()," - ").concat(P.toString()," of ").concat(n()," items")),e.createElement(w,{colorScheme:c,selectedPage:t.pageIndex+1,pagesCount:o(),onSelectedPageChange:d}))};i.displayName="Pagination";export{i as Pagination};
 //# sourceMappingURL=Pagination.js.map

package/dist/components/data-table/pagination/Pagination.js.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.js","sources":["../../../../src/components/data-table/pagination/Pagination.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { TcolorScheme } from '../../../experiments/color-scheme'\nimport { Pagination as PaginationComponent } from '../../pagination'\nimport { Text } from '../../text'\nimport { AsyncDataState } from '../DataTable.types'\nimport { useDataTable } from '../DataTableContext'\n\nconst StyledNav = styled('nav', {\n  display: 'flex',\n  flexDirection: 'column',\n  justifyContent: 'space-between',\n  alignItems: 'center',\n  fontVariantNumeric: 'tabular-nums',\n  flexWrap: 'wrap',\n  width: '100%',\n  gap: '$4',\n  mt: '$4',\n  '@md': {\n    flexDirection: 'row'\n  }\n})\n\ntype PaginationProps = React.ComponentProps<typeof StyledNav> & {\n  colorScheme?: TcolorScheme\n}\n\n/** Applies pagination to parent DataTableProvider and renders UI to switch pages etc */\nexport const Pagination = ({ colorScheme, ...props }: PaginationProps) => {\n  const {\n    applyPagination,\n    getState,\n    getRowModel,\n    getPageCount,\n    setPageIndex,\n    getTotalRows,\n    asyncDataState\n  } = useDataTable()\n\n  React.useEffect(() => {\n    applyPagination()\n  }, [applyPagination])\n\n  const { pagination: paginationState } = getState()\n  const isPending = asyncDataState === AsyncDataState.PENDING\n  const isEmpty = !isPending && getTotalRows() === 0\n\n  // Show pagination only if total pages are more than 1\n  const showPagination = getPageCount() > 1\n\n  if (isEmpty || !showPagination) return null\n\n  const recordsCountFrom =\n    paginationState.pageIndex * paginationState.pageSize + 1\n  const recordsCountTo = recordsCountFrom + getRowModel().rows.length - 1\n\n  //indexing for the pagination component is 1 based\n  const setPage = (index: number) => {\n    setPageIndex(index - 1)\n  }\n\n  return (\n    <StyledNav {...props}>\n      <Text size=\"sm\">\n        {`${recordsCountFrom.toString()} - ${recordsCountTo.toString()} of ${getTotalRows()} items`}\n      </Text>\n      <PaginationComponent\n        colorScheme={colorScheme}\n        selectedPage={paginationState.pageIndex + 1}\n        pagesCount={getPageCount()}\n        onSelectedPageChange={setPage}\n      />\n    </StyledNav>\n  )\n}\n\nPagination.displayName = 'Pagination'\n"],"names":["StyledNav","styled","Pagination","colorScheme","props","applyPagination","getState","getRowModel","getPageCount","setPageIndex","getTotalRows","asyncDataState","useDataTable","React","paginationState","isEmpty","AsyncDataState","showPagination","recordsCountFrom","recordsCountTo","setPage","index","Text","PaginationComponent"],"mappings":"yRAUA,MAAMA,EAAYC,EAAO,MAAO,CAC9B,QAAS,OACT,cAAe,SACf,eAAgB,gBAChB,WAAY,SACZ,mBAAoB,eACpB,SAAU,OACV,MAAO,OACP,IAAK,KACL,GAAI,KACJ,MAAO,CACL,cAAe,KACjB,CACF,CAAC,EAOYC,EAAa,CAAC,CAAE,YAAAC,KAAgBC,CAAM,IAAuB,CACxE,KAAM,CACJ,gBAAAC,EACA,SAAAC,EACA,YAAAC,EACA,aAAAC,EACA,aAAAC,EACA,aAAAC,EACA,eAAAC,CACF,EAAIC,IAEJC,EAAM,UAAU,IAAM,CACpBR,GACF,EAAG,CAACA,CAAe,CAAC,EAEpB,KAAM,CAAE,WAAYS,CAAgB,EAAIR,EAAS,EAE3CS,EADYJ,IAAmBK,EAAe,SACtBN,MAAmB,EAG3CO,EAAiBT,IAAiB,EAExC,GAAIO,GAAW,CAACE,EAAgB,OAAO,KAEvC,MAAMC,EACJJ,EAAgB,UAAYA,EAAgB,SAAW,EACnDK,EAAiBD,EAAmBX,EAAY,EAAE,KAAK,OAAS,EAGhEa,EAAWC,GAAkB,CACjCZ,EAAaY,EAAQ,CAAC,CACxB,EAEA,OACER,EAAA,cAACb,EAAA,CAAW,GAAGI,GACbS,EAAA,cAACS,EAAA,CAAK,KAAK,MACR,GAAGJ,EAAiB,gBAAgBC,EAAe,iBAAiBT,EACvE,SAAA,EACAG,EAAA,cAACU,EAAA,CACC,YAAapB,EACb,aAAcW,EAAgB,UAAY,EAC1C,WAAYN,EAAAA,EACZ,qBAAsBY,CAAAA,CACxB,CACF,CAEJ,EAEAlB,EAAW,YAAc"}
+{"version":3,"file":"Pagination.js","sources":["../../../../src/components/data-table/pagination/Pagination.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { TcolorScheme } from '../../../experiments/color-scheme'\nimport { Pagination as PaginationComponent } from '../../pagination'\nimport { Text } from '../../text'\nimport { AsyncDataState } from '../DataTable.types'\nimport { useDataTable } from '../DataTableContext'\n\nconst StyledNav = styled('nav', {\n  base: [\n    'flex',\n    'flex-col',\n    'justify-between',\n    'items-center',\n    'tabular-nums',\n    'flex-wrap',\n    'w-full',\n    'gap-4',\n    'mt-4',\n    'md:flex-row'\n  ]\n})\n\ntype PaginationProps = React.ComponentProps<typeof StyledNav> & {\n  colorScheme?: TcolorScheme\n}\n\n/** Applies pagination to parent DataTableProvider and renders UI to switch pages etc */\nexport const Pagination = ({ colorScheme, ...props }: PaginationProps) => {\n  const {\n    applyPagination,\n    getState,\n    getRowModel,\n    getPageCount,\n    setPageIndex,\n    getTotalRows,\n    asyncDataState\n  } = useDataTable()\n\n  React.useEffect(() => {\n    applyPagination()\n  }, [applyPagination])\n\n  const { pagination: paginationState } = getState()\n  const isPending = asyncDataState === AsyncDataState.PENDING\n  const isEmpty = !isPending && getTotalRows() === 0\n\n  // Show pagination only if total pages are more than 1\n  const showPagination = getPageCount() > 1\n\n  if (isEmpty || !showPagination) return null\n\n  const recordsCountFrom =\n    paginationState.pageIndex * paginationState.pageSize + 1\n  const recordsCountTo = recordsCountFrom + getRowModel().rows.length - 1\n\n  //indexing for the pagination component is 1 based\n  const setPage = (index: number) => {\n    setPageIndex(index - 1)\n  }\n\n  return (\n    <StyledNav {...props}>\n      <Text size=\"sm\">\n        {`${recordsCountFrom.toString()} - ${recordsCountTo.toString()} of ${getTotalRows()} items`}\n      </Text>\n      <PaginationComponent\n        colorScheme={colorScheme}\n        selectedPage={paginationState.pageIndex + 1}\n        pagesCount={getPageCount()}\n        onSelectedPageChange={setPage}\n      />\n    </StyledNav>\n  )\n}\n\nPagination.displayName = 'Pagination'\n"],"names":["StyledNav","styled","Pagination","colorScheme","props","applyPagination","getState","getRowModel","getPageCount","setPageIndex","getTotalRows","asyncDataState","useDataTable","React","paginationState","isEmpty","AsyncDataState","showPagination","recordsCountFrom","recordsCountTo","setPage","index","Text","PaginationComponent"],"mappings":"uRAUA,MAAMA,EAAYC,EAAO,MAAO,CAC9B,KAAM,CACJ,OACA,WACA,kBACA,eACA,eACA,YACA,SACA,QACA,OACA,aACF,CACF,CAAC,EAOYC,EAAa,CAAC,CAAE,YAAAC,EAAa,GAAGC,CAAM,IAAuB,CACxE,KAAM,CACJ,gBAAAC,EACA,SAAAC,EACA,YAAAC,EACA,aAAAC,EACA,aAAAC,EACA,aAAAC,EACA,eAAAC,CACF,EAAIC,IAEJC,EAAM,UAAU,IAAM,CACpBR,EACF,CAAA,EAAG,CAACA,CAAe,CAAC,EAEpB,KAAM,CAAE,WAAYS,CAAgB,EAAIR,EAAAA,EAElCS,EADYJ,IAAmBK,EAAe,SACtBN,EAAa,IAAM,EAG3CO,EAAiBT,EAAiB,EAAA,EAExC,GAAIO,GAAW,CAACE,EAAgB,OAAO,KAEvC,MAAMC,EACJJ,EAAgB,UAAYA,EAAgB,SAAW,EACnDK,EAAiBD,EAAmBX,EAAY,EAAE,KAAK,OAAS,EAGhEa,EAAWC,GAAkB,CACjCZ,EAAaY,EAAQ,CAAC,CACxB,EAEA,OACER,EAAA,cAACb,EAAA,CAAW,GAAGI,GACbS,EAAA,cAACS,EAAA,CAAK,KAAK,MACR,GAAG,OAAAJ,EAAiB,SAAS,EAAC,OAAM,OAAAC,EAAe,SAAU,EAAA,MAAA,EAAO,OAAAT,EAAa,EAAC,QACrF,CAAA,EACAG,EAAA,cAACU,EAAA,CACC,YAAapB,EACb,aAAcW,EAAgB,UAAY,EAC1C,WAAYN,IACZ,qBAAsBY,CAAAA,CACxB,CACF,CAEJ,EAEAlB,EAAW,YAAc"}

package/dist/components/data-table/useSorting.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSorting.js","sources":["../../../src/components/data-table/useSorting.ts"],"sourcesContent":["import type { SortingState } from '@tanstack/react-table'\nimport React from 'react'\n\nimport { TDefaultSort } from './DataTable.types'\nexport const useSortByColumn = (defaultSort: TDefaultSort | undefined) => {\n  const [isSortable, setIsSortable] = React.useState<boolean>(false)\n\n  const [sorting, setSorting] = React.useState<SortingState>(\n    defaultSort\n      ? [\n          {\n            id: defaultSort.column,\n            desc: defaultSort.direction === 'desc'\n          }\n        ]\n      : []\n  )\n\n  return { isSortable, setIsSortable, sorting, setSorting }\n}\n"],"names":["useSortByColumn","defaultSort","isSortable","setIsSortable","React","sorting","setSorting"],"mappings":"qBAIa,MAAAA,EAAmBC,GAA0C,CACxE,KAAM,CAACC,EAAYC,CAAa,EAAIC,EAAM,SAAkB,EAAK,EAE3D,CAACC,EAASC,CAAU,EAAIF,EAAM,SAClCH,EACI,CACE,CACE,GAAIA,EAAY,OAChB,KAAMA,EAAY,YAAc,MAClC,CACF,EACA,EACN,EAEA,MAAO,CAAE,WAAAC,EAAY,cAAAC,EAAe,QAAAE,EAAS,WAAAC,CAAW,CAC1D"}
+{"version":3,"file":"useSorting.js","sources":["../../../src/components/data-table/useSorting.ts"],"sourcesContent":["import type { SortingState } from '@tanstack/react-table'\nimport React from 'react'\n\nimport { TDefaultSort } from './DataTable.types'\n\nexport const useSortByColumn = (defaultSort: TDefaultSort | undefined) => {\n  const [isSortable, setIsSortable] = React.useState<boolean>(false)\n\n  const [sorting, setSorting] = React.useState<SortingState>(\n    defaultSort\n      ? [\n          {\n            id: defaultSort.column,\n            desc: defaultSort.direction === 'desc'\n          }\n        ]\n      : []\n  )\n\n  return { isSortable, setIsSortable, sorting, setSorting }\n}\n"],"names":["useSortByColumn","defaultSort","isSortable","setIsSortable","React","sorting","setSorting"],"mappings":"qBAKa,MAAAA,EAAmBC,GAA0C,CACxE,KAAM,CAACC,EAAYC,CAAa,EAAIC,EAAM,SAAkB,EAAK,EAE3D,CAACC,EAASC,CAAU,EAAIF,EAAM,SAClCH,EACI,CACE,CACE,GAAIA,EAAY,OAChB,KAAMA,EAAY,YAAc,MAClC,CACF,EACA,EACN,EAEA,MAAO,CAAE,WAAAC,EAAY,cAAAC,EAAe,QAAAE,EAAS,WAAAC,CAAW,CAC1D"}

package/dist/components/date-field/DateField.js

@@ -1,2 +1,2 @@
-import*as i from"react";import{useFormContext as F}from"react-hook-form";import{DateInput as b}from"../date-input/DateInput.js";import{FieldWrapper as g}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as v}from"../form/useFieldError.js";import"../form/useFormCustomContext.js";const p=({css:m,hideLabel:l,label:d,name:e,validation:r,prompt:n,description:s,appearance:t,...c})=>{const{register:o,trigger:f}=F(),{error:a}=v(e),u=r?o(r):o;return i.createElement(g,{css:m,description:s,error:a,fieldId:e,hideLabel:l,label:d,prompt:n,required:Boolean(r==null?void 0:r.required),appearance:t},i.createElement(b,{id:e,name:e,ref:u,appearance:t,...a&&{state:"error"},...c,revalidate:f}))};p.displayName="DateField";export{p as DateField};
+import*as o from"react";import{useFormContext as F}from"react-hook-form";import{DateInput as b}from"../date-input/DateInput.js";import{FieldWrapper as g}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as D}from"../form/useFieldError.js";import"../form/useFormCustomContext.js";const p=({className:m,hideLabel:l,label:d,name:e,validation:r,prompt:n,description:s,appearance:a,...c})=>{const{register:t,trigger:f}=F(),{error:i}=D(e),u=r?t(r):t;return o.createElement(g,{className:m,description:s,error:i,fieldId:e,hideLabel:l,label:d,prompt:n,required:!!(r!=null&&r.required),appearance:a},o.createElement(b,{id:e,name:e,ref:u,appearance:a,...i&&{state:"error"},...c,revalidate:f}))};p.displayName="DateField";export{p as DateField};
 //# sourceMappingURL=DateField.js.map

package/dist/components/date-field/DateField.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateField.js","sources":["../../../src/components/date-field/DateField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport { DateInput, DateInputProps } from '~/components/date-input'\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper'\nimport { useFieldError } from '~/components/form'\n\ntype DateFieldProps = DateInputProps & FieldElementWrapperProps\n\nexport const DateField = ({\n  css,\n  hideLabel,\n  label,\n  name,\n  validation,\n  prompt,\n  description,\n  appearance,\n  ...remainingProps\n}: DateFieldProps) => {\n  const { register, trigger } = useFormContext()\n  const { error } = useFieldError(name)\n  const ref = validation ? register(validation) : register\n\n  return (\n    <FieldWrapper\n      css={css}\n      description={description}\n      error={error}\n      fieldId={name}\n      hideLabel={hideLabel}\n      label={label}\n      prompt={prompt}\n      required={Boolean(validation?.required)}\n      appearance={appearance}\n    >\n      <DateInput\n        id={name}\n        name={name}\n        ref={ref}\n        appearance={appearance}\n        {...(error && { state: 'error' })}\n        {...remainingProps}\n        revalidate={trigger}\n      />\n    </FieldWrapper>\n  )\n}\n\nDateField.displayName = 'DateField'\n"],"names":["DateField","css","hideLabel","label","name","validation","prompt","description","appearance","remainingProps","register","trigger","useFormContext","error","useFieldError","ref","React","FieldWrapper","DateInput"],"mappings":"wWAYa,MAAAA,EAAY,CAAC,CACxB,IAAAC,EACA,UAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,OAAAC,EACA,YAAAC,EACA,WAAAC,KACGC,CACL,IAAsB,CACpB,KAAM,CAAE,SAAAC,EAAU,QAAAC,CAAQ,EAAIC,EAAe,EACvC,CAAE,MAAAC,CAAM,EAAIC,EAAcV,CAAI,EAC9BW,EAAMV,EAAaK,EAASL,CAAU,EAAIK,EAEhD,OACEM,EAAA,cAACC,EAAA,CACC,IAAKhB,EACL,YAAaM,EACb,MAAOM,EACP,QAAST,EACT,UAAWF,EACX,MAAOC,EACP,OAAQG,EACR,SAAU,QAAQD,GAAA,KAAA,OAAAA,EAAY,QAAQ,EACtC,WAAYG,CAAAA,EAEZQ,EAAA,cAACE,EAAA,CACC,GAAId,EACJ,KAAMA,EACN,IAAKW,EACL,WAAYP,EACX,GAAIK,GAAS,CAAE,MAAO,OAAQ,EAC9B,GAAGJ,EACJ,WAAYE,CAAAA,CACd,CACF,CAEJ,EAEAX,EAAU,YAAc"}
+{"version":3,"file":"DateField.js","sources":["../../../src/components/date-field/DateField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport { DateInput, DateInputProps } from '~/components/date-input'\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper'\nimport { useFieldError } from '~/components/form'\n\ntype DateFieldProps = DateInputProps & FieldElementWrapperProps\n\nexport const DateField = ({\n  className,\n  hideLabel,\n  label,\n  name,\n  validation,\n  prompt,\n  description,\n  appearance,\n  ...remainingProps\n}: DateFieldProps) => {\n  const { register, trigger } = useFormContext()\n  const { error } = useFieldError(name)\n  const ref = validation ? register(validation) : register\n\n  return (\n    <FieldWrapper\n      className={className}\n      description={description}\n      error={error}\n      fieldId={name}\n      hideLabel={hideLabel}\n      label={label}\n      prompt={prompt}\n      required={Boolean(validation?.required)}\n      appearance={appearance}\n    >\n      <DateInput\n        id={name}\n        name={name}\n        ref={ref}\n        appearance={appearance}\n        {...(error && { state: 'error' })}\n        {...remainingProps}\n        revalidate={trigger}\n      />\n    </FieldWrapper>\n  )\n}\n\nDateField.displayName = 'DateField'\n"],"names":["DateField","className","hideLabel","label","name","validation","prompt","description","appearance","remainingProps","register","trigger","useFormContext","error","useFieldError","ref","React","FieldWrapper","DateInput"],"mappings":"wWAYa,MAAAA,EAAY,CAAC,CACxB,UAAAC,EACA,UAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,OAAAC,EACA,YAAAC,EACA,WAAAC,EACA,GAAGC,CACL,IAAsB,CACpB,KAAM,CAAE,SAAAC,EAAU,QAAAC,CAAQ,EAAIC,EAAAA,EACxB,CAAE,MAAAC,CAAM,EAAIC,EAAcV,CAAI,EAC9BW,EAAMV,EAAaK,EAASL,CAAU,EAAIK,EAEhD,OACEM,EAAA,cAACC,EAAA,CACC,UAAWhB,EACX,YAAaM,EACb,MAAOM,EACP,QAAST,EACT,UAAWF,EACX,MAAOC,EACP,OAAQG,EACR,SAAU,CAAQD,EAAAA,GAAA,MAAAA,EAAY,UAC9B,WAAYG,CAAAA,EAEZQ,EAAA,cAACE,EAAA,CACC,GAAId,EACJ,KAAMA,EACN,IAAKW,EACL,WAAYP,EACX,GAAIK,GAAS,CAAE,MAAO,OAAQ,EAC9B,GAAGJ,EACJ,WAAYE,CAAAA,CACd,CACF,CAEJ,EAEAX,EAAU,YAAc"}

package/dist/components/date-input/DateInput.js

@@ -1,2 +1,2 @@
-import{CalendarEvent as B}from"@atom-learning/icons";import p from"dayjs";import M from"dayjs/plugin/customParseFormat";import*as e from"react";import{DIALOG_Z_INDEX as P}from"../../constants/zIndices.js";import"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import"../../utilities/style/keyframe-animations.js";import{getFieldIconSize as H}from"../../utilities/style/get-icon-size.js";import{useCallbackRefState as $}from"../../utilities/hooks/useCallbackRef.js";import{ActionIcon as U}from"../action-icon/ActionIcon.js";import{Box as V}from"../box/Box.js";import{Calendar as W}from"../calendar/Calendar.js";import{DEFAULT_LABELS as Y}from"../calendar/constants.js";import{Icon as j}from"../icon/Icon.js";import{Input as G}from"../input/Input.js";import{Popover as c}from"../popover/Popover.js";import{DEFAULT_DATE_FORMAT as C}from"./constants.js";p.extend(M);const I=(n,o=C)=>n?p(n).format(o):"",w=e.forwardRef(({initialDate:n,dateFormat:o=C,firstDayOfWeek:y=1,disabled:f,monthNames:T,weekdayNames:k,size:d="md",labels:A,revalidate:l,onChange:u,minDate:O,maxDate:x,...z},F)=>{const[s,D]=e.useState(n?p(n).toDate():void 0),[m,S]=$();e.useImperativeHandle(F,()=>m);const L=I(s,o),N=e.useCallback(t=>{const r=t.target.value,a=p(r,o),i=a.isValid()?a.toDate():void 0;D(i),u==null||u(i)},[o,u]),E=e.useCallback(t=>{D(t),(()=>{var r;if(!m)return;const a=(r=Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype,"value"))==null?void 0:r.set;a==null||a.call(m,I(t,o));const i=new Event("input",{bubbles:!0});m.dispatchEvent(i)})()},[o,m]),b={...Y,...A},[R,v]=e.useState(!1),h=e.useRef(null),g=e.useRef(null),_=e.useMemo(()=>H(d),[d]);return e.createElement(V,{css:{position:"relative",height:"max-content"}},e.createElement(G,{name:"date",disabled:f,size:d,...z,onChange:N,ref:S,defaultValue:L}),e.createElement(c,{modal:!0,open:R,onOpenChange:v},e.createElement(c.Trigger,{asChild:!0},e.createElement(U,{css:{position:"absolute",top:"50%",transform:"translateY(-50%)",right:"0"},disabled:f,label:b.open,size:_,theme:"neutral",hasTooltip:!1},e.createElement(j,{is:B}))),e.createElement(c.Portal,null,e.createElement(c.Content,{css:{pr:"$sizes$2",zIndex:P},side:"bottom",align:"end",showCloseButton:!1,onOpenAutoFocus:t=>{var r,a;t.preventDefault(),s?(r=g.current)==null||r.focus():(a=h.current)==null||a.focus()}},e.createElement(W,{date:s||new Date,selected:s,onDateSelected:async t=>{v(!1),await E(t.date),l&&l()},setYear:async t=>{await E(t),l&&l()},minDate:O,maxDate:x,refDateToday:h,refDateSelected:g,firstDayOfWeek:y,monthNames:T,weekdayNames:k,labels:b})))))});w.displayName="DateInput";export{w as DateInput};
+import{CalendarEvent as H}from"@atom-learning/icons";import c from"dayjs";import P from"dayjs/plugin/customParseFormat";import*as e from"react";import"../../utilities/css-wrapper/CSSWrapper.js";import{getFieldIconSize as _}from"../../utilities/style/get-icon-size.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import{useCallbackRefState as B}from"../../utilities/hooks/useCallbackRef.js";import{ActionIcon as U}from"../action-icon/ActionIcon.js";import{Calendar as V}from"../calendar/Calendar.js";import{DEFAULT_LABELS as W}from"../calendar/constants.js";import{Icon as j}from"../icon/Icon.js";import{Input as Y}from"../input/Input.js";import{Popover as u}from"../popover/Popover.js";import{DEFAULT_DATE_FORMAT as C}from"./constants.js";c.extend(P);const g=(n,o=C)=>n?c(n).format(o):"",w=e.forwardRef(({initialDate:n,dateFormat:o=C,firstDayOfWeek:I=1,disabled:f,monthNames:N,weekdayNames:T,size:d="md",labels:k,revalidate:m,onChange:p,minDate:A,maxDate:F,...O},S)=>{const[s,D]=e.useState(n?c(n).toDate():void 0),[l,x]=B();e.useImperativeHandle(S,()=>l);const z=g(s,o),L=e.useCallback(t=>{const r=t.target.value,a=c(r,o),i=a.isValid()?a.toDate():void 0;D(i),p==null||p(i)},[o,p]),E=e.useCallback(t=>{D(t),(()=>{var r;if(!l)return;const a=(r=Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype,"value"))==null?void 0:r.set;a==null||a.call(l,g(t,o));const i=new Event("input",{bubbles:!0});l.dispatchEvent(i)})()},[o,l]),b={...W,...k},[R,v]=e.useState(!1),h=e.useRef(null),y=e.useRef(null),M=e.useMemo(()=>_(d),[d]);return e.createElement("div",{className:"relative h-max"},e.createElement(Y,{name:"date",disabled:f,size:d,...O,onChange:L,ref:x,defaultValue:z}),e.createElement(u,{modal:!0,open:R,onOpenChange:v},e.createElement(u.Trigger,{asChild:!0},e.createElement(U,{disabled:f,label:b.open,size:M,theme:"neutral",hasTooltip:!1,className:"absolute top-1/2 right-0 -translate-y-1/2"},e.createElement(j,{is:H}))),e.createElement(u.Portal,null,e.createElement(u.Content,{side:"bottom",align:"end",showCloseButton:!1,onOpenAutoFocus:t=>{var r,a;t.preventDefault(),s?(r=y.current)==null||r.focus():(a=h.current)==null||a.focus()},className:"z-1147483646 pr-6"},e.createElement(V,{date:s||new Date,selected:s,onDateSelected:async t=>{v(!1),await E(t.date),m&&m()},setYear:async t=>{await E(t),m&&m()},minDate:A,maxDate:F,refDateToday:h,refDateSelected:y,firstDayOfWeek:I,monthNames:N,weekdayNames:T,labels:b})))))});w.displayName="DateInput";export{w as DateInput};
 //# sourceMappingURL=DateInput.js.map

package/dist/components/date-input/DateInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateInput.js","sources":["../../../src/components/date-input/DateInput.tsx"],"sourcesContent":["import { CalendarEvent } from '@atom-learning/icons'\nimport dayjs from 'dayjs'\nimport customParseFormat from 'dayjs/plugin/customParseFormat'\nimport type { Props as DayzedInterface } from 'dayzed'\nimport * as React from 'react'\n\nimport { DIALOG_Z_INDEX } from '~/constants/zIndices'\nimport { getFieldIconSize } from '~/utilities'\nimport { useCallbackRefState } from '~/utilities/hooks/useCallbackRef'\n\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Box } from '../box/Box'\nimport { Calendar, CalendarTranslationProps } from '../calendar/Calendar'\nimport { DEFAULT_LABELS } from '../calendar/constants'\nimport { Icon } from '../icon/Icon'\nimport { Input } from '../input/Input'\nimport { Popover } from '../popover/Popover'\nimport { DEFAULT_DATE_FORMAT } from './constants'\ndayjs.extend(customParseFormat)\n\nexport type DateInputProps = Omit<DayzedInterface, 'onDateSelected'> &\n  CalendarTranslationProps & {\n    initialDate?: Date\n    dateFormat?: string\n    disabled?: boolean\n    size?: 'sm' | 'md' | 'lg'\n    revalidate?: () => Promise<boolean>\n    onChange?: (value?: Date) => void\n  }\n\nconst formatDateToString = (date?: Date, dateFormat = DEFAULT_DATE_FORMAT) =>\n  date ? dayjs(date).format(dateFormat) : ''\n\nexport const DateInput: React.ForwardRefExoticComponent<DateInputProps> =\n  React.forwardRef(\n    (\n      {\n        initialDate,\n        dateFormat = DEFAULT_DATE_FORMAT,\n        firstDayOfWeek = 1,\n        disabled,\n        monthNames,\n        weekdayNames,\n        size = 'md',\n        labels,\n        revalidate,\n        onChange,\n        minDate,\n        maxDate,\n        ...remainingProps\n      },\n      ref\n    ) => {\n      const [date, setDate] = React.useState(\n        initialDate ? dayjs(initialDate).toDate() : undefined\n      )\n\n      const [inputElRef, setInputElRef] = useCallbackRefState()\n      React.useImperativeHandle(ref, () => inputElRef as HTMLInputElement)\n\n      const dateString = formatDateToString(date, dateFormat)\n\n      const handleInputChange = React.useCallback(\n        (event) => {\n          const newDateString = event.target.value\n          const parsedInputDate = dayjs(newDateString, dateFormat)\n          const newDate = parsedInputDate.isValid()\n            ? parsedInputDate.toDate()\n            : undefined\n          setDate(newDate)\n          onChange?.(newDate)\n        },\n        [dateFormat, onChange]\n      )\n\n      const handleCalendarChange = React.useCallback(\n        (newDate) => {\n          setDate(newDate)\n\n          const mirrorChangeToInputElement = () => {\n            if (!inputElRef) return\n\n            // Call the `set` function on the input value directly to mirror the change.\n            // Props to: https://stackoverflow.com/a/46012210\n            const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n              window.HTMLInputElement.prototype,\n              'value'\n            )?.set\n            nativeInputValueSetter?.call(\n              inputElRef,\n              formatDateToString(newDate, dateFormat)\n            )\n            const event = new Event('input', { bubbles: true })\n            inputElRef.dispatchEvent(event)\n          }\n          mirrorChangeToInputElement()\n        },\n        [dateFormat, inputElRef]\n      )\n\n      const updatedLabels = {\n        ...DEFAULT_LABELS,\n        ...labels\n      }\n\n      const [calendarOpen, setCalendarOpen] = React.useState(false)\n\n      const refDateToday = React.useRef<HTMLButtonElement>(null)\n      const refDateSelected = React.useRef<HTMLButtonElement>(null)\n\n      const iconSize = React.useMemo(() => getFieldIconSize(size), [size])\n\n      return (\n        <Box css={{ position: 'relative', height: 'max-content' }}>\n          <Input\n            name=\"date\"\n            disabled={disabled}\n            size={size}\n            {...remainingProps}\n            onChange={handleInputChange}\n            ref={setInputElRef}\n            defaultValue={dateString}\n          />\n          <Popover modal open={calendarOpen} onOpenChange={setCalendarOpen}>\n            <Popover.Trigger asChild>\n              <ActionIcon\n                css={{\n                  position: 'absolute',\n                  top: '50%',\n                  transform: 'translateY(-50%)',\n                  right: '0'\n                }}\n                disabled={disabled}\n                label={updatedLabels.open}\n                size={iconSize}\n                theme=\"neutral\"\n                hasTooltip={false}\n              >\n                <Icon is={CalendarEvent} />\n              </ActionIcon>\n            </Popover.Trigger>\n            <Popover.Portal>\n              <Popover.Content\n                css={{ pr: '$sizes$2', zIndex: DIALOG_Z_INDEX }}\n                side=\"bottom\"\n                align=\"end\"\n                showCloseButton={false}\n                onOpenAutoFocus={(e) => {\n                  e.preventDefault()\n                  if (date) {\n                    refDateSelected.current?.focus()\n                  } else {\n                    refDateToday.current?.focus()\n                  }\n                }}\n              >\n                <Calendar\n                  date={date || new Date()}\n                  selected={date}\n                  onDateSelected={async (date) => {\n                    setCalendarOpen(false)\n                    await handleCalendarChange(date.date)\n                    if (revalidate) revalidate()\n                  }}\n                  setYear={async (date) => {\n                    await handleCalendarChange(date)\n                    if (revalidate) revalidate()\n                  }}\n                  minDate={minDate}\n                  maxDate={maxDate}\n                  refDateToday={refDateToday}\n                  refDateSelected={refDateSelected}\n                  firstDayOfWeek={firstDayOfWeek}\n                  monthNames={monthNames}\n                  weekdayNames={weekdayNames}\n                  labels={updatedLabels}\n                />\n              </Popover.Content>\n            </Popover.Portal>\n          </Popover>\n        </Box>\n      )\n    }\n  )\n\nDateInput.displayName = 'DateInput'\n"],"names":["dayjs","customParseFormat","formatDateToString","date","dateFormat","DEFAULT_DATE_FORMAT","DateInput","React","initialDate","firstDayOfWeek","disabled","monthNames","weekdayNames","size","labels","revalidate","onChange","minDate","maxDate","remainingProps","ref","setDate","inputElRef","setInputElRef","useCallbackRefState","dateString","handleInputChange","event","newDateString","parsedInputDate","newDate","handleCalendarChange","_a","nativeInputValueSetter","updatedLabels","DEFAULT_LABELS","calendarOpen","setCalendarOpen","refDateToday","refDateSelected","iconSize","getFieldIconSize","Box","Input","Popover","ActionIcon","Icon","CalendarEvent","DIALOG_Z_INDEX","e","_b","Calendar"],"mappings":"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"}
+{"version":3,"file":"DateInput.js","sources":["../../../src/components/date-input/DateInput.tsx"],"sourcesContent":["import { CalendarEvent } from '@atom-learning/icons'\nimport dayjs from 'dayjs'\nimport customParseFormat from 'dayjs/plugin/customParseFormat'\nimport type { Props as DayzedInterface } from 'dayzed'\nimport * as React from 'react'\n\nimport { getFieldIconSize } from '~/utilities'\nimport { useCallbackRefState } from '~/utilities/hooks/useCallbackRef'\n\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Calendar, CalendarTranslationProps } from '../calendar/Calendar'\nimport { DEFAULT_LABELS } from '../calendar/constants'\nimport { Icon } from '../icon/Icon'\nimport { Input } from '../input/Input'\nimport { Popover } from '../popover/Popover'\nimport { DEFAULT_DATE_FORMAT } from './constants'\n\ndayjs.extend(customParseFormat)\n\nexport type DateInputProps = Omit<DayzedInterface, 'onDateSelected'> &\n  CalendarTranslationProps & {\n    initialDate?: Date\n    dateFormat?: string\n    disabled?: boolean\n    size?: 'sm' | 'md' | 'lg'\n    revalidate?: () => Promise<boolean>\n    onChange?: (value?: Date) => void\n  }\n\nconst formatDateToString = (date?: Date, dateFormat = DEFAULT_DATE_FORMAT) =>\n  date ? dayjs(date).format(dateFormat) : ''\n\nexport const DateInput = React.forwardRef<HTMLInputElement, DateInputProps>(\n  (\n    {\n      initialDate,\n      dateFormat = DEFAULT_DATE_FORMAT,\n      firstDayOfWeek = 1,\n      disabled,\n      monthNames,\n      weekdayNames,\n      size = 'md',\n      labels,\n      revalidate,\n      onChange,\n      minDate,\n      maxDate,\n      ...remainingProps\n    },\n    ref\n  ) => {\n    const [date, setDate] = React.useState(\n      initialDate ? dayjs(initialDate).toDate() : undefined\n    )\n\n    const [inputElRef, setInputElRef] = useCallbackRefState()\n    React.useImperativeHandle(ref, () => inputElRef as HTMLInputElement)\n\n    const dateString = formatDateToString(date, dateFormat)\n\n    const handleInputChange = React.useCallback(\n      (event) => {\n        const newDateString = event.target.value\n        const parsedInputDate = dayjs(newDateString, dateFormat)\n        const newDate = parsedInputDate.isValid()\n          ? parsedInputDate.toDate()\n          : undefined\n        setDate(newDate)\n        onChange?.(newDate)\n      },\n      [dateFormat, onChange]\n    )\n\n    const handleCalendarChange = React.useCallback(\n      (newDate) => {\n        setDate(newDate)\n\n        const mirrorChangeToInputElement = () => {\n          if (!inputElRef) return\n\n          // Call the `set` function on the input value directly to mirror the change.\n          // Props to: https://stackoverflow.com/a/46012210\n          const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n            window.HTMLInputElement.prototype,\n            'value'\n          )?.set\n          nativeInputValueSetter?.call(\n            inputElRef,\n            formatDateToString(newDate, dateFormat)\n          )\n          const event = new Event('input', { bubbles: true })\n          inputElRef.dispatchEvent(event)\n        }\n        mirrorChangeToInputElement()\n      },\n      [dateFormat, inputElRef]\n    )\n\n    const updatedLabels = {\n      ...DEFAULT_LABELS,\n      ...labels\n    }\n\n    const [calendarOpen, setCalendarOpen] = React.useState(false)\n\n    const refDateToday = React.useRef<HTMLButtonElement>(null)\n    const refDateSelected = React.useRef<HTMLButtonElement>(null)\n\n    const iconSize = React.useMemo(() => getFieldIconSize(size), [size])\n\n    return (\n      <div className=\"relative h-max\">\n        <Input\n          name=\"date\"\n          disabled={disabled}\n          size={size}\n          {...remainingProps}\n          onChange={handleInputChange}\n          ref={setInputElRef}\n          defaultValue={dateString}\n        />\n        <Popover modal open={calendarOpen} onOpenChange={setCalendarOpen}>\n          <Popover.Trigger asChild>\n            <ActionIcon\n              disabled={disabled}\n              label={updatedLabels.open}\n              size={iconSize}\n              theme=\"neutral\"\n              hasTooltip={false}\n              className=\"absolute top-1/2 right-0 -translate-y-1/2\"\n            >\n              <Icon is={CalendarEvent} />\n            </ActionIcon>\n          </Popover.Trigger>\n          <Popover.Portal>\n            <Popover.Content\n              side=\"bottom\"\n              align=\"end\"\n              showCloseButton={false}\n              onOpenAutoFocus={(e) => {\n                e.preventDefault()\n                if (date) {\n                  refDateSelected.current?.focus()\n                } else {\n                  refDateToday.current?.focus()\n                }\n              }}\n              className=\"z-1147483646 pr-6\"\n            >\n              <Calendar\n                date={date || new Date()}\n                selected={date}\n                onDateSelected={async (date) => {\n                  setCalendarOpen(false)\n                  await handleCalendarChange(date.date)\n                  if (revalidate) revalidate()\n                }}\n                setYear={async (date) => {\n                  await handleCalendarChange(date)\n                  if (revalidate) revalidate()\n                }}\n                minDate={minDate}\n                maxDate={maxDate}\n                refDateToday={refDateToday}\n                refDateSelected={refDateSelected}\n                firstDayOfWeek={firstDayOfWeek}\n                monthNames={monthNames}\n                weekdayNames={weekdayNames}\n                labels={updatedLabels}\n              />\n            </Popover.Content>\n          </Popover.Portal>\n        </Popover>\n      </div>\n    )\n  }\n)\n\nDateInput.displayName = 'DateInput'\n"],"names":["dayjs","customParseFormat","formatDateToString","date","dateFormat","DEFAULT_DATE_FORMAT","DateInput","React","initialDate","firstDayOfWeek","disabled","monthNames","weekdayNames","size","labels","revalidate","onChange","minDate","maxDate","remainingProps","ref","setDate","inputElRef","setInputElRef","useCallbackRefState","dateString","handleInputChange","event","newDateString","parsedInputDate","newDate","handleCalendarChange","_a","nativeInputValueSetter","updatedLabels","DEFAULT_LABELS","calendarOpen","setCalendarOpen","refDateToday","refDateSelected","iconSize","getFieldIconSize","Input","Popover","ActionIcon","Icon","CalendarEvent","e","_b","Calendar"],"mappings":"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"}

package/dist/components/dialog/Dialog.js

@@ -1,2 +1,2 @@
-import{Root as i,Description as r,Title as t,Trigger as e}from"@radix-ui/react-dialog";import{styled as g}from"../../stitches.js";import{DialogBackground as m}from"./DialogBackground.js";import{DialogClose as a}from"./DialogClose.js";import{DialogContent as l}from"./DialogContent.js";import{DialogFooter as n}from"./DialogFooter.js";import{DialogHeading as p}from"./DialogHeading.js";const s=g(i,{}),o=Object.assign(s,{Background:m,Close:a,Content:l,Heading:p,Footer:n,Description:r,Title:t,Trigger:e});o.displayName="Dialog";export{o as Dialog};
+import{Root as i,Description as r,Title as t,Trigger as e}from"@radix-ui/react-dialog";import{DialogBackground as g}from"./DialogBackground.js";import{DialogClose as a}from"./DialogClose.js";import{DialogContent as m}from"./DialogContent.js";import{DialogFooter as l}from"./DialogFooter.js";import{DialogHeading as n}from"./DialogHeading.js";const o=Object.assign(i,{Background:g,Close:a,Content:m,Heading:n,Footer:l,Description:r,Title:t,Trigger:e});o.displayName="Dialog";export{o as Dialog};
 //# sourceMappingURL=Dialog.js.map

package/dist/components/dialog/Dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.js","sources":["../../../src/components/dialog/Dialog.tsx"],"sourcesContent":["import { Description, Root, Title, Trigger } from '@radix-ui/react-dialog'\n\nimport { styled } from '~/stitches'\n\nimport { DialogBackground } from './DialogBackground'\nimport { DialogClose } from './DialogClose'\nimport { DialogContent } from './DialogContent'\nimport { DialogFooter } from './DialogFooter'\nimport { DialogHeading } from './DialogHeading'\n\nconst StyledDialog = styled(Root, {})\n\nexport const Dialog = Object.assign(StyledDialog, {\n  Background: DialogBackground,\n  Close: DialogClose,\n  Content: DialogContent,\n  Heading: DialogHeading,\n  Footer: DialogFooter,\n\n  Description: Description,\n  Title: Title,\n  Trigger: Trigger\n})\n\nDialog.displayName = 'Dialog'\n"],"names":["StyledDialog","styled","Root","Dialog","DialogBackground","DialogClose","DialogContent","DialogHeading","DialogFooter","Description","Title","Trigger"],"mappings":"iYAUA,MAAMA,EAAeC,EAAOC,EAAM,CAAA,CAAE,EAEvBC,EAAS,OAAO,OAAOH,EAAc,CAChD,WAAYI,EACZ,MAAOC,EACP,QAASC,EACT,QAASC,EACT,OAAQC,EAER,YAAaC,EACb,MAAOC,EACP,QAASC,CACX,CAAC,EAEDR,EAAO,YAAc"}
+{"version":3,"file":"Dialog.js","sources":["../../../src/components/dialog/Dialog.tsx"],"sourcesContent":["import { Description, Root, Title, Trigger } from '@radix-ui/react-dialog'\n\nimport { styled } from '~/styled'\n\nimport { DialogBackground } from './DialogBackground'\nimport { DialogClose } from './DialogClose'\nimport { DialogContent } from './DialogContent'\nimport { DialogFooter } from './DialogFooter'\nimport { DialogHeading } from './DialogHeading'\n\nexport const Dialog = Object.assign(Root, {\n  Background: DialogBackground,\n  Close: DialogClose,\n  Content: DialogContent,\n  Heading: DialogHeading,\n  Footer: DialogFooter,\n\n  Description: Description,\n  Title: Title,\n  Trigger: Trigger\n})\n\nDialog.displayName = 'Dialog'\n"],"names":["Dialog","Root","DialogBackground","DialogClose","DialogContent","DialogHeading","DialogFooter","Description","Title","Trigger"],"mappings":"sVAUO,MAAMA,EAAS,OAAO,OAAOC,EAAM,CACxC,WAAYC,EACZ,MAAOC,EACP,QAASC,EACT,QAASC,EACT,OAAQC,EAER,YAAaC,EACb,MAAOC,EACP,QAASC,CACX,CAAC,EAEDT,EAAO,YAAc"}

package/dist/components/dialog/DialogBackground.js

@@ -1,2 +1,2 @@
-import{styled as o}from"../../stitches.js";import{Box as t}from"../box/Box.js";const r=o(t,{width:"100vw",height:"100vh"});export{r as DialogBackground};
+import{styled as e}from"../../styled.js";const o=e("div",{base:["w-screen","h-screen"]});export{o as DialogBackground};
 //# sourceMappingURL=DialogBackground.js.map

package/dist/components/dialog/DialogBackground.js.map

@@ -1 +1 @@
-{"version":3,"file":"DialogBackground.js","sources":["../../../src/components/dialog/DialogBackground.tsx"],"sourcesContent":["import { styled } from '~/stitches'\n\nimport { Box } from '../box'\n\nexport const DialogBackground = styled(Box, { width: '100vw', height: '100vh' })\n"],"names":["DialogBackground","styled","Box"],"mappings":"+EAIO,MAAMA,EAAmBC,EAAOC,EAAK,CAAE,MAAO,QAAS,OAAQ,OAAQ,CAAC"}
+{"version":3,"file":"DialogBackground.js","sources":["../../../src/components/dialog/DialogBackground.tsx"],"sourcesContent":["import { styled } from '~/styled'\n\nexport const DialogBackground = styled('div', {\n  base: ['w-screen', 'h-screen']\n})\n"],"names":["DialogBackground","styled"],"mappings":"yCAEO,MAAMA,EAAmBC,EAAO,MAAO,CAC5C,KAAM,CAAC,WAAY,UAAU,CAC/B,CAAC"}

package/dist/components/dialog/DialogClose.js

@@ -1,2 +1,2 @@
-import{Close as o}from"@radix-ui/react-dialog";import{styled as r}from"../../stitches.js";const t=r(o,{});export{t as DialogClose};
+import{Close as o}from"@radix-ui/react-dialog";const e=o;export{e as DialogClose};
 //# sourceMappingURL=DialogClose.js.map

package/dist/components/dialog/DialogClose.js.map

@@ -1 +1 @@
-{"version":3,"file":"DialogClose.js","sources":["../../../src/components/dialog/DialogClose.tsx"],"sourcesContent":["import { Close } from '@radix-ui/react-dialog'\n\nimport { styled } from '~/stitches'\n\nexport const DialogClose = styled(Close, {})\n"],"names":["DialogClose","styled","Close"],"mappings":"0FAIO,MAAMA,EAAcC,EAAOC,EAAO,CAAE,CAAA"}
+{"version":3,"file":"DialogClose.js","sources":["../../../src/components/dialog/DialogClose.tsx"],"sourcesContent":["import { Close } from '@radix-ui/react-dialog'\n\nexport const DialogClose = Close\n"],"names":["DialogClose","Close"],"mappings":"+CAEO,MAAMA,EAAcC"}

package/dist/components/dialog/DialogContent.js

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

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

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

package/dist/components/dialog/DialogFooter.js

@@ -1,2 +1,2 @@
-import*as t from"react";import{Flex as r}from"../flex/Flex.js";const s=({css:e,...o})=>t.createElement(r,{justify:"end",gap:3,css:{pt:"$4",...e},...o});export{s as DialogFooter};
+import t from"clsx";import*as m from"react";import{Flex as r}from"../flex/Flex.js";const a=({className:e,...o})=>m.createElement(r,{justify:"end",gap:3,...o,className:t("pt-4",e)});export{a as DialogFooter};
 //# sourceMappingURL=DialogFooter.js.map

package/dist/components/dialog/DialogFooter.js.map

@@ -1 +1 @@
-{"version":3,"file":"DialogFooter.js","sources":["../../../src/components/dialog/DialogFooter.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Flex } from '../flex'\n\nexport const DialogFooter = ({\n  css,\n  ...props\n}: React.ComponentProps<typeof Flex>) => (\n  <Flex justify=\"end\" gap={3} css={{ pt: '$4', ...css }} {...props} />\n)\n"],"names":["DialogFooter","css","props","React","Flex"],"mappings":"+DAIa,MAAAA,EAAe,CAAC,CAC3B,IAAAC,KACGC,CACL,IACEC,EAAA,cAACC,EAAA,CAAK,QAAQ,MAAM,IAAK,EAAG,IAAK,CAAE,GAAI,KAAM,GAAGH,CAAI,EAAI,GAAGC,CAAO,CAAA"}
+{"version":3,"file":"DialogFooter.js","sources":["../../../src/components/dialog/DialogFooter.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport * as React from 'react'\n\nimport { Flex } from '../flex'\n\nexport const DialogFooter = ({\n  className,\n  ...rest\n}: React.ComponentProps<typeof Flex>) => (\n  <Flex justify=\"end\" gap={3} {...rest} className={clsx('pt-4', className)} />\n)\n"],"names":["DialogFooter","className","rest","React","Flex","clsx"],"mappings":"mFAKa,MAAAA,EAAe,CAAC,CAC3B,UAAAC,EACA,GAAGC,CACL,IACEC,EAAA,cAACC,EAAA,CAAK,QAAQ,MAAM,IAAK,EAAI,GAAGF,EAAM,UAAWG,EAAK,OAAQJ,CAAS,CAAG,CAAA"}

package/dist/components/dialog/DialogHeading.js

@@ -1,2 +1,2 @@
-import*as t from"react";import{Heading as i}from"../heading/Heading.js";const m=({css:o,...e})=>t.createElement(i,{size:"sm",css:{borderBottom:"1px solid $grey200",p:"0 $5 $5 $5",mb:"$5",mx:"-$5",boxSizing:"content-box",...o},...e});export{m as DialogHeading};
+import r from"clsx";import*as m from"react";import{Heading as t}from"../heading/Heading.js";const a=({className:e,...o})=>m.createElement(t,{size:"sm",...o,className:r("border-b","border-b-grey-200","pb-8","pt-0","px-8","mb-8","-mx-8","box-content",e)});export{a as DialogHeading};
 //# sourceMappingURL=DialogHeading.js.map

package/dist/components/dialog/DialogHeading.js.map

@@ -1 +1 @@
-{"version":3,"file":"DialogHeading.js","sources":["../../../src/components/dialog/DialogHeading.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Heading } from '../heading'\n\nexport const DialogHeading = ({\n  css,\n  ...props\n}: React.ComponentProps<typeof Heading>) => (\n  <Heading\n    size=\"sm\"\n    css={{\n      borderBottom: '1px solid $grey200',\n      p: `0 $5 $5 $5`,\n      mb: '$5',\n      mx: '-$5',\n      boxSizing: 'content-box',\n      ...css\n    }}\n    {...props}\n  />\n)\n"],"names":["DialogHeading","css","props","React","Heading"],"mappings":"wEAIa,MAAAA,EAAgB,CAAC,CAC5B,IAAAC,KACGC,CACL,IACEC,EAAA,cAACC,EAAA,CACC,KAAK,KACL,IAAK,CACH,aAAc,qBACd,EAAG,aACH,GAAI,KACJ,GAAI,MACJ,UAAW,cACX,GAAGH,CACL,EACC,GAAGC,CACN,CAAA"}
+{"version":3,"file":"DialogHeading.js","sources":["../../../src/components/dialog/DialogHeading.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport * as React from 'react'\n\nimport { Heading } from '../heading'\n\nexport const DialogHeading = ({\n  className,\n  ...rest\n}: React.ComponentProps<typeof Heading>) => (\n  <Heading\n    size=\"sm\"\n    {...rest}\n    className={clsx(\n      'border-b',\n      'border-b-grey-200',\n      'pb-8',\n      'pt-0',\n      'px-8',\n      'mb-8',\n      '-mx-8',\n      'box-content',\n      className\n    )}\n  />\n)\n"],"names":["DialogHeading","className","rest","React","Heading","clsx"],"mappings":"4FAKO,MAAMA,EAAgB,CAAC,CAC5B,UAAAC,EACA,GAAGC,CACL,IACEC,EAAA,cAACC,EAAA,CACC,KAAK,KACJ,GAAGF,EACJ,UAAWG,EACT,WACA,oBACA,OACA,OACA,OACA,OACA,QACA,cACAJ,CACF,CACF,CAAA"}

package/dist/components/dismissible/DismissibleRoot.js

@@ -1,2 +1,2 @@
-import{Slot as c}from"@radix-ui/react-slot";import*as s from"react";const l=s.createContext({isDismissed:!1,setIsDismissed:()=>{},onDismiss:()=>{}}),r=({dismissed:e,children:o,disabled:i,onDismiss:t=()=>null})=>{const[d,n]=s.useState(!1),D=s.useMemo(()=>{const m=typeof e=="boolean";return{disabled:i,isDismissed:m?e:d,setIsDismissed:m?()=>null:n,onDismiss:t}},[i,d,t,e]);return s.createElement(l.Provider,{value:D},o)},b=({asChild:e=!1,...o})=>{const i=s.useContext(l),{isDismissed:t,disabled:d}=i;if(t)return null;const n={...d&&{["data-disabled"]:""},...o};return s.createElement(e?c:"div",{...n})},a=({disabled:e=!1,dismissed:o,onDismiss:i,...t})=>s.createElement(r,{dismissed:o,disabled:e,onDismiss:i},s.createElement(b,{...t}));a.displayName="Dismissible";export{a as DismissibleRoot,l as DismissibleRootContext,r as DismissibleRootProvider};
+import{Slot as c}from"@radix-ui/react-slot";import*as s from"react";const l=s.createContext({isDismissed:!1,setIsDismissed:()=>{},onDismiss:()=>{}}),r=({dismissed:e,children:o,disabled:i,onDismiss:t=()=>null})=>{const[d,n]=s.useState(!1),D=s.useMemo(()=>{const m=typeof e=="boolean";return{disabled:i,isDismissed:m?e:d,setIsDismissed:m?()=>null:n,onDismiss:t}},[i,d,t,e]);return s.createElement(l.Provider,{value:D},o)},b=({asChild:e=!1,...o})=>{const i=s.useContext(l),{isDismissed:t,disabled:d}=i;if(t)return null;const n={...d&&{"data-disabled":""},...o};return s.createElement(e?c:"div",{...n})},a=({disabled:e=!1,dismissed:o,onDismiss:i,...t})=>s.createElement(r,{dismissed:o,disabled:e,onDismiss:i},s.createElement(b,{...t}));a.displayName="Dismissible";export{a as DismissibleRoot,l as DismissibleRootContext,r as DismissibleRootProvider};
 //# sourceMappingURL=DismissibleRoot.js.map

package/dist/components/dismissible/DismissibleRoot.js.map

@@ -1 +1 @@
-{"version":3,"file":"DismissibleRoot.js","sources":["../../../src/components/dismissible/DismissibleRoot.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot'\nimport * as React from 'react'\n\nexport interface IDismissibleRootContext {\n  disabled?: boolean\n  isDismissed: boolean\n  setIsDismissed: (boolean) => void\n  onDismiss: () => void\n}\n\nexport const DismissibleRootContext =\n  React.createContext<IDismissibleRootContext>({\n    isDismissed: false,\n    setIsDismissed: () => undefined,\n    onDismiss: () => undefined\n  })\n\nexport interface IDismissibleRootProps {\n  disabled?: boolean\n  dismissed?: boolean\n  onDismiss?: () => void\n}\n\nexport const DismissibleRootProvider = ({\n  dismissed: controlledIsDismissed,\n  children,\n  disabled,\n  onDismiss = () => null\n}: React.PropsWithChildren<IDismissibleRootProps>) => {\n  const [isDismissed, setIsDismissed] = React.useState(false)\n\n  const value = React.useMemo<IDismissibleRootContext>(() => {\n    const isControlled = typeof controlledIsDismissed === 'boolean'\n    return {\n      disabled,\n      isDismissed: isControlled\n        ? (controlledIsDismissed as boolean)\n        : isDismissed,\n      setIsDismissed: isControlled ? () => null : setIsDismissed,\n      onDismiss\n    }\n  }, [disabled, isDismissed, onDismiss, controlledIsDismissed])\n\n  return (\n    <DismissibleRootContext.Provider value={value}>\n      {children}\n    </DismissibleRootContext.Provider>\n  )\n}\n\nexport interface IDismissibleRootInternalProps {\n  asChild?: boolean\n}\n\nconst DismissibleRootInternal = ({\n  asChild = false,\n  ...rest\n}: React.PropsWithChildren<IDismissibleRootInternalProps>) => {\n  const rootContext = React.useContext(DismissibleRootContext)\n\n  const { isDismissed, disabled } = rootContext\n\n  if (isDismissed) return null\n\n  const props = { ...(disabled && { [`data-disabled`]: '' }), ...rest }\n  const Component = asChild ? Slot : 'div'\n  return <Component {...props} />\n}\n\nexport const DismissibleRoot = ({\n  disabled = false,\n  dismissed,\n  onDismiss,\n  ...rest\n}: React.PropsWithChildren<\n  IDismissibleRootInternalProps & IDismissibleRootProps\n>) => (\n  <DismissibleRootProvider\n    dismissed={dismissed}\n    disabled={disabled}\n    onDismiss={onDismiss}\n  >\n    <DismissibleRootInternal {...rest} />\n  </DismissibleRootProvider>\n)\n\nDismissibleRoot.displayName = 'Dismissible'\n"],"names":["DismissibleRootContext","React","DismissibleRootProvider","controlledIsDismissed","children","disabled","onDismiss","isDismissed","setIsDismissed","value","isControlled","DismissibleRootInternal","asChild","rest","rootContext","props","Slot","DismissibleRoot","dismissed"],"mappings":"0EAUaA,EACXC,EAAM,cAAuC,CAC3C,YAAa,GACb,eAAgB,IAAG,CACnB,EAAA,UAAW,IAAG,CAAA,CAChB,CAAC,EAQUC,EAA0B,CAAC,CACtC,UAAWC,EACX,SAAAC,EACA,SAAAC,EACA,UAAAC,EAAY,IAAM,IACpB,IAAsD,CACpD,KAAM,CAACC,EAAaC,CAAc,EAAIP,EAAM,SAAS,EAAK,EAEpDQ,EAAQR,EAAM,QAAiC,IAAM,CACzD,MAAMS,EAAe,OAAOP,GAA0B,UACtD,MAAO,CACL,SAAAE,EACA,YAAaK,EACRP,EACDI,EACJ,eAAgBG,EAAe,IAAM,KAAOF,EAC5C,UAAAF,CACF,CACF,EAAG,CAACD,EAAUE,EAAaD,EAAWH,CAAqB,CAAC,EAE5D,OACEF,EAAA,cAACD,EAAuB,SAAvB,CAAgC,MAAOS,CACrCL,EAAAA,CACH,CAEJ,EAMMO,EAA0B,CAAC,CAC/B,QAAAC,EAAU,MACPC,CACL,IAA8D,CAC5D,MAAMC,EAAcb,EAAM,WAAWD,CAAsB,EAErD,CAAE,YAAAO,EAAa,SAAAF,CAAS,EAAIS,EAElC,GAAIP,EAAa,OAAO,KAExB,MAAMQ,EAAQ,CAAE,GAAIV,GAAY,CAAE,CAAC,iBAAkB,EAAG,EAAI,GAAGQ,CAAK,EAEpE,OAAOZ,EAAA,cADWW,EAAUI,EAAO,MAC3B,CAAW,GAAGD,EAAO,CAC/B,EAEaE,EAAkB,CAAC,CAC9B,SAAAZ,EAAW,GACX,UAAAa,EACA,UAAAZ,KACGO,CACL,IAGEZ,EAAA,cAACC,EAAA,CACC,UAAWgB,EACX,SAAUb,EACV,UAAWC,CAAAA,EAEXL,EAAA,cAACU,EAAA,CAAyB,GAAGE,EAAM,CACrC,EAGFI,EAAgB,YAAc"}
+{"version":3,"file":"DismissibleRoot.js","sources":["../../../src/components/dismissible/DismissibleRoot.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot'\nimport * as React from 'react'\n\nexport interface IDismissibleRootContext {\n  disabled?: boolean\n  isDismissed: boolean\n  setIsDismissed: (boolean) => void\n  onDismiss: () => void\n}\n\nexport const DismissibleRootContext =\n  React.createContext<IDismissibleRootContext>({\n    isDismissed: false,\n    setIsDismissed: () => undefined,\n    onDismiss: () => undefined\n  })\n\nexport interface IDismissibleRootProps {\n  disabled?: boolean\n  dismissed?: boolean\n  onDismiss?: () => void\n}\n\nexport const DismissibleRootProvider = ({\n  dismissed: controlledIsDismissed,\n  children,\n  disabled,\n  onDismiss = () => null\n}: React.PropsWithChildren<IDismissibleRootProps>) => {\n  const [isDismissed, setIsDismissed] = React.useState(false)\n\n  const value = React.useMemo<IDismissibleRootContext>(() => {\n    const isControlled = typeof controlledIsDismissed === 'boolean'\n    return {\n      disabled,\n      isDismissed: isControlled\n        ? (controlledIsDismissed as boolean)\n        : isDismissed,\n      setIsDismissed: isControlled ? () => null : setIsDismissed,\n      onDismiss\n    }\n  }, [disabled, isDismissed, onDismiss, controlledIsDismissed])\n\n  return (\n    <DismissibleRootContext.Provider value={value}>\n      {children}\n    </DismissibleRootContext.Provider>\n  )\n}\n\nexport interface IDismissibleRootInternalProps {\n  asChild?: boolean\n}\n\nconst DismissibleRootInternal = ({\n  asChild = false,\n  ...rest\n}: React.PropsWithChildren<IDismissibleRootInternalProps>) => {\n  const rootContext = React.useContext(DismissibleRootContext)\n\n  const { isDismissed, disabled } = rootContext\n\n  if (isDismissed) return null\n\n  const props = { ...(disabled && { [`data-disabled`]: '' }), ...rest }\n  const Component = asChild ? Slot : 'div'\n  return <Component {...props} />\n}\n\nexport const DismissibleRoot = ({\n  disabled = false,\n  dismissed,\n  onDismiss,\n  ...rest\n}: React.PropsWithChildren<\n  IDismissibleRootInternalProps & IDismissibleRootProps\n>) => (\n  <DismissibleRootProvider\n    dismissed={dismissed}\n    disabled={disabled}\n    onDismiss={onDismiss}\n  >\n    <DismissibleRootInternal {...rest} />\n  </DismissibleRootProvider>\n)\n\nDismissibleRoot.displayName = 'Dismissible'\n"],"names":["DismissibleRootContext","React","DismissibleRootProvider","controlledIsDismissed","children","disabled","onDismiss","isDismissed","setIsDismissed","value","isControlled","DismissibleRootInternal","asChild","rest","rootContext","props","Slot","DismissibleRoot","dismissed"],"mappings":"0EAUaA,EACXC,EAAM,cAAuC,CAC3C,YAAa,GACb,eAAgB,IAAG,CACnB,EAAA,UAAW,IAAG,CAAA,CAChB,CAAC,EAQUC,EAA0B,CAAC,CACtC,UAAWC,EACX,SAAAC,EACA,SAAAC,EACA,UAAAC,EAAY,IAAM,IACpB,IAAsD,CACpD,KAAM,CAACC,EAAaC,CAAc,EAAIP,EAAM,SAAS,EAAK,EAEpDQ,EAAQR,EAAM,QAAiC,IAAM,CACzD,MAAMS,EAAe,OAAOP,GAA0B,UACtD,MAAO,CACL,SAAAE,EACA,YAAaK,EACRP,EACDI,EACJ,eAAgBG,EAAe,IAAM,KAAOF,EAC5C,UAAAF,CACF,CACF,EAAG,CAACD,EAAUE,EAAaD,EAAWH,CAAqB,CAAC,EAE5D,OACEF,EAAA,cAACD,EAAuB,SAAvB,CAAgC,MAAOS,CACrCL,EAAAA,CACH,CAEJ,EAMMO,EAA0B,CAAC,CAC/B,QAAAC,EAAU,GACV,GAAGC,CACL,IAA8D,CAC5D,MAAMC,EAAcb,EAAM,WAAWD,CAAsB,EAErD,CAAE,YAAAO,EAAa,SAAAF,CAAS,EAAIS,EAElC,GAAIP,EAAa,OAAO,KAExB,MAAMQ,EAAQ,CAAE,GAAIV,GAAY,CAAG,gBAAkB,EAAG,EAAI,GAAGQ,CAAK,EAEpE,OAAOZ,EAAA,cADWW,EAAUI,EAAO,MAC3B,CAAW,GAAGD,EAAO,CAC/B,EAEaE,EAAkB,CAAC,CAC9B,SAAAZ,EAAW,GACX,UAAAa,EACA,UAAAZ,EACA,GAAGO,CACL,IAGEZ,EAAA,cAACC,GACC,UAAWgB,EACX,SAAUb,EACV,UAAWC,GAEXL,EAAA,cAACU,EAAA,CAAyB,GAAGE,EAAM,CACrC,EAGFI,EAAgB,YAAc"}

package/dist/components/dismissible/DismissibleTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"DismissibleTrigger.js","sources":["../../../src/components/dismissible/DismissibleTrigger.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot'\nimport * as React from 'react'\n\nimport { DismissibleRootContext } from './DismissibleRoot'\n\nexport interface IDismissibleTriggerProps {\n  asChild?: boolean\n}\n\nconst DefaultTrigger = (props) => (\n  <button type=\"button\" {...props}>\n    Dismiss\n  </button>\n)\n\nexport const DismissibleTrigger = ({\n  asChild = false,\n  ...rest\n}: React.PropsWithChildren<IDismissibleTriggerProps>) => {\n  const context = React.useContext(DismissibleRootContext)\n  if (context === undefined) {\n    throw new Error(\n      'Dismissible.Trigger can only be used within a Dismissible.Item'\n    )\n  }\n\n  const { setIsDismissed, disabled, onDismiss } = context\n\n  const handleDismiss = () => {\n    setIsDismissed(true)\n    onDismiss?.()\n  }\n\n  const props = {\n    disabled: disabled,\n    onClick: handleDismiss,\n    ...rest\n  }\n\n  const Component = asChild ? Slot : DefaultTrigger\n  return <Component {...props} />\n}\n"],"names":["DefaultTrigger","props","React","DismissibleTrigger","asChild","rest","context","DismissibleRootContext","setIsDismissed","disabled","onDismiss","Slot"],"mappings":"kIASA,MAAMA,EAAkBC,GACtBC,EAAA,cAAC,SAAA,CAAO,KAAK,SAAU,GAAGD,CAAO,EAAA,SAEjC,EAGWE,EAAqB,CAAC,CACjC,QAAAC,EAAU,MACPC,CACL,IAAyD,CACvD,MAAMC,EAAUJ,EAAM,WAAWK,CAAsB,EACvD,GAAID,IAAY,OACd,MAAM,IAAI,MACR,gEACF,EAGF,KAAM,CAAE,eAAAE,EAAgB,SAAAC,EAAU,UAAAC,CAAU,EAAIJ,EAO1CL,EAAQ,CACZ,SAAUQ,EACV,QAPoB,IAAM,CAC1BD,EAAe,EAAI,EACnBE,GAAA,MAAAA,EACF,CAAA,EAKE,GAAGL,CACL,EAGA,OAAOH,EAAA,cADWE,EAAUO,EAAOX,EAC3B,CAAW,GAAGC,EAAO,CAC/B"}
+{"version":3,"file":"DismissibleTrigger.js","sources":["../../../src/components/dismissible/DismissibleTrigger.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot'\nimport * as React from 'react'\n\nimport { DismissibleRootContext } from './DismissibleRoot'\n\nexport interface IDismissibleTriggerProps {\n  asChild?: boolean\n}\n\nconst DefaultTrigger = (props) => (\n  <button type=\"button\" {...props}>\n    Dismiss\n  </button>\n)\n\nexport const DismissibleTrigger = ({\n  asChild = false,\n  ...rest\n}: React.PropsWithChildren<IDismissibleTriggerProps>) => {\n  const context = React.useContext(DismissibleRootContext)\n  if (context === undefined) {\n    throw new Error(\n      'Dismissible.Trigger can only be used within a Dismissible.Item'\n    )\n  }\n\n  const { setIsDismissed, disabled, onDismiss } = context\n\n  const handleDismiss = () => {\n    setIsDismissed(true)\n    onDismiss?.()\n  }\n\n  const props = {\n    disabled: disabled,\n    onClick: handleDismiss,\n    ...rest\n  }\n\n  const Component = asChild ? Slot : DefaultTrigger\n  return <Component {...props} />\n}\n"],"names":["DefaultTrigger","props","React","DismissibleTrigger","asChild","rest","context","DismissibleRootContext","setIsDismissed","disabled","onDismiss","Slot"],"mappings":"kIASA,MAAMA,EAAkBC,GACtBC,EAAA,cAAC,SAAA,CAAO,KAAK,SAAU,GAAGD,CAAO,EAAA,SAEjC,EAGWE,EAAqB,CAAC,CACjC,QAAAC,EAAU,GACV,GAAGC,CACL,IAAyD,CACvD,MAAMC,EAAUJ,EAAM,WAAWK,CAAsB,EACvD,GAAID,IAAY,OACd,MAAM,IAAI,MACR,gEACF,EAGF,KAAM,CAAE,eAAAE,EAAgB,SAAAC,EAAU,UAAAC,CAAU,EAAIJ,EAO1CL,EAAQ,CACZ,SAAUQ,EACV,QAPoB,IAAM,CAC1BD,EAAe,EAAI,EACnBE,GAAA,MAAAA,EACF,CAAA,EAKE,GAAGL,CACL,EAGA,OAAOH,EAAA,cADWE,EAAUO,EAAOX,EAC3B,CAAW,GAAGC,EAAO,CAC/B"}

package/dist/components/dismissible-group/DismissibleGroupItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"DismissibleGroupItem.js","sources":["../../../src/components/dismissible-group/DismissibleGroupItem.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Dismissible } from '~/components/dismissible'\n\nimport { DismissibleGroupContext } from './DismissibleGroupRoot'\n\nexport type TDismissibleGroupItemProps = React.ComponentProps<\n  typeof Dismissible\n> & {\n  value: React.ReactText\n  disabled?: boolean\n}\n\nexport const DismissibleGroupItem = ({\n  children,\n  value,\n  disabled: itemDisabled = false,\n  ...rest\n}: React.PropsWithChildren<TDismissibleGroupItemProps>) => {\n  const groupContext = React.useContext(DismissibleGroupContext)\n  if (groupContext === undefined) {\n    throw new Error(\n      'DismissibleGroup.Item can only be used within a DismissibleGroup'\n    )\n  }\n  const { onDismiss, disabled: groupDisabled } = groupContext\n  return (\n    <Dismissible\n      disabled={groupDisabled || itemDisabled}\n      {...rest}\n      onDismiss={() => onDismiss(value)}\n    >\n      {children}\n    </Dismissible>\n  )\n}\n"],"names":["DismissibleGroupItem","children","value","itemDisabled","rest","groupContext","React","DismissibleGroupContext","onDismiss","groupDisabled","Dismissible"],"mappings":"kJAaa,MAAAA,EAAuB,CAAC,CACnC,SAAAC,EACA,MAAAC,EACA,SAAUC,EAAe,MACtBC,CACL,IAA2D,CACzD,MAAMC,EAAeC,EAAM,WAAWC,CAAuB,EAC7D,GAAIF,IAAiB,OACnB,MAAM,IAAI,MACR,kEACF,EAEF,KAAM,CAAE,UAAAG,EAAW,SAAUC,CAAc,EAAIJ,EAC/C,OACEC,EAAA,cAACI,EAAA,CACC,SAAUD,GAAiBN,EAC1B,GAAGC,EACJ,UAAW,IAAMI,EAAUN,CAAK,CAAA,EAE/BD,CACH,CAEJ"}
+{"version":3,"file":"DismissibleGroupItem.js","sources":["../../../src/components/dismissible-group/DismissibleGroupItem.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Dismissible } from '~/components/dismissible'\n\nimport { DismissibleGroupContext } from './DismissibleGroupRoot'\n\nexport type TDismissibleGroupItemProps = React.ComponentProps<\n  typeof Dismissible\n> & {\n  value: React.ReactText\n  disabled?: boolean\n}\n\nexport const DismissibleGroupItem = ({\n  children,\n  value,\n  disabled: itemDisabled = false,\n  ...rest\n}: React.PropsWithChildren<TDismissibleGroupItemProps>) => {\n  const groupContext = React.useContext(DismissibleGroupContext)\n  if (groupContext === undefined) {\n    throw new Error(\n      'DismissibleGroup.Item can only be used within a DismissibleGroup'\n    )\n  }\n  const { onDismiss, disabled: groupDisabled } = groupContext\n  return (\n    <Dismissible\n      disabled={groupDisabled || itemDisabled}\n      {...rest}\n      onDismiss={() => onDismiss(value)}\n    >\n      {children}\n    </Dismissible>\n  )\n}\n"],"names":["DismissibleGroupItem","children","value","itemDisabled","rest","groupContext","React","DismissibleGroupContext","onDismiss","groupDisabled","Dismissible"],"mappings":"kJAaa,MAAAA,EAAuB,CAAC,CACnC,SAAAC,EACA,MAAAC,EACA,SAAUC,EAAe,GACzB,GAAGC,CACL,IAA2D,CACzD,MAAMC,EAAeC,EAAM,WAAWC,CAAuB,EAC7D,GAAIF,IAAiB,OACnB,MAAM,IAAI,MACR,kEACF,EAEF,KAAM,CAAE,UAAAG,EAAW,SAAUC,CAAc,EAAIJ,EAC/C,OACEC,EAAA,cAACI,EAAA,CACC,SAAUD,GAAiBN,EAC1B,GAAGC,EACJ,UAAW,IAAMI,EAAUN,CAAK,CAAA,EAE/BD,CACH,CAEJ"}

package/dist/components/dismissible-group/DismissibleGroupRoot.js.map

@@ -1 +1 @@
-{"version":3,"file":"DismissibleGroupRoot.js","sources":["../../../src/components/dismissible-group/DismissibleGroupRoot.tsx"],"sourcesContent":["import * as React from 'react'\n\nexport interface IDismissibleGroupContext {\n  disabled?: boolean\n  onDismiss: (value: React.ReactText) => void\n}\nexport const DismissibleGroupContext =\n  React.createContext<IDismissibleGroupContext>({\n    onDismiss: () => null\n  })\n\nexport interface IDismissibleGroupProps {\n  disabled?: boolean\n  onDismiss: (value: React.ReactText) => void\n}\n\nexport const DismissibleGroupProvider = ({\n  children,\n  disabled,\n  onDismiss\n}: React.PropsWithChildren<IDismissibleGroupProps>) => {\n  const value = React.useMemo<IDismissibleGroupContext>(\n    () => ({ disabled, onDismiss }),\n    [disabled, onDismiss]\n  )\n  return (\n    <DismissibleGroupContext.Provider value={value}>\n      {children}\n    </DismissibleGroupContext.Provider>\n  )\n}\n\nexport interface IDismissibleGroupRootProps extends IDismissibleGroupProps {\n  as?: React.ElementType\n}\n\nexport const DismissibleGroupRoot = ({\n  as: Component = 'div',\n  disabled,\n  onDismiss,\n  ...rest\n}: React.PropsWithChildren<IDismissibleGroupRootProps>) => {\n  return (\n    <DismissibleGroupProvider disabled={disabled} onDismiss={onDismiss}>\n      <Component {...rest} />\n    </DismissibleGroupProvider>\n  )\n}\n\nDismissibleGroupRoot.displayName = 'DismissibleGroup'\n"],"names":["DismissibleGroupContext","React","DismissibleGroupProvider","children","disabled","onDismiss","value","DismissibleGroupRoot","Component","rest"],"mappings":"wBAMO,MAAMA,EACXC,EAAM,cAAwC,CAC5C,UAAW,IAAM,IACnB,CAAC,EAOUC,EAA2B,CAAC,CACvC,SAAAC,EACA,SAAAC,EACA,UAAAC,CACF,IAAuD,CACrD,MAAMC,EAAQL,EAAM,QAClB,KAAO,CAAE,SAAAG,EAAU,UAAAC,CAAU,GAC7B,CAACD,EAAUC,CAAS,CACtB,EACA,OACEJ,EAAA,cAACD,EAAwB,SAAxB,CAAiC,MAAOM,GACtCH,CACH,CAEJ,EAMaI,EAAuB,CAAC,CACnC,GAAIC,EAAY,MAChB,SAAAJ,EACA,UAAAC,KACGI,CACL,IAEIR,EAAA,cAACC,EAAyB,CAAA,SAAUE,EAAU,UAAWC,CAAAA,EACvDJ,EAAA,cAACO,EAAA,CAAW,GAAGC,EAAM,CACvB,EAIJF,EAAqB,YAAc"}
+{"version":3,"file":"DismissibleGroupRoot.js","sources":["../../../src/components/dismissible-group/DismissibleGroupRoot.tsx"],"sourcesContent":["import * as React from 'react'\n\nexport interface IDismissibleGroupContext {\n  disabled?: boolean\n  onDismiss: (value: React.ReactText) => void\n}\nexport const DismissibleGroupContext =\n  React.createContext<IDismissibleGroupContext>({\n    onDismiss: () => null\n  })\n\nexport interface IDismissibleGroupProps {\n  disabled?: boolean\n  onDismiss: (value: React.ReactText) => void\n}\n\nexport const DismissibleGroupProvider = ({\n  children,\n  disabled,\n  onDismiss\n}: React.PropsWithChildren<IDismissibleGroupProps>) => {\n  const value = React.useMemo<IDismissibleGroupContext>(\n    () => ({ disabled, onDismiss }),\n    [disabled, onDismiss]\n  )\n  return (\n    <DismissibleGroupContext.Provider value={value}>\n      {children}\n    </DismissibleGroupContext.Provider>\n  )\n}\n\nexport interface IDismissibleGroupRootProps extends IDismissibleGroupProps {\n  as?: React.ElementType\n}\n\nexport const DismissibleGroupRoot = ({\n  as: Component = 'div',\n  disabled,\n  onDismiss,\n  ...rest\n}: React.PropsWithChildren<IDismissibleGroupRootProps>) => {\n  return (\n    <DismissibleGroupProvider disabled={disabled} onDismiss={onDismiss}>\n      <Component {...rest} />\n    </DismissibleGroupProvider>\n  )\n}\n\nDismissibleGroupRoot.displayName = 'DismissibleGroup'\n"],"names":["DismissibleGroupContext","React","DismissibleGroupProvider","children","disabled","onDismiss","value","DismissibleGroupRoot","Component","rest"],"mappings":"wBAMO,MAAMA,EACXC,EAAM,cAAwC,CAC5C,UAAW,IAAM,IACnB,CAAC,EAOUC,EAA2B,CAAC,CACvC,SAAAC,EACA,SAAAC,EACA,UAAAC,CACF,IAAuD,CACrD,MAAMC,EAAQL,EAAM,QAClB,KAAO,CAAE,SAAAG,EAAU,UAAAC,CAAU,GAC7B,CAACD,EAAUC,CAAS,CACtB,EACA,OACEJ,EAAA,cAACD,EAAwB,SAAxB,CAAiC,MAAOM,GACtCH,CACH,CAEJ,EAMaI,EAAuB,CAAC,CACnC,GAAIC,EAAY,MAChB,SAAAJ,EACA,UAAAC,EACA,GAAGI,CACL,IAEIR,EAAA,cAACC,EAAyB,CAAA,SAAUE,EAAU,UAAWC,CAAAA,EACvDJ,EAAA,cAACO,EAAA,CAAW,GAAGC,EAAM,CACvB,EAIJF,EAAqB,YAAc"}

package/dist/components/divider/Divider.js

@@ -1,2 +1,2 @@
-import t from"react";import{styled as n}from"../../stitches.js";const e=n("hr",{border:0,bg:"$grey200",variants:{orientation:{horizontal:{height:1,width:"100%"},vertical:{height:"100%",width:1,minHeight:"$3"}}}}),a=t.forwardRef(({orientation:i="horizontal",...r},o)=>t.createElement(e,{ref:o,orientation:i,...r}));export{a as Divider,e as StyledDivider};
+import r from"react";import{styled as n}from"../../styled.js";const e=n("hr",{base:["border-none","bg-grey-200"],variants:{orientation:{horizontal:["h-px","w-full"],vertical:["h-full","min-h-8","w-px"]}}}),a=r.forwardRef(({orientation:o="horizontal",...t},i)=>r.createElement(e,{ref:i,orientation:o,...t}));export{a as Divider,e as StyledDivider};
 //# sourceMappingURL=Divider.js.map

package/dist/components/divider/Divider.js.map

@@ -1 +1 @@
-{"version":3,"file":"Divider.js","sources":["../../../src/components/divider/Divider.tsx"],"sourcesContent":["import React from 'react'\n\nimport { styled } from '~/stitches'\n\nexport const StyledDivider = styled('hr', {\n  border: 0,\n  bg: '$grey200',\n  variants: {\n    orientation: {\n      horizontal: { height: 1, width: '100%' },\n      vertical: { height: '100%', width: 1, minHeight: '$3' }\n    }\n  }\n})\n\nexport const Divider: React.ForwardRefExoticComponent<\n  React.ComponentProps<typeof StyledDivider>\n> = React.forwardRef(({ orientation = 'horizontal', ...rest }, ref) => {\n  return <StyledDivider ref={ref} orientation={orientation} {...rest} />\n})\n"],"names":["StyledDivider","styled","Divider","React","orientation","rest","ref"],"mappings":"gEAIO,MAAMA,EAAgBC,EAAO,KAAM,CACxC,OAAQ,EACR,GAAI,WACJ,SAAU,CACR,YAAa,CACX,WAAY,CAAE,OAAQ,EAAG,MAAO,MAAO,EACvC,SAAU,CAAE,OAAQ,OAAQ,MAAO,EAAG,UAAW,IAAK,CACxD,CACF,CACF,CAAC,EAEYC,EAETC,EAAM,WAAW,CAAC,CAAE,YAAAC,EAAc,gBAAiBC,CAAK,EAAGC,IACtDH,EAAA,cAACH,EAAA,CAAc,IAAKM,EAAK,YAAaF,EAAc,GAAGC,CAAAA,CAAM,CACrE"}
+{"version":3,"file":"Divider.js","sources":["../../../src/components/divider/Divider.tsx"],"sourcesContent":["import React from 'react'\n\nimport { styled } from '~/styled'\n\nexport const StyledDivider = styled('hr', {\n  base: ['border-none', 'bg-grey-200'],\n  variants: {\n    orientation: {\n      horizontal: ['h-px', 'w-full'],\n      vertical: ['h-full', 'min-h-8', 'w-px']\n    }\n  }\n})\n\nexport const Divider = React.forwardRef<\n  HTMLHRElement,\n  React.ComponentProps<typeof StyledDivider>\n>(({ orientation = 'horizontal', ...rest }, ref) => {\n  return <StyledDivider ref={ref} orientation={orientation} {...rest} />\n})\n"],"names":["StyledDivider","styled","Divider","React","orientation","rest","ref"],"mappings":"8DAIO,MAAMA,EAAgBC,EAAO,KAAM,CACxC,KAAM,CAAC,cAAe,aAAa,EACnC,SAAU,CACR,YAAa,CACX,WAAY,CAAC,OAAQ,QAAQ,EAC7B,SAAU,CAAC,SAAU,UAAW,MAAM,CACxC,CACF,CACF,CAAC,EAEYC,EAAUC,EAAM,WAG3B,CAAC,CAAE,YAAAC,EAAc,aAAc,GAAGC,CAAK,EAAGC,IACnCH,EAAA,cAACH,EAAA,CAAc,IAAKM,EAAK,YAAaF,EAAc,GAAGC,CAAAA,CAAM,CACrE"}

package/dist/components/drawer/Drawer.context.js.map

@@ -1 +1 @@
-{"version":3,"file":"Drawer.context.js","sources":["../../../src/components/drawer/Drawer.context.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { StyledContent } from './DrawerContent'\n\ntype TDrawerProviderProps = {\n  position?: React.ComponentProps<typeof StyledContent>['position']\n}\n\ntype TDrawerContext = TDrawerProviderProps\n\nexport const DrawerContext = React.createContext<TDrawerContext>({\n  position: 'left'\n})\n\nexport const DrawerProvider = ({\n  position = 'left',\n  ...rest\n}: React.PropsWithChildren<TDrawerProviderProps>): JSX.Element => {\n  const value = React.useMemo<TDrawerContext>(() => ({ position }), [position])\n  return <DrawerContext.Provider value={value} {...rest} />\n}\n"],"names":["DrawerContext","React","DrawerProvider","position","rest","value"],"mappings":"wBAUO,MAAMA,EAAgBC,EAAM,cAA8B,CAC/D,SAAU,MACZ,CAAC,EAEYC,EAAiB,CAAC,CAC7B,SAAAC,EAAW,UACRC,CACL,IAAkE,CAChE,MAAMC,EAAQJ,EAAM,QAAwB,KAAO,CAAE,SAAAE,CAAS,GAAI,CAACA,CAAQ,CAAC,EAC5E,OAAOF,EAAA,cAACD,EAAc,SAAd,CAAuB,MAAOK,EAAQ,GAAGD,EAAM,CACzD"}
+{"version":3,"file":"Drawer.context.js","sources":["../../../src/components/drawer/Drawer.context.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { StyledContent } from './DrawerContent'\n\ntype TDrawerProviderProps = {\n  position?: React.ComponentProps<typeof StyledContent>['position']\n}\n\ntype TDrawerContext = TDrawerProviderProps\n\nexport const DrawerContext = React.createContext<TDrawerContext>({\n  position: 'left'\n})\n\nexport const DrawerProvider = ({\n  position = 'left',\n  ...rest\n}: React.PropsWithChildren<TDrawerProviderProps>): JSX.Element => {\n  const value = React.useMemo<TDrawerContext>(() => ({ position }), [position])\n  return <DrawerContext.Provider value={value} {...rest} />\n}\n"],"names":["DrawerContext","React","DrawerProvider","position","rest","value"],"mappings":"wBAUa,MAAAA,EAAgBC,EAAM,cAA8B,CAC/D,SAAU,MACZ,CAAC,EAEYC,EAAiB,CAAC,CAC7B,SAAAC,EAAW,OACX,GAAGC,CACL,IAAkE,CAChE,MAAMC,EAAQJ,EAAM,QAAwB,KAAO,CAAE,SAAAE,CAAS,GAAI,CAACA,CAAQ,CAAC,EAC5E,OAAOF,EAAA,cAACD,EAAc,SAAd,CAAuB,MAAOK,EAAQ,GAAGD,EAAM,CACzD"}

package/dist/components/drawer/Drawer.js.map

@@ -1 +1 @@
-{"version":3,"file":"Drawer.js","sources":["../../../src/components/drawer/Drawer.tsx"],"sourcesContent":["import { Root } from '@radix-ui/react-dialog'\nimport React from 'react'\n\nimport { DrawerProvider } from './Drawer.context'\nimport { DrawerClose } from './DrawerClose'\nimport { DrawerContent } from './DrawerContent'\nimport { DrawerFooter } from './DrawerFooter'\nimport { DrawerHeader } from './DrawerHeader'\nimport { DrawerMain } from './DrawerMain'\nimport { DrawerTrigger } from './DrawerTrigger'\n\ntype TDrawerProps = React.ComponentProps<typeof Root> &\n  React.ComponentProps<typeof DrawerProvider>\n\nexport const Drawer = ({\n  children,\n  position,\n  ...rest\n}: TDrawerProps): JSX.Element => {\n  return (\n    <DrawerProvider position={position}>\n      <Root {...rest}>{children}</Root>\n    </DrawerProvider>\n  )\n}\n\nDrawer.Close = DrawerClose\nDrawer.Content = DrawerContent\nDrawer.Main = DrawerMain\nDrawer.Header = DrawerHeader\nDrawer.Footer = DrawerFooter\nDrawer.Trigger = DrawerTrigger\n"],"names":["Drawer","children","position","rest","React","DrawerProvider","Root","DrawerClose","DrawerContent","DrawerMain","DrawerHeader","DrawerFooter","DrawerTrigger"],"mappings":"kaAcaA,EAAS,CAAC,CACrB,SAAAC,EACA,SAAAC,KACGC,CACL,IAEIC,EAAA,cAACC,EAAA,CAAe,SAAUH,GACxBE,EAAA,cAACE,EAAA,CAAM,GAAGH,CAAOF,EAAAA,CAAS,CAC5B,EAIJD,EAAO,MAAQO,EACfP,EAAO,QAAUQ,EACjBR,EAAO,KAAOS,EACdT,EAAO,OAASU,EAChBV,EAAO,OAASW,EAChBX,EAAO,QAAUY"}
+{"version":3,"file":"Drawer.js","sources":["../../../src/components/drawer/Drawer.tsx"],"sourcesContent":["import { Root } from '@radix-ui/react-dialog'\nimport React from 'react'\n\nimport { DrawerProvider } from './Drawer.context'\nimport { DrawerClose } from './DrawerClose'\nimport { DrawerContent } from './DrawerContent'\nimport { DrawerFooter } from './DrawerFooter'\nimport { DrawerHeader } from './DrawerHeader'\nimport { DrawerMain } from './DrawerMain'\nimport { DrawerTrigger } from './DrawerTrigger'\n\ntype TDrawerProps = React.ComponentProps<typeof Root> &\n  React.ComponentProps<typeof DrawerProvider>\n\nexport const Drawer = ({\n  children,\n  position,\n  ...rest\n}: TDrawerProps): JSX.Element => {\n  return (\n    <DrawerProvider position={position}>\n      <Root {...rest}>{children}</Root>\n    </DrawerProvider>\n  )\n}\n\nDrawer.Close = DrawerClose\nDrawer.Content = DrawerContent\nDrawer.Main = DrawerMain\nDrawer.Header = DrawerHeader\nDrawer.Footer = DrawerFooter\nDrawer.Trigger = DrawerTrigger\n"],"names":["Drawer","children","position","rest","React","DrawerProvider","Root","DrawerClose","DrawerContent","DrawerMain","DrawerHeader","DrawerFooter","DrawerTrigger"],"mappings":"4ZAcO,MAAMA,EAAS,CAAC,CACrB,SAAAC,EACA,SAAAC,EACA,GAAGC,CACL,IAEIC,EAAA,cAACC,EAAA,CAAe,SAAUH,GACxBE,EAAA,cAACE,EAAA,CAAM,GAAGH,CAAOF,EAAAA,CAAS,CAC5B,EAIJD,EAAO,MAAQO,EACfP,EAAO,QAAUQ,EACjBR,EAAO,KAAOS,EACdT,EAAO,OAASU,EAChBV,EAAO,OAASW,EAChBX,EAAO,QAAUY"}

package/dist/components/drawer/DrawerContent.js

@@ -1,2 +1,2 @@
-import{Content as l,Portal as p}from"@radix-ui/react-dialog";import t from"react";import{Flex as s}from"../flex/Flex.js";import{DIALOG_Z_INDEX as c}from"../../constants/zIndices.js";import{ColorScheme as x}from"../../experiments/color-scheme/ColorScheme.js";import{styled as w}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import{slideInOut as e}from"../../utilities/style/keyframe-animations.js";import{DrawerContext as h}from"./Drawer.context.js";import{DrawerOverlay as u}from"./DrawerOverlay.js";const f=e({outPosition:{x:0,y:"-100%"}}),y=e({outPosition:{x:"100%",y:0}}),g=e({outPosition:{x:0,y:"100%"}}),C=e({outPosition:{x:"-100%",y:0}}),i=o=>({'&[data-state="open"]':{animationName:o.in},'&[data-state="closed"]':{animationName:o.out}}),n={left:0,width:"100%",maxHeight:"85%"},r={top:0,height:"100%",width:"var(--drawer-content-width, 100%)",maxWidth:"100%"},a=w(l,{bg:"$base1",boxShadow:"$2",position:"fixed",zIndex:c,"@allowMotion":{animationTimingFunction:"ease-out",animationDuration:"250ms"},variants:{position:{top:{top:0,...n,...i(f)},right:{right:0,...r,...i(y)},bottom:{bottom:0,...n,...i(g)},left:{left:0,...r,...i(C)}},size:{xs:{"--drawer-content-width":"240px"},sm:{"--drawer-content-width":"256px"},md:{"--drawer-content-width":"288px"},lg:{"--drawer-content-width":"304px"},xl:{"--drawer-content-width":"320px"},"2xl":{"--drawer-content-width":"720px"},"3xl":{"--drawer-content-width":"1000px"}}}}),D=({children:o,...m})=>{const{position:d}=t.useContext(h);return t.createElement(p,null,t.createElement(u,null),t.createElement(x,{base:"grey1",accent:"primary1",asChild:!0},t.createElement(a,{size:"lg",position:d,...m,asChild:!0},t.createElement(s,{direction:"column"},o))))};export{D as DrawerContent,a as StyledContent};
+import{Content as n,Portal as l}from"@radix-ui/react-dialog";import t from"react";import{Flex as a}from"../flex/Flex.js";import{ColorScheme as d}from"../../experiments/color-scheme/ColorScheme.js";import{styled as m}from"../../styled.js";import{DrawerContext as c}from"./Drawer.context.js";import{DrawerOverlay as s}from"./DrawerOverlay.js";const e=m(n,{base:["bg-(--base-1)","shadow-lg","fixed","z-1147483646","motion-safe:data-[state=open]:animate-slide-direction-in","motion-safe:data-[state=closed]:animate-slide-direction-out"],variants:{position:{top:["[--slide-direction-out-y:-100%]","top-0","left-0","w-full","max-h-17/20"],right:["[--slide-direction-out-x:100%]","right-0","top-0","h-full","w-(--drawer-content-width,100%)","max-w-full"],bottom:["[--slide-direction-out-y:100%]","bottom-0","left-0","w-full","max-h-17/20"],left:["[--slide-direction-out-x:-100%]","left-0","top-0","h-full","w-(--drawer-content-width,100%)","max-w-full"]},size:{xs:["[--drawer-content-width:240px]"],sm:["[--drawer-content-width:256px]"],md:["[--drawer-content-width:288px]"],lg:["[--drawer-content-width:304px]"],xl:["[--drawer-content-width:320px]"],"2xl":["[--drawer-content-width:720px]"],"3xl":["[--drawer-content-width:1000px]"]}}}),w=({children:o,...r})=>{const{position:i}=t.useContext(c);return t.createElement(l,null,t.createElement(s,null),t.createElement(d,{base:"grey1",accent:"primary1",asChild:!0},t.createElement(e,{size:"lg",position:i,...r,asChild:!0},t.createElement(a,{direction:"column"},o))))};export{w as DrawerContent,e as StyledContent};
 //# sourceMappingURL=DrawerContent.js.map

package/dist/components/drawer/DrawerContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"DrawerContent.js","sources":["../../../src/components/drawer/DrawerContent.tsx"],"sourcesContent":["import { Content, Portal } from '@radix-ui/react-dialog'\nimport React from 'react'\n\nimport { Flex } from '~/components/flex'\nimport { DIALOG_Z_INDEX } from '~/constants/zIndices'\nimport { ColorScheme } from '~/experiments/color-scheme'\nimport { styled } from '~/stitches'\nimport { slideInOut } from '~/utilities'\n\nimport { DrawerContext } from './Drawer.context'\nimport { DrawerOverlay } from './DrawerOverlay'\n\nconst animationTop = slideInOut({ outPosition: { x: 0, y: '-100%' } })\nconst animationRight = slideInOut({ outPosition: { x: '100%', y: 0 } })\nconst animationBottom = slideInOut({ outPosition: { x: 0, y: '100%' } })\nconst animationLeft = slideInOut({ outPosition: { x: '-100%', y: 0 } })\nconst setupAnimation = (animation: ReturnType<typeof slideInOut>) => {\n  return {\n    '&[data-state=\"open\"]': {\n      animationName: animation.in\n    },\n    '&[data-state=\"closed\"]': {\n      animationName: animation.out\n    }\n  }\n}\n\nconst positionY = {\n  left: 0,\n  width: '100%',\n  maxHeight: '85%'\n}\n\nconst positionX = {\n  top: 0,\n  height: '100%',\n  width: 'var(--drawer-content-width, 100%)',\n  maxWidth: '100%'\n}\n\nexport const StyledContent = styled(Content, {\n  bg: '$base1',\n  boxShadow: '$2',\n  position: 'fixed',\n  zIndex: DIALOG_Z_INDEX,\n  '@allowMotion': {\n    animationTimingFunction: 'ease-out',\n    animationDuration: '250ms'\n  },\n  variants: {\n    position: {\n      top: {\n        top: 0,\n        ...positionY,\n        ...setupAnimation(animationTop)\n      },\n      right: {\n        right: 0,\n        ...positionX,\n        ...setupAnimation(animationRight)\n      },\n      bottom: {\n        bottom: 0,\n        ...positionY,\n        ...setupAnimation(animationBottom)\n      },\n      left: {\n        left: 0,\n        ...positionX,\n        ...setupAnimation(animationLeft)\n      }\n    },\n    size: {\n      xs: {\n        '--drawer-content-width': '240px'\n      },\n      sm: {\n        '--drawer-content-width': '256px'\n      },\n      md: {\n        '--drawer-content-width': '288px'\n      },\n      lg: {\n        '--drawer-content-width': '304px'\n      },\n      xl: {\n        '--drawer-content-width': '320px'\n      },\n      '2xl': {\n        '--drawer-content-width': '720px'\n      },\n      '3xl': {\n        '--drawer-content-width': '1000px'\n      }\n    }\n  }\n})\n\nexport const DrawerContent = ({\n  children,\n  ...rest\n}: React.ComponentProps<typeof StyledContent>) => {\n  const { position } = React.useContext(DrawerContext)\n\n  return (\n    <Portal>\n      <DrawerOverlay />\n      <ColorScheme base=\"grey1\" accent=\"primary1\" asChild>\n        <StyledContent size=\"lg\" position={position} {...rest} asChild>\n          <Flex direction=\"column\">{children}</Flex>\n        </StyledContent>\n      </ColorScheme>\n    </Portal>\n  )\n}\n"],"names":["animationTop","slideInOut","animationRight","animationBottom","animationLeft","setupAnimation","animation","positionY","positionX","StyledContent","styled","Content","DIALOG_Z_INDEX","DrawerContent","children","rest","position","React","DrawerContext","Portal","DrawerOverlay","ColorScheme","Flex"],"mappings":"imBAYA,MAAMA,EAAeC,EAAW,CAAE,YAAa,CAAE,EAAG,EAAG,EAAG,OAAQ,CAAE,CAAC,EAC/DC,EAAiBD,EAAW,CAAE,YAAa,CAAE,EAAG,OAAQ,EAAG,CAAE,CAAE,CAAC,EAChEE,EAAkBF,EAAW,CAAE,YAAa,CAAE,EAAG,EAAG,EAAG,MAAO,CAAE,CAAC,EACjEG,EAAgBH,EAAW,CAAE,YAAa,CAAE,EAAG,QAAS,EAAG,CAAE,CAAE,CAAC,EAChEI,EAAkBC,IACf,CACL,uBAAwB,CACtB,cAAeA,EAAU,EAC3B,EACA,yBAA0B,CACxB,cAAeA,EAAU,GAC3B,CACF,GAGIC,EAAY,CAChB,KAAM,EACN,MAAO,OACP,UAAW,KACb,EAEMC,EAAY,CAChB,IAAK,EACL,OAAQ,OACR,MAAO,oCACP,SAAU,MACZ,EAEaC,EAAgBC,EAAOC,EAAS,CAC3C,GAAI,SACJ,UAAW,KACX,SAAU,QACV,OAAQC,EACR,eAAgB,CACd,wBAAyB,WACzB,kBAAmB,OACrB,EACA,SAAU,CACR,SAAU,CACR,IAAK,CACH,IAAK,EACL,GAAGL,EACH,GAAGF,EAAeL,CAAY,CAChC,EACA,MAAO,CACL,MAAO,EACP,GAAGQ,EACH,GAAGH,EAAeH,CAAc,CAClC,EACA,OAAQ,CACN,OAAQ,EACR,GAAGK,EACH,GAAGF,EAAeF,CAAe,CACnC,EACA,KAAM,CACJ,KAAM,EACN,GAAGK,EACH,GAAGH,EAAeD,CAAa,CACjC,CACF,EACA,KAAM,CACJ,GAAI,CACF,yBAA0B,OAC5B,EACA,GAAI,CACF,yBAA0B,OAC5B,EACA,GAAI,CACF,yBAA0B,OAC5B,EACA,GAAI,CACF,yBAA0B,OAC5B,EACA,GAAI,CACF,yBAA0B,OAC5B,EACA,MAAO,CACL,yBAA0B,OAC5B,EACA,MAAO,CACL,yBAA0B,QAC5B,CACF,CACF,CACF,CAAC,EAEYS,EAAgB,CAAC,CAC5B,SAAAC,KACGC,CACL,IAAkD,CAChD,KAAM,CAAE,SAAAC,CAAS,EAAIC,EAAM,WAAWC,CAAa,EAEnD,OACED,EAAA,cAACE,EAAA,KACCF,EAAA,cAACG,EAAA,IAAc,EACfH,EAAA,cAACI,EAAA,CAAY,KAAK,QAAQ,OAAO,WAAW,QAAO,EACjDJ,EAAAA,EAAA,cAACR,EAAc,CAAA,KAAK,KAAK,SAAUO,EAAW,GAAGD,EAAM,QAAO,IAC5DE,EAAA,cAACK,EAAA,CAAK,UAAU,QAAUR,EAAAA,CAAS,CACrC,CACF,CACF,CAEJ"}
+{"version":3,"file":"DrawerContent.js","sources":["../../../src/components/drawer/DrawerContent.tsx"],"sourcesContent":["import { Content, Portal } from '@radix-ui/react-dialog'\nimport React from 'react'\n\nimport { Flex } from '~/components/flex'\nimport { ColorScheme } from '~/experiments/color-scheme'\nimport { styled } from '~/styled'\n\nimport { DrawerContext } from './Drawer.context'\nimport { DrawerOverlay } from './DrawerOverlay'\n\nexport const StyledContent = styled(Content, {\n  base: [\n    'bg-(--base-1)',\n    'shadow-lg',\n    'fixed',\n    'z-1147483646',\n    'motion-safe:data-[state=open]:animate-slide-direction-in',\n    'motion-safe:data-[state=closed]:animate-slide-direction-out'\n  ],\n  variants: {\n    position: {\n      top: [\n        '[--slide-direction-out-y:-100%]',\n        'top-0',\n        'left-0',\n        'w-full',\n        'max-h-17/20'\n      ],\n      right: [\n        '[--slide-direction-out-x:100%]',\n        'right-0',\n        'top-0',\n        'h-full',\n        'w-(--drawer-content-width,100%)',\n        'max-w-full'\n      ],\n      bottom: [\n        '[--slide-direction-out-y:100%]',\n        'bottom-0',\n        'left-0',\n        'w-full',\n        'max-h-17/20'\n      ],\n      left: [\n        '[--slide-direction-out-x:-100%]',\n        'left-0',\n        'top-0',\n        'h-full',\n        'w-(--drawer-content-width,100%)',\n        'max-w-full'\n      ]\n    },\n    size: {\n      xs: ['[--drawer-content-width:240px]'],\n      sm: ['[--drawer-content-width:256px]'],\n      md: ['[--drawer-content-width:288px]'],\n      lg: ['[--drawer-content-width:304px]'],\n      xl: ['[--drawer-content-width:320px]'],\n      '2xl': ['[--drawer-content-width:720px]'],\n      '3xl': ['[--drawer-content-width:1000px]']\n    }\n  }\n})\n\nexport const DrawerContent = ({\n  children,\n  ...rest\n}: React.ComponentProps<typeof StyledContent>) => {\n  const { position } = React.useContext(DrawerContext)\n\n  return (\n    <Portal>\n      <DrawerOverlay />\n      <ColorScheme base=\"grey1\" accent=\"primary1\" asChild>\n        <StyledContent size=\"lg\" position={position} {...rest} asChild>\n          <Flex direction=\"column\">{children}</Flex>\n        </StyledContent>\n      </ColorScheme>\n    </Portal>\n  )\n}\n"],"names":["StyledContent","styled","Content","DrawerContent","children","rest","position","React","DrawerContext","Portal","DrawerOverlay","ColorScheme","Flex"],"mappings":"2VAUaA,EAAgBC,EAAOC,EAAS,CAC3C,KAAM,CACJ,gBACA,YACA,QACA,eACA,2DACA,6DACF,EACA,SAAU,CACR,SAAU,CACR,IAAK,CACH,kCACA,QACA,SACA,SACA,aACF,EACA,MAAO,CACL,iCACA,UACA,QACA,SACA,kCACA,YACF,EACA,OAAQ,CACN,iCACA,WACA,SACA,SACA,aACF,EACA,KAAM,CACJ,kCACA,SACA,QACA,SACA,kCACA,YACF,CACF,EACA,KAAM,CACJ,GAAI,CAAC,gCAAgC,EACrC,GAAI,CAAC,gCAAgC,EACrC,GAAI,CAAC,gCAAgC,EACrC,GAAI,CAAC,gCAAgC,EACrC,GAAI,CAAC,gCAAgC,EACrC,MAAO,CAAC,gCAAgC,EACxC,MAAO,CAAC,iCAAiC,CAC3C,CACF,CACF,CAAC,EAEYC,EAAgB,CAAC,CAC5B,SAAAC,EACA,GAAGC,CACL,IAAkD,CAChD,KAAM,CAAE,SAAAC,CAAS,EAAIC,EAAM,WAAWC,CAAa,EAEnD,OACED,EAAA,cAACE,EAAA,KACCF,EAAA,cAACG,EAAA,IAAc,EACfH,EAAA,cAACI,EAAA,CAAY,KAAK,QAAQ,OAAO,WAAW,QAAO,EAAA,EACjDJ,EAAA,cAACP,GAAc,KAAK,KAAK,SAAUM,EAAW,GAAGD,EAAM,QAAO,EAAA,EAC5DE,EAAA,cAACK,EAAA,CAAK,UAAU,QAAA,EAAUR,CAAS,CACrC,CACF,CACF,CAEJ"}

package/dist/components/drawer/DrawerFooter.js

@@ -1,2 +1,2 @@
-import{styled as o}from"../../stitches.js";import{drawerSection as r}from"./Drawer.styles.js";const e=o("div",{...r,borderTop:"1px solid $base3"});export{e as DrawerFooter};
+import{styled as r}from"../../styled.js";const e=r("div",{base:["p-4","w-full","border-t","border-t-(--base-3)"]});export{e as DrawerFooter};
 //# sourceMappingURL=DrawerFooter.js.map

package/dist/components/drawer/DrawerFooter.js.map

@@ -1 +1 @@
-{"version":3,"file":"DrawerFooter.js","sources":["../../../src/components/drawer/DrawerFooter.tsx"],"sourcesContent":["import { styled } from '~/stitches'\n\nimport { drawerSection } from './Drawer.styles'\n\nexport const DrawerFooter = styled('div', {\n  ...drawerSection,\n  borderTop: '1px solid $base3'\n})\n"],"names":["DrawerFooter","styled","drawerSection"],"mappings":"8FAIO,MAAMA,EAAeC,EAAO,MAAO,CACxC,GAAGC,EACH,UAAW,kBACb,CAAC"}
+{"version":3,"file":"DrawerFooter.js","sources":["../../../src/components/drawer/DrawerFooter.tsx"],"sourcesContent":["import { styled } from '~/styled'\n\nexport const DrawerFooter = styled('div', {\n  base: ['p-4', 'w-full', 'border-t', 'border-t-(--base-3)']\n})\n"],"names":["DrawerFooter","styled"],"mappings":"yCAEO,MAAMA,EAAeC,EAAO,MAAO,CACxC,KAAM,CAAC,MAAO,SAAU,WAAY,qBAAqB,CAC3D,CAAC"}

package/dist/components/drawer/DrawerHeader.js

@@ -1,2 +1,2 @@
-import{styled as r}from"../../stitches.js";import{drawerSection as o}from"./Drawer.styles.js";const e=r("div",{...o,minHeight:"$6",borderBottom:"1px solid $base3"});export{e as DrawerHeader};
+import{styled as r}from"../../styled.js";const e=r("div",{base:["p-4","w-full","min-h-16","border-b","border-b-(--base-3)"]});export{e as DrawerHeader};
 //# sourceMappingURL=DrawerHeader.js.map

package/dist/components/drawer/DrawerHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"DrawerHeader.js","sources":["../../../src/components/drawer/DrawerHeader.tsx"],"sourcesContent":["import { styled } from '~/stitches'\n\nimport { drawerSection } from './Drawer.styles'\n\nexport const DrawerHeader = styled('div', {\n  ...drawerSection,\n  minHeight: '$6', // At least the height of the TopBar\n  borderBottom: '1px solid $base3'\n})\n"],"names":["DrawerHeader","styled","drawerSection"],"mappings":"8FAIa,MAAAA,EAAeC,EAAO,MAAO,CACxC,GAAGC,EACH,UAAW,KACX,aAAc,kBAChB,CAAC"}
+{"version":3,"file":"DrawerHeader.js","sources":["../../../src/components/drawer/DrawerHeader.tsx"],"sourcesContent":["import { styled } from '~/styled'\n\nexport const DrawerHeader = styled('div', {\n  base: ['p-4', 'w-full', 'min-h-16', 'border-b', 'border-b-(--base-3)']\n})\n"],"names":["DrawerHeader","styled"],"mappings":"yCAEa,MAAAA,EAAeC,EAAO,MAAO,CACxC,KAAM,CAAC,MAAO,SAAU,WAAY,WAAY,qBAAqB,CACvE,CAAC"}

package/dist/components/drawer/DrawerMain.js

@@ -1,2 +1,2 @@
-import{styled as o}from"../../stitches.js";import{drawerSection as r}from"./Drawer.styles.js";const e=o("div",{...r,flexGrow:1,overflowY:"auto"});export{e as DrawerMain};
+import{styled as o}from"../../styled.js";const r=o("div",{base:["p-4","w-full","grow","overflow-y-auto"]});export{r as DrawerMain};
 //# sourceMappingURL=DrawerMain.js.map

package/dist/components/drawer/DrawerMain.js.map

@@ -1 +1 @@
-{"version":3,"file":"DrawerMain.js","sources":["../../../src/components/drawer/DrawerMain.tsx"],"sourcesContent":["import { styled } from '~/stitches'\n\nimport { drawerSection } from './Drawer.styles'\n\nexport const DrawerMain = styled('div', {\n  ...drawerSection,\n  flexGrow: 1,\n  overflowY: 'auto'\n})\n"],"names":["DrawerMain","styled","drawerSection"],"mappings":"8FAIa,MAAAA,EAAaC,EAAO,MAAO,CACtC,GAAGC,EACH,SAAU,EACV,UAAW,MACb,CAAC"}
+{"version":3,"file":"DrawerMain.js","sources":["../../../src/components/drawer/DrawerMain.tsx"],"sourcesContent":["import { styled } from '~/styled'\n\nexport const DrawerMain = styled('div', {\n  base: ['p-4', 'w-full', 'grow', 'overflow-y-auto']\n})\n"],"names":["DrawerMain","styled"],"mappings":"yCAEO,MAAMA,EAAaC,EAAO,MAAO,CACtC,KAAM,CAAC,MAAO,SAAU,OAAQ,iBAAiB,CACnD,CAAC"}

package/dist/components/drawer/DrawerOverlay.js

@@ -1,2 +1,2 @@
-import{Overlay as r}from"@radix-ui/react-dialog";import{styled as o}from"../../stitches.js";import{backdropOverlay as e}from"../../utilities/style/backdrop-overlay.js";const m=o(r,e);export{m as DrawerOverlay};
+import{Overlay as r}from"@radix-ui/react-dialog";import{styled as o}from"../../styled.js";import{backdropOverlay as e}from"../../utilities/style/backdrop-overlay.js";const a=o(r,{base:e});export{a as DrawerOverlay};
 //# sourceMappingURL=DrawerOverlay.js.map

package/dist/components/drawer/DrawerOverlay.js.map

@@ -1 +1 @@
-{"version":3,"file":"DrawerOverlay.js","sources":["../../../src/components/drawer/DrawerOverlay.tsx"],"sourcesContent":["import { Overlay } from '@radix-ui/react-dialog'\n\nimport { styled } from '~/stitches'\nimport { backdropOverlay } from '~/utilities/style/backdrop-overlay'\n\nexport const DrawerOverlay = styled(Overlay, backdropOverlay)\n"],"names":["DrawerOverlay","styled","Overlay","backdropOverlay"],"mappings":"wKAKO,MAAMA,EAAgBC,EAAOC,EAASC,CAAe"}
+{"version":3,"file":"DrawerOverlay.js","sources":["../../../src/components/drawer/DrawerOverlay.tsx"],"sourcesContent":["import { Overlay } from '@radix-ui/react-dialog'\n\nimport { styled } from '~/styled'\nimport { backdropOverlay } from '~/utilities/style/backdrop-overlay'\n\nexport const DrawerOverlay = styled(Overlay, { base: backdropOverlay })\n"],"names":["DrawerOverlay","styled","Overlay","backdropOverlay"],"mappings":"4KAKaA,EAAgBC,EAAOC,EAAS,CAAE,KAAMC,CAAgB,CAAC"}

package/dist/components/drawer/DrawerTrigger.js

@@ -1,2 +1,2 @@
-import{Trigger as r}from"@radix-ui/react-dialog";import{styled as o}from"../../stitches.js";const e=o(r,{});export{e as DrawerTrigger};
+import{Trigger as r}from"@radix-ui/react-dialog";const e=r;export{e as DrawerTrigger};
 //# sourceMappingURL=DrawerTrigger.js.map

package/dist/components/drawer/DrawerTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"DrawerTrigger.js","sources":["../../../src/components/drawer/DrawerTrigger.tsx"],"sourcesContent":["import { Trigger } from '@radix-ui/react-dialog'\n\nimport { styled } from '~/stitches'\n\nexport const DrawerTrigger = styled(Trigger, {})\n"],"names":["DrawerTrigger","styled","Trigger"],"mappings":"4FAIO,MAAMA,EAAgBC,EAAOC,EAAS,CAAE,CAAA"}
+{"version":3,"file":"DrawerTrigger.js","sources":["../../../src/components/drawer/DrawerTrigger.tsx"],"sourcesContent":["import { Trigger } from '@radix-ui/react-dialog'\n\nexport const DrawerTrigger = Trigger\n"],"names":["DrawerTrigger","Trigger"],"mappings":"iDAEO,MAAMA,EAAgBC"}

package/dist/components/dropdown-menu/DropdownMenu.js

@@ -1,2 +1,2 @@
-import{Root as o,Portal as r}from"@radix-ui/react-dropdown-menu";import{styled as t}from"../../stitches.js";import{DropdownMenuContent as n}from"./DropdownMenuContent.js";import{DropdownMenuItem as e}from"./DropdownMenuItem.js";import{DropdownMenuLinkItem as m}from"./DropdownMenuLinkItem.js";import{DropdownMenuSeparator as p}from"./DropdownMenuSeparator.js";import{DropdownMenuTrigger as i}from"./DropdownMenuTrigger.js";const a=t(o,{}),d=Object.assign(a,{Content:n,Item:e,LinkItem:m,Portal:r,Separator:p,Trigger:i});export{d as DropdownMenu};
+import{Root as o,Portal as r}from"@radix-ui/react-dropdown-menu";import{DropdownMenuContent as t}from"./DropdownMenuContent.js";import{DropdownMenuItem as n}from"./DropdownMenuItem.js";import{DropdownMenuLinkItem as e}from"./DropdownMenuLinkItem.js";import{DropdownMenuSeparator as m}from"./DropdownMenuSeparator.js";import{DropdownMenuTrigger as p}from"./DropdownMenuTrigger.js";const i=Object.assign(o,{Content:t,Item:n,LinkItem:e,Portal:r,Separator:m,Trigger:p});export{i as DropdownMenu};
 //# sourceMappingURL=DropdownMenu.js.map

package/dist/components/dropdown-menu/DropdownMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownMenu.js","sources":["../../../src/components/dropdown-menu/DropdownMenu.tsx"],"sourcesContent":["import { Portal, Root as DropdownMenuRoot } from '@radix-ui/react-dropdown-menu'\nimport React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { DropdownMenuContent } from './DropdownMenuContent'\nimport { DropdownMenuItem } from './DropdownMenuItem'\nimport { DropdownMenuLinkItem } from './DropdownMenuLinkItem'\nimport { DropdownMenuSeparator } from './DropdownMenuSeparator'\nimport { DropdownMenuTrigger } from './DropdownMenuTrigger'\n\nconst Root = styled(DropdownMenuRoot, {})\n\nexport const DropdownMenu = Object.assign(Root, {\n  Content: DropdownMenuContent,\n  Item: DropdownMenuItem,\n  LinkItem: DropdownMenuLinkItem,\n  Portal: Portal,\n  Separator: DropdownMenuSeparator,\n  Trigger: DropdownMenuTrigger\n})\n"],"names":["Root","styled","DropdownMenuRoot","DropdownMenu","DropdownMenuContent","DropdownMenuItem","DropdownMenuLinkItem","Portal","DropdownMenuSeparator","DropdownMenuTrigger"],"mappings":"uaAWA,MAAMA,EAAOC,EAAOC,EAAkB,EAAE,EAE3BC,EAAe,OAAO,OAAOH,EAAM,CAC9C,QAASI,EACT,KAAMC,EACN,SAAUC,EACV,OAAQC,EACR,UAAWC,EACX,QAASC,CACX,CAAC"}
+{"version":3,"file":"DropdownMenu.js","sources":["../../../src/components/dropdown-menu/DropdownMenu.tsx"],"sourcesContent":["import { Root as DropdownMenuRoot, Portal } from '@radix-ui/react-dropdown-menu'\nimport React from 'react'\n\nimport { DropdownMenuContent } from './DropdownMenuContent'\nimport { DropdownMenuItem } from './DropdownMenuItem'\nimport { DropdownMenuLinkItem } from './DropdownMenuLinkItem'\nimport { DropdownMenuSeparator } from './DropdownMenuSeparator'\nimport { DropdownMenuTrigger } from './DropdownMenuTrigger'\n\nexport const DropdownMenu = Object.assign(DropdownMenuRoot, {\n  Content: DropdownMenuContent,\n  Item: DropdownMenuItem,\n  LinkItem: DropdownMenuLinkItem,\n  Portal: Portal,\n  Separator: DropdownMenuSeparator,\n  Trigger: DropdownMenuTrigger\n})\n"],"names":["DropdownMenu","DropdownMenuRoot","DropdownMenuContent","DropdownMenuItem","DropdownMenuLinkItem","Portal","DropdownMenuSeparator","DropdownMenuTrigger"],"mappings":"4XASa,MAAAA,EAAe,OAAO,OAAOC,EAAkB,CAC1D,QAASC,EACT,KAAMC,EACN,SAAUC,EACV,OAAQC,EACR,UAAWC,EACX,QAASC,CACX,CAAC"}

package/dist/components/dropdown-menu/DropdownMenuContent.js

@@ -1,2 +1,2 @@
-import{Content as i}from"@radix-ui/react-dropdown-menu";import{DROPDOWN_Z_INDEX as t}from"../../constants/zIndices.js";import{styled as a}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import{slideDownAndFade as o,slideLeftAndFade as n,slideUpAndFade as e,slideRightAndFade as d}from"../../utilities/style/keyframe-animations.js";const m=a(i,{bg:"white",borderRadius:"$0",boxShadow:"$0",py:"$2",zIndex:t,"@allowMotion":{animationDuration:"250ms",animationTimingFunction:"cubic-bezier(0.16, 1, 0.3, 1)",willChange:"transform, opacity",'&[data-state="open"]':{'&[data-side="top"]':{animationName:o},'&[data-side="right"]':{animationName:n},'&[data-side="bottom"]':{animationName:e},'&[data-side="left"]':{animationName:d}}}});export{m as DropdownMenuContent};
+import{Content as t}from"@radix-ui/react-dropdown-menu";import{styled as e}from"../../styled.js";const o=e(t,{base:["bg-white","rounded-sm","shadow-sm","py-2","z-10","[--slide-opacity-out:0]","data-[side=top]:[--slide-direction-out-y:-4px]","data-[side=right]:[--slide-direction-out-x:4px]","data-[side=bottom]:[--slide-direction-out-y:4px]","data-[side=left]:[--slide-direction-out-x:-4px]","motion-safe:data-[state=open]:animate-slide-direction-in","motion-safe:data-[state=closed]:animate-slide-direction-out"]});export{o as DropdownMenuContent};
 //# sourceMappingURL=DropdownMenuContent.js.map