@atom-learning/components 2.67.0 → 2.67.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +3 -3
- package/dist/components/data-table/DataTableContext.js.map +1 -1
- package/dist/components/data-table/DataTableHead.js.map +1 -1
- package/dist/components/data-table/DataTableRow.js +1 -1
- package/dist/components/data-table/DataTableRow.js.map +1 -1
- package/dist/components/date-field/DateField.js +1 -1
- package/dist/components/date-field/DateField.js.map +1 -1
- package/dist/components/input-field/InputField.js +1 -1
- package/dist/components/input-field/InputField.js.map +1 -1
- package/dist/components/number-input-field/NumberInputField.d.ts +1 -0
- package/dist/components/number-input-field/NumberInputField.js +1 -1
- package/dist/components/number-input-field/NumberInputField.js.map +1 -1
- package/dist/components/password-field/PasswordField.js +1 -1
- package/dist/components/password-field/PasswordField.js.map +1 -1
- package/dist/components/search-field/SearchField.js +1 -1
- package/dist/components/search-field/SearchField.js.map +1 -1
- package/dist/components/select-field/SelectField.js +1 -1
- package/dist/components/select-field/SelectField.js.map +1 -1
- package/dist/components/slider-field/SliderField.js +1 -1
- package/dist/components/slider-field/SliderField.js.map +1 -1
- package/dist/components/textarea-field/TextareaField.js +1 -1
- package/dist/components/textarea-field/TextareaField.js.map +1 -1
- package/dist/docgen.json +1 -1
- package/dist/index.cjs.js +1 -1
- package/dist/index.cjs.js.map +1 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
|
|
1
|
+
## [2.67.1](https://github.com/Atom-Learning/components/compare/v2.67.0...v2.67.1) (2023-09-14)
|
|
2
2
|
|
|
3
3
|
|
|
4
|
-
###
|
|
4
|
+
### Bug Fixes
|
|
5
5
|
|
|
6
|
-
*
|
|
6
|
+
* form inputs - hideLabel passed down to FieldWrapper ([166ca16](https://github.com/Atom-Learning/components/commit/166ca162ab65b69b4207c8e813d98fffdd98603a))
|
|
7
7
|
|
|
8
8
|
# [1.4.0](https://github.com/Atom-Learning/components/compare/v1.3.0...v1.4.0) (2022-04-11)
|
|
9
9
|
|
|
@@ -1 +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
|
|
1
|
+
{"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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"}
|
|
@@ -1 +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' }}
|
|
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' }} />\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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import
|
|
1
|
+
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};
|
|
2
2
|
//# sourceMappingURL=DataTableRow.js.map
|
|
@@ -1 +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'\
|
|
1
|
+
{"version":3,"file":"DataTableRow.js","sources":["../../../src/components/data-table/DataTableRow.tsx"],"sourcesContent":["import { ChevronDown, ChevronRight } from '@atom-learning/icons'\nimport type { Row } from '@tanstack/react-table'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { Box } from '../box'\nimport { Icon } from '../icon'\nimport { Table } from '../table'\nimport { useDataTable } from './DataTableContext'\nimport { DataTableDataCell } from './DataTableDataCell'\nimport { DataTableRowSelectionCheckbox } from './DataTableRowSelectionCheckbox'\n\nexport type DataTableRowProps = React.ComponentProps<typeof Table.Row> & {\n row: Row<Record<string, unknown>>\n}\n\nconst StyledRow = styled(Table.Row, {\n bg: 'initial',\n variants: {\n isSelected: {\n true: {\n // the !important rule is needed because the bg property is set elsewhere and it's more specific than this one would be without the !important modifier.\n bg: '$blue100 !important'\n }\n }\n }\n})\n\nexport const DataTableRow: React.FC<DataTableRowProps> = ({ row }) => {\n const { enableRowSelection, getCanSomeRowsExpand } = useDataTable()\n\n const toggleExpandHandler = row.getToggleExpandedHandler()\n const toggleSelectHandler = row.getToggleSelectedHandler()\n\n const getCheckedState = (): boolean | 'indeterminate' => {\n if (row.getIsSomeSelected()) return 'indeterminate'\n return row.getIsSelected()\n }\n\n return (\n <StyledRow isSelected={row.getIsSelected()}>\n {getCanSomeRowsExpand() && (\n <Table.Cell\n data-testid={`expand-icon-${row.id}`}\n css={{ width: '$4', cursor: row.getCanExpand() ? 'pointer' : 'auto' }}\n onClick={toggleExpandHandler}\n >\n {row.getCanExpand() && (\n <Icon is={row.getIsExpanded() ? ChevronDown : ChevronRight} />\n )}\n </Table.Cell>\n )}\n\n {enableRowSelection && row.getCanSelect() && (\n <Table.Cell css={{ width: '$4' }}>\n <DataTableRowSelectionCheckbox\n rowDepth={row.depth}\n rowId={row.id}\n checked={getCheckedState()}\n onCheckedChange={toggleSelectHandler}\n />\n </Table.Cell>\n )}\n {row.getVisibleCells().map((cell, i) => {\n return <DataTableDataCell key={cell.id} cell={cell} />\n })}\n </StyledRow>\n )\n}\n"],"names":["StyledRow","styled","Table","DataTableRow","row","enableRowSelection","getCanSomeRowsExpand","useDataTable","toggleExpandHandler","toggleSelectHandler","getCheckedState","React","Icon","ChevronDown","ChevronRight","DataTableRowSelectionCheckbox","cell","i","DataTableDataCell"],"mappings":"4ZAiBA,MAAMA,EAAYC,EAAOC,EAAM,IAAK,CAClC,GAAI,UACJ,SAAU,CACR,WAAY,CACV,KAAM,CAEJ,GAAI,qBACN,CACF,CACF,CACF,CAAC,EAEYC,EAA4C,CAAC,CAAE,IAAAC,CAAI,IAAM,CACpE,KAAM,CAAE,mBAAAC,EAAoB,qBAAAC,CAAqB,EAAIC,IAE/CC,EAAsBJ,EAAI,2BAC1BK,EAAsBL,EAAI,2BAE1BM,EAAkB,IAClBN,EAAI,kBAAkB,EAAU,gBAC7BA,EAAI,cAAA,EAGb,OACEO,EAAA,cAACX,EAAA,CAAU,WAAYI,EAAI,eACxBE,EAAAA,EAAAA,GACCK,EAAA,cAACT,EAAM,KAAN,CACC,cAAa,eAAeE,EAAI,KAChC,IAAK,CAAE,MAAO,KAAM,OAAQA,EAAI,aAAa,EAAI,UAAY,MAAO,EACpE,QAASI,CAERJ,EAAAA,EAAI,gBACHO,EAAA,cAACC,EAAA,CAAK,GAAIR,EAAI,gBAAkBS,EAAcC,CAAAA,CAAc,CAEhE,EAGDT,GAAsBD,EAAI,aAAa,GACtCO,EAAA,cAACT,EAAM,KAAN,CAAW,IAAK,CAAE,MAAO,IAAK,CAC7BS,EAAAA,EAAA,cAACI,EAAA,CACC,SAAUX,EAAI,MACd,MAAOA,EAAI,GACX,QAASM,EAAgB,EACzB,gBAAiBD,CACnB,CAAA,CACF,EAEDL,EAAI,kBAAkB,IAAI,CAACY,EAAMC,IACzBN,EAAA,cAACO,EAAA,CAAkB,IAAKF,EAAK,GAAI,KAAMA,CAAM,CAAA,CACrD,CACH,CAEJ"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as i from"react";import{useFormContext as
|
|
1
|
+
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};
|
|
2
2
|
//# sourceMappingURL=DateField.js.map
|
|
@@ -1 +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":"
|
|
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 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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as i from"react";import{useFormContext as
|
|
1
|
+
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};
|
|
2
2
|
//# sourceMappingURL=InputField.js.map
|
|
@@ -1 +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":"
|
|
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 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"}
|
|
@@ -4,6 +4,7 @@ import type { CSS } from '../../stitches';
|
|
|
4
4
|
import type { NumberInputProps } from '../number-input/NumberInput';
|
|
5
5
|
export interface NumberInputFieldProps extends NumberInputProps {
|
|
6
6
|
css?: CSS;
|
|
7
|
+
hideLabel?: boolean;
|
|
7
8
|
description?: string;
|
|
8
9
|
label: string;
|
|
9
10
|
name: string;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as
|
|
1
|
+
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};
|
|
2
2
|
//# sourceMappingURL=NumberInputField.js.map
|
|
@@ -1 +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":"
|
|
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 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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as
|
|
1
|
+
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};
|
|
2
2
|
//# sourceMappingURL=PasswordField.js.map
|
|
@@ -1 +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":"
|
|
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 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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as
|
|
1
|
+
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};
|
|
2
2
|
//# sourceMappingURL=SearchField.js.map
|
|
@@ -1 +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":"
|
|
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 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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
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,
|
|
1
|
+
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};
|
|
2
2
|
//# sourceMappingURL=SelectField.js.map
|
|
@@ -1 +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
|
|
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 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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import e from"react";import{useFormContext as
|
|
1
|
+
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};
|
|
2
2
|
//# sourceMappingURL=SliderField.js.map
|
|
@@ -1 +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":"
|
|
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 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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as i from"react";import{useFormContext as
|
|
1
|
+
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};
|
|
2
2
|
//# sourceMappingURL=TextareaField.js.map
|
|
@@ -1 +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":"
|
|
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 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"}
|