@atom-learning/components 2.67.0 → 2.67.2

package/CHANGELOG.md

@@ -1,9 +1,12 @@
-# [2.67.0](https://github.com/Atom-Learning/components/compare/v2.66.14...v2.67.0) (2023-09-12)
+## [2.67.2](https://github.com/Atom-Learning/components/compare/v2.67.1...v2.67.2) (2023-09-14)
 
 
-### Features
+### Bug Fixes
 
-* add subRow support to DataTable SP-1745 ([4f7cff0](https://github.com/Atom-Learning/components/commit/4f7cff09bb98c54b886803670fb7b187fbe55389))
+* actually fix DateInput and make it behave like a regular FormField when used within a Form ([cc10c9d](https://github.com/Atom-Learning/components/commit/cc10c9d702e069b8a51c23915ad8397e08575638))
+* better test for DateInput onChange ([be1d3b2](https://github.com/Atom-Learning/components/commit/be1d3b2d19c06a0816de68d318a3f2918e544c5f))
+* DateInput controlled input combined with form validation glitching ([f995f59](https://github.com/Atom-Learning/components/commit/f995f592606786bcd9a0cf98b535f315862808a0))
+* get DateInput onChange to trigger only onChange as a regular handler would rather than onStateChange ([85fcd4c](https://github.com/Atom-Learning/components/commit/85fcd4c97e9b858bb5c14a1ee605d73a37509313))
 
 # [1.4.0](https://github.com/Atom-Learning/components/compare/v1.3.0...v1.4.0) (2022-04-11)
 

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

@@ -1 +1 @@
-{"version":3,"file":"DataTableContext.js","sources":["../../../src/components/data-table/DataTableContext.tsx"],"sourcesContent":["import { v4 as uuid } from '@lukeed/uuid'\nimport type {\n  PaginationState,\n  ExpandedState,\n  Row,\n  RowSelectionState\n} from '@tanstack/react-table'\nimport {\n  getCoreRowModel,\n  getExpandedRowModel,\n  getFilteredRowModel,\n  getPaginationRowModel,\n  getSortedRowModel,\n  useReactTable\n} from '@tanstack/react-table'\nimport * as React from 'react'\nimport useDeepCompareEffect from 'use-deep-compare-effect'\n\nimport {\n  AsyncDataState,\n  DataTableContextType,\n  InitialState,\n  TableData,\n  TAsyncDataOptions,\n  TAsyncDataResult,\n  TDefaultSort,\n  TGetAsyncData\n} from './DataTable.types'\nimport { getNewAsyncData } from './getNewAsyncData'\nimport { usePagination } from './usePagination'\nimport { useSortByColumn } from './useSorting'\n\nconst DataTableContext =\n  React.createContext<DataTableContextType<unknown> | null>(null)\n\ntype DataTableProviderProps = {\n  columns\n  defaultSort?: TDefaultSort\n  children: React.ReactNode\n  initialState?: InitialState\n  enableRowSelection?: boolean | ((row: Row<unknown>) => boolean)\n} & (\n  | { data: TableData; getAsyncData?: never }\n  | { data?: never; getAsyncData: TGetAsyncData }\n)\n\nexport const DataTableProvider = ({\n  columns,\n  data: dataProp = [],\n  getAsyncData,\n  defaultSort,\n  initialState = undefined,\n  enableRowSelection,\n  children\n}: DataTableProviderProps): JSX.Element => {\n  const tableId = React.useRef(uuid())\n\n  const [data, setData] = React.useState<TAsyncDataResult>({\n    results: dataProp ?? [],\n    total: dataProp?.length ?? 0\n  })\n\n  const [rowSelection, setRowSelection] = React.useState<RowSelectionState>({})\n  const [expanded, setExpanded] = React.useState<ExpandedState>({})\n\n  const { isPaginated, applyPagination, paginationState, setPaginationState } =\n    usePagination(initialState?.pagination)\n\n  const [asyncDataState, setAsyncDataState] = React.useState<AsyncDataState>(\n    AsyncDataState.NONE\n  )\n\n  const [globalFilter, setGlobalFilter] = React.useState<string>('')\n\n  const { setIsSortable, isSortable, sorting, setSorting } =\n    useSortByColumn(defaultSort)\n\n  const runAsyncData = React.useCallback(\n    async (overrideAsyncDataOptions: Partial<TAsyncDataOptions>) => {\n      if (!getAsyncData) return\n\n      try {\n        setAsyncDataState(AsyncDataState.PENDING)\n\n        const newData = await getNewAsyncData(\n          getAsyncData,\n          overrideAsyncDataOptions,\n          paginationState as PaginationState,\n          sorting,\n          globalFilter\n        )\n\n        setData(newData as TAsyncDataResult)\n        setAsyncDataState(AsyncDataState.FULFILLED)\n      } catch (error) {\n        setAsyncDataState(AsyncDataState.REJECTED)\n      }\n    },\n    [\n      getAsyncData,\n      paginationState?.pageIndex,\n      paginationState?.pageSize,\n      sorting,\n      globalFilter\n    ]\n  )\n\n  React.useEffect(() => {\n    runAsyncData({})\n  }, [runAsyncData])\n\n  useDeepCompareEffect(() => {\n    if (!dataProp) return\n\n    setData({ results: dataProp, total: dataProp.length })\n  }, [dataProp])\n\n  const getTotalRows = () => data.total\n\n  const table = useReactTable<unknown>({\n    columns,\n    data: data.results,\n    pageCount: paginationState\n      ? Math.ceil(getTotalRows() / paginationState.pageSize)\n      : -1,\n    initialState: initialState,\n    state: {\n      sorting,\n      globalFilter,\n      pagination: paginationState,\n      rowSelection,\n      expanded\n    },\n    manualPagination: getAsyncData && isPaginated,\n    manualSorting: getAsyncData && isPaginated,\n    enableSorting: asyncDataState !== AsyncDataState.PENDING,\n    enableGlobalFilter: !getAsyncData,\n    enableRowSelection,\n    onExpandedChange: setExpanded,\n    getSubRows: (row: Row<unknown>) => row.subRows,\n    onRowSelectionChange: setRowSelection,\n    getCoreRowModel: getCoreRowModel(),\n    getPaginationRowModel: isPaginated ? getPaginationRowModel() : undefined,\n    getSortedRowModel:\n      isSortable || sorting.length ? getSortedRowModel() : undefined,\n    getFilteredRowModel: getFilteredRowModel(),\n    getExpandedRowModel: getExpandedRowModel(),\n    onPaginationChange: isPaginated ? setPaginationState : undefined,\n    onSortingChange: setSorting,\n    onGlobalFilterChange: setGlobalFilter,\n    globalFilterFn: (row, columnId, filterValue) => {\n      const checkFilterMatchesCell = (cellValue: string) =>\n        cellValue.toLowerCase().includes(filterValue.toLowerCase())\n\n      const value = row.getValue(columnId)\n      switch (typeof value) {\n        case 'string':\n          return checkFilterMatchesCell(value)\n        case 'boolean':\n        case 'number':\n          return checkFilterMatchesCell(String(value))\n        default:\n          return false\n      }\n    }\n  })\n\n  const value: DataTableContextType = React.useMemo(() => {\n    return {\n      ...table,\n      columns,\n      data,\n      setData,\n      setIsSortable,\n      applyPagination,\n      getTotalRows,\n      isSortable,\n      asyncDataState,\n      runAsyncData,\n      enableRowSelection,\n      rowSelection,\n      tableId: tableId.current\n    }\n  }, [\n    table,\n    applyPagination,\n    getTotalRows,\n    isSortable,\n    enableRowSelection,\n    tableId\n  ])\n\n  return (\n    <DataTableContext.Provider value={value}>\n      {children}\n    </DataTableContext.Provider>\n  )\n}\n\nexport const useDataTable = <T extends Record<string, unknown>>() => {\n  const context = React.useContext(DataTableContext) as DataTableContextType<T>\n\n  if (!context)\n    throw new Error(\n      'useDataTable can only be called from inside a DataTableProvider'\n    )\n\n  return context\n}\n"],"names":["DataTableContext","React","DataTableProvider","columns","dataProp","getAsyncData","defaultSort","initialState","enableRowSelection","children","_a","tableId","uuid","data","setData","rowSelection","setRowSelection","expanded","setExpanded","isPaginated","applyPagination","paginationState","setPaginationState","usePagination","asyncDataState","setAsyncDataState","AsyncDataState","globalFilter","setGlobalFilter","setIsSortable","isSortable","sorting","setSorting","useSortByColumn","runAsyncData","overrideAsyncDataOptions","newData","getNewAsyncData","useDeepCompareEffect","getTotalRows","table","useReactTable","row","getCoreRowModel","getPaginationRowModel","getSortedRowModel","getFilteredRowModel","getExpandedRowModel","columnId","filterValue","checkFilterMatchesCell","cellValue","value","useDataTable","context"],"mappings":"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"}
+{"version":3,"file":"DataTableContext.js","sources":["../../../src/components/data-table/DataTableContext.tsx"],"sourcesContent":["import { v4 as uuid } from '@lukeed/uuid'\nimport type {\n  ExpandedState,\n  PaginationState,\n  Row,\n  RowSelectionState\n} from '@tanstack/react-table'\nimport {\n  getCoreRowModel,\n  getExpandedRowModel,\n  getFilteredRowModel,\n  getPaginationRowModel,\n  getSortedRowModel,\n  useReactTable\n} from '@tanstack/react-table'\nimport * as React from 'react'\nimport useDeepCompareEffect from 'use-deep-compare-effect'\n\nimport {\n  AsyncDataState,\n  DataTableContextType,\n  InitialState,\n  TableData,\n  TAsyncDataOptions,\n  TAsyncDataResult,\n  TDefaultSort,\n  TGetAsyncData\n} from './DataTable.types'\nimport { getNewAsyncData } from './getNewAsyncData'\nimport { usePagination } from './usePagination'\nimport { useSortByColumn } from './useSorting'\n\nconst DataTableContext =\n  React.createContext<DataTableContextType<unknown> | null>(null)\n\ntype DataTableProviderProps = {\n  columns\n  defaultSort?: TDefaultSort\n  children: React.ReactNode\n  initialState?: InitialState\n  enableRowSelection?: boolean | ((row: Row<unknown>) => boolean)\n} & (\n  | { data: TableData; getAsyncData?: never }\n  | { data?: never; getAsyncData: TGetAsyncData }\n)\n\nexport const DataTableProvider = ({\n  columns,\n  data: dataProp = [],\n  getAsyncData,\n  defaultSort,\n  initialState = undefined,\n  enableRowSelection,\n  children\n}: DataTableProviderProps): JSX.Element => {\n  const tableId = React.useRef(uuid())\n\n  const [data, setData] = React.useState<TAsyncDataResult>({\n    results: dataProp ?? [],\n    total: dataProp?.length ?? 0\n  })\n\n  const [rowSelection, setRowSelection] = React.useState<RowSelectionState>({})\n  const [expanded, setExpanded] = React.useState<ExpandedState>({})\n\n  const { isPaginated, applyPagination, paginationState, setPaginationState } =\n    usePagination(initialState?.pagination)\n\n  const [asyncDataState, setAsyncDataState] = React.useState<AsyncDataState>(\n    AsyncDataState.NONE\n  )\n\n  const [globalFilter, setGlobalFilter] = React.useState<string>('')\n\n  const { setIsSortable, isSortable, sorting, setSorting } =\n    useSortByColumn(defaultSort)\n\n  const runAsyncData = React.useCallback(\n    async (overrideAsyncDataOptions: Partial<TAsyncDataOptions>) => {\n      if (!getAsyncData) return\n\n      try {\n        setAsyncDataState(AsyncDataState.PENDING)\n\n        const newData = await getNewAsyncData(\n          getAsyncData,\n          overrideAsyncDataOptions,\n          paginationState as PaginationState,\n          sorting,\n          globalFilter\n        )\n\n        setData(newData as TAsyncDataResult)\n        setAsyncDataState(AsyncDataState.FULFILLED)\n      } catch (error) {\n        setAsyncDataState(AsyncDataState.REJECTED)\n      }\n    },\n    [\n      getAsyncData,\n      paginationState?.pageIndex,\n      paginationState?.pageSize,\n      sorting,\n      globalFilter\n    ]\n  )\n\n  React.useEffect(() => {\n    runAsyncData({})\n  }, [runAsyncData])\n\n  useDeepCompareEffect(() => {\n    if (!dataProp) return\n\n    setData({ results: dataProp, total: dataProp.length })\n  }, [dataProp])\n\n  const getTotalRows = () => data.total\n\n  const table = useReactTable<unknown>({\n    columns,\n    data: data.results,\n    pageCount: paginationState\n      ? Math.ceil(getTotalRows() / paginationState.pageSize)\n      : -1,\n    initialState: initialState,\n    state: {\n      sorting,\n      globalFilter,\n      pagination: paginationState,\n      rowSelection,\n      expanded\n    },\n    manualPagination: getAsyncData && isPaginated,\n    manualSorting: getAsyncData && isPaginated,\n    enableSorting: asyncDataState !== AsyncDataState.PENDING,\n    enableGlobalFilter: !getAsyncData,\n    enableRowSelection,\n    onExpandedChange: setExpanded,\n    getSubRows: (row: Row<unknown>) => row.subRows,\n    onRowSelectionChange: setRowSelection,\n    getCoreRowModel: getCoreRowModel(),\n    getPaginationRowModel: isPaginated ? getPaginationRowModel() : undefined,\n    getSortedRowModel:\n      isSortable || sorting.length ? getSortedRowModel() : undefined,\n    getFilteredRowModel: getFilteredRowModel(),\n    getExpandedRowModel: getExpandedRowModel(),\n    onPaginationChange: isPaginated ? setPaginationState : undefined,\n    onSortingChange: setSorting,\n    onGlobalFilterChange: setGlobalFilter,\n    globalFilterFn: (row, columnId, filterValue) => {\n      const checkFilterMatchesCell = (cellValue: string) =>\n        cellValue.toLowerCase().includes(filterValue.toLowerCase())\n\n      const value = row.getValue(columnId)\n      switch (typeof value) {\n        case 'string':\n          return checkFilterMatchesCell(value)\n        case 'boolean':\n        case 'number':\n          return checkFilterMatchesCell(String(value))\n        default:\n          return false\n      }\n    }\n  })\n\n  const value: DataTableContextType = React.useMemo(() => {\n    return {\n      ...table,\n      columns,\n      data,\n      setData,\n      setIsSortable,\n      applyPagination,\n      getTotalRows,\n      isSortable,\n      asyncDataState,\n      runAsyncData,\n      enableRowSelection,\n      rowSelection,\n      tableId: tableId.current\n    }\n  }, [\n    table,\n    applyPagination,\n    getTotalRows,\n    isSortable,\n    enableRowSelection,\n    tableId\n  ])\n\n  return (\n    <DataTableContext.Provider value={value}>\n      {children}\n    </DataTableContext.Provider>\n  )\n}\n\nexport const useDataTable = <T extends Record<string, unknown>>() => {\n  const context = React.useContext(DataTableContext) as DataTableContextType<T>\n\n  if (!context)\n    throw new Error(\n      'useDataTable can only be called from inside a DataTableProvider'\n    )\n\n  return context\n}\n"],"names":["DataTableContext","React","DataTableProvider","columns","dataProp","getAsyncData","defaultSort","initialState","enableRowSelection","children","_a","tableId","uuid","data","setData","rowSelection","setRowSelection","expanded","setExpanded","isPaginated","applyPagination","paginationState","setPaginationState","usePagination","asyncDataState","setAsyncDataState","AsyncDataState","globalFilter","setGlobalFilter","setIsSortable","isSortable","sorting","setSorting","useSortByColumn","runAsyncData","overrideAsyncDataOptions","newData","getNewAsyncData","useDeepCompareEffect","getTotalRows","table","useReactTable","row","getCoreRowModel","getPaginationRowModel","getSortedRowModel","getFilteredRowModel","getExpandedRowModel","columnId","filterValue","checkFilterMatchesCell","cellValue","value","useDataTable","context"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"DataTableHead.js","sources":["../../../src/components/data-table/DataTableHead.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Table } from '../table'\nimport { DataTableSelectAllRowsCheckbox } from './DataTableSelectAllRowsCheckbox'\nimport { DataTable, useDataTable } from './index'\n\ntype DataTableHeadProps = Omit<\n  React.ComponentProps<typeof Table.Header>,\n  'children'\n> & {\n  sortable?: boolean\n}\n\nexport const DataTableHead: React.FC<DataTableHeadProps> = ({\n  sortable = true,\n  theme = 'light',\n  ...props\n}) => {\n  const {\n    getHeaderGroups,\n    setIsSortable,\n    enableRowSelection,\n    getCanSomeRowsExpand\n  } = useDataTable()\n\n  React.useEffect(() => {\n    setIsSortable(sortable)\n  }, [sortable, setIsSortable])\n\n  return (\n    <Table.Header theme={theme} {...props}>\n      {getHeaderGroups().map((headerGroup) => {\n        return (\n          <Table.Row key={headerGroup.id}>\n            {getCanSomeRowsExpand() && (\n              <Table.HeaderCell css={{ width: '$4' }}></Table.HeaderCell>\n            )}\n            {enableRowSelection && (\n              <Table.HeaderCell css={{ width: '$4' }}>\n                <DataTableSelectAllRowsCheckbox />\n              </Table.HeaderCell>\n            )}\n            {headerGroup.headers.map((header) => (\n              <DataTable.HeaderCell header={header} key={header.id} />\n            ))}\n          </Table.Row>\n        )\n      })}\n    </Table.Header>\n  )\n}\n"],"names":["DataTableHead","sortable","theme","props","getHeaderGroups","setIsSortable","enableRowSelection","getCanSomeRowsExpand","useDataTable","React","Table","headerGroup","DataTableSelectAllRowsCheckbox","header","DataTable"],"mappings":"uPAaa,MAAAA,EAA8C,CAAC,CAC1D,SAAAC,EAAW,GACX,MAAAC,EAAQ,WACLC,CACL,IAAM,CACJ,KAAM,CACJ,gBAAAC,EACA,cAAAC,EACA,mBAAAC,EACA,qBAAAC,CACF,EAAIC,IAEJ,OAAAC,EAAM,UAAU,IAAM,CACpBJ,EAAcJ,CAAQ,CACxB,EAAG,CAACA,EAAUI,CAAa,CAAC,EAG1BI,EAAA,cAACC,EAAM,OAAN,CAAa,MAAOR,EAAQ,GAAGC,CAC7BC,EAAAA,EAAkB,EAAA,IAAKO,GAEpBF,EAAA,cAACC,EAAM,IAAN,CAAU,IAAKC,EAAY,EACzBJ,EAAAA,KACCE,EAAA,cAACC,EAAM,WAAN,CAAiB,IAAK,CAAE,MAAO,IAAK,CAAG,CAAA,EAEzCJ,GACCG,EAAA,cAACC,EAAM,WAAN,CAAiB,IAAK,CAAE,MAAO,IAAK,CACnCD,EAAAA,EAAA,cAACG,EAAA,IAA+B,CAClC,EAEDD,EAAY,QAAQ,IAAKE,GACxBJ,EAAA,cAACK,EAAU,WAAV,CAAqB,OAAQD,EAAQ,IAAKA,EAAO,EAAI,CAAA,CACvD,CACH,CAEH,CACH,CAEJ"}
+{"version":3,"file":"DataTableHead.js","sources":["../../../src/components/data-table/DataTableHead.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Table } from '../table'\nimport { DataTableSelectAllRowsCheckbox } from './DataTableSelectAllRowsCheckbox'\nimport { DataTable, useDataTable } from './index'\n\ntype DataTableHeadProps = Omit<\n  React.ComponentProps<typeof Table.Header>,\n  'children'\n> & {\n  sortable?: boolean\n}\n\nexport const DataTableHead: React.FC<DataTableHeadProps> = ({\n  sortable = true,\n  theme = 'light',\n  ...props\n}) => {\n  const {\n    getHeaderGroups,\n    setIsSortable,\n    enableRowSelection,\n    getCanSomeRowsExpand\n  } = useDataTable()\n\n  React.useEffect(() => {\n    setIsSortable(sortable)\n  }, [sortable, setIsSortable])\n\n  return (\n    <Table.Header theme={theme} {...props}>\n      {getHeaderGroups().map((headerGroup) => {\n        return (\n          <Table.Row key={headerGroup.id}>\n            {getCanSomeRowsExpand() && (\n              <Table.HeaderCell css={{ width: '$4' }} />\n            )}\n            {enableRowSelection && (\n              <Table.HeaderCell css={{ width: '$4' }}>\n                <DataTableSelectAllRowsCheckbox />\n              </Table.HeaderCell>\n            )}\n            {headerGroup.headers.map((header) => (\n              <DataTable.HeaderCell header={header} key={header.id} />\n            ))}\n          </Table.Row>\n        )\n      })}\n    </Table.Header>\n  )\n}\n"],"names":["DataTableHead","sortable","theme","props","getHeaderGroups","setIsSortable","enableRowSelection","getCanSomeRowsExpand","useDataTable","React","Table","headerGroup","DataTableSelectAllRowsCheckbox","header","DataTable"],"mappings":"uPAaa,MAAAA,EAA8C,CAAC,CAC1D,SAAAC,EAAW,GACX,MAAAC,EAAQ,WACLC,CACL,IAAM,CACJ,KAAM,CACJ,gBAAAC,EACA,cAAAC,EACA,mBAAAC,EACA,qBAAAC,CACF,EAAIC,IAEJ,OAAAC,EAAM,UAAU,IAAM,CACpBJ,EAAcJ,CAAQ,CACxB,EAAG,CAACA,EAAUI,CAAa,CAAC,EAG1BI,EAAA,cAACC,EAAM,OAAN,CAAa,MAAOR,EAAQ,GAAGC,CAC7BC,EAAAA,EAAkB,EAAA,IAAKO,GAEpBF,EAAA,cAACC,EAAM,IAAN,CAAU,IAAKC,EAAY,EACzBJ,EAAAA,KACCE,EAAA,cAACC,EAAM,WAAN,CAAiB,IAAK,CAAE,MAAO,IAAK,CAAG,CAAA,EAEzCJ,GACCG,EAAA,cAACC,EAAM,WAAN,CAAiB,IAAK,CAAE,MAAO,IAAK,CACnCD,EAAAA,EAAA,cAACG,EAAA,IAA+B,CAClC,EAEDD,EAAY,QAAQ,IAAKE,GACxBJ,EAAA,cAACK,EAAU,WAAV,CAAqB,OAAQD,EAAQ,IAAKA,EAAO,EAAI,CAAA,CACvD,CACH,CAEH,CACH,CAEJ"}

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

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

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

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

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 u}from"../date-input/DateInput.js";import{FieldWrapper as F}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as g}from"../form/useFieldError.js";const m=({css:a,label:p,name:r,validation:e,prompt:l,description:d,...n})=>{const{register:t,trigger:s}=f(),{error:o}=g(r),c=e?t(e):t;return i.createElement(F,{css:a,description:d,error:o,fieldId:r,label:p,prompt:l,required:Boolean(e==null?void 0:e.required)},i.createElement(u,{id:r,name:r,ref:c,...o&&{state:"error"},...n,revalidate:s}))};m.displayName="DateField";export{m as DateField};
+import*as i from"react";import{useFormContext as u}from"react-hook-form";import{DateInput as F}from"../date-input/DateInput.js";import{FieldWrapper as b}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as g}from"../form/useFieldError.js";const a=({css:m,hideLabel:l,label:p,name:e,validation:r,prompt:d,description:n,...s})=>{const{register:t,trigger:c}=u(),{error:o}=g(e),f=r?t(r):t;return i.createElement(b,{css:m,description:n,error:o,fieldId:e,hideLabel:l,label:p,prompt:d,required:Boolean(r==null?void 0:r.required)},i.createElement(F,{id:e,name:e,ref:f,...o&&{state:"error"},...s,revalidate:c}))};a.displayName="DateField";export{a 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: React.FC<DateFieldProps> = ({\n  css,\n  label,\n  name,\n  validation,\n  prompt,\n  description,\n  ...remainingProps\n}) => {\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      label={label}\n      prompt={prompt}\n      required={Boolean(validation?.required)}\n    >\n      <DateInput\n        id={name}\n        name={name}\n        ref={ref}\n        {...(error && { state: 'error' })}\n        {...remainingProps}\n        revalidate={trigger}\n      />\n    </FieldWrapper>\n  )\n}\n\nDateField.displayName = 'DateField'\n"],"names":["DateField","css","label","name","validation","prompt","description","remainingProps","register","trigger","useFormContext","error","useFieldError","ref","React","FieldWrapper","DateInput"],"mappings":"sUAYaA,EAAsC,CAAC,CAClD,IAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,OAAAC,EACA,YAAAC,KACGC,CACL,IAAM,CACJ,KAAM,CAAE,SAAAC,EAAU,QAAAC,CAAQ,EAAIC,EAAe,EACvC,CAAE,MAAAC,CAAM,EAAIC,EAAcT,CAAI,EAC9BU,EAAMT,EAAaI,EAASJ,CAAU,EAAII,EAEhD,OACEM,EAAA,cAACC,EAAA,CACC,IAAKd,EACL,YAAaK,EACb,MAAOK,EACP,QAASR,EACT,MAAOD,EACP,OAAQG,EACR,SAAU,QAAQD,GAAA,KAAAA,OAAAA,EAAY,QAAQ,CAEtCU,EAAAA,EAAA,cAACE,EAAA,CACC,GAAIb,EACJ,KAAMA,EACN,IAAKU,EACJ,GAAIF,GAAS,CAAE,MAAO,OAAQ,EAC9B,GAAGJ,EACJ,WAAYE,EACd,CACF,CAEJ,EAEAT,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: React.FC<DateFieldProps> = ({\n  css,\n  hideLabel,\n  label,\n  name,\n  validation,\n  prompt,\n  description,\n  ...remainingProps\n}) => {\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    >\n      <DateInput\n        id={name}\n        name={name}\n        ref={ref}\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","remainingProps","register","trigger","useFormContext","error","useFieldError","ref","React","FieldWrapper","DateInput"],"mappings":"gUAYO,MAAMA,EAAsC,CAAC,CAClD,IAAAC,EACA,UAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,OAAAC,EACA,YAAAC,KACGC,CACL,IAAM,CACJ,KAAM,CAAE,SAAAC,EAAU,QAAAC,CAAQ,EAAIC,EACxB,EAAA,CAAE,MAAAC,CAAM,EAAIC,EAAcT,CAAI,EAC9BU,EAAMT,EAAaI,EAASJ,CAAU,EAAII,EAEhD,OACEM,EAAA,cAACC,EAAA,CACC,IAAKf,EACL,YAAaM,EACb,MAAOK,EACP,QAASR,EACT,UAAWF,EACX,MAAOC,EACP,OAAQG,EACR,SAAU,QAAQD,GAAA,KAAA,OAAAA,EAAY,QAAQ,CAAA,EAEtCU,EAAA,cAACE,EAAA,CACC,GAAIb,EACJ,KAAMA,EACN,IAAKU,EACJ,GAAIF,GAAS,CAAE,MAAO,OAAQ,EAC9B,GAAGJ,EACJ,WAAYE,CAAAA,CACd,CACF,CAEJ,EAEAV,EAAU,YAAc"}

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

@@ -1,2 +1,2 @@
-import{CalendarEvent as x}from"@atom-learning/icons";import*as e from"react";import{DIALOG_Z_INDEX as F}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 L}from"../../utilities/style/get-icon-size.js";import{ActionIcon as N}from"../action-icon/ActionIcon.js";import{Box as O}from"../box/Box.js";import{Calendar as _}from"../calendar/Calendar.js";import{DEFAULT_LABELS as k}from"../calendar/constants.js";import{Icon as R}from"../icon/Icon.js";import{Input as B}from"../input/Input.js";import{Popover as r}from"../popover/Popover.js";import{DEFAULT_DATE_FORMAT as M}from"./constants.js";import{useDate as P}from"./use-date.js";const D=e.forwardRef(({initialDate:E,dateFormat:h=M,firstDayOfWeek:g=1,disabled:l,monthNames:I,weekdayNames:b,size:n="md",labels:v,revalidate:o,onChange:m,minDate:y,maxDate:A,...C},w)=>{const{date:a,dateString:z,setDate:i}=P(E,h),s={...k,...v},[S,p]=e.useState(!1),d=e.useRef(null),f=e.useRef(null),T=e.useMemo(()=>L(n),[n]);return e.useEffect(()=>{m==null||m(a)},[a,m]),e.createElement(O,{css:{position:"relative",height:"max-content"}},e.createElement(B,{name:"date",disabled:l,size:n,...C,onChange:t=>i(t.target.value,!0),value:z,ref:w}),e.createElement(r,{modal:!0,open:S,onOpenChange:p},e.createElement(r.Trigger,{asChild:!0},e.createElement(N,{css:{position:"absolute",top:"50%",transform:"translateY(-50%)",right:"0"},disabled:l,label:s.open,size:T,theme:"neutral",hasTooltip:!1},e.createElement(R,{is:x}))),e.createElement(r.Portal,null,e.createElement(r.Content,{css:{pr:"$sizes$2",zIndex:F},side:"bottom",align:"end",showCloseButton:!1,onOpenAutoFocus:t=>{var c,u;t.preventDefault(),a?(c=f.current)==null||c.focus():(u=d.current)==null||u.focus()}},e.createElement(_,{date:a||new Date,selected:a,onDateSelected:async t=>{p(!1),await i(t.date,!1),o&&o()},setYear:async t=>{await i(t,!1),o&&o()},minDate:y,maxDate:A,refDateToday:d,refDateSelected:f,firstDayOfWeek:g,monthNames:I,weekdayNames:b,labels:s})))))});D.displayName="DateInput";export{D as DateInput};
+import{CalendarEvent as B}from"@atom-learning/icons";import*as e from"react";import{DIALOG_Z_INDEX as M}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 P}from"../../utilities/style/get-icon-size.js";import{useCallbackRefState as H}from"../../utilities/hooks/useCallbackRef.js";import{ActionIcon as $}from"../action-icon/ActionIcon.js";import{Box as U}from"../box/Box.js";import{Calendar as V}from"../calendar/Calendar.js";import{DEFAULT_LABELS as W}from"../calendar/constants.js";import{Icon as X}from"../icon/Icon.js";import{Input as Y}from"../input/Input.js";import{Popover as p}from"../popover/Popover.js";import{DEFAULT_DATE_FORMAT as I}from"./constants.js";import c from"dayjs";import j from"dayjs/plugin/customParseFormat";c.extend(j);const w=(n,o=I)=>n?c(n).format(o):"",y=e.forwardRef(({initialDate:n,dateFormat:o=I,firstDayOfWeek:C=1,disabled:f,monthNames:T,weekdayNames:k,size:d="md",labels:A,revalidate:l,onChange:u,minDate:O,maxDate:x,...z},S)=>{const[s,D]=e.useState(n?c(n).toDate():void 0),[m,F]=H();e.useImperativeHandle(S,()=>m);const L=w(s,o),N=e.useCallback(t=>{const r=t.target.value,a=c(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,w(t,o));const i=new Event("input",{bubbles:!0});m.dispatchEvent(i)})()},[o,m]),b={...W,...A},[R,v]=e.useState(!1),h=e.useRef(null),g=e.useRef(null),_=e.useMemo(()=>P(d),[d]);return e.createElement(U,{css:{position:"relative",height:"max-content"}},e.createElement(Y,{name:"date",disabled:f,size:d,...z,onChange:N,ref:F,defaultValue:L}),e.createElement(p,{modal:!0,open:R,onOpenChange:v},e.createElement(p.Trigger,{asChild:!0},e.createElement($,{css:{position:"absolute",top:"50%",transform:"translateY(-50%)",right:"0"},disabled:f,label:b.open,size:_,theme:"neutral",hasTooltip:!1},e.createElement(X,{is:B}))),e.createElement(p.Portal,null,e.createElement(p.Content,{css:{pr:"$sizes$2",zIndex:M},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(V,{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:C,monthNames:T,weekdayNames:k,labels:b})))))});y.displayName="DateInput";export{y 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 type { Props as DayzedInterface } from 'dayzed'\nimport * as React from 'react'\n\nimport { DIALOG_Z_INDEX } from '~/constants/zIndices'\nimport { getFieldIconSize } from '~/utilities'\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'\nimport { useDate } from './use-date'\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\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, dateString, setDate } = useDate(initialDate, dateFormat)\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    React.useEffect(() => {\n      onChange?.(date)\n    }, [date, onChange])\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={(event) => setDate(event.target.value, true)}\n          value={dateString}\n          ref={ref}\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 setDate(date.date, false)\n                  if (revalidate) revalidate()\n                }}\n                setYear={async (date) => {\n                  await setDate(date, false)\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":["DateInput","React","initialDate","dateFormat","DEFAULT_DATE_FORMAT","firstDayOfWeek","disabled","monthNames","weekdayNames","size","labels","revalidate","onChange","minDate","maxDate","remainingProps","ref","date","dateString","setDate","useDate","updatedLabels","DEFAULT_LABELS","calendarOpen","setCalendarOpen","refDateToday","refDateSelected","iconSize","getFieldIconSize","Box","Input","event","Popover","ActionIcon","Icon","CalendarEvent","DIALOG_Z_INDEX","e","_a","_b","Calendar"],"mappings":"q1BA2BaA,EAAYC,EAAM,WAC7B,CACE,CACE,YAAAC,EACA,WAAAC,EAAaC,EACb,eAAAC,EAAiB,EACjB,SAAAC,EACA,WAAAC,EACA,aAAAC,EACA,KAAAC,EAAO,KACP,OAAAC,EACA,WAAAC,EACA,SAAAC,EACA,QAAAC,EACA,QAAAC,KACGC,CACL,EACAC,IACG,CACH,KAAM,CAAE,KAAAC,EAAM,WAAAC,EAAY,QAAAC,CAAQ,EAAIC,EAAQlB,EAAaC,CAAU,EAC/DkB,EAAgB,CACpB,GAAGC,EACH,GAAGZ,CACL,EAEM,CAACa,EAAcC,CAAe,EAAIvB,EAAM,SAAS,EAAK,EAEtDwB,EAAexB,EAAM,OAA0B,IAAI,EACnDyB,EAAkBzB,EAAM,OAA0B,IAAI,EAEtD0B,EAAW1B,EAAM,QAAQ,IAAM2B,EAAiBnB,CAAI,EAAG,CAACA,CAAI,CAAC,EAEnE,OAAAR,EAAM,UAAU,IAAM,CACpBW,GAAA,MAAAA,EAAWK,CACb,CAAA,EAAG,CAACA,EAAML,CAAQ,CAAC,EAGjBX,EAAA,cAAC4B,EAAA,CAAI,IAAK,CAAE,SAAU,WAAY,OAAQ,aAAc,CACtD5B,EAAAA,EAAA,cAAC6B,EAAA,CACC,KAAK,OACL,SAAUxB,EACV,KAAMG,EACL,GAAGM,EACJ,SAAWgB,GAAUZ,EAAQY,EAAM,OAAO,MAAO,EAAI,EACrD,MAAOb,EACP,IAAKF,CACP,CAAA,EACAf,EAAA,cAAC+B,EAAA,CAAQ,MAAK,GAAC,KAAMT,EAAc,aAAcC,CAC/CvB,EAAAA,EAAA,cAAC+B,EAAQ,QAAR,CAAgB,QAAO,EAAA,EACtB/B,EAAA,cAACgC,EAAA,CACC,IAAK,CACH,SAAU,WACV,IAAK,MACL,UAAW,mBACX,MAAO,GACT,EACA,SAAU3B,EACV,MAAOe,EAAc,KACrB,KAAMM,EACN,MAAM,UACN,WAAY,EAEZ1B,EAAAA,EAAA,cAACiC,EAAA,CAAK,GAAIC,CAAe,CAAA,CAC3B,CACF,EACAlC,EAAA,cAAC+B,EAAQ,OAAR,KACC/B,EAAA,cAAC+B,EAAQ,QAAR,CACC,IAAK,CAAE,GAAI,WAAY,OAAQI,CAAe,EAC9C,KAAK,SACL,MAAM,MACN,gBAAiB,GACjB,gBAAkBC,GAAM,CAlGtC,IAAAC,EAAAC,EAmGgBF,EAAE,iBACEpB,GACFqB,EAAAZ,EAAgB,UAAhB,MAAAY,EAAyB,MAAA,GAEzBC,EAAAd,EAAa,UAAb,MAAAc,EAAsB,MAE1B,CAAA,CAEAtC,EAAAA,EAAA,cAACuC,EAAA,CACC,KAAMvB,GAAQ,IAAI,KAClB,SAAUA,EACV,eAAgB,MAAOA,GAAS,CAC9BO,EAAgB,EAAK,EACrB,MAAML,EAAQF,EAAK,KAAM,EAAK,EAC1BN,GAAYA,EAClB,CAAA,EACA,QAAS,MAAOM,GAAS,CACvB,MAAME,EAAQF,EAAM,EAAK,EACrBN,GAAYA,EAClB,CAAA,EACA,QAASE,EACT,QAASC,EACT,aAAcW,EACd,gBAAiBC,EACjB,eAAgBrB,EAChB,WAAYE,EACZ,aAAcC,EACd,OAAQa,CACV,CAAA,CACF,CACF,CACF,CACF,CAEJ,CACF,EAEArB,EAAU,YAAc"}
+{"version":3,"file":"DateInput.js","sources":["../../../src/components/date-input/DateInput.tsx"],"sourcesContent":["import { CalendarEvent } from '@atom-learning/icons'\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'\n\nimport { DEFAULT_DATE_FORMAT } from './constants'\nimport dayjs from 'dayjs'\nimport customParseFormat from 'dayjs/plugin/customParseFormat'\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() ? parsedInputDate.toDate() : 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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"}

package/dist/components/input-field/InputField.js

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

package/dist/components/input-field/InputField.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputField.js","sources":["../../../src/components/input-field/InputField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper'\nimport { useFieldError } from '~/components/form'\nimport { Input, InputProps } from '~/components/input'\n\ntype InputFieldProps = InputProps & FieldElementWrapperProps\n\nexport const InputField: React.FC<InputFieldProps> = ({\n  css,\n  label,\n  name,\n  validation,\n  prompt,\n  description,\n  ...remainingProps\n}) => {\n  const { register } = 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      label={label}\n      prompt={prompt}\n      required={Boolean(validation?.required)}\n    >\n      <Input\n        id={name}\n        name={name}\n        ref={ref}\n        {...(error && { state: 'error' })}\n        {...remainingProps}\n      />\n    </FieldWrapper>\n  )\n}\n\nInputField.displayName = 'InputField'\n"],"names":["InputField","css","label","name","validation","prompt","description","remainingProps","register","useFormContext","error","useFieldError","ref","React","FieldWrapper","Input"],"mappings":"mTAYa,MAAAA,EAAwC,CAAC,CACpD,IAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,OAAAC,EACA,YAAAC,KACGC,CACL,IAAM,CACJ,KAAM,CAAE,SAAAC,CAAS,EAAIC,EAAe,EAC9B,CAAE,MAAAC,CAAM,EAAIC,EAAcR,CAAI,EAC9BS,EAAMR,EAAaI,EAASJ,CAAU,EAAII,EAEhD,OACEK,EAAA,cAACC,EAAA,CACC,IAAKb,EACL,YAAaK,EACb,MAAOI,EACP,QAASP,EACT,MAAOD,EACP,OAAQG,EACR,SAAU,QAAQD,GAAA,KAAA,OAAAA,EAAY,QAAQ,CAAA,EAEtCS,EAAA,cAACE,EAAA,CACC,GAAIZ,EACJ,KAAMA,EACN,IAAKS,EACJ,GAAIF,GAAS,CAAE,MAAO,OAAQ,EAC9B,GAAGH,EACN,CACF,CAEJ,EAEAP,EAAW,YAAc"}
+{"version":3,"file":"InputField.js","sources":["../../../src/components/input-field/InputField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper'\nimport { useFieldError } from '~/components/form'\nimport { Input, InputProps } from '~/components/input'\n\ntype InputFieldProps = InputProps & FieldElementWrapperProps\n\nexport const InputField: React.FC<InputFieldProps> = ({\n  css,\n  label,\n  name,\n  validation,\n  prompt,\n  description,\n  hideLabel,\n  ...remainingProps\n}) => {\n  const { register } = 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    >\n      <Input\n        id={name}\n        name={name}\n        ref={ref}\n        {...(error && { state: 'error' })}\n        {...remainingProps}\n      />\n    </FieldWrapper>\n  )\n}\n\nInputField.displayName = 'InputField'\n"],"names":["InputField","css","label","name","validation","prompt","description","hideLabel","remainingProps","register","useFormContext","error","useFieldError","ref","React","FieldWrapper","Input"],"mappings":"yTAYaA,EAAwC,CAAC,CACpD,IAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,OAAAC,EACA,YAAAC,EACA,UAAAC,KACGC,CACL,IAAM,CACJ,KAAM,CAAE,SAAAC,CAAS,EAAIC,EAAe,EAC9B,CAAE,MAAAC,CAAM,EAAIC,EAAcT,CAAI,EAC9BU,EAAMT,EAAaK,EAASL,CAAU,EAAIK,EAEhD,OACEK,EAAA,cAACC,EAAA,CACC,IAAKd,EACL,YAAaK,EACb,MAAOK,EACP,QAASR,EACT,UAAWI,EACX,MAAOL,EACP,OAAQG,EACR,SAAU,QAAQD,GAAA,YAAAA,EAAY,QAAQ,CAEtCU,EAAAA,EAAA,cAACE,EAAA,CACC,GAAIb,EACJ,KAAMA,EACN,IAAKU,EACJ,GAAIF,GAAS,CAAE,MAAO,OAAQ,EAC9B,GAAGH,EACN,CACF,CAEJ,EAEAR,EAAW,YAAc"}

package/dist/components/number-input-field/NumberInputField.d.ts

@@ -4,6 +4,7 @@ import type { CSS } from '../../stitches';
 import type { NumberInputProps } from '../number-input/NumberInput';
 export interface NumberInputFieldProps extends NumberInputProps {
     css?: CSS;
+    hideLabel?: boolean;
     description?: string;
     label: string;
     name: string;

package/dist/components/number-input-field/NumberInputField.js

@@ -1,2 +1,2 @@
-import*as l from"react";import{useFormContext as I,useController as N}from"react-hook-form";import{FieldWrapper as V}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as E}from"../form/useFieldError.js";import{NumberInput as g}from"../number-input/NumberInput.js";const m=({css:p,defaultValue:a=0,value:r,prompt:d,description:s,label:f,name:e,validation:o,onValueChange:t,...c})=>{const{control:v}=I(),{field:{ref:F,onChange:n,value:b,name:C}}=N({name:e,control:v,rules:o,defaultValue:a}),{error:u}=E(e);return l.useEffect(()=>{typeof r<"u"&&n(r)},[r]),l.createElement(V,{css:p,description:s,error:u,fieldId:e,label:f,prompt:d,required:Boolean(o==null?void 0:o.required)},l.createElement(g,{id:e,name:C,ref:F,...u&&{state:"error","aria-invalid":!0},defaultValue:a,onValueChange:i=>{n(i),t==null||t(i)},value:b,...c}))};m.displayName="NumberInputField";export{m as NumberInputField};
+import*as o from"react";import{useFormContext as I,useController as N}from"react-hook-form";import{FieldWrapper as V}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as E}from"../form/useFieldError.js";import{NumberInput as g}from"../number-input/NumberInput.js";const m=({css:d,defaultValue:a=0,hideLabel:p,value:r,prompt:s,description:f,label:c,name:e,validation:l,onValueChange:t,...b})=>{const{control:v}=I(),{field:{ref:F,onChange:n,value:h,name:C}}=N({name:e,control:v,rules:l,defaultValue:a}),{error:i}=E(e);return o.useEffect(()=>{typeof r<"u"&&n(r)},[r]),o.createElement(V,{css:d,description:f,error:i,fieldId:e,hideLabel:p,label:c,prompt:s,required:Boolean(l==null?void 0:l.required)},o.createElement(g,{id:e,name:C,ref:F,...i&&{state:"error","aria-invalid":!0},defaultValue:a,onValueChange:u=>{n(u),t==null||t(u)},value:h,...b}))};m.displayName="NumberInputField";export{m as NumberInputField};
 //# sourceMappingURL=NumberInputField.js.map

package/dist/components/number-input-field/NumberInputField.js.map

@@ -1 +1 @@
-{"version":3,"file":"NumberInputField.js","sources":["../../../src/components/number-input-field/NumberInputField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useController, useFormContext } from 'react-hook-form'\n\nimport { FieldWrapper } from '~/components/field-wrapper'\nimport { useFieldError, ValidationOptions } from '~/components/form'\nimport type { CSS } from '~/stitches'\n\nimport type { NumberInputProps } from '../number-input/NumberInput'\nimport { NumberInput } from '../number-input/NumberInput'\n\nexport interface NumberInputFieldProps extends NumberInputProps {\n  css?: CSS\n  description?: string\n  label: string\n  name: string\n  prompt?: { link: string; label: string }\n  validation?: ValidationOptions\n}\n\nexport const NumberInputField: React.FC<NumberInputFieldProps> = ({\n  css,\n  defaultValue = 0,\n  value,\n  prompt,\n  description,\n  label,\n  name,\n  validation,\n  onValueChange,\n  ...remainingProps\n}) => {\n  const { control } = useFormContext()\n  const {\n    field: { ref, onChange, value: innerValue, name: innerName }\n  } = useController({\n    name,\n    control,\n    rules: validation,\n    defaultValue\n  })\n  const { error } = useFieldError(name)\n\n  React.useEffect(() => {\n    // Update the react-hook-form inner value to match what is passed in.\n    if (typeof value !== 'undefined') onChange(value)\n  }, [value])\n\n  return (\n    <FieldWrapper\n      css={css}\n      description={description}\n      error={error}\n      fieldId={name}\n      label={label}\n      prompt={prompt}\n      required={Boolean(validation?.required)}\n    >\n      <NumberInput\n        id={name}\n        name={innerName}\n        ref={ref}\n        {...(error && { state: 'error', 'aria-invalid': true })}\n        defaultValue={defaultValue}\n        onValueChange={(newValue) => {\n          onChange(newValue)\n          onValueChange?.(newValue)\n        }}\n        value={innerValue}\n        {...remainingProps}\n      />\n    </FieldWrapper>\n  )\n}\n\nNumberInputField.displayName = 'NumberInputField'\n"],"names":["NumberInputField","css","defaultValue","value","prompt","description","label","name","validation","onValueChange","remainingProps","control","useFormContext","ref","onChange","innerValue","innerName","useController","error","useFieldError","React","FieldWrapper","NumberInput","newValue"],"mappings":"+VAmBaA,EAAoD,CAAC,CAChE,IAAAC,EACA,aAAAC,EAAe,EACf,MAAAC,EACA,OAAAC,EACA,YAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,cAAAC,KACGC,CACL,IAAM,CACJ,KAAM,CAAE,QAAAC,CAAQ,EAAIC,IACd,CACJ,MAAO,CAAE,IAAAC,EAAK,SAAAC,EAAU,MAAOC,EAAY,KAAMC,CAAU,CAC7D,EAAIC,EAAc,CAChB,KAAAV,EACA,QAAAI,EACA,MAAOH,EACP,aAAAN,CACF,CAAC,EACK,CAAE,MAAAgB,CAAM,EAAIC,EAAcZ,CAAI,EAEpC,OAAAa,EAAM,UAAU,IAAM,CAEhB,OAAOjB,EAAU,KAAaW,EAASX,CAAK,CAClD,EAAG,CAACA,CAAK,CAAC,EAGRiB,EAAA,cAACC,EAAA,CACC,IAAKpB,EACL,YAAaI,EACb,MAAOa,EACP,QAASX,EACT,MAAOD,EACP,OAAQF,EACR,SAAU,QAAQI,GAAA,YAAAA,EAAY,QAAQ,CAEtCY,EAAAA,EAAA,cAACE,EAAA,CACC,GAAIf,EACJ,KAAMS,EACN,IAAKH,EACJ,GAAIK,GAAS,CAAE,MAAO,QAAS,eAAgB,EAAK,EACrD,aAAchB,EACd,cAAgBqB,GAAa,CAC3BT,EAASS,CAAQ,EACjBd,GAAA,MAAAA,EAAgBc,CAAAA,CAClB,EACA,MAAOR,EACN,GAAGL,CAAAA,CACN,CACF,CAEJ,EAEAV,EAAiB,YAAc"}
+{"version":3,"file":"NumberInputField.js","sources":["../../../src/components/number-input-field/NumberInputField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useController, useFormContext } from 'react-hook-form'\n\nimport { FieldWrapper } from '~/components/field-wrapper'\nimport { useFieldError, ValidationOptions } from '~/components/form'\nimport type { CSS } from '~/stitches'\n\nimport type { NumberInputProps } from '../number-input/NumberInput'\nimport { NumberInput } from '../number-input/NumberInput'\n\nexport interface NumberInputFieldProps extends NumberInputProps {\n  css?: CSS\n  hideLabel?: boolean\n  description?: string\n  label: string\n  name: string\n  prompt?: { link: string; label: string }\n  validation?: ValidationOptions\n}\n\nexport const NumberInputField: React.FC<NumberInputFieldProps> = ({\n  css,\n  defaultValue = 0,\n  hideLabel,\n  value,\n  prompt,\n  description,\n  label,\n  name,\n  validation,\n  onValueChange,\n  ...remainingProps\n}) => {\n  const { control } = useFormContext()\n  const {\n    field: { ref, onChange, value: innerValue, name: innerName }\n  } = useController({\n    name,\n    control,\n    rules: validation,\n    defaultValue\n  })\n  const { error } = useFieldError(name)\n\n  React.useEffect(() => {\n    // Update the react-hook-form inner value to match what is passed in.\n    if (typeof value !== 'undefined') onChange(value)\n  }, [value])\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    >\n      <NumberInput\n        id={name}\n        name={innerName}\n        ref={ref}\n        {...(error && { state: 'error', 'aria-invalid': true })}\n        defaultValue={defaultValue}\n        onValueChange={(newValue) => {\n          onChange(newValue)\n          onValueChange?.(newValue)\n        }}\n        value={innerValue}\n        {...remainingProps}\n      />\n    </FieldWrapper>\n  )\n}\n\nNumberInputField.displayName = 'NumberInputField'\n"],"names":["NumberInputField","css","defaultValue","hideLabel","value","prompt","description","label","name","validation","onValueChange","remainingProps","control","useFormContext","ref","onChange","innerValue","innerName","useController","error","useFieldError","React","FieldWrapper","NumberInput","newValue"],"mappings":"yVAoBO,MAAMA,EAAoD,CAAC,CAChE,IAAAC,EACA,aAAAC,EAAe,EACf,UAAAC,EACA,MAAAC,EACA,OAAAC,EACA,YAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,cAAAC,KACGC,CACL,IAAM,CACJ,KAAM,CAAE,QAAAC,CAAQ,EAAIC,EAAe,EAC7B,CACJ,MAAO,CAAE,IAAAC,EAAK,SAAAC,EAAU,MAAOC,EAAY,KAAMC,CAAU,CAC7D,EAAIC,EAAc,CAChB,KAAAV,EACA,QAAAI,EACA,MAAOH,EACP,aAAAP,CACF,CAAC,EACK,CAAE,MAAAiB,CAAM,EAAIC,EAAcZ,CAAI,EAEpC,OAAAa,EAAM,UAAU,IAAM,CAEhB,OAAOjB,EAAU,KAAaW,EAASX,CAAK,CAClD,EAAG,CAACA,CAAK,CAAC,EAGRiB,EAAA,cAACC,EAAA,CACC,IAAKrB,EACL,YAAaK,EACb,MAAOa,EACP,QAASX,EACT,UAAWL,EACX,MAAOI,EACP,OAAQF,EACR,SAAU,QAAQI,GAAA,KAAAA,OAAAA,EAAY,QAAQ,CAAA,EAEtCY,EAAA,cAACE,EAAA,CACC,GAAIf,EACJ,KAAMS,EACN,IAAKH,EACJ,GAAIK,GAAS,CAAE,MAAO,QAAS,eAAgB,EAAK,EACrD,aAAcjB,EACd,cAAgBsB,GAAa,CAC3BT,EAASS,CAAQ,EACjBd,GAAA,MAAAA,EAAgBc,CAAAA,CAClB,EACA,MAAOR,EACN,GAAGL,CAAAA,CACN,CACF,CAEJ,EAEAX,EAAiB,YAAc"}

package/dist/components/password-field/PasswordField.js

@@ -1,2 +1,2 @@
-import*as i from"react";import{useFormContext as c}from"react-hook-form";import{FieldWrapper as u}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as f}from"../form/useFieldError.js";import{PasswordInput as v}from"../password-input/PasswordInput.js";const s=({css:a={},label:d="Password",name:r,prompt:m=void 0,description:p,validation:e,...l})=>{const{register:o}=c(),{error:t}=f(r),n=e?o(e):o;return i.createElement(u,{css:{...a,position:"relative"},description:p,error:t,fieldId:r,label:d,prompt:m,required:Boolean(e==null?void 0:e.required)},i.createElement(v,{autoComplete:"current-password",name:r,id:r,ref:n,...t!==void 0&&{state:"error"},...l}))};s.displayName="PasswordField";export{s as PasswordField};
+import*as t from"react";import{useFormContext as u}from"react-hook-form";import{FieldWrapper as f}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as v}from"../form/useFieldError.js";import{PasswordInput as w}from"../password-input/PasswordInput.js";const s=({css:a={},hideLabel:d,label:m="Password",name:r,prompt:p=void 0,description:l,validation:e,...n})=>{const{register:o}=u(),{error:i}=v(r),c=e?o(e):o;return t.createElement(f,{css:{...a,position:"relative"},description:l,error:i,fieldId:r,hideLabel:d,label:m,prompt:p,required:Boolean(e==null?void 0:e.required)},t.createElement(w,{autoComplete:"current-password",name:r,id:r,ref:c,...i!==void 0&&{state:"error"},...n}))};s.displayName="PasswordField";export{s as PasswordField};
 //# sourceMappingURL=PasswordField.js.map

package/dist/components/password-field/PasswordField.js.map

@@ -1 +1 @@
-{"version":3,"file":"PasswordField.js","sources":["../../../src/components/password-field/PasswordField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper'\nimport { useFieldError } from '~/components/form'\nimport { PasswordInput } from '~/components/password-input'\nimport { CSS } from '~/stitches'\n\ntype PasswordFieldProps = React.ComponentProps<typeof PasswordInput> &\n  Omit<FieldElementWrapperProps, 'label'> & {\n    label?: string\n  }\n\nexport const PasswordField: React.FC<PasswordFieldProps> = ({\n  css = {},\n  label = 'Password',\n  name,\n  prompt = undefined,\n  description,\n  validation,\n  ...remainingProps\n}) => {\n  const { register } = useFormContext()\n  const { error } = useFieldError(name)\n\n  const ref = validation ? register(validation) : register\n\n  return (\n    <FieldWrapper\n      css={{ ...css, position: 'relative' } as CSS}\n      description={description}\n      error={error}\n      fieldId={name}\n      label={label}\n      prompt={prompt}\n      required={Boolean(validation?.required)}\n    >\n      <PasswordInput\n        autoComplete=\"current-password\"\n        name={name}\n        id={name}\n        ref={ref}\n        {...(error !== undefined && { state: 'error' })}\n        {...remainingProps}\n      />\n    </FieldWrapper>\n  )\n}\n\nPasswordField.displayName = 'PasswordField'\n"],"names":["PasswordField","css","label","name","prompt","description","validation","remainingProps","register","useFormContext","error","useFieldError","ref","React","FieldWrapper","PasswordInput"],"mappings":"4UAgBO,MAAMA,EAA8C,CAAC,CAC1D,IAAAC,EAAM,CAAA,EACN,MAAAC,EAAQ,WACR,KAAAC,EACA,OAAAC,EAAS,OACT,YAAAC,EACA,WAAAC,KACGC,CACL,IAAM,CACJ,KAAM,CAAE,SAAAC,CAAS,EAAIC,EACf,EAAA,CAAE,MAAAC,CAAM,EAAIC,EAAcR,CAAI,EAE9BS,EAAMN,EAAaE,EAASF,CAAU,EAAIE,EAEhD,OACEK,EAAA,cAACC,EAAA,CACC,IAAK,CAAE,GAAGb,EAAK,SAAU,UAAW,EACpC,YAAaI,EACb,MAAOK,EACP,QAASP,EACT,MAAOD,EACP,OAAQE,EACR,SAAU,QAAQE,GAAA,KAAA,OAAAA,EAAY,QAAQ,CAAA,EAEtCO,EAAA,cAACE,EAAA,CACC,aAAa,mBACb,KAAMZ,EACN,GAAIA,EACJ,IAAKS,EACJ,GAAIF,IAAU,QAAa,CAAE,MAAO,OAAQ,EAC5C,GAAGH,CAAAA,CACN,CACF,CAEJ,EAEAP,EAAc,YAAc"}
+{"version":3,"file":"PasswordField.js","sources":["../../../src/components/password-field/PasswordField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper'\nimport { useFieldError } from '~/components/form'\nimport { PasswordInput } from '~/components/password-input'\nimport { CSS } from '~/stitches'\n\ntype PasswordFieldProps = React.ComponentProps<typeof PasswordInput> &\n  Omit<FieldElementWrapperProps, 'label'> & {\n    label?: string\n  }\n\nexport const PasswordField: React.FC<PasswordFieldProps> = ({\n  css = {},\n  hideLabel,\n  label = 'Password',\n  name,\n  prompt = undefined,\n  description,\n  validation,\n  ...remainingProps\n}) => {\n  const { register } = useFormContext()\n  const { error } = useFieldError(name)\n\n  const ref = validation ? register(validation) : register\n\n  return (\n    <FieldWrapper\n      css={{ ...css, position: 'relative' } as 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    >\n      <PasswordInput\n        autoComplete=\"current-password\"\n        name={name}\n        id={name}\n        ref={ref}\n        {...(error !== undefined && { state: 'error' })}\n        {...remainingProps}\n      />\n    </FieldWrapper>\n  )\n}\n\nPasswordField.displayName = 'PasswordField'\n"],"names":["PasswordField","css","hideLabel","label","name","prompt","description","validation","remainingProps","register","useFormContext","error","useFieldError","ref","React","FieldWrapper","PasswordInput"],"mappings":"4UAgBa,MAAAA,EAA8C,CAAC,CAC1D,IAAAC,EAAM,CAAA,EACN,UAAAC,EACA,MAAAC,EAAQ,WACR,KAAAC,EACA,OAAAC,EAAS,OACT,YAAAC,EACA,WAAAC,KACGC,CACL,IAAM,CACJ,KAAM,CAAE,SAAAC,CAAS,EAAIC,IACf,CAAE,MAAAC,CAAM,EAAIC,EAAcR,CAAI,EAE9BS,EAAMN,EAAaE,EAASF,CAAU,EAAIE,EAEhD,OACEK,EAAA,cAACC,EAAA,CACC,IAAK,CAAE,GAAGd,EAAK,SAAU,UAAW,EACpC,YAAaK,EACb,MAAOK,EACP,QAASP,EACT,UAAWF,EACX,MAAOC,EACP,OAAQE,EACR,SAAU,QAAQE,GAAA,YAAAA,EAAY,QAAQ,CAEtCO,EAAAA,EAAA,cAACE,EAAA,CACC,aAAa,mBACb,KAAMZ,EACN,GAAIA,EACJ,IAAKS,EACJ,GAAIF,IAAU,QAAa,CAAE,MAAO,OAAQ,EAC5C,GAAGH,CAAAA,CACN,CACF,CAEJ,EAEAR,EAAc,YAAc"}

package/dist/components/search-field/SearchField.js

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

package/dist/components/search-field/SearchField.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchField.js","sources":["../../../src/components/search-field/SearchField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper'\nimport { useFieldError } from '~/components/form'\nimport { SearchInput, SearchInputProps } from '~/components/search-input'\n\ntype SearchFieldProps = SearchInputProps & FieldElementWrapperProps\n\nexport const SearchField: React.FC<SearchFieldProps> = ({\n  css,\n  label,\n  name,\n  validation,\n  prompt,\n  description,\n  ...remainingProps\n}) => {\n  const { register } = 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      label={label}\n      prompt={prompt}\n      required={Boolean(validation?.required)}\n    >\n      <SearchInput\n        id={name}\n        name={name}\n        ref={ref}\n        {...(error && { state: 'error' })}\n        {...remainingProps}\n      />\n    </FieldWrapper>\n  )\n}\n\nSearchField.displayName = 'SearchField'\n"],"names":["SearchField","css","label","name","validation","prompt","description","remainingProps","register","useFormContext","error","useFieldError","ref","React","FieldWrapper","SearchInput"],"mappings":"sUAYa,MAAAA,EAA0C,CAAC,CACtD,IAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,OAAAC,EACA,YAAAC,KACGC,CACL,IAAM,CACJ,KAAM,CAAE,SAAAC,CAAS,EAAIC,EAAe,EAC9B,CAAE,MAAAC,CAAM,EAAIC,EAAcR,CAAI,EAC9BS,EAAMR,EAAaI,EAASJ,CAAU,EAAII,EAEhD,OACEK,EAAA,cAACC,EAAA,CACC,IAAKb,EACL,YAAaK,EACb,MAAOI,EACP,QAASP,EACT,MAAOD,EACP,OAAQG,EACR,SAAU,QAAQD,GAAA,KAAA,OAAAA,EAAY,QAAQ,CAAA,EAEtCS,EAAA,cAACE,EAAA,CACC,GAAIZ,EACJ,KAAMA,EACN,IAAKS,EACJ,GAAIF,GAAS,CAAE,MAAO,OAAQ,EAC9B,GAAGH,EACN,CACF,CAEJ,EAEAP,EAAY,YAAc"}
+{"version":3,"file":"SearchField.js","sources":["../../../src/components/search-field/SearchField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper'\nimport { useFieldError } from '~/components/form'\nimport { SearchInput, SearchInputProps } from '~/components/search-input'\n\ntype SearchFieldProps = SearchInputProps & FieldElementWrapperProps\n\nexport const SearchField: React.FC<SearchFieldProps> = ({\n  css,\n  hideLabel,\n  label,\n  name,\n  validation,\n  prompt,\n  description,\n  ...remainingProps\n}) => {\n  const { register } = 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    >\n      <SearchInput\n        id={name}\n        name={name}\n        ref={ref}\n        {...(error && { state: 'error' })}\n        {...remainingProps}\n      />\n    </FieldWrapper>\n  )\n}\n\nSearchField.displayName = 'SearchField'\n"],"names":["SearchField","css","hideLabel","label","name","validation","prompt","description","remainingProps","register","useFormContext","error","useFieldError","ref","React","FieldWrapper","SearchInput"],"mappings":"4UAYaA,EAA0C,CAAC,CACtD,IAAAC,EACA,UAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,OAAAC,EACA,YAAAC,KACGC,CACL,IAAM,CACJ,KAAM,CAAE,SAAAC,CAAS,EAAIC,EAAe,EAC9B,CAAE,MAAAC,CAAM,EAAIC,EAAcR,CAAI,EAC9BS,EAAMR,EAAaI,EAASJ,CAAU,EAAII,EAEhD,OACEK,EAAA,cAACC,EAAA,CACC,IAAKd,EACL,YAAaM,EACb,MAAOI,EACP,QAASP,EACT,UAAWF,EACX,MAAOC,EACP,OAAQG,EACR,SAAU,QAAQD,GAAA,YAAAA,EAAY,QAAQ,CAEtCS,EAAAA,EAAA,cAACE,EAAA,CACC,GAAIZ,EACJ,KAAMA,EACN,IAAKS,EACJ,GAAIF,GAAS,CAAE,MAAO,OAAQ,EAC9B,GAAGH,EACN,CACF,CAEJ,EAEAR,EAAY,YAAc"}

package/dist/components/select-field/SelectField.js

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

package/dist/components/select-field/SelectField.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectField.js","sources":["../../../src/components/select-field/SelectField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper'\nimport { useFieldError } from '~/components/form'\nimport { Select, SelectProps } from '~/components/select'\n\ntype SelectFieldProps = SelectProps & FieldElementWrapperProps\n\nexport const SelectField: React.FC<SelectFieldProps> = ({\n  css = undefined,\n  children,\n  name,\n  label,\n  validation,\n  prompt,\n  description,\n  hideLabel,\n  ...remainingProps\n}) => {\n  const { register } = 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      label={label}\n      prompt={prompt}\n      required={Boolean(validation?.required)}\n      hideLabel={hideLabel}\n    >\n      <Select\n        name={name}\n        id={name}\n        {...remainingProps}\n        ref={ref}\n        {...(error && { state: 'error' })}\n      >\n        {children}\n      </Select>\n    </FieldWrapper>\n  )\n}\n\nSelectField.displayName = 'SelectField'\n"],"names":["SelectField","css","children","name","label","validation","prompt","description","hideLabel","remainingProps","register","useFormContext","error","useFieldError","ref","React","FieldWrapper","Select"],"mappings":"sTAYO,MAAMA,EAA0C,CAAC,CACtD,IAAAC,EAAM,OACN,SAAAC,EACA,KAAAC,EACA,MAAAC,EACA,WAAAC,EACA,OAAAC,EACA,YAAAC,EACA,UAAAC,KACGC,CACL,IAAM,CACJ,KAAM,CAAE,SAAAC,CAAS,EAAIC,EAAe,EAC9B,CAAE,MAAAC,CAAM,EAAIC,EAAcV,CAAI,EAC9BW,EAAMT,EAAaK,EAASL,CAAU,EAAIK,EAEhD,OACEK,EAAA,cAACC,EAAA,CACC,IAAKf,EACL,YAAaM,EACb,MAAOK,EACP,QAAST,EACT,MAAOC,EACP,OAAQE,EACR,SAAU,QAAQD,GAAA,KAAAA,OAAAA,EAAY,QAAQ,EACtC,UAAWG,CAEXO,EAAAA,EAAA,cAACE,EAAA,CACC,KAAMd,EACN,GAAIA,EACH,GAAGM,EACJ,IAAKK,EACJ,GAAIF,GAAS,CAAE,MAAO,OAAQ,CAE9BV,EAAAA,CACH,CACF,CAEJ,EAEAF,EAAY,YAAc"}
+{"version":3,"file":"SelectField.js","sources":["../../../src/components/select-field/SelectField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper'\nimport { useFieldError } from '~/components/form'\nimport { Select, SelectProps } from '~/components/select'\n\ntype SelectFieldProps = SelectProps & FieldElementWrapperProps\n\nexport const SelectField: React.FC<SelectFieldProps> = ({\n  css = undefined,\n  hideLabel,\n  children,\n  name,\n  label,\n  validation,\n  prompt,\n  description,\n  ...remainingProps\n}) => {\n  const { register } = 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    >\n      <Select\n        name={name}\n        id={name}\n        {...remainingProps}\n        ref={ref}\n        {...(error && { state: 'error' })}\n      >\n        {children}\n      </Select>\n    </FieldWrapper>\n  )\n}\n\nSelectField.displayName = 'SelectField'\n"],"names":["SelectField","css","hideLabel","children","name","label","validation","prompt","description","remainingProps","register","useFormContext","error","useFieldError","ref","React","FieldWrapper","Select"],"mappings":"sTAYO,MAAMA,EAA0C,CAAC,CACtD,IAAAC,EAAM,OACN,UAAAC,EACA,SAAAC,EACA,KAAAC,EACA,MAAAC,EACA,WAAAC,EACA,OAAAC,EACA,YAAAC,KACGC,CACL,IAAM,CACJ,KAAM,CAAE,SAAAC,CAAS,EAAIC,EAAe,EAC9B,CAAE,MAAAC,CAAM,EAAIC,EAAcT,CAAI,EAC9BU,EAAMR,EAAaI,EAASJ,CAAU,EAAII,EAEhD,OACEK,EAAA,cAACC,EAAA,CACC,IAAKf,EACL,YAAaO,EACb,MAAOI,EACP,QAASR,EACT,UAAWF,EACX,MAAOG,EACP,OAAQE,EACR,SAAU,QAAQD,GAAA,YAAAA,EAAY,QAAQ,CAEtCS,EAAAA,EAAA,cAACE,EAAA,CACC,KAAMb,EACN,GAAIA,EACH,GAAGK,EACJ,IAAKK,EACJ,GAAIF,GAAS,CAAE,MAAO,OAAQ,CAE9BT,EAAAA,CACH,CACF,CAEJ,EAEAH,EAAY,YAAc"}

package/dist/components/slider-field/SliderField.js

@@ -1,2 +1,2 @@
-import e from"react";import{useFormContext as b,useController as g}from"react-hook-form";import{FieldWrapper as C}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import{Slider as t}from"../slider/Slider.js";const u=({css:i,label:s,name:a,defaultValue:d,value:l,validation:f,outputLabel:p,min:r=0,max:n=100,steps:c=[],...v})=>{const{control:x}=b(),{field:{ref:E,onChange:m,value:o,name:S}}=g({name:a,control:x,rules:f,defaultValue:d});return e.useEffect(()=>{l!=null&&l.length&&m(l)},[JSON.stringify(l)]),e.createElement(C,{css:i,fieldId:a,label:s},e.createElement(t,{ref:E,name:S,onValueChange:m,value:o,min:r,max:n,...v},e.createElement(t.Steps,{min:r,max:n,steps:c}),e.createElement(t.Value,{value:o,outputLabel:p})))};u.displayName="SliderField";export{u as SliderField};
+import e from"react";import{useFormContext as E,useController as S}from"react-hook-form";import{FieldWrapper as g}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import{Slider as t}from"../slider/Slider.js";const i=({css:u,hideLabel:d,label:s,name:a,defaultValue:f,value:l,validation:p,outputLabel:c,min:r=0,max:n=100,steps:b=[],...h})=>{const{control:v}=E(),{field:{ref:x,onChange:m,value:o,name:C}}=S({name:a,control:v,rules:p,defaultValue:f});return e.useEffect(()=>{l!=null&&l.length&&m(l)},[JSON.stringify(l)]),e.createElement(g,{css:u,fieldId:a,label:s,hideLabel:d},e.createElement(t,{ref:x,name:C,onValueChange:m,value:o,min:r,max:n,...h},e.createElement(t.Steps,{min:r,max:n,steps:b}),e.createElement(t.Value,{value:o,outputLabel:c})))};i.displayName="SliderField";export{i as SliderField};
 //# sourceMappingURL=SliderField.js.map

package/dist/components/slider-field/SliderField.js.map

@@ -1 +1 @@
-{"version":3,"file":"SliderField.js","sources":["../../../src/components/slider-field/SliderField.tsx"],"sourcesContent":["import React from 'react'\nimport { useController, useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper'\nimport { Slider, SliderProps } from '~/components/slider'\nimport { SliderStepsType } from '~/components/slider/SliderSteps'\n\nimport { SliderValueType } from '../slider/SliderValue'\n\ntype SliderFieldProps = SliderProps &\n  SliderStepsType &\n  SliderValueType &\n  FieldElementWrapperProps\n\nexport const SliderField: React.FC<SliderFieldProps> = ({\n  css,\n  label,\n  name,\n  defaultValue,\n  value,\n  validation,\n  outputLabel,\n  min = 0,\n  max = 100,\n  steps = [],\n  ...remainingProps\n}) => {\n  const { control } = useFormContext()\n  const {\n    field: { ref, onChange, value: innerValue, name: innerName }\n  } = useController({\n    name,\n    control,\n    rules: validation,\n    defaultValue\n  })\n\n  React.useEffect(() => {\n    // Update the react-hook-form inner value to match what is passed in.\n    if (value?.length) onChange(value)\n  }, [JSON.stringify(value)])\n\n  return (\n    <FieldWrapper css={css} fieldId={name} label={label}>\n      <Slider\n        ref={ref}\n        name={innerName}\n        onValueChange={onChange}\n        value={innerValue}\n        min={min}\n        max={max}\n        {...remainingProps}\n      >\n        <Slider.Steps min={min} max={max} steps={steps} />\n\n        <Slider.Value value={innerValue} outputLabel={outputLabel} />\n      </Slider>\n    </FieldWrapper>\n  )\n}\n\nSliderField.displayName = 'SliderField'\n"],"names":["SliderField","css","label","name","defaultValue","value","validation","outputLabel","min","max","steps","remainingProps","control","useFormContext","ref","onChange","innerValue","innerName","useController","React","FieldWrapper","Slider"],"mappings":"qPAiBO,MAAMA,EAA0C,CAAC,CACtD,IAAAC,EACA,MAAAC,EACA,KAAAC,EACA,aAAAC,EACA,MAAAC,EACA,WAAAC,EACA,YAAAC,EACA,IAAAC,EAAM,EACN,IAAAC,EAAM,IACN,MAAAC,EAAQ,CAAA,KACLC,CACL,IAAM,CACJ,KAAM,CAAE,QAAAC,CAAQ,EAAIC,EAAAA,EACd,CACJ,MAAO,CAAE,IAAAC,EAAK,SAAAC,EAAU,MAAOC,EAAY,KAAMC,CAAU,CAC7D,EAAIC,EAAc,CAChB,KAAAf,EACA,QAAAS,EACA,MAAON,EACP,aAAAF,CACF,CAAC,EAED,OAAAe,EAAM,UAAU,IAAM,CAEhBd,GAAA,MAAAA,EAAO,QAAQU,EAASV,CAAK,CACnC,EAAG,CAAC,KAAK,UAAUA,CAAK,CAAC,CAAC,EAGxBc,EAAA,cAACC,EAAA,CAAa,IAAKnB,EAAK,QAASE,EAAM,MAAOD,CAC5CiB,EAAAA,EAAA,cAACE,EAAA,CACC,IAAKP,EACL,KAAMG,EACN,cAAeF,EACf,MAAOC,EACP,IAAKR,EACL,IAAKC,EACJ,GAAGE,CAAAA,EAEJQ,EAAA,cAACE,EAAO,MAAP,CAAa,IAAKb,EAAK,IAAKC,EAAK,MAAOC,EAAO,EAEhDS,EAAA,cAACE,EAAO,MAAP,CAAa,MAAOL,EAAY,YAAaT,EAAa,CAC7D,CACF,CAEJ,EAEAP,EAAY,YAAc"}
+{"version":3,"file":"SliderField.js","sources":["../../../src/components/slider-field/SliderField.tsx"],"sourcesContent":["import React from 'react'\nimport { useController, useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper'\nimport { Slider, SliderProps } from '~/components/slider'\nimport { SliderStepsType } from '~/components/slider/SliderSteps'\n\nimport { SliderValueType } from '../slider/SliderValue'\n\ntype SliderFieldProps = SliderProps &\n  SliderStepsType &\n  SliderValueType &\n  FieldElementWrapperProps\n\nexport const SliderField: React.FC<SliderFieldProps> = ({\n  css,\n  hideLabel,\n  label,\n  name,\n  defaultValue,\n  value,\n  validation,\n  outputLabel,\n  min = 0,\n  max = 100,\n  steps = [],\n  ...remainingProps\n}) => {\n  const { control } = useFormContext()\n  const {\n    field: { ref, onChange, value: innerValue, name: innerName }\n  } = useController({\n    name,\n    control,\n    rules: validation,\n    defaultValue\n  })\n\n  React.useEffect(() => {\n    // Update the react-hook-form inner value to match what is passed in.\n    if (value?.length) onChange(value)\n  }, [JSON.stringify(value)])\n\n  return (\n    <FieldWrapper css={css} fieldId={name} label={label} hideLabel={hideLabel}>\n      <Slider\n        ref={ref}\n        name={innerName}\n        onValueChange={onChange}\n        value={innerValue}\n        min={min}\n        max={max}\n        {...remainingProps}\n      >\n        <Slider.Steps min={min} max={max} steps={steps} />\n\n        <Slider.Value value={innerValue} outputLabel={outputLabel} />\n      </Slider>\n    </FieldWrapper>\n  )\n}\n\nSliderField.displayName = 'SliderField'\n"],"names":["SliderField","css","hideLabel","label","name","defaultValue","value","validation","outputLabel","min","max","steps","remainingProps","control","useFormContext","ref","onChange","innerValue","innerName","useController","React","FieldWrapper","Slider"],"mappings":"qPAiBa,MAAAA,EAA0C,CAAC,CACtD,IAAAC,EACA,UAAAC,EACA,MAAAC,EACA,KAAAC,EACA,aAAAC,EACA,MAAAC,EACA,WAAAC,EACA,YAAAC,EACA,IAAAC,EAAM,EACN,IAAAC,EAAM,IACN,MAAAC,EAAQ,CAAA,KACLC,CACL,IAAM,CACJ,KAAM,CAAE,QAAAC,CAAQ,EAAIC,IACd,CACJ,MAAO,CAAE,IAAAC,EAAK,SAAAC,EAAU,MAAOC,EAAY,KAAMC,CAAU,CAC7D,EAAIC,EAAc,CAChB,KAAAf,EACA,QAAAS,EACA,MAAON,EACP,aAAAF,CACF,CAAC,EAED,OAAAe,EAAM,UAAU,IAAM,CAEhBd,GAAA,MAAAA,EAAO,QAAQU,EAASV,CAAK,CACnC,EAAG,CAAC,KAAK,UAAUA,CAAK,CAAC,CAAC,EAGxBc,EAAA,cAACC,EAAA,CAAa,IAAKpB,EAAK,QAASG,EAAM,MAAOD,EAAO,UAAWD,CAAAA,EAC9DkB,EAAA,cAACE,EAAA,CACC,IAAKP,EACL,KAAMG,EACN,cAAeF,EACf,MAAOC,EACP,IAAKR,EACL,IAAKC,EACJ,GAAGE,GAEJQ,EAAA,cAACE,EAAO,MAAP,CAAa,IAAKb,EAAK,IAAKC,EAAK,MAAOC,CAAO,CAAA,EAEhDS,EAAA,cAACE,EAAO,MAAP,CAAa,MAAOL,EAAY,YAAaT,CAAa,CAAA,CAC7D,CACF,CAEJ,EAEAR,EAAY,YAAc"}

package/dist/components/textarea-field/TextareaField.js

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

package/dist/components/textarea-field/TextareaField.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextareaField.js","sources":["../../../src/components/textarea-field/TextareaField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper'\nimport { useFieldError } from '~/components/form'\nimport { Textarea, TextareaProps } from '~/components/textarea'\n\ntype TextareaFieldProps = TextareaProps & FieldElementWrapperProps\n\nexport const TextareaField: React.FC<TextareaFieldProps> = ({\n  css = undefined,\n  label,\n  name,\n  validation,\n  prompt,\n  description,\n  ...remainingProps\n}) => {\n  const { register } = useFormContext()\n  const { error } = useFieldError(name)\n\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      label={label}\n      prompt={prompt}\n      required={Boolean(validation?.required)}\n    >\n      <Textarea\n        id={name}\n        name={name}\n        ref={ref}\n        {...(error && { state: 'error' })}\n        {...remainingProps}\n      />\n    </FieldWrapper>\n  )\n}\n\nTextareaField.displayName = 'TextareaField'\n"],"names":["TextareaField","css","label","name","validation","prompt","description","remainingProps","register","useFormContext","error","useFieldError","ref","React","FieldWrapper","Textarea"],"mappings":"kUAYaA,EAA8C,CAAC,CAC1D,IAAAC,EAAM,OACN,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,OAAAC,EACA,YAAAC,KACGC,CACL,IAAM,CACJ,KAAM,CAAE,SAAAC,CAAS,EAAIC,IACf,CAAE,MAAAC,CAAM,EAAIC,EAAcR,CAAI,EAE9BS,EAAMR,EAAaI,EAASJ,CAAU,EAAII,EAEhD,OACEK,EAAA,cAACC,EAAA,CACC,IAAKb,EACL,YAAaK,EACb,MAAOI,EACP,QAASP,EACT,MAAOD,EACP,OAAQG,EACR,SAAU,QAAQD,GAAA,KAAA,OAAAA,EAAY,QAAQ,CAAA,EAEtCS,EAAA,cAACE,EAAA,CACC,GAAIZ,EACJ,KAAMA,EACN,IAAKS,EACJ,GAAIF,GAAS,CAAE,MAAO,OAAQ,EAC9B,GAAGH,EACN,CACF,CAEJ,EAEAP,EAAc,YAAc"}
+{"version":3,"file":"TextareaField.js","sources":["../../../src/components/textarea-field/TextareaField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper'\nimport { useFieldError } from '~/components/form'\nimport { Textarea, TextareaProps } from '~/components/textarea'\n\ntype TextareaFieldProps = TextareaProps & FieldElementWrapperProps\n\nexport const TextareaField: React.FC<TextareaFieldProps> = ({\n  css = undefined,\n  hideLabel,\n  label,\n  name,\n  validation,\n  prompt,\n  description,\n  ...remainingProps\n}) => {\n  const { register } = useFormContext()\n  const { error } = useFieldError(name)\n\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    >\n      <Textarea\n        id={name}\n        name={name}\n        ref={ref}\n        {...(error && { state: 'error' })}\n        {...remainingProps}\n      />\n    </FieldWrapper>\n  )\n}\n\nTextareaField.displayName = 'TextareaField'\n"],"names":["TextareaField","css","hideLabel","label","name","validation","prompt","description","remainingProps","register","useFormContext","error","useFieldError","ref","React","FieldWrapper","Textarea"],"mappings":"4TAYO,MAAMA,EAA8C,CAAC,CAC1D,IAAAC,EAAM,OACN,UAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,OAAAC,EACA,YAAAC,KACGC,CACL,IAAM,CACJ,KAAM,CAAE,SAAAC,CAAS,EAAIC,EAAe,EAC9B,CAAE,MAAAC,CAAM,EAAIC,EAAcR,CAAI,EAE9BS,EAAMR,EAAaI,EAASJ,CAAU,EAAII,EAEhD,OACEK,EAAA,cAACC,EAAA,CACC,IAAKd,EACL,YAAaM,EACb,MAAOI,EACP,QAASP,EACT,UAAWF,EACX,MAAOC,EACP,OAAQG,EACR,SAAU,QAAQD,GAAA,YAAAA,EAAY,QAAQ,CAEtCS,EAAAA,EAAA,cAACE,EAAA,CACC,GAAIZ,EACJ,KAAMA,EACN,IAAKS,EACJ,GAAIF,GAAS,CAAE,MAAO,OAAQ,EAC9B,GAAGH,EACN,CACF,CAEJ,EAEAR,EAAc,YAAc"}