@persona/design-system 0.10.1 → 0.10.3
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 +25 -0
- package/dist/{CheckboxGroupField-4dc7YXJY.d.mts → CheckboxGroupField-6E5o6bYi.d.mts} +2 -2
- package/dist/CheckboxGroupField.d.mts +1 -1
- package/dist/{Combobox-CcFJo68g.mjs → Combobox-CBM-oY-e.mjs} +6 -4
- package/dist/{Combobox-CcFJo68g.mjs.map → Combobox-CBM-oY-e.mjs.map} +1 -1
- package/dist/{Combobox-Bm2eSg56.d.mts → Combobox-DTeu9_RR.d.mts} +3 -3
- package/dist/Combobox.d.mts +2 -2
- package/dist/{ComboboxBase-B7ZcqU9p.d.mts → ComboboxBase-BMBdtP2Z.d.mts} +2 -2
- package/dist/ComboboxBase.d.mts +1 -1
- package/dist/{ComboboxMultiSelect-BkdRrH6K.d.mts → ComboboxMultiSelect-DY5bAep9.d.mts} +2 -2
- package/dist/ComboboxMultiSelect.d.mts +1 -1
- package/dist/{ComboboxSingleSelect-DIBRZmvS.d.mts → ComboboxSingleSelect-1NglA-u2.d.mts} +3 -3
- package/dist/ComboboxSingleSelect.d.mts +1 -1
- package/dist/{CompactBar-CfrrZ69k.d.mts → CompactBar-D9egXqY_.d.mts} +2 -2
- package/dist/CompactBar.d.mts +1 -1
- package/dist/{ControlBar-D9KflqmH.d.mts → ControlBar-RIz-xjxs.d.mts} +18 -1
- package/dist/ControlBar.d.mts +1 -1
- package/dist/{DataTable-BoAAKhVH.mjs → DataTable-DQ8axNfo.mjs} +3 -3
- package/dist/{DataTable-BoAAKhVH.mjs.map → DataTable-DQ8axNfo.mjs.map} +1 -1
- package/dist/{DataTable--_f1Obhj.d.mts → DataTable-l1bFeLXL.d.mts} +6 -5
- package/dist/DataTable.d.mts +1 -1
- package/dist/DropdownButton.d.mts +1 -1
- package/dist/{DropdownMenu-Bie2cWjb.d.mts → DropdownMenu-UIrnFxfG.d.mts} +2 -2
- package/dist/DropdownMenu.d.mts +1 -1
- package/dist/{FormField-C4B2qFgh.mjs → FormField-C0cd1zVd.mjs} +3 -3
- package/dist/{FormField-C4B2qFgh.mjs.map → FormField-C0cd1zVd.mjs.map} +1 -1
- package/dist/ImageThumbnail.d.mts +43 -0
- package/dist/IndexTableLayout.d.mts +3 -3
- package/dist/InlineCombobox.d.mts +1 -1
- package/dist/InlineInput.d.mts +1 -1
- package/dist/{ListBox-DIk8suJM.d.mts → ListBox-cH0dfeLN.d.mts} +2 -2
- package/dist/ListBox.d.mts +1 -1
- package/dist/{ListBoxField-DF8rqPsu.d.mts → ListBoxField-DOpaE0q4.d.mts} +4 -4
- package/dist/ListBoxField.d.mts +1 -1
- package/dist/{LogicRow-uxpe1vZ1.d.mts → LogicRow-CaxsteGU.d.mts} +2 -2
- package/dist/LogicRow.d.mts +1 -1
- package/dist/MaskedInput.d.mts +1 -1
- package/dist/{Menu-CrThaUX2.d.mts → Menu-5VknNr1T.d.mts} +2 -2
- package/dist/Menu.d.mts +1 -1
- package/dist/{Select-CsxK6A5m.d.mts → Select-CG_Xkx0m.d.mts} +2 -2
- package/dist/Select.d.mts +1 -1
- package/dist/SelectionCard.d.mts +46 -0
- package/dist/SelectionCardGroup.d.mts +37 -0
- package/dist/SmartTextInputField.d.mts +2 -2
- package/dist/{Spinner-uVZyOh1T.mjs → Spinner-7Camx1vs.mjs} +4 -3
- package/dist/{Spinner-uVZyOh1T.mjs.map → Spinner-7Camx1vs.mjs.map} +1 -1
- package/dist/{Table--o4ZLRbb.mjs → Table-BIDaC0uS.mjs} +2 -2
- package/dist/{Table--o4ZLRbb.mjs.map → Table-BIDaC0uS.mjs.map} +1 -1
- package/dist/{TableBox-3qunC9Nl.mjs → TableBox-Bn_XZEYd.mjs} +3 -3
- package/dist/{TableBox-3qunC9Nl.mjs.map → TableBox-Bn_XZEYd.mjs.map} +1 -1
- package/dist/TableBox.d.mts +1 -1
- package/dist/{TableBoxCell-okcOQ5Ec.d.mts → TableBoxCell-v_ag22E0.d.mts} +4 -4
- package/dist/TableBoxCell.d.mts +1 -1
- package/dist/{TableBoxField-DR-SJY9z.d.mts → TableBoxField-BTpSGmgW.d.mts} +5 -5
- package/dist/TableBoxField.d.mts +1 -1
- package/dist/{TableBoxRow-DiuAB_rV.d.mts → TableBoxRow-BBTztgTT.d.mts} +2 -2
- package/dist/TableBoxRow.d.mts +1 -1
- package/dist/{TableBoxRowActions-Cm4KJsAD.d.mts → TableBoxRowActions-B9QSVySz.d.mts} +2 -2
- package/dist/TableBoxRowActions.d.mts +1 -1
- package/dist/{TableControls-n16XKO9S.mjs → TableControls-qxoq5abn.mjs} +142 -61
- package/dist/TableControls-qxoq5abn.mjs.map +1 -0
- package/dist/{TableControls-B9bvsNUc.d.mts → TableControls-wM35j3g4.d.mts} +5 -4
- package/dist/TableControls.d.mts +1 -1
- package/dist/{TableControlsContext-CZThYoj5.d.mts → TableControlsContext-rTYwRi5S.d.mts} +2 -2
- package/dist/TableControlsContext.d.mts +1 -1
- package/dist/{TableViewConfigurationDropdown-CvN7tE98.d.mts → TableViewConfigurationDropdown-Gut16-vY.d.mts} +2 -2
- package/dist/TableViewConfigurationDropdown.d.mts +1 -1
- package/dist/{clientFilterUtils-BXEpzorX.d.mts → clientFilterUtils-D0Bwapen.d.mts} +2 -2
- package/dist/clientFilterUtils.d.mts +1 -1
- package/dist/components/Combobox/index.d.mts +2 -2
- package/dist/components/Combobox/index.mjs +1 -1
- package/dist/components/DataTable/TableControls/index.d.mts +7 -7
- package/dist/components/DataTable/TableControls/index.mjs +1 -1
- package/dist/components/DataTable/index.d.mts +5 -5
- package/dist/components/DataTable/index.mjs +1 -1
- package/dist/components/DataTable/types.d.mts +1 -1
- package/dist/components/DropdownMenu/index.d.mts +1 -1
- package/dist/components/FormField/index.d.mts +4 -4
- package/dist/components/FormField/index.mjs +1 -1
- package/dist/components/ImageTile/index.mjs +82 -52
- package/dist/components/ImageTile/index.mjs.map +1 -1
- package/dist/components/ListBox/index.d.mts +3 -3
- package/dist/components/Menu/index.d.mts +1 -1
- package/dist/components/Select/index.d.mts +1 -1
- package/dist/components/SelectionCard/index.d.mts +3 -0
- package/dist/components/SelectionCard/index.mjs +272 -0
- package/dist/components/SelectionCard/index.mjs.map +1 -0
- package/dist/components/SmartTextInput/index.mjs +1 -1
- package/dist/components/Spinner/index.mjs +1 -1
- package/dist/components/Table/index.mjs +1 -1
- package/dist/components/TableBox/index.d.mts +1 -1
- package/dist/components/TableBox/index.mjs +1 -1
- package/dist/components/VersionHistory/index.mjs +1 -1
- package/dist/fieldPickerOptions.d.mts +1 -1
- package/dist/{filters-ogUUmLEf.d.mts → filters-C8YLLbH3.d.mts} +2 -2
- package/dist/filters.d.mts +1 -1
- package/dist/{helpers-Dqw5PEva.d.mts → helpers-DvqDI2e5.d.mts} +2 -2
- package/dist/helpers.d.mts +1 -1
- package/dist/{index-Ck939aXd.d.mts → index-CNDe1Lij.d.mts} +3 -3
- package/dist/{inputFields-DVLg_2wz.d.mts → inputFields-BZcm1UV5.d.mts} +4 -4
- package/dist/inputFields.d.mts +1 -1
- package/dist/patterns/IndexTableLayout/index.mjs +1 -1
- package/dist/patterns/LayoutLoadingShimmer/index.mjs +1 -1
- package/dist/{types-Bdi8Y7ll.d.mts → types-Ci-KTHfu.d.mts} +3 -3
- package/dist/{types-BQP14Fng.d.mts → types-SYxBPX6o.d.mts} +2 -2
- package/dist/types5.d.mts +1 -1
- package/dist/useColumnConfiguration.d.mts +2 -2
- package/dist/useComboboxFooterAction.d.mts +1 -1
- package/dist/{useTableColumns-DdU0CLcU.d.mts → useTableColumns-PyxNyTD6.d.mts} +2 -2
- package/dist/useTableColumns.d.mts +1 -1
- package/dist/useTruncation.d.mts +1 -1
- package/llms.txt +2 -1
- package/package.json +4 -2
- package/skills/ui-authoring/COMPONENTS.md +1 -0
- package/skills/ui-authoring/PATTERNS.md +5 -1
- package/skills/ui-authoring/SKILL.md +8 -0
- package/skills/ui-authoring/STANDARD.md +137 -0
- package/skills/ui-authoring/TOKENS.md +3 -1
- package/skills/ui-authoring/lanes.json +22 -0
- package/dist/TableControls-n16XKO9S.mjs.map +0 -1
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { t as Pagination } from "./Pagination-COcFWlha.mjs";
|
|
2
|
-
import { i as BaseFilterConfig, n as AttributeColumn, s as FilterConfig } from "./types-
|
|
3
|
-
import { r as TableControlsProps, t as TableControls } from "./TableControls-
|
|
4
|
-
import { C as RowAction, O as SortProps, _ as DataTableColumns, l as DataTableColumnFormat, t as BulkAction } from "./types-
|
|
5
|
-
import { t as RenderFormatFn } from "./useTableColumns-
|
|
2
|
+
import { i as BaseFilterConfig, n as AttributeColumn, s as FilterConfig } from "./types-Ci-KTHfu.mjs";
|
|
3
|
+
import { r as TableControlsProps, t as TableControls } from "./TableControls-wM35j3g4.mjs";
|
|
4
|
+
import { C as RowAction, O as SortProps, _ as DataTableColumns, l as DataTableColumnFormat, t as BulkAction } from "./types-SYxBPX6o.mjs";
|
|
5
|
+
import { t as RenderFormatFn } from "./useTableColumns-PyxNyTD6.mjs";
|
|
6
6
|
import { ComponentProps } from "react";
|
|
7
7
|
import * as _$styled_components0 from "styled-components";
|
|
8
8
|
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
@@ -38,6 +38,7 @@ declare const StyledDataTableControls: _$styled_components0.StyledComponent<(<TF
|
|
|
38
38
|
canEditViews,
|
|
39
39
|
onSelectView,
|
|
40
40
|
views,
|
|
41
|
+
starredDefaultView,
|
|
41
42
|
hiddenViewIds,
|
|
42
43
|
currentView,
|
|
43
44
|
onAddView,
|
|
@@ -438,4 +439,4 @@ declare const DataTable: <TData extends RowData, TFilter extends BaseFilterConfi
|
|
|
438
439
|
}: DataTableProps<TData, TFilter>) => _$react_jsx_runtime0.JSX.Element;
|
|
439
440
|
//#endregion
|
|
440
441
|
export { FloatingActionBarContainer as a, DataTableProps as i, DataTableContainer as n, DataTableControls as r, DataTable as t };
|
|
441
|
-
//# sourceMappingURL=DataTable
|
|
442
|
+
//# sourceMappingURL=DataTable-l1bFeLXL.d.mts.map
|
package/dist/DataTable.d.mts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { a as FloatingActionBarContainer, i as DataTableProps, n as DataTableContainer, r as DataTableControls, t as DataTable } from "./DataTable
|
|
1
|
+
import { a as FloatingActionBarContainer, i as DataTableProps, n as DataTableContainer, r as DataTableControls, t as DataTable } from "./DataTable-l1bFeLXL.mjs";
|
|
2
2
|
export { DataTable, DataTable as default, DataTableContainer, DataTableControls, DataTableProps, FloatingActionBarContainer };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { r as ButtonProps } from "./Button-CyjqQa5v.mjs";
|
|
2
|
-
import { n as DropdownMenuProps } from "./DropdownMenu-
|
|
2
|
+
import { n as DropdownMenuProps } from "./DropdownMenu-UIrnFxfG.mjs";
|
|
3
3
|
import { FC, ReactNode } from "react";
|
|
4
4
|
|
|
5
5
|
//#region components/DropdownButton/DropdownButton.d.ts
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { l as MenuItemProps, s as MenuHeadingProps } from "./Menu-
|
|
1
|
+
import { l as MenuItemProps, s as MenuHeadingProps } from "./Menu-5VknNr1T.mjs";
|
|
2
2
|
import { ComponentPropsWithRef, ComponentPropsWithoutRef, ElementType, FC, FunctionComponentElement } from "react";
|
|
3
3
|
import * as _$styled_components0 from "styled-components";
|
|
4
4
|
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
@@ -72,4 +72,4 @@ declare const _default: (({
|
|
|
72
72
|
};
|
|
73
73
|
//#endregion
|
|
74
74
|
export { DropdownMenuProps as n, _default as r, DropdownMenu as t };
|
|
75
|
-
//# sourceMappingURL=DropdownMenu-
|
|
75
|
+
//# sourceMappingURL=DropdownMenu-UIrnFxfG.d.mts.map
|
package/dist/DropdownMenu.d.mts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as DropdownMenuProps, r as _default, t as DropdownMenu } from "./DropdownMenu-
|
|
1
|
+
import { n as DropdownMenuProps, r as _default, t as DropdownMenu } from "./DropdownMenu-UIrnFxfG.mjs";
|
|
2
2
|
export { DropdownMenu, DropdownMenuProps, _default as default };
|
|
@@ -5,7 +5,7 @@ import { t as FormControlContext } from "./useFormField-CbNYbDdp.mjs";
|
|
|
5
5
|
import Input_default from "./components/Input/index.mjs";
|
|
6
6
|
import { n as DropdownMenu_default } from "./DropdownMenu-CedsmO5h.mjs";
|
|
7
7
|
import { t as Checkbox } from "./Checkbox-BaJ-dGdX.mjs";
|
|
8
|
-
import { t as Combobox } from "./Combobox-
|
|
8
|
+
import { t as Combobox } from "./Combobox-CBM-oY-e.mjs";
|
|
9
9
|
import { n as Select } from "./Select-BJ9ACmRD.mjs";
|
|
10
10
|
import { a as FormLabel, i as FormInputContainer, n as ErrorText, o as HelperText, r as FormControl, s as WarningText } from "./FormControl-C4CiA0H-.mjs";
|
|
11
11
|
import { t as ListBox } from "./ListBox-eoyBHtnJ.mjs";
|
|
@@ -13,7 +13,7 @@ import { t as RadioGroup } from "./RadioGroup-erKerwSt.mjs";
|
|
|
13
13
|
import { t as SegmentedControl } from "./SegmentedControl-DQjIO6iX.mjs";
|
|
14
14
|
import { t as TextAreaWithStyle } from "./TextArea-CaIEBz8d.mjs";
|
|
15
15
|
import { t as Toggle } from "./Toggle-BsqSNYok.mjs";
|
|
16
|
-
import { t as TableBox } from "./TableBox-
|
|
16
|
+
import { t as TableBox } from "./TableBox-Bn_XZEYd.mjs";
|
|
17
17
|
import { Spacing } from "@persona/design-tokens";
|
|
18
18
|
import { Children, Fragment, cloneElement, createContext, forwardRef, useContext, useMemo, useRef, useState } from "react";
|
|
19
19
|
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
|
|
@@ -483,4 +483,4 @@ TableBoxField.Cell = TableBox.Cell;
|
|
|
483
483
|
//#endregion
|
|
484
484
|
export { CheckboxField as a, SegmentedControlField as c, TextField as d, ToggleField as f, CheckboxGroupField as i, SelectField as l, FormField as m, TableBoxField as n, ComboboxField as o, splitOutFormFieldProps as p, ListBoxField as r, RadioGroupField as s, TABLE_BOX_FIELD_ADD_BUTTON_ARIA_LABEL as t, TextAreaField as u };
|
|
485
485
|
|
|
486
|
-
//# sourceMappingURL=FormField-
|
|
486
|
+
//# sourceMappingURL=FormField-C0cd1zVd.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormField-C4B2qFgh.mjs","names":["Input","TextArea","DropdownMenu","DropdownMenu"],"sources":["../components/FormField/FormField.tsx","../components/FormField/inputFields.tsx","../components/FormField/CheckboxGroupField.tsx","../components/FormField/ListBoxField.tsx","../components/FormField/TableBoxField.tsx"],"sourcesContent":["import { type ComponentPropsWithRef, forwardRef, type ReactElement, type ReactNode } from 'react';\n\nimport { Spacing } from '@persona/design-tokens';\nimport useFormGroup from 'design-system/components/ConfigFormGroup/useFormGroup';\nimport FormControl, {\n ErrorText,\n type FormControlProps,\n FormInputContainer,\n FormLabel,\n HelperText,\n WarningText,\n} from 'design-system/components/FormControl';\nimport { HStack } from 'design-system/components/Stack';\n\nexport interface FormFieldBaseProps {\n /**\n * Renders `<Label>` above input\n */\n label?: ReactNode;\n\n /**\n * ID of the input element. Providing this will automatically link the label to the input.\n */\n inputId?: string;\n\n /** Marks the field as required. The label renders an asterisk; composed fields also forward `required` to their input. */\n required?: boolean;\n\n /**\n * Renders `<HelperText>` below input\n */\n helperText?: ReactNode;\n\n /**\n * Renders `<ErrorText>` below input and helper text.\n */\n errorText?: ReactNode;\n\n /**\n * Renders `<WarningText>` below input and helper text.\n */\n warningText?: ReactNode;\n\n /**\n * Should be an input of some sort\n */\n children?: ReactElement;\n\n labelProps?: ComponentPropsWithRef<typeof FormLabel>;\n helperProps?: ComponentPropsWithRef<typeof HelperText>;\n warningProps?: ComponentPropsWithRef<typeof WarningText>;\n errorProps?: ComponentPropsWithRef<typeof ErrorText>;\n\n /**\n * Whether to render the form field as a config field.\n * This will render the helper text as a tooltip.\n */\n configField?: boolean;\n\n /**\n * Override the width of the input area when `configField` is true.\n * Accepts any valid CSS width value (e.g. `'33%'`, `'66.67%'`).\n * Defaults to `'50%'`.\n */\n configFieldInputWidth?: string;\n\n /**\n * Renders actions to the right of the label.\n */\n rightActions?: ReactNode;\n}\n\nexport interface FormFieldProps extends Omit<FormControlProps, 'children'>, FormFieldBaseProps {}\n\n/**\n * Helper component with preset slots for label, input, and helper texts.\n *\n * Prefer a composed field component, such as `<TextField>`, `<SelectField>`, or\n * `<CheckboxField>`, when one is available for the input type. Use `<FormField>` directly\n * when composing a custom control or layout.\n *\n * ## Usage\n *\n * ```tsx\n * import FormField from 'design-system/components/FormField';\n * ```\n */\nexport const FormField = forwardRef<HTMLDivElement, FormFieldProps>(function FormField(\n {\n label,\n children,\n helperText,\n warningText,\n errorText,\n labelProps,\n helperProps,\n warningProps,\n errorProps,\n configField: configFieldProp,\n configFieldInputWidth,\n rightActions,\n ...props\n }: FormFieldProps,\n ref,\n) {\n const { configField: configFieldFormGroup } = useFormGroup();\n const configField = configFieldProp ?? configFieldFormGroup;\n\n const labelElement = label ? (\n <FormLabel tooltip={configField && helperText ? helperText : undefined} {...labelProps}>\n {label}\n </FormLabel>\n ) : null;\n\n return (\n <FormControl\n hasError={!!errorText}\n hasWarning={!!warningText}\n ref={ref}\n configField={configField}\n hasRightActions={!!rightActions}\n configFieldInputWidth={configFieldInputWidth}\n {...props}\n >\n {rightActions ? (\n <HStack justify='space-between' align='center'>\n {labelElement}\n <HStack spacing={Spacing[1]}>{rightActions}</HStack>\n </HStack>\n ) : (\n labelElement\n )}\n <FormInputContainer>{children}</FormInputContainer>\n {!configField && helperText && <HelperText {...helperProps}>{helperText}</HelperText>}\n {!configField && warningText && <WarningText {...warningProps}>{warningText}</WarningText>}\n {!configField && errorText && <ErrorText {...errorProps}>{errorText}</ErrorText>}\n </FormControl>\n );\n});\n\nexport default FormField;\n","import { uniqueId } from 'lodash-es';\nimport { forwardRef, useMemo } from 'react';\n\nimport Checkbox, { type CheckboxProps } from 'design-system/components/Checkbox';\nimport Combobox from 'design-system/components/Combobox';\nimport type { ComboboxMultiSelectProps } from 'design-system/components/Combobox/ComboboxMultiSelect';\nimport type { ComboboxSingleSelectProps } from 'design-system/components/Combobox/ComboboxSingleSelect';\nimport FormField, { type FormFieldBaseProps } from 'design-system/components/FormField/FormField';\nimport Input, { type InputProps } from 'design-system/components/Input';\nimport RadioGroup, { type RadioGroupProps } from 'design-system/components/RadioGroup';\nimport SegmentedControl, {\n type SegmentedControlProps,\n} from 'design-system/components/SegmentedControl';\nimport Select, { type SelectProps } from 'design-system/components/Select';\nimport TextArea, { type TextAreaProps } from 'design-system/components/TextArea';\nimport Toggle, { type ToggleProps } from 'design-system/components/Toggle';\n\nexport type ImplementsFormField = Omit<FormFieldBaseProps, 'children'>;\n\ntype ExtractFormFieldProps<T extends ImplementsFormField> = Pick<\n T,\n | 'label'\n | 'inputId'\n | 'required'\n | 'helperText'\n | 'errorText'\n | 'warningText'\n | 'labelProps'\n | 'helperProps'\n | 'warningProps'\n | 'errorProps'\n | 'configField'\n | 'configFieldInputWidth'\n | 'rightActions'\n>;\ntype OmitFormFieldProps<T extends ImplementsFormField> = Omit<\n T,\n Exclude<keyof ExtractFormFieldProps<T>, 'required'>\n>;\n\n/**\n * Helper to split out props that are sent to the FormField component from props sent\n * to the underlying input component.\n */\nexport const splitOutFormFieldProps = <T extends ImplementsFormField>(\n props: T,\n): {\n formFieldProps: ExtractFormFieldProps<T>;\n inputProps: OmitFormFieldProps<T>;\n} => {\n const {\n label,\n inputId,\n helperText,\n errorText,\n warningText,\n labelProps,\n helperProps,\n warningProps,\n errorProps,\n configField,\n configFieldInputWidth,\n rightActions,\n ...inputProps\n } = props;\n\n return {\n formFieldProps: {\n label,\n inputId,\n required: props.required,\n helperText,\n errorText,\n warningText,\n labelProps,\n helperProps,\n warningProps,\n errorProps,\n configField,\n configFieldInputWidth,\n rightActions,\n },\n inputProps,\n };\n};\n\nexport interface TextFieldProps extends ImplementsFormField, InputProps {}\n\nexport const TextField = forwardRef<HTMLInputElement, TextFieldProps>(\n function TextField(props, ref) {\n const { formFieldProps, inputProps } = splitOutFormFieldProps(props);\n const { id, ...rest } = inputProps;\n\n return (\n <FormField\n {...formFieldProps}\n labelProps={{ size: props.size, ...formFieldProps.labelProps }}\n inputId={formFieldProps.inputId ?? id}\n >\n <Input {...rest} ref={ref} />\n </FormField>\n );\n },\n);\n\nexport interface TextAreaFieldProps extends ImplementsFormField, TextAreaProps {}\n\nexport const TextAreaField = forwardRef<HTMLTextAreaElement, TextAreaFieldProps>(\n function TextAreaField(props, ref) {\n const { formFieldProps, inputProps } = splitOutFormFieldProps(props);\n const { id, ...rest } = inputProps;\n\n return (\n <FormField\n {...formFieldProps}\n labelProps={{ size: props.size, ...formFieldProps.labelProps }}\n inputId={formFieldProps.inputId ?? id}\n >\n <TextArea {...rest} ref={ref} />\n </FormField>\n );\n },\n);\n\nexport interface SelectFieldProps extends ImplementsFormField, SelectProps {}\n\nexport const SelectField = ({ id, children, ...props }: SelectFieldProps) => {\n const { formFieldProps, inputProps } = splitOutFormFieldProps(props);\n const linkedId = useMemo(\n () => formFieldProps.inputId ?? id ?? uniqueId('pds-form-field-input-fields-select__'),\n [formFieldProps.inputId, id],\n );\n\n return (\n <FormField\n {...formFieldProps}\n inputId={linkedId}\n labelProps={{ htmlFor: linkedId, size: inputProps.size, ...formFieldProps.labelProps }}\n >\n <Select {...inputProps} id={linkedId}>\n {children}\n </Select>\n </FormField>\n );\n};\n\nexport interface RadioGroupFieldProps\n extends Omit<ImplementsFormField, 'configField'>, RadioGroupProps {}\n\nexport const RadioGroupField = ({\n label,\n helperText,\n errorText,\n warningText,\n required,\n children,\n ...props\n}: RadioGroupFieldProps) => {\n return (\n <FormField\n label={label}\n helperText={helperText}\n warningText={warningText}\n errorText={errorText}\n required={required}\n >\n <RadioGroup {...props} aria-required={required}>\n {children}\n </RadioGroup>\n </FormField>\n );\n};\n\nexport interface CheckboxFieldProps extends ImplementsFormField, CheckboxProps {\n checkboxLabel?: CheckboxProps['label'];\n}\n\nexport const CheckboxField = ({\n label,\n helperText,\n errorText,\n warningText,\n checkboxLabel,\n configField,\n labelProps,\n required,\n ...props\n}: CheckboxFieldProps) => {\n return (\n <FormField\n label={label}\n helperText={helperText}\n warningText={warningText}\n errorText={errorText}\n configField={configField}\n labelProps={labelProps}\n required={required}\n >\n <Checkbox label={checkboxLabel} required={required} {...props} />\n </FormField>\n );\n};\n\nexport interface ToggleFieldProps extends ImplementsFormField, ToggleProps {}\n\nexport const ToggleField = forwardRef<HTMLDivElement, ToggleFieldProps>(\n function ToggleField(props, ref) {\n const { formFieldProps, inputProps } = splitOutFormFieldProps(props);\n\n return (\n <FormField\n {...formFieldProps}\n labelProps={{ size: inputProps.size, ...formFieldProps.labelProps }}\n >\n <Toggle {...inputProps} ref={ref} />\n </FormField>\n );\n },\n);\n\nexport interface SegmentedControlFieldProps\n extends ImplementsFormField, Omit<SegmentedControlProps, 'children'> {\n children?: SegmentedControlProps['children'];\n}\n\nexport const SegmentedControlField = forwardRef<HTMLDivElement, SegmentedControlFieldProps>(\n function SegmentedControlField(\n {\n label,\n helperText,\n errorText,\n warningText,\n configField,\n required,\n children,\n labelProps,\n ...props\n },\n ref,\n ) {\n return (\n <FormField\n label={label}\n helperText={helperText}\n warningText={warningText}\n errorText={errorText}\n configField={configField}\n labelProps={labelProps}\n required={required}\n >\n <SegmentedControl fullWidth {...props} aria-required={required} ref={ref}>\n {children}\n </SegmentedControl>\n </FormField>\n );\n },\n);\n\nexport type ComboboxSingleSelectFieldProps<T = string> = ImplementsFormField &\n ComboboxSingleSelectProps<T>;\nexport type ComboboxMultiSelectFieldProps<T = string> = ImplementsFormField &\n ComboboxMultiSelectProps<T>;\n\nexport const ComboboxField = (\n props: ComboboxSingleSelectFieldProps | ComboboxMultiSelectFieldProps,\n) => {\n // `Combobox` registers its own id with the surrounding `FormControl`, which is what links the\n // label to it, so the field only forwards an explicit `inputId` when one is given. Each mode is\n // split separately: `multiple` discriminates the two, and a union split at once loses that.\n if (props.multiple) {\n const { formFieldProps, inputProps } = splitOutFormFieldProps(props);\n\n return (\n <FormField {...formFieldProps}>\n <Combobox {...inputProps} />\n </FormField>\n );\n }\n\n const { formFieldProps, inputProps } = splitOutFormFieldProps(props);\n\n return (\n <FormField {...formFieldProps}>\n <Combobox {...inputProps} />\n </FormField>\n );\n};\n","import {\n Children,\n cloneElement,\n type ComponentPropsWithRef,\n createContext,\n type ReactElement,\n type ReactNode,\n useContext,\n useRef,\n} from 'react';\nimport {\n type AriaCheckboxGroupProps,\n mergeProps,\n useCheckboxGroup,\n useCheckboxGroupItem,\n} from 'react-aria';\nimport innerText from 'react-innertext';\nimport { type CheckboxGroupState, useCheckboxGroupState } from 'react-stately';\n\nimport type { CheckboxProps } from 'design-system/components/Checkbox';\nimport type Checkbox from 'design-system/components/Checkbox';\nimport { FormControlContext } from 'design-system/components/FormControl/useFormField';\nimport FormField from 'design-system/components/FormField/FormField';\nimport type { ImplementsFormField } from 'design-system/components/FormField/inputFields';\n\n/* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\nconst CheckboxGroupContext = createContext<CheckboxGroupState>(null);\n\n/** Preserves the parent FormControl context (disabled, hasError, etc.) but clears\n * inputId so each Checkbox inside the group generates its own unique id. */\nconst ClearGroupInputId = ({ children }: { children: ReactNode }) => {\n const parentContext = useContext(FormControlContext);\n return (\n <FormControlContext.Provider value={{ ...parentContext, inputId: undefined }}>\n {children}\n </FormControlContext.Provider>\n );\n};\n\ninterface CheckboxGroupItemProps {\n children: ReactElement<ComponentPropsWithRef<typeof Checkbox>>;\n}\n\nconst CheckboxGroupItem = (props: CheckboxGroupItemProps) => {\n const { children } = props;\n const checkboxProps = children.props;\n\n const state = useContext(CheckboxGroupContext);\n const ref = useRef();\n const { inputProps } = useCheckboxGroupItem(\n /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n {\n ...checkboxProps,\n onChange: undefined,\n isDisabled: checkboxProps.disabled,\n isReadOnly: checkboxProps.readOnly,\n isRequired: checkboxProps.required,\n isIndeterminate: checkboxProps.indeterminate,\n value: String(children.props.value),\n 'aria-label': innerText(checkboxProps.label),\n },\n state,\n ref,\n );\n\n return cloneElement(\n children,\n /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n mergeProps(inputProps, {\n onChange: checkboxProps.onChange,\n disabled: state.isDisabled || checkboxProps.disabled,\n checked: state.isSelected(String(inputProps.value)),\n ref,\n } as ComponentPropsWithRef<typeof Checkbox>),\n );\n};\n\ninterface CheckboxGroupFieldProps\n extends\n Omit<ImplementsFormField, 'configField'>,\n Omit<\n AriaCheckboxGroupProps,\n 'description' | 'disabled' | 'isReadOnly' | 'isRequired' | 'errorMessage'\n > {\n children?: ReactElement<CheckboxProps>[];\n disabled?: boolean;\n readOnly?: boolean;\n required?: boolean;\n}\n\nconst CheckboxGroupField = ({\n children,\n name,\n onChange,\n disabled,\n readOnly,\n required,\n ...props\n}: CheckboxGroupFieldProps) => {\n const reactAriaProps = {\n ...props,\n description: props.helperText,\n errorMessage: props.errorText,\n onChange,\n name,\n isDisabled: disabled,\n isReadOnly: readOnly,\n isRequired: required,\n };\n const state = useCheckboxGroupState(reactAriaProps);\n const { groupProps, labelProps, descriptionProps, errorMessageProps } = useCheckboxGroup(\n reactAriaProps,\n state,\n );\n\n return (\n <FormField\n labelProps={labelProps}\n helperProps={descriptionProps}\n errorProps={errorMessageProps}\n disabled={disabled}\n required={required}\n {...groupProps}\n {...props}\n >\n <ClearGroupInputId>\n <CheckboxGroupContext.Provider value={state}>\n {Children.map(children, (checkbox) => (\n /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n <CheckboxGroupItem>{checkbox}</CheckboxGroupItem>\n ))}\n </CheckboxGroupContext.Provider>\n </ClearGroupInputId>\n </FormField>\n );\n};\n\nexport default CheckboxGroupField;\n","import { type ReactNode, useState } from 'react';\n\nimport { MoreIcon, PlusIcon } from '@persona/icons';\nimport { IconButton } from 'design-system/components/Button';\nimport useFormGroup from 'design-system/components/ConfigFormGroup/useFormGroup';\nimport DropdownMenu from 'design-system/components/DropdownMenu';\nimport FormField from 'design-system/components/FormField/FormField';\nimport type { ImplementsFormField } from 'design-system/components/FormField/inputFields';\nimport ListBox, { type ListBoxProps } from 'design-system/components/ListBox';\nimport type { MenuItemProps } from 'design-system/components/Menu';\n\ninterface ListBoxFieldAction extends Omit<MenuItemProps, 'children'> {\n label: string;\n onClick: (selectedKeys: ListBoxProps<any>['selectedKeys']) => void;\n}\n\ninterface AddDropdownConfig {\n options: ({ label: ReactNode; value: string } & Omit<MenuItemProps, 'children'>)[];\n onSelection: (value: string) => void;\n}\n\ninterface ListBoxFieldProps<T extends object> extends ImplementsFormField, ListBoxProps<T> {\n actions?: ListBoxFieldAction[];\n addDropdownConfig?: AddDropdownConfig;\n /** Disables the add button, e.g. while the list is read-only. */\n addDisabled?: boolean;\n}\n\nconst ListBoxField = <T extends object>({\n label,\n helperText,\n errorText,\n warningText,\n labelProps,\n helperProps,\n errorProps,\n warningProps,\n inputId,\n required,\n onAdd,\n onDelete,\n deleteDisabled,\n configField: configFieldProp,\n size = 'md',\n actions = [],\n addDropdownConfig,\n addDisabled,\n selectedKeys: selectedKeysProp,\n onSelectionChange,\n defaultSelectedKeys,\n ...props\n}: ListBoxFieldProps<T>) => {\n const { configField } = useFormGroup({ configField: configFieldProp });\n const menuActions: ListBoxFieldAction[] = [...actions];\n const [selectedKeysState, setSelectedKeys] = useState(defaultSelectedKeys);\n const selectedKeys = selectedKeysProp ?? selectedKeysState;\n const effectiveSize = configField ? 'sm' : size;\n\n if (onDelete) {\n menuActions.unshift({\n label: 'Delete',\n onClick: () => onDelete(selectedKeys),\n disabled:\n deleteDisabled ||\n selectedKeys == null ||\n (typeof selectedKeys === 'object' && [...selectedKeys].length === 0),\n });\n }\n\n const addButton = (\n <IconButton size='sm' onClick={onAdd} aria-label='Add item to list' disabled={addDisabled}>\n <PlusIcon />\n </IconButton>\n );\n\n return (\n <FormField\n label={label}\n helperText={helperText}\n errorText={errorText}\n warningText={warningText}\n labelProps={labelProps}\n helperProps={helperProps}\n errorProps={errorProps}\n warningProps={warningProps}\n inputId={inputId}\n required={required}\n configField={configField}\n rightActions={\n configField && (\n <>\n {menuActions.length > 0 && (\n <DropdownMenu\n trigger={\n <IconButton aria-label='Actions' size='sm'>\n <MoreIcon />\n </IconButton>\n }\n portal\n >\n {menuActions.map((action) => (\n <DropdownMenu.Item\n key={action.label}\n {...action}\n onClick={() => action.onClick(selectedKeys)}\n size={effectiveSize}\n >\n {action.label}\n </DropdownMenu.Item>\n ))}\n </DropdownMenu>\n )}\n {onAdd && !addDropdownConfig && addButton}\n {addDropdownConfig && (\n <DropdownMenu trigger={addButton} align='start' portal>\n {addDropdownConfig.options.map((option) => (\n <DropdownMenu.Item\n key={option.value}\n {...option}\n onClick={() => addDropdownConfig.onSelection(option.value)}\n size={effectiveSize}\n >\n {option.label}\n </DropdownMenu.Item>\n ))}\n </DropdownMenu>\n )}\n </>\n )\n }\n >\n <ListBox\n id={inputId}\n fullWidth={configField}\n size={effectiveSize}\n deleteDisabled={deleteDisabled}\n // We have to control the keys so we can power the `rightActions`\n selectedKeys={selectedKeys}\n onSelectionChange={(keys) => {\n onSelectionChange?.(keys);\n setSelectedKeys(keys);\n }}\n {...props}\n />\n </FormField>\n );\n};\n\nexport default ListBoxField;\n","import { Fragment, type MouseEvent, type ReactNode, useState } from 'react';\n\nimport { IconButton } from '@persona/design-system/components/Button';\nimport { useFormGroup } from '@persona/design-system/components/ConfigFormGroup';\nimport DropdownMenu from '@persona/design-system/components/DropdownMenu';\nimport type { FormLabelProps } from '@persona/design-system/components/FormControl';\nimport type { MenuItemProps } from '@persona/design-system/components/Menu';\nimport TableBox, { type TableBoxProps } from '@persona/design-system/components/TableBox';\nimport { MoreIcon, PlusIcon } from '@persona/icons';\n\nimport FormField from './FormField';\nimport type { ImplementsFormField } from './inputFields';\n\nexport interface TableBoxFieldAction extends Omit<MenuItemProps, 'children'> {\n label: string;\n onClick: (selectedKey: TableBoxProps['selectedKey']) => void;\n}\n\nexport interface TableBoxFieldActionGroup {\n type: 'group';\n heading: string;\n actions: TableBoxFieldAction[];\n}\n\nexport type TableBoxFieldActionEntry = TableBoxFieldAction | TableBoxFieldActionGroup;\n\n/** Aria-label on TableBoxField's + button. Consumers that style or detect that\n * button (e.g. popover toggle guards) should import this rather than redefining it. */\nexport const TABLE_BOX_FIELD_ADD_BUTTON_ARIA_LABEL = 'Add item to table';\n\nconst isActionGroup = (action: TableBoxFieldActionEntry): action is TableBoxFieldActionGroup =>\n 'type' in action && action.type === 'group';\n\ninterface AddDropdownConfig {\n options: Array<{ label: string; value: string }>;\n onSelection: (value: string) => void;\n}\n\ninterface TableBoxFieldProps<T extends object = object>\n extends ImplementsFormField, Omit<TableBoxProps<T>, 'aria-label' | 'onCreateNewRow'> {\n onAdd?: (e: MouseEvent<HTMLButtonElement>) => void;\n onDelete?: (selectedKey: string | null) => void;\n deleteDisabled?: boolean;\n /** Actions and labeled action groups rendered in order. Empty groups are omitted. */\n actions?: TableBoxFieldActionEntry[];\n addDropdownConfig?: AddDropdownConfig;\n\n /**\n * Callback to create a new row and add it to the rows array\n * Should return the id of the newly created row\n */\n createNewRow?: () => string;\n children?: ReactNode;\n}\n\nconst TableBoxField = <T extends object = object>({\n label,\n helperText,\n errorText,\n warningText,\n labelProps: labelPropsProp,\n helperProps,\n errorProps,\n warningProps,\n inputId,\n required,\n onAdd,\n onDelete,\n deleteDisabled,\n configField: configFieldProp = true,\n actions = [],\n addDropdownConfig,\n selectedKey: selectedKeyProp,\n onSelectionChange,\n defaultSelectedKey,\n selectionMode,\n disabled,\n createNewRow,\n children,\n emptyText = 'No data',\n ...props\n}: TableBoxFieldProps<T>) => {\n const { configField } = useFormGroup({ configField: configFieldProp });\n const menuActions: TableBoxFieldActionEntry[] = [...actions];\n const [selectedKeyState, setSelectedKey] = useState(defaultSelectedKey);\n const selectedKey = selectedKeyProp ?? selectedKeyState;\n const [newRowId, setNewRowId] = useState<string | null>(null);\n const labelProps: FormLabelProps = { size: 'sm', ...labelPropsProp };\n\n const handleCreateNewRow = () => {\n if (createNewRow) {\n setNewRowId(createNewRow());\n }\n };\n\n // Handle add button click\n const handleAddClick = (e: MouseEvent<HTMLButtonElement>) => {\n if (createNewRow) {\n handleCreateNewRow();\n } else if (onAdd) {\n onAdd(e);\n }\n };\n\n if (onDelete) {\n menuActions.unshift({\n label: 'Delete',\n onClick: () => selectedKey && onDelete(selectedKey),\n disabled: deleteDisabled || selectedKey == null,\n });\n }\n const visibleMenuActions = menuActions.filter(\n (action) => !isActionGroup(action) || action.actions.length > 0,\n );\n\n const addButton = (\n <IconButton\n size='sm'\n onClick={handleAddClick}\n aria-label={TABLE_BOX_FIELD_ADD_BUTTON_ARIA_LABEL}\n disabled={disabled}\n >\n <PlusIcon />\n </IconButton>\n );\n\n return (\n <FormField\n label={label}\n helperText={helperText}\n errorText={errorText}\n warningText={warningText}\n labelProps={labelProps}\n helperProps={helperProps}\n errorProps={errorProps}\n warningProps={warningProps}\n inputId={inputId}\n required={required}\n rightActions={\n configField && (\n <>\n {visibleMenuActions.length > 0 && (\n <DropdownMenu\n trigger={\n <IconButton aria-label='Actions' size='sm' disabled={disabled}>\n <MoreIcon />\n </IconButton>\n }\n portal\n >\n {visibleMenuActions.map((entry, entryIndex) => {\n const previousEntry = visibleMenuActions[entryIndex - 1];\n if (isActionGroup(entry)) {\n return (\n <Fragment key={`${entry.heading}-${entryIndex}`}>\n {entryIndex > 0 && <DropdownMenu.Divider />}\n <DropdownMenu.Heading size='sm'>{entry.heading}</DropdownMenu.Heading>\n {entry.actions.map((action) => (\n <DropdownMenu.Item\n key={action.label}\n {...action}\n disabled={disabled || action.disabled}\n onClick={() => action.onClick(selectedKey)}\n size='sm'\n >\n {action.label}\n </DropdownMenu.Item>\n ))}\n </Fragment>\n );\n }\n\n return (\n <Fragment key={`${entry.label}-${entryIndex}`}>\n {previousEntry && isActionGroup(previousEntry) && <DropdownMenu.Divider />}\n <DropdownMenu.Item\n {...entry}\n disabled={disabled || entry.disabled}\n onClick={() => entry.onClick(selectedKey)}\n size='sm'\n >\n {entry.label}\n </DropdownMenu.Item>\n </Fragment>\n );\n })}\n </DropdownMenu>\n )}\n {(onAdd || createNewRow) && !addDropdownConfig && addButton}\n {addDropdownConfig && (\n <DropdownMenu trigger={addButton} portal>\n {addDropdownConfig.options.map((option) => (\n <DropdownMenu.Item\n key={option.value}\n {...option}\n onClick={() => addDropdownConfig.onSelection(option.value)}\n size='sm'\n >\n {option.label}\n </DropdownMenu.Item>\n ))}\n </DropdownMenu>\n )}\n </>\n )\n }\n >\n <TableBox\n aria-label={`${label} table`}\n // We have to control the keys so we can power the `rightActions`\n selectedKey={selectedKey}\n onSelectionChange={(key) => {\n onSelectionChange?.(key);\n setSelectedKey(key);\n }}\n selectionMode={selectionMode}\n newRowId={newRowId}\n onCreateNewRow={createNewRow ? handleCreateNewRow : undefined}\n emptyText={emptyText}\n disabled={disabled}\n {...props}\n >\n {children}\n </TableBox>\n </FormField>\n );\n};\n\n// Attach subcomponents to TableBoxField\nTableBoxField.Row = TableBox.Row;\nTableBoxField.Cell = TableBox.Cell;\n\nexport default TableBoxField;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuFA,MAAa,YAAY,WAA2C,SAAS,UAC3E,EACE,OACA,UACA,YACA,aACA,WACA,YACA,aACA,cACA,YACA,aAAa,iBACb,uBACA,cACA,GAAG,SAEL,KACA;CACA,MAAM,EAAE,aAAa,yBAAyB,cAAc;CAC5D,MAAM,cAAc,mBAAmB;CAEvC,MAAM,eAAe,QACnB,oBAAC,WAAD;EAAW,SAAS,eAAe,aAAa,aAAa,KAAA;EAAW,GAAI;YACzE;EACS,CAAA,GACV;AAEJ,QACE,qBAAC,aAAD;EACE,UAAU,CAAC,CAAC;EACZ,YAAY,CAAC,CAAC;EACT;EACQ;EACb,iBAAiB,CAAC,CAAC;EACI;EACvB,GAAI;YAPN;GASG,eACC,qBAAC,QAAD;IAAQ,SAAQ;IAAgB,OAAM;cAAtC,CACG,cACD,oBAAC,QAAD;KAAQ,SAAS,QAAQ;eAAK;KAAsB,CAAA,CAC7C;QAET;GAEF,oBAAC,oBAAD,EAAqB,UAA8B,CAAA;GAClD,CAAC,eAAe,cAAc,oBAAC,YAAD;IAAY,GAAI;cAAc;IAAwB,CAAA;GACpF,CAAC,eAAe,eAAe,oBAAC,aAAD;IAAa,GAAI;cAAe;IAA0B,CAAA;GACzF,CAAC,eAAe,aAAa,oBAAC,WAAD;IAAW,GAAI;cAAa;IAAsB,CAAA;GACpE;;EAEhB;;;;;;;AC9FF,MAAa,0BACX,UAIG;CACH,MAAM,EACJ,OACA,SACA,YACA,WACA,aACA,YACA,aACA,cACA,YACA,aACA,uBACA,cACA,GAAG,eACD;AAEJ,QAAO;EACL,gBAAgB;GACd;GACA;GACA,UAAU,MAAM;GAChB;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD;EACD;EACD;;AAKH,MAAa,YAAY,WACvB,SAAS,UAAU,OAAO,KAAK;CAC7B,MAAM,EAAE,gBAAgB,eAAe,uBAAuB,MAAM;CACpE,MAAM,EAAE,IAAI,GAAG,SAAS;AAExB,QACE,oBAAC,WAAD;EACE,GAAI;EACJ,YAAY;GAAE,MAAM,MAAM;GAAM,GAAG,eAAe;GAAY;EAC9D,SAAS,eAAe,WAAW;YAEnC,oBAACA,eAAD;GAAO,GAAI;GAAW;GAAO,CAAA;EACnB,CAAA;EAGjB;AAID,MAAa,gBAAgB,WAC3B,SAAS,cAAc,OAAO,KAAK;CACjC,MAAM,EAAE,gBAAgB,eAAe,uBAAuB,MAAM;CACpE,MAAM,EAAE,IAAI,GAAG,SAAS;AAExB,QACE,oBAAC,WAAD;EACE,GAAI;EACJ,YAAY;GAAE,MAAM,MAAM;GAAM,GAAG,eAAe;GAAY;EAC9D,SAAS,eAAe,WAAW;YAEnC,oBAACC,mBAAD;GAAU,GAAI;GAAW;GAAO,CAAA;EACtB,CAAA;EAGjB;AAID,MAAa,eAAe,EAAE,IAAI,UAAU,GAAG,YAA8B;CAC3E,MAAM,EAAE,gBAAgB,eAAe,uBAAuB,MAAM;CACpE,MAAM,WAAW,cACT,eAAe,WAAW,MAAM,SAAS,uCAAuC,EACtF,CAAC,eAAe,SAAS,GAAG,CAC7B;AAED,QACE,oBAAC,WAAD;EACE,GAAI;EACJ,SAAS;EACT,YAAY;GAAE,SAAS;GAAU,MAAM,WAAW;GAAM,GAAG,eAAe;GAAY;YAEtF,oBAAC,QAAD;GAAQ,GAAI;GAAY,IAAI;GACzB;GACM,CAAA;EACC,CAAA;;AAOhB,MAAa,mBAAmB,EAC9B,OACA,YACA,WACA,aACA,UACA,UACA,GAAG,YACuB;AAC1B,QACE,oBAAC,WAAD;EACS;EACK;EACC;EACF;EACD;YAEV,oBAAC,YAAD;GAAY,GAAI;GAAO,iBAAe;GACnC;GACU,CAAA;EACH,CAAA;;AAQhB,MAAa,iBAAiB,EAC5B,OACA,YACA,WACA,aACA,eACA,aACA,YACA,UACA,GAAG,YACqB;AACxB,QACE,oBAAC,WAAD;EACS;EACK;EACC;EACF;EACE;EACD;EACF;YAEV,oBAAC,UAAD;GAAU,OAAO;GAAyB;GAAU,GAAI;GAAS,CAAA;EACvD,CAAA;;AAMhB,MAAa,cAAc,WACzB,SAAS,YAAY,OAAO,KAAK;CAC/B,MAAM,EAAE,gBAAgB,eAAe,uBAAuB,MAAM;AAEpE,QACE,oBAAC,WAAD;EACE,GAAI;EACJ,YAAY;GAAE,MAAM,WAAW;GAAM,GAAG,eAAe;GAAY;YAEnE,oBAAC,QAAD;GAAQ,GAAI;GAAiB;GAAO,CAAA;EAC1B,CAAA;EAGjB;AAOD,MAAa,wBAAwB,WACnC,SAAS,sBACP,EACE,OACA,YACA,WACA,aACA,aACA,UACA,UACA,YACA,GAAG,SAEL,KACA;AACA,QACE,oBAAC,WAAD;EACS;EACK;EACC;EACF;EACE;EACD;EACF;YAEV,oBAAC,kBAAD;GAAkB,WAAA;GAAU,GAAI;GAAO,iBAAe;GAAe;GAClE;GACgB,CAAA;EACT,CAAA;EAGjB;AAOD,MAAa,iBACX,UACG;AAIH,KAAI,MAAM,UAAU;EAClB,MAAM,EAAE,gBAAgB,eAAe,uBAAuB,MAAM;AAEpE,SACE,oBAAC,WAAD;GAAW,GAAI;aACb,oBAAC,UAAD,EAAU,GAAI,YAAc,CAAA;GAClB,CAAA;;CAIhB,MAAM,EAAE,gBAAgB,eAAe,uBAAuB,MAAM;AAEpE,QACE,oBAAC,WAAD;EAAW,GAAI;YACb,oBAAC,UAAD,EAAU,GAAI,YAAc,CAAA;EAClB,CAAA;;;;AClQhB,MAAM,uBAAuB,cAAkC,KAAK;;;AAIpE,MAAM,qBAAqB,EAAE,eAAwC;CACnE,MAAM,gBAAgB,WAAW,mBAAmB;AACpD,QACE,oBAAC,mBAAmB,UAApB;EAA6B,OAAO;GAAE,GAAG;GAAe,SAAS,KAAA;GAAW;EACzE;EAC2B,CAAA;;AAQlC,MAAM,qBAAqB,UAAkC;CAC3D,MAAM,EAAE,aAAa;CACrB,MAAM,gBAAgB,SAAS;CAE/B,MAAM,QAAQ,WAAW,qBAAqB;CAC9C,MAAM,MAAM,QAAQ;CACpB,MAAM,EAAE,eAAe,qBAErB;EACE,GAAG;EACH,UAAU,KAAA;EACV,YAAY,cAAc;EAC1B,YAAY,cAAc;EAC1B,YAAY,cAAc;EAC1B,iBAAiB,cAAc;EAC/B,OAAO,OAAO,SAAS,MAAM,MAAM;EACnC,cAAc,UAAU,cAAc,MAAM;EAC7C,EACD,OACA,IACD;AAED,QAAO,aACL,UAEA,WAAW,YAAY;EACrB,UAAU,cAAc;EACxB,UAAU,MAAM,cAAc,cAAc;EAC5C,SAAS,MAAM,WAAW,OAAO,WAAW,MAAM,CAAC;EACnD;EACD,CAA2C,CAC7C;;AAgBH,MAAM,sBAAsB,EAC1B,UACA,MACA,UACA,UACA,UACA,UACA,GAAG,YAC0B;CAC7B,MAAM,iBAAiB;EACrB,GAAG;EACH,aAAa,MAAM;EACnB,cAAc,MAAM;EACpB;EACA;EACA,YAAY;EACZ,YAAY;EACZ,YAAY;EACb;CACD,MAAM,QAAQ,sBAAsB,eAAe;CACnD,MAAM,EAAE,YAAY,YAAY,kBAAkB,sBAAsB,iBACtE,gBACA,MACD;AAED,QACE,oBAAC,WAAD;EACc;EACZ,aAAa;EACb,YAAY;EACF;EACA;EACV,GAAI;EACJ,GAAI;YAEJ,oBAAC,mBAAD,EAAA,UACE,oBAAC,qBAAqB,UAAtB;GAA+B,OAAO;aACnC,SAAS,IAAI,WAAW,aAEvB,oBAAC,mBAAD,EAAA,UAAoB,UAA6B,CAAA,CACjD;GAC4B,CAAA,EACd,CAAA;EACV,CAAA;;;;ACzGhB,MAAM,gBAAkC,EACtC,OACA,YACA,WACA,aACA,YACA,aACA,YACA,cACA,SACA,UACA,OACA,UACA,gBACA,aAAa,iBACb,OAAO,MACP,UAAU,EAAE,EACZ,mBACA,aACA,cAAc,kBACd,mBACA,qBACA,GAAG,YACuB;CAC1B,MAAM,EAAE,gBAAgB,aAAa,EAAE,aAAa,iBAAiB,CAAC;CACtE,MAAM,cAAoC,CAAC,GAAG,QAAQ;CACtD,MAAM,CAAC,mBAAmB,mBAAmB,SAAS,oBAAoB;CAC1E,MAAM,eAAe,oBAAoB;CACzC,MAAM,gBAAgB,cAAc,OAAO;AAE3C,KAAI,SACF,aAAY,QAAQ;EAClB,OAAO;EACP,eAAe,SAAS,aAAa;EACrC,UACE,kBACA,gBAAgB,QACf,OAAO,iBAAiB,YAAY,CAAC,GAAG,aAAa,CAAC,WAAW;EACrE,CAAC;CAGJ,MAAM,YACJ,oBAAC,YAAD;EAAY,MAAK;EAAK,SAAS;EAAO,cAAW;EAAmB,UAAU;YAC5E,oBAAC,UAAD,EAAY,CAAA;EACD,CAAA;AAGf,QACE,oBAAC,WAAD;EACS;EACK;EACD;EACE;EACD;EACC;EACD;EACE;EACL;EACC;EACG;EACb,cACE,eACE,qBAAA,YAAA,EAAA,UAAA;GACG,YAAY,SAAS,KACpB,oBAACC,sBAAD;IACE,SACE,oBAAC,YAAD;KAAY,cAAW;KAAU,MAAK;eACpC,oBAAC,UAAD,EAAY,CAAA;KACD,CAAA;IAEf,QAAA;cAEC,YAAY,KAAK,WAChB,oBAACA,qBAAa,MAAd;KAEE,GAAI;KACJ,eAAe,OAAO,QAAQ,aAAa;KAC3C,MAAM;eAEL,OAAO;KACU,EANb,OAAO,MAMM,CACpB;IACW,CAAA;GAEhB,SAAS,CAAC,qBAAqB;GAC/B,qBACC,oBAACA,sBAAD;IAAc,SAAS;IAAW,OAAM;IAAQ,QAAA;cAC7C,kBAAkB,QAAQ,KAAK,WAC9B,oBAACA,qBAAa,MAAd;KAEE,GAAI;KACJ,eAAe,kBAAkB,YAAY,OAAO,MAAM;KAC1D,MAAM;eAEL,OAAO;KACU,EANb,OAAO,MAMM,CACpB;IACW,CAAA;GAEhB,EAAA,CAAA;YAIP,oBAAC,SAAD;GACE,IAAI;GACJ,WAAW;GACX,MAAM;GACU;GAEF;GACd,oBAAoB,SAAS;AAC3B,wBAAoB,KAAK;AACzB,oBAAgB,KAAK;;GAEvB,GAAI;GACJ,CAAA;EACQ,CAAA;;;;;;ACpHhB,MAAa,wCAAwC;AAErD,MAAM,iBAAiB,WACrB,UAAU,UAAU,OAAO,SAAS;AAwBtC,MAAM,iBAA4C,EAChD,OACA,YACA,WACA,aACA,YAAY,gBACZ,aACA,YACA,cACA,SACA,UACA,OACA,UACA,gBACA,aAAa,kBAAkB,MAC/B,UAAU,EAAE,EACZ,mBACA,aAAa,iBACb,mBACA,oBACA,eACA,UACA,cACA,UACA,YAAY,WACZ,GAAG,YACwB;CAC3B,MAAM,EAAE,gBAAgB,aAAa,EAAE,aAAa,iBAAiB,CAAC;CACtE,MAAM,cAA0C,CAAC,GAAG,QAAQ;CAC5D,MAAM,CAAC,kBAAkB,kBAAkB,SAAS,mBAAmB;CACvE,MAAM,cAAc,mBAAmB;CACvC,MAAM,CAAC,UAAU,eAAe,SAAwB,KAAK;CAC7D,MAAM,aAA6B;EAAE,MAAM;EAAM,GAAG;EAAgB;CAEpE,MAAM,2BAA2B;AAC/B,MAAI,aACF,aAAY,cAAc,CAAC;;CAK/B,MAAM,kBAAkB,MAAqC;AAC3D,MAAI,aACF,qBAAoB;WACX,MACT,OAAM,EAAE;;AAIZ,KAAI,SACF,aAAY,QAAQ;EAClB,OAAO;EACP,eAAe,eAAe,SAAS,YAAY;EACnD,UAAU,kBAAkB,eAAe;EAC5C,CAAC;CAEJ,MAAM,qBAAqB,YAAY,QACpC,WAAW,CAAC,cAAc,OAAO,IAAI,OAAO,QAAQ,SAAS,EAC/D;CAED,MAAM,YACJ,oBAAC,YAAD;EACE,MAAK;EACL,SAAS;EACT,cAAY;EACF;YAEV,oBAAC,UAAD,EAAY,CAAA;EACD,CAAA;AAGf,QACE,oBAAC,WAAD;EACS;EACK;EACD;EACE;EACD;EACC;EACD;EACE;EACL;EACC;EACV,cACE,eACE,qBAAA,YAAA,EAAA,UAAA;GACG,mBAAmB,SAAS,KAC3B,oBAACC,sBAAD;IACE,SACE,oBAAC,YAAD;KAAY,cAAW;KAAU,MAAK;KAAe;eACnD,oBAAC,UAAD,EAAY,CAAA;KACD,CAAA;IAEf,QAAA;cAEC,mBAAmB,KAAK,OAAO,eAAe;KAC7C,MAAM,gBAAgB,mBAAmB,aAAa;AACtD,SAAI,cAAc,MAAM,CACtB,QACE,qBAAC,UAAD,EAAA,UAAA;MACG,aAAa,KAAK,oBAACA,qBAAa,SAAd,EAAwB,CAAA;MAC3C,oBAACA,qBAAa,SAAd;OAAsB,MAAK;iBAAM,MAAM;OAA+B,CAAA;MACrE,MAAM,QAAQ,KAAK,WAClB,oBAACA,qBAAa,MAAd;OAEE,GAAI;OACJ,UAAU,YAAY,OAAO;OAC7B,eAAe,OAAO,QAAQ,YAAY;OAC1C,MAAK;iBAEJ,OAAO;OACU,EAPb,OAAO,MAOM,CACpB;MACO,EAAA,EAdI,GAAG,MAAM,QAAQ,GAAG,aAcxB;AAIf,YACE,qBAAC,UAAD,EAAA,UAAA,CACG,iBAAiB,cAAc,cAAc,IAAI,oBAACA,qBAAa,SAAd,EAAwB,CAAA,EAC1E,oBAACA,qBAAa,MAAd;MACE,GAAI;MACJ,UAAU,YAAY,MAAM;MAC5B,eAAe,MAAM,QAAQ,YAAY;MACzC,MAAK;gBAEJ,MAAM;MACW,CAAA,CACX,EAAA,EAVI,GAAG,MAAM,MAAM,GAAG,aAUtB;MAEb;IACW,CAAA;IAEf,SAAS,iBAAiB,CAAC,qBAAqB;GACjD,qBACC,oBAACA,sBAAD;IAAc,SAAS;IAAW,QAAA;cAC/B,kBAAkB,QAAQ,KAAK,WAC9B,oBAACA,qBAAa,MAAd;KAEE,GAAI;KACJ,eAAe,kBAAkB,YAAY,OAAO,MAAM;KAC1D,MAAK;eAEJ,OAAO;KACU,EANb,OAAO,MAMM,CACpB;IACW,CAAA;GAEhB,EAAA,CAAA;YAIP,oBAAC,UAAD;GACE,cAAY,GAAG,MAAM;GAER;GACb,oBAAoB,QAAQ;AAC1B,wBAAoB,IAAI;AACxB,mBAAe,IAAI;;GAEN;GACL;GACV,gBAAgB,eAAe,qBAAqB,KAAA;GACzC;GACD;GACV,GAAI;GAEH;GACQ,CAAA;EACD,CAAA;;AAKhB,cAAc,MAAM,SAAS;AAC7B,cAAc,OAAO,SAAS"}
|
|
1
|
+
{"version":3,"file":"FormField-C0cd1zVd.mjs","names":["Input","TextArea","DropdownMenu","DropdownMenu"],"sources":["../components/FormField/FormField.tsx","../components/FormField/inputFields.tsx","../components/FormField/CheckboxGroupField.tsx","../components/FormField/ListBoxField.tsx","../components/FormField/TableBoxField.tsx"],"sourcesContent":["import { type ComponentPropsWithRef, forwardRef, type ReactElement, type ReactNode } from 'react';\n\nimport { Spacing } from '@persona/design-tokens';\nimport useFormGroup from 'design-system/components/ConfigFormGroup/useFormGroup';\nimport FormControl, {\n ErrorText,\n type FormControlProps,\n FormInputContainer,\n FormLabel,\n HelperText,\n WarningText,\n} from 'design-system/components/FormControl';\nimport { HStack } from 'design-system/components/Stack';\n\nexport interface FormFieldBaseProps {\n /**\n * Renders `<Label>` above input\n */\n label?: ReactNode;\n\n /**\n * ID of the input element. Providing this will automatically link the label to the input.\n */\n inputId?: string;\n\n /** Marks the field as required. The label renders an asterisk; composed fields also forward `required` to their input. */\n required?: boolean;\n\n /**\n * Renders `<HelperText>` below input\n */\n helperText?: ReactNode;\n\n /**\n * Renders `<ErrorText>` below input and helper text.\n */\n errorText?: ReactNode;\n\n /**\n * Renders `<WarningText>` below input and helper text.\n */\n warningText?: ReactNode;\n\n /**\n * Should be an input of some sort\n */\n children?: ReactElement;\n\n labelProps?: ComponentPropsWithRef<typeof FormLabel>;\n helperProps?: ComponentPropsWithRef<typeof HelperText>;\n warningProps?: ComponentPropsWithRef<typeof WarningText>;\n errorProps?: ComponentPropsWithRef<typeof ErrorText>;\n\n /**\n * Whether to render the form field as a config field.\n * This will render the helper text as a tooltip.\n */\n configField?: boolean;\n\n /**\n * Override the width of the input area when `configField` is true.\n * Accepts any valid CSS width value (e.g. `'33%'`, `'66.67%'`).\n * Defaults to `'50%'`.\n */\n configFieldInputWidth?: string;\n\n /**\n * Renders actions to the right of the label.\n */\n rightActions?: ReactNode;\n}\n\nexport interface FormFieldProps extends Omit<FormControlProps, 'children'>, FormFieldBaseProps {}\n\n/**\n * Helper component with preset slots for label, input, and helper texts.\n *\n * Prefer a composed field component, such as `<TextField>`, `<SelectField>`, or\n * `<CheckboxField>`, when one is available for the input type. Use `<FormField>` directly\n * when composing a custom control or layout.\n *\n * ## Usage\n *\n * ```tsx\n * import FormField from 'design-system/components/FormField';\n * ```\n */\nexport const FormField = forwardRef<HTMLDivElement, FormFieldProps>(function FormField(\n {\n label,\n children,\n helperText,\n warningText,\n errorText,\n labelProps,\n helperProps,\n warningProps,\n errorProps,\n configField: configFieldProp,\n configFieldInputWidth,\n rightActions,\n ...props\n }: FormFieldProps,\n ref,\n) {\n const { configField: configFieldFormGroup } = useFormGroup();\n const configField = configFieldProp ?? configFieldFormGroup;\n\n const labelElement = label ? (\n <FormLabel tooltip={configField && helperText ? helperText : undefined} {...labelProps}>\n {label}\n </FormLabel>\n ) : null;\n\n return (\n <FormControl\n hasError={!!errorText}\n hasWarning={!!warningText}\n ref={ref}\n configField={configField}\n hasRightActions={!!rightActions}\n configFieldInputWidth={configFieldInputWidth}\n {...props}\n >\n {rightActions ? (\n <HStack justify='space-between' align='center'>\n {labelElement}\n <HStack spacing={Spacing[1]}>{rightActions}</HStack>\n </HStack>\n ) : (\n labelElement\n )}\n <FormInputContainer>{children}</FormInputContainer>\n {!configField && helperText && <HelperText {...helperProps}>{helperText}</HelperText>}\n {!configField && warningText && <WarningText {...warningProps}>{warningText}</WarningText>}\n {!configField && errorText && <ErrorText {...errorProps}>{errorText}</ErrorText>}\n </FormControl>\n );\n});\n\nexport default FormField;\n","import { uniqueId } from 'lodash-es';\nimport { forwardRef, useMemo } from 'react';\n\nimport Checkbox, { type CheckboxProps } from 'design-system/components/Checkbox';\nimport Combobox from 'design-system/components/Combobox';\nimport type { ComboboxMultiSelectProps } from 'design-system/components/Combobox/ComboboxMultiSelect';\nimport type { ComboboxSingleSelectProps } from 'design-system/components/Combobox/ComboboxSingleSelect';\nimport FormField, { type FormFieldBaseProps } from 'design-system/components/FormField/FormField';\nimport Input, { type InputProps } from 'design-system/components/Input';\nimport RadioGroup, { type RadioGroupProps } from 'design-system/components/RadioGroup';\nimport SegmentedControl, {\n type SegmentedControlProps,\n} from 'design-system/components/SegmentedControl';\nimport Select, { type SelectProps } from 'design-system/components/Select';\nimport TextArea, { type TextAreaProps } from 'design-system/components/TextArea';\nimport Toggle, { type ToggleProps } from 'design-system/components/Toggle';\n\nexport type ImplementsFormField = Omit<FormFieldBaseProps, 'children'>;\n\ntype ExtractFormFieldProps<T extends ImplementsFormField> = Pick<\n T,\n | 'label'\n | 'inputId'\n | 'required'\n | 'helperText'\n | 'errorText'\n | 'warningText'\n | 'labelProps'\n | 'helperProps'\n | 'warningProps'\n | 'errorProps'\n | 'configField'\n | 'configFieldInputWidth'\n | 'rightActions'\n>;\ntype OmitFormFieldProps<T extends ImplementsFormField> = Omit<\n T,\n Exclude<keyof ExtractFormFieldProps<T>, 'required'>\n>;\n\n/**\n * Helper to split out props that are sent to the FormField component from props sent\n * to the underlying input component.\n */\nexport const splitOutFormFieldProps = <T extends ImplementsFormField>(\n props: T,\n): {\n formFieldProps: ExtractFormFieldProps<T>;\n inputProps: OmitFormFieldProps<T>;\n} => {\n const {\n label,\n inputId,\n helperText,\n errorText,\n warningText,\n labelProps,\n helperProps,\n warningProps,\n errorProps,\n configField,\n configFieldInputWidth,\n rightActions,\n ...inputProps\n } = props;\n\n return {\n formFieldProps: {\n label,\n inputId,\n required: props.required,\n helperText,\n errorText,\n warningText,\n labelProps,\n helperProps,\n warningProps,\n errorProps,\n configField,\n configFieldInputWidth,\n rightActions,\n },\n inputProps,\n };\n};\n\nexport interface TextFieldProps extends ImplementsFormField, InputProps {}\n\nexport const TextField = forwardRef<HTMLInputElement, TextFieldProps>(\n function TextField(props, ref) {\n const { formFieldProps, inputProps } = splitOutFormFieldProps(props);\n const { id, ...rest } = inputProps;\n\n return (\n <FormField\n {...formFieldProps}\n labelProps={{ size: props.size, ...formFieldProps.labelProps }}\n inputId={formFieldProps.inputId ?? id}\n >\n <Input {...rest} ref={ref} />\n </FormField>\n );\n },\n);\n\nexport interface TextAreaFieldProps extends ImplementsFormField, TextAreaProps {}\n\nexport const TextAreaField = forwardRef<HTMLTextAreaElement, TextAreaFieldProps>(\n function TextAreaField(props, ref) {\n const { formFieldProps, inputProps } = splitOutFormFieldProps(props);\n const { id, ...rest } = inputProps;\n\n return (\n <FormField\n {...formFieldProps}\n labelProps={{ size: props.size, ...formFieldProps.labelProps }}\n inputId={formFieldProps.inputId ?? id}\n >\n <TextArea {...rest} ref={ref} />\n </FormField>\n );\n },\n);\n\nexport interface SelectFieldProps extends ImplementsFormField, SelectProps {}\n\nexport const SelectField = ({ id, children, ...props }: SelectFieldProps) => {\n const { formFieldProps, inputProps } = splitOutFormFieldProps(props);\n const linkedId = useMemo(\n () => formFieldProps.inputId ?? id ?? uniqueId('pds-form-field-input-fields-select__'),\n [formFieldProps.inputId, id],\n );\n\n return (\n <FormField\n {...formFieldProps}\n inputId={linkedId}\n labelProps={{ htmlFor: linkedId, size: inputProps.size, ...formFieldProps.labelProps }}\n >\n <Select {...inputProps} id={linkedId}>\n {children}\n </Select>\n </FormField>\n );\n};\n\nexport interface RadioGroupFieldProps\n extends Omit<ImplementsFormField, 'configField'>, RadioGroupProps {}\n\nexport const RadioGroupField = ({\n label,\n helperText,\n errorText,\n warningText,\n required,\n children,\n ...props\n}: RadioGroupFieldProps) => {\n return (\n <FormField\n label={label}\n helperText={helperText}\n warningText={warningText}\n errorText={errorText}\n required={required}\n >\n <RadioGroup {...props} aria-required={required}>\n {children}\n </RadioGroup>\n </FormField>\n );\n};\n\nexport interface CheckboxFieldProps extends ImplementsFormField, CheckboxProps {\n checkboxLabel?: CheckboxProps['label'];\n}\n\nexport const CheckboxField = ({\n label,\n helperText,\n errorText,\n warningText,\n checkboxLabel,\n configField,\n labelProps,\n required,\n ...props\n}: CheckboxFieldProps) => {\n return (\n <FormField\n label={label}\n helperText={helperText}\n warningText={warningText}\n errorText={errorText}\n configField={configField}\n labelProps={labelProps}\n required={required}\n >\n <Checkbox label={checkboxLabel} required={required} {...props} />\n </FormField>\n );\n};\n\nexport interface ToggleFieldProps extends ImplementsFormField, ToggleProps {}\n\nexport const ToggleField = forwardRef<HTMLDivElement, ToggleFieldProps>(\n function ToggleField(props, ref) {\n const { formFieldProps, inputProps } = splitOutFormFieldProps(props);\n\n return (\n <FormField\n {...formFieldProps}\n labelProps={{ size: inputProps.size, ...formFieldProps.labelProps }}\n >\n <Toggle {...inputProps} ref={ref} />\n </FormField>\n );\n },\n);\n\nexport interface SegmentedControlFieldProps\n extends ImplementsFormField, Omit<SegmentedControlProps, 'children'> {\n children?: SegmentedControlProps['children'];\n}\n\nexport const SegmentedControlField = forwardRef<HTMLDivElement, SegmentedControlFieldProps>(\n function SegmentedControlField(\n {\n label,\n helperText,\n errorText,\n warningText,\n configField,\n required,\n children,\n labelProps,\n ...props\n },\n ref,\n ) {\n return (\n <FormField\n label={label}\n helperText={helperText}\n warningText={warningText}\n errorText={errorText}\n configField={configField}\n labelProps={labelProps}\n required={required}\n >\n <SegmentedControl fullWidth {...props} aria-required={required} ref={ref}>\n {children}\n </SegmentedControl>\n </FormField>\n );\n },\n);\n\nexport type ComboboxSingleSelectFieldProps<T = string> = ImplementsFormField &\n ComboboxSingleSelectProps<T>;\nexport type ComboboxMultiSelectFieldProps<T = string> = ImplementsFormField &\n ComboboxMultiSelectProps<T>;\n\nexport const ComboboxField = (\n props: ComboboxSingleSelectFieldProps | ComboboxMultiSelectFieldProps,\n) => {\n // `Combobox` registers its own id with the surrounding `FormControl`, which is what links the\n // label to it, so the field only forwards an explicit `inputId` when one is given. Each mode is\n // split separately: `multiple` discriminates the two, and a union split at once loses that.\n if (props.multiple) {\n const { formFieldProps, inputProps } = splitOutFormFieldProps(props);\n\n return (\n <FormField {...formFieldProps}>\n <Combobox {...inputProps} />\n </FormField>\n );\n }\n\n const { formFieldProps, inputProps } = splitOutFormFieldProps(props);\n\n return (\n <FormField {...formFieldProps}>\n <Combobox {...inputProps} />\n </FormField>\n );\n};\n","import {\n Children,\n cloneElement,\n type ComponentPropsWithRef,\n createContext,\n type ReactElement,\n type ReactNode,\n useContext,\n useRef,\n} from 'react';\nimport {\n type AriaCheckboxGroupProps,\n mergeProps,\n useCheckboxGroup,\n useCheckboxGroupItem,\n} from 'react-aria';\nimport innerText from 'react-innertext';\nimport { type CheckboxGroupState, useCheckboxGroupState } from 'react-stately';\n\nimport type { CheckboxProps } from 'design-system/components/Checkbox';\nimport type Checkbox from 'design-system/components/Checkbox';\nimport { FormControlContext } from 'design-system/components/FormControl/useFormField';\nimport FormField from 'design-system/components/FormField/FormField';\nimport type { ImplementsFormField } from 'design-system/components/FormField/inputFields';\n\n/* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\nconst CheckboxGroupContext = createContext<CheckboxGroupState>(null);\n\n/** Preserves the parent FormControl context (disabled, hasError, etc.) but clears\n * inputId so each Checkbox inside the group generates its own unique id. */\nconst ClearGroupInputId = ({ children }: { children: ReactNode }) => {\n const parentContext = useContext(FormControlContext);\n return (\n <FormControlContext.Provider value={{ ...parentContext, inputId: undefined }}>\n {children}\n </FormControlContext.Provider>\n );\n};\n\ninterface CheckboxGroupItemProps {\n children: ReactElement<ComponentPropsWithRef<typeof Checkbox>>;\n}\n\nconst CheckboxGroupItem = (props: CheckboxGroupItemProps) => {\n const { children } = props;\n const checkboxProps = children.props;\n\n const state = useContext(CheckboxGroupContext);\n const ref = useRef();\n const { inputProps } = useCheckboxGroupItem(\n /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n {\n ...checkboxProps,\n onChange: undefined,\n isDisabled: checkboxProps.disabled,\n isReadOnly: checkboxProps.readOnly,\n isRequired: checkboxProps.required,\n isIndeterminate: checkboxProps.indeterminate,\n value: String(children.props.value),\n 'aria-label': innerText(checkboxProps.label),\n },\n state,\n ref,\n );\n\n return cloneElement(\n children,\n /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n mergeProps(inputProps, {\n onChange: checkboxProps.onChange,\n disabled: state.isDisabled || checkboxProps.disabled,\n checked: state.isSelected(String(inputProps.value)),\n ref,\n } as ComponentPropsWithRef<typeof Checkbox>),\n );\n};\n\ninterface CheckboxGroupFieldProps\n extends\n Omit<ImplementsFormField, 'configField'>,\n Omit<\n AriaCheckboxGroupProps,\n 'description' | 'disabled' | 'isReadOnly' | 'isRequired' | 'errorMessage'\n > {\n children?: ReactElement<CheckboxProps>[];\n disabled?: boolean;\n readOnly?: boolean;\n required?: boolean;\n}\n\nconst CheckboxGroupField = ({\n children,\n name,\n onChange,\n disabled,\n readOnly,\n required,\n ...props\n}: CheckboxGroupFieldProps) => {\n const reactAriaProps = {\n ...props,\n description: props.helperText,\n errorMessage: props.errorText,\n onChange,\n name,\n isDisabled: disabled,\n isReadOnly: readOnly,\n isRequired: required,\n };\n const state = useCheckboxGroupState(reactAriaProps);\n const { groupProps, labelProps, descriptionProps, errorMessageProps } = useCheckboxGroup(\n reactAriaProps,\n state,\n );\n\n return (\n <FormField\n labelProps={labelProps}\n helperProps={descriptionProps}\n errorProps={errorMessageProps}\n disabled={disabled}\n required={required}\n {...groupProps}\n {...props}\n >\n <ClearGroupInputId>\n <CheckboxGroupContext.Provider value={state}>\n {Children.map(children, (checkbox) => (\n /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n <CheckboxGroupItem>{checkbox}</CheckboxGroupItem>\n ))}\n </CheckboxGroupContext.Provider>\n </ClearGroupInputId>\n </FormField>\n );\n};\n\nexport default CheckboxGroupField;\n","import { type ReactNode, useState } from 'react';\n\nimport { MoreIcon, PlusIcon } from '@persona/icons';\nimport { IconButton } from 'design-system/components/Button';\nimport useFormGroup from 'design-system/components/ConfigFormGroup/useFormGroup';\nimport DropdownMenu from 'design-system/components/DropdownMenu';\nimport FormField from 'design-system/components/FormField/FormField';\nimport type { ImplementsFormField } from 'design-system/components/FormField/inputFields';\nimport ListBox, { type ListBoxProps } from 'design-system/components/ListBox';\nimport type { MenuItemProps } from 'design-system/components/Menu';\n\ninterface ListBoxFieldAction extends Omit<MenuItemProps, 'children'> {\n label: string;\n onClick: (selectedKeys: ListBoxProps<any>['selectedKeys']) => void;\n}\n\ninterface AddDropdownConfig {\n options: ({ label: ReactNode; value: string } & Omit<MenuItemProps, 'children'>)[];\n onSelection: (value: string) => void;\n}\n\ninterface ListBoxFieldProps<T extends object> extends ImplementsFormField, ListBoxProps<T> {\n actions?: ListBoxFieldAction[];\n addDropdownConfig?: AddDropdownConfig;\n /** Disables the add button, e.g. while the list is read-only. */\n addDisabled?: boolean;\n}\n\nconst ListBoxField = <T extends object>({\n label,\n helperText,\n errorText,\n warningText,\n labelProps,\n helperProps,\n errorProps,\n warningProps,\n inputId,\n required,\n onAdd,\n onDelete,\n deleteDisabled,\n configField: configFieldProp,\n size = 'md',\n actions = [],\n addDropdownConfig,\n addDisabled,\n selectedKeys: selectedKeysProp,\n onSelectionChange,\n defaultSelectedKeys,\n ...props\n}: ListBoxFieldProps<T>) => {\n const { configField } = useFormGroup({ configField: configFieldProp });\n const menuActions: ListBoxFieldAction[] = [...actions];\n const [selectedKeysState, setSelectedKeys] = useState(defaultSelectedKeys);\n const selectedKeys = selectedKeysProp ?? selectedKeysState;\n const effectiveSize = configField ? 'sm' : size;\n\n if (onDelete) {\n menuActions.unshift({\n label: 'Delete',\n onClick: () => onDelete(selectedKeys),\n disabled:\n deleteDisabled ||\n selectedKeys == null ||\n (typeof selectedKeys === 'object' && [...selectedKeys].length === 0),\n });\n }\n\n const addButton = (\n <IconButton size='sm' onClick={onAdd} aria-label='Add item to list' disabled={addDisabled}>\n <PlusIcon />\n </IconButton>\n );\n\n return (\n <FormField\n label={label}\n helperText={helperText}\n errorText={errorText}\n warningText={warningText}\n labelProps={labelProps}\n helperProps={helperProps}\n errorProps={errorProps}\n warningProps={warningProps}\n inputId={inputId}\n required={required}\n configField={configField}\n rightActions={\n configField && (\n <>\n {menuActions.length > 0 && (\n <DropdownMenu\n trigger={\n <IconButton aria-label='Actions' size='sm'>\n <MoreIcon />\n </IconButton>\n }\n portal\n >\n {menuActions.map((action) => (\n <DropdownMenu.Item\n key={action.label}\n {...action}\n onClick={() => action.onClick(selectedKeys)}\n size={effectiveSize}\n >\n {action.label}\n </DropdownMenu.Item>\n ))}\n </DropdownMenu>\n )}\n {onAdd && !addDropdownConfig && addButton}\n {addDropdownConfig && (\n <DropdownMenu trigger={addButton} align='start' portal>\n {addDropdownConfig.options.map((option) => (\n <DropdownMenu.Item\n key={option.value}\n {...option}\n onClick={() => addDropdownConfig.onSelection(option.value)}\n size={effectiveSize}\n >\n {option.label}\n </DropdownMenu.Item>\n ))}\n </DropdownMenu>\n )}\n </>\n )\n }\n >\n <ListBox\n id={inputId}\n fullWidth={configField}\n size={effectiveSize}\n deleteDisabled={deleteDisabled}\n // We have to control the keys so we can power the `rightActions`\n selectedKeys={selectedKeys}\n onSelectionChange={(keys) => {\n onSelectionChange?.(keys);\n setSelectedKeys(keys);\n }}\n {...props}\n />\n </FormField>\n );\n};\n\nexport default ListBoxField;\n","import { Fragment, type MouseEvent, type ReactNode, useState } from 'react';\n\nimport { IconButton } from '@persona/design-system/components/Button';\nimport { useFormGroup } from '@persona/design-system/components/ConfigFormGroup';\nimport DropdownMenu from '@persona/design-system/components/DropdownMenu';\nimport type { FormLabelProps } from '@persona/design-system/components/FormControl';\nimport type { MenuItemProps } from '@persona/design-system/components/Menu';\nimport TableBox, { type TableBoxProps } from '@persona/design-system/components/TableBox';\nimport { MoreIcon, PlusIcon } from '@persona/icons';\n\nimport FormField from './FormField';\nimport type { ImplementsFormField } from './inputFields';\n\nexport interface TableBoxFieldAction extends Omit<MenuItemProps, 'children'> {\n label: string;\n onClick: (selectedKey: TableBoxProps['selectedKey']) => void;\n}\n\nexport interface TableBoxFieldActionGroup {\n type: 'group';\n heading: string;\n actions: TableBoxFieldAction[];\n}\n\nexport type TableBoxFieldActionEntry = TableBoxFieldAction | TableBoxFieldActionGroup;\n\n/** Aria-label on TableBoxField's + button. Consumers that style or detect that\n * button (e.g. popover toggle guards) should import this rather than redefining it. */\nexport const TABLE_BOX_FIELD_ADD_BUTTON_ARIA_LABEL = 'Add item to table';\n\nconst isActionGroup = (action: TableBoxFieldActionEntry): action is TableBoxFieldActionGroup =>\n 'type' in action && action.type === 'group';\n\ninterface AddDropdownConfig {\n options: Array<{ label: string; value: string }>;\n onSelection: (value: string) => void;\n}\n\ninterface TableBoxFieldProps<T extends object = object>\n extends ImplementsFormField, Omit<TableBoxProps<T>, 'aria-label' | 'onCreateNewRow'> {\n onAdd?: (e: MouseEvent<HTMLButtonElement>) => void;\n onDelete?: (selectedKey: string | null) => void;\n deleteDisabled?: boolean;\n /** Actions and labeled action groups rendered in order. Empty groups are omitted. */\n actions?: TableBoxFieldActionEntry[];\n addDropdownConfig?: AddDropdownConfig;\n\n /**\n * Callback to create a new row and add it to the rows array\n * Should return the id of the newly created row\n */\n createNewRow?: () => string;\n children?: ReactNode;\n}\n\nconst TableBoxField = <T extends object = object>({\n label,\n helperText,\n errorText,\n warningText,\n labelProps: labelPropsProp,\n helperProps,\n errorProps,\n warningProps,\n inputId,\n required,\n onAdd,\n onDelete,\n deleteDisabled,\n configField: configFieldProp = true,\n actions = [],\n addDropdownConfig,\n selectedKey: selectedKeyProp,\n onSelectionChange,\n defaultSelectedKey,\n selectionMode,\n disabled,\n createNewRow,\n children,\n emptyText = 'No data',\n ...props\n}: TableBoxFieldProps<T>) => {\n const { configField } = useFormGroup({ configField: configFieldProp });\n const menuActions: TableBoxFieldActionEntry[] = [...actions];\n const [selectedKeyState, setSelectedKey] = useState(defaultSelectedKey);\n const selectedKey = selectedKeyProp ?? selectedKeyState;\n const [newRowId, setNewRowId] = useState<string | null>(null);\n const labelProps: FormLabelProps = { size: 'sm', ...labelPropsProp };\n\n const handleCreateNewRow = () => {\n if (createNewRow) {\n setNewRowId(createNewRow());\n }\n };\n\n // Handle add button click\n const handleAddClick = (e: MouseEvent<HTMLButtonElement>) => {\n if (createNewRow) {\n handleCreateNewRow();\n } else if (onAdd) {\n onAdd(e);\n }\n };\n\n if (onDelete) {\n menuActions.unshift({\n label: 'Delete',\n onClick: () => selectedKey && onDelete(selectedKey),\n disabled: deleteDisabled || selectedKey == null,\n });\n }\n const visibleMenuActions = menuActions.filter(\n (action) => !isActionGroup(action) || action.actions.length > 0,\n );\n\n const addButton = (\n <IconButton\n size='sm'\n onClick={handleAddClick}\n aria-label={TABLE_BOX_FIELD_ADD_BUTTON_ARIA_LABEL}\n disabled={disabled}\n >\n <PlusIcon />\n </IconButton>\n );\n\n return (\n <FormField\n label={label}\n helperText={helperText}\n errorText={errorText}\n warningText={warningText}\n labelProps={labelProps}\n helperProps={helperProps}\n errorProps={errorProps}\n warningProps={warningProps}\n inputId={inputId}\n required={required}\n rightActions={\n configField && (\n <>\n {visibleMenuActions.length > 0 && (\n <DropdownMenu\n trigger={\n <IconButton aria-label='Actions' size='sm' disabled={disabled}>\n <MoreIcon />\n </IconButton>\n }\n portal\n >\n {visibleMenuActions.map((entry, entryIndex) => {\n const previousEntry = visibleMenuActions[entryIndex - 1];\n if (isActionGroup(entry)) {\n return (\n <Fragment key={`${entry.heading}-${entryIndex}`}>\n {entryIndex > 0 && <DropdownMenu.Divider />}\n <DropdownMenu.Heading size='sm'>{entry.heading}</DropdownMenu.Heading>\n {entry.actions.map((action) => (\n <DropdownMenu.Item\n key={action.label}\n {...action}\n disabled={disabled || action.disabled}\n onClick={() => action.onClick(selectedKey)}\n size='sm'\n >\n {action.label}\n </DropdownMenu.Item>\n ))}\n </Fragment>\n );\n }\n\n return (\n <Fragment key={`${entry.label}-${entryIndex}`}>\n {previousEntry && isActionGroup(previousEntry) && <DropdownMenu.Divider />}\n <DropdownMenu.Item\n {...entry}\n disabled={disabled || entry.disabled}\n onClick={() => entry.onClick(selectedKey)}\n size='sm'\n >\n {entry.label}\n </DropdownMenu.Item>\n </Fragment>\n );\n })}\n </DropdownMenu>\n )}\n {(onAdd || createNewRow) && !addDropdownConfig && addButton}\n {addDropdownConfig && (\n <DropdownMenu trigger={addButton} portal>\n {addDropdownConfig.options.map((option) => (\n <DropdownMenu.Item\n key={option.value}\n {...option}\n onClick={() => addDropdownConfig.onSelection(option.value)}\n size='sm'\n >\n {option.label}\n </DropdownMenu.Item>\n ))}\n </DropdownMenu>\n )}\n </>\n )\n }\n >\n <TableBox\n aria-label={`${label} table`}\n // We have to control the keys so we can power the `rightActions`\n selectedKey={selectedKey}\n onSelectionChange={(key) => {\n onSelectionChange?.(key);\n setSelectedKey(key);\n }}\n selectionMode={selectionMode}\n newRowId={newRowId}\n onCreateNewRow={createNewRow ? handleCreateNewRow : undefined}\n emptyText={emptyText}\n disabled={disabled}\n {...props}\n >\n {children}\n </TableBox>\n </FormField>\n );\n};\n\n// Attach subcomponents to TableBoxField\nTableBoxField.Row = TableBox.Row;\nTableBoxField.Cell = TableBox.Cell;\n\nexport default TableBoxField;\n"],"mappings":"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"}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import { Ref } from "react";
|
|
2
|
+
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
|
+
|
|
4
|
+
//#region components/ImageTile/ImageThumbnail.d.ts
|
|
5
|
+
interface ImageThumbnailProps {
|
|
6
|
+
/** URL of the thumbnail. While loading shows shimmer; on error shows the empty fallback. */
|
|
7
|
+
src: string | null;
|
|
8
|
+
/** Alt text for the thumbnail. */
|
|
9
|
+
alt?: string;
|
|
10
|
+
/** How the thumbnail fills its area. `cover` crops overflow; `contain` letterboxes to fit. */
|
|
11
|
+
objectFit?: 'cover' | 'contain';
|
|
12
|
+
}
|
|
13
|
+
interface ThumbnailStatus {
|
|
14
|
+
hasSrc: boolean;
|
|
15
|
+
hasError: boolean;
|
|
16
|
+
loaded: boolean;
|
|
17
|
+
isLoading: boolean;
|
|
18
|
+
showEmpty: boolean;
|
|
19
|
+
markResolved: (status: 'loaded' | 'error') => void;
|
|
20
|
+
handleImageRef: Ref<HTMLImageElement>;
|
|
21
|
+
}
|
|
22
|
+
/**
|
|
23
|
+
* Tracks decode, error, and src changes for a thumbnail. ImageTile also reads
|
|
24
|
+
* `isLoading` so its metadata row can shimmer in step with the image.
|
|
25
|
+
*/
|
|
26
|
+
declare const useThumbnailStatus: (src: string | null) => ThumbnailStatus;
|
|
27
|
+
declare const ThumbnailFrame: ({
|
|
28
|
+
src,
|
|
29
|
+
alt,
|
|
30
|
+
objectFit,
|
|
31
|
+
status
|
|
32
|
+
}: ImageThumbnailProps & {
|
|
33
|
+
status: ThumbnailStatus;
|
|
34
|
+
}) => _$react_jsx_runtime0.JSX.Element;
|
|
35
|
+
/** Image area used by ImageTile. Not a card chrome. */
|
|
36
|
+
declare const ImageThumbnail: ({
|
|
37
|
+
src,
|
|
38
|
+
alt,
|
|
39
|
+
objectFit
|
|
40
|
+
}: ImageThumbnailProps) => _$react_jsx_runtime0.JSX.Element;
|
|
41
|
+
//#endregion
|
|
42
|
+
export { ImageThumbnail, ImageThumbnailProps, ThumbnailFrame, useThumbnailStatus };
|
|
43
|
+
//# sourceMappingURL=ImageThumbnail.d.mts.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { r as BreadcrumbsProps } from "./Breadcrumbs-C2ThOYJ-.mjs";
|
|
2
|
-
import { i as BaseFilterConfig, s as FilterConfig } from "./types-
|
|
3
|
-
import { r as TableControlsProps } from "./TableControls-
|
|
4
|
-
import { i as DataTableProps } from "./DataTable
|
|
2
|
+
import { i as BaseFilterConfig, s as FilterConfig } from "./types-Ci-KTHfu.mjs";
|
|
3
|
+
import { r as TableControlsProps } from "./TableControls-wM35j3g4.mjs";
|
|
4
|
+
import { i as DataTableProps } from "./DataTable-l1bFeLXL.mjs";
|
|
5
5
|
import { r as PageHeaderProps } from "./PageHeader-Czj42pyK.mjs";
|
|
6
6
|
import { UseColumnConfigurationOptions } from "./useColumnConfiguration.mjs";
|
|
7
7
|
import { ReactNode } from "react";
|
package/dist/InlineInput.d.mts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { r as ButtonProps } from "./Button-CyjqQa5v.mjs";
|
|
2
|
-
import { l as MenuItemProps } from "./Menu-
|
|
2
|
+
import { l as MenuItemProps } from "./Menu-5VknNr1T.mjs";
|
|
3
3
|
import { ComponentPropsWithoutRef, PropsWithChildren, ReactNode } from "react";
|
|
4
4
|
import * as _$react_aria_components0 from "react-aria-components";
|
|
5
5
|
import { GridList, GridListItem, Header } from "react-aria-components";
|
|
@@ -140,4 +140,4 @@ interface ListBoxItemProps extends ComponentPropsWithoutRef<typeof GridListItem>
|
|
|
140
140
|
}
|
|
141
141
|
//#endregion
|
|
142
142
|
export { useListBoxContext as i, ListBoxItemProps as n, ListBoxProps$1 as r, ListBox as t };
|
|
143
|
-
//# sourceMappingURL=ListBox-
|
|
143
|
+
//# sourceMappingURL=ListBox-cH0dfeLN.d.mts.map
|
package/dist/ListBox.d.mts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { i as useListBoxContext, n as ListBoxItemProps, r as ListBoxProps, t as ListBox } from "./ListBox-
|
|
1
|
+
import { i as useListBoxContext, n as ListBoxItemProps, r as ListBoxProps, t as ListBox } from "./ListBox-cH0dfeLN.mjs";
|
|
2
2
|
export { ListBox, ListBox as default, ListBoxItemProps, ListBoxProps, useListBoxContext };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { l as MenuItemProps } from "./Menu-
|
|
2
|
-
import { o as ImplementsFormField } from "./inputFields-
|
|
3
|
-
import { r as ListBoxProps } from "./ListBox-
|
|
1
|
+
import { l as MenuItemProps } from "./Menu-5VknNr1T.mjs";
|
|
2
|
+
import { o as ImplementsFormField } from "./inputFields-BZcm1UV5.mjs";
|
|
3
|
+
import { r as ListBoxProps } from "./ListBox-cH0dfeLN.mjs";
|
|
4
4
|
import { ReactNode } from "react";
|
|
5
5
|
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
6
6
|
|
|
@@ -48,4 +48,4 @@ declare const ListBoxField: <T extends object>({
|
|
|
48
48
|
}: ListBoxFieldProps<T>) => _$react_jsx_runtime0.JSX.Element;
|
|
49
49
|
//#endregion
|
|
50
50
|
export { ListBoxField as t };
|
|
51
|
-
//# sourceMappingURL=ListBoxField-
|
|
51
|
+
//# sourceMappingURL=ListBoxField-DOpaE0q4.d.mts.map
|
package/dist/ListBoxField.d.mts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as ListBoxField } from "./ListBoxField-
|
|
1
|
+
import { t as ListBoxField } from "./ListBoxField-DOpaE0q4.mjs";
|
|
2
2
|
export { ListBoxField as default };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { n as InputSizes } from "./input-CKhARTlS.mjs";
|
|
2
|
-
import { n as ListBoxItemProps } from "./ListBox-
|
|
2
|
+
import { n as ListBoxItemProps } from "./ListBox-cH0dfeLN.mjs";
|
|
3
3
|
import { ReactNode } from "react";
|
|
4
4
|
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
5
5
|
|
|
@@ -37,4 +37,4 @@ declare const LogicRow: ({
|
|
|
37
37
|
}: LogicRowProps) => _$react_jsx_runtime0.JSX.Element;
|
|
38
38
|
//#endregion
|
|
39
39
|
export { LogicRowProps as n, LogicRow as t };
|
|
40
|
-
//# sourceMappingURL=LogicRow-
|
|
40
|
+
//# sourceMappingURL=LogicRow-CaxsteGU.d.mts.map
|
package/dist/LogicRow.d.mts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as LogicRowProps, t as LogicRow } from "./LogicRow-
|
|
1
|
+
import { n as LogicRowProps, t as LogicRow } from "./LogicRow-CaxsteGU.mjs";
|
|
2
2
|
export { LogicRowProps, LogicRow as default };
|
package/dist/MaskedInput.d.mts
CHANGED
|
@@ -4,7 +4,7 @@ import { IMaskInputProps } from "react-imask/mixin";
|
|
|
4
4
|
|
|
5
5
|
//#region components/MaskedInput/MaskedInput.d.ts
|
|
6
6
|
type MaskedInputProps = Omit<IMaskInputProps<HTMLInputElement>, 'inputRef' | 'componentProps' | 'size' | 'ref'> & InputProps;
|
|
7
|
-
declare const MaskedInput: _$react.ForwardRefExoticComponent<Omit<IMaskInputProps<HTMLInputElement>, "
|
|
7
|
+
declare const MaskedInput: _$react.ForwardRefExoticComponent<Omit<IMaskInputProps<HTMLInputElement>, "size" | "ref" | "inputRef" | "componentProps"> & InputProps & _$react.RefAttributes<HTMLInputElement>>;
|
|
8
8
|
//#endregion
|
|
9
9
|
export { MaskedInput, MaskedInput as default, MaskedInputProps };
|
|
10
10
|
//# sourceMappingURL=MaskedInput.d.mts.map
|
|
@@ -22,7 +22,7 @@ interface MenuItemProps<T extends ElementType = 'div'> {
|
|
|
22
22
|
selected?: boolean;
|
|
23
23
|
size?: 'sm' | 'md';
|
|
24
24
|
}
|
|
25
|
-
declare const ListItem: StyledComponent<"li", any, Pick<MenuItemProps<"div">, "variant" | "
|
|
25
|
+
declare const ListItem: StyledComponent<"li", any, Pick<MenuItemProps<"div">, "variant" | "size" | "disabled" | "focused" | "selected">, never>;
|
|
26
26
|
declare const IconContainer: StyledComponent<"div", any, {
|
|
27
27
|
suffix?: boolean;
|
|
28
28
|
}, never>;
|
|
@@ -67,4 +67,4 @@ declare const Menu: {
|
|
|
67
67
|
};
|
|
68
68
|
//#endregion
|
|
69
69
|
export { MenuDivider as a, MenuItem as c, MenuList as d, MenuProps as f, Menu as i, MenuItemProps as l, IconContainer as n, MenuHeading as o, ListItem as r, MenuHeadingProps as s, FloatingCard as t, MenuItemType as u };
|
|
70
|
-
//# sourceMappingURL=Menu-
|
|
70
|
+
//# sourceMappingURL=Menu-5VknNr1T.d.mts.map
|
package/dist/Menu.d.mts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { a as MenuDivider, c as MenuItem, d as MenuList, f as MenuProps, i as Menu, l as MenuItemProps, n as IconContainer, o as MenuHeading, r as ListItem, s as MenuHeadingProps, t as FloatingCard, u as MenuItemType } from "./Menu-
|
|
1
|
+
import { a as MenuDivider, c as MenuItem, d as MenuList, f as MenuProps, i as Menu, l as MenuItemProps, n as IconContainer, o as MenuHeading, r as ListItem, s as MenuHeadingProps, t as FloatingCard, u as MenuItemType } from "./Menu-5VknNr1T.mjs";
|
|
2
2
|
export { FloatingCard, IconContainer, ListItem, Menu, Menu as default, MenuDivider, MenuHeading, MenuHeadingProps, MenuItem, MenuItemProps, MenuItemType, MenuList, MenuProps };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { l as MenuItemProps } from "./Menu-
|
|
1
|
+
import { l as MenuItemProps } from "./Menu-5VknNr1T.mjs";
|
|
2
2
|
import { n as InputSizes, t as InputMixinProps } from "./input-CKhARTlS.mjs";
|
|
3
3
|
import * as _$react from "react";
|
|
4
4
|
import { ReactNode } from "react";
|
|
@@ -80,4 +80,4 @@ declare const Select: _$react.ForwardRefExoticComponent<SelectProps & _$react.Re
|
|
|
80
80
|
declare const Option: _$react.ForwardRefExoticComponent<SelectPrimitive.SelectItemProps & MenuItemProps<"div"> & _$react.RefAttributes<HTMLDivElement>>;
|
|
81
81
|
//#endregion
|
|
82
82
|
export { SelectProps as i, Select as n, SelectHeader as r, Option as t };
|
|
83
|
-
//# sourceMappingURL=Select-
|
|
83
|
+
//# sourceMappingURL=Select-CG_Xkx0m.d.mts.map
|
package/dist/Select.d.mts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { i as SelectProps, n as Select, r as SelectHeader, t as Option } from "./Select-
|
|
1
|
+
import { i as SelectProps, n as Select, r as SelectHeader, t as Option } from "./Select-CG_Xkx0m.mjs";
|
|
2
2
|
export { Option, Select, Select as default, SelectHeader, SelectProps };
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import { ReactElement } from "react";
|
|
2
|
+
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
|
+
|
|
4
|
+
//#region components/SelectionCard/SelectionCard.d.ts
|
|
5
|
+
interface SelectionCardProps {
|
|
6
|
+
/** Value submitted with the group when this card is selected. */
|
|
7
|
+
value: string;
|
|
8
|
+
/** Required visible name. Left-aligned with `description`. */
|
|
9
|
+
label: string;
|
|
10
|
+
/** Optional supporting copy under the label. Omitted when not passed. */
|
|
11
|
+
description?: string;
|
|
12
|
+
/**
|
|
13
|
+
* Optional icon to the left of the label. Leave it off when it does not add
|
|
14
|
+
* meaning, including in multiple mode.
|
|
15
|
+
*/
|
|
16
|
+
icon?: ReactElement;
|
|
17
|
+
disabled?: boolean;
|
|
18
|
+
/** Tooltip shown on hover only while `disabled` is set. */
|
|
19
|
+
disabledReason?: string;
|
|
20
|
+
/** Injected by `SelectionCardGroup`. */
|
|
21
|
+
name?: string;
|
|
22
|
+
/** Injected by `SelectionCardGroup`. */
|
|
23
|
+
checked?: boolean;
|
|
24
|
+
/** Injected by `SelectionCardGroup`. */
|
|
25
|
+
onChange?: (checked: boolean) => void;
|
|
26
|
+
/** Injected by `SelectionCardGroup`. */
|
|
27
|
+
multiple?: boolean;
|
|
28
|
+
/** Layout hook for this card. */
|
|
29
|
+
className?: string;
|
|
30
|
+
}
|
|
31
|
+
declare const SelectionCard: ({
|
|
32
|
+
value,
|
|
33
|
+
label,
|
|
34
|
+
description,
|
|
35
|
+
icon,
|
|
36
|
+
disabled: disabledProp,
|
|
37
|
+
disabledReason,
|
|
38
|
+
name,
|
|
39
|
+
checked,
|
|
40
|
+
onChange,
|
|
41
|
+
multiple,
|
|
42
|
+
className
|
|
43
|
+
}: SelectionCardProps) => _$react_jsx_runtime0.JSX.Element;
|
|
44
|
+
//#endregion
|
|
45
|
+
export { SelectionCard, SelectionCard as default, SelectionCardProps };
|
|
46
|
+
//# sourceMappingURL=SelectionCard.d.mts.map
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import { ReactNode } from "react";
|
|
2
|
+
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
|
+
|
|
4
|
+
//#region components/SelectionCard/SelectionCardGroup.d.ts
|
|
5
|
+
interface SelectionCardGroupBaseProps {
|
|
6
|
+
/** Shared input name. Radios in a single group arrow-key together. */
|
|
7
|
+
name?: string;
|
|
8
|
+
/** Layout hook for the group. Not forwarded onto each card. */
|
|
9
|
+
className?: string;
|
|
10
|
+
/** Place two cards in a column. Two cards sit side by side when this is omitted. Three or more always stack. */
|
|
11
|
+
stack?: boolean;
|
|
12
|
+
/** Accessible name for the group. */
|
|
13
|
+
'aria-label'?: string;
|
|
14
|
+
/** Id of the element that names the group, such as a field label. */
|
|
15
|
+
'aria-labelledby'?: string;
|
|
16
|
+
children: ReactNode;
|
|
17
|
+
}
|
|
18
|
+
interface SelectionCardGroupSingleProps extends SelectionCardGroupBaseProps {
|
|
19
|
+
/** One card may be selected. Cards render no radio mark. */
|
|
20
|
+
multiple?: false;
|
|
21
|
+
'aria-required'?: boolean;
|
|
22
|
+
value?: string;
|
|
23
|
+
defaultValue?: string;
|
|
24
|
+
onChange?: (value: string) => void;
|
|
25
|
+
}
|
|
26
|
+
interface SelectionCardGroupMultipleProps extends SelectionCardGroupBaseProps {
|
|
27
|
+
/** Several cards may be selected. Each card shows a checkbox. */
|
|
28
|
+
multiple: true;
|
|
29
|
+
value?: string[];
|
|
30
|
+
defaultValue?: string[];
|
|
31
|
+
onChange?: (value: string[]) => void;
|
|
32
|
+
}
|
|
33
|
+
type SelectionCardGroupProps = SelectionCardGroupSingleProps | SelectionCardGroupMultipleProps;
|
|
34
|
+
declare const SelectionCardGroup: (props: SelectionCardGroupProps) => _$react_jsx_runtime0.JSX.Element;
|
|
35
|
+
//#endregion
|
|
36
|
+
export { SelectionCardGroup, SelectionCardGroup as default, SelectionCardGroupMultipleProps, SelectionCardGroupProps, SelectionCardGroupSingleProps };
|
|
37
|
+
//# sourceMappingURL=SelectionCardGroup.d.mts.map
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { o as ImplementsFormField } from "./inputFields-
|
|
2
|
-
import { n as TableBoxField } from "./TableBoxField-
|
|
1
|
+
import { o as ImplementsFormField } from "./inputFields-BZcm1UV5.mjs";
|
|
2
|
+
import { n as TableBoxField } from "./TableBoxField-BTpSGmgW.mjs";
|
|
3
3
|
import SmartTextInput from "./SmartTextInput.mjs";
|
|
4
4
|
import { CSSProperties, ComponentProps } from "react";
|
|
5
5
|
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
@@ -26,14 +26,15 @@ const IconContainer = styled.span`
|
|
|
26
26
|
const Spinner = ({ variant = "default", size = "sm", srText, className }) => {
|
|
27
27
|
const theme = useTheme();
|
|
28
28
|
const resolvedColor = variant === "inverse" ? semanticColor(theme, "FgInverse", Color.BorderIconInverse) : semanticColor(theme, "FgPrimary", Color.BorderIconPrimary);
|
|
29
|
+
const label = srText ?? "Loading...";
|
|
29
30
|
return /* @__PURE__ */ jsxs(Container, {
|
|
30
31
|
role: "status",
|
|
31
|
-
"aria-label":
|
|
32
|
+
"aria-label": label,
|
|
32
33
|
className,
|
|
33
|
-
children: [/* @__PURE__ */ jsx(VisuallyHidden, { children:
|
|
34
|
+
children: [/* @__PURE__ */ jsx(VisuallyHidden, { children: label }), /* @__PURE__ */ jsx(IconContainer, { children: size === "sm" ? /* @__PURE__ */ jsx(LoaderIcon, { color: resolvedColor }) : /* @__PURE__ */ jsx(LoaderIcon$1, { color: resolvedColor }) })]
|
|
34
35
|
});
|
|
35
36
|
};
|
|
36
37
|
//#endregion
|
|
37
38
|
export { Spinner as t };
|
|
38
39
|
|
|
39
|
-
//# sourceMappingURL=Spinner-
|
|
40
|
+
//# sourceMappingURL=Spinner-7Camx1vs.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Spinner-
|
|
1
|
+
{"version":3,"file":"Spinner-7Camx1vs.mjs","names":["LoaderIconMedium"],"sources":["../components/Spinner/Spinner.tsx"],"sourcesContent":["import styled, { useTheme } from 'styled-components';\n\nimport { rotate } from '@persona/design-system/variables/keyframes';\nimport { TransitionDuration } from '@persona/design-system/variables/transitions';\nimport { Color } from '@persona/design-tokens';\nimport { LoaderIcon } from '@persona/icons';\nimport { LoaderIcon as LoaderIconMedium } from '@persona/icons/24px';\nimport { semanticColor } from 'design-system/lib/semanticColor';\n\nexport type SpinnerVariant = 'default' | 'inverse';\n\ntype SpinnerSize = 'sm' | 'md';\n\ninterface SpinnerProps {\n /**\n * `default` uses {@link Color.BorderIconPrimary}; `inverse` uses {@link Color.BorderIconInverse}\n * (e.g. on dark backgrounds).\n */\n variant?: SpinnerVariant;\n /** Size of the spinner. Defaults to 'sm'. */\n size?: SpinnerSize;\n /** Screen reader text. Defaults to \"Loading...\". */\n srText?: string;\n className?: string;\n}\n\nconst Container = styled.span`\n line-height: 0;\n display: inline-block;\n`;\n\nconst VisuallyHidden = styled.span`\n position: absolute;\n width: 1px;\n height: 1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n`;\n\nconst IconContainer = styled.span`\n display: inline-block;\n animation: ${rotate} ${TransitionDuration.OneSecond} linear infinite;\n`;\n\nexport const Spinner = ({ variant = 'default', size = 'sm', srText, className }: SpinnerProps) => {\n const theme = useTheme();\n const resolvedColor =\n variant === 'inverse'\n ? semanticColor(theme, 'FgInverse', Color.BorderIconInverse)\n : semanticColor(theme, 'FgPrimary', Color.BorderIconPrimary);\n const label = srText ?? 'Loading...';\n return (\n <Container role='status' aria-label={label} className={className}>\n <VisuallyHidden>{label}</VisuallyHidden>\n <IconContainer>\n {size === 'sm' ? (\n <LoaderIcon color={resolvedColor} />\n ) : (\n <LoaderIconMedium color={resolvedColor} />\n )}\n </IconContainer>\n </Container>\n );\n};\n\nexport default Spinner;\n"],"mappings":";;;;;;;;;AA0BA,MAAM,YAAY,OAAO,IAAI;;;;AAK7B,MAAM,iBAAiB,OAAO,IAAI;;;;;;;;AASlC,MAAM,gBAAgB,OAAO,IAAI;;eAElB,OAAO,GAAA,SAAgC;;AAGtD,MAAa,WAAW,EAAE,UAAU,WAAW,OAAO,MAAM,QAAQ,gBAA8B;CAChG,MAAM,QAAQ,UAAU;CACxB,MAAM,gBACJ,YAAY,YACR,cAAc,OAAO,aAAa,MAAM,kBAAkB,GAC1D,cAAc,OAAO,aAAa,MAAM,kBAAkB;CAChE,MAAM,QAAQ,UAAU;AACxB,QACE,qBAAC,WAAD;EAAW,MAAK;EAAS,cAAY;EAAkB;YAAvD,CACE,oBAAC,gBAAD,EAAA,UAAiB,OAAuB,CAAA,EACxC,oBAAC,eAAD,EAAA,UACG,SAAS,OACR,oBAAC,YAAD,EAAY,OAAO,eAAiB,CAAA,GAEpC,oBAACA,cAAD,EAAkB,OAAO,eAAiB,CAAA,EAE9B,CAAA,CACN"}
|
|
@@ -11,7 +11,7 @@ import { isFocusedVisible, isHovered } from "./lib/pseudoClass.mjs";
|
|
|
11
11
|
import { Z_INDICES } from "./lib/zindex.mjs";
|
|
12
12
|
import { focusOutline } from "./mixins/focus.mjs";
|
|
13
13
|
import { semanticScrollbar } from "./mixins/scrollbar.mjs";
|
|
14
|
-
import { t as Spinner } from "./Spinner-
|
|
14
|
+
import { t as Spinner } from "./Spinner-7Camx1vs.mjs";
|
|
15
15
|
import { Color, Spacing } from "@persona/design-tokens";
|
|
16
16
|
import { forwardRef } from "react";
|
|
17
17
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
@@ -452,4 +452,4 @@ const TableLayout = ({ children, className, containerMaxHeight, containerScrolls
|
|
|
452
452
|
//#endregion
|
|
453
453
|
export { StickyTH as a, TableCellTitle as c, TableTR as d, TableTH as f, Table as h, StickyTD as i, TableIconTD as l, TableHeaderCell as m, TableBody as n, TableActionTD as o, TableRow as p, TableHead as r, TableCell as s, TableLayout as t, TableTD as u };
|
|
454
454
|
|
|
455
|
-
//# sourceMappingURL=Table
|
|
455
|
+
//# sourceMappingURL=Table-BIDaC0uS.mjs.map
|