@devslab/dds-react 0.21.1 → 0.22.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/README.ko.md +18 -0
- package/README.md +46 -0
- package/dist/calendar-view-I_sNlioP.js +145 -0
- package/dist/calendar-view-I_sNlioP.js.map +1 -0
- package/dist/calendar-view.d.ts +16 -0
- package/dist/calendar-view.d.ts.map +1 -0
- package/dist/calendar.d.ts +19 -0
- package/dist/calendar.d.ts.map +1 -0
- package/dist/calendar.js +51 -0
- package/dist/calendar.js.map +1 -0
- package/dist/choice-B3vNMfKK.js +300 -0
- package/dist/choice-B3vNMfKK.js.map +1 -0
- package/dist/choice-types.d.ts +56 -0
- package/dist/choice-types.d.ts.map +1 -0
- package/dist/combobox.d.ts +4 -0
- package/dist/combobox.d.ts.map +1 -0
- package/dist/combobox.js +13 -0
- package/dist/combobox.js.map +1 -0
- package/dist/controls-BajigKUv.js +139 -0
- package/dist/controls-BajigKUv.js.map +1 -0
- package/dist/date-only.d.ts +36 -0
- package/dist/date-only.d.ts.map +1 -0
- package/dist/date-picker.d.ts +12 -1
- package/dist/date-picker.d.ts.map +1 -1
- package/dist/date-picker.js +198 -0
- package/dist/date-picker.js.map +1 -0
- package/dist/dropdown-menu.d.ts +31 -0
- package/dist/dropdown-menu.d.ts.map +1 -0
- package/dist/dropdown-menu.js +73 -0
- package/dist/dropdown-menu.js.map +1 -0
- package/dist/index.d.ts +6 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +201 -454
- package/dist/index.js.map +1 -1
- package/dist/input.d.ts +22 -0
- package/dist/input.d.ts.map +1 -0
- package/dist/input.js +92 -0
- package/dist/input.js.map +1 -0
- package/dist/internal/choice.d.ts +5 -0
- package/dist/internal/choice.d.ts.map +1 -0
- package/dist/popover.d.ts +21 -0
- package/dist/popover.d.ts.map +1 -0
- package/dist/popover.js +49 -0
- package/dist/popover.js.map +1 -0
- package/dist/select-picker.d.ts +4 -0
- package/dist/select-picker.d.ts.map +1 -0
- package/dist/select-picker.js +13 -0
- package/dist/select-picker.js.map +1 -0
- package/package.json +46 -10
- package/styles.css +10 -1
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../src/controls.tsx","../src/selection.tsx","../src/overlays.tsx","../src/icon.tsx","../src/toast.tsx","../src/console-shell.tsx","../src/date-picker.tsx","../src/status-pill.tsx"],"sourcesContent":["import {\n forwardRef,\n useId,\n type ButtonHTMLAttributes,\n type InputHTMLAttributes,\n type SelectHTMLAttributes,\n type HTMLAttributes,\n type ReactNode,\n} from \"react\";\nimport { Field as ArkField } from \"@ark-ui/react/field\";\nimport { Checkbox as ArkCheckbox } from \"@ark-ui/react/checkbox\";\nimport { Switch as ArkSwitch } from \"@ark-ui/react/switch\";\nexport const classes = (...values: (string | false | undefined)[]) =>\n values.filter(Boolean).join(\" \");\nexport type ButtonTone = \"primary\" | \"secondary\" | \"ghost\" | \"danger\";\nexport type ControlSize = \"sm\" | \"md\" | \"lg\";\nexport interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n tone?: ButtonTone;\n size?: ControlSize;\n loading?: boolean;\n}\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n function Button(\n {\n tone = \"primary\",\n size = \"md\",\n loading,\n disabled,\n type = \"button\",\n className,\n children,\n ...rest\n },\n ref\n ) {\n return (\n <button\n {...rest}\n ref={ref}\n type={type}\n disabled={disabled || loading}\n aria-busy={loading || undefined}\n className={classes(\n \"dds-btn\",\n `dds-btn--${tone}`,\n size !== \"md\" && `dds-btn--${size}`,\n className\n )}\n >\n {loading && <span className=\"dds-spinner\" aria-hidden />}\n {children}\n </button>\n );\n }\n);\nexport interface IconButtonProps extends Omit<ButtonProps, \"tone\"> {\n \"aria-label\": string;\n tone?: \"ghost\" | \"secondary\" | \"danger\";\n}\nexport const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n function IconButton(\n {\n tone = \"ghost\",\n size = \"md\",\n loading,\n disabled,\n type = \"button\",\n className,\n children,\n ...rest\n },\n ref\n ) {\n return (\n <button\n {...rest}\n ref={ref}\n type={type}\n disabled={disabled || loading}\n aria-busy={loading || undefined}\n className={classes(\n \"dds-iconbtn\",\n tone !== \"ghost\" && `dds-iconbtn--${tone}`,\n size !== \"md\" && `dds-iconbtn--${size}`,\n className\n )}\n >\n {loading ? <span className=\"dds-spinner\" aria-hidden /> : children}\n </button>\n );\n }\n);\nexport interface FieldControlProps {\n id: string;\n \"aria-describedby\"?: string;\n \"aria-invalid\"?: true;\n \"aria-required\"?: true;\n}\nexport interface FieldProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n label: ReactNode;\n helpText?: ReactNode;\n error?: ReactNode;\n required?: boolean;\n children: ReactNode | ((props: FieldControlProps) => ReactNode);\n}\nexport const Field = forwardRef<HTMLDivElement, FieldProps>(function Field(\n {\n id: requested,\n label,\n helpText,\n error,\n required,\n className,\n children,\n ...rest\n },\n ref\n) {\n const generated = useId();\n const id = requested ?? `dds-field-${generated}`;\n const control: FieldControlProps = {\n id,\n \"aria-describedby\":\n [helpText && `${id}-help`, error && `${id}-error`]\n .filter(Boolean)\n .join(\" \") || undefined,\n \"aria-invalid\": error ? true : undefined,\n \"aria-required\": required ? true : undefined,\n };\n return (\n <ArkField.Root\n {...rest}\n ref={ref}\n invalid={Boolean(error)}\n required={required}\n id={id}\n ids={{\n control: `${id}-root`,\n helperText: `${id}-help`,\n errorText: `${id}-error`,\n }}\n className={classes(\n \"dds-field\",\n Boolean(error) && \"dds-field--error\",\n className\n )}\n >\n <ArkField.Label htmlFor={id} className=\"dds-field__label\">\n {label}\n {required && <span aria-hidden> *</span>}\n </ArkField.Label>\n {typeof children === \"function\" ? children(control) : children}\n {helpText && (\n <ArkField.HelperText className=\"dds-field__help\">\n {helpText}\n </ArkField.HelperText>\n )}\n {error && (\n <ArkField.ErrorText className=\"dds-field__error\" role=\"alert\">\n {error}\n </ArkField.ErrorText>\n )}\n </ArkField.Root>\n );\n});\nexport interface SelectProps extends SelectHTMLAttributes<HTMLSelectElement> {\n invalid?: boolean;\n wrapperClassName?: string;\n}\nexport const Select = forwardRef<HTMLSelectElement, SelectProps>(\n function Select(\n { invalid, wrapperClassName, className, children, ...rest },\n ref\n ) {\n return (\n <span className={classes(\"dds-select\", wrapperClassName)}>\n <select\n {...rest}\n ref={ref}\n className={classes(\"dds-select__input\", className)}\n aria-invalid={invalid || rest[\"aria-invalid\"]}\n >\n {children}\n </select>\n </span>\n );\n }\n);\nexport interface CheckboxProps\n extends Omit<InputHTMLAttributes<HTMLInputElement>, \"type\" | \"children\"> {\n label: ReactNode;\n onCheckedChange?: (checked: boolean) => void;\n inputClassName?: string;\n}\nexport type RadioProps = CheckboxProps;\nexport type SwitchProps = CheckboxProps;\nconst Checkable = forwardRef<\n HTMLInputElement,\n CheckboxProps & { kind: \"checkbox\" | \"switch\" }\n>(function Checkable(\n {\n kind,\n label,\n checked,\n defaultChecked,\n onCheckedChange,\n id,\n name,\n value,\n disabled,\n required,\n readOnly,\n form,\n className,\n inputClassName,\n onChange,\n ...rest\n },\n ref\n) {\n const Root = kind === \"switch\" ? ArkSwitch.Root : ArkCheckbox.Root;\n const Label = kind === \"switch\" ? ArkSwitch.Label : ArkCheckbox.Label;\n const Context = kind === \"switch\" ? ArkSwitch.Context : ArkCheckbox.Context;\n const base = kind === \"switch\" ? \"dds-switch\" : \"dds-check\";\n return (\n <Root\n checked={checked}\n defaultChecked={defaultChecked}\n onCheckedChange={(details) => onCheckedChange?.(details.checked === true)}\n ids={id ? { hiddenInput: id } : undefined}\n name={name}\n value={String(value ?? \"on\")}\n disabled={disabled}\n required={required}\n readOnly={readOnly}\n form={form}\n className={classes(base, className)}\n >\n <Context>\n {(api) => {\n // DDS styles the actual input. Keep Ark's events and state, but omit\n // its visually hidden style and use React's controlled checked prop\n // so a caller-declined change also restores the native DOM value.\n const {\n style: _,\n defaultChecked: __,\n ...inputProps\n } = api.getHiddenInputProps();\n return (\n <input\n {...inputProps}\n {...rest}\n ref={ref}\n checked={api.checked}\n role={kind === \"switch\" ? \"switch\" : undefined}\n onChange={onChange ?? (() => {})}\n onClick={(event) => {\n rest.onClick?.(event);\n if (!event.defaultPrevented) inputProps.onClick?.(event);\n }}\n className={classes(`${base}__input`, inputClassName)}\n />\n );\n }}\n </Context>\n <Label>{label}</Label>\n </Root>\n );\n});\nexport const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(\n (props, ref) => <Checkable {...props} kind=\"checkbox\" ref={ref} />\n);\nexport const Switch = forwardRef<HTMLInputElement, SwitchProps>(\n (props, ref) => <Checkable {...props} kind=\"switch\" ref={ref} />\n);\nexport const Radio = forwardRef<HTMLInputElement, RadioProps>(function Radio(\n { label, className, inputClassName, onCheckedChange, onChange, ...rest },\n ref\n) {\n return (\n <label className={classes(\"dds-check\", className)}>\n <input\n {...rest}\n ref={ref}\n type=\"radio\"\n className={classes(\"dds-check__input\", inputClassName)}\n onChange={(event) => {\n onChange?.(event);\n if (!event.defaultPrevented)\n onCheckedChange?.(event.currentTarget.checked);\n }}\n />\n <span>{label}</span>\n </label>\n );\n});\n","import { forwardRef, type ComponentProps, type ReactNode } from \"react\";\nimport { Tabs as ArkTabs, useTabsContext } from \"@ark-ui/react/tabs\";\nimport {\n RadioGroup as ArkRadioGroup,\n useRadioGroupContext,\n} from \"@ark-ui/react/radio-group\";\nimport { classes } from \"./controls\";\nexport interface TabsProps\n extends Omit<ComponentProps<typeof ArkTabs.Root>, \"onValueChange\"> {\n onValueChange?: (value: string) => void;\n unstyled?: boolean;\n}\nexport const Tabs = forwardRef<HTMLDivElement, TabsProps>(function Tabs(\n { onValueChange, unstyled, className, ...rest },\n ref\n) {\n return (\n <ArkTabs.Root\n {...rest}\n ref={ref}\n onValueChange={(details) => onValueChange?.(details.value)}\n className={classes(!unstyled && \"dds-tabs-root\", className)}\n />\n );\n});\nexport type TabProps = ComponentProps<typeof ArkTabs.Trigger> & {\n unstyled?: boolean;\n};\nexport type TabPanelProps = ComponentProps<typeof ArkTabs.Content>;\nexport const TabList = forwardRef<\n HTMLDivElement,\n ComponentProps<typeof ArkTabs.List> & { unstyled?: boolean }\n>(function TabList({ unstyled, className, ...rest }, ref) {\n return (\n <ArkTabs.List\n {...rest}\n ref={ref}\n className={classes(!unstyled && \"dds-tabs\", className)}\n />\n );\n});\nexport const Tab = forwardRef<HTMLButtonElement, TabProps>(function Tab(\n { unstyled, className, ...rest },\n ref\n) {\n return (\n <ArkTabs.Trigger\n {...rest}\n ref={ref}\n className={classes(!unstyled && \"dds-tab\", className)}\n />\n );\n});\nexport const TabPanel = forwardRef<HTMLDivElement, TabPanelProps>(\n function TabPanel({ value, style, ...rest }, ref) {\n const tabs = useTabsContext();\n const inactive = tabs.value !== value;\n return (\n <ArkTabs.Content\n {...rest}\n value={value}\n ref={ref}\n hidden={inactive}\n style={inactive ? { ...style, display: \"none\" } : style}\n />\n );\n }\n);\nfunction VisibleRadioInput({ option }: { option: RadioOption }) {\n const group = useRadioGroupContext();\n // Ark owns selection and roving focus; DDS displays the native radio.\n const {\n style: _,\n defaultChecked: __,\n ...inputProps\n } = group.getItemHiddenInputProps(option);\n return (\n <input\n {...inputProps}\n checked={group.value === option.value}\n onChange={() => {}}\n className=\"dds-check__input\"\n />\n );\n}\nexport interface RadioOption {\n value: string;\n label: ReactNode;\n disabled?: boolean;\n}\nexport interface RadioGroupProps\n extends Omit<\n ComponentProps<typeof ArkRadioGroup.Root>,\n \"onValueChange\" | \"children\"\n > {\n options: readonly RadioOption[];\n label: ReactNode;\n onValueChange?: (value: string) => void;\n children?: ReactNode;\n}\nexport const RadioGroup = forwardRef<HTMLDivElement, RadioGroupProps>(\n function RadioGroup(\n { options, label, onValueChange, className, children, ...rest },\n ref\n ) {\n return (\n <ArkRadioGroup.Root\n {...rest}\n ref={ref}\n onValueChange={(details) => {\n if (details.value !== null) onValueChange?.(details.value);\n }}\n className={classes(\"dds-radio-group\", className)}\n >\n <ArkRadioGroup.Label className=\"dds-field__label\">\n {label}\n </ArkRadioGroup.Label>\n {options.map((option) => (\n <ArkRadioGroup.Item\n key={option.value}\n value={option.value}\n disabled={option.disabled}\n className=\"dds-check\"\n >\n <VisibleRadioInput option={option} />\n <ArkRadioGroup.ItemText>{option.label}</ArkRadioGroup.ItemText>\n </ArkRadioGroup.Item>\n ))}\n {children}\n </ArkRadioGroup.Root>\n );\n }\n);\n","import {\n forwardRef,\n type ComponentProps,\n type ButtonHTMLAttributes,\n type ReactNode,\n} from \"react\";\nimport { Dialog as ArkDialog } from \"@ark-ui/react/dialog\";\nimport { Tooltip as ArkTooltip } from \"@ark-ui/react/tooltip\";\nimport { Portal } from \"@ark-ui/react/portal\";\nimport { classes } from \"./controls\";\nexport interface DialogFrameParts {\n title: ReactNode;\n description: ReactNode;\n children: ReactNode;\n actions: ReactNode;\n}\nexport interface DialogProps\n extends Omit<\n ComponentProps<typeof ArkDialog.Root>,\n \"children\" | \"onOpenChange\"\n > {\n title: ReactNode;\n description?: ReactNode;\n children: ReactNode;\n actions?: ReactNode;\n onOpenChange?: (open: boolean) => void;\n closeOnOutside?: boolean;\n portal?: boolean;\n className?: string;\n overlayClassName?: string;\n contentProps?: ComponentProps<typeof ArkDialog.Content>;\n initialFocus?: () => HTMLElement | null | undefined;\n finalFocus?: () => HTMLElement | null | undefined;\n frame?: (parts: DialogFrameParts) => ReactNode;\n unstyled?: boolean;\n}\nexport const Dialog = forwardRef<HTMLDivElement, DialogProps>(function Dialog(\n {\n title,\n description,\n children,\n actions,\n onOpenChange,\n closeOnOutside,\n portal = true,\n className,\n overlayClassName,\n contentProps,\n initialFocus,\n finalFocus,\n frame,\n unstyled,\n ...rest\n },\n ref\n) {\n const parts: DialogFrameParts = {\n title: (\n <ArkDialog.Title className={unstyled ? undefined : \"dds-dialog__title\"}>\n {title}\n </ArkDialog.Title>\n ),\n description: description && (\n <ArkDialog.Description\n className={unstyled ? undefined : \"dds-dialog__body\"}\n >\n {description}\n </ArkDialog.Description>\n ),\n children,\n actions: actions && (\n <div className={unstyled ? undefined : \"dds-dialog__actions\"}>\n {actions}\n </div>\n ),\n };\n const content = (\n <ArkDialog.Positioner\n className={classes(!unstyled && \"dds-dialog-overlay\", overlayClassName)}\n >\n <ArkDialog.Content\n {...contentProps}\n ref={ref}\n aria-describedby={\n description ? contentProps?.[\"aria-describedby\"] : undefined\n }\n className={classes(\n !unstyled && \"dds-dialog\",\n className,\n contentProps?.className\n )}\n >\n {frame ? (\n frame(parts)\n ) : (\n <>\n {parts.title}\n {parts.description}\n {children}\n {parts.actions}\n </>\n )}\n </ArkDialog.Content>\n </ArkDialog.Positioner>\n );\n return (\n <ArkDialog.Root\n {...rest}\n onOpenChange={(details) => onOpenChange?.(details.open)}\n closeOnInteractOutside={closeOnOutside ?? rest.closeOnInteractOutside}\n initialFocusEl={\n initialFocus ? () => initialFocus() ?? null : rest.initialFocusEl\n }\n finalFocusEl={finalFocus ? () => finalFocus() ?? null : rest.finalFocusEl}\n lazyMount\n unmountOnExit\n >\n {portal ? <Portal>{content}</Portal> : content}\n </ArkDialog.Root>\n );\n});\nexport type TooltipTriggerProps = ButtonHTMLAttributes<HTMLButtonElement>;\nexport interface TooltipProps\n extends Omit<\n ComponentProps<typeof ArkTooltip.Root>,\n \"children\" | \"onOpenChange\"\n > {\n content: ReactNode;\n children: ReactNode | ((props: TooltipTriggerProps) => ReactNode);\n onOpenChange?: (open: boolean) => void;\n className?: string;\n contentProps?: ComponentProps<typeof ArkTooltip.Content>;\n}\nexport function Tooltip({\n content,\n children,\n onOpenChange,\n className,\n contentProps,\n ...rest\n}: TooltipProps) {\n return (\n <ArkTooltip.Root\n openDelay={0}\n closeDelay={0}\n {...rest}\n onOpenChange={(details) => onOpenChange?.(details.open)}\n >\n <span className={classes(\"dds-tooltip\", className)}>\n {typeof children === \"function\" ? (\n <ArkTooltip.Context>\n {(api) => children(api.getTriggerProps())}\n </ArkTooltip.Context>\n ) : (\n <ArkTooltip.Trigger asChild>{children}</ArkTooltip.Trigger>\n )}\n <Portal>\n <ArkTooltip.Positioner>\n <ArkTooltip.Content\n {...contentProps}\n className={classes(\n \"dds-tooltip__bubble\",\n contentProps?.className\n )}\n >\n {content}\n </ArkTooltip.Content>\n </ArkTooltip.Positioner>\n </Portal>\n </span>\n </ArkTooltip.Root>\n );\n}\n","import { forwardRef, type SVGProps } from \"react\";\nimport { icons, directionPolicy, type DdsIconName } from \"@devslab/dds-icons\";\nimport { classes } from \"./controls\";\nexport interface IconProps\n extends Omit<SVGProps<SVGSVGElement>, \"name\" | \"children\"> {\n name: DdsIconName;\n label?: string;\n size?: number | string;\n directional?: boolean;\n}\nexport const Icon = forwardRef<SVGSVGElement, IconProps>(function Icon(\n { name, label, size = 24, directional, className, ...rest },\n ref\n) {\n const icon = icons[name];\n return (\n <svg\n {...rest}\n ref={ref}\n viewBox={icon.viewBox}\n width={size}\n height={size}\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth={icon.strokeWidth}\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n role={label ? \"img\" : undefined}\n aria-label={label}\n aria-hidden={label ? undefined : true}\n className={classes(\n (directional ?? directionPolicy.mirrorInRtl.includes(name)) &&\n directionPolicy.cssClass,\n className\n )}\n >\n {label && <title>{label}</title>}\n <g dangerouslySetInnerHTML={{ __html: icon.body }} />\n </svg>\n );\n});\n","import {\n createContext,\n useContext,\n useEffect,\n useId,\n useMemo,\n useRef,\n type ReactNode,\n} from \"react\";\nimport { Toast as ArkToast, Toaster, createToaster } from \"@ark-ui/react/toast\";\nimport { classes } from \"./controls\";\nexport type ToastTone = \"success\" | \"warning\" | \"danger\" | \"info\";\nexport interface ToastInput {\n message: ReactNode;\n tone?: ToastTone;\n duration?: number;\n}\nexport interface ToastRecord extends ToastInput {\n id: string;\n}\nexport interface ToastApi {\n show: (toast: ToastInput) => string;\n dismiss: (id: string) => void;\n clear: () => void;\n}\nexport interface ToastProviderProps {\n children: ReactNode;\n defaultDuration?: number;\n dismissLabel?: string | ((toast: ToastRecord) => string);\n regionLabel?: string;\n className?: string;\n}\nconst ToastContext = createContext<ToastApi | null>(null);\nexport function ToastProvider({\n children,\n defaultDuration = 5000,\n dismissLabel,\n regionLabel,\n className,\n}: ToastProviderProps) {\n const prefix = useId();\n const sequence = useRef(0);\n const toaster = useMemo(\n () =>\n createToaster({\n placement: \"bottom-end\",\n overlap: false,\n gap: 8,\n offsets: \"var(--dds-space-16)\",\n removeDelay: 0,\n hotkey: [\"DDS_NO_HOTKEY\"],\n }),\n []\n );\n const api = useMemo<ToastApi>(() => {\n return {\n show(input) {\n const id = `dds-toast-${prefix}-${++sequence.current}`;\n const duration = input.duration ?? defaultDuration;\n toaster.create({\n id,\n description: input.message,\n type: input.tone === \"danger\" ? \"error\" : input.tone ?? \"info\",\n duration: duration > 0 ? duration : Infinity,\n meta: { dds: { ...input, id } },\n });\n return id;\n },\n dismiss: (id) => toaster.remove(id),\n clear: () => toaster.remove(),\n };\n }, [toaster, prefix, defaultDuration]);\n useEffect(() => () => toaster.remove(), [toaster]);\n return (\n <ToastContext.Provider value={api}>\n {children}\n <Toaster\n toaster={toaster}\n label={regionLabel ?? \"\"}\n aria-label={regionLabel ?? \"\"}\n role={regionLabel ? \"region\" : \"presentation\"}\n className={classes(\"dds-toast-region\", className)}\n >\n {(toast) => {\n const record = toast.meta?.dds as ToastRecord;\n return (\n <ArkToast.Root\n className={classes(\n \"dds-toast\",\n `dds-toast--${record.tone ?? \"info\"}`\n )}\n role={record.tone === \"danger\" ? \"alert\" : \"status\"}\n >\n <ArkToast.Description>{toast.description}</ArkToast.Description>\n {dismissLabel && (\n <ArkToast.CloseTrigger\n className=\"dds-iconbtn dds-iconbtn--sm\"\n aria-label={\n typeof dismissLabel === \"function\"\n ? dismissLabel(record)\n : dismissLabel\n }\n >\n ×\n </ArkToast.CloseTrigger>\n )}\n </ArkToast.Root>\n );\n }}\n </Toaster>\n </ToastContext.Provider>\n );\n}\nexport function useToast(): ToastApi {\n const api = useContext(ToastContext);\n if (!api) throw new Error(\"useToast must be called inside <ToastProvider>\");\n return api;\n}\n","import {\n forwardRef,\n useEffect,\n useId,\n useState,\n type HTMLAttributes,\n type ReactNode,\n} from \"react\";\nimport { classes } from \"./controls\";\nexport interface ConsoleNavItem {\n id: string;\n href: string;\n label: string;\n badge?: number;\n active?: boolean;\n}\nexport interface ConsoleNavGroup {\n label: string;\n items: readonly ConsoleNavItem[];\n}\nexport interface ConsoleShellLabels {\n skip: string;\n menuOpen: string;\n menuClose: string;\n nav: string;\n badge: string;\n}\nexport interface ConsoleHeader {\n eyebrow?: string;\n title: string;\n actions?: ReactNode;\n}\nexport interface ConsoleShellProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"children\" | \"context\"> {\n surface: string;\n activePath: string;\n brand: { href: string; name: string; mark: string };\n context?: readonly { label: string; value: string }[];\n nav: readonly ConsoleNavGroup[];\n labels: ConsoleShellLabels;\n header: ConsoleHeader;\n foot?: ReactNode;\n children: ReactNode;\n}\nfunction isActive(path: string, item: ConsoleNavItem) {\n return (\n item.active ??\n (item.href.split(\"/\").filter(Boolean).length <= 1\n ? path === item.href\n : path === item.href || path.startsWith(`${item.href}/`))\n );\n}\nexport const ConsoleShell = forwardRef<HTMLDivElement, ConsoleShellProps>(\n function ConsoleShell(\n {\n surface,\n activePath,\n brand,\n context,\n nav,\n labels,\n header,\n foot,\n children,\n className,\n ...rest\n },\n ref\n ) {\n const [open, setOpen] = useState(false);\n const [hydrated, setHydrated] = useState(false);\n const id = useId();\n const railId = `dds-console-rail-${id}`;\n const mainId = `dds-console-main-${id}`;\n useEffect(() => {\n setHydrated(true);\n const onKey = (event: KeyboardEvent) => {\n if (event.key === \"Escape\") setOpen(false);\n };\n document.addEventListener(\"keydown\", onKey);\n return () => document.removeEventListener(\"keydown\", onKey);\n }, []);\n return (\n <div\n {...rest}\n ref={ref}\n className={classes(\"dds-console-shell\", className)}\n data-surface={surface}\n data-hydrated={hydrated ? \"true\" : undefined}\n >\n <a className=\"dds-console-skip dds-visually-hidden\" href={`#${mainId}`}>\n {labels.skip}\n </a>\n <button\n className=\"dds-console-rail__toggle\"\n type=\"button\"\n data-action=\"toggle-rail\"\n aria-controls={railId}\n aria-expanded={open}\n onClick={() => setOpen(!open)}\n >\n <span aria-hidden />\n <span className=\"dds-visually-hidden\">\n {open ? labels.menuClose : labels.menuOpen}\n </span>\n </button>\n <div\n className=\"dds-console-rail__scrim\"\n data-open={String(open)}\n onClick={() => setOpen(false)}\n />\n <aside\n id={railId}\n className=\"dds-console-rail\"\n data-open={String(open)}\n >\n <a className=\"dds-console-rail__brand\" href={brand.href}>\n <img src={brand.mark} alt=\"\" width={20} height={20} />\n <strong>{brand.name}</strong>\n </a>\n {context && context.length > 0 && (\n <dl className=\"dds-console-rail__context\">\n {context.map((row, index) => (\n <div key={index}>\n <dt>{row.label}</dt>\n <dd>{row.value}</dd>\n </div>\n ))}\n </dl>\n )}\n <nav className=\"dds-console-rail__nav\" aria-label={labels.nav}>\n {nav.map((group, index) => (\n <section\n key={index}\n className=\"dds-console-rail__group\"\n aria-labelledby={`${id}-group-${index}`}\n >\n <h2\n id={`${id}-group-${index}`}\n className=\"dds-console-rail__group-label\"\n >\n {group.label}\n </h2>\n <ul>\n {group.items.map((item) => (\n <li key={item.id}>\n <a\n className=\"dds-console-rail__item\"\n data-nav={`${surface}.${item.id}`}\n href={item.href}\n aria-current={\n isActive(activePath, item) ? \"page\" : undefined\n }\n onClick={() => setOpen(false)}\n >\n <span>{item.label}</span>\n {item.badge !== undefined && item.badge > 0 && (\n <span\n className=\"dds-console-rail__badge\"\n aria-label={labels.badge.replace(\"{count}\", () =>\n String(item.badge)\n )}\n >\n {item.badge}\n </span>\n )}\n </a>\n </li>\n ))}\n </ul>\n </section>\n ))}\n </nav>\n {foot && <div className=\"dds-console-rail__foot\">{foot}</div>}\n </aside>\n <main id={mainId} className=\"dds-console-main\" tabIndex={-1}>\n <header className=\"dds-console-page-header\">\n <div className=\"dds-console-page-header__text\">\n {header.eyebrow && (\n <p className=\"dds-console-page-eyebrow\">{header.eyebrow}</p>\n )}\n <h1>{header.title}</h1>\n </div>\n {header.actions && (\n <div className=\"dds-console-page-header__actions\">\n {header.actions}\n </div>\n )}\n </header>\n {children}\n </main>\n </div>\n );\n }\n);\n","import {DatePicker as ArkDatePicker,parseDate} from '@ark-ui/react/date-picker';\nimport {Portal} from '@ark-ui/react/portal';\nimport {Button,Field} from './controls';\n\nexport interface DatePickerProps {\n label:string;\n /** ISO calendar date (YYYY-MM-DD), or an empty string. */\n value:string;\n onChange:(value:string)=>void;\n locale?:string;\n timeZone?:string;\n disabled?:boolean;\n min?:string;\n max?:string;\n}\nfunction CalendarIcon(){return <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.5\" aria-hidden=\"true\"><rect x=\"3.5\" y=\"5.5\" width=\"17\" height=\"15\" rx=\"2\"/><path d=\"M7.5 3v5M16.5 3v5M3.5 10.5h17\"/></svg>;}\nfunction Chevron({next=false}:{next?:boolean}){return <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.5\" aria-hidden=\"true\"><path d={next?'m9 5 7 7-7 7':'m15 5-7 7 7 7'}/></svg>;}\n\n\nexport function DatePicker({label,value,onChange,locale='ko-KR',timeZone='Asia/Seoul',disabled=false,min,max}:DatePickerProps){\n return (\n <Field label={label}>\n {control=><ArkDatePicker.Root locale={locale} timeZone={timeZone} disabled={disabled} min={min?parseDate(min):undefined} max={max?parseDate(max):undefined} startOfWeek={0} minView=\"day\" maxView=\"day\" fixedWeeks translations={{dayCell:state=>`${state.valueText} 선택`,clearTrigger:'선택 날짜 지우기'}} value={value?[parseDate(value)]:[]} format={v=>v.toString()} onValueChange={details=>onChange(details.valueAsString[0]||'')} positioning={{placement:'bottom-start',gutter:8}}>\n <ArkDatePicker.Control className=\"dds-date-picker-control\">\n <ArkDatePicker.Input {...control} placeholder=\"YYYY-MM-DD\" autoComplete=\"off\"/>\n <ArkDatePicker.Trigger asChild><Button type=\"button\" tone=\"secondary\" aria-label={`${label} 달력 열기`}><CalendarIcon/></Button></ArkDatePicker.Trigger>\n </ArkDatePicker.Control>\n <Portal><ArkDatePicker.Positioner className=\"dds-date-picker-positioner\"><ArkDatePicker.Content className=\"dds-date-picker-content\" aria-label={`${label} 날짜 선택`}>\n <ArkDatePicker.View view=\"day\">\n <ArkDatePicker.Context>{picker=><>\n <ArkDatePicker.ViewControl className=\"dds-date-picker-header\">\n <ArkDatePicker.PrevTrigger asChild><Button type=\"button\" tone=\"secondary\" aria-label=\"이전 달\"><Chevron/></Button></ArkDatePicker.PrevTrigger>\n <ArkDatePicker.RangeText/>\n <ArkDatePicker.NextTrigger asChild><Button type=\"button\" tone=\"secondary\" aria-label=\"다음 달\"><Chevron next/></Button></ArkDatePicker.NextTrigger>\n </ArkDatePicker.ViewControl>\n <ArkDatePicker.Table className=\"dds-date-picker-table\">\n <ArkDatePicker.TableHead><ArkDatePicker.TableRow>{picker.weekDays.map((day,index)=><ArkDatePicker.TableHeader key={index}>{day.short}</ArkDatePicker.TableHeader>)}</ArkDatePicker.TableRow></ArkDatePicker.TableHead>\n <ArkDatePicker.TableBody>{picker.weeks.map((week,index)=><ArkDatePicker.TableRow key={index}>{week.map(day=><ArkDatePicker.TableCell key={day.toString()} value={day}><ArkDatePicker.TableCellTrigger>{day.day}</ArkDatePicker.TableCellTrigger></ArkDatePicker.TableCell>)}</ArkDatePicker.TableRow>)}</ArkDatePicker.TableBody>\n </ArkDatePicker.Table>\n <div className=\"dds-date-picker-footer\"><Button type=\"button\" tone=\"secondary\" onClick={()=>picker.selectToday()}>오늘</Button><ArkDatePicker.ClearTrigger asChild><Button type=\"button\" tone=\"secondary\">지우기</Button></ArkDatePicker.ClearTrigger></div>\n </>}</ArkDatePicker.Context>\n </ArkDatePicker.View>\n </ArkDatePicker.Content></ArkDatePicker.Positioner></Portal>\n </ArkDatePicker.Root>}\n </Field>\n );\n}\n","export type StatusTone = \"success\" | \"warning\" | \"danger\" | \"info\" | \"brand\" | \"neutral\";\nexport function createStatusPill<D extends string>(config:{\n tones:Record<D,Record<string,StatusTone>>;\n label:(domain:D,value:string,locale:string)=>string|undefined;\n openDomains?:readonly NoInfer<D>[];\n}){\n const open=new Set<string>(config.openDomains??[]);\n return function StatusPill(props:{domain:D;value:string;locale:string}){\n const tone=config.tones[props.domain]?.[props.value];\n const label=config.label(props.domain,props.value,props.locale);\n if(!tone||!label){\n if(open.has(props.domain))return <code data-status={`${props.domain}.${props.value}`}>{props.value}</code>;\n throw new Error(!tone?`StatusPill: no tone for ${props.domain}.${props.value}`:`StatusPill: no label for ${props.domain}.${props.value}`);\n }\n return <span className={tone==='neutral'?'dds-badge':`dds-badge dds-badge--${tone}`} data-status={`${props.domain}.${props.value}`} data-tone={tone}>{label}</span>;\n };\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../src/selection.tsx","../src/overlays.tsx","../src/icon.tsx","../src/toast.tsx","../src/console-shell.tsx","../src/status-pill.tsx"],"sourcesContent":["import { forwardRef, type ComponentProps, type ReactNode } from \"react\";\nimport { Tabs as ArkTabs, useTabsContext } from \"@ark-ui/react/tabs\";\nimport {\n RadioGroup as ArkRadioGroup,\n useRadioGroupContext,\n} from \"@ark-ui/react/radio-group\";\nimport { classes } from \"./controls\";\nexport interface TabsProps\n extends Omit<ComponentProps<typeof ArkTabs.Root>, \"onValueChange\"> {\n onValueChange?: (value: string) => void;\n unstyled?: boolean;\n}\nexport const Tabs = forwardRef<HTMLDivElement, TabsProps>(function Tabs(\n { onValueChange, unstyled, className, ...rest },\n ref\n) {\n return (\n <ArkTabs.Root\n {...rest}\n ref={ref}\n onValueChange={(details) => onValueChange?.(details.value)}\n className={classes(!unstyled && \"dds-tabs-root\", className)}\n />\n );\n});\nexport type TabProps = ComponentProps<typeof ArkTabs.Trigger> & {\n unstyled?: boolean;\n};\nexport type TabPanelProps = ComponentProps<typeof ArkTabs.Content>;\nexport const TabList = forwardRef<\n HTMLDivElement,\n ComponentProps<typeof ArkTabs.List> & { unstyled?: boolean }\n>(function TabList({ unstyled, className, ...rest }, ref) {\n return (\n <ArkTabs.List\n {...rest}\n ref={ref}\n className={classes(!unstyled && \"dds-tabs\", className)}\n />\n );\n});\nexport const Tab = forwardRef<HTMLButtonElement, TabProps>(function Tab(\n { unstyled, className, ...rest },\n ref\n) {\n return (\n <ArkTabs.Trigger\n {...rest}\n ref={ref}\n className={classes(!unstyled && \"dds-tab\", className)}\n />\n );\n});\nexport const TabPanel = forwardRef<HTMLDivElement, TabPanelProps>(\n function TabPanel({ value, style, ...rest }, ref) {\n const tabs = useTabsContext();\n const inactive = tabs.value !== value;\n return (\n <ArkTabs.Content\n {...rest}\n value={value}\n ref={ref}\n hidden={inactive}\n style={inactive ? { ...style, display: \"none\" } : style}\n />\n );\n }\n);\nfunction VisibleRadioInput({ option }: { option: RadioOption }) {\n const group = useRadioGroupContext();\n // Ark owns selection and roving focus; DDS displays the native radio.\n const {\n style: _,\n defaultChecked: __,\n ...inputProps\n } = group.getItemHiddenInputProps(option);\n return (\n <input\n {...inputProps}\n checked={group.value === option.value}\n onChange={() => {}}\n className=\"dds-check__input\"\n />\n );\n}\nexport interface RadioOption {\n value: string;\n label: ReactNode;\n disabled?: boolean;\n}\nexport interface RadioGroupProps\n extends Omit<\n ComponentProps<typeof ArkRadioGroup.Root>,\n \"onValueChange\" | \"children\"\n > {\n options: readonly RadioOption[];\n label: ReactNode;\n onValueChange?: (value: string) => void;\n children?: ReactNode;\n}\nexport const RadioGroup = forwardRef<HTMLDivElement, RadioGroupProps>(\n function RadioGroup(\n { options, label, onValueChange, className, children, ...rest },\n ref\n ) {\n return (\n <ArkRadioGroup.Root\n {...rest}\n ref={ref}\n onValueChange={(details) => {\n if (details.value !== null) onValueChange?.(details.value);\n }}\n className={classes(\"dds-radio-group\", className)}\n >\n <ArkRadioGroup.Label className=\"dds-field__label\">\n {label}\n </ArkRadioGroup.Label>\n {options.map((option) => (\n <ArkRadioGroup.Item\n key={option.value}\n value={option.value}\n disabled={option.disabled}\n className=\"dds-check\"\n >\n <VisibleRadioInput option={option} />\n <ArkRadioGroup.ItemText>{option.label}</ArkRadioGroup.ItemText>\n </ArkRadioGroup.Item>\n ))}\n {children}\n </ArkRadioGroup.Root>\n );\n }\n);\n","import {\n forwardRef,\n type ComponentProps,\n type ButtonHTMLAttributes,\n type ReactNode,\n} from \"react\";\nimport { Dialog as ArkDialog } from \"@ark-ui/react/dialog\";\nimport { Tooltip as ArkTooltip } from \"@ark-ui/react/tooltip\";\nimport { Portal } from \"@ark-ui/react/portal\";\nimport { classes } from \"./controls\";\nexport interface DialogFrameParts {\n title: ReactNode;\n description: ReactNode;\n children: ReactNode;\n actions: ReactNode;\n}\nexport interface DialogProps\n extends Omit<\n ComponentProps<typeof ArkDialog.Root>,\n \"children\" | \"onOpenChange\"\n > {\n title: ReactNode;\n description?: ReactNode;\n children: ReactNode;\n actions?: ReactNode;\n onOpenChange?: (open: boolean) => void;\n closeOnOutside?: boolean;\n portal?: boolean;\n className?: string;\n overlayClassName?: string;\n contentProps?: ComponentProps<typeof ArkDialog.Content>;\n initialFocus?: () => HTMLElement | null | undefined;\n finalFocus?: () => HTMLElement | null | undefined;\n frame?: (parts: DialogFrameParts) => ReactNode;\n unstyled?: boolean;\n}\nexport const Dialog = forwardRef<HTMLDivElement, DialogProps>(function Dialog(\n {\n title,\n description,\n children,\n actions,\n onOpenChange,\n closeOnOutside,\n portal = true,\n className,\n overlayClassName,\n contentProps,\n initialFocus,\n finalFocus,\n frame,\n unstyled,\n ...rest\n },\n ref\n) {\n const parts: DialogFrameParts = {\n title: (\n <ArkDialog.Title className={unstyled ? undefined : \"dds-dialog__title\"}>\n {title}\n </ArkDialog.Title>\n ),\n description: description && (\n <ArkDialog.Description\n className={unstyled ? undefined : \"dds-dialog__body\"}\n >\n {description}\n </ArkDialog.Description>\n ),\n children,\n actions: actions && (\n <div className={unstyled ? undefined : \"dds-dialog__actions\"}>\n {actions}\n </div>\n ),\n };\n const content = (\n <ArkDialog.Positioner\n className={classes(!unstyled && \"dds-dialog-overlay\", overlayClassName)}\n >\n <ArkDialog.Content\n {...contentProps}\n ref={ref}\n aria-describedby={\n description ? contentProps?.[\"aria-describedby\"] : undefined\n }\n className={classes(\n !unstyled && \"dds-dialog\",\n className,\n contentProps?.className\n )}\n >\n {frame ? (\n frame(parts)\n ) : (\n <>\n {parts.title}\n {parts.description}\n {children}\n {parts.actions}\n </>\n )}\n </ArkDialog.Content>\n </ArkDialog.Positioner>\n );\n return (\n <ArkDialog.Root\n {...rest}\n onOpenChange={(details) => onOpenChange?.(details.open)}\n closeOnInteractOutside={closeOnOutside ?? rest.closeOnInteractOutside}\n initialFocusEl={\n initialFocus ? () => initialFocus() ?? null : rest.initialFocusEl\n }\n finalFocusEl={finalFocus ? () => finalFocus() ?? null : rest.finalFocusEl}\n lazyMount\n unmountOnExit\n >\n {portal ? <Portal>{content}</Portal> : content}\n </ArkDialog.Root>\n );\n});\nexport type TooltipTriggerProps = ButtonHTMLAttributes<HTMLButtonElement>;\nexport interface TooltipProps\n extends Omit<\n ComponentProps<typeof ArkTooltip.Root>,\n \"children\" | \"onOpenChange\"\n > {\n content: ReactNode;\n children: ReactNode | ((props: TooltipTriggerProps) => ReactNode);\n onOpenChange?: (open: boolean) => void;\n className?: string;\n contentProps?: ComponentProps<typeof ArkTooltip.Content>;\n}\nexport function Tooltip({\n content,\n children,\n onOpenChange,\n className,\n contentProps,\n ...rest\n}: TooltipProps) {\n return (\n <ArkTooltip.Root\n openDelay={0}\n closeDelay={0}\n {...rest}\n onOpenChange={(details) => onOpenChange?.(details.open)}\n >\n <span className={classes(\"dds-tooltip\", className)}>\n {typeof children === \"function\" ? (\n <ArkTooltip.Context>\n {(api) => children(api.getTriggerProps())}\n </ArkTooltip.Context>\n ) : (\n <ArkTooltip.Trigger asChild>{children}</ArkTooltip.Trigger>\n )}\n <Portal>\n <ArkTooltip.Positioner>\n <ArkTooltip.Content\n {...contentProps}\n className={classes(\n \"dds-tooltip__bubble\",\n contentProps?.className\n )}\n >\n {content}\n </ArkTooltip.Content>\n </ArkTooltip.Positioner>\n </Portal>\n </span>\n </ArkTooltip.Root>\n );\n}\n","import { forwardRef, type SVGProps } from \"react\";\nimport { icons, directionPolicy, type DdsIconName } from \"@devslab/dds-icons\";\nimport { classes } from \"./controls\";\nexport interface IconProps\n extends Omit<SVGProps<SVGSVGElement>, \"name\" | \"children\"> {\n name: DdsIconName;\n label?: string;\n size?: number | string;\n directional?: boolean;\n}\nexport const Icon = forwardRef<SVGSVGElement, IconProps>(function Icon(\n { name, label, size = 24, directional, className, ...rest },\n ref\n) {\n const icon = icons[name];\n return (\n <svg\n {...rest}\n ref={ref}\n viewBox={icon.viewBox}\n width={size}\n height={size}\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth={icon.strokeWidth}\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n role={label ? \"img\" : undefined}\n aria-label={label}\n aria-hidden={label ? undefined : true}\n className={classes(\n (directional ?? directionPolicy.mirrorInRtl.includes(name)) &&\n directionPolicy.cssClass,\n className\n )}\n >\n {label && <title>{label}</title>}\n <g dangerouslySetInnerHTML={{ __html: icon.body }} />\n </svg>\n );\n});\n","import {\n createContext,\n useContext,\n useEffect,\n useId,\n useMemo,\n useRef,\n type ReactNode,\n} from \"react\";\nimport { Toast as ArkToast, Toaster, createToaster } from \"@ark-ui/react/toast\";\nimport { classes } from \"./controls\";\nexport type ToastTone = \"success\" | \"warning\" | \"danger\" | \"info\";\nexport interface ToastInput {\n message: ReactNode;\n tone?: ToastTone;\n duration?: number;\n}\nexport interface ToastRecord extends ToastInput {\n id: string;\n}\nexport interface ToastApi {\n show: (toast: ToastInput) => string;\n dismiss: (id: string) => void;\n clear: () => void;\n}\nexport interface ToastProviderProps {\n children: ReactNode;\n defaultDuration?: number;\n dismissLabel?: string | ((toast: ToastRecord) => string);\n regionLabel?: string;\n className?: string;\n}\nconst ToastContext = createContext<ToastApi | null>(null);\nexport function ToastProvider({\n children,\n defaultDuration = 5000,\n dismissLabel,\n regionLabel,\n className,\n}: ToastProviderProps) {\n const prefix = useId();\n const sequence = useRef(0);\n const toaster = useMemo(\n () =>\n createToaster({\n placement: \"bottom-end\",\n overlap: false,\n gap: 8,\n offsets: \"var(--dds-space-16)\",\n removeDelay: 0,\n hotkey: [\"DDS_NO_HOTKEY\"],\n }),\n []\n );\n const api = useMemo<ToastApi>(() => {\n return {\n show(input) {\n const id = `dds-toast-${prefix}-${++sequence.current}`;\n const duration = input.duration ?? defaultDuration;\n toaster.create({\n id,\n description: input.message,\n type: input.tone === \"danger\" ? \"error\" : input.tone ?? \"info\",\n duration: duration > 0 ? duration : Infinity,\n meta: { dds: { ...input, id } },\n });\n return id;\n },\n dismiss: (id) => toaster.remove(id),\n clear: () => toaster.remove(),\n };\n }, [toaster, prefix, defaultDuration]);\n useEffect(() => () => toaster.remove(), [toaster]);\n return (\n <ToastContext.Provider value={api}>\n {children}\n <Toaster\n toaster={toaster}\n label={regionLabel ?? \"\"}\n aria-label={regionLabel ?? \"\"}\n role={regionLabel ? \"region\" : \"presentation\"}\n className={classes(\"dds-toast-region\", className)}\n >\n {(toast) => {\n const record = toast.meta?.dds as ToastRecord;\n return (\n <ArkToast.Root\n className={classes(\n \"dds-toast\",\n `dds-toast--${record.tone ?? \"info\"}`\n )}\n role={record.tone === \"danger\" ? \"alert\" : \"status\"}\n >\n <ArkToast.Description>{toast.description}</ArkToast.Description>\n {dismissLabel && (\n <ArkToast.CloseTrigger\n className=\"dds-iconbtn dds-iconbtn--sm\"\n aria-label={\n typeof dismissLabel === \"function\"\n ? dismissLabel(record)\n : dismissLabel\n }\n >\n ×\n </ArkToast.CloseTrigger>\n )}\n </ArkToast.Root>\n );\n }}\n </Toaster>\n </ToastContext.Provider>\n );\n}\nexport function useToast(): ToastApi {\n const api = useContext(ToastContext);\n if (!api) throw new Error(\"useToast must be called inside <ToastProvider>\");\n return api;\n}\n","import {\n forwardRef,\n useEffect,\n useId,\n useState,\n type HTMLAttributes,\n type ReactNode,\n} from \"react\";\nimport { classes } from \"./controls\";\nexport interface ConsoleNavItem {\n id: string;\n href: string;\n label: string;\n badge?: number;\n active?: boolean;\n}\nexport interface ConsoleNavGroup {\n label: string;\n items: readonly ConsoleNavItem[];\n}\nexport interface ConsoleShellLabels {\n skip: string;\n menuOpen: string;\n menuClose: string;\n nav: string;\n badge: string;\n}\nexport interface ConsoleHeader {\n eyebrow?: string;\n title: string;\n actions?: ReactNode;\n}\nexport interface ConsoleShellProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"children\" | \"context\"> {\n surface: string;\n activePath: string;\n brand: { href: string; name: string; mark: string };\n context?: readonly { label: string; value: string }[];\n nav: readonly ConsoleNavGroup[];\n labels: ConsoleShellLabels;\n header: ConsoleHeader;\n foot?: ReactNode;\n children: ReactNode;\n}\nfunction isActive(path: string, item: ConsoleNavItem) {\n return (\n item.active ??\n (item.href.split(\"/\").filter(Boolean).length <= 1\n ? path === item.href\n : path === item.href || path.startsWith(`${item.href}/`))\n );\n}\nexport const ConsoleShell = forwardRef<HTMLDivElement, ConsoleShellProps>(\n function ConsoleShell(\n {\n surface,\n activePath,\n brand,\n context,\n nav,\n labels,\n header,\n foot,\n children,\n className,\n ...rest\n },\n ref\n ) {\n const [open, setOpen] = useState(false);\n const [hydrated, setHydrated] = useState(false);\n const id = useId();\n const railId = `dds-console-rail-${id}`;\n const mainId = `dds-console-main-${id}`;\n useEffect(() => {\n setHydrated(true);\n const onKey = (event: KeyboardEvent) => {\n if (event.key === \"Escape\") setOpen(false);\n };\n document.addEventListener(\"keydown\", onKey);\n return () => document.removeEventListener(\"keydown\", onKey);\n }, []);\n return (\n <div\n {...rest}\n ref={ref}\n className={classes(\"dds-console-shell\", className)}\n data-surface={surface}\n data-hydrated={hydrated ? \"true\" : undefined}\n >\n <a className=\"dds-console-skip dds-visually-hidden\" href={`#${mainId}`}>\n {labels.skip}\n </a>\n <button\n className=\"dds-console-rail__toggle\"\n type=\"button\"\n data-action=\"toggle-rail\"\n aria-controls={railId}\n aria-expanded={open}\n onClick={() => setOpen(!open)}\n >\n <span aria-hidden />\n <span className=\"dds-visually-hidden\">\n {open ? labels.menuClose : labels.menuOpen}\n </span>\n </button>\n <div\n className=\"dds-console-rail__scrim\"\n data-open={String(open)}\n onClick={() => setOpen(false)}\n />\n <aside\n id={railId}\n className=\"dds-console-rail\"\n data-open={String(open)}\n >\n <a className=\"dds-console-rail__brand\" href={brand.href}>\n <img src={brand.mark} alt=\"\" width={20} height={20} />\n <strong>{brand.name}</strong>\n </a>\n {context && context.length > 0 && (\n <dl className=\"dds-console-rail__context\">\n {context.map((row, index) => (\n <div key={index}>\n <dt>{row.label}</dt>\n <dd>{row.value}</dd>\n </div>\n ))}\n </dl>\n )}\n <nav className=\"dds-console-rail__nav\" aria-label={labels.nav}>\n {nav.map((group, index) => (\n <section\n key={index}\n className=\"dds-console-rail__group\"\n aria-labelledby={`${id}-group-${index}`}\n >\n <h2\n id={`${id}-group-${index}`}\n className=\"dds-console-rail__group-label\"\n >\n {group.label}\n </h2>\n <ul>\n {group.items.map((item) => (\n <li key={item.id}>\n <a\n className=\"dds-console-rail__item\"\n data-nav={`${surface}.${item.id}`}\n href={item.href}\n aria-current={\n isActive(activePath, item) ? \"page\" : undefined\n }\n onClick={() => setOpen(false)}\n >\n <span>{item.label}</span>\n {item.badge !== undefined && item.badge > 0 && (\n <span\n className=\"dds-console-rail__badge\"\n aria-label={labels.badge.replace(\"{count}\", () =>\n String(item.badge)\n )}\n >\n {item.badge}\n </span>\n )}\n </a>\n </li>\n ))}\n </ul>\n </section>\n ))}\n </nav>\n {foot && <div className=\"dds-console-rail__foot\">{foot}</div>}\n </aside>\n <main id={mainId} className=\"dds-console-main\" tabIndex={-1}>\n <header className=\"dds-console-page-header\">\n <div className=\"dds-console-page-header__text\">\n {header.eyebrow && (\n <p className=\"dds-console-page-eyebrow\">{header.eyebrow}</p>\n )}\n <h1>{header.title}</h1>\n </div>\n {header.actions && (\n <div className=\"dds-console-page-header__actions\">\n {header.actions}\n </div>\n )}\n </header>\n {children}\n </main>\n </div>\n );\n }\n);\n","export type StatusTone = \"success\" | \"warning\" | \"danger\" | \"info\" | \"brand\" | \"neutral\";\nexport function createStatusPill<D extends string>(config:{\n tones:Record<D,Record<string,StatusTone>>;\n label:(domain:D,value:string,locale:string)=>string|undefined;\n openDomains?:readonly NoInfer<D>[];\n}){\n const open=new Set<string>(config.openDomains??[]);\n return function StatusPill(props:{domain:D;value:string;locale:string}){\n const tone=config.tones[props.domain]?.[props.value];\n const label=config.label(props.domain,props.value,props.locale);\n if(!tone||!label){\n if(open.has(props.domain))return <code data-status={`${props.domain}.${props.value}`}>{props.value}</code>;\n throw new Error(!tone?`StatusPill: no tone for ${props.domain}.${props.value}`:`StatusPill: no label for ${props.domain}.${props.value}`);\n }\n return <span className={tone==='neutral'?'dds-badge':`dds-badge dds-badge--${tone}`} data-status={`${props.domain}.${props.value}`} data-tone={tone}>{label}</span>;\n };\n}\n"],"mappings":"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"}
|
package/dist/input.d.ts
ADDED
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { type HTMLAttributes, type InputHTMLAttributes, type ReactNode } from "react";
|
|
2
|
+
export type LabelPlacement = "outside" | "inside" | "hidden";
|
|
3
|
+
export interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "value" | "defaultValue" | "children"> {
|
|
4
|
+
type?: "text" | "search" | "email" | "tel" | "url" | "password" | "number";
|
|
5
|
+
value?: string;
|
|
6
|
+
defaultValue?: string;
|
|
7
|
+
onValueChange?: (next: string) => void;
|
|
8
|
+
label?: ReactNode;
|
|
9
|
+
labelPlacement?: LabelPlacement;
|
|
10
|
+
clearable?: boolean;
|
|
11
|
+
clearLabel?: string;
|
|
12
|
+
wrapperClassName?: string;
|
|
13
|
+
}
|
|
14
|
+
/** A native text input. Supply label, aria-label, or aria-labelledby. */
|
|
15
|
+
export declare const Input: import("react").ForwardRefExoticComponent<InputProps & import("react").RefAttributes<HTMLInputElement>>;
|
|
16
|
+
export interface InputGroupProps extends HTMLAttributes<HTMLDivElement> {
|
|
17
|
+
start?: ReactNode;
|
|
18
|
+
end?: ReactNode;
|
|
19
|
+
}
|
|
20
|
+
/** Layout only: the child Input owns its value and accessible name. */
|
|
21
|
+
export declare const InputGroup: import("react").ForwardRefExoticComponent<InputGroupProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
22
|
+
//# sourceMappingURL=input.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../src/input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAML,KAAK,cAAc,EACnB,KAAK,mBAAmB,EACxB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,MAAM,MAAM,cAAc,GAAG,SAAS,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAC7D,MAAM,WAAW,UACf,SAAQ,IAAI,CACV,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,MAAM,GAAG,OAAO,GAAG,cAAc,GAAG,UAAU,CAC/C;IACD,IAAI,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,KAAK,GAAG,KAAK,GAAG,UAAU,GAAG,QAAQ,CAAC;IAC3E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED,yEAAyE;AACzE,eAAO,MAAM,KAAK,yGA8GhB,CAAC;AAEH,MAAM,WAAW,eAAgB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACrE,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,GAAG,CAAC,EAAE,SAAS,CAAC;CACjB;AACD,uEAAuE;AACvE,eAAO,MAAM,UAAU,4GAgBtB,CAAC"}
|
package/dist/input.js
ADDED
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
import { c as e } from "./controls-BajigKUv.js";
|
|
2
|
+
import { forwardRef as t, useEffect as n, useId as r, useRef as i, useState as a } from "react";
|
|
3
|
+
import { jsx as o, jsxs as s } from "react/jsx-runtime";
|
|
4
|
+
//#region src/input.tsx
|
|
5
|
+
var c = t(function({ value: t, defaultValue: c = "", onValueChange: l, label: u, labelPlacement: d = "outside", clearable: f, clearLabel: p = "내용 지우기", wrapperClassName: m, className: h, id: g, type: _ = "text", onChange: v, onKeyDown: y, disabled: b, readOnly: x, ...S }, C) {
|
|
6
|
+
let w = r(), T = g ?? `dds-input-${w}`, E = i(null), D = i(c), [O, k] = a(c), A = t ?? O, j = t !== void 0, M = i({
|
|
7
|
+
controlled: j,
|
|
8
|
+
current: A
|
|
9
|
+
});
|
|
10
|
+
M.current = {
|
|
11
|
+
controlled: j,
|
|
12
|
+
current: A
|
|
13
|
+
}, n(() => {
|
|
14
|
+
let e = E.current;
|
|
15
|
+
if (!e) return;
|
|
16
|
+
e.defaultValue = D.current;
|
|
17
|
+
let t = (t) => queueMicrotask(() => {
|
|
18
|
+
t.defaultPrevented || (M.current.controlled ? e.value = M.current.current : (e.value = D.current, k(D.current)));
|
|
19
|
+
}), n = e.form;
|
|
20
|
+
return n?.addEventListener("reset", t), () => n?.removeEventListener("reset", t);
|
|
21
|
+
}, [S.form]);
|
|
22
|
+
let N = (e) => {
|
|
23
|
+
b || x || (j || k(e), l?.(e));
|
|
24
|
+
};
|
|
25
|
+
return /* @__PURE__ */ s("span", {
|
|
26
|
+
className: e("dds-input", m),
|
|
27
|
+
"data-label-placement": d,
|
|
28
|
+
"data-filled": A.length > 0 ? "" : void 0,
|
|
29
|
+
"data-disabled": b ? "" : void 0,
|
|
30
|
+
"data-readonly": x ? "" : void 0,
|
|
31
|
+
children: [
|
|
32
|
+
u != null && /* @__PURE__ */ o("label", {
|
|
33
|
+
htmlFor: T,
|
|
34
|
+
className: "dds-input__label",
|
|
35
|
+
children: u
|
|
36
|
+
}),
|
|
37
|
+
/* @__PURE__ */ o("input", {
|
|
38
|
+
...S,
|
|
39
|
+
id: T,
|
|
40
|
+
type: _,
|
|
41
|
+
disabled: b,
|
|
42
|
+
readOnly: x,
|
|
43
|
+
ref: (e) => {
|
|
44
|
+
E.current = e, typeof C == "function" ? C(e) : C && (C.current = e);
|
|
45
|
+
},
|
|
46
|
+
className: e("dds-input__control", h),
|
|
47
|
+
value: A,
|
|
48
|
+
onChange: (e) => {
|
|
49
|
+
v?.(e), N(e.currentTarget.value);
|
|
50
|
+
},
|
|
51
|
+
onKeyDown: (e) => {
|
|
52
|
+
y?.(e), e.key === "Enter" && (e.nativeEvent.isComposing || e.keyCode === 229) && e.preventDefault();
|
|
53
|
+
}
|
|
54
|
+
}),
|
|
55
|
+
f && A.length > 0 && !b && !x && /* @__PURE__ */ o("button", {
|
|
56
|
+
type: "button",
|
|
57
|
+
className: "dds-input__clear",
|
|
58
|
+
"aria-label": p,
|
|
59
|
+
onPointerDown: (e) => e.preventDefault(),
|
|
60
|
+
onMouseDown: (e) => e.preventDefault(),
|
|
61
|
+
onClick: () => {
|
|
62
|
+
N(""), E.current?.focus();
|
|
63
|
+
},
|
|
64
|
+
children: /* @__PURE__ */ o("span", {
|
|
65
|
+
"aria-hidden": "true",
|
|
66
|
+
children: "×"
|
|
67
|
+
})
|
|
68
|
+
})
|
|
69
|
+
]
|
|
70
|
+
});
|
|
71
|
+
}), l = t(function({ start: t, end: n, className: r, children: i, ...a }, c) {
|
|
72
|
+
return /* @__PURE__ */ s("div", {
|
|
73
|
+
...a,
|
|
74
|
+
ref: c,
|
|
75
|
+
className: e("dds-input-group", r),
|
|
76
|
+
children: [
|
|
77
|
+
t != null && /* @__PURE__ */ o("span", {
|
|
78
|
+
className: "dds-input-group__start",
|
|
79
|
+
children: t
|
|
80
|
+
}),
|
|
81
|
+
i,
|
|
82
|
+
n != null && /* @__PURE__ */ o("span", {
|
|
83
|
+
className: "dds-input-group__end",
|
|
84
|
+
children: n
|
|
85
|
+
})
|
|
86
|
+
]
|
|
87
|
+
});
|
|
88
|
+
});
|
|
89
|
+
//#endregion
|
|
90
|
+
export { c as Input, l as InputGroup };
|
|
91
|
+
|
|
92
|
+
//# sourceMappingURL=input.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"input.js","names":[],"sources":["../src/input.tsx"],"sourcesContent":["import {\n forwardRef,\n useEffect,\n useId,\n useRef,\n useState,\n type HTMLAttributes,\n type InputHTMLAttributes,\n type ReactNode,\n} from \"react\";\nimport { classes } from \"./controls\";\n\nexport type LabelPlacement = \"outside\" | \"inside\" | \"hidden\";\nexport interface InputProps\n extends Omit<\n InputHTMLAttributes<HTMLInputElement>,\n \"type\" | \"value\" | \"defaultValue\" | \"children\"\n > {\n type?: \"text\" | \"search\" | \"email\" | \"tel\" | \"url\" | \"password\" | \"number\";\n value?: string;\n defaultValue?: string;\n onValueChange?: (next: string) => void;\n label?: ReactNode;\n labelPlacement?: LabelPlacement;\n clearable?: boolean;\n clearLabel?: string;\n wrapperClassName?: string;\n}\n\n/** A native text input. Supply label, aria-label, or aria-labelledby. */\nexport const Input = forwardRef<HTMLInputElement, InputProps>(function Input(\n {\n value,\n defaultValue = \"\",\n onValueChange,\n label,\n labelPlacement = \"outside\",\n clearable,\n clearLabel = \"내용 지우기\",\n wrapperClassName,\n className,\n id: requestedId,\n type = \"text\",\n onChange,\n onKeyDown,\n disabled,\n readOnly,\n ...rest\n },\n forwardedRef,\n) {\n const generated = useId();\n const id = requestedId ?? `dds-input-${generated}`;\n const inputRef = useRef<HTMLInputElement | null>(null);\n const initial = useRef(defaultValue);\n const [internal, setInternal] = useState(defaultValue);\n const current = value ?? internal;\n const controlled = value !== undefined;\n const latest = useRef({ controlled, current });\n latest.current = { controlled, current };\n useEffect(() => {\n const input = inputRef.current;\n if (!input) return;\n input.defaultValue = initial.current;\n // Reset happens after the event dispatch. Respect preventDefault, and keep\n // the parent's controlled value when the browser resets native form data.\n const reset = (event: Event) =>\n queueMicrotask(() => {\n if (event.defaultPrevented) return;\n if (latest.current.controlled) input.value = latest.current.current;\n else {\n input.value = initial.current;\n setInternal(initial.current);\n }\n });\n const form = input.form;\n form?.addEventListener(\"reset\", reset);\n return () => form?.removeEventListener(\"reset\", reset);\n }, [rest.form]);\n const update = (next: string) => {\n if (disabled || readOnly) return;\n if (!controlled) setInternal(next);\n onValueChange?.(next);\n };\n return (\n <span\n className={classes(\"dds-input\", wrapperClassName)}\n data-label-placement={labelPlacement}\n data-filled={current.length > 0 ? \"\" : undefined}\n data-disabled={disabled ? \"\" : undefined}\n data-readonly={readOnly ? \"\" : undefined}\n >\n {label != null && (\n <label htmlFor={id} className=\"dds-input__label\">\n {label}\n </label>\n )}\n <input\n {...rest}\n id={id}\n type={type}\n disabled={disabled}\n readOnly={readOnly}\n ref={(node) => {\n inputRef.current = node;\n if (typeof forwardedRef === \"function\") forwardedRef(node);\n else if (forwardedRef) forwardedRef.current = node;\n }}\n className={classes(\"dds-input__control\", className)}\n value={current}\n onChange={(event) => {\n onChange?.(event);\n update(event.currentTarget.value);\n }}\n onKeyDown={(event) => {\n onKeyDown?.(event);\n if (\n event.key === \"Enter\" &&\n (event.nativeEvent.isComposing || event.keyCode === 229)\n )\n event.preventDefault();\n }}\n />\n {clearable && current.length > 0 && !disabled && !readOnly && (\n <button\n type=\"button\"\n className=\"dds-input__clear\"\n aria-label={clearLabel}\n onPointerDown={(event) => event.preventDefault()}\n onMouseDown={(event) => event.preventDefault()}\n onClick={() => {\n update(\"\");\n inputRef.current?.focus();\n }}\n >\n <span aria-hidden=\"true\">×</span>\n </button>\n )}\n </span>\n );\n});\n\nexport interface InputGroupProps extends HTMLAttributes<HTMLDivElement> {\n start?: ReactNode;\n end?: ReactNode;\n}\n/** Layout only: the child Input owns its value and accessible name. */\nexport const InputGroup = forwardRef<HTMLDivElement, InputGroupProps>(\n function InputGroup({ start, end, className, children, ...rest }, ref) {\n return (\n <div\n {...rest}\n ref={ref}\n className={classes(\"dds-input-group\", className)}\n >\n {start != null && (\n <span className=\"dds-input-group__start\">{start}</span>\n )}\n {children}\n {end != null && <span className=\"dds-input-group__end\">{end}</span>}\n </div>\n );\n },\n);\n"],"mappings":";;;;AA8BA,IAAa,IAAQ,EAAyC,SAC5D,EACE,UACA,kBAAe,IACf,kBACA,UACA,oBAAiB,WACjB,cACA,gBAAa,UACb,qBACA,cACA,IAAI,GACJ,UAAO,QACP,aACA,cACA,aACA,aACA,GAAG,KAEL,GACA;CACA,IAAM,IAAY,EAAM,GAClB,IAAK,KAAe,aAAa,KACjC,IAAW,EAAgC,IAAI,GAC/C,IAAU,EAAO,CAAY,GAC7B,CAAC,GAAU,KAAe,EAAS,CAAY,GAC/C,IAAU,KAAS,GACnB,IAAa,MAAU,KAAA,GACvB,IAAS,EAAO;EAAE;EAAY;CAAQ,CAAC;CAE7C,AADA,EAAO,UAAU;EAAE;EAAY;CAAQ,GACvC,QAAgB;EACd,IAAM,IAAQ,EAAS;EACvB,IAAI,CAAC,GAAO;EACZ,EAAM,eAAe,EAAQ;EAG7B,IAAM,KAAS,MACb,qBAAqB;GACf,EAAM,qBACN,EAAO,QAAQ,aAAY,EAAM,QAAQ,EAAO,QAAQ,WAE1D,EAAM,QAAQ,EAAQ,SACtB,EAAY,EAAQ,OAAO;EAE/B,CAAC,GACG,IAAO,EAAM;EAEnB,OADA,GAAM,iBAAiB,SAAS,CAAK,SACxB,GAAM,oBAAoB,SAAS,CAAK;CACvD,GAAG,CAAC,EAAK,IAAI,CAAC;CACd,IAAM,KAAU,MAAiB;EAC3B,KAAY,MACX,KAAY,EAAY,CAAI,GACjC,IAAgB,CAAI;CACtB;CACA,OACE,kBAAC,QAAD;EACE,WAAW,EAAQ,aAAa,CAAgB;EAChD,wBAAsB;EACtB,eAAa,EAAQ,SAAS,IAAI,KAAK,KAAA;EACvC,iBAAe,IAAW,KAAK,KAAA;EAC/B,iBAAe,IAAW,KAAK,KAAA;EALjC,UAAA;GAOG,KAAS,QACR,kBAAC,SAAD;IAAO,SAAS;IAAI,WAAU;IAC3B,UAAA;GACI,CAAA;GAET,kBAAC,SAAD;IACE,GAAI;IACA;IACE;IACI;IACA;IACV,MAAM,MAAS;KAEb,AADA,EAAS,UAAU,GACf,OAAO,KAAiB,aAAY,EAAa,CAAI,IAChD,MAAc,EAAa,UAAU;IAChD;IACA,WAAW,EAAQ,sBAAsB,CAAS;IAClD,OAAO;IACP,WAAW,MAAU;KAEnB,AADA,IAAW,CAAK,GAChB,EAAO,EAAM,cAAc,KAAK;IAClC;IACA,YAAY,MAAU;KAEpB,AADA,IAAY,CAAK,GAEf,EAAM,QAAQ,YACb,EAAM,YAAY,eAAe,EAAM,YAAY,QAEpD,EAAM,eAAe;IACzB;GACD,CAAA;GACA,KAAa,EAAQ,SAAS,KAAK,CAAC,KAAY,CAAC,KAChD,kBAAC,UAAD;IACE,MAAK;IACL,WAAU;IACV,cAAY;IACZ,gBAAgB,MAAU,EAAM,eAAe;IAC/C,cAAc,MAAU,EAAM,eAAe;IAC7C,eAAe;KAEb,AADA,EAAO,EAAE,GACT,EAAS,SAAS,MAAM;IAC1B;IAEA,UAAA,kBAAC,QAAD;KAAM,eAAY;KAAO,UAAA;IAAO,CAAA;GAC1B,CAAA;EAEN;;AAEV,CAAC,GAOY,IAAa,EACxB,SAAoB,EAAE,UAAO,QAAK,cAAW,aAAU,GAAG,KAAQ,GAAK;CACrE,OACE,kBAAC,OAAD;EACE,GAAI;EACC;EACL,WAAW,EAAQ,mBAAmB,CAAS;EAHjD,UAAA;GAKG,KAAS,QACR,kBAAC,QAAD;IAAM,WAAU;IAA0B,UAAA;GAAY,CAAA;GAEvD;GACA,KAAO,QAAQ,kBAAC,QAAD;IAAM,WAAU;IAAwB,UAAA;GAAU,CAAA;EAC/D;;AAET,CACF"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"choice.d.ts","sourceRoot":"","sources":["../../src/internal/choice.tsx"],"names":[],"mappings":"AAKA,OAAO,EAIL,KAAK,aAAa,EACnB,MAAM,iBAAiB,CAAC;AAazB,wBAAgB,MAAM,CAAC,KAAK,EAAE,aAAa,GAAG;IAAE,UAAU,EAAE,OAAO,CAAA;CAAE,+BA6YpE"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { type ComponentProps } from "react";
|
|
2
|
+
import { Popover as ArkPopover } from "@ark-ui/react/popover";
|
|
3
|
+
export interface PopoverProps extends Omit<ComponentProps<typeof ArkPopover.Root>, "onOpenChange"> {
|
|
4
|
+
onOpenChange?: (open: boolean) => void;
|
|
5
|
+
}
|
|
6
|
+
export interface PopoverContentProps extends ComponentProps<typeof ArkPopover.Content> {
|
|
7
|
+
portal?: boolean;
|
|
8
|
+
portalMount?: HTMLElement;
|
|
9
|
+
}
|
|
10
|
+
declare function Root({ onOpenChange, modal, positioning, ...props }: PopoverProps): import("react").JSX.Element;
|
|
11
|
+
export declare const Popover: {
|
|
12
|
+
Root: typeof Root;
|
|
13
|
+
Trigger: import("react").ForwardRefExoticComponent<ArkPopover.TriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
14
|
+
Content: import("react").ForwardRefExoticComponent<Omit<PopoverContentProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
15
|
+
Title: import("react").ForwardRefExoticComponent<ArkPopover.TitleProps & import("react").RefAttributes<HTMLHeadingElement>>;
|
|
16
|
+
Description: import("react").ForwardRefExoticComponent<ArkPopover.DescriptionProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
17
|
+
CloseTrigger: import("react").ForwardRefExoticComponent<ArkPopover.CloseTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
18
|
+
Anchor: import("react").ForwardRefExoticComponent<ArkPopover.AnchorProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
19
|
+
};
|
|
20
|
+
export {};
|
|
21
|
+
//# sourceMappingURL=popover.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"popover.d.ts","sourceRoot":"","sources":["../src/popover.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAmC,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAC7E,OAAO,EACL,OAAO,IAAI,UAAU,EAEtB,MAAM,uBAAuB,CAAC;AAE/B,MAAM,WAAW,YACf,SAAQ,IAAI,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,IAAI,CAAC,EAAE,cAAc,CAAC;IACpE,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CACxC;AACD,MAAM,WAAW,mBACf,SAAQ,cAAc,CAAC,OAAO,UAAU,CAAC,OAAO,CAAC;IACjD,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B;AACD,iBAAS,IAAI,CAAC,EACZ,YAAY,EACZ,KAAa,EACb,WAAW,EACX,GAAG,KAAK,EACT,EAAE,YAAY,+BASd;AA4CD,eAAO,MAAM,OAAO;;;;;;;;CAQnB,CAAC"}
|
package/dist/popover.js
ADDED
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { forwardRef as e, useEffect as t, useState as n } from "react";
|
|
2
|
+
import { jsx as r } from "react/jsx-runtime";
|
|
3
|
+
import { Portal as i } from "@ark-ui/react/portal";
|
|
4
|
+
import { Popover as a, usePopoverContext as o } from "@ark-ui/react/popover";
|
|
5
|
+
//#region src/popover.tsx
|
|
6
|
+
function s({ onOpenChange: e, modal: t = !1, positioning: n, ...i }) {
|
|
7
|
+
return /* @__PURE__ */ r(a.Root, {
|
|
8
|
+
...i,
|
|
9
|
+
positioning: {
|
|
10
|
+
strategy: "fixed",
|
|
11
|
+
...n
|
|
12
|
+
},
|
|
13
|
+
modal: t,
|
|
14
|
+
onOpenChange: (t) => e?.(t.open)
|
|
15
|
+
});
|
|
16
|
+
}
|
|
17
|
+
var c = e(function({ portal: e = !0, portalMount: s, className: c, children: l, ...u }, d) {
|
|
18
|
+
let f = o(), p = f.getTriggerProps().id, [m, h] = n(null);
|
|
19
|
+
t(() => {
|
|
20
|
+
let e = p ? document.getElementById(p) : null;
|
|
21
|
+
h(s ?? e?.closest("[role=\"dialog\"], [role=\"alertdialog\"]") ?? document.body);
|
|
22
|
+
}, [s, p]);
|
|
23
|
+
let g = /* @__PURE__ */ r(a.Positioner, {
|
|
24
|
+
className: "dds-popover-positioner",
|
|
25
|
+
children: /* @__PURE__ */ r(a.Content, {
|
|
26
|
+
...u,
|
|
27
|
+
"aria-labelledby": u["aria-labelledby"] ?? (u["aria-label"] ? void 0 : f.getTitleProps().id),
|
|
28
|
+
ref: d,
|
|
29
|
+
className: ["dds-popover", c].filter(Boolean).join(" "),
|
|
30
|
+
children: l
|
|
31
|
+
})
|
|
32
|
+
});
|
|
33
|
+
return e ? m ? /* @__PURE__ */ r(i, {
|
|
34
|
+
container: { current: m },
|
|
35
|
+
children: g
|
|
36
|
+
}) : null : g;
|
|
37
|
+
}), l = {
|
|
38
|
+
Root: s,
|
|
39
|
+
Trigger: a.Trigger,
|
|
40
|
+
Content: c,
|
|
41
|
+
Title: a.Title,
|
|
42
|
+
Description: a.Description,
|
|
43
|
+
CloseTrigger: a.CloseTrigger,
|
|
44
|
+
Anchor: a.Anchor
|
|
45
|
+
};
|
|
46
|
+
//#endregion
|
|
47
|
+
export { l as Popover };
|
|
48
|
+
|
|
49
|
+
//# sourceMappingURL=popover.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"popover.js","names":[],"sources":["../src/popover.tsx"],"sourcesContent":["import { forwardRef, useEffect, useState, type ComponentProps } from \"react\";\nimport {\n Popover as ArkPopover,\n usePopoverContext,\n} from \"@ark-ui/react/popover\";\nimport { Portal } from \"@ark-ui/react/portal\";\nexport interface PopoverProps\n extends Omit<ComponentProps<typeof ArkPopover.Root>, \"onOpenChange\"> {\n onOpenChange?: (open: boolean) => void;\n}\nexport interface PopoverContentProps\n extends ComponentProps<typeof ArkPopover.Content> {\n portal?: boolean;\n portalMount?: HTMLElement;\n}\nfunction Root({\n onOpenChange,\n modal = false,\n positioning,\n ...props\n}: PopoverProps) {\n return (\n <ArkPopover.Root\n {...props}\n positioning={{ strategy: \"fixed\", ...positioning }}\n modal={modal}\n onOpenChange={(event) => onOpenChange?.(event.open)}\n />\n );\n}\nconst Content = forwardRef<HTMLDivElement, PopoverContentProps>(\n function Content(\n { portal = true, portalMount, className, children, ...props },\n ref,\n ) {\n const api = usePopoverContext();\n const triggerId = api.getTriggerProps().id;\n const [mount, setMount] = useState<HTMLElement | null>(null);\n useEffect(() => {\n // Keep nested overlays inside the modal isolation subtree.\n const trigger = triggerId ? document.getElementById(triggerId) : null;\n setMount(\n portalMount ??\n trigger?.closest<HTMLElement>(\n '[role=\"dialog\"], [role=\"alertdialog\"]',\n ) ??\n document.body,\n );\n }, [portalMount, triggerId]);\n const content = (\n <ArkPopover.Positioner className=\"dds-popover-positioner\">\n <ArkPopover.Content\n {...props}\n aria-labelledby={\n props[\"aria-labelledby\"] ??\n (props[\"aria-label\"] ? undefined : api.getTitleProps().id)\n }\n ref={ref}\n className={[\"dds-popover\", className].filter(Boolean).join(\" \")}\n >\n {children}\n </ArkPopover.Content>\n </ArkPopover.Positioner>\n );\n return portal ? (\n mount ? (\n <Portal container={{ current: mount }}>{content}</Portal>\n ) : null\n ) : (\n content\n );\n },\n);\nexport const Popover = {\n Root,\n Trigger: ArkPopover.Trigger,\n Content,\n Title: ArkPopover.Title,\n Description: ArkPopover.Description,\n CloseTrigger: ArkPopover.CloseTrigger,\n Anchor: ArkPopover.Anchor,\n};\n"],"mappings":";;;;;AAeA,SAAS,EAAK,EACZ,iBACA,WAAQ,IACR,gBACA,GAAG,KACY;CACf,OACE,kBAAC,EAAW,MAAZ;EACE,GAAI;EACJ,aAAa;GAAE,UAAU;GAAS,GAAG;EAAY;EAC1C;EACP,eAAe,MAAU,IAAe,EAAM,IAAI;CACnD,CAAA;AAEL;AACA,IAAM,IAAU,EACd,SACE,EAAE,YAAS,IAAM,gBAAa,cAAW,aAAU,GAAG,KACtD,GACA;CACA,IAAM,IAAM,EAAkB,GACxB,IAAY,EAAI,gBAAgB,CAAC,CAAC,IAClC,CAAC,GAAO,KAAY,EAA6B,IAAI;CAC3D,QAAgB;EAEd,IAAM,IAAU,IAAY,SAAS,eAAe,CAAS,IAAI;EACjE,EACE,KACE,GAAS,QACP,2CACF,KACA,SAAS,IACb;CACF,GAAG,CAAC,GAAa,CAAS,CAAC;CAC3B,IAAM,IACJ,kBAAC,EAAW,YAAZ;EAAuB,WAAU;EAC/B,UAAA,kBAAC,EAAW,SAAZ;GACE,GAAI;GACJ,mBACE,EAAM,uBACL,EAAM,gBAAgB,KAAA,IAAY,EAAI,cAAc,CAAC,CAAC;GAEpD;GACL,WAAW,CAAC,eAAe,CAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;GAE7D;EACiB,CAAA;CACC,CAAA;CAEzB,OAAO,IACL,IACE,kBAAC,GAAD;EAAQ,WAAW,EAAE,SAAS,EAAM;EAAI,UAAA;CAAgB,CAAA,IACtD,OAEJ;AAEJ,CACF,GACa,IAAU;CACrB;CACA,SAAS,EAAW;CACpB;CACA,OAAO,EAAW;CAClB,aAAa,EAAW;CACxB,cAAc,EAAW;CACzB,QAAQ,EAAW;AACrB"}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import type { SelectPickerProps } from "./choice-types";
|
|
2
|
+
export type { SelectPickerProps, ChoiceOption, ChoiceMessages, ChoiceVirtualization, } from "./choice-types";
|
|
3
|
+
export declare function SelectPicker(props: SelectPickerProps): import("react").JSX.Element;
|
|
4
|
+
//# sourceMappingURL=select-picker.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"select-picker.d.ts","sourceRoot":"","sources":["../src/select-picker.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACxD,YAAY,EACV,iBAAiB,EACjB,YAAY,EACZ,cAAc,EACd,oBAAoB,GACrB,MAAM,gBAAgB,CAAC;AACxB,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,+BAEpD"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { t as e } from "./choice-B3vNMfKK.js";
|
|
2
|
+
import { jsx as t } from "react/jsx-runtime";
|
|
3
|
+
//#region src/select-picker.tsx
|
|
4
|
+
function n(n) {
|
|
5
|
+
return /* @__PURE__ */ t(e, {
|
|
6
|
+
...n,
|
|
7
|
+
searchable: !1
|
|
8
|
+
});
|
|
9
|
+
}
|
|
10
|
+
//#endregion
|
|
11
|
+
export { n as SelectPicker };
|
|
12
|
+
|
|
13
|
+
//# sourceMappingURL=select-picker.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"select-picker.js","names":[],"sources":["../src/select-picker.tsx"],"sourcesContent":["import { Choice } from \"./internal/choice\";\nimport type { SelectPickerProps } from \"./choice-types\";\nexport type {\n SelectPickerProps,\n ChoiceOption,\n ChoiceMessages,\n ChoiceVirtualization,\n} from \"./choice-types\";\nexport function SelectPicker(props: SelectPickerProps) {\n return <Choice {...props} searchable={false} />;\n}\n"],"mappings":";;;AAQA,SAAgB,EAAa,GAA0B;CACrD,OAAO,kBAAC,GAAD;EAAQ,GAAI;EAAO,YAAY;CAAQ,CAAA;AAChD"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@devslab/dds-react",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.22.0",
|
|
4
4
|
"description": "Accessible React primitives for the DevsLab Design System",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"license": "SEE LICENSE IN LICENSE",
|
|
@@ -35,29 +35,65 @@
|
|
|
35
35
|
"import": "./dist/index.js",
|
|
36
36
|
"default": "./dist/index.js"
|
|
37
37
|
},
|
|
38
|
-
"./styles.css": "./styles.css"
|
|
38
|
+
"./styles.css": "./styles.css",
|
|
39
|
+
"./input": {
|
|
40
|
+
"types": "./dist/input.d.ts",
|
|
41
|
+
"import": "./dist/input.js",
|
|
42
|
+
"default": "./dist/input.js"
|
|
43
|
+
},
|
|
44
|
+
"./combobox": {
|
|
45
|
+
"types": "./dist/combobox.d.ts",
|
|
46
|
+
"import": "./dist/combobox.js",
|
|
47
|
+
"default": "./dist/combobox.js"
|
|
48
|
+
},
|
|
49
|
+
"./select-picker": {
|
|
50
|
+
"types": "./dist/select-picker.d.ts",
|
|
51
|
+
"import": "./dist/select-picker.js",
|
|
52
|
+
"default": "./dist/select-picker.js"
|
|
53
|
+
},
|
|
54
|
+
"./dropdown-menu": {
|
|
55
|
+
"types": "./dist/dropdown-menu.d.ts",
|
|
56
|
+
"import": "./dist/dropdown-menu.js",
|
|
57
|
+
"default": "./dist/dropdown-menu.js"
|
|
58
|
+
},
|
|
59
|
+
"./popover": {
|
|
60
|
+
"types": "./dist/popover.d.ts",
|
|
61
|
+
"import": "./dist/popover.js",
|
|
62
|
+
"default": "./dist/popover.js"
|
|
63
|
+
},
|
|
64
|
+
"./calendar": {
|
|
65
|
+
"types": "./dist/calendar.d.ts",
|
|
66
|
+
"import": "./dist/calendar.js",
|
|
67
|
+
"default": "./dist/calendar.js"
|
|
68
|
+
},
|
|
69
|
+
"./date-picker": {
|
|
70
|
+
"types": "./dist/date-picker.d.ts",
|
|
71
|
+
"import": "./dist/date-picker.js",
|
|
72
|
+
"default": "./dist/date-picker.js"
|
|
73
|
+
}
|
|
39
74
|
},
|
|
40
75
|
"dependencies": {
|
|
41
76
|
"@ark-ui/react": "5.39.3",
|
|
42
|
-
"@devslab/dds-css": "0.
|
|
43
|
-
"@devslab/dds-icons": "0.
|
|
44
|
-
"@devslab/dds-tokens": "0.
|
|
77
|
+
"@devslab/dds-css": "0.22.0",
|
|
78
|
+
"@devslab/dds-icons": "0.22.0",
|
|
79
|
+
"@devslab/dds-tokens": "0.22.0",
|
|
80
|
+
"@tanstack/react-virtual": "3.14.21"
|
|
45
81
|
},
|
|
46
82
|
"peerDependencies": {
|
|
47
83
|
"react": "^18.3.0 || ^19.0.0",
|
|
48
84
|
"react-dom": "^18.3.0 || ^19.0.0"
|
|
49
85
|
},
|
|
50
86
|
"devDependencies": {
|
|
51
|
-
"
|
|
52
|
-
"react-dom": "19.3.0",
|
|
53
|
-
"@types/react": "^19.0.0",
|
|
54
|
-
"@types/react-dom": "^19.0.0",
|
|
87
|
+
"@testing-library/jest-dom": "6.9.1",
|
|
55
88
|
"@testing-library/react": "16.3.2",
|
|
56
89
|
"@testing-library/user-event": "14.6.1",
|
|
57
|
-
"@testing-library/jest-dom": "6.9.1",
|
|
58
90
|
"@types/node": "26.3.0",
|
|
91
|
+
"@types/react": "^19.0.0",
|
|
92
|
+
"@types/react-dom": "^19.0.0",
|
|
59
93
|
"axe-core": "4.13.0",
|
|
60
94
|
"jsdom": "30.0.1",
|
|
95
|
+
"react": "19.3.0",
|
|
96
|
+
"react-dom": "19.3.0",
|
|
61
97
|
"typescript": "7.0.2",
|
|
62
98
|
"vite": "8.2.1",
|
|
63
99
|
"vitest": "4.1.1"
|
package/styles.css
CHANGED
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
.dds-date-picker-control {display:flex;align-items:stretch;gap:8px;}
|
|
24
24
|
.dds-date-picker-control input {min-width:0;}
|
|
25
25
|
.dds-date-picker-control .dds-btn {flex-shrink:0;min-width:44px;padding-inline:10px;}
|
|
26
|
-
.dds-date-picker-positioner {z-index:
|
|
26
|
+
.dds-date-picker-positioner {z-index:var(--dds-overlay-z-index,1001);}
|
|
27
27
|
.dds-date-picker-content {width:320px;max-width:calc(100vw - 32px);max-height:min(calc(100dvh - 32px),var(--available-height,100dvh));overflow:auto;box-sizing:border-box;padding:16px;background:var(--dds-color-bg-default);color:var(--dds-color-text-primary);border:1px solid var(--dds-color-border-default);border-radius:var(--dds-radius-md);font-family:var(--dds-font-family-sans);font-size:var(--dds-typo-body-2-font-size);}
|
|
28
28
|
.dds-date-picker-header {display:flex;align-items:center;justify-content:space-between;gap:12px;font-weight:600;margin-bottom:12px;}
|
|
29
29
|
.dds-date-picker-table {width:100%;border-collapse:collapse;table-layout:fixed;}
|
|
@@ -36,3 +36,12 @@
|
|
|
36
36
|
.dds-date-picker-table [data-today]:not([data-selected]) {text-decoration:underline;text-underline-offset:4px;}
|
|
37
37
|
.dds-date-picker-content :focus-visible {outline:2px solid var(--dds-color-text-brand);outline-offset:2px;}
|
|
38
38
|
.dds-date-picker-footer {display:flex;justify-content:space-between;gap:12px;margin-top:12px;padding-top:12px;border-top:1px solid var(--dds-color-border-default);}
|
|
39
|
+
|
|
40
|
+
/* Standalone Calendar shares the DatePicker view without popup positioning. */
|
|
41
|
+
.dds-calendar {display:block;}
|
|
42
|
+
.dds-date-picker--hidden > .dds-field__label {position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);}
|
|
43
|
+
.dds-date-picker--inside {position:relative;}
|
|
44
|
+
.dds-date-picker--inside > .dds-field__label {position:absolute;inset-inline-start:12px;inset-block-start:18px;z-index:1;pointer-events:none;}
|
|
45
|
+
.dds-date-picker--inside:focus-within > .dds-field__label,.dds-date-picker--inside[data-filled] > .dds-field__label {inset-block-start:2px;font-size:var(--dds-typo-caption-font-size);}
|
|
46
|
+
.dds-date-picker--inside .dds-date-picker-control input {height:56px;padding-block:20px 4px;}
|
|
47
|
+
.dds-date-picker--inside:not(:focus-within):not([data-filled]) input::placeholder {color:transparent;}
|