@planningcenter/tapestry 3.4.1 → 3.6.0
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/dist/components/button/Button.d.ts +1 -0
- package/dist/components/button/Button.d.ts.map +1 -1
- package/dist/components/button/Button.js +1 -0
- package/dist/components/button/Button.js.map +1 -1
- package/dist/components/button/DropdownButton.d.ts +1 -0
- package/dist/components/button/DropdownButton.d.ts.map +1 -1
- package/dist/components/button/DropdownButton.js +1 -0
- package/dist/components/button/DropdownButton.js.map +1 -1
- package/dist/components/button/DropdownIconButton.d.ts +1 -0
- package/dist/components/button/DropdownIconButton.d.ts.map +1 -1
- package/dist/components/button/DropdownIconButton.js +1 -0
- package/dist/components/button/DropdownIconButton.js.map +1 -1
- package/dist/components/button/IconButton.d.ts +1 -0
- package/dist/components/button/IconButton.d.ts.map +1 -1
- package/dist/components/button/IconButton.js +1 -0
- package/dist/components/button/IconButton.js.map +1 -1
- package/dist/components/checkbox/Checkbox.d.ts +1 -0
- package/dist/components/checkbox/Checkbox.d.ts.map +1 -1
- package/dist/components/checkbox/Checkbox.js +1 -0
- package/dist/components/checkbox/Checkbox.js.map +1 -1
- package/dist/components/combo-box/ComboBox.d.ts +1 -1
- package/dist/components/combo-box/ComboBox.d.ts.map +1 -1
- package/dist/components/combo-box/ComboBox.js.map +1 -1
- package/dist/components/date-picker/DatePicker.d.ts +2 -1
- package/dist/components/date-picker/DatePicker.d.ts.map +1 -1
- package/dist/components/date-picker/DatePicker.js +1 -0
- package/dist/components/date-picker/DatePicker.js.map +1 -1
- package/dist/components/dropdown/Dropdown.d.ts +1 -0
- package/dist/components/dropdown/Dropdown.d.ts.map +1 -1
- package/dist/components/dropdown/Dropdown.js +1 -0
- package/dist/components/dropdown/Dropdown.js.map +1 -1
- package/dist/components/field/Field.d.ts +43 -0
- package/dist/components/field/Field.d.ts.map +1 -0
- package/dist/components/field/Field.js +38 -0
- package/dist/components/field/Field.js.map +1 -0
- package/dist/components/field/index.d.ts +4 -0
- package/dist/components/field/index.d.ts.map +1 -0
- package/dist/components/flex/Flex.d.ts +69 -0
- package/dist/components/flex/Flex.d.ts.map +1 -0
- package/dist/components/flex/Flex.js +18 -0
- package/dist/components/flex/Flex.js.map +1 -0
- package/dist/components/flex/index.d.ts +3 -0
- package/dist/components/flex/index.d.ts.map +1 -0
- package/dist/components/input/Input.d.ts +1 -0
- package/dist/components/input/Input.d.ts.map +1 -1
- package/dist/components/input/Input.js +1 -0
- package/dist/components/input/Input.js.map +1 -1
- package/dist/components/link/Link.d.ts +1 -0
- package/dist/components/link/Link.d.ts.map +1 -1
- package/dist/components/link/Link.js +1 -0
- package/dist/components/link/Link.js.map +1 -1
- package/dist/components/number-stepper/NumberStepper.d.ts +1 -1
- package/dist/components/number-stepper/NumberStepper.d.ts.map +1 -1
- package/dist/components/number-stepper/NumberStepper.js.map +1 -1
- package/dist/components/radio/Radio.d.ts +1 -0
- package/dist/components/radio/Radio.d.ts.map +1 -1
- package/dist/components/radio/Radio.js +1 -0
- package/dist/components/radio/Radio.js.map +1 -1
- package/dist/components/select/Select.d.ts +1 -0
- package/dist/components/select/Select.d.ts.map +1 -1
- package/dist/components/select/Select.js +1 -0
- package/dist/components/select/Select.js.map +1 -1
- package/dist/components/select/SelectNative.js +1 -1
- package/dist/components/select/SelectNative.js.map +1 -1
- package/dist/components/select/SelectPopover.js +1 -1
- package/dist/components/select/SelectPopover.js.map +1 -1
- package/dist/components/text-area/TextArea.d.ts +1 -0
- package/dist/components/text-area/TextArea.d.ts.map +1 -1
- package/dist/components/text-area/TextArea.js +1 -0
- package/dist/components/text-area/TextArea.js.map +1 -1
- package/dist/components/time-field/TimeField.d.ts +2 -1
- package/dist/components/time-field/TimeField.d.ts.map +1 -1
- package/dist/components/time-field/TimeField.js +1 -0
- package/dist/components/time-field/TimeField.js.map +1 -1
- package/dist/components/toggle-switch/ToggleSwitch.d.ts +1 -0
- package/dist/components/toggle-switch/ToggleSwitch.d.ts.map +1 -1
- package/dist/components/toggle-switch/ToggleSwitch.js +1 -0
- package/dist/components/toggle-switch/ToggleSwitch.js.map +1 -1
- package/dist/index.css +351 -154
- package/dist/index.css.map +1 -1
- package/dist/index.d.ts +2 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -0
- package/dist/index.js.map +1 -1
- package/dist/reactRender.css +2266 -1426
- package/dist/reactRender.css.map +1 -1
- package/dist/reactRenderLegacy.css +2266 -1426
- package/dist/reactRenderLegacy.css.map +1 -1
- package/dist/unstable.css +1114 -274
- package/dist/unstable.css.map +1 -1
- package/dist/unstable.d.ts +1 -1
- package/dist/unstable.d.ts.map +1 -1
- package/dist/unstable.js +3 -1
- package/dist/unstable.js.map +1 -1
- package/dist/utilities/breakpoints.d.ts +9 -0
- package/dist/utilities/breakpoints.d.ts.map +1 -0
- package/dist/utilities/spacingTokens.d.ts +2 -0
- package/dist/utilities/spacingTokens.d.ts.map +1 -0
- package/package.json +8 -6
|
@@ -92,7 +92,7 @@ const SelectPopover = forwardRef(({ "aria-describedby": ariaDescribedBy, "aria-l
|
|
|
92
92
|
if (activeOptionId) {
|
|
93
93
|
document
|
|
94
94
|
.getElementById(activeOptionId)
|
|
95
|
-
?.scrollIntoView({ block: "
|
|
95
|
+
?.scrollIntoView({ behavior: "instant", block: "center" });
|
|
96
96
|
}
|
|
97
97
|
}, [activeOptionId]);
|
|
98
98
|
useEffect(() => () => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectPopover.js","sources":["../../../src/components/select/SelectPopover.tsx"],"sourcesContent":["import {\n ComboboxAction,\n getComboboxActionFromKey,\n getUpdatedIndex,\n} from \"@utilities/keyboardUtils\"\nimport {\n getDataAttributes,\n getIndexByLetter,\n getSelectableOptionsFromSegments,\n normalizeOptions,\n type Segment,\n} from \"@utilities/selectUtils\"\nimport { useId } from \"@utilities/useId\"\nimport React, {\n forwardRef,\n type SelectHTMLAttributes,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\"\n\nimport type { SelectItem, SelectOption } from \"./Select\"\nimport { SelectOptions } from \"./SelectOptions\"\n\ninterface ToggleEvent extends Event {\n newState: \"closed\" | \"open\"\n oldState: \"closed\" | \"open\"\n}\n\nexport interface SelectPopoverProps {\n \"aria-describedby\"?: string\n \"aria-label\"?: string\n \"aria-labelledby\"?: string\n defaultValue?: string\n disabled?: boolean\n id?: string\n invalid?: boolean\n /** A flat or mixed array of options and option groups. */\n options: SelectItem[]\n /** Placeholder text shown in the trigger button when no option is selected. `null` suppresses the placeholder. */\n placeholder: string | null\n required?: boolean\n triggerRef?: React.RefObject<HTMLButtonElement>\n value?: string\n}\n\nexport type SelectPopoverElementProps = Omit<\n SelectHTMLAttributes<HTMLSelectElement>,\n keyof SelectPopoverProps | \"multiple\"\n> &\n SelectPopoverProps\n\nconst Group = ({\n children,\n disabled,\n id,\n label,\n}: {\n children: React.ReactNode\n disabled?: boolean\n id: string\n label: string\n}) => (\n <ul aria-disabled={disabled || undefined} aria-labelledby={id} role=\"group\">\n <li id={id} role=\"presentation\">\n <span>{label}</span>\n </li>\n {children}\n </ul>\n)\n\nfunction renderListSegments(\n segments: Segment[],\n baseId: string,\n renderItem: (option: SelectOption, index: number) => React.ReactNode\n) {\n let flatIndex = 0\n\n return segments.map((segment, segmentIndex) => {\n const startIndex = flatIndex\n flatIndex += segment.options.length\n\n if (segment.type === \"group\") {\n return (\n <Group\n key={`${segment.label}-${segmentIndex}`}\n disabled={segment.disabled}\n id={`${baseId}-group-${segmentIndex}`}\n label={segment.label}\n >\n {segment.options.map((opt, i) => renderItem(opt, startIndex + i))}\n </Group>\n )\n }\n\n return (\n <ul key={`options-${segmentIndex}`} role=\"presentation\">\n {segment.options.map((opt, i) => renderItem(opt, startIndex + i))}\n </ul>\n )\n })\n}\n\n/**\n * Internal component. Not intended for direct use — consume `Select` instead.\n *\n * The popover listbox implementation used by `Select` when `complex` is\n * true. Renders a button trigger and a custom listbox that supports rich\n * option content (icons, descriptions) along with keyboard navigation,\n * type-ahead, and option groups.\n *\n * @internal\n */\nexport const SelectPopover = forwardRef<\n HTMLSelectElement,\n SelectPopoverElementProps\n>(\n (\n {\n \"aria-describedby\": ariaDescribedBy,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n defaultValue,\n disabled,\n id,\n invalid,\n onBlur,\n onChange,\n onClick,\n onFocus,\n options,\n placeholder,\n required,\n triggerRef,\n value,\n ...props\n }: SelectPopoverElementProps,\n ref\n ) => {\n const stableId = useId()\n const baseId = id || `tds-select-popover-${stableId}`\n\n const [isOpen, setIsOpen] = useState(false)\n const [uncontrolledValue, setUncontrolledValue] = useState<string | null>(\n defaultValue ?? null\n )\n const [activeIndex, setActiveIndex] = useState(-1)\n\n const isControlled = value !== undefined\n const selectedValue = isControlled ? (value ?? null) : uncontrolledValue\n\n const { allOptions, segments } = useMemo(() => {\n const segments = normalizeOptions(options)\n const allOptions = getSelectableOptionsFromSegments(segments)\n return { allOptions, segments }\n }, [options])\n\n const selectedOption = allOptions.find((opt) => opt.value === selectedValue)\n\n const activeOption = activeIndex >= 0 ? allOptions[activeIndex] : undefined\n const activeOptionId = activeOption\n ? `${baseId}-option-${activeOption.value}`\n : undefined\n\n const popoverRef = useRef<HTMLDivElement>(null)\n const internalTriggerRef = useRef<HTMLButtonElement | null>(null)\n const resolvedTriggerRef = triggerRef ?? internalTriggerRef\n const hiddenSelectRef = useRef<HTMLSelectElement | null>(null)\n const pendingChangeValueRef = useRef<string | null>(null)\n const searchStringRef = useRef(\"\")\n const searchTimeoutRef = useRef<ReturnType<typeof setTimeout>>()\n\n const setHiddenSelectRef = useCallback(\n (element: HTMLSelectElement | null) => {\n hiddenSelectRef.current = element\n if (typeof ref === \"function\") {\n ref(element)\n } else if (ref) {\n ref.current = element\n }\n },\n [ref]\n )\n\n useEffect(() => {\n const popoverEl = popoverRef.current\n if (!popoverEl) return\n\n const handleToggle = (e: Event) => {\n const newIsOpen = (e as ToggleEvent).newState === \"open\"\n setIsOpen(newIsOpen)\n\n if (newIsOpen) {\n const index = allOptions.findIndex(\n (opt) => opt.value === selectedValue && !opt.disabled\n )\n if (index >= 0) {\n setActiveIndex(index)\n } else {\n // Find first non-disabled option\n const firstEnabledIndexOrFirstIndex = Math.max(\n allOptions.findIndex((opt) => !opt.disabled),\n 0\n )\n setActiveIndex(firstEnabledIndexOrFirstIndex)\n }\n } else {\n setActiveIndex(-1)\n }\n }\n\n popoverEl.addEventListener(\"toggle\", handleToggle)\n return () => popoverEl.removeEventListener(\"toggle\", handleToggle)\n }, [allOptions, selectedValue])\n\n useEffect(() => {\n if (activeOptionId) {\n document\n .getElementById(activeOptionId)\n ?.scrollIntoView({ block: \"nearest\" })\n }\n }, [activeOptionId])\n\n useEffect(\n () => () => {\n clearTimeout(searchTimeoutRef.current)\n },\n []\n )\n\n const openPopover = () =>\n popoverRef.current?.showPopover({ source: resolvedTriggerRef.current! })\n\n const closePopover = () => popoverRef.current?.hidePopover()\n\n const commitSelection = useCallback(\n (nextValue: string) => {\n if (nextValue === selectedValue) {\n closePopover()\n return\n }\n\n if (!isControlled) {\n setUncontrolledValue(nextValue)\n }\n\n const hiddenEl = hiddenSelectRef.current\n if (hiddenEl) {\n pendingChangeValueRef.current = nextValue\n hiddenEl.value = nextValue\n hiddenEl.dispatchEvent(new Event(\"change\", { bubbles: true }))\n if (isControlled) {\n hiddenEl.value = value ?? \"\"\n }\n }\n\n closePopover()\n },\n [isControlled, selectedValue, value]\n )\n\n const selectActiveOption = useCallback(() => {\n if (activeOption && !activeOption.disabled) {\n commitSelection(activeOption.value!)\n return true\n }\n return false\n }, [activeOption, commitSelection])\n\n const commitActiveOptionOrClose = useCallback(() => {\n if (!selectActiveOption()) {\n closePopover()\n }\n }, [selectActiveOption])\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLButtonElement>) => {\n if (disabled) return\n\n // Tab must not be prevented — allow native focus movement\n if (e.key === \"Tab\" && isOpen) {\n commitActiveOptionOrClose()\n return\n }\n\n const action = getComboboxActionFromKey(e, isOpen)\n if (!action) return\n\n e.preventDefault()\n\n switch (action) {\n case ComboboxAction.OpenPopup:\n openPopover()\n break\n case ComboboxAction.CommitAndClose:\n commitActiveOptionOrClose()\n break\n case ComboboxAction.MoveFirst:\n case ComboboxAction.MoveLast:\n if (!isOpen) openPopover()\n setActiveIndex(getUpdatedIndex(activeIndex, action, allOptions))\n break\n case ComboboxAction.MoveNext:\n case ComboboxAction.MovePrevious:\n setActiveIndex(getUpdatedIndex(activeIndex, action, allOptions))\n break\n case ComboboxAction.TypeCharacter: {\n if (!isOpen) openPopover()\n\n clearTimeout(searchTimeoutRef.current)\n searchStringRef.current += e.key\n searchTimeoutRef.current = setTimeout(() => {\n searchStringRef.current = \"\"\n }, 500)\n\n const searchIndex = getIndexByLetter(\n allOptions,\n searchStringRef.current,\n activeIndex\n )\n if (searchIndex >= 0) {\n setActiveIndex(searchIndex)\n }\n break\n }\n case ComboboxAction.ClosePopup:\n closePopover()\n break\n }\n }\n\n const createStableEventTarget = (\n target: HTMLSelectElement,\n valueSnapshot: string\n ) => {\n const proxy = Object.create(target)\n Object.defineProperties(proxy, {\n disabled: {\n configurable: true,\n enumerable: true,\n value: target.disabled,\n },\n form: { configurable: true, enumerable: true, value: target.form },\n name: { configurable: true, enumerable: true, value: target.name },\n type: { configurable: true, enumerable: true, value: target.type },\n value: { configurable: true, enumerable: true, value: valueSnapshot },\n })\n return proxy as HTMLSelectElement\n }\n\n const withSelectTarget = useCallback(\n <\n SourceEvent extends React.SyntheticEvent,\n TargetEvent extends React.SyntheticEvent<HTMLSelectElement>,\n >(\n event: SourceEvent,\n target: HTMLSelectElement,\n currentTarget: HTMLSelectElement = target\n ) => {\n return Object.defineProperties(Object.create(event), {\n currentTarget: { value: currentTarget },\n target: { value: target },\n }) as TargetEvent\n },\n []\n )\n\n const handleHiddenSelectChange = useCallback(\n (event: React.ChangeEvent<HTMLSelectElement>) => {\n if (!onChange) return\n\n const valueSnapshot =\n pendingChangeValueRef.current ?? event.currentTarget.value\n pendingChangeValueRef.current = null\n\n const stableEvent = withSelectTarget<\n React.ChangeEvent<HTMLSelectElement>,\n React.ChangeEvent<HTMLSelectElement>\n >(\n event,\n createStableEventTarget(\n event.target as HTMLSelectElement,\n valueSnapshot\n ),\n createStableEventTarget(event.currentTarget, valueSnapshot)\n )\n\n onChange(stableEvent)\n },\n [onChange, withSelectTarget]\n )\n\n const forwardEventToSelect = useCallback(\n <\n ButtonEvent extends React.SyntheticEvent<HTMLButtonElement>,\n SelectEvent extends React.SyntheticEvent<HTMLSelectElement>,\n >(\n event: ButtonEvent,\n handler?: (event: SelectEvent) => void\n ) => {\n if (!handler) return\n\n const hiddenEl = hiddenSelectRef.current\n if (!hiddenEl) return\n\n const stableEvent = withSelectTarget<ButtonEvent, SelectEvent>(\n event,\n hiddenEl\n )\n\n handler(stableEvent)\n },\n [withSelectTarget]\n )\n\n const handleButtonBlur = useCallback(\n (event: React.FocusEvent<HTMLButtonElement>) => {\n forwardEventToSelect<\n React.FocusEvent<HTMLButtonElement>,\n React.FocusEvent<HTMLSelectElement>\n >(event, onBlur)\n },\n [forwardEventToSelect, onBlur]\n )\n\n const handleButtonClick = useCallback(\n (event: React.MouseEvent<HTMLButtonElement>) => {\n forwardEventToSelect<\n React.MouseEvent<HTMLButtonElement>,\n React.MouseEvent<HTMLSelectElement>\n >(event, onClick)\n },\n [forwardEventToSelect, onClick]\n )\n\n const handleButtonFocus = useCallback(\n (event: React.FocusEvent<HTMLButtonElement>) => {\n forwardEventToSelect<\n React.FocusEvent<HTMLButtonElement>,\n React.FocusEvent<HTMLSelectElement>\n >(event, onFocus)\n },\n [forwardEventToSelect, onFocus]\n )\n\n const renderListOption = (option: SelectOption, index: number) => {\n const { disabled, divider, label, value } = option\n if (divider) return <li key={index} role=\"separator\" />\n return (\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events -- keyboard events are handled on the combobox button\n <li\n key={value}\n {...getDataAttributes(option)}\n aria-disabled={disabled || undefined}\n aria-selected={value === selectedValue}\n className={\n value === activeOption?.value\n ? \"tds-select-option--active\"\n : undefined\n }\n id={`${baseId}-option-${value}`}\n onClick={disabled ? undefined : () => commitSelection(value!)}\n role=\"option\"\n >\n {label}\n </li>\n )\n }\n\n return (\n <>\n <button\n ref={resolvedTriggerRef}\n popovertarget={baseId}\n aria-activedescendant={activeOptionId}\n aria-controls={baseId}\n aria-describedby={ariaDescribedBy}\n aria-disabled={disabled ? \"true\" : undefined}\n aria-expanded={isOpen}\n aria-haspopup=\"listbox\"\n aria-invalid={invalid ? \"true\" : undefined}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-required={required ? \"true\" : undefined}\n disabled={disabled}\n onBlur={handleButtonBlur}\n onClick={handleButtonClick}\n onFocus={handleButtonFocus}\n onKeyDown={handleKeyDown}\n role=\"combobox\"\n type=\"button\"\n >\n {selectedOption ? selectedOption.label : placeholder}\n </button>\n <div\n ref={popoverRef}\n popover=\"\"\n id={baseId}\n role=\"listbox\"\n aria-describedby={ariaDescribedBy}\n aria-invalid={invalid ? \"true\" : undefined}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-required={required ? \"true\" : undefined}\n >\n {renderListSegments(segments, baseId, renderListOption)}\n </div>\n <select\n {...props}\n ref={setHiddenSelectRef}\n aria-hidden\n className=\"tds-select-hidden-select\"\n disabled={disabled}\n id={`${baseId}-control`}\n onChange={handleHiddenSelectChange}\n required={required}\n tabIndex={-1}\n value={selectedValue ?? \"\"}\n >\n <option value=\"\" />\n <SelectOptions items={options} />\n </select>\n </>\n )\n }\n)\n\nSelectPopover.displayName = \"SelectPopover\"\n"],"names":["React"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"SelectPopover.js","sources":["../../../src/components/select/SelectPopover.tsx"],"sourcesContent":["import {\n ComboboxAction,\n getComboboxActionFromKey,\n getUpdatedIndex,\n} from \"@utilities/keyboardUtils\"\nimport {\n getDataAttributes,\n getIndexByLetter,\n getSelectableOptionsFromSegments,\n normalizeOptions,\n type Segment,\n} from \"@utilities/selectUtils\"\nimport { useId } from \"@utilities/useId\"\nimport React, {\n forwardRef,\n type SelectHTMLAttributes,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\"\n\nimport type { SelectItem, SelectOption } from \"./Select\"\nimport { SelectOptions } from \"./SelectOptions\"\n\ninterface ToggleEvent extends Event {\n newState: \"closed\" | \"open\"\n oldState: \"closed\" | \"open\"\n}\n\nexport interface SelectPopoverProps {\n \"aria-describedby\"?: string\n \"aria-label\"?: string\n \"aria-labelledby\"?: string\n defaultValue?: string\n disabled?: boolean\n id?: string\n invalid?: boolean\n /** A flat or mixed array of options and option groups. */\n options: SelectItem[]\n /** Placeholder text shown in the trigger button when no option is selected. `null` suppresses the placeholder. */\n placeholder: string | null\n required?: boolean\n triggerRef?: React.RefObject<HTMLButtonElement>\n value?: string\n}\n\nexport type SelectPopoverElementProps = Omit<\n SelectHTMLAttributes<HTMLSelectElement>,\n keyof SelectPopoverProps | \"multiple\"\n> &\n SelectPopoverProps\n\nconst Group = ({\n children,\n disabled,\n id,\n label,\n}: {\n children: React.ReactNode\n disabled?: boolean\n id: string\n label: string\n}) => (\n <ul aria-disabled={disabled || undefined} aria-labelledby={id} role=\"group\">\n <li id={id} role=\"presentation\">\n <span>{label}</span>\n </li>\n {children}\n </ul>\n)\n\nfunction renderListSegments(\n segments: Segment[],\n baseId: string,\n renderItem: (option: SelectOption, index: number) => React.ReactNode\n) {\n let flatIndex = 0\n\n return segments.map((segment, segmentIndex) => {\n const startIndex = flatIndex\n flatIndex += segment.options.length\n\n if (segment.type === \"group\") {\n return (\n <Group\n key={`${segment.label}-${segmentIndex}`}\n disabled={segment.disabled}\n id={`${baseId}-group-${segmentIndex}`}\n label={segment.label}\n >\n {segment.options.map((opt, i) => renderItem(opt, startIndex + i))}\n </Group>\n )\n }\n\n return (\n <ul key={`options-${segmentIndex}`} role=\"presentation\">\n {segment.options.map((opt, i) => renderItem(opt, startIndex + i))}\n </ul>\n )\n })\n}\n\n/**\n * Internal component. Not intended for direct use — consume `Select` instead.\n *\n * The popover listbox implementation used by `Select` when `complex` is\n * true. Renders a button trigger and a custom listbox that supports rich\n * option content (icons, descriptions) along with keyboard navigation,\n * type-ahead, and option groups.\n *\n * @internal\n */\nexport const SelectPopover = forwardRef<\n HTMLSelectElement,\n SelectPopoverElementProps\n>(\n (\n {\n \"aria-describedby\": ariaDescribedBy,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n defaultValue,\n disabled,\n id,\n invalid,\n onBlur,\n onChange,\n onClick,\n onFocus,\n options,\n placeholder,\n required,\n triggerRef,\n value,\n ...props\n }: SelectPopoverElementProps,\n ref\n ) => {\n const stableId = useId()\n const baseId = id || `tds-select-popover-${stableId}`\n\n const [isOpen, setIsOpen] = useState(false)\n const [uncontrolledValue, setUncontrolledValue] = useState<string | null>(\n defaultValue ?? null\n )\n const [activeIndex, setActiveIndex] = useState(-1)\n\n const isControlled = value !== undefined\n const selectedValue = isControlled ? (value ?? null) : uncontrolledValue\n\n const { allOptions, segments } = useMemo(() => {\n const segments = normalizeOptions(options)\n const allOptions = getSelectableOptionsFromSegments(segments)\n return { allOptions, segments }\n }, [options])\n\n const selectedOption = allOptions.find((opt) => opt.value === selectedValue)\n\n const activeOption = activeIndex >= 0 ? allOptions[activeIndex] : undefined\n const activeOptionId = activeOption\n ? `${baseId}-option-${activeOption.value}`\n : undefined\n\n const popoverRef = useRef<HTMLDivElement>(null)\n const internalTriggerRef = useRef<HTMLButtonElement | null>(null)\n const resolvedTriggerRef = triggerRef ?? internalTriggerRef\n const hiddenSelectRef = useRef<HTMLSelectElement | null>(null)\n const pendingChangeValueRef = useRef<string | null>(null)\n const searchStringRef = useRef(\"\")\n const searchTimeoutRef = useRef<ReturnType<typeof setTimeout>>()\n\n const setHiddenSelectRef = useCallback(\n (element: HTMLSelectElement | null) => {\n hiddenSelectRef.current = element\n if (typeof ref === \"function\") {\n ref(element)\n } else if (ref) {\n ref.current = element\n }\n },\n [ref]\n )\n\n useEffect(() => {\n const popoverEl = popoverRef.current\n if (!popoverEl) return\n\n const handleToggle = (e: Event) => {\n const newIsOpen = (e as ToggleEvent).newState === \"open\"\n setIsOpen(newIsOpen)\n\n if (newIsOpen) {\n const index = allOptions.findIndex(\n (opt) => opt.value === selectedValue && !opt.disabled\n )\n if (index >= 0) {\n setActiveIndex(index)\n } else {\n // Find first non-disabled option\n const firstEnabledIndexOrFirstIndex = Math.max(\n allOptions.findIndex((opt) => !opt.disabled),\n 0\n )\n setActiveIndex(firstEnabledIndexOrFirstIndex)\n }\n } else {\n setActiveIndex(-1)\n }\n }\n\n popoverEl.addEventListener(\"toggle\", handleToggle)\n return () => popoverEl.removeEventListener(\"toggle\", handleToggle)\n }, [allOptions, selectedValue])\n\n useEffect(() => {\n if (activeOptionId) {\n document\n .getElementById(activeOptionId)\n ?.scrollIntoView({ behavior: \"instant\", block: \"center\" })\n }\n }, [activeOptionId])\n\n useEffect(\n () => () => {\n clearTimeout(searchTimeoutRef.current)\n },\n []\n )\n\n const openPopover = () =>\n popoverRef.current?.showPopover({ source: resolvedTriggerRef.current! })\n\n const closePopover = () => popoverRef.current?.hidePopover()\n\n const commitSelection = useCallback(\n (nextValue: string) => {\n if (nextValue === selectedValue) {\n closePopover()\n return\n }\n\n if (!isControlled) {\n setUncontrolledValue(nextValue)\n }\n\n const hiddenEl = hiddenSelectRef.current\n if (hiddenEl) {\n pendingChangeValueRef.current = nextValue\n hiddenEl.value = nextValue\n hiddenEl.dispatchEvent(new Event(\"change\", { bubbles: true }))\n if (isControlled) {\n hiddenEl.value = value ?? \"\"\n }\n }\n\n closePopover()\n },\n [isControlled, selectedValue, value]\n )\n\n const selectActiveOption = useCallback(() => {\n if (activeOption && !activeOption.disabled) {\n commitSelection(activeOption.value!)\n return true\n }\n return false\n }, [activeOption, commitSelection])\n\n const commitActiveOptionOrClose = useCallback(() => {\n if (!selectActiveOption()) {\n closePopover()\n }\n }, [selectActiveOption])\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLButtonElement>) => {\n if (disabled) return\n\n // Tab must not be prevented — allow native focus movement\n if (e.key === \"Tab\" && isOpen) {\n commitActiveOptionOrClose()\n return\n }\n\n const action = getComboboxActionFromKey(e, isOpen)\n if (!action) return\n\n e.preventDefault()\n\n switch (action) {\n case ComboboxAction.OpenPopup:\n openPopover()\n break\n case ComboboxAction.CommitAndClose:\n commitActiveOptionOrClose()\n break\n case ComboboxAction.MoveFirst:\n case ComboboxAction.MoveLast:\n if (!isOpen) openPopover()\n setActiveIndex(getUpdatedIndex(activeIndex, action, allOptions))\n break\n case ComboboxAction.MoveNext:\n case ComboboxAction.MovePrevious:\n setActiveIndex(getUpdatedIndex(activeIndex, action, allOptions))\n break\n case ComboboxAction.TypeCharacter: {\n if (!isOpen) openPopover()\n\n clearTimeout(searchTimeoutRef.current)\n searchStringRef.current += e.key\n searchTimeoutRef.current = setTimeout(() => {\n searchStringRef.current = \"\"\n }, 500)\n\n const searchIndex = getIndexByLetter(\n allOptions,\n searchStringRef.current,\n activeIndex\n )\n if (searchIndex >= 0) {\n setActiveIndex(searchIndex)\n }\n break\n }\n case ComboboxAction.ClosePopup:\n closePopover()\n break\n }\n }\n\n const createStableEventTarget = (\n target: HTMLSelectElement,\n valueSnapshot: string\n ) => {\n const proxy = Object.create(target)\n Object.defineProperties(proxy, {\n disabled: {\n configurable: true,\n enumerable: true,\n value: target.disabled,\n },\n form: { configurable: true, enumerable: true, value: target.form },\n name: { configurable: true, enumerable: true, value: target.name },\n type: { configurable: true, enumerable: true, value: target.type },\n value: { configurable: true, enumerable: true, value: valueSnapshot },\n })\n return proxy as HTMLSelectElement\n }\n\n const withSelectTarget = useCallback(\n <\n SourceEvent extends React.SyntheticEvent,\n TargetEvent extends React.SyntheticEvent<HTMLSelectElement>,\n >(\n event: SourceEvent,\n target: HTMLSelectElement,\n currentTarget: HTMLSelectElement = target\n ) => {\n return Object.defineProperties(Object.create(event), {\n currentTarget: { value: currentTarget },\n target: { value: target },\n }) as TargetEvent\n },\n []\n )\n\n const handleHiddenSelectChange = useCallback(\n (event: React.ChangeEvent<HTMLSelectElement>) => {\n if (!onChange) return\n\n const valueSnapshot =\n pendingChangeValueRef.current ?? event.currentTarget.value\n pendingChangeValueRef.current = null\n\n const stableEvent = withSelectTarget<\n React.ChangeEvent<HTMLSelectElement>,\n React.ChangeEvent<HTMLSelectElement>\n >(\n event,\n createStableEventTarget(\n event.target as HTMLSelectElement,\n valueSnapshot\n ),\n createStableEventTarget(event.currentTarget, valueSnapshot)\n )\n\n onChange(stableEvent)\n },\n [onChange, withSelectTarget]\n )\n\n const forwardEventToSelect = useCallback(\n <\n ButtonEvent extends React.SyntheticEvent<HTMLButtonElement>,\n SelectEvent extends React.SyntheticEvent<HTMLSelectElement>,\n >(\n event: ButtonEvent,\n handler?: (event: SelectEvent) => void\n ) => {\n if (!handler) return\n\n const hiddenEl = hiddenSelectRef.current\n if (!hiddenEl) return\n\n const stableEvent = withSelectTarget<ButtonEvent, SelectEvent>(\n event,\n hiddenEl\n )\n\n handler(stableEvent)\n },\n [withSelectTarget]\n )\n\n const handleButtonBlur = useCallback(\n (event: React.FocusEvent<HTMLButtonElement>) => {\n forwardEventToSelect<\n React.FocusEvent<HTMLButtonElement>,\n React.FocusEvent<HTMLSelectElement>\n >(event, onBlur)\n },\n [forwardEventToSelect, onBlur]\n )\n\n const handleButtonClick = useCallback(\n (event: React.MouseEvent<HTMLButtonElement>) => {\n forwardEventToSelect<\n React.MouseEvent<HTMLButtonElement>,\n React.MouseEvent<HTMLSelectElement>\n >(event, onClick)\n },\n [forwardEventToSelect, onClick]\n )\n\n const handleButtonFocus = useCallback(\n (event: React.FocusEvent<HTMLButtonElement>) => {\n forwardEventToSelect<\n React.FocusEvent<HTMLButtonElement>,\n React.FocusEvent<HTMLSelectElement>\n >(event, onFocus)\n },\n [forwardEventToSelect, onFocus]\n )\n\n const renderListOption = (option: SelectOption, index: number) => {\n const { disabled, divider, label, value } = option\n if (divider) return <li key={index} role=\"separator\" />\n return (\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events -- keyboard events are handled on the combobox button\n <li\n key={value}\n {...getDataAttributes(option)}\n aria-disabled={disabled || undefined}\n aria-selected={value === selectedValue}\n className={\n value === activeOption?.value\n ? \"tds-select-option--active\"\n : undefined\n }\n id={`${baseId}-option-${value}`}\n onClick={disabled ? undefined : () => commitSelection(value!)}\n role=\"option\"\n >\n {label}\n </li>\n )\n }\n\n return (\n <>\n <button\n ref={resolvedTriggerRef}\n popovertarget={baseId}\n aria-activedescendant={activeOptionId}\n aria-controls={baseId}\n aria-describedby={ariaDescribedBy}\n aria-disabled={disabled ? \"true\" : undefined}\n aria-expanded={isOpen}\n aria-haspopup=\"listbox\"\n aria-invalid={invalid ? \"true\" : undefined}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-required={required ? \"true\" : undefined}\n disabled={disabled}\n onBlur={handleButtonBlur}\n onClick={handleButtonClick}\n onFocus={handleButtonFocus}\n onKeyDown={handleKeyDown}\n role=\"combobox\"\n type=\"button\"\n >\n {selectedOption ? selectedOption.label : placeholder}\n </button>\n <div\n ref={popoverRef}\n popover=\"\"\n id={baseId}\n role=\"listbox\"\n aria-describedby={ariaDescribedBy}\n aria-invalid={invalid ? \"true\" : undefined}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-required={required ? \"true\" : undefined}\n >\n {renderListSegments(segments, baseId, renderListOption)}\n </div>\n <select\n {...props}\n ref={setHiddenSelectRef}\n aria-hidden\n className=\"tds-select-hidden-select\"\n disabled={disabled}\n id={`${baseId}-control`}\n onChange={handleHiddenSelectChange}\n required={required}\n tabIndex={-1}\n value={selectedValue ?? \"\"}\n >\n <option value=\"\" />\n <SelectOptions items={options} />\n </select>\n </>\n )\n }\n)\n\nSelectPopover.displayName = \"SelectPopover\"\n"],"names":["React"],"mappings":"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"}
|
|
@@ -41,6 +41,7 @@ export type TextAreaProps = Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, ke
|
|
|
41
41
|
*
|
|
42
42
|
* @component
|
|
43
43
|
* @see {@link https://planningcenter.github.io/tapestry/?path=/docs/components-textarea--docs | Storybook Documentation}
|
|
44
|
+
* @see {@link https://github.com/planningcenter/tapestry/tree/main/packages/tapestry-migration-cli | Migration CLI: Available}
|
|
44
45
|
*/
|
|
45
46
|
export declare const TextArea: React.ForwardRefExoticComponent<TextAreaProps & React.RefAttributes<HTMLTextAreaElement>>;
|
|
46
47
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../../src/components/text-area/TextArea.tsx"],"names":[],"mappings":"AAAA,OAAO,aAAa,CAAA;AAIpB,OAAO,KAAK,EAAE,EAAc,KAAK,sBAAsB,EAAE,MAAM,OAAO,CAAA;AAEtE,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,MAAM,GAAG,UAAU,CAAA;AAEzD,MAAM,MAAM,YAAY,GAAG,IAAI,GAAG,IAAI,CAAA;AAEtC,UAAU,iBAAiB;IACzB,qFAAqF;IACrF,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,mDAAmD;IACnD,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,gCAAgC;IAChC,MAAM,CAAC,EAAE,cAAc,CAAA;IACvB,+BAA+B;IAC/B,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,gCAAgC;IAChC,IAAI,CAAC,EAAE,YAAY,CAAA;CACpB;AAED,UAAU,wBAAyB,SAAQ,iBAAiB;IAC1D,mEAAmE;IACnE,SAAS,CAAC,EAAE,KAAK,CAAA;IACjB,uCAAuC;IACvC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;CACvB;AAED,UAAU,uBAAwB,SAAQ,iBAAiB;IACzD,mEAAmE;IACnE,SAAS,EAAE,IAAI,CAAA;IACf,qEAAqE;IACrE,KAAK,EAAE,MAAM,CAAA;CACd;AAED,UAAU,0BAA2B,SAAQ,iBAAiB;IAC5D,+DAA+D;IAC/D,iBAAiB,EAAE,MAAM,CAAA;IACzB,SAAS,CAAC,EAAE,KAAK,CAAA;IACjB,KAAK,CAAC,EAAE,KAAK,CAAA;CACd;AAED,MAAM,MAAM,mBAAmB,GAC3B,0BAA0B,GAC1B,uBAAuB,GACvB,wBAAwB,CAAA;AAE5B,MAAM,MAAM,aAAa,GAAG,IAAI,CAC9B,sBAAsB,CAAC,mBAAmB,CAAC,EAC3C,MAAM,mBAAmB,GAAG,MAAM,CACnC,GACC,mBAAmB,CAAA;AAErB
|
|
1
|
+
{"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../../src/components/text-area/TextArea.tsx"],"names":[],"mappings":"AAAA,OAAO,aAAa,CAAA;AAIpB,OAAO,KAAK,EAAE,EAAc,KAAK,sBAAsB,EAAE,MAAM,OAAO,CAAA;AAEtE,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,MAAM,GAAG,UAAU,CAAA;AAEzD,MAAM,MAAM,YAAY,GAAG,IAAI,GAAG,IAAI,CAAA;AAEtC,UAAU,iBAAiB;IACzB,qFAAqF;IACrF,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,mDAAmD;IACnD,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,gCAAgC;IAChC,MAAM,CAAC,EAAE,cAAc,CAAA;IACvB,+BAA+B;IAC/B,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,gCAAgC;IAChC,IAAI,CAAC,EAAE,YAAY,CAAA;CACpB;AAED,UAAU,wBAAyB,SAAQ,iBAAiB;IAC1D,mEAAmE;IACnE,SAAS,CAAC,EAAE,KAAK,CAAA;IACjB,uCAAuC;IACvC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;CACvB;AAED,UAAU,uBAAwB,SAAQ,iBAAiB;IACzD,mEAAmE;IACnE,SAAS,EAAE,IAAI,CAAA;IACf,qEAAqE;IACrE,KAAK,EAAE,MAAM,CAAA;CACd;AAED,UAAU,0BAA2B,SAAQ,iBAAiB;IAC5D,+DAA+D;IAC/D,iBAAiB,EAAE,MAAM,CAAA;IACzB,SAAS,CAAC,EAAE,KAAK,CAAA;IACjB,KAAK,CAAC,EAAE,KAAK,CAAA;CACd;AAED,MAAM,MAAM,mBAAmB,GAC3B,0BAA0B,GAC1B,uBAAuB,GACvB,wBAAwB,CAAA;AAE5B,MAAM,MAAM,aAAa,GAAG,IAAI,CAC9B,sBAAsB,CAAC,mBAAmB,CAAC,EAC3C,MAAM,mBAAmB,GAAG,MAAM,CACnC,GACC,mBAAmB,CAAA;AAErB;;;;;;;;GAQG;AACH,eAAO,MAAM,QAAQ,2FAoDpB,CAAA"}
|
|
@@ -9,6 +9,7 @@ import React__default, { forwardRef } from 'react';
|
|
|
9
9
|
*
|
|
10
10
|
* @component
|
|
11
11
|
* @see {@link https://planningcenter.github.io/tapestry/?path=/docs/components-textarea--docs | Storybook Documentation}
|
|
12
|
+
* @see {@link https://github.com/planningcenter/tapestry/tree/main/packages/tapestry-migration-cli | Migration CLI: Available}
|
|
12
13
|
*/
|
|
13
14
|
const TextArea = forwardRef(function TextArea({ "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, className, description, hideLabel, id, invalid, label, resize = "vertical", rows = 3, size = "md", ...restProps }, ref) {
|
|
14
15
|
const wrapperClassName = classNames({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextArea.js","sources":["../../../src/components/text-area/TextArea.tsx"],"sourcesContent":["import \"./index.css\"\n\nimport { InputTextBase } from \"@components/input-text-base\"\nimport classNames from \"classnames\"\nimport React, { forwardRef, type TextareaHTMLAttributes } from \"react\"\n\nexport type TextAreaResize = \"auto\" | \"none\" | \"vertical\"\n\nexport type TextAreaSize = \"lg\" | \"md\"\n\ninterface TextAreaBaseProps {\n /** Helper text displayed below the textarea. Styled as error text when `invalid`. */\n description?: string\n /** Whether the textarea is in an invalid state. */\n invalid?: boolean\n /** Controls resize behavior. */\n resize?: TextAreaResize\n /** Visible height in lines. */\n rows?: number\n /** The size of the textarea. */\n size?: TextAreaSize\n}\n\ninterface TextAreaWithVisibleLabel extends TextAreaBaseProps {\n /** If true, the label is visually hidden and set as aria-label. */\n hideLabel?: false\n /** The label text for the textarea. */\n label: React.ReactNode\n}\n\ninterface TextAreaWithHiddenLabel extends TextAreaBaseProps {\n /** If true, the label is visually hidden and set as aria-label. */\n hideLabel: true\n /** The label text for the textarea. Must be a string when hidden. */\n label: string\n}\n\ninterface TextAreaWithAriaLabelledBy extends TextAreaBaseProps {\n /** ID of an external label element. Use instead of `label`. */\n \"aria-labelledby\": string\n hideLabel?: never\n label?: never\n}\n\nexport type TextAreaCustomProps =\n | TextAreaWithAriaLabelledBy\n | TextAreaWithHiddenLabel\n | TextAreaWithVisibleLabel\n\nexport type TextAreaProps = Omit<\n TextareaHTMLAttributes<HTMLTextAreaElement>,\n keyof TextAreaCustomProps | \"rows\"\n> &\n TextAreaCustomProps\n\n/**\n * A multi-line text input that renders as an HTML `<textarea>` with a\n * label and optional description. Supports invalid state, `lg`/`md`\n * sizing, and configurable resize behavior (`vertical`, `none`, `auto`).\n *\n * @component\n * @see {@link https://planningcenter.github.io/tapestry/?path=/docs/components-textarea--docs | Storybook Documentation}\n */\nexport const TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(\n function TextArea(\n {\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n className,\n description,\n hideLabel,\n id,\n invalid,\n label,\n resize = \"vertical\",\n rows = 3,\n size = \"md\",\n ...restProps\n }: TextAreaProps,\n ref\n ) {\n const wrapperClassName = classNames(\n {\n \"tds-textarea--resize-auto\": resize === \"auto\",\n \"tds-textarea--resize-none\": resize === \"none\",\n \"tds-textarea--resize-vertical\": resize === \"vertical\",\n },\n className\n )\n\n return (\n <InputTextBase\n className={wrapperClassName}\n description={description}\n hideLabel={hideLabel || !!ariaLabelledBy}\n id={id}\n invalid={invalid}\n label={label}\n size={size}\n >\n {({ descriptionId, inputId }) => (\n <textarea\n {...restProps}\n aria-describedby={descriptionId}\n aria-invalid={invalid || undefined}\n aria-label={hideLabel ? ariaLabel || (label as string) : ariaLabel}\n aria-labelledby={ariaLabelledBy}\n id={inputId}\n ref={ref}\n rows={rows}\n />\n )}\n </InputTextBase>\n )\n }\n)\n\nTextArea.displayName = \"TextArea\"\n"],"names":["React"],"mappings":";;;;AAuDA
|
|
1
|
+
{"version":3,"file":"TextArea.js","sources":["../../../src/components/text-area/TextArea.tsx"],"sourcesContent":["import \"./index.css\"\n\nimport { InputTextBase } from \"@components/input-text-base\"\nimport classNames from \"classnames\"\nimport React, { forwardRef, type TextareaHTMLAttributes } from \"react\"\n\nexport type TextAreaResize = \"auto\" | \"none\" | \"vertical\"\n\nexport type TextAreaSize = \"lg\" | \"md\"\n\ninterface TextAreaBaseProps {\n /** Helper text displayed below the textarea. Styled as error text when `invalid`. */\n description?: string\n /** Whether the textarea is in an invalid state. */\n invalid?: boolean\n /** Controls resize behavior. */\n resize?: TextAreaResize\n /** Visible height in lines. */\n rows?: number\n /** The size of the textarea. */\n size?: TextAreaSize\n}\n\ninterface TextAreaWithVisibleLabel extends TextAreaBaseProps {\n /** If true, the label is visually hidden and set as aria-label. */\n hideLabel?: false\n /** The label text for the textarea. */\n label: React.ReactNode\n}\n\ninterface TextAreaWithHiddenLabel extends TextAreaBaseProps {\n /** If true, the label is visually hidden and set as aria-label. */\n hideLabel: true\n /** The label text for the textarea. Must be a string when hidden. */\n label: string\n}\n\ninterface TextAreaWithAriaLabelledBy extends TextAreaBaseProps {\n /** ID of an external label element. Use instead of `label`. */\n \"aria-labelledby\": string\n hideLabel?: never\n label?: never\n}\n\nexport type TextAreaCustomProps =\n | TextAreaWithAriaLabelledBy\n | TextAreaWithHiddenLabel\n | TextAreaWithVisibleLabel\n\nexport type TextAreaProps = Omit<\n TextareaHTMLAttributes<HTMLTextAreaElement>,\n keyof TextAreaCustomProps | \"rows\"\n> &\n TextAreaCustomProps\n\n/**\n * A multi-line text input that renders as an HTML `<textarea>` with a\n * label and optional description. Supports invalid state, `lg`/`md`\n * sizing, and configurable resize behavior (`vertical`, `none`, `auto`).\n *\n * @component\n * @see {@link https://planningcenter.github.io/tapestry/?path=/docs/components-textarea--docs | Storybook Documentation}\n * @see {@link https://github.com/planningcenter/tapestry/tree/main/packages/tapestry-migration-cli | Migration CLI: Available}\n */\nexport const TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(\n function TextArea(\n {\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n className,\n description,\n hideLabel,\n id,\n invalid,\n label,\n resize = \"vertical\",\n rows = 3,\n size = \"md\",\n ...restProps\n }: TextAreaProps,\n ref\n ) {\n const wrapperClassName = classNames(\n {\n \"tds-textarea--resize-auto\": resize === \"auto\",\n \"tds-textarea--resize-none\": resize === \"none\",\n \"tds-textarea--resize-vertical\": resize === \"vertical\",\n },\n className\n )\n\n return (\n <InputTextBase\n className={wrapperClassName}\n description={description}\n hideLabel={hideLabel || !!ariaLabelledBy}\n id={id}\n invalid={invalid}\n label={label}\n size={size}\n >\n {({ descriptionId, inputId }) => (\n <textarea\n {...restProps}\n aria-describedby={descriptionId}\n aria-invalid={invalid || undefined}\n aria-label={hideLabel ? ariaLabel || (label as string) : ariaLabel}\n aria-labelledby={ariaLabelledBy}\n id={inputId}\n ref={ref}\n rows={rows}\n />\n )}\n </InputTextBase>\n )\n }\n)\n\nTextArea.displayName = \"TextArea\"\n"],"names":["React"],"mappings":";;;;AAuDA;;;;;;;;AAQG;MACU,QAAQ,GAAG,UAAU,CAChC,SAAS,QAAQ,CACf,EACE,YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,cAAc,EACjC,SAAS,EACT,WAAW,EACX,SAAS,EACT,EAAE,EACF,OAAO,EACP,KAAK,EACL,MAAM,GAAG,UAAU,EACnB,IAAI,GAAG,CAAC,EACR,IAAI,GAAG,IAAI,EACX,GAAG,SAAS,EACE,EAChB,GAAG,EAAA;IAEH,MAAM,gBAAgB,GAAG,UAAU,CACjC;QACE,2BAA2B,EAAE,MAAM,KAAK,MAAM;QAC9C,2BAA2B,EAAE,MAAM,KAAK,MAAM;QAC9C,+BAA+B,EAAE,MAAM,KAAK,UAAU;KACvD,EACD,SAAS,CACV;AAED,IAAA,QACEA,cAAA,CAAA,aAAA,CAAC,aAAa,IACZ,SAAS,EAAE,gBAAgB,EAC3B,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,IAAI,CAAC,CAAC,cAAc,EACxC,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EAAA,EAET,CAAC,EAAE,aAAa,EAAE,OAAO,EAAE,MAC1BA,cAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAA,GACM,SAAS,EAAA,kBAAA,EACK,aAAa,kBACjB,OAAO,IAAI,SAAS,EAAA,YAAA,EACtB,SAAS,GAAG,SAAS,IAAK,KAAgB,GAAG,SAAS,qBACjD,cAAc,EAC/B,EAAE,EAAE,OAAO,EACX,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,IAAI,GACV,CACH,CACa;AAEpB,CAAC;AAGH,QAAQ,CAAC,WAAW,GAAG,UAAU;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import "../
|
|
1
|
+
import "../field/index.css";
|
|
2
2
|
import "./index.css";
|
|
3
3
|
import type { CalendarDateTime, Time, ZonedDateTime } from "@internationalized/date";
|
|
4
4
|
import type { CombineAriaPropsWithCustomProps } from "../../utilities/reactAriaProps";
|
|
@@ -44,6 +44,7 @@ export type TimeFieldElementProps = CombineAriaPropsWithCustomProps<AriaTimeFiel
|
|
|
44
44
|
*
|
|
45
45
|
* @component
|
|
46
46
|
* @see {@link https://planningcenter.github.io/tapestry/?path=/docs/components-timefield--docs | Storybook Documentation}
|
|
47
|
+
* @see {@link https://github.com/planningcenter/tapestry/tree/main/packages/tapestry-migration-cli | Migration CLI: Available}
|
|
47
48
|
*/
|
|
48
49
|
export declare function TimeField({ className, description, disabled, forceLeadingZeros, hideLabel, invalid, label, max, min, readOnly, required, size, ...restProps }: TimeFieldElementProps): React.JSX.Element;
|
|
49
50
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TimeField.d.ts","sourceRoot":"","sources":["../../../src/components/time-field/TimeField.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"TimeField.d.ts","sourceRoot":"","sources":["../../../src/components/time-field/TimeField.tsx"],"names":[],"mappings":"AAAA,OAAO,oBAAoB,CAAA;AAC3B,OAAO,aAAa,CAAA;AAEpB,OAAO,KAAK,EACV,gBAAgB,EAChB,IAAI,EACJ,aAAa,EACd,MAAM,yBAAyB,CAAA;AAEhC,OAAO,KAAK,EAAE,+BAA+B,EAAE,MAAM,2BAA2B,CAAA;AAEhF,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAML,KAAK,cAAc,IAAI,kBAAkB,EAC1C,MAAM,iCAAiC,CAAA;AAExC,MAAM,MAAM,aAAa,GAAG,IAAI,GAAG,IAAI,CAAA;AAEvC,MAAM,MAAM,cAAc,GAAG,gBAAgB,GAAG,IAAI,GAAG,aAAa,CAAA;AAEpE,MAAM,WAAW,cAAc;IAC7B,gGAAgG;IAChG,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,0BAA0B;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,+DAA+D;IAC/D,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,oDAAoD;IACpD,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,qEAAqE;IACrE,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,sCAAsC;IACtC,KAAK,EAAE,MAAM,CAAA;IACb,yDAAyD;IACzD,GAAG,CAAC,EAAE,cAAc,CAAA;IACpB,wDAAwD;IACxD,GAAG,CAAC,EAAE,cAAc,CAAA;IACpB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kCAAkC;IAClC,IAAI,CAAC,EAAE,aAAa,CAAA;CACrB;AAED,KAAK,wBAAwB,GACzB,UAAU,GACV,aAAa,GACb,kBAAkB,GAClB,yBAAyB,GACzB,MAAM,CAAA;AAEV,KAAK,2BAA2B,GAC5B,cAAc,GACd,cAAc,GACd,WAAW,GACX,MAAM,GACN,UAAU,GACV,OAAO,CAAA;AAEX,MAAM,MAAM,qBAAqB,GAAG,+BAA+B,CACjE,kBAAkB,CAAC,cAAc,CAAC,EAClC,cAAc,EACd,wBAAwB,EACxB,2BAA2B,CAC5B,CAAA;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,SAAS,CAAC,EACxB,SAAS,EACT,WAAW,EACX,QAAQ,EACR,iBAAiB,EACjB,SAAS,EACT,OAAO,EACP,KAAK,EACL,GAAG,EACH,GAAG,EACH,QAAQ,EACR,QAAQ,EACR,IAAW,EACX,GAAG,SAAS,EACb,EAAE,qBAAqB,qBAqDvB"}
|
|
@@ -14,6 +14,7 @@ import { TimeField as TimeField$1, Label, DateInput, DateSegment, Text } from 'r
|
|
|
14
14
|
*
|
|
15
15
|
* @component
|
|
16
16
|
* @see {@link https://planningcenter.github.io/tapestry/?path=/docs/components-timefield--docs | Storybook Documentation}
|
|
17
|
+
* @see {@link https://github.com/planningcenter/tapestry/tree/main/packages/tapestry-migration-cli | Migration CLI: Available}
|
|
17
18
|
*/
|
|
18
19
|
function TimeField({ className, description, disabled, forceLeadingZeros, hideLabel, invalid, label, max, min, readOnly, required, size = "md", ...restProps }) {
|
|
19
20
|
const combinedClassName = classNames("tds-field tds-time-field", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TimeField.js","sources":["../../../src/components/time-field/TimeField.tsx"],"sourcesContent":["import \"../
|
|
1
|
+
{"version":3,"file":"TimeField.js","sources":["../../../src/components/time-field/TimeField.tsx"],"sourcesContent":["import \"../field/index.css\"\nimport \"./index.css\"\n\nimport type {\n CalendarDateTime,\n Time,\n ZonedDateTime,\n} from \"@internationalized/date\"\nimport Icon from \"@utilities/Icon\"\nimport type { CombineAriaPropsWithCustomProps } from \"@utilities/reactAriaProps\"\nimport classNames from \"classnames\"\nimport React from \"react\"\nimport {\n DateInput,\n DateSegment,\n Label,\n Text,\n TimeField as AriaTimeField,\n type TimeFieldProps as AriaTimeFieldProps,\n} from \"react-aria-components/TimeField\"\n\nexport type TimeFieldSize = \"md\" | \"lg\"\n\nexport type TimeFieldValue = CalendarDateTime | Time | ZonedDateTime\n\nexport interface TimeFieldProps {\n /** Helper text displayed below the component. Styled as error text when `invalid` is `true`. */\n description?: string\n /** Disables the field. */\n disabled?: boolean\n /** If `true`, always shows leading zeros in the hour field. */\n forceLeadingZeros?: boolean\n /** If `true`, renders the label visually hidden. */\n hideLabel?: boolean\n /** If `true`, applies error styling to the field and description. */\n invalid?: boolean\n /** Accessible label for the field. */\n label: string\n /** The maximum allowed time (e.g. `new Time(17, 0)`). */\n max?: TimeFieldValue\n /** The minimum allowed time (e.g. `new Time(9, 0)`). */\n min?: TimeFieldValue\n /** Allows the value to be read but not changed. */\n readOnly?: boolean\n /** If `true`, appends an asterisk after the label text. */\n required?: boolean\n /** The size of the time field. */\n size?: TimeFieldSize\n}\n\ntype AriaTimeFieldPropsToOmit =\n | \"children\"\n | \"granularity\"\n | \"placeholderValue\"\n | \"shouldForceLeadingZeros\"\n | \"slot\"\n\ntype AriaTimeFieldPropsToInclude =\n | \"defaultValue\"\n | \"hideTimeZone\"\n | \"hourCycle\"\n | \"name\"\n | \"onChange\"\n | \"value\"\n\nexport type TimeFieldElementProps = CombineAriaPropsWithCustomProps<\n AriaTimeFieldProps<TimeFieldValue>,\n TimeFieldProps,\n AriaTimeFieldPropsToOmit,\n AriaTimeFieldPropsToInclude\n>\n\n/**\n * A time field component allows users to enter and edit time values as individual\n * segments. Each segment supports keyboard entry, increment/decrement\n * with arrow keys, and respects the user's locale (12- vs 24-hour clock),\n * which can be overridden with `hourCycle`.\n *\n * Values are `Time`, `CalendarDateTime`, or `ZonedDateTime` from\n * `@internationalized/date`. Restrict the allowed range with `min`/`max`.\n *\n * @component\n * @see {@link https://planningcenter.github.io/tapestry/?path=/docs/components-timefield--docs | Storybook Documentation}\n * @see {@link https://github.com/planningcenter/tapestry/tree/main/packages/tapestry-migration-cli | Migration CLI: Available}\n */\nexport function TimeField({\n className,\n description,\n disabled,\n forceLeadingZeros,\n hideLabel,\n invalid,\n label,\n max,\n min,\n readOnly,\n required,\n size = \"md\",\n ...restProps\n}: TimeFieldElementProps) {\n const combinedClassName = classNames(\n \"tds-field tds-time-field\",\n {\n \"tds-field--lg\": size === \"lg\",\n \"tds-time-field--lg\": size === \"lg\",\n },\n className\n )\n\n return (\n <AriaTimeField\n {...restProps}\n aria-label={hideLabel ? label : undefined}\n className={combinedClassName}\n granularity=\"minute\"\n isDisabled={disabled}\n isInvalid={invalid}\n isReadOnly={readOnly}\n isRequired={required}\n maxValue={max ?? undefined}\n minValue={min ?? undefined}\n shouldForceLeadingZeros={forceLeadingZeros}\n >\n {!hideLabel && <Label className=\"tds-field-label\">{label}</Label>}\n <DateInput className=\"tds-field-control tds-time-field-input\">\n {(segment) => (\n <DateSegment\n className={\n segment.type === \"literal\"\n ? \"tds-field-date-segment-separator\"\n : \"tds-field-date-segment\"\n }\n segment={segment}\n />\n )}\n </DateInput>\n {description && (\n <Text\n elementType=\"p\"\n className=\"tds-field-description\"\n slot=\"description\"\n >\n <Icon\n aria-hidden\n className=\"tds-field-description-invalid-icon\"\n symbol=\"general#exclamation-triangle\"\n />\n {description}\n </Text>\n )}\n </AriaTimeField>\n )\n}\n"],"names":["React","AriaTimeField"],"mappings":";;;;;AAwEA;;;;;;;;;;;;AAYG;AACG,SAAU,SAAS,CAAC,EACxB,SAAS,EACT,WAAW,EACX,QAAQ,EACR,iBAAiB,EACjB,SAAS,EACT,OAAO,EACP,KAAK,EACL,GAAG,EACH,GAAG,EACH,QAAQ,EACR,QAAQ,EACR,IAAI,GAAG,IAAI,EACX,GAAG,SAAS,EACU,EAAA;AACtB,IAAA,MAAM,iBAAiB,GAAG,UAAU,CAClC,0BAA0B,EAC1B;QACE,eAAe,EAAE,IAAI,KAAK,IAAI;QAC9B,oBAAoB,EAAE,IAAI,KAAK,IAAI;KACpC,EACD,SAAS,CACV;IAED,QACEA,cAAA,CAAA,aAAA,CAACC,WAAa,EAAA,EAAA,GACR,SAAS,gBACD,SAAS,GAAG,KAAK,GAAG,SAAS,EACzC,SAAS,EAAE,iBAAiB,EAC5B,WAAW,EAAC,QAAQ,EACpB,UAAU,EAAE,QAAQ,EACpB,SAAS,EAAE,OAAO,EAClB,UAAU,EAAE,QAAQ,EACpB,UAAU,EAAE,QAAQ,EACpB,QAAQ,EAAE,GAAG,IAAI,SAAS,EAC1B,QAAQ,EAAE,GAAG,IAAI,SAAS,EAC1B,uBAAuB,EAAE,iBAAiB,EAAA;QAEzC,CAAC,SAAS,IAAID,cAAA,CAAA,aAAA,CAAC,KAAK,EAAA,EAAC,SAAS,EAAC,iBAAiB,EAAA,EAAE,KAAK,CAAS;QACjEA,cAAA,CAAA,aAAA,CAAC,SAAS,IAAC,SAAS,EAAC,wCAAwC,EAAA,EAC1D,CAAC,OAAO,MACPA,cAAA,CAAA,aAAA,CAAC,WAAW,EAAA,EACV,SAAS,EACP,OAAO,CAAC,IAAI,KAAK;AACf,kBAAE;kBACA,wBAAwB,EAE9B,OAAO,EAAE,OAAO,EAAA,CAChB,CACH,CACS;AACX,QAAA,WAAW,KACVA,cAAA,CAAA,aAAA,CAAC,IAAI,IACH,WAAW,EAAC,GAAG,EACf,SAAS,EAAC,uBAAuB,EACjC,IAAI,EAAC,aAAa,EAAA;YAElBA,cAAA,CAAA,aAAA,CAAC,IAAI,yBAEH,SAAS,EAAC,oCAAoC,EAC9C,MAAM,EAAC,8BAA8B,EAAA,CACrC;AACD,YAAA,WAAW,CACP,CACR,CACa;AAEpB;;;;"}
|
|
@@ -53,6 +53,7 @@ export type ToggleSwitchElementProps = Omit<InputHTMLAttributes<HTMLInputElement
|
|
|
53
53
|
*
|
|
54
54
|
* @component
|
|
55
55
|
* @see {@link https://planningcenter.github.io/tapestry/?path=/docs/components-toggle-switch--docs | Storybook Documentation}
|
|
56
|
+
* @see {@link https://github.com/planningcenter/tapestry/tree/main/packages/tapestry-migration-cli | Migration CLI: Available}
|
|
56
57
|
*/
|
|
57
58
|
export declare const ToggleSwitch: React.ForwardRefExoticComponent<ToggleSwitchElementProps & React.RefAttributes<HTMLInputElement>>;
|
|
58
59
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToggleSwitch.d.ts","sourceRoot":"","sources":["../../../src/components/toggle-switch/ToggleSwitch.tsx"],"names":[],"mappings":"AAAA,OAAO,aAAa,CAAA;AAIpB,OAAO,KAAK,EAAE,EAAc,mBAAmB,EAAE,MAAM,OAAO,CAAA;AAE9D,MAAM,MAAM,gBAAgB,GAAG,IAAI,GAAG,IAAI,CAAA;AAE1C,UAAU,qBAAqB;IAC7B,cAAc,CAAC,EAAE,KAAK,CAAA;IACtB,YAAY,CAAC,EAAE,KAAK,CAAA;IACpB,eAAe,CAAC,EAAE,KAAK,CAAA;IACvB,4EAA4E;IAC5E,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,KAAK,CAAA;IAChB,qCAAqC;IACrC,IAAI,CAAC,EAAE,gBAAgB,CAAA;CACxB;AAED,UAAU,4BAA6B,SAAQ,qBAAqB;IAClE,iBAAiB,CAAC,EAAE,KAAK,CAAA;IACzB,yFAAyF;IACzF,SAAS,CAAC,EAAE,KAAK,CAAA;IACjB;;;;;;;OAOG;IACH,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;CACvB;AAED,UAAU,2BAA4B,SAAQ,qBAAqB;IACjE,iBAAiB,CAAC,EAAE,KAAK,CAAA;IACzB,yFAAyF;IACzF,SAAS,EAAE,IAAI,CAAA;IACf,4EAA4E;IAC5E,KAAK,EAAE,MAAM,CAAA;CACd;AAED,UAAU,8BAA+B,SAAQ,qBAAqB;IACpE,iBAAiB,EAAE,MAAM,CAAA;IACzB,SAAS,CAAC,EAAE,KAAK,CAAA;IACjB,wDAAwD;IACxD,KAAK,CAAC,EAAE,KAAK,CAAA;CACd;AAED,MAAM,MAAM,iBAAiB,GACzB,4BAA4B,GAC5B,2BAA2B,GAC3B,8BAA8B,CAAA;AAElC,MAAM,MAAM,wBAAwB,GAAG,IAAI,CACzC,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,MAAM,iBAAiB,GAAG,MAAM,GAAG,UAAU,GAAG,eAAe,CAChE,GACC,iBAAiB,CAAA;AAEnB
|
|
1
|
+
{"version":3,"file":"ToggleSwitch.d.ts","sourceRoot":"","sources":["../../../src/components/toggle-switch/ToggleSwitch.tsx"],"names":[],"mappings":"AAAA,OAAO,aAAa,CAAA;AAIpB,OAAO,KAAK,EAAE,EAAc,mBAAmB,EAAE,MAAM,OAAO,CAAA;AAE9D,MAAM,MAAM,gBAAgB,GAAG,IAAI,GAAG,IAAI,CAAA;AAE1C,UAAU,qBAAqB;IAC7B,cAAc,CAAC,EAAE,KAAK,CAAA;IACtB,YAAY,CAAC,EAAE,KAAK,CAAA;IACpB,eAAe,CAAC,EAAE,KAAK,CAAA;IACvB,4EAA4E;IAC5E,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,KAAK,CAAA;IAChB,qCAAqC;IACrC,IAAI,CAAC,EAAE,gBAAgB,CAAA;CACxB;AAED,UAAU,4BAA6B,SAAQ,qBAAqB;IAClE,iBAAiB,CAAC,EAAE,KAAK,CAAA;IACzB,yFAAyF;IACzF,SAAS,CAAC,EAAE,KAAK,CAAA;IACjB;;;;;;;OAOG;IACH,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;CACvB;AAED,UAAU,2BAA4B,SAAQ,qBAAqB;IACjE,iBAAiB,CAAC,EAAE,KAAK,CAAA;IACzB,yFAAyF;IACzF,SAAS,EAAE,IAAI,CAAA;IACf,4EAA4E;IAC5E,KAAK,EAAE,MAAM,CAAA;CACd;AAED,UAAU,8BAA+B,SAAQ,qBAAqB;IACpE,iBAAiB,EAAE,MAAM,CAAA;IACzB,SAAS,CAAC,EAAE,KAAK,CAAA;IACjB,wDAAwD;IACxD,KAAK,CAAC,EAAE,KAAK,CAAA;CACd;AAED,MAAM,MAAM,iBAAiB,GACzB,4BAA4B,GAC5B,2BAA2B,GAC3B,8BAA8B,CAAA;AAElC,MAAM,MAAM,wBAAwB,GAAG,IAAI,CACzC,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,MAAM,iBAAiB,GAAG,MAAM,GAAG,UAAU,GAAG,eAAe,CAChE,GACC,iBAAiB,CAAA;AAEnB;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,YAAY,mGA0DxB,CAAA"}
|
|
@@ -15,6 +15,7 @@ import React__default, { forwardRef } from 'react';
|
|
|
15
15
|
*
|
|
16
16
|
* @component
|
|
17
17
|
* @see {@link https://planningcenter.github.io/tapestry/?path=/docs/components-toggle-switch--docs | Storybook Documentation}
|
|
18
|
+
* @see {@link https://github.com/planningcenter/tapestry/tree/main/packages/tapestry-migration-cli | Migration CLI: Available}
|
|
18
19
|
*/
|
|
19
20
|
const ToggleSwitch = forwardRef(({ "aria-describedby": ariaDescribedby, checked, className, description, hideLabel = false, id, label, size = "md", ...restProps }, ref) => {
|
|
20
21
|
const combinedClassName = classNames("tds-toggle-switch", size && size === "sm" && `tds-toggle-switch--sm`, hideLabel && `tds-toggle-switch--hide-label`, className);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToggleSwitch.js","sources":["../../../src/components/toggle-switch/ToggleSwitch.tsx"],"sourcesContent":["import \"./index.css\"\n\nimport { useId } from \"@utilities/useId\"\nimport classNames from \"classnames\"\nimport React, { forwardRef, InputHTMLAttributes } from \"react\"\n\nexport type ToggleSwitchSize = \"md\" | \"sm\"\n\ninterface ToggleSwitchBaseProps {\n \"aria-invalid\"?: never\n \"aria-label\"?: never\n \"aria-required\"?: never\n /** Optional description text that appears below the toggle switch label. */\n description?: string\n required?: never\n /** The size of the toggle switch. */\n size?: ToggleSwitchSize\n}\n\ninterface ToggleSwitchWithVisibleLabel extends ToggleSwitchBaseProps {\n \"aria-labelledby\"?: never\n /** When true, hides the visible label and sets it as aria-label on the input instead. */\n hideLabel?: false\n /**\n * The label content for the toggle switch. Required unless\n * `aria-labelledby` is provided to reference an external label. When\n * using non-string content (e.g. JSX), it must not contain\n * interactive elements. This includes native HTML elements such as\n * `<a>` and `<button>`, as well as Tapestry or Tapestry-React\n * interactive components.\n */\n label: React.ReactNode\n}\n\ninterface ToggleSwitchWithHiddenLabel extends ToggleSwitchBaseProps {\n \"aria-labelledby\"?: never\n /** When true, hides the visible label and sets it as aria-label on the input instead. */\n hideLabel: true\n /** Label text for the toggle switch, used as an accessible `aria-label`. */\n label: string\n}\n\ninterface ToggleSwitchWithAriaLabelledBy extends ToggleSwitchBaseProps {\n \"aria-labelledby\": string\n hideLabel?: never\n /** Not available when `aria-labelledby` is provided. */\n label?: never\n}\n\nexport type ToggleSwitchProps =\n | ToggleSwitchWithVisibleLabel\n | ToggleSwitchWithHiddenLabel\n | ToggleSwitchWithAriaLabelledBy\n\nexport type ToggleSwitchElementProps = Omit<\n InputHTMLAttributes<HTMLInputElement>,\n keyof ToggleSwitchProps | \"type\" | \"required\" | \"aria-required\"\n> &\n ToggleSwitchProps\n\n/**\n * A toggle switch component that renders as a checkbox input styled as a switch.\n *\n * **Required:** You must provide either:\n * - `label` - Label content for the switch (must be a string when `hideLabel` is true)\n * - `aria-labelledby` - ID of an external element that provides the label\n *\n * When using non-string content for `label` (e.g. JSX), it must not contain\n * interactive elements. This includes native HTML elements such as `<a>` and\n * `<button>`, as well as Tapestry or Tapestry-React interactive components.\n *\n * @component\n * @see {@link https://planningcenter.github.io/tapestry/?path=/docs/components-toggle-switch--docs | Storybook Documentation}\n */\nexport const ToggleSwitch = forwardRef<\n HTMLInputElement,\n ToggleSwitchElementProps\n>(\n (\n {\n \"aria-describedby\": ariaDescribedby,\n checked,\n className,\n description,\n hideLabel = false,\n id,\n label,\n size = \"md\",\n ...restProps\n }: ToggleSwitchElementProps,\n ref\n ) => {\n const combinedClassName = classNames(\n \"tds-toggle-switch\",\n size && size === \"sm\" && `tds-toggle-switch--sm`,\n hideLabel && `tds-toggle-switch--hide-label`,\n className\n )\n\n const stableId = useId()\n const toggleSwitchId = id || `tds-toggle-switch-${stableId}`\n\n return (\n <div className={combinedClassName}>\n <div className=\"tds-toggle-switch-track\" aria-hidden=\"true\"></div>\n <input\n {...restProps}\n id={toggleSwitchId}\n type=\"checkbox\"\n role=\"switch\"\n aria-checked={checked}\n aria-label={hideLabel ? (label as string) : undefined}\n aria-describedby={\n description && !hideLabel\n ? `${toggleSwitchId}-description`\n : ariaDescribedby\n }\n checked={checked}\n ref={ref}\n />\n {label && !hideLabel && <label htmlFor={toggleSwitchId}>{label}</label>}\n {description && !hideLabel && (\n <p\n id={`${toggleSwitchId}-description`}\n className=\"tds-toggle-switch-description\"\n >\n {description}\n </p>\n )}\n </div>\n )\n }\n)\n\nToggleSwitch.displayName = \"ToggleSwitch\"\n"],"names":["React"],"mappings":";;;;AA4DA
|
|
1
|
+
{"version":3,"file":"ToggleSwitch.js","sources":["../../../src/components/toggle-switch/ToggleSwitch.tsx"],"sourcesContent":["import \"./index.css\"\n\nimport { useId } from \"@utilities/useId\"\nimport classNames from \"classnames\"\nimport React, { forwardRef, InputHTMLAttributes } from \"react\"\n\nexport type ToggleSwitchSize = \"md\" | \"sm\"\n\ninterface ToggleSwitchBaseProps {\n \"aria-invalid\"?: never\n \"aria-label\"?: never\n \"aria-required\"?: never\n /** Optional description text that appears below the toggle switch label. */\n description?: string\n required?: never\n /** The size of the toggle switch. */\n size?: ToggleSwitchSize\n}\n\ninterface ToggleSwitchWithVisibleLabel extends ToggleSwitchBaseProps {\n \"aria-labelledby\"?: never\n /** When true, hides the visible label and sets it as aria-label on the input instead. */\n hideLabel?: false\n /**\n * The label content for the toggle switch. Required unless\n * `aria-labelledby` is provided to reference an external label. When\n * using non-string content (e.g. JSX), it must not contain\n * interactive elements. This includes native HTML elements such as\n * `<a>` and `<button>`, as well as Tapestry or Tapestry-React\n * interactive components.\n */\n label: React.ReactNode\n}\n\ninterface ToggleSwitchWithHiddenLabel extends ToggleSwitchBaseProps {\n \"aria-labelledby\"?: never\n /** When true, hides the visible label and sets it as aria-label on the input instead. */\n hideLabel: true\n /** Label text for the toggle switch, used as an accessible `aria-label`. */\n label: string\n}\n\ninterface ToggleSwitchWithAriaLabelledBy extends ToggleSwitchBaseProps {\n \"aria-labelledby\": string\n hideLabel?: never\n /** Not available when `aria-labelledby` is provided. */\n label?: never\n}\n\nexport type ToggleSwitchProps =\n | ToggleSwitchWithVisibleLabel\n | ToggleSwitchWithHiddenLabel\n | ToggleSwitchWithAriaLabelledBy\n\nexport type ToggleSwitchElementProps = Omit<\n InputHTMLAttributes<HTMLInputElement>,\n keyof ToggleSwitchProps | \"type\" | \"required\" | \"aria-required\"\n> &\n ToggleSwitchProps\n\n/**\n * A toggle switch component that renders as a checkbox input styled as a switch.\n *\n * **Required:** You must provide either:\n * - `label` - Label content for the switch (must be a string when `hideLabel` is true)\n * - `aria-labelledby` - ID of an external element that provides the label\n *\n * When using non-string content for `label` (e.g. JSX), it must not contain\n * interactive elements. This includes native HTML elements such as `<a>` and\n * `<button>`, as well as Tapestry or Tapestry-React interactive components.\n *\n * @component\n * @see {@link https://planningcenter.github.io/tapestry/?path=/docs/components-toggle-switch--docs | Storybook Documentation}\n * @see {@link https://github.com/planningcenter/tapestry/tree/main/packages/tapestry-migration-cli | Migration CLI: Available}\n */\nexport const ToggleSwitch = forwardRef<\n HTMLInputElement,\n ToggleSwitchElementProps\n>(\n (\n {\n \"aria-describedby\": ariaDescribedby,\n checked,\n className,\n description,\n hideLabel = false,\n id,\n label,\n size = \"md\",\n ...restProps\n }: ToggleSwitchElementProps,\n ref\n ) => {\n const combinedClassName = classNames(\n \"tds-toggle-switch\",\n size && size === \"sm\" && `tds-toggle-switch--sm`,\n hideLabel && `tds-toggle-switch--hide-label`,\n className\n )\n\n const stableId = useId()\n const toggleSwitchId = id || `tds-toggle-switch-${stableId}`\n\n return (\n <div className={combinedClassName}>\n <div className=\"tds-toggle-switch-track\" aria-hidden=\"true\"></div>\n <input\n {...restProps}\n id={toggleSwitchId}\n type=\"checkbox\"\n role=\"switch\"\n aria-checked={checked}\n aria-label={hideLabel ? (label as string) : undefined}\n aria-describedby={\n description && !hideLabel\n ? `${toggleSwitchId}-description`\n : ariaDescribedby\n }\n checked={checked}\n ref={ref}\n />\n {label && !hideLabel && <label htmlFor={toggleSwitchId}>{label}</label>}\n {description && !hideLabel && (\n <p\n id={`${toggleSwitchId}-description`}\n className=\"tds-toggle-switch-description\"\n >\n {description}\n </p>\n )}\n </div>\n )\n }\n)\n\nToggleSwitch.displayName = \"ToggleSwitch\"\n"],"names":["React"],"mappings":";;;;AA4DA;;;;;;;;;;;;;;AAcG;AACI,MAAM,YAAY,GAAG,UAAU,CAIpC,CACE,EACE,kBAAkB,EAAE,eAAe,EACnC,OAAO,EACP,SAAS,EACT,WAAW,EACX,SAAS,GAAG,KAAK,EACjB,EAAE,EACF,KAAK,EACL,IAAI,GAAG,IAAI,EACX,GAAG,SAAS,EACa,EAC3B,GAAG,KACD;IACF,MAAM,iBAAiB,GAAG,UAAU,CAClC,mBAAmB,EACnB,IAAI,IAAI,IAAI,KAAK,IAAI,IAAI,CAAA,qBAAA,CAAuB,EAChD,SAAS,IAAI,+BAA+B,EAC5C,SAAS,CACV;AAED,IAAA,MAAM,QAAQ,GAAG,KAAK,EAAE;AACxB,IAAA,MAAM,cAAc,GAAG,EAAE,IAAI,CAAA,kBAAA,EAAqB,QAAQ,EAAE;AAE5D,IAAA,QACEA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,iBAAiB,EAAA;AAC/B,QAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,yBAAyB,EAAA,aAAA,EAAa,MAAM,EAAA,CAAO;AAClE,QAAAA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAA,GACM,SAAS,EACb,EAAE,EAAE,cAAc,EAClB,IAAI,EAAC,UAAU,EACf,IAAI,EAAC,QAAQ,EAAA,cAAA,EACC,OAAO,EAAA,YAAA,EACT,SAAS,GAAI,KAAgB,GAAG,SAAS,EAAA,kBAAA,EAEnD,WAAW,IAAI,CAAC;kBACZ,CAAA,EAAG,cAAc,CAAA,YAAA;kBACjB,eAAe,EAErB,OAAO,EAAE,OAAO,EAChB,GAAG,EAAE,GAAG,EAAA,CACR;QACD,KAAK,IAAI,CAAC,SAAS,IAAIA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAO,OAAO,EAAE,cAAc,EAAA,EAAG,KAAK,CAAS;QACtE,WAAW,IAAI,CAAC,SAAS,KACxBA,cAAA,CAAA,aAAA,CAAA,GAAA,EAAA,EACE,EAAE,EAAE,CAAA,EAAG,cAAc,cAAc,EACnC,SAAS,EAAC,+BAA+B,EAAA,EAExC,WAAW,CACV,CACL,CACG;AAEV,CAAC;AAGH,YAAY,CAAC,WAAW,GAAG,cAAc;;;;"}
|