@linyao.tw/ui 1.1.0 → 1.2.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/date-time/calendar.js +1 -0
- package/dist/components/date-time/calendar.js.map +1 -1
- package/dist/components/date-time/date-field.js +1 -0
- package/dist/components/date-time/date-field.js.map +1 -1
- package/dist/components/date-time/date-picker.js +1 -0
- package/dist/components/date-time/date-picker.js.map +1 -1
- package/dist/components/date-time/date-range-picker.js +1 -0
- package/dist/components/date-time/date-range-picker.js.map +1 -1
- package/dist/components/date-time/index.js +1 -0
- package/dist/components/date-time/shared.js +1 -0
- package/dist/components/date-time/shared.js.map +1 -1
- package/dist/components/date-time/time-field.js +1 -0
- package/dist/components/date-time/time-field.js.map +1 -1
- package/dist/components/feedback/alert.js +1 -0
- package/dist/components/feedback/alert.js.map +1 -1
- package/dist/components/feedback/banner.js +1 -0
- package/dist/components/feedback/banner.js.map +1 -1
- package/dist/components/feedback/empty-state.js +1 -0
- package/dist/components/feedback/empty-state.js.map +1 -1
- package/dist/components/feedback/feedback.types.js +1 -0
- package/dist/components/feedback/feedback.types.js.map +1 -1
- package/dist/components/feedback/meter.js +1 -0
- package/dist/components/feedback/meter.js.map +1 -1
- package/dist/components/feedback/progress.js +1 -0
- package/dist/components/feedback/progress.js.map +1 -1
- package/dist/components/feedback/skeleton.js +1 -0
- package/dist/components/feedback/skeleton.js.map +1 -1
- package/dist/components/feedback/spinner.js +1 -0
- package/dist/components/feedback/spinner.js.map +1 -1
- package/dist/components/feedback/toast.js +1 -0
- package/dist/components/feedback/toast.js.map +1 -1
- package/dist/components/forms/code-field.js +1 -0
- package/dist/components/forms/code-field.js.map +1 -1
- package/dist/components/forms/file-upload.js +1 -0
- package/dist/components/forms/file-upload.js.map +1 -1
- package/dist/components/forms/input.js +1 -0
- package/dist/components/forms/input.js.map +1 -1
- package/dist/components/forms/internal.js +12 -10
- package/dist/components/forms/internal.js.map +1 -1
- package/dist/components/forms/number-field.js +1 -0
- package/dist/components/forms/number-field.js.map +1 -1
- package/dist/components/forms/otp-field.js +1 -0
- package/dist/components/forms/otp-field.js.map +1 -1
- package/dist/components/forms/text-field.js +1 -0
- package/dist/components/forms/text-field.js.map +1 -1
- package/dist/components/foundations/avatar.js +10 -7
- package/dist/components/foundations/avatar.js.map +1 -1
- package/dist/components/foundations/badge.js +1 -0
- package/dist/components/foundations/badge.js.map +1 -1
- package/dist/components/foundations/button.js +1 -0
- package/dist/components/foundations/button.js.map +1 -1
- package/dist/components/foundations/card.js +1 -0
- package/dist/components/foundations/card.js.map +1 -1
- package/dist/components/foundations/icon-button.js +1 -0
- package/dist/components/foundations/icon-button.js.map +1 -1
- package/dist/components/foundations/link.js +1 -0
- package/dist/components/foundations/link.js.map +1 -1
- package/dist/components/foundations/list-cell.js +1 -0
- package/dist/components/foundations/list-cell.js.map +1 -1
- package/dist/components/foundations/section-heading.js +1 -0
- package/dist/components/foundations/section-heading.js.map +1 -1
- package/dist/components/foundations/separator.js +1 -0
- package/dist/components/foundations/separator.js.map +1 -1
- package/dist/components/navigation-data/breadcrumb-pagination.js +1 -0
- package/dist/components/navigation-data/breadcrumb-pagination.js.map +1 -1
- package/dist/components/navigation-data/command-palette.js +1 -0
- package/dist/components/navigation-data/command-palette.js.map +1 -1
- package/dist/components/navigation-data/header-tab-bar.js +1 -0
- package/dist/components/navigation-data/header-tab-bar.js.map +1 -1
- package/dist/components/navigation-data/menubar-toolbar.js +1 -0
- package/dist/components/navigation-data/menubar-toolbar.js.map +1 -1
- package/dist/components/navigation-data/navigation-menu.js +1 -0
- package/dist/components/navigation-data/navigation-menu.js.map +1 -1
- package/dist/components/navigation-data/scroll-area.js +1 -0
- package/dist/components/navigation-data/scroll-area.js.map +1 -1
- package/dist/components/navigation-data/table-collection.js +1 -0
- package/dist/components/navigation-data/table-collection.js.map +1 -1
- package/dist/components/overlays/dialog.d.ts +10 -1
- package/dist/components/overlays/dialog.js +11 -8
- package/dist/components/overlays/dialog.js.map +1 -1
- package/dist/components/overlays/disclosure.js +1 -0
- package/dist/components/overlays/disclosure.js.map +1 -1
- package/dist/components/overlays/drawer.d.ts +4 -1
- package/dist/components/overlays/drawer.js +11 -8
- package/dist/components/overlays/drawer.js.map +1 -1
- package/dist/components/overlays/floating.js +1 -0
- package/dist/components/overlays/floating.js.map +1 -1
- package/dist/components/overlays/index.d.ts +1 -1
- package/dist/components/selection/combobox.js +1 -0
- package/dist/components/selection/combobox.js.map +1 -1
- package/dist/components/selection/controls.js +1 -0
- package/dist/components/selection/controls.js.map +1 -1
- package/dist/components/selection/menu.js +1 -0
- package/dist/components/selection/menu.js.map +1 -1
- package/dist/components/selection/select.js +1 -0
- package/dist/components/selection/select.js.map +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +34 -32
- package/dist/internal/class-names.js +1 -0
- package/dist/internal/class-names.js.map +1 -1
- package/dist/intl/index.d.ts +1 -0
- package/dist/intl/linyao-provider.d.ts +38 -0
- package/dist/intl/linyao-provider.js +27 -0
- package/dist/intl/linyao-provider.js.map +1 -0
- package/dist/intl/messages.js +1 -0
- package/dist/intl/messages.js.map +1 -1
- package/dist/intl/provider.js +17 -8
- package/dist/intl/provider.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"calendar.js","names":[],"sources":["../../../src/components/date-time/calendar.tsx"],"sourcesContent":["import { cx } from \"@/internal\";\nimport type { CalendarDate } from \"@internationalized/date\";\nimport { CaretLeftIcon } from \"@phosphor-icons/react/dist/csr/CaretLeft\";\nimport { CaretRightIcon } from \"@phosphor-icons/react/dist/csr/CaretRight\";\nimport { forwardRef, type ReactElement, type RefAttributes } from \"react\";\nimport { Button } from \"react-aria-components/Button\";\nimport {\n\tCalendar as AriaCalendar,\n\tCalendarCell,\n\tCalendarGrid,\n\tCalendarGridBody,\n\tCalendarGridHeader,\n\tCalendarHeaderCell,\n\tCalendarHeading,\n\tCalendarMonthPicker,\n\tCalendarYearPicker,\n\ttype CalendarProps as AriaCalendarProps\n} from \"react-aria-components/Calendar\";\nimport type { CalendarBehaviorProps, DateValue as LydsDateValue } from \"./date-types\";\nimport { LocaleBoundary } from \"./shared\";\nexport type { FirstDayOfWeek } from \"./date-types\";\nexport type WeekdayStyle = \"narrow\" | \"short\" | \"long\";\n\nexport interface CalendarProps<T extends LydsDateValue = CalendarDate> extends CalendarBehaviorProps<T> {\n\tlocale?: string | undefined;\n\tclassName?: string;\n\tweekdayStyle?: WeekdayStyle | undefined;\n}\n\ntype CalendarForwardedKeys = Exclude<keyof CalendarBehaviorProps<LydsDateValue>, \"disabled\" | \"invalid\" | \"onValueChange\" | \"readOnly\">;\ntype CalendarUnexpectedForwardedKeys = Exclude<CalendarForwardedKeys, keyof AriaCalendarProps<LydsDateValue>>;\ntype CalendarPropContract = CalendarUnexpectedForwardedKeys extends never ? true : never;\nconst calendarPropContract: CalendarPropContract = true;\nvoid calendarPropContract;\n\nexport interface CalendarPanelProps {\n\tweekdayStyle?: WeekdayStyle | undefined;\n\tshowMonthYearPickers?: boolean | undefined;\n\tdisabled?: boolean | undefined;\n\tclassName?: string | undefined;\n}\n\nexport function CalendarNavigation({ showMonthYearPickers = true, disabled }: Pick<CalendarPanelProps, \"showMonthYearPickers\" | \"disabled\">) {\n\treturn (\n\t\t<>\n\t\t\t<div className=\"lyds-calendar-navigation\">\n\t\t\t\t<Button slot=\"previous\" className=\"lyds-calendar-navigation-button\">\n\t\t\t\t\t<CaretLeftIcon aria-hidden=\"true\" className=\"lyds-date-glyph\" weight=\"bold\" />\n\t\t\t\t</Button>\n\t\t\t\t<CalendarHeading className=\"lyds-calendar-heading\" />\n\t\t\t\t<Button slot=\"next\" className=\"lyds-calendar-navigation-button\">\n\t\t\t\t\t<CaretRightIcon aria-hidden=\"true\" className=\"lyds-date-glyph\" weight=\"bold\" />\n\t\t\t\t</Button>\n\t\t\t</div>\n\t\t\t{showMonthYearPickers ? (\n\t\t\t\t<div className=\"lyds-calendar-period-pickers\">\n\t\t\t\t\t<CalendarMonthPicker>\n\t\t\t\t\t\t{({ items, value, onChange, ...ariaProps }) => (\n\t\t\t\t\t\t\t<select {...ariaProps} className=\"lyds-calendar-period-select\" value={String(value)} disabled={disabled} onChange={event => onChange(Number(event.currentTarget.value))}>\n\t\t\t\t\t\t\t\t{items.map(item => (\n\t\t\t\t\t\t\t\t\t<option key={item.id} value={item.id}>\n\t\t\t\t\t\t\t\t\t\t{item.formatted}\n\t\t\t\t\t\t\t\t\t</option>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</select>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</CalendarMonthPicker>\n\t\t\t\t\t<CalendarYearPicker>\n\t\t\t\t\t\t{({ items, value, onChange, ...ariaProps }) => (\n\t\t\t\t\t\t\t<select {...ariaProps} className=\"lyds-calendar-period-select\" value={String(value)} disabled={disabled} onChange={event => onChange(Number(event.currentTarget.value))}>\n\t\t\t\t\t\t\t\t{items.map(item => (\n\t\t\t\t\t\t\t\t\t<option key={item.id} value={item.id}>\n\t\t\t\t\t\t\t\t\t\t{item.formatted}\n\t\t\t\t\t\t\t\t\t</option>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</select>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</CalendarYearPicker>\n\t\t\t\t</div>\n\t\t\t) : null}\n\t\t</>\n\t);\n}\n\nexport function CalendarGridView({ weekdayStyle = \"short\" }: Pick<CalendarPanelProps, \"weekdayStyle\">) {\n\treturn (\n\t\t<CalendarGrid weekdayStyle={weekdayStyle} className=\"lyds-calendar-grid\">\n\t\t\t<CalendarGridHeader>{day => <CalendarHeaderCell className=\"lyds-calendar-weekday\">{day}</CalendarHeaderCell>}</CalendarGridHeader>\n\t\t\t<CalendarGridBody>{date => <CalendarCell date={date} className=\"lyds-calendar-cell\" />}</CalendarGridBody>\n\t\t</CalendarGrid>\n\t);\n}\n\nexport function CalendarPanel({ weekdayStyle, showMonthYearPickers, disabled, className }: CalendarPanelProps) {\n\treturn (\n\t\t<div className={cx(\"lyds-calendar-panel\", className)}>\n\t\t\t<CalendarNavigation showMonthYearPickers={showMonthYearPickers} disabled={disabled} />\n\t\t\t<CalendarGridView weekdayStyle={weekdayStyle} />\n\t\t</div>\n\t);\n}\n\nfunction CalendarImpl<T extends LydsDateValue>(\n\t{ locale, className, disabled, readOnly, invalid, onValueChange, weekdayStyle, ...calendarProps }: CalendarProps<T>,\n\tref: React.ForwardedRef<HTMLDivElement>\n) {\n\tconst ariaCalendarProps = calendarProps as unknown as Omit<AriaCalendarProps<T>, \"children\" | \"className\" | \"isDisabled\" | \"isInvalid\" | \"isReadOnly\" | \"onChange\">;\n\n\treturn (\n\t\t<LocaleBoundary locale={locale}>\n\t\t\t<AriaCalendar\n\t\t\t\t{...ariaCalendarProps}\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"lyds-calendar\", className)}\n\t\t\t\t{...(disabled === undefined ? {} : { isDisabled: disabled })}\n\t\t\t\t{...(readOnly === undefined ? {} : { isReadOnly: readOnly })}\n\t\t\t\t{...(invalid === undefined ? {} : { isInvalid: invalid })}\n\t\t\t\t{...(onValueChange === undefined ? {} : { onChange: onValueChange as unknown as NonNullable<AriaCalendarProps<T>[\"onChange\"]> })}\n\t\t\t>\n\t\t\t\t<CalendarPanel weekdayStyle={weekdayStyle} disabled={disabled} />\n\t\t\t</AriaCalendar>\n\t\t</LocaleBoundary>\n\t);\n}\n\nexport const Calendar = forwardRef(CalendarImpl) as <T extends LydsDateValue = CalendarDate>(props: CalendarProps<T> & RefAttributes<HTMLDivElement>) => ReactElement | null;\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"calendar.js","names":[],"sources":["../../../src/components/date-time/calendar.tsx"],"sourcesContent":["import { cx } from \"@/internal\";\nimport type { CalendarDate } from \"@internationalized/date\";\nimport { CaretLeftIcon } from \"@phosphor-icons/react/dist/csr/CaretLeft\";\nimport { CaretRightIcon } from \"@phosphor-icons/react/dist/csr/CaretRight\";\nimport { forwardRef, type ReactElement, type RefAttributes } from \"react\";\nimport { Button } from \"react-aria-components/Button\";\nimport {\n\tCalendar as AriaCalendar,\n\tCalendarCell,\n\tCalendarGrid,\n\tCalendarGridBody,\n\tCalendarGridHeader,\n\tCalendarHeaderCell,\n\tCalendarHeading,\n\tCalendarMonthPicker,\n\tCalendarYearPicker,\n\ttype CalendarProps as AriaCalendarProps\n} from \"react-aria-components/Calendar\";\nimport type { CalendarBehaviorProps, DateValue as LydsDateValue } from \"./date-types\";\nimport { LocaleBoundary } from \"./shared\";\nexport type { FirstDayOfWeek } from \"./date-types\";\nexport type WeekdayStyle = \"narrow\" | \"short\" | \"long\";\n\nexport interface CalendarProps<T extends LydsDateValue = CalendarDate> extends CalendarBehaviorProps<T> {\n\tlocale?: string | undefined;\n\tclassName?: string;\n\tweekdayStyle?: WeekdayStyle | undefined;\n}\n\ntype CalendarForwardedKeys = Exclude<keyof CalendarBehaviorProps<LydsDateValue>, \"disabled\" | \"invalid\" | \"onValueChange\" | \"readOnly\">;\ntype CalendarUnexpectedForwardedKeys = Exclude<CalendarForwardedKeys, keyof AriaCalendarProps<LydsDateValue>>;\ntype CalendarPropContract = CalendarUnexpectedForwardedKeys extends never ? true : never;\nconst calendarPropContract: CalendarPropContract = true;\nvoid calendarPropContract;\n\nexport interface CalendarPanelProps {\n\tweekdayStyle?: WeekdayStyle | undefined;\n\tshowMonthYearPickers?: boolean | undefined;\n\tdisabled?: boolean | undefined;\n\tclassName?: string | undefined;\n}\n\nexport function CalendarNavigation({ showMonthYearPickers = true, disabled }: Pick<CalendarPanelProps, \"showMonthYearPickers\" | \"disabled\">) {\n\treturn (\n\t\t<>\n\t\t\t<div className=\"lyds-calendar-navigation\">\n\t\t\t\t<Button slot=\"previous\" className=\"lyds-calendar-navigation-button\">\n\t\t\t\t\t<CaretLeftIcon aria-hidden=\"true\" className=\"lyds-date-glyph\" weight=\"bold\" />\n\t\t\t\t</Button>\n\t\t\t\t<CalendarHeading className=\"lyds-calendar-heading\" />\n\t\t\t\t<Button slot=\"next\" className=\"lyds-calendar-navigation-button\">\n\t\t\t\t\t<CaretRightIcon aria-hidden=\"true\" className=\"lyds-date-glyph\" weight=\"bold\" />\n\t\t\t\t</Button>\n\t\t\t</div>\n\t\t\t{showMonthYearPickers ? (\n\t\t\t\t<div className=\"lyds-calendar-period-pickers\">\n\t\t\t\t\t<CalendarMonthPicker>\n\t\t\t\t\t\t{({ items, value, onChange, ...ariaProps }) => (\n\t\t\t\t\t\t\t<select {...ariaProps} className=\"lyds-calendar-period-select\" value={String(value)} disabled={disabled} onChange={event => onChange(Number(event.currentTarget.value))}>\n\t\t\t\t\t\t\t\t{items.map(item => (\n\t\t\t\t\t\t\t\t\t<option key={item.id} value={item.id}>\n\t\t\t\t\t\t\t\t\t\t{item.formatted}\n\t\t\t\t\t\t\t\t\t</option>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</select>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</CalendarMonthPicker>\n\t\t\t\t\t<CalendarYearPicker>\n\t\t\t\t\t\t{({ items, value, onChange, ...ariaProps }) => (\n\t\t\t\t\t\t\t<select {...ariaProps} className=\"lyds-calendar-period-select\" value={String(value)} disabled={disabled} onChange={event => onChange(Number(event.currentTarget.value))}>\n\t\t\t\t\t\t\t\t{items.map(item => (\n\t\t\t\t\t\t\t\t\t<option key={item.id} value={item.id}>\n\t\t\t\t\t\t\t\t\t\t{item.formatted}\n\t\t\t\t\t\t\t\t\t</option>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</select>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</CalendarYearPicker>\n\t\t\t\t</div>\n\t\t\t) : null}\n\t\t</>\n\t);\n}\n\nexport function CalendarGridView({ weekdayStyle = \"short\" }: Pick<CalendarPanelProps, \"weekdayStyle\">) {\n\treturn (\n\t\t<CalendarGrid weekdayStyle={weekdayStyle} className=\"lyds-calendar-grid\">\n\t\t\t<CalendarGridHeader>{day => <CalendarHeaderCell className=\"lyds-calendar-weekday\">{day}</CalendarHeaderCell>}</CalendarGridHeader>\n\t\t\t<CalendarGridBody>{date => <CalendarCell date={date} className=\"lyds-calendar-cell\" />}</CalendarGridBody>\n\t\t</CalendarGrid>\n\t);\n}\n\nexport function CalendarPanel({ weekdayStyle, showMonthYearPickers, disabled, className }: CalendarPanelProps) {\n\treturn (\n\t\t<div className={cx(\"lyds-calendar-panel\", className)}>\n\t\t\t<CalendarNavigation showMonthYearPickers={showMonthYearPickers} disabled={disabled} />\n\t\t\t<CalendarGridView weekdayStyle={weekdayStyle} />\n\t\t</div>\n\t);\n}\n\nfunction CalendarImpl<T extends LydsDateValue>(\n\t{ locale, className, disabled, readOnly, invalid, onValueChange, weekdayStyle, ...calendarProps }: CalendarProps<T>,\n\tref: React.ForwardedRef<HTMLDivElement>\n) {\n\tconst ariaCalendarProps = calendarProps as unknown as Omit<AriaCalendarProps<T>, \"children\" | \"className\" | \"isDisabled\" | \"isInvalid\" | \"isReadOnly\" | \"onChange\">;\n\n\treturn (\n\t\t<LocaleBoundary locale={locale}>\n\t\t\t<AriaCalendar\n\t\t\t\t{...ariaCalendarProps}\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"lyds-calendar\", className)}\n\t\t\t\t{...(disabled === undefined ? {} : { isDisabled: disabled })}\n\t\t\t\t{...(readOnly === undefined ? {} : { isReadOnly: readOnly })}\n\t\t\t\t{...(invalid === undefined ? {} : { isInvalid: invalid })}\n\t\t\t\t{...(onValueChange === undefined ? {} : { onChange: onValueChange as unknown as NonNullable<AriaCalendarProps<T>[\"onChange\"]> })}\n\t\t\t>\n\t\t\t\t<CalendarPanel weekdayStyle={weekdayStyle} disabled={disabled} />\n\t\t\t</AriaCalendar>\n\t\t</LocaleBoundary>\n\t);\n}\n\nexport const Calendar = forwardRef(CalendarImpl) as <T extends LydsDateValue = CalendarDate>(props: CalendarProps<T> & RefAttributes<HTMLDivElement>) => ReactElement | null;\n"],"mappings":";;;;;;;;;;AA0CA,SAAgB,EAAmB,EAAE,0BAAuB,IAAM,eAA2E;CAC5I,OACC,kBAAA,GAAA,EAAA,UAAA,CACC,kBAAC,OAAD;EAAK,WAAU;EAAf,UAAA;GACC,kBAAC,GAAD;IAAQ,MAAK;IAAW,WAAU;IACjC,UAAA,kBAAC,GAAD;KAAe,eAAY;KAAO,WAAU;KAAkB,QAAO;IAAQ,CAAA;GACtE,CAAA;GACR,kBAAC,GAAD,EAAiB,WAAU,wBAAyB,CAAA;GACpD,kBAAC,GAAD;IAAQ,MAAK;IAAO,WAAU;IAC7B,UAAA,kBAAC,GAAD;KAAgB,eAAY;KAAO,WAAU;KAAkB,QAAO;IAAQ,CAAA;GACvE,CAAA;EACJ;CACJ,CAAA,GAAA,IACA,kBAAC,OAAD;EAAK,WAAU;EAAf,UAAA,CACC,kBAAC,GAAD,EAAA,WACG,EAAE,UAAO,UAAO,aAAU,GAAG,QAC9B,kBAAC,UAAD;GAAQ,GAAI;GAAW,WAAU;GAA8B,OAAO,OAAO,CAAK;GAAa;GAAU,WAAU,MAAS,EAAS,OAAO,EAAM,cAAc,KAAK,CAAC;GACpK,UAAA,EAAM,KAAI,MACV,kBAAC,UAAD;IAAsB,OAAO,EAAK;IAChC,UAAA,EAAK;GACC,GAFK,EAAK,EAEV,CACR;EACM,CAAA,EAEW,CAAA,GACrB,kBAAC,GAAD,EAAA,WACG,EAAE,UAAO,UAAO,aAAU,GAAG,QAC9B,kBAAC,UAAD;GAAQ,GAAI;GAAW,WAAU;GAA8B,OAAO,OAAO,CAAK;GAAa;GAAU,WAAU,MAAS,EAAS,OAAO,EAAM,cAAc,KAAK,CAAC;GACpK,UAAA,EAAM,KAAI,MACV,kBAAC,UAAD;IAAsB,OAAO,EAAK;IAChC,UAAA,EAAK;GACC,GAFK,EAAK,EAEV,CACR;EACM,CAAA,EAEU,CAAA,CAChB;CACF,CAAA,IAAA,IACH,EAAA,CAAA;AAEJ;AAEA,SAAgB,EAAiB,EAAE,kBAAe,WAAqD;CACtG,OACC,kBAAC,GAAD;EAA4B;EAAc,WAAU;EAApD,UAAA,CACC,kBAAC,GAAD,EAAA,WAAqB,MAAO,kBAAC,GAAD;GAAoB,WAAU;GAAyB,UAAA;EAAwB,CAAA,EAAsB,CAAA,GACjI,kBAAC,GAAD,EAAA,WAAmB,MAAQ,kBAAC,GAAD;GAAoB;GAAM,WAAU;EAAsB,CAAA,EAAoB,CAAA,CAC5F;;AAEhB;AAEA,SAAgB,EAAc,EAAE,iBAAc,yBAAsB,aAAU,gBAAiC;CAC9G,OACC,kBAAC,OAAD;EAAK,WAAW,EAAG,uBAAuB,CAAS;EAAnD,UAAA,CACC,kBAAC,GAAD;GAA0C;GAAgC;EAAW,CAAA,GACrF,kBAAC,GAAD,EAAgC,gBAAe,CAAA,CAC3C;;AAEP;AAEA,SAAS,EACR,EAAE,WAAQ,cAAW,aAAU,aAAU,YAAS,kBAAe,iBAAc,GAAG,KAClF,GACC;CAGD,OACC,kBAAC,GAAD;EAAwB;EACvB,UAAA,kBAAC,GAAD;GACC,GAAI;GACC;GACL,WAAW,EAAG,iBAAiB,CAAS;GACxC,GAAK,MAAa,KAAA,IAAY,CAAC,IAAI,EAAE,YAAY,EAAS;GAC1D,GAAK,MAAa,KAAA,IAAY,CAAC,IAAI,EAAE,YAAY,EAAS;GAC1D,GAAK,MAAY,KAAA,IAAY,CAAC,IAAI,EAAE,WAAW,EAAQ;GACvD,GAAK,MAAkB,KAAA,IAAY,CAAC,IAAI,EAAE,UAAU,EAA0E;GAE9H,UAAA,kBAAC,GAAD;IAA6B;IAAwB;GAAW,CAAA;EACnD,CAAA;CACC,CAAA;AAElB;AAEA,IAAa,IAAW,EAAW,CAAY"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"date-field.js","names":[],"sources":["../../../src/components/date-time/date-field.tsx"],"sourcesContent":["import { cx } from \"@/internal\";\nimport type { CalendarDate } from \"@internationalized/date\";\nimport { forwardRef, type ReactElement, type RefAttributes } from \"react\";\nimport { DateField as AriaDateField, DateInput, DateSegment, type DateFieldProps as AriaDateFieldProps } from \"react-aria-components/DateField\";\nimport type { DateFieldBehaviorProps, DateValue as LydsDateValue } from \"./date-types\";\nimport { FieldLabel, FieldMessages, LocaleBoundary, type DateTimeFieldChromeProps } from \"./shared\";\nexport interface DateFieldProps<T extends LydsDateValue = CalendarDate> extends DateFieldBehaviorProps<T>, DateTimeFieldChromeProps {}\n\ntype DateFieldForwardedKeys = Exclude<keyof DateFieldBehaviorProps<LydsDateValue>, \"disabled\" | \"invalid\" | \"onValueChange\" | \"readOnly\" | \"required\">;\ntype DateFieldUnexpectedForwardedKeys = Exclude<DateFieldForwardedKeys, keyof AriaDateFieldProps<LydsDateValue>>;\ntype DateFieldPropContract = DateFieldUnexpectedForwardedKeys extends never ? true : never;\nconst dateFieldPropContract: DateFieldPropContract = true;\nvoid dateFieldPropContract;\n\nexport function DateInputSegments({ className, slot }: { className?: string; slot?: string }) {\n\treturn (\n\t\t<DateInput className={cx(\"lyds-date-input\", className)} {...(slot ? { slot } : {})}>\n\t\t\t{segment => <DateSegment segment={segment} className=\"lyds-date-segment\" />}\n\t\t</DateInput>\n\t);\n}\n\nfunction DateFieldImpl<T extends LydsDateValue>(\n\t{ label, description, error, locale, size = \"md\", className, disabled, readOnly, required, invalid, onValueChange, ...fieldProps }: DateFieldProps<T>,\n\tref: React.ForwardedRef<HTMLDivElement>\n) {\n\tconst ariaFieldProps = fieldProps as unknown as Omit<AriaDateFieldProps<T>, \"children\" | \"className\" | \"isDisabled\" | \"isInvalid\" | \"isReadOnly\" | \"isRequired\" | \"onChange\">;\n\n\treturn (\n\t\t<LocaleBoundary locale={locale}>\n\t\t\t<AriaDateField\n\t\t\t\t{...ariaFieldProps}\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"lyds-date-field\", className)}\n\t\t\t\tdata-size={size}\n\t\t\t\t{...(disabled === undefined ? {} : { isDisabled: disabled })}\n\t\t\t\t{...(readOnly === undefined ? {} : { isReadOnly: readOnly })}\n\t\t\t\t{...(required === undefined ? {} : { isRequired: required })}\n\t\t\t\t{...(invalid === undefined ? {} : { isInvalid: invalid })}\n\t\t\t\t{...(onValueChange === undefined ? {} : { onChange: onValueChange as unknown as NonNullable<AriaDateFieldProps<T>[\"onChange\"]> })}\n\t\t\t>\n\t\t\t\t<FieldLabel>{label}</FieldLabel>\n\t\t\t\t<DateInputSegments />\n\t\t\t\t<FieldMessages description={description} error={error} />\n\t\t\t</AriaDateField>\n\t\t</LocaleBoundary>\n\t);\n}\n\nexport const DateField = forwardRef(DateFieldImpl) as <T extends LydsDateValue = CalendarDate>(props: DateFieldProps<T> & RefAttributes<HTMLDivElement>) => ReactElement | null;\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"date-field.js","names":[],"sources":["../../../src/components/date-time/date-field.tsx"],"sourcesContent":["import { cx } from \"@/internal\";\nimport type { CalendarDate } from \"@internationalized/date\";\nimport { forwardRef, type ReactElement, type RefAttributes } from \"react\";\nimport { DateField as AriaDateField, DateInput, DateSegment, type DateFieldProps as AriaDateFieldProps } from \"react-aria-components/DateField\";\nimport type { DateFieldBehaviorProps, DateValue as LydsDateValue } from \"./date-types\";\nimport { FieldLabel, FieldMessages, LocaleBoundary, type DateTimeFieldChromeProps } from \"./shared\";\nexport interface DateFieldProps<T extends LydsDateValue = CalendarDate> extends DateFieldBehaviorProps<T>, DateTimeFieldChromeProps {}\n\ntype DateFieldForwardedKeys = Exclude<keyof DateFieldBehaviorProps<LydsDateValue>, \"disabled\" | \"invalid\" | \"onValueChange\" | \"readOnly\" | \"required\">;\ntype DateFieldUnexpectedForwardedKeys = Exclude<DateFieldForwardedKeys, keyof AriaDateFieldProps<LydsDateValue>>;\ntype DateFieldPropContract = DateFieldUnexpectedForwardedKeys extends never ? true : never;\nconst dateFieldPropContract: DateFieldPropContract = true;\nvoid dateFieldPropContract;\n\nexport function DateInputSegments({ className, slot }: { className?: string; slot?: string }) {\n\treturn (\n\t\t<DateInput className={cx(\"lyds-date-input\", className)} {...(slot ? { slot } : {})}>\n\t\t\t{segment => <DateSegment segment={segment} className=\"lyds-date-segment\" />}\n\t\t</DateInput>\n\t);\n}\n\nfunction DateFieldImpl<T extends LydsDateValue>(\n\t{ label, description, error, locale, size = \"md\", className, disabled, readOnly, required, invalid, onValueChange, ...fieldProps }: DateFieldProps<T>,\n\tref: React.ForwardedRef<HTMLDivElement>\n) {\n\tconst ariaFieldProps = fieldProps as unknown as Omit<AriaDateFieldProps<T>, \"children\" | \"className\" | \"isDisabled\" | \"isInvalid\" | \"isReadOnly\" | \"isRequired\" | \"onChange\">;\n\n\treturn (\n\t\t<LocaleBoundary locale={locale}>\n\t\t\t<AriaDateField\n\t\t\t\t{...ariaFieldProps}\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"lyds-date-field\", className)}\n\t\t\t\tdata-size={size}\n\t\t\t\t{...(disabled === undefined ? {} : { isDisabled: disabled })}\n\t\t\t\t{...(readOnly === undefined ? {} : { isReadOnly: readOnly })}\n\t\t\t\t{...(required === undefined ? {} : { isRequired: required })}\n\t\t\t\t{...(invalid === undefined ? {} : { isInvalid: invalid })}\n\t\t\t\t{...(onValueChange === undefined ? {} : { onChange: onValueChange as unknown as NonNullable<AriaDateFieldProps<T>[\"onChange\"]> })}\n\t\t\t>\n\t\t\t\t<FieldLabel>{label}</FieldLabel>\n\t\t\t\t<DateInputSegments />\n\t\t\t\t<FieldMessages description={description} error={error} />\n\t\t\t</AriaDateField>\n\t\t</LocaleBoundary>\n\t);\n}\n\nexport const DateField = forwardRef(DateFieldImpl) as <T extends LydsDateValue = CalendarDate>(props: DateFieldProps<T> & RefAttributes<HTMLDivElement>) => ReactElement | null;\n"],"mappings":";;;;;;;AAcA,SAAgB,EAAkB,EAAE,cAAW,WAA+C;CAC7F,OACC,kBAAC,GAAD;EAAW,WAAW,EAAG,mBAAmB,CAAS;EAAG,GAAK,IAAO,EAAE,QAAK,IAAI,CAAC;EAC9E,WAAA,MAAW,kBAAC,GAAD;GAAsB;GAAS,WAAU;EAAqB,CAAA;CAChE,CAAA;AAEb;AAEA,SAAS,EACR,EAAE,UAAO,gBAAa,UAAO,WAAQ,UAAO,MAAM,cAAW,aAAU,aAAU,aAAU,YAAS,kBAAe,GAAG,KACtH,GACC;CAGD,OACC,kBAAC,GAAD;EAAwB;EACvB,UAAA,kBAAC,GAAD;GACC,GAAI;GACC;GACL,WAAW,EAAG,mBAAmB,CAAS;GAC1C,aAAW;GACX,GAAK,MAAa,KAAA,IAAY,CAAC,IAAI,EAAE,YAAY,EAAS;GAC1D,GAAK,MAAa,KAAA,IAAY,CAAC,IAAI,EAAE,YAAY,EAAS;GAC1D,GAAK,MAAa,KAAA,IAAY,CAAC,IAAI,EAAE,YAAY,EAAS;GAC1D,GAAK,MAAY,KAAA,IAAY,CAAC,IAAI,EAAE,WAAW,EAAQ;GACvD,GAAK,MAAkB,KAAA,IAAY,CAAC,IAAI,EAAE,UAAU,EAA2E;GAThI,UAAA;IAWC,kBAAC,GAAD,EAAA,UAAa,EAAkB,CAAA;IAC/B,kBAAC,GAAD,CAAoB,CAAA;IACpB,kBAAC,GAAD;KAA4B;KAAoB;IAAQ,CAAA;GAC1C;;CACA,CAAA;AAElB;AAEA,IAAa,IAAY,EAAW,CAAa"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"date-picker.js","names":[],"sources":["../../../src/components/date-time/date-picker.tsx"],"sourcesContent":["import { cx } from \"@/internal\";\nimport type { CalendarDate, CalendarDateTime, ZonedDateTime } from \"@internationalized/date\";\nimport { forwardRef, type ReactElement, type RefAttributes } from \"react\";\nimport { Button } from \"react-aria-components/Button\";\nimport { Calendar as AriaCalendar } from \"react-aria-components/Calendar\";\nimport { DatePicker as AriaDatePicker, type DatePickerProps as AriaDatePickerProps } from \"react-aria-components/DatePicker\";\nimport { Dialog } from \"react-aria-components/Dialog\";\nimport { Group } from \"react-aria-components/Group\";\nimport { Popover } from \"react-aria-components/Popover\";\nimport { CalendarPanel, type WeekdayStyle } from \"./calendar\";\nimport { DateInputSegments } from \"./date-field\";\nimport type { DatePickerBehaviorProps, DatePopoverPlacement, DateValue as LydsDateValue } from \"./date-types\";\nimport { CalendarGlyph, FieldLabel, FieldMessages, LocaleBoundary, type DateTimeFieldChromeProps } from \"./shared\";\ninterface DatePickerChromeProps extends DateTimeFieldChromeProps {\n\topen?: boolean;\n\tdisabled?: boolean;\n\treadOnly?: boolean;\n\trequired?: boolean;\n\tinvalid?: boolean;\n\tweekdayStyle?: WeekdayStyle | undefined;\n\tshowMonthYearPickers?: boolean | undefined;\n\tpopoverPlacement?: DatePopoverPlacement | undefined;\n}\n\nexport interface DatePickerProps<T extends LydsDateValue = CalendarDate> extends DatePickerBehaviorProps<T>, DatePickerChromeProps {}\n\ntype DatePickerForwardedKeys = Exclude<keyof DatePickerBehaviorProps<LydsDateValue>, \"disabled\" | \"invalid\" | \"onValueChange\" | \"open\" | \"readOnly\" | \"required\">;\ntype DatePickerUnexpectedForwardedKeys = Exclude<DatePickerForwardedKeys, keyof AriaDatePickerProps<LydsDateValue>>;\ntype DatePickerPropContract = DatePickerUnexpectedForwardedKeys extends never ? true : never;\nconst datePickerPropContract: DatePickerPropContract = true;\nvoid datePickerPropContract;\n\n/**\n * 日期時間值保留自身語意。不含時區的日期時間請使用 `CalendarDateTime`;\n * 具明確時區的時間點請使用 `ZonedDateTime`。Linyao Design System 不會在兩者之間自動轉換。\n */\nexport type DateTimeValue = CalendarDateTime | ZonedDateTime;\n\nexport interface DateTimePickerProps<T extends DateTimeValue = CalendarDateTime> extends Omit<DatePickerProps<T>, \"granularity\"> {\n\tgranularity?: \"hour\" | \"minute\" | \"second\";\n}\n\nfunction SingleDatePicker<T extends LydsDateValue>(\n\t{\n\t\tlabel,\n\t\tdescription,\n\t\terror,\n\t\tlocale,\n\t\tsize = \"md\",\n\t\tclassName,\n\t\topen,\n\t\tdisabled,\n\t\treadOnly,\n\t\trequired,\n\t\tinvalid,\n\t\tonValueChange,\n\t\tfirstDayOfWeek,\n\t\tweekdayStyle,\n\t\tshowMonthYearPickers,\n\t\tpopoverPlacement = \"bottom start\",\n\t\t...pickerProps\n\t}: DatePickerProps<T>,\n\tref: React.ForwardedRef<HTMLDivElement>,\n\tdateTime: boolean\n) {\n\tconst ariaPickerProps = pickerProps as unknown as Omit<AriaDatePickerProps<T>, \"children\" | \"className\" | \"isDisabled\" | \"isInvalid\" | \"isOpen\" | \"isReadOnly\" | \"isRequired\" | \"onChange\">;\n\n\treturn (\n\t\t<LocaleBoundary locale={locale}>\n\t\t\t<AriaDatePicker\n\t\t\t\t{...ariaPickerProps}\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"lyds-date-field\", \"lyds-date-picker\", dateTime && \"lyds-date-time-picker\", className)}\n\t\t\t\tdata-size={size}\n\t\t\t\t{...(open === undefined ? {} : { isOpen: open })}\n\t\t\t\t{...(disabled === undefined ? {} : { isDisabled: disabled })}\n\t\t\t\t{...(readOnly === undefined ? {} : { isReadOnly: readOnly })}\n\t\t\t\t{...(required === undefined ? {} : { isRequired: required })}\n\t\t\t\t{...(invalid === undefined ? {} : { isInvalid: invalid })}\n\t\t\t\t{...(onValueChange === undefined ? {} : { onChange: onValueChange as unknown as NonNullable<AriaDatePickerProps<T>[\"onChange\"]> })}\n\t\t\t\t{...(firstDayOfWeek === undefined ? {} : { firstDayOfWeek })}\n\t\t\t>\n\t\t\t\t<FieldLabel>{label}</FieldLabel>\n\t\t\t\t<Group className=\"lyds-date-picker-group\">\n\t\t\t\t\t<DateInputSegments className=\"lyds-date-picker-input\" />\n\t\t\t\t\t<Button className=\"lyds-date-picker-button\">\n\t\t\t\t\t\t<CalendarGlyph />\n\t\t\t\t\t</Button>\n\t\t\t\t</Group>\n\t\t\t\t<FieldMessages description={description} error={error} />\n\t\t\t\t<Popover className=\"lyds-date-popover\" placement={popoverPlacement}>\n\t\t\t\t\t<Dialog className=\"lyds-date-popover-dialog\">\n\t\t\t\t\t\t<AriaCalendar className=\"lyds-calendar\" {...(firstDayOfWeek === undefined ? {} : { firstDayOfWeek })}>\n\t\t\t\t\t\t\t<CalendarPanel weekdayStyle={weekdayStyle} showMonthYearPickers={showMonthYearPickers} disabled={disabled} />\n\t\t\t\t\t\t</AriaCalendar>\n\t\t\t\t\t</Dialog>\n\t\t\t\t</Popover>\n\t\t\t</AriaDatePicker>\n\t\t</LocaleBoundary>\n\t);\n}\n\nfunction DatePickerImpl<T extends LydsDateValue>(props: DatePickerProps<T>, ref: React.ForwardedRef<HTMLDivElement>) {\n\treturn SingleDatePicker(props, ref, false);\n}\n\nfunction DateTimePickerImpl<T extends DateTimeValue>(props: DateTimePickerProps<T>, ref: React.ForwardedRef<HTMLDivElement>) {\n\treturn SingleDatePicker({ ...props, granularity: props.granularity ?? \"minute\" }, ref, true);\n}\n\nexport const DatePicker = forwardRef(DatePickerImpl) as <T extends LydsDateValue = CalendarDate>(props: DatePickerProps<T> & RefAttributes<HTMLDivElement>) => ReactElement | null;\n\nexport const DateTimePicker = forwardRef(DateTimePickerImpl) as <T extends DateTimeValue = CalendarDateTime>(props: DateTimePickerProps<T> & RefAttributes<HTMLDivElement>) => ReactElement | null;\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"date-picker.js","names":[],"sources":["../../../src/components/date-time/date-picker.tsx"],"sourcesContent":["import { cx } from \"@/internal\";\nimport type { CalendarDate, CalendarDateTime, ZonedDateTime } from \"@internationalized/date\";\nimport { forwardRef, type ReactElement, type RefAttributes } from \"react\";\nimport { Button } from \"react-aria-components/Button\";\nimport { Calendar as AriaCalendar } from \"react-aria-components/Calendar\";\nimport { DatePicker as AriaDatePicker, type DatePickerProps as AriaDatePickerProps } from \"react-aria-components/DatePicker\";\nimport { Dialog } from \"react-aria-components/Dialog\";\nimport { Group } from \"react-aria-components/Group\";\nimport { Popover } from \"react-aria-components/Popover\";\nimport { CalendarPanel, type WeekdayStyle } from \"./calendar\";\nimport { DateInputSegments } from \"./date-field\";\nimport type { DatePickerBehaviorProps, DatePopoverPlacement, DateValue as LydsDateValue } from \"./date-types\";\nimport { CalendarGlyph, FieldLabel, FieldMessages, LocaleBoundary, type DateTimeFieldChromeProps } from \"./shared\";\ninterface DatePickerChromeProps extends DateTimeFieldChromeProps {\n\topen?: boolean;\n\tdisabled?: boolean;\n\treadOnly?: boolean;\n\trequired?: boolean;\n\tinvalid?: boolean;\n\tweekdayStyle?: WeekdayStyle | undefined;\n\tshowMonthYearPickers?: boolean | undefined;\n\tpopoverPlacement?: DatePopoverPlacement | undefined;\n}\n\nexport interface DatePickerProps<T extends LydsDateValue = CalendarDate> extends DatePickerBehaviorProps<T>, DatePickerChromeProps {}\n\ntype DatePickerForwardedKeys = Exclude<keyof DatePickerBehaviorProps<LydsDateValue>, \"disabled\" | \"invalid\" | \"onValueChange\" | \"open\" | \"readOnly\" | \"required\">;\ntype DatePickerUnexpectedForwardedKeys = Exclude<DatePickerForwardedKeys, keyof AriaDatePickerProps<LydsDateValue>>;\ntype DatePickerPropContract = DatePickerUnexpectedForwardedKeys extends never ? true : never;\nconst datePickerPropContract: DatePickerPropContract = true;\nvoid datePickerPropContract;\n\n/**\n * 日期時間值保留自身語意。不含時區的日期時間請使用 `CalendarDateTime`;\n * 具明確時區的時間點請使用 `ZonedDateTime`。Linyao Design System 不會在兩者之間自動轉換。\n */\nexport type DateTimeValue = CalendarDateTime | ZonedDateTime;\n\nexport interface DateTimePickerProps<T extends DateTimeValue = CalendarDateTime> extends Omit<DatePickerProps<T>, \"granularity\"> {\n\tgranularity?: \"hour\" | \"minute\" | \"second\";\n}\n\nfunction SingleDatePicker<T extends LydsDateValue>(\n\t{\n\t\tlabel,\n\t\tdescription,\n\t\terror,\n\t\tlocale,\n\t\tsize = \"md\",\n\t\tclassName,\n\t\topen,\n\t\tdisabled,\n\t\treadOnly,\n\t\trequired,\n\t\tinvalid,\n\t\tonValueChange,\n\t\tfirstDayOfWeek,\n\t\tweekdayStyle,\n\t\tshowMonthYearPickers,\n\t\tpopoverPlacement = \"bottom start\",\n\t\t...pickerProps\n\t}: DatePickerProps<T>,\n\tref: React.ForwardedRef<HTMLDivElement>,\n\tdateTime: boolean\n) {\n\tconst ariaPickerProps = pickerProps as unknown as Omit<AriaDatePickerProps<T>, \"children\" | \"className\" | \"isDisabled\" | \"isInvalid\" | \"isOpen\" | \"isReadOnly\" | \"isRequired\" | \"onChange\">;\n\n\treturn (\n\t\t<LocaleBoundary locale={locale}>\n\t\t\t<AriaDatePicker\n\t\t\t\t{...ariaPickerProps}\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"lyds-date-field\", \"lyds-date-picker\", dateTime && \"lyds-date-time-picker\", className)}\n\t\t\t\tdata-size={size}\n\t\t\t\t{...(open === undefined ? {} : { isOpen: open })}\n\t\t\t\t{...(disabled === undefined ? {} : { isDisabled: disabled })}\n\t\t\t\t{...(readOnly === undefined ? {} : { isReadOnly: readOnly })}\n\t\t\t\t{...(required === undefined ? {} : { isRequired: required })}\n\t\t\t\t{...(invalid === undefined ? {} : { isInvalid: invalid })}\n\t\t\t\t{...(onValueChange === undefined ? {} : { onChange: onValueChange as unknown as NonNullable<AriaDatePickerProps<T>[\"onChange\"]> })}\n\t\t\t\t{...(firstDayOfWeek === undefined ? {} : { firstDayOfWeek })}\n\t\t\t>\n\t\t\t\t<FieldLabel>{label}</FieldLabel>\n\t\t\t\t<Group className=\"lyds-date-picker-group\">\n\t\t\t\t\t<DateInputSegments className=\"lyds-date-picker-input\" />\n\t\t\t\t\t<Button className=\"lyds-date-picker-button\">\n\t\t\t\t\t\t<CalendarGlyph />\n\t\t\t\t\t</Button>\n\t\t\t\t</Group>\n\t\t\t\t<FieldMessages description={description} error={error} />\n\t\t\t\t<Popover className=\"lyds-date-popover\" placement={popoverPlacement}>\n\t\t\t\t\t<Dialog className=\"lyds-date-popover-dialog\">\n\t\t\t\t\t\t<AriaCalendar className=\"lyds-calendar\" {...(firstDayOfWeek === undefined ? {} : { firstDayOfWeek })}>\n\t\t\t\t\t\t\t<CalendarPanel weekdayStyle={weekdayStyle} showMonthYearPickers={showMonthYearPickers} disabled={disabled} />\n\t\t\t\t\t\t</AriaCalendar>\n\t\t\t\t\t</Dialog>\n\t\t\t\t</Popover>\n\t\t\t</AriaDatePicker>\n\t\t</LocaleBoundary>\n\t);\n}\n\nfunction DatePickerImpl<T extends LydsDateValue>(props: DatePickerProps<T>, ref: React.ForwardedRef<HTMLDivElement>) {\n\treturn SingleDatePicker(props, ref, false);\n}\n\nfunction DateTimePickerImpl<T extends DateTimeValue>(props: DateTimePickerProps<T>, ref: React.ForwardedRef<HTMLDivElement>) {\n\treturn SingleDatePicker({ ...props, granularity: props.granularity ?? \"minute\" }, ref, true);\n}\n\nexport const DatePicker = forwardRef(DatePickerImpl) as <T extends LydsDateValue = CalendarDate>(props: DatePickerProps<T> & RefAttributes<HTMLDivElement>) => ReactElement | null;\n\nexport const DateTimePicker = forwardRef(DateTimePickerImpl) as <T extends DateTimeValue = CalendarDateTime>(props: DateTimePickerProps<T> & RefAttributes<HTMLDivElement>) => ReactElement | null;\n"],"mappings":";;;;;;;;;;;;;;AA0CA,SAAS,EACR,EACC,UACA,gBACA,UACA,WACA,UAAO,MACP,cACA,SACA,aACA,aACA,aACA,YACA,kBACA,mBACA,iBACA,yBACA,sBAAmB,gBACnB,GAAG,KAEJ,GACA,GACC;CAGD,OACC,kBAAC,GAAD;EAAwB;EACvB,UAAA,kBAAC,GAAD;GACC,GAAI;GACC;GACL,WAAW,EAAG,mBAAmB,oBAAoB,KAAY,yBAAyB,CAAS;GACnG,aAAW;GACX,GAAK,MAAS,KAAA,IAAY,CAAC,IAAI,EAAE,QAAQ,EAAK;GAC9C,GAAK,MAAa,KAAA,IAAY,CAAC,IAAI,EAAE,YAAY,EAAS;GAC1D,GAAK,MAAa,KAAA,IAAY,CAAC,IAAI,EAAE,YAAY,EAAS;GAC1D,GAAK,MAAa,KAAA,IAAY,CAAC,IAAI,EAAE,YAAY,EAAS;GAC1D,GAAK,MAAY,KAAA,IAAY,CAAC,IAAI,EAAE,WAAW,EAAQ;GACvD,GAAK,MAAkB,KAAA,IAAY,CAAC,IAAI,EAAE,UAAU,EAA4E;GAChI,GAAK,MAAmB,KAAA,IAAY,CAAC,IAAI,EAAE,kBAAe;GAX3D,UAAA;IAaC,kBAAC,GAAD,EAAA,UAAa,EAAkB,CAAA;IAC/B,kBAAC,GAAD;KAAO,WAAU;KAAjB,UAAA,CACC,kBAAC,GAAD,EAAmB,WAAU,yBAA0B,CAAA,GACvD,kBAAC,GAAD;MAAQ,WAAU;MACjB,UAAA,kBAAC,GAAD,CAAgB,CAAA;KACT,CAAA,CACF;;IACP,kBAAC,GAAD;KAA4B;KAAoB;IAAQ,CAAA;IACxD,kBAAC,GAAD;KAAS,WAAU;KAAoB,WAAW;KACjD,UAAA,kBAAC,GAAD;MAAQ,WAAU;MACjB,UAAA,kBAAC,GAAD;OAAc,WAAU;OAAgB,GAAK,MAAmB,KAAA,IAAY,CAAC,IAAI,EAAE,kBAAe;OACjG,UAAA,kBAAC,GAAD;QAA6B;QAAoC;QAAgC;OAAW,CAAA;MAC/F,CAAA;KACP,CAAA;IACA,CAAA;GACM;;CACD,CAAA;AAElB;AAEA,SAAS,EAAwC,GAA2B,GAAyC;CACpH,OAAO,EAAiB,GAAO,GAAK,EAAK;AAC1C;AAEA,SAAS,EAA4C,GAA+B,GAAyC;CAC5H,OAAO,EAAiB;EAAE,GAAG;EAAO,aAAa,EAAM,eAAe;CAAS,GAAG,GAAK,EAAI;AAC5F;AAEA,IAAa,IAAa,EAAW,CAAc,GAEtC,IAAiB,EAAW,CAAkB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"date-range-picker.js","names":[],"sources":["../../../src/components/date-time/date-range-picker.tsx"],"sourcesContent":["import { cx } from \"@/internal\";\nimport type { CalendarDate } from \"@internationalized/date\";\nimport { forwardRef, type ReactElement, type RefAttributes } from \"react\";\nimport { Button } from \"react-aria-components/Button\";\nimport { DateRangePicker as AriaDateRangePicker, RangeCalendar, type DateRangePickerProps as AriaDateRangePickerProps } from \"react-aria-components/DateRangePicker\";\nimport { Dialog } from \"react-aria-components/Dialog\";\nimport { Group } from \"react-aria-components/Group\";\nimport { Popover } from \"react-aria-components/Popover\";\nimport { CalendarPanel, type WeekdayStyle } from \"./calendar\";\nimport { DateInputSegments } from \"./date-field\";\nimport type { DatePopoverPlacement, DateRangePickerBehaviorProps, DateValue as LydsDateValue } from \"./date-types\";\nimport { CalendarGlyph, FieldLabel, FieldMessages, LocaleBoundary, type DateTimeFieldChromeProps } from \"./shared\";\nexport interface DateRangePickerProps<T extends LydsDateValue = CalendarDate> extends DateRangePickerBehaviorProps<T>, DateTimeFieldChromeProps {\n\tweekdayStyle?: WeekdayStyle | undefined;\n\tshowMonthYearPickers?: boolean | undefined;\n\tpopoverPlacement?: DatePopoverPlacement | undefined;\n}\n\ntype DateRangePickerForwardedKeys = Exclude<keyof DateRangePickerBehaviorProps<LydsDateValue>, \"disabled\" | \"invalid\" | \"onValueChange\" | \"open\" | \"readOnly\" | \"required\">;\ntype DateRangePickerUnexpectedForwardedKeys = Exclude<DateRangePickerForwardedKeys, keyof AriaDateRangePickerProps<LydsDateValue>>;\ntype DateRangePickerPropContract = DateRangePickerUnexpectedForwardedKeys extends never ? true : never;\nconst dateRangePickerPropContract: DateRangePickerPropContract = true;\nvoid dateRangePickerPropContract;\n\nfunction DateRangePickerImpl<T extends LydsDateValue>(\n\t{\n\t\tlabel,\n\t\tdescription,\n\t\terror,\n\t\tlocale,\n\t\tsize = \"md\",\n\t\tclassName,\n\t\topen,\n\t\tdisabled,\n\t\treadOnly,\n\t\trequired,\n\t\tinvalid,\n\t\tonValueChange,\n\t\tfirstDayOfWeek,\n\t\tweekdayStyle,\n\t\tshowMonthYearPickers,\n\t\tpopoverPlacement = \"bottom start\",\n\t\t...pickerProps\n\t}: DateRangePickerProps<T>,\n\tref: React.ForwardedRef<HTMLDivElement>\n) {\n\tconst ariaPickerProps = pickerProps as unknown as Omit<AriaDateRangePickerProps<T>, \"children\" | \"className\" | \"isDisabled\" | \"isInvalid\" | \"isOpen\" | \"isReadOnly\" | \"isRequired\" | \"onChange\">;\n\n\treturn (\n\t\t<LocaleBoundary locale={locale}>\n\t\t\t<AriaDateRangePicker\n\t\t\t\t{...ariaPickerProps}\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"lyds-date-field\", \"lyds-date-picker\", \"lyds-date-range-picker\", className)}\n\t\t\t\tdata-size={size}\n\t\t\t\t{...(open === undefined ? {} : { isOpen: open })}\n\t\t\t\t{...(disabled === undefined ? {} : { isDisabled: disabled })}\n\t\t\t\t{...(readOnly === undefined ? {} : { isReadOnly: readOnly })}\n\t\t\t\t{...(required === undefined ? {} : { isRequired: required })}\n\t\t\t\t{...(invalid === undefined ? {} : { isInvalid: invalid })}\n\t\t\t\t{...(onValueChange === undefined ? {} : { onChange: onValueChange as unknown as NonNullable<AriaDateRangePickerProps<T>[\"onChange\"]> })}\n\t\t\t\t{...(firstDayOfWeek === undefined ? {} : { firstDayOfWeek })}\n\t\t\t>\n\t\t\t\t<FieldLabel>{label}</FieldLabel>\n\t\t\t\t<Group className=\"lyds-date-picker-group\">\n\t\t\t\t\t<DateInputSegments className=\"lyds-date-picker-input\" slot=\"start\" />\n\t\t\t\t\t<span className=\"lyds-date-range-separator\" aria-hidden=\"true\">\n\t\t\t\t\t\t–\n\t\t\t\t\t</span>\n\t\t\t\t\t<DateInputSegments className=\"lyds-date-picker-input\" slot=\"end\" />\n\t\t\t\t\t<Button className=\"lyds-date-picker-button\">\n\t\t\t\t\t\t<CalendarGlyph />\n\t\t\t\t\t</Button>\n\t\t\t\t</Group>\n\t\t\t\t<FieldMessages description={description} error={error} />\n\t\t\t\t<Popover className=\"lyds-date-popover\" placement={popoverPlacement}>\n\t\t\t\t\t<Dialog className=\"lyds-date-popover-dialog\">\n\t\t\t\t\t\t<RangeCalendar className=\"lyds-calendar lyds-range-calendar\" {...(firstDayOfWeek === undefined ? {} : { firstDayOfWeek })}>\n\t\t\t\t\t\t\t<CalendarPanel weekdayStyle={weekdayStyle} showMonthYearPickers={showMonthYearPickers} disabled={disabled} />\n\t\t\t\t\t\t</RangeCalendar>\n\t\t\t\t\t</Dialog>\n\t\t\t\t</Popover>\n\t\t\t</AriaDateRangePicker>\n\t\t</LocaleBoundary>\n\t);\n}\n\nexport const DateRangePicker = forwardRef(DateRangePickerImpl) as <T extends LydsDateValue = CalendarDate>(props: DateRangePickerProps<T> & RefAttributes<HTMLDivElement>) => ReactElement | null;\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"date-range-picker.js","names":[],"sources":["../../../src/components/date-time/date-range-picker.tsx"],"sourcesContent":["import { cx } from \"@/internal\";\nimport type { CalendarDate } from \"@internationalized/date\";\nimport { forwardRef, type ReactElement, type RefAttributes } from \"react\";\nimport { Button } from \"react-aria-components/Button\";\nimport { DateRangePicker as AriaDateRangePicker, RangeCalendar, type DateRangePickerProps as AriaDateRangePickerProps } from \"react-aria-components/DateRangePicker\";\nimport { Dialog } from \"react-aria-components/Dialog\";\nimport { Group } from \"react-aria-components/Group\";\nimport { Popover } from \"react-aria-components/Popover\";\nimport { CalendarPanel, type WeekdayStyle } from \"./calendar\";\nimport { DateInputSegments } from \"./date-field\";\nimport type { DatePopoverPlacement, DateRangePickerBehaviorProps, DateValue as LydsDateValue } from \"./date-types\";\nimport { CalendarGlyph, FieldLabel, FieldMessages, LocaleBoundary, type DateTimeFieldChromeProps } from \"./shared\";\nexport interface DateRangePickerProps<T extends LydsDateValue = CalendarDate> extends DateRangePickerBehaviorProps<T>, DateTimeFieldChromeProps {\n\tweekdayStyle?: WeekdayStyle | undefined;\n\tshowMonthYearPickers?: boolean | undefined;\n\tpopoverPlacement?: DatePopoverPlacement | undefined;\n}\n\ntype DateRangePickerForwardedKeys = Exclude<keyof DateRangePickerBehaviorProps<LydsDateValue>, \"disabled\" | \"invalid\" | \"onValueChange\" | \"open\" | \"readOnly\" | \"required\">;\ntype DateRangePickerUnexpectedForwardedKeys = Exclude<DateRangePickerForwardedKeys, keyof AriaDateRangePickerProps<LydsDateValue>>;\ntype DateRangePickerPropContract = DateRangePickerUnexpectedForwardedKeys extends never ? true : never;\nconst dateRangePickerPropContract: DateRangePickerPropContract = true;\nvoid dateRangePickerPropContract;\n\nfunction DateRangePickerImpl<T extends LydsDateValue>(\n\t{\n\t\tlabel,\n\t\tdescription,\n\t\terror,\n\t\tlocale,\n\t\tsize = \"md\",\n\t\tclassName,\n\t\topen,\n\t\tdisabled,\n\t\treadOnly,\n\t\trequired,\n\t\tinvalid,\n\t\tonValueChange,\n\t\tfirstDayOfWeek,\n\t\tweekdayStyle,\n\t\tshowMonthYearPickers,\n\t\tpopoverPlacement = \"bottom start\",\n\t\t...pickerProps\n\t}: DateRangePickerProps<T>,\n\tref: React.ForwardedRef<HTMLDivElement>\n) {\n\tconst ariaPickerProps = pickerProps as unknown as Omit<AriaDateRangePickerProps<T>, \"children\" | \"className\" | \"isDisabled\" | \"isInvalid\" | \"isOpen\" | \"isReadOnly\" | \"isRequired\" | \"onChange\">;\n\n\treturn (\n\t\t<LocaleBoundary locale={locale}>\n\t\t\t<AriaDateRangePicker\n\t\t\t\t{...ariaPickerProps}\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"lyds-date-field\", \"lyds-date-picker\", \"lyds-date-range-picker\", className)}\n\t\t\t\tdata-size={size}\n\t\t\t\t{...(open === undefined ? {} : { isOpen: open })}\n\t\t\t\t{...(disabled === undefined ? {} : { isDisabled: disabled })}\n\t\t\t\t{...(readOnly === undefined ? {} : { isReadOnly: readOnly })}\n\t\t\t\t{...(required === undefined ? {} : { isRequired: required })}\n\t\t\t\t{...(invalid === undefined ? {} : { isInvalid: invalid })}\n\t\t\t\t{...(onValueChange === undefined ? {} : { onChange: onValueChange as unknown as NonNullable<AriaDateRangePickerProps<T>[\"onChange\"]> })}\n\t\t\t\t{...(firstDayOfWeek === undefined ? {} : { firstDayOfWeek })}\n\t\t\t>\n\t\t\t\t<FieldLabel>{label}</FieldLabel>\n\t\t\t\t<Group className=\"lyds-date-picker-group\">\n\t\t\t\t\t<DateInputSegments className=\"lyds-date-picker-input\" slot=\"start\" />\n\t\t\t\t\t<span className=\"lyds-date-range-separator\" aria-hidden=\"true\">\n\t\t\t\t\t\t–\n\t\t\t\t\t</span>\n\t\t\t\t\t<DateInputSegments className=\"lyds-date-picker-input\" slot=\"end\" />\n\t\t\t\t\t<Button className=\"lyds-date-picker-button\">\n\t\t\t\t\t\t<CalendarGlyph />\n\t\t\t\t\t</Button>\n\t\t\t\t</Group>\n\t\t\t\t<FieldMessages description={description} error={error} />\n\t\t\t\t<Popover className=\"lyds-date-popover\" placement={popoverPlacement}>\n\t\t\t\t\t<Dialog className=\"lyds-date-popover-dialog\">\n\t\t\t\t\t\t<RangeCalendar className=\"lyds-calendar lyds-range-calendar\" {...(firstDayOfWeek === undefined ? {} : { firstDayOfWeek })}>\n\t\t\t\t\t\t\t<CalendarPanel weekdayStyle={weekdayStyle} showMonthYearPickers={showMonthYearPickers} disabled={disabled} />\n\t\t\t\t\t\t</RangeCalendar>\n\t\t\t\t\t</Dialog>\n\t\t\t\t</Popover>\n\t\t\t</AriaDateRangePicker>\n\t\t</LocaleBoundary>\n\t);\n}\n\nexport const DateRangePicker = forwardRef(DateRangePickerImpl) as <T extends LydsDateValue = CalendarDate>(props: DateRangePickerProps<T> & RefAttributes<HTMLDivElement>) => ReactElement | null;\n"],"mappings":";;;;;;;;;;;;;AAwBA,SAAS,EACR,EACC,UACA,gBACA,UACA,WACA,UAAO,MACP,cACA,SACA,aACA,aACA,aACA,YACA,kBACA,mBACA,iBACA,yBACA,sBAAmB,gBACnB,GAAG,KAEJ,GACC;CAGD,OACC,kBAAC,GAAD;EAAwB;EACvB,UAAA,kBAAC,GAAD;GACC,GAAI;GACC;GACL,WAAW,EAAG,mBAAmB,oBAAoB,0BAA0B,CAAS;GACxF,aAAW;GACX,GAAK,MAAS,KAAA,IAAY,CAAC,IAAI,EAAE,QAAQ,EAAK;GAC9C,GAAK,MAAa,KAAA,IAAY,CAAC,IAAI,EAAE,YAAY,EAAS;GAC1D,GAAK,MAAa,KAAA,IAAY,CAAC,IAAI,EAAE,YAAY,EAAS;GAC1D,GAAK,MAAa,KAAA,IAAY,CAAC,IAAI,EAAE,YAAY,EAAS;GAC1D,GAAK,MAAY,KAAA,IAAY,CAAC,IAAI,EAAE,WAAW,EAAQ;GACvD,GAAK,MAAkB,KAAA,IAAY,CAAC,IAAI,EAAE,UAAU,EAAiF;GACrI,GAAK,MAAmB,KAAA,IAAY,CAAC,IAAI,EAAE,kBAAe;GAX3D,UAAA;IAaC,kBAAC,GAAD,EAAA,UAAa,EAAkB,CAAA;IAC/B,kBAAC,GAAD;KAAO,WAAU;KAAjB,UAAA;MACC,kBAAC,GAAD;OAAmB,WAAU;OAAyB,MAAK;MAAS,CAAA;MACpE,kBAAC,QAAD;OAAM,WAAU;OAA4B,eAAY;OAAO,UAAA;MAEzD,CAAA;MACN,kBAAC,GAAD;OAAmB,WAAU;OAAyB,MAAK;MAAO,CAAA;MAClE,kBAAC,GAAD;OAAQ,WAAU;OACjB,UAAA,kBAAC,GAAD,CAAgB,CAAA;MACT,CAAA;KACF;;IACP,kBAAC,GAAD;KAA4B;KAAoB;IAAQ,CAAA;IACxD,kBAAC,GAAD;KAAS,WAAU;KAAoB,WAAW;KACjD,UAAA,kBAAC,GAAD;MAAQ,WAAU;MACjB,UAAA,kBAAC,GAAD;OAAe,WAAU;OAAoC,GAAK,MAAmB,KAAA,IAAY,CAAC,IAAI,EAAE,kBAAe;OACtH,UAAA,kBAAC,GAAD;QAA6B;QAAoC;QAAgC;OAAW,CAAA;MAC9F,CAAA;KACR,CAAA;IACA,CAAA;GACW;;CACN,CAAA;AAElB;AAEA,IAAa,IAAkB,EAAW,CAAmB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"shared.js","names":[],"sources":["../../../src/components/date-time/shared.tsx"],"sourcesContent":["import { CalendarDotsIcon } from \"@phosphor-icons/react/dist/csr/CalendarDots\";\nimport { ClockIcon } from \"@phosphor-icons/react/dist/csr/Clock\";\nimport type { ReactNode } from \"react\";\nimport { FieldError } from \"react-aria-components/FieldError\";\nimport { I18nProvider } from \"react-aria-components/I18nProvider\";\nimport { Label } from \"react-aria-components/Label\";\nimport { Text } from \"react-aria-components/Text\";\n\nexport type DateTimeSize = \"sm\" | \"md\" | \"lg\";\n\nexport interface DateTimeFieldChromeProps {\n\t/** 欄位的可見標籤。不適合顯示可見標籤時,請改用 `aria-label`。 */\n\tlabel?: ReactNode;\n\t/** 透過 React Aria 與控制項關聯的補充說明。 */\n\tdescription?: ReactNode;\n\t/** 與控制項關聯的驗證訊息。 */\n\terror?: ReactNode;\n\t/** 用於區段順序、標籤與數字格式的 BCP 47 地區設定。省略時沿用最近的 `I18nProvider`。 */\n\tlocale?: string | undefined;\n\tsize?: DateTimeSize;\n\tclassName?: string;\n}\n\nexport function LocaleBoundary({ locale, children }: { locale?: string | undefined; children: ReactNode }) {\n\tif (!locale) {\n\t\treturn <>{children}</>;\n\t}\n\n\treturn <I18nProvider locale={locale}>{children}</I18nProvider>;\n}\n\nexport function FieldLabel({ children }: { children?: ReactNode }) {\n\treturn children == null ? null : <Label className=\"lyds-date-label\">{children}</Label>;\n}\n\nexport function FieldMessages({ description, error }: Pick<DateTimeFieldChromeProps, \"description\" | \"error\">) {\n\treturn (\n\t\t<>\n\t\t\t{description == null ? null : (\n\t\t\t\t<Text slot=\"description\" className=\"lyds-date-description\">\n\t\t\t\t\t{description}\n\t\t\t\t</Text>\n\t\t\t)}\n\t\t\t{error == null ? null : (\n\t\t\t\t<FieldError aria-atomic=\"true\" aria-live=\"polite\" className=\"lyds-date-error\">\n\t\t\t\t\t{error}\n\t\t\t\t</FieldError>\n\t\t\t)}\n\t\t</>\n\t);\n}\n\nexport function CalendarGlyph() {\n\treturn <CalendarDotsIcon aria-hidden=\"true\" className=\"lyds-date-glyph\" weight=\"regular\" />;\n}\n\nexport function ClockGlyph() {\n\treturn <ClockIcon aria-hidden=\"true\" className=\"lyds-date-glyph\" weight=\"regular\" />;\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"shared.js","names":[],"sources":["../../../src/components/date-time/shared.tsx"],"sourcesContent":["import { CalendarDotsIcon } from \"@phosphor-icons/react/dist/csr/CalendarDots\";\nimport { ClockIcon } from \"@phosphor-icons/react/dist/csr/Clock\";\nimport type { ReactNode } from \"react\";\nimport { FieldError } from \"react-aria-components/FieldError\";\nimport { I18nProvider } from \"react-aria-components/I18nProvider\";\nimport { Label } from \"react-aria-components/Label\";\nimport { Text } from \"react-aria-components/Text\";\n\nexport type DateTimeSize = \"sm\" | \"md\" | \"lg\";\n\nexport interface DateTimeFieldChromeProps {\n\t/** 欄位的可見標籤。不適合顯示可見標籤時,請改用 `aria-label`。 */\n\tlabel?: ReactNode;\n\t/** 透過 React Aria 與控制項關聯的補充說明。 */\n\tdescription?: ReactNode;\n\t/** 與控制項關聯的驗證訊息。 */\n\terror?: ReactNode;\n\t/** 用於區段順序、標籤與數字格式的 BCP 47 地區設定。省略時沿用最近的 `I18nProvider`。 */\n\tlocale?: string | undefined;\n\tsize?: DateTimeSize;\n\tclassName?: string;\n}\n\nexport function LocaleBoundary({ locale, children }: { locale?: string | undefined; children: ReactNode }) {\n\tif (!locale) {\n\t\treturn <>{children}</>;\n\t}\n\n\treturn <I18nProvider locale={locale}>{children}</I18nProvider>;\n}\n\nexport function FieldLabel({ children }: { children?: ReactNode }) {\n\treturn children == null ? null : <Label className=\"lyds-date-label\">{children}</Label>;\n}\n\nexport function FieldMessages({ description, error }: Pick<DateTimeFieldChromeProps, \"description\" | \"error\">) {\n\treturn (\n\t\t<>\n\t\t\t{description == null ? null : (\n\t\t\t\t<Text slot=\"description\" className=\"lyds-date-description\">\n\t\t\t\t\t{description}\n\t\t\t\t</Text>\n\t\t\t)}\n\t\t\t{error == null ? null : (\n\t\t\t\t<FieldError aria-atomic=\"true\" aria-live=\"polite\" className=\"lyds-date-error\">\n\t\t\t\t\t{error}\n\t\t\t\t</FieldError>\n\t\t\t)}\n\t\t</>\n\t);\n}\n\nexport function CalendarGlyph() {\n\treturn <CalendarDotsIcon aria-hidden=\"true\" className=\"lyds-date-glyph\" weight=\"regular\" />;\n}\n\nexport function ClockGlyph() {\n\treturn <ClockIcon aria-hidden=\"true\" className=\"lyds-date-glyph\" weight=\"regular\" />;\n}\n"],"mappings":";;;;;;;;;AAuBA,SAAgB,EAAe,EAAE,WAAQ,eAAkE;CAK1G,OAJK,IAIE,kBAAC,GAAD;EAAsB;EAAS;CAAuB,CAAA,IAHrD,kBAAA,GAAA,EAAG,YAAW,CAAA;AAIvB;AAEA,SAAgB,EAAW,EAAE,eAAsC;CAClE,OAAO,KAAY,OAAO,OAAO,kBAAC,GAAD;EAAO,WAAU;EAAmB;CAAgB,CAAA;AACtF;AAEA,SAAgB,EAAc,EAAE,gBAAa,YAAkE;CAC9G,OACC,kBAAA,GAAA,EAAA,UAAA,CACE,KAAe,OAAO,OACtB,kBAAC,GAAD;EAAM,MAAK;EAAc,WAAU;EACjC,UAAA;CACI,CAAA,GAEN,KAAS,OAAO,OAChB,kBAAC,GAAD;EAAY,eAAY;EAAO,aAAU;EAAS,WAAU;EAC1D,UAAA;CACU,CAAA,CAEZ,EAAA,CAAA;AAEJ;AAEA,SAAgB,IAAgB;CAC/B,OAAO,kBAAC,GAAD;EAAkB,eAAY;EAAO,WAAU;EAAkB,QAAO;CAAW,CAAA;AAC3F;AAEA,SAAgB,IAAa;CAC5B,OAAO,kBAAC,GAAD;EAAW,eAAY;EAAO,WAAU;EAAkB,QAAO;CAAW,CAAA;AACpF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"time-field.js","names":[],"sources":["../../../src/components/date-time/time-field.tsx"],"sourcesContent":["import { cx } from \"@/internal\";\nimport type { Time } from \"@internationalized/date\";\nimport { forwardRef, type ReactElement, type RefAttributes } from \"react\";\nimport { TimeField as AriaTimeField, DateInput, DateSegment, type TimeFieldProps as AriaTimeFieldProps } from \"react-aria-components/TimeField\";\nimport type { TimeValue as LydsTimeValue, TimeFieldBehaviorProps } from \"./date-types\";\nimport { ClockGlyph, FieldLabel, FieldMessages, LocaleBoundary, type DateTimeFieldChromeProps } from \"./shared\";\nexport interface TimeFieldProps<T extends LydsTimeValue = Time> extends TimeFieldBehaviorProps<T>, DateTimeFieldChromeProps {}\n\nexport type TimePickerProps<T extends LydsTimeValue = Time> = TimeFieldProps<T>;\n\ntype TimeFieldForwardedKeys = Exclude<keyof TimeFieldBehaviorProps<LydsTimeValue>, \"disabled\" | \"invalid\" | \"onValueChange\" | \"readOnly\" | \"required\">;\ntype TimeFieldUnexpectedForwardedKeys = Exclude<TimeFieldForwardedKeys, keyof AriaTimeFieldProps<LydsTimeValue>>;\ntype TimeFieldPropContract = TimeFieldUnexpectedForwardedKeys extends never ? true : never;\nconst timeFieldPropContract: TimeFieldPropContract = true;\nvoid timeFieldPropContract;\n\nfunction TimeControl<T extends LydsTimeValue>(\n\t{ label, description, error, locale, size = \"md\", className, disabled, readOnly, required, invalid, onValueChange, ...fieldProps }: TimeFieldProps<T>,\n\tref: React.ForwardedRef<HTMLDivElement>,\n\tshowPickerGlyph: boolean\n) {\n\tconst ariaFieldProps = fieldProps as unknown as Omit<AriaTimeFieldProps<T>, \"children\" | \"className\" | \"isDisabled\" | \"isInvalid\" | \"isReadOnly\" | \"isRequired\" | \"onChange\">;\n\n\treturn (\n\t\t<LocaleBoundary locale={locale}>\n\t\t\t<AriaTimeField\n\t\t\t\t{...ariaFieldProps}\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"lyds-date-field\", \"lyds-time-field\", showPickerGlyph && \"lyds-time-picker\", className)}\n\t\t\t\tdata-size={size}\n\t\t\t\t{...(disabled === undefined ? {} : { isDisabled: disabled })}\n\t\t\t\t{...(readOnly === undefined ? {} : { isReadOnly: readOnly })}\n\t\t\t\t{...(required === undefined ? {} : { isRequired: required })}\n\t\t\t\t{...(invalid === undefined ? {} : { isInvalid: invalid })}\n\t\t\t\t{...(onValueChange === undefined ? {} : { onChange: onValueChange as unknown as NonNullable<AriaTimeFieldProps<T>[\"onChange\"]> })}\n\t\t\t>\n\t\t\t\t<FieldLabel>{label}</FieldLabel>\n\t\t\t\t<div className=\"lyds-date-input-shell\">\n\t\t\t\t\t<DateInput className=\"lyds-date-input\">{segment => <DateSegment segment={segment} className=\"lyds-date-segment\" />}</DateInput>\n\t\t\t\t\t{showPickerGlyph ? (\n\t\t\t\t\t\t<span className=\"lyds-date-input-affordance\">\n\t\t\t\t\t\t\t<ClockGlyph />\n\t\t\t\t\t\t</span>\n\t\t\t\t\t) : null}\n\t\t\t\t</div>\n\t\t\t\t<FieldMessages description={description} error={error} />\n\t\t\t</AriaTimeField>\n\t\t</LocaleBoundary>\n\t);\n}\n\nfunction TimeFieldImpl<T extends LydsTimeValue>(props: TimeFieldProps<T>, ref: React.ForwardedRef<HTMLDivElement>) {\n\treturn TimeControl(props, ref, false);\n}\n\nfunction TimePickerImpl<T extends LydsTimeValue>(props: TimePickerProps<T>, ref: React.ForwardedRef<HTMLDivElement>) {\n\treturn TimeControl(props, ref, true);\n}\n\nexport const TimeField = forwardRef(TimeFieldImpl) as <T extends LydsTimeValue = Time>(props: TimeFieldProps<T> & RefAttributes<HTMLDivElement>) => ReactElement | null;\n\n/**\n * 支援地區格式的區段式時間選擇器。此元件不預設有限的時間選項;\n * `minValue`、`maxValue`、`granularity` 與 `hourCycle` 仍由使用端依 React Aria 語意控制。\n */\nexport const TimePicker = forwardRef(TimePickerImpl) as <T extends LydsTimeValue = Time>(props: TimePickerProps<T> & RefAttributes<HTMLDivElement>) => ReactElement | null;\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"time-field.js","names":[],"sources":["../../../src/components/date-time/time-field.tsx"],"sourcesContent":["import { cx } from \"@/internal\";\nimport type { Time } from \"@internationalized/date\";\nimport { forwardRef, type ReactElement, type RefAttributes } from \"react\";\nimport { TimeField as AriaTimeField, DateInput, DateSegment, type TimeFieldProps as AriaTimeFieldProps } from \"react-aria-components/TimeField\";\nimport type { TimeValue as LydsTimeValue, TimeFieldBehaviorProps } from \"./date-types\";\nimport { ClockGlyph, FieldLabel, FieldMessages, LocaleBoundary, type DateTimeFieldChromeProps } from \"./shared\";\nexport interface TimeFieldProps<T extends LydsTimeValue = Time> extends TimeFieldBehaviorProps<T>, DateTimeFieldChromeProps {}\n\nexport type TimePickerProps<T extends LydsTimeValue = Time> = TimeFieldProps<T>;\n\ntype TimeFieldForwardedKeys = Exclude<keyof TimeFieldBehaviorProps<LydsTimeValue>, \"disabled\" | \"invalid\" | \"onValueChange\" | \"readOnly\" | \"required\">;\ntype TimeFieldUnexpectedForwardedKeys = Exclude<TimeFieldForwardedKeys, keyof AriaTimeFieldProps<LydsTimeValue>>;\ntype TimeFieldPropContract = TimeFieldUnexpectedForwardedKeys extends never ? true : never;\nconst timeFieldPropContract: TimeFieldPropContract = true;\nvoid timeFieldPropContract;\n\nfunction TimeControl<T extends LydsTimeValue>(\n\t{ label, description, error, locale, size = \"md\", className, disabled, readOnly, required, invalid, onValueChange, ...fieldProps }: TimeFieldProps<T>,\n\tref: React.ForwardedRef<HTMLDivElement>,\n\tshowPickerGlyph: boolean\n) {\n\tconst ariaFieldProps = fieldProps as unknown as Omit<AriaTimeFieldProps<T>, \"children\" | \"className\" | \"isDisabled\" | \"isInvalid\" | \"isReadOnly\" | \"isRequired\" | \"onChange\">;\n\n\treturn (\n\t\t<LocaleBoundary locale={locale}>\n\t\t\t<AriaTimeField\n\t\t\t\t{...ariaFieldProps}\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"lyds-date-field\", \"lyds-time-field\", showPickerGlyph && \"lyds-time-picker\", className)}\n\t\t\t\tdata-size={size}\n\t\t\t\t{...(disabled === undefined ? {} : { isDisabled: disabled })}\n\t\t\t\t{...(readOnly === undefined ? {} : { isReadOnly: readOnly })}\n\t\t\t\t{...(required === undefined ? {} : { isRequired: required })}\n\t\t\t\t{...(invalid === undefined ? {} : { isInvalid: invalid })}\n\t\t\t\t{...(onValueChange === undefined ? {} : { onChange: onValueChange as unknown as NonNullable<AriaTimeFieldProps<T>[\"onChange\"]> })}\n\t\t\t>\n\t\t\t\t<FieldLabel>{label}</FieldLabel>\n\t\t\t\t<div className=\"lyds-date-input-shell\">\n\t\t\t\t\t<DateInput className=\"lyds-date-input\">{segment => <DateSegment segment={segment} className=\"lyds-date-segment\" />}</DateInput>\n\t\t\t\t\t{showPickerGlyph ? (\n\t\t\t\t\t\t<span className=\"lyds-date-input-affordance\">\n\t\t\t\t\t\t\t<ClockGlyph />\n\t\t\t\t\t\t</span>\n\t\t\t\t\t) : null}\n\t\t\t\t</div>\n\t\t\t\t<FieldMessages description={description} error={error} />\n\t\t\t</AriaTimeField>\n\t\t</LocaleBoundary>\n\t);\n}\n\nfunction TimeFieldImpl<T extends LydsTimeValue>(props: TimeFieldProps<T>, ref: React.ForwardedRef<HTMLDivElement>) {\n\treturn TimeControl(props, ref, false);\n}\n\nfunction TimePickerImpl<T extends LydsTimeValue>(props: TimePickerProps<T>, ref: React.ForwardedRef<HTMLDivElement>) {\n\treturn TimeControl(props, ref, true);\n}\n\nexport const TimeField = forwardRef(TimeFieldImpl) as <T extends LydsTimeValue = Time>(props: TimeFieldProps<T> & RefAttributes<HTMLDivElement>) => ReactElement | null;\n\n/**\n * 支援地區格式的區段式時間選擇器。此元件不預設有限的時間選項;\n * `minValue`、`maxValue`、`granularity` 與 `hourCycle` 仍由使用端依 React Aria 語意控制。\n */\nexport const TimePicker = forwardRef(TimePickerImpl) as <T extends LydsTimeValue = Time>(props: TimePickerProps<T> & RefAttributes<HTMLDivElement>) => ReactElement | null;\n"],"mappings":";;;;;;;AAgBA,SAAS,EACR,EAAE,UAAO,gBAAa,UAAO,WAAQ,UAAO,MAAM,cAAW,aAAU,aAAU,aAAU,YAAS,kBAAe,GAAG,KACtH,GACA,GACC;CAGD,OACC,kBAAC,GAAD;EAAwB;EACvB,UAAA,kBAAC,GAAD;GACC,GAAI;GACC;GACL,WAAW,EAAG,mBAAmB,mBAAmB,KAAmB,oBAAoB,CAAS;GACpG,aAAW;GACX,GAAK,MAAa,KAAA,IAAY,CAAC,IAAI,EAAE,YAAY,EAAS;GAC1D,GAAK,MAAa,KAAA,IAAY,CAAC,IAAI,EAAE,YAAY,EAAS;GAC1D,GAAK,MAAa,KAAA,IAAY,CAAC,IAAI,EAAE,YAAY,EAAS;GAC1D,GAAK,MAAY,KAAA,IAAY,CAAC,IAAI,EAAE,WAAW,EAAQ;GACvD,GAAK,MAAkB,KAAA,IAAY,CAAC,IAAI,EAAE,UAAU,EAA2E;GAThI,UAAA;IAWC,kBAAC,GAAD,EAAA,UAAa,EAAkB,CAAA;IAC/B,kBAAC,OAAD;KAAK,WAAU;KAAf,UAAA,CACC,kBAAC,GAAD;MAAW,WAAU;MAAmB,WAAA,MAAW,kBAAC,GAAD;OAAsB;OAAS,WAAU;MAAqB,CAAA;KAAa,CAAA,GAC7H,IACA,kBAAC,QAAD;MAAM,WAAU;MACf,UAAA,kBAAC,GAAD,CAAa,CAAA;KACR,CAAA,IACH,IACA;;IACL,kBAAC,GAAD;KAA4B;KAAoB;IAAQ,CAAA;GAC1C;;CACA,CAAA;AAElB;AAEA,SAAS,EAAuC,GAA0B,GAAyC;CAClH,OAAO,EAAY,GAAO,GAAK,EAAK;AACrC;AAEA,SAAS,EAAwC,GAA2B,GAAyC;CACpH,OAAO,EAAY,GAAO,GAAK,EAAI;AACpC;AAEA,IAAa,IAAY,EAAW,CAAa,GAMpC,IAAa,EAAW,CAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"alert.js","names":[],"sources":["../../../src/components/feedback/alert.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes } from \"react\";\n\nimport { cx } from \"@/internal\";\nimport { getLiveRegionProps, type FeedbackLiveMode, type FeedbackStatus } from \"./feedback.types\";\nexport interface AlertProps extends HTMLAttributes<HTMLDivElement> {\n\t/**\n\t * 控制語意狀態色盤。此屬性不會讓 Alert 成為即時區域;\n\t * 僅在內容動態加入或更新時設定 `live`。\n\t */\n\tstatus?: FeedbackStatus;\n\t/**\n\t * 動態回饋的播報方式。靜態 Alert 預設為 `off`,\n\t * 避免頁面載入時不必要的播報。\n\t */\n\tlive?: FeedbackLiveMode;\n}\n\nexport const Alert = forwardRef<HTMLDivElement, AlertProps>(function Alert({ \"aria-live\": ariaLive, className, live = \"off\", role, status = \"neutral\", ...props }, ref) {\n\tconst liveRegionProps = getLiveRegionProps(live);\n\n\treturn (\n\t\t<div\n\t\t\tref={ref}\n\t\t\tclassName={cx(\"lyds-feedback-panel\", \"lyds-alert\", className)}\n\t\t\tdata-status={status}\n\t\t\trole={role ?? liveRegionProps.role}\n\t\t\taria-live={ariaLive ?? liveRegionProps[\"aria-live\"]}\n\t\t\t{...props}\n\t\t/>\n\t);\n});\n\n/** Alert 元件的別名。 */\nexport const AlertView = Alert;\n\nexport const AlertContent = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(function AlertContent({ className, ...props }, ref) {\n\treturn <div ref={ref} className={cx(\"lyds-feedback__content\", className)} {...props} />;\n});\n\nexport const AlertTitle = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(function AlertTitle({ className, ...props }, ref) {\n\treturn <div ref={ref} className={cx(\"lyds-feedback__title\", className)} {...props} />;\n});\n\nexport const AlertDescription = forwardRef<HTMLParagraphElement, HTMLAttributes<HTMLParagraphElement>>(function AlertDescription({ className, ...props }, ref) {\n\treturn <p ref={ref} className={cx(\"lyds-feedback__description\", className)} {...props} />;\n});\n\nexport const AlertActions = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(function AlertActions({ className, ...props }, ref) {\n\treturn <div ref={ref} className={cx(\"lyds-feedback__actions\", className)} {...props} />;\n});\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"alert.js","names":[],"sources":["../../../src/components/feedback/alert.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes } from \"react\";\n\nimport { cx } from \"@/internal\";\nimport { getLiveRegionProps, type FeedbackLiveMode, type FeedbackStatus } from \"./feedback.types\";\nexport interface AlertProps extends HTMLAttributes<HTMLDivElement> {\n\t/**\n\t * 控制語意狀態色盤。此屬性不會讓 Alert 成為即時區域;\n\t * 僅在內容動態加入或更新時設定 `live`。\n\t */\n\tstatus?: FeedbackStatus;\n\t/**\n\t * 動態回饋的播報方式。靜態 Alert 預設為 `off`,\n\t * 避免頁面載入時不必要的播報。\n\t */\n\tlive?: FeedbackLiveMode;\n}\n\nexport const Alert = forwardRef<HTMLDivElement, AlertProps>(function Alert({ \"aria-live\": ariaLive, className, live = \"off\", role, status = \"neutral\", ...props }, ref) {\n\tconst liveRegionProps = getLiveRegionProps(live);\n\n\treturn (\n\t\t<div\n\t\t\tref={ref}\n\t\t\tclassName={cx(\"lyds-feedback-panel\", \"lyds-alert\", className)}\n\t\t\tdata-status={status}\n\t\t\trole={role ?? liveRegionProps.role}\n\t\t\taria-live={ariaLive ?? liveRegionProps[\"aria-live\"]}\n\t\t\t{...props}\n\t\t/>\n\t);\n});\n\n/** Alert 元件的別名。 */\nexport const AlertView = Alert;\n\nexport const AlertContent = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(function AlertContent({ className, ...props }, ref) {\n\treturn <div ref={ref} className={cx(\"lyds-feedback__content\", className)} {...props} />;\n});\n\nexport const AlertTitle = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(function AlertTitle({ className, ...props }, ref) {\n\treturn <div ref={ref} className={cx(\"lyds-feedback__title\", className)} {...props} />;\n});\n\nexport const AlertDescription = forwardRef<HTMLParagraphElement, HTMLAttributes<HTMLParagraphElement>>(function AlertDescription({ className, ...props }, ref) {\n\treturn <p ref={ref} className={cx(\"lyds-feedback__description\", className)} {...props} />;\n});\n\nexport const AlertActions = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(function AlertActions({ className, ...props }, ref) {\n\treturn <div ref={ref} className={cx(\"lyds-feedback__actions\", className)} {...props} />;\n});\n"],"mappings":";;;;;;AAiBA,IAAa,IAAQ,EAAuC,SAAe,EAAE,aAAa,GAAU,cAAW,UAAO,OAAO,SAAM,YAAS,WAAW,GAAG,KAAS,GAAK;CACvK,IAAM,IAAkB,EAAmB,CAAI;CAE/C,OACC,kBAAC,OAAD;EACM;EACL,WAAW,EAAG,uBAAuB,cAAc,CAAS;EAC5D,eAAa;EACb,MAAM,KAAQ,EAAgB;EAC9B,aAAW,KAAY,EAAgB;EACvC,GAAI;CACJ,CAAA;AAEH,CAAC,GAGY,IAAY,GAEZ,IAAe,EAA2D,SAAsB,EAAE,cAAW,GAAG,KAAS,GAAK;CAC1I,OAAO,kBAAC,OAAD;EAAU;EAAK,WAAW,EAAG,0BAA0B,CAAS;EAAG,GAAI;CAAQ,CAAA;AACvF,CAAC,GAEY,IAAa,EAA2D,SAAoB,EAAE,cAAW,GAAG,KAAS,GAAK;CACtI,OAAO,kBAAC,OAAD;EAAU;EAAK,WAAW,EAAG,wBAAwB,CAAS;EAAG,GAAI;CAAQ,CAAA;AACrF,CAAC,GAEY,IAAmB,EAAuE,SAA0B,EAAE,cAAW,GAAG,KAAS,GAAK;CAC9J,OAAO,kBAAC,KAAD;EAAQ;EAAK,WAAW,EAAG,8BAA8B,CAAS;EAAG,GAAI;CAAQ,CAAA;AACzF,CAAC,GAEY,IAAe,EAA2D,SAAsB,EAAE,cAAW,GAAG,KAAS,GAAK;CAC1I,OAAO,kBAAC,OAAD;EAAU;EAAK,WAAW,EAAG,0BAA0B,CAAS;EAAG,GAAI;CAAQ,CAAA;AACvF,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"banner.js","names":[],"sources":["../../../src/components/feedback/banner.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes } from \"react\";\n\nimport { cx } from \"@/internal\";\nimport { getLiveRegionProps, type FeedbackLiveMode, type FeedbackStatus } from \"./feedback.types\";\nexport interface BannerProps extends HTMLAttributes<HTMLDivElement> {\n\tstatus?: FeedbackStatus;\n\t/** 僅在 Banner 動態出現時使用 `polite` 或 `assertive`。 */\n\tlive?: FeedbackLiveMode;\n}\n\nexport const Banner = forwardRef<HTMLDivElement, BannerProps>(function Banner({ \"aria-live\": ariaLive, className, live = \"off\", role, status = \"neutral\", ...props }, ref) {\n\tconst liveRegionProps = getLiveRegionProps(live);\n\n\treturn (\n\t\t<div\n\t\t\tref={ref}\n\t\t\tclassName={cx(\"lyds-feedback-panel\", \"lyds-banner\", className)}\n\t\t\tdata-status={status}\n\t\t\trole={role ?? liveRegionProps.role}\n\t\t\taria-live={ariaLive ?? liveRegionProps[\"aria-live\"]}\n\t\t\t{...props}\n\t\t/>\n\t);\n});\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"banner.js","names":[],"sources":["../../../src/components/feedback/banner.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes } from \"react\";\n\nimport { cx } from \"@/internal\";\nimport { getLiveRegionProps, type FeedbackLiveMode, type FeedbackStatus } from \"./feedback.types\";\nexport interface BannerProps extends HTMLAttributes<HTMLDivElement> {\n\tstatus?: FeedbackStatus;\n\t/** 僅在 Banner 動態出現時使用 `polite` 或 `assertive`。 */\n\tlive?: FeedbackLiveMode;\n}\n\nexport const Banner = forwardRef<HTMLDivElement, BannerProps>(function Banner({ \"aria-live\": ariaLive, className, live = \"off\", role, status = \"neutral\", ...props }, ref) {\n\tconst liveRegionProps = getLiveRegionProps(live);\n\n\treturn (\n\t\t<div\n\t\t\tref={ref}\n\t\t\tclassName={cx(\"lyds-feedback-panel\", \"lyds-banner\", className)}\n\t\t\tdata-status={status}\n\t\t\trole={role ?? liveRegionProps.role}\n\t\t\taria-live={ariaLive ?? liveRegionProps[\"aria-live\"]}\n\t\t\t{...props}\n\t\t/>\n\t);\n});\n"],"mappings":";;;;;;AAUA,IAAa,IAAS,EAAwC,SAAgB,EAAE,aAAa,GAAU,cAAW,UAAO,OAAO,SAAM,YAAS,WAAW,GAAG,KAAS,GAAK;CAC1K,IAAM,IAAkB,EAAmB,CAAI;CAE/C,OACC,kBAAC,OAAD;EACM;EACL,WAAW,EAAG,uBAAuB,eAAe,CAAS;EAC7D,eAAa;EACb,MAAM,KAAQ,EAAgB;EAC9B,aAAW,KAAY,EAAgB;EACvC,GAAI;CACJ,CAAA;AAEH,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"empty-state.js","names":[],"sources":["../../../src/components/feedback/empty-state.tsx"],"sourcesContent":["import { createElement, forwardRef, type HTMLAttributes, type ReactNode } from \"react\";\n\nimport type { HeadingLevel } from \"@/components/foundations/section-heading\";\nimport { cx } from \"@/internal\";\nimport { type FeedbackStatus } from \"./feedback.types\";\nexport interface EmptyStateProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\"> {\n\tactions?: ReactNode;\n\tdescription?: ReactNode;\n\teyebrow?: ReactNode;\n\theadingLevel?: HeadingLevel;\n\ticon?: ReactNode;\n\tstatus?: FeedbackStatus;\n\ttitle: ReactNode;\n}\n\nexport const EmptyState = forwardRef<HTMLDivElement, EmptyStateProps>(function EmptyState(\n\t{ actions, className, description, eyebrow, headingLevel = 2, icon, status = \"neutral\", title, ...props },\n\tref\n) {\n\treturn (\n\t\t<div ref={ref} className={cx(\"lyds-empty-state\", className)} data-status={status} {...props}>\n\t\t\t<div className={\"lyds-empty-state__rail\"} aria-hidden=\"true\">\n\t\t\t\t<span />\n\t\t\t\t<span />\n\t\t\t\t<span />\n\t\t\t</div>\n\t\t\t<div className={\"lyds-empty-state__body\"}>\n\t\t\t\t{icon ? (\n\t\t\t\t\t<div className={\"lyds-empty-state__icon\"} aria-hidden=\"true\">\n\t\t\t\t\t\t{icon}\n\t\t\t\t\t</div>\n\t\t\t\t) : null}\n\t\t\t\t{eyebrow ? <div className={\"lyds-empty-state__eyebrow\"}>{eyebrow}</div> : null}\n\t\t\t\t{createElement(`h${headingLevel}`, { className: \"lyds-empty-state__title\" }, title)}\n\t\t\t\t{description ? <p className={\"lyds-empty-state__description\"}>{description}</p> : null}\n\t\t\t\t{actions ? <div className={\"lyds-empty-state__actions\"}>{actions}</div> : null}\n\t\t\t</div>\n\t\t</div>\n\t);\n});\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"empty-state.js","names":[],"sources":["../../../src/components/feedback/empty-state.tsx"],"sourcesContent":["import { createElement, forwardRef, type HTMLAttributes, type ReactNode } from \"react\";\n\nimport type { HeadingLevel } from \"@/components/foundations/section-heading\";\nimport { cx } from \"@/internal\";\nimport { type FeedbackStatus } from \"./feedback.types\";\nexport interface EmptyStateProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\"> {\n\tactions?: ReactNode;\n\tdescription?: ReactNode;\n\teyebrow?: ReactNode;\n\theadingLevel?: HeadingLevel;\n\ticon?: ReactNode;\n\tstatus?: FeedbackStatus;\n\ttitle: ReactNode;\n}\n\nexport const EmptyState = forwardRef<HTMLDivElement, EmptyStateProps>(function EmptyState(\n\t{ actions, className, description, eyebrow, headingLevel = 2, icon, status = \"neutral\", title, ...props },\n\tref\n) {\n\treturn (\n\t\t<div ref={ref} className={cx(\"lyds-empty-state\", className)} data-status={status} {...props}>\n\t\t\t<div className={\"lyds-empty-state__rail\"} aria-hidden=\"true\">\n\t\t\t\t<span />\n\t\t\t\t<span />\n\t\t\t\t<span />\n\t\t\t</div>\n\t\t\t<div className={\"lyds-empty-state__body\"}>\n\t\t\t\t{icon ? (\n\t\t\t\t\t<div className={\"lyds-empty-state__icon\"} aria-hidden=\"true\">\n\t\t\t\t\t\t{icon}\n\t\t\t\t\t</div>\n\t\t\t\t) : null}\n\t\t\t\t{eyebrow ? <div className={\"lyds-empty-state__eyebrow\"}>{eyebrow}</div> : null}\n\t\t\t\t{createElement(`h${headingLevel}`, { className: \"lyds-empty-state__title\" }, title)}\n\t\t\t\t{description ? <p className={\"lyds-empty-state__description\"}>{description}</p> : null}\n\t\t\t\t{actions ? <div className={\"lyds-empty-state__actions\"}>{actions}</div> : null}\n\t\t\t</div>\n\t\t</div>\n\t);\n});\n"],"mappings":";;;;;AAeA,IAAa,IAAa,EAA4C,SACrE,EAAE,YAAS,cAAW,gBAAa,YAAS,kBAAe,GAAG,SAAM,YAAS,WAAW,UAAO,GAAG,KAClG,GACC;CACD,OACC,kBAAC,OAAD;EAAU;EAAK,WAAW,EAAG,oBAAoB,CAAS;EAAG,eAAa;EAAQ,GAAI;EAAtF,UAAA,CACC,kBAAC,OAAD;GAAK,WAAW;GAA0B,eAAY;GAAtD,UAAA;IACC,kBAAC,QAAD,CAAO,CAAA;IACP,kBAAC,QAAD,CAAO,CAAA;IACP,kBAAC,QAAD,CAAO,CAAA;GACH;EACL,CAAA,GAAA,kBAAC,OAAD;GAAK,WAAW;GAAhB,UAAA;IACE,IACA,kBAAC,OAAD;KAAK,WAAW;KAA0B,eAAY;KACpD,UAAA;IACG,CAAA,IACF;IACH,IAAU,kBAAC,OAAD;KAAK,WAAW;KAA8B,UAAA;IAAa,CAAA,IAAI;IACzE,EAAc,IAAI,KAAgB,EAAE,WAAW,0BAA0B,GAAG,CAAK;IACjF,IAAc,kBAAC,KAAD;KAAG,WAAW;KAAkC,UAAA;IAAe,CAAA,IAAI;IACjF,IAAU,kBAAC,OAAD;KAAK,WAAW;KAA8B,UAAA;IAAa,CAAA,IAAI;GACtE;EACD,CAAA,CAAA;;AAEP,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"feedback.types.js","names":[],"sources":["../../../src/components/feedback/feedback.types.ts"],"sourcesContent":["export const FEEDBACK_STATUSES = [\"neutral\", \"info\", \"success\", \"warning\", \"danger\"] as const;\n\nexport type FeedbackStatus = (typeof FEEDBACK_STATUSES)[number];\n\nexport type FeedbackLiveMode = \"off\" | \"polite\" | \"assertive\";\n\nexport function getLiveRegionProps(live: FeedbackLiveMode): {\n\t\"aria-live\"?: \"polite\" | \"assertive\";\n\trole?: \"status\" | \"alert\";\n} {\n\tif (live === \"assertive\") {\n\t\treturn { \"aria-live\": \"assertive\", role: \"alert\" };\n\t}\n\n\tif (live === \"polite\") {\n\t\treturn { \"aria-live\": \"polite\", role: \"status\" };\n\t}\n\n\treturn {};\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"feedback.types.js","names":[],"sources":["../../../src/components/feedback/feedback.types.ts"],"sourcesContent":["export const FEEDBACK_STATUSES = [\"neutral\", \"info\", \"success\", \"warning\", \"danger\"] as const;\n\nexport type FeedbackStatus = (typeof FEEDBACK_STATUSES)[number];\n\nexport type FeedbackLiveMode = \"off\" | \"polite\" | \"assertive\";\n\nexport function getLiveRegionProps(live: FeedbackLiveMode): {\n\t\"aria-live\"?: \"polite\" | \"assertive\";\n\trole?: \"status\" | \"alert\";\n} {\n\tif (live === \"assertive\") {\n\t\treturn { \"aria-live\": \"assertive\", role: \"alert\" };\n\t}\n\n\tif (live === \"polite\") {\n\t\treturn { \"aria-live\": \"polite\", role: \"status\" };\n\t}\n\n\treturn {};\n}\n"],"mappings":";;AAAA,IAAa,IAAoB;CAAC;CAAW;CAAQ;CAAW;CAAW;AAAQ;AAMnF,SAAgB,EAAmB,GAGjC;CASD,OARI,MAAS,cACL;EAAE,aAAa;EAAa,MAAM;CAAQ,IAG9C,MAAS,WACL;EAAE,aAAa;EAAU,MAAM;CAAS,IAGzC,CAAC;AACT"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"meter.js","names":[],"sources":["../../../src/components/feedback/meter.tsx"],"sourcesContent":["import { Meter as BaseMeter } from \"@base-ui/react/meter\";\nimport { forwardRef, type ReactNode } from \"react\";\n\nimport { cx } from \"@/internal\";\nimport { type FeedbackStatus } from \"./feedback.types\";\nexport interface MeterProps extends Omit<BaseMeter.Root.Props, \"children\" | \"className\"> {\n\tlabel: ReactNode;\n\tclassName?: string;\n\ttrackClassName?: string;\n\tindicatorClassName?: string;\n\tstatus?: FeedbackStatus;\n\tshowValue?: boolean;\n}\n\nexport const Meter = forwardRef<HTMLDivElement, MeterProps>(function Meter({ className, indicatorClassName, label, showValue = true, status = \"neutral\", trackClassName, ...props }, ref) {\n\treturn (\n\t\t<BaseMeter.Root ref={ref} className={cx(\"lyds-range\", className)} data-status={status} {...props}>\n\t\t\t<div className={\"lyds-range__header\"}>\n\t\t\t\t<BaseMeter.Label className={\"lyds-range__label\"}>{label}</BaseMeter.Label>\n\t\t\t\t{showValue ? <BaseMeter.Value className={\"lyds-range__value\"} /> : null}\n\t\t\t</div>\n\t\t\t<BaseMeter.Track className={cx(\"lyds-range__track\", trackClassName)}>\n\t\t\t\t<BaseMeter.Indicator className={cx(\"lyds-range__indicator\", indicatorClassName)} />\n\t\t\t</BaseMeter.Track>\n\t\t</BaseMeter.Root>\n\t);\n});\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"meter.js","names":[],"sources":["../../../src/components/feedback/meter.tsx"],"sourcesContent":["import { Meter as BaseMeter } from \"@base-ui/react/meter\";\nimport { forwardRef, type ReactNode } from \"react\";\n\nimport { cx } from \"@/internal\";\nimport { type FeedbackStatus } from \"./feedback.types\";\nexport interface MeterProps extends Omit<BaseMeter.Root.Props, \"children\" | \"className\"> {\n\tlabel: ReactNode;\n\tclassName?: string;\n\ttrackClassName?: string;\n\tindicatorClassName?: string;\n\tstatus?: FeedbackStatus;\n\tshowValue?: boolean;\n}\n\nexport const Meter = forwardRef<HTMLDivElement, MeterProps>(function Meter({ className, indicatorClassName, label, showValue = true, status = \"neutral\", trackClassName, ...props }, ref) {\n\treturn (\n\t\t<BaseMeter.Root ref={ref} className={cx(\"lyds-range\", className)} data-status={status} {...props}>\n\t\t\t<div className={\"lyds-range__header\"}>\n\t\t\t\t<BaseMeter.Label className={\"lyds-range__label\"}>{label}</BaseMeter.Label>\n\t\t\t\t{showValue ? <BaseMeter.Value className={\"lyds-range__value\"} /> : null}\n\t\t\t</div>\n\t\t\t<BaseMeter.Track className={cx(\"lyds-range__track\", trackClassName)}>\n\t\t\t\t<BaseMeter.Indicator className={cx(\"lyds-range__indicator\", indicatorClassName)} />\n\t\t\t</BaseMeter.Track>\n\t\t</BaseMeter.Root>\n\t);\n});\n"],"mappings":";;;;;;AAcA,IAAa,IAAQ,EAAuC,SAAe,EAAE,cAAW,uBAAoB,UAAO,eAAY,IAAM,YAAS,WAAW,mBAAgB,GAAG,KAAS,GAAK;CACzL,OACC,kBAAC,EAAU,MAAX;EAAqB;EAAK,WAAW,EAAG,cAAc,CAAS;EAAG,eAAa;EAAQ,GAAI;EAA3F,UAAA,CACC,kBAAC,OAAD;GAAK,WAAW;GAAhB,UAAA,CACC,kBAAC,EAAU,OAAX;IAAiB,WAAW;IAAsB,UAAA;GAAuB,CAAA,GACxE,IAAY,kBAAC,EAAU,OAAX,EAAiB,WAAW,oBAAsB,CAAA,IAAI,IAC/D;EACL,CAAA,GAAA,kBAAC,EAAU,OAAX;GAAiB,WAAW,EAAG,qBAAqB,CAAc;GACjE,UAAA,kBAAC,EAAU,WAAX,EAAqB,WAAW,EAAG,yBAAyB,CAAkB,EAAI,CAAA;EAClE,CAAA,CACF;;AAElB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"progress.js","names":[],"sources":["../../../src/components/feedback/progress.tsx"],"sourcesContent":["import { Progress as BaseProgress } from \"@base-ui/react/progress\";\nimport { forwardRef, type ReactNode } from \"react\";\n\nimport { cx } from \"@/internal\";\nimport { type FeedbackStatus } from \"./feedback.types\";\nexport interface ProgressProps extends Omit<BaseProgress.Root.Props, \"children\" | \"className\"> {\n\tlabel: ReactNode;\n\tclassName?: string;\n\ttrackClassName?: string;\n\tindicatorClassName?: string;\n\tstatus?: FeedbackStatus;\n\tshowValue?: boolean;\n}\n\nexport const Progress = forwardRef<HTMLDivElement, ProgressProps>(function Progress({ className, indicatorClassName, label, showValue = true, status = \"neutral\", trackClassName, ...props }, ref) {\n\treturn (\n\t\t<BaseProgress.Root ref={ref} className={cx(\"lyds-range\", className)} data-status={status} {...props}>\n\t\t\t<div className={\"lyds-range__header\"}>\n\t\t\t\t<BaseProgress.Label className={\"lyds-range__label\"}>{label}</BaseProgress.Label>\n\t\t\t\t{showValue ? <BaseProgress.Value className={\"lyds-range__value\"} /> : null}\n\t\t\t</div>\n\t\t\t<BaseProgress.Track className={cx(\"lyds-range__track\", trackClassName)}>\n\t\t\t\t<BaseProgress.Indicator className={cx(\"lyds-range__indicator\", indicatorClassName)} />\n\t\t\t</BaseProgress.Track>\n\t\t</BaseProgress.Root>\n\t);\n});\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"progress.js","names":[],"sources":["../../../src/components/feedback/progress.tsx"],"sourcesContent":["import { Progress as BaseProgress } from \"@base-ui/react/progress\";\nimport { forwardRef, type ReactNode } from \"react\";\n\nimport { cx } from \"@/internal\";\nimport { type FeedbackStatus } from \"./feedback.types\";\nexport interface ProgressProps extends Omit<BaseProgress.Root.Props, \"children\" | \"className\"> {\n\tlabel: ReactNode;\n\tclassName?: string;\n\ttrackClassName?: string;\n\tindicatorClassName?: string;\n\tstatus?: FeedbackStatus;\n\tshowValue?: boolean;\n}\n\nexport const Progress = forwardRef<HTMLDivElement, ProgressProps>(function Progress({ className, indicatorClassName, label, showValue = true, status = \"neutral\", trackClassName, ...props }, ref) {\n\treturn (\n\t\t<BaseProgress.Root ref={ref} className={cx(\"lyds-range\", className)} data-status={status} {...props}>\n\t\t\t<div className={\"lyds-range__header\"}>\n\t\t\t\t<BaseProgress.Label className={\"lyds-range__label\"}>{label}</BaseProgress.Label>\n\t\t\t\t{showValue ? <BaseProgress.Value className={\"lyds-range__value\"} /> : null}\n\t\t\t</div>\n\t\t\t<BaseProgress.Track className={cx(\"lyds-range__track\", trackClassName)}>\n\t\t\t\t<BaseProgress.Indicator className={cx(\"lyds-range__indicator\", indicatorClassName)} />\n\t\t\t</BaseProgress.Track>\n\t\t</BaseProgress.Root>\n\t);\n});\n"],"mappings":";;;;;;AAcA,IAAa,IAAW,EAA0C,SAAkB,EAAE,cAAW,uBAAoB,UAAO,eAAY,IAAM,YAAS,WAAW,mBAAgB,GAAG,KAAS,GAAK;CAClM,OACC,kBAAC,EAAa,MAAd;EAAwB;EAAK,WAAW,EAAG,cAAc,CAAS;EAAG,eAAa;EAAQ,GAAI;EAA9F,UAAA,CACC,kBAAC,OAAD;GAAK,WAAW;GAAhB,UAAA,CACC,kBAAC,EAAa,OAAd;IAAoB,WAAW;IAAsB,UAAA;GAA0B,CAAA,GAC9E,IAAY,kBAAC,EAAa,OAAd,EAAoB,WAAW,oBAAsB,CAAA,IAAI,IAClE;EACL,CAAA,GAAA,kBAAC,EAAa,OAAd;GAAoB,WAAW,EAAG,qBAAqB,CAAc;GACpE,UAAA,kBAAC,EAAa,WAAd,EAAwB,WAAW,EAAG,yBAAyB,CAAkB,EAAI,CAAA;EAClE,CAAA,CACF;;AAErB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"skeleton.js","names":[],"sources":["../../../src/components/feedback/skeleton.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes } from \"react\";\n\nimport { cx } from \"@/internal\";\nexport interface SkeletonProps extends Omit<HTMLAttributes<HTMLSpanElement>, \"aria-hidden\" | \"children\"> {\n\tshape?: \"text\" | \"rectangular\" | \"circular\";\n}\n\nexport const Skeleton = forwardRef<HTMLSpanElement, SkeletonProps>(function Skeleton({ className, shape = \"text\", ...props }, ref) {\n\treturn <span ref={ref} aria-hidden=\"true\" className={cx(\"lyds-skeleton\", className)} data-shape={shape} {...props} />;\n});\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"skeleton.js","names":[],"sources":["../../../src/components/feedback/skeleton.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes } from \"react\";\n\nimport { cx } from \"@/internal\";\nexport interface SkeletonProps extends Omit<HTMLAttributes<HTMLSpanElement>, \"aria-hidden\" | \"children\"> {\n\tshape?: \"text\" | \"rectangular\" | \"circular\";\n}\n\nexport const Skeleton = forwardRef<HTMLSpanElement, SkeletonProps>(function Skeleton({ className, shape = \"text\", ...props }, ref) {\n\treturn <span ref={ref} aria-hidden=\"true\" className={cx(\"lyds-skeleton\", className)} data-shape={shape} {...props} />;\n});\n"],"mappings":";;;;;AAOA,IAAa,IAAW,EAA2C,SAAkB,EAAE,cAAW,WAAQ,QAAQ,GAAG,KAAS,GAAK;CAClI,OAAO,kBAAC,QAAD;EAAW;EAAK,eAAY;EAAO,WAAW,EAAG,iBAAiB,CAAS;EAAG,cAAY;EAAO,GAAI;CAAQ,CAAA;AACrH,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"spinner.js","names":[],"sources":["../../../src/components/feedback/spinner.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes, type ReactNode } from \"react\";\n\nimport { cx } from \"@/internal\";\nimport { type FeedbackStatus } from \"./feedback.types\";\ntype SpinnerAccessibilityProps =\n\t| {\n\t\t\t/** 附近已有載入說明文字時,對輔助科技隱藏 Spinner。 */\n\t\t\tdecorative: true;\n\t\t\tlabel?: never;\n\t }\n\t| {\n\t\t\tdecorative?: false;\n\t\t\t/** 由狀態區域播報的無障礙名稱。 */\n\t\t\tlabel: string;\n\t };\n\nexport type SpinnerProps = Omit<HTMLAttributes<HTMLSpanElement>, \"aria-hidden\" | \"aria-label\" | \"children\" | \"role\"> &\n\tSpinnerAccessibilityProps & {\n\t\tsize?: \"sm\" | \"md\" | \"lg\";\n\t\tstatus?: FeedbackStatus;\n\t};\n\nexport const Spinner = forwardRef<HTMLSpanElement, SpinnerProps>(function Spinner({ className, decorative = false, label, size = \"md\", status = \"neutral\", ...props }, ref) {\n\treturn (\n\t\t<span\n\t\t\tref={ref}\n\t\t\taria-hidden={decorative ? \"true\" : undefined}\n\t\t\taria-label={decorative ? undefined : label}\n\t\t\tclassName={cx(\"lyds-spinner\", className)}\n\t\t\tdata-size={size}\n\t\t\tdata-status={status}\n\t\t\trole={decorative ? undefined : \"status\"}\n\t\t\t{...props}\n\t\t/>\n\t);\n});\n\nexport interface LoaderProps extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n\tlabel: ReactNode;\n\tsize?: \"sm\" | \"md\" | \"lg\";\n\tstatus?: FeedbackStatus;\n}\n\nexport const Loader = forwardRef<HTMLDivElement, LoaderProps>(function Loader({ className, label, size = \"md\", status = \"neutral\", ...props }, ref) {\n\treturn (\n\t\t<div ref={ref} aria-live=\"polite\" className={cx(\"lyds-loader\", className)} data-status={status} role=\"status\" {...props}>\n\t\t\t<Spinner decorative size={size} status={status} />\n\t\t\t<span>{label}</span>\n\t\t</div>\n\t);\n});\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"spinner.js","names":[],"sources":["../../../src/components/feedback/spinner.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes, type ReactNode } from \"react\";\n\nimport { cx } from \"@/internal\";\nimport { type FeedbackStatus } from \"./feedback.types\";\ntype SpinnerAccessibilityProps =\n\t| {\n\t\t\t/** 附近已有載入說明文字時,對輔助科技隱藏 Spinner。 */\n\t\t\tdecorative: true;\n\t\t\tlabel?: never;\n\t }\n\t| {\n\t\t\tdecorative?: false;\n\t\t\t/** 由狀態區域播報的無障礙名稱。 */\n\t\t\tlabel: string;\n\t };\n\nexport type SpinnerProps = Omit<HTMLAttributes<HTMLSpanElement>, \"aria-hidden\" | \"aria-label\" | \"children\" | \"role\"> &\n\tSpinnerAccessibilityProps & {\n\t\tsize?: \"sm\" | \"md\" | \"lg\";\n\t\tstatus?: FeedbackStatus;\n\t};\n\nexport const Spinner = forwardRef<HTMLSpanElement, SpinnerProps>(function Spinner({ className, decorative = false, label, size = \"md\", status = \"neutral\", ...props }, ref) {\n\treturn (\n\t\t<span\n\t\t\tref={ref}\n\t\t\taria-hidden={decorative ? \"true\" : undefined}\n\t\t\taria-label={decorative ? undefined : label}\n\t\t\tclassName={cx(\"lyds-spinner\", className)}\n\t\t\tdata-size={size}\n\t\t\tdata-status={status}\n\t\t\trole={decorative ? undefined : \"status\"}\n\t\t\t{...props}\n\t\t/>\n\t);\n});\n\nexport interface LoaderProps extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n\tlabel: ReactNode;\n\tsize?: \"sm\" | \"md\" | \"lg\";\n\tstatus?: FeedbackStatus;\n}\n\nexport const Loader = forwardRef<HTMLDivElement, LoaderProps>(function Loader({ className, label, size = \"md\", status = \"neutral\", ...props }, ref) {\n\treturn (\n\t\t<div ref={ref} aria-live=\"polite\" className={cx(\"lyds-loader\", className)} data-status={status} role=\"status\" {...props}>\n\t\t\t<Spinner decorative size={size} status={status} />\n\t\t\t<span>{label}</span>\n\t\t</div>\n\t);\n});\n"],"mappings":";;;;;AAsBA,IAAa,IAAU,EAA0C,SAAiB,EAAE,cAAW,gBAAa,IAAO,UAAO,UAAO,MAAM,YAAS,WAAW,GAAG,KAAS,GAAK;CAC3K,OACC,kBAAC,QAAD;EACM;EACL,eAAa,IAAa,SAAS,KAAA;EACnC,cAAY,IAAa,KAAA,IAAY;EACrC,WAAW,EAAG,gBAAgB,CAAS;EACvC,aAAW;EACX,eAAa;EACb,MAAM,IAAa,KAAA,IAAY;EAC/B,GAAI;CACJ,CAAA;AAEH,CAAC,GAQY,IAAS,EAAwC,SAAgB,EAAE,cAAW,UAAO,UAAO,MAAM,YAAS,WAAW,GAAG,KAAS,GAAK;CACnJ,OACC,kBAAC,OAAD;EAAU;EAAK,aAAU;EAAS,WAAW,EAAG,eAAe,CAAS;EAAG,eAAa;EAAQ,MAAK;EAAS,GAAI;EAAlH,UAAA,CACC,kBAAC,GAAD;GAAS,YAAA;GAAiB;GAAc;EAAS,CAAA,GACjD,kBAAC,QAAD,EAAA,UAAO,EAAY,CAAA,CACf;;AAEP,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"toast.js","names":[],"sources":["../../../src/components/feedback/toast.tsx"],"sourcesContent":["import { Toast as BaseToast } from \"@base-ui/react/toast\";\nimport { XIcon } from \"@phosphor-icons/react/dist/csr/X\";\nimport { Fragment, forwardRef, type ComponentPropsWithoutRef, type ForwardedRef, type ReactElement, type ReactNode, type RefAttributes } from \"react\";\n\nimport { cx } from \"@/internal\";\nimport { useMessages } from \"@/intl\";\nimport { FEEDBACK_STATUSES, type FeedbackStatus } from \"./feedback.types\";\nconst feedbackStatusSet: ReadonlySet<string> = new Set(FEEDBACK_STATUSES);\n\nexport interface ToastData extends Record<string, unknown> {\n\tstatus?: FeedbackStatus;\n}\n\nexport type ToastObject<Data extends object = ToastData> = BaseToast.Root.ToastObject<Data>;\nexport type ToastManager<Data extends object = ToastData> = ReturnType<typeof BaseToast.createToastManager<Data>>;\n\nexport function createToastManager<Data extends object = ToastData>(): ToastManager<Data> {\n\treturn BaseToast.createToastManager<Data>();\n}\n\nexport function useToastManager<Data extends object = ToastData>() {\n\treturn BaseToast.useToastManager<Data>();\n}\n\nfunction getToastStatus<Data extends object>(toast: ToastObject<Data>): FeedbackStatus {\n\tconst status = (toast.data as { status?: unknown } | undefined)?.status;\n\tif (typeof status === \"string\" && feedbackStatusSet.has(status)) {\n\t\treturn status as FeedbackStatus;\n\t}\n\n\tif (toast.type && feedbackStatusSet.has(toast.type)) {\n\t\treturn toast.type as FeedbackStatus;\n\t}\n\n\treturn \"neutral\";\n}\n\nexport interface ToastRootProps<Data extends object = ToastData> extends Omit<BaseToast.Root.Props, \"className\" | \"toast\"> {\n\tclassName?: string;\n\tcloseLabel?: string;\n\ttoast: ToastObject<Data>;\n}\n\ntype ToastRootComponent = <Data extends object = ToastData>(props: ToastRootProps<Data> & RefAttributes<HTMLDivElement>) => ReactElement;\n\nexport const ToastRoot = forwardRef(function ToastRoot<Data extends object = ToastData>({ className, closeLabel, toast, ...props }: ToastRootProps<Data>, ref: ForwardedRef<HTMLDivElement>) {\n\tconst messages = useMessages();\n\tconst actionProps = toast.actionProps;\n\tconst actionClassName = actionProps?.className;\n\tconst status = getToastStatus(toast);\n\n\treturn (\n\t\t<BaseToast.Root ref={ref} className={cx(\"lyds-toast\", className)} data-status={status} toast={toast} {...props}>\n\t\t\t<span aria-hidden=\"true\" className={\"lyds-toast__signal\"} />\n\t\t\t<BaseToast.Content className={\"lyds-toast__content\"}>\n\t\t\t\t{toast.title ? <BaseToast.Title className={\"lyds-toast__title\"} /> : null}\n\t\t\t\t{toast.description ? <BaseToast.Description className={\"lyds-toast__description\"} /> : null}\n\t\t\t</BaseToast.Content>\n\t\t\t{actionProps ? <BaseToast.Action {...actionProps} className={cx(\"lyds-toast__action\", actionClassName)} /> : null}\n\t\t\t<BaseToast.Close aria-label={closeLabel ?? messages.toastClose} className={\"lyds-toast__close\"}>\n\t\t\t\t<XIcon aria-hidden=\"true\" weight=\"bold\" />\n\t\t\t</BaseToast.Close>\n\t\t</BaseToast.Root>\n\t);\n}) as ToastRootComponent;\n\nexport interface ToastViewportProps<Data extends object = ToastData> extends Omit<ComponentPropsWithoutRef<typeof BaseToast.Viewport>, \"children\" | \"className\"> {\n\tclassName?: string;\n\tcloseLabel?: string;\n\trenderToast?: (toast: ToastObject<Data>) => ReactNode;\n}\n\ntype ToastViewportComponent = <Data extends object = ToastData>(props: ToastViewportProps<Data> & RefAttributes<HTMLDivElement>) => ReactElement;\n\nexport const ToastViewport = forwardRef(function ToastViewport<Data extends object = ToastData>(\n\t{ className, closeLabel, renderToast, ...props }: ToastViewportProps<Data>,\n\tref: ForwardedRef<HTMLDivElement>\n) {\n\tconst toast = BaseToast.useToastManager<Data>();\n\n\treturn (\n\t\t<BaseToast.Portal>\n\t\t\t<BaseToast.Viewport ref={ref} className={cx(\"lyds-toast__viewport\", className)} {...props}>\n\t\t\t\t{toast.toasts.map(toastObject =>\n\t\t\t\t\trenderToast ? (\n\t\t\t\t\t\t<Fragment key={toastObject.id}>{renderToast(toastObject)}</Fragment>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<ToastRoot {...(closeLabel === undefined ? {} : { closeLabel })} key={toastObject.id} toast={toastObject} />\n\t\t\t\t\t)\n\t\t\t\t)}\n\t\t\t</BaseToast.Viewport>\n\t\t</BaseToast.Portal>\n\t);\n}) as ToastViewportComponent;\n\nexport interface ToastProviderProps<Data extends object = ToastData> extends Omit<BaseToast.Provider.Props, \"toastManager\"> {\n\tcloseLabel?: string;\n\trenderToast?: ToastViewportProps<Data>[\"renderToast\"];\n\ttoastManager?: ToastManager<Data>;\n\tviewport?: boolean;\n\tviewportProps?: Omit<ToastViewportProps<Data>, \"closeLabel\" | \"renderToast\">;\n}\n\nexport function ToastProvider<Data extends object = ToastData>({ children, closeLabel, renderToast, viewport = true, viewportProps, ...props }: ToastProviderProps<Data>) {\n\treturn (\n\t\t<BaseToast.Provider {...props}>\n\t\t\t{children}\n\t\t\t{viewport ? <ToastViewport {...viewportProps} {...(closeLabel === undefined ? {} : { closeLabel })} {...(renderToast === undefined ? {} : { renderToast })} /> : null}\n\t\t</BaseToast.Provider>\n\t);\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"toast.js","names":[],"sources":["../../../src/components/feedback/toast.tsx"],"sourcesContent":["import { Toast as BaseToast } from \"@base-ui/react/toast\";\nimport { XIcon } from \"@phosphor-icons/react/dist/csr/X\";\nimport { Fragment, forwardRef, type ComponentPropsWithoutRef, type ForwardedRef, type ReactElement, type ReactNode, type RefAttributes } from \"react\";\n\nimport { cx } from \"@/internal\";\nimport { useMessages } from \"@/intl\";\nimport { FEEDBACK_STATUSES, type FeedbackStatus } from \"./feedback.types\";\nconst feedbackStatusSet: ReadonlySet<string> = new Set(FEEDBACK_STATUSES);\n\nexport interface ToastData extends Record<string, unknown> {\n\tstatus?: FeedbackStatus;\n}\n\nexport type ToastObject<Data extends object = ToastData> = BaseToast.Root.ToastObject<Data>;\nexport type ToastManager<Data extends object = ToastData> = ReturnType<typeof BaseToast.createToastManager<Data>>;\n\nexport function createToastManager<Data extends object = ToastData>(): ToastManager<Data> {\n\treturn BaseToast.createToastManager<Data>();\n}\n\nexport function useToastManager<Data extends object = ToastData>() {\n\treturn BaseToast.useToastManager<Data>();\n}\n\nfunction getToastStatus<Data extends object>(toast: ToastObject<Data>): FeedbackStatus {\n\tconst status = (toast.data as { status?: unknown } | undefined)?.status;\n\tif (typeof status === \"string\" && feedbackStatusSet.has(status)) {\n\t\treturn status as FeedbackStatus;\n\t}\n\n\tif (toast.type && feedbackStatusSet.has(toast.type)) {\n\t\treturn toast.type as FeedbackStatus;\n\t}\n\n\treturn \"neutral\";\n}\n\nexport interface ToastRootProps<Data extends object = ToastData> extends Omit<BaseToast.Root.Props, \"className\" | \"toast\"> {\n\tclassName?: string;\n\tcloseLabel?: string;\n\ttoast: ToastObject<Data>;\n}\n\ntype ToastRootComponent = <Data extends object = ToastData>(props: ToastRootProps<Data> & RefAttributes<HTMLDivElement>) => ReactElement;\n\nexport const ToastRoot = forwardRef(function ToastRoot<Data extends object = ToastData>({ className, closeLabel, toast, ...props }: ToastRootProps<Data>, ref: ForwardedRef<HTMLDivElement>) {\n\tconst messages = useMessages();\n\tconst actionProps = toast.actionProps;\n\tconst actionClassName = actionProps?.className;\n\tconst status = getToastStatus(toast);\n\n\treturn (\n\t\t<BaseToast.Root ref={ref} className={cx(\"lyds-toast\", className)} data-status={status} toast={toast} {...props}>\n\t\t\t<span aria-hidden=\"true\" className={\"lyds-toast__signal\"} />\n\t\t\t<BaseToast.Content className={\"lyds-toast__content\"}>\n\t\t\t\t{toast.title ? <BaseToast.Title className={\"lyds-toast__title\"} /> : null}\n\t\t\t\t{toast.description ? <BaseToast.Description className={\"lyds-toast__description\"} /> : null}\n\t\t\t</BaseToast.Content>\n\t\t\t{actionProps ? <BaseToast.Action {...actionProps} className={cx(\"lyds-toast__action\", actionClassName)} /> : null}\n\t\t\t<BaseToast.Close aria-label={closeLabel ?? messages.toastClose} className={\"lyds-toast__close\"}>\n\t\t\t\t<XIcon aria-hidden=\"true\" weight=\"bold\" />\n\t\t\t</BaseToast.Close>\n\t\t</BaseToast.Root>\n\t);\n}) as ToastRootComponent;\n\nexport interface ToastViewportProps<Data extends object = ToastData> extends Omit<ComponentPropsWithoutRef<typeof BaseToast.Viewport>, \"children\" | \"className\"> {\n\tclassName?: string;\n\tcloseLabel?: string;\n\trenderToast?: (toast: ToastObject<Data>) => ReactNode;\n}\n\ntype ToastViewportComponent = <Data extends object = ToastData>(props: ToastViewportProps<Data> & RefAttributes<HTMLDivElement>) => ReactElement;\n\nexport const ToastViewport = forwardRef(function ToastViewport<Data extends object = ToastData>(\n\t{ className, closeLabel, renderToast, ...props }: ToastViewportProps<Data>,\n\tref: ForwardedRef<HTMLDivElement>\n) {\n\tconst toast = BaseToast.useToastManager<Data>();\n\n\treturn (\n\t\t<BaseToast.Portal>\n\t\t\t<BaseToast.Viewport ref={ref} className={cx(\"lyds-toast__viewport\", className)} {...props}>\n\t\t\t\t{toast.toasts.map(toastObject =>\n\t\t\t\t\trenderToast ? (\n\t\t\t\t\t\t<Fragment key={toastObject.id}>{renderToast(toastObject)}</Fragment>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<ToastRoot {...(closeLabel === undefined ? {} : { closeLabel })} key={toastObject.id} toast={toastObject} />\n\t\t\t\t\t)\n\t\t\t\t)}\n\t\t\t</BaseToast.Viewport>\n\t\t</BaseToast.Portal>\n\t);\n}) as ToastViewportComponent;\n\nexport interface ToastProviderProps<Data extends object = ToastData> extends Omit<BaseToast.Provider.Props, \"toastManager\"> {\n\tcloseLabel?: string;\n\trenderToast?: ToastViewportProps<Data>[\"renderToast\"];\n\ttoastManager?: ToastManager<Data>;\n\tviewport?: boolean;\n\tviewportProps?: Omit<ToastViewportProps<Data>, \"closeLabel\" | \"renderToast\">;\n}\n\nexport function ToastProvider<Data extends object = ToastData>({ children, closeLabel, renderToast, viewport = true, viewportProps, ...props }: ToastProviderProps<Data>) {\n\treturn (\n\t\t<BaseToast.Provider {...props}>\n\t\t\t{children}\n\t\t\t{viewport ? <ToastViewport {...viewportProps} {...(closeLabel === undefined ? {} : { closeLabel })} {...(renderToast === undefined ? {} : { renderToast })} /> : null}\n\t\t</BaseToast.Provider>\n\t);\n}\n"],"mappings":";;;;;;;;;AAOA,IAAM,IAAyC,IAAI,IAAI,CAAiB;AASxE,SAAgB,IAA0E;CACzF,OAAO,EAAU,mBAAyB;AAC3C;AAEA,SAAgB,IAAmD;CAClE,OAAO,EAAU,gBAAsB;AACxC;AAEA,SAAS,EAAoC,GAA0C;CACtF,IAAM,IAAU,EAAM,MAA2C;CASjE,OARI,OAAO,KAAW,YAAY,EAAkB,IAAI,CAAM,IACtD,IAGJ,EAAM,QAAQ,EAAkB,IAAI,EAAM,IAAI,IAC1C,EAAM,OAGP;AACR;AAUA,IAAa,IAAY,EAAW,SAAoD,EAAE,cAAW,eAAY,UAAO,GAAG,KAA+B,GAAmC;CAC5L,IAAM,IAAW,EAAY,GACvB,IAAc,EAAM,aACpB,IAAkB,GAAa,WAC/B,IAAS,EAAe,CAAK;CAEnC,OACC,kBAAC,EAAU,MAAX;EAAqB;EAAK,WAAW,EAAG,cAAc,CAAS;EAAG,eAAa;EAAe;EAAO,GAAI;EAAzG,UAAA;GACC,kBAAC,QAAD;IAAM,eAAY;IAAO,WAAW;GAAuB,CAAA;GAC3D,kBAAC,EAAU,SAAX;IAAmB,WAAW;IAA9B,UAAA,CACE,EAAM,QAAQ,kBAAC,EAAU,OAAX,EAAiB,WAAW,oBAAsB,CAAA,IAAI,MACpE,EAAM,cAAc,kBAAC,EAAU,aAAX,EAAuB,WAAW,0BAA4B,CAAA,IAAI,IACrE;;GAClB,IAAc,kBAAC,EAAU,QAAX;IAAkB,GAAI;IAAa,WAAW,EAAG,sBAAsB,CAAe;GAAI,CAAA,IAAI;GAC7G,kBAAC,EAAU,OAAX;IAAiB,cAAY,KAAc,EAAS;IAAY,WAAW;IAC1E,UAAA,kBAAC,GAAD;KAAO,eAAY;KAAO,QAAO;IAAQ,CAAA;GACzB,CAAA;EACF;;AAElB,CAAC,GAUY,IAAgB,EAAW,SACvC,EAAE,cAAW,eAAY,gBAAa,GAAG,KACzC,GACC;CACD,IAAM,IAAQ,EAAU,gBAAsB;CAE9C,OACC,kBAAC,EAAU,QAAX,EAAA,UACC,kBAAC,EAAU,UAAX;EAAyB;EAAK,WAAW,EAAG,wBAAwB,CAAS;EAAG,GAAI;EAClF,UAAA,EAAM,OAAO,KAAI,MACjB,IACC,kBAAC,GAAD,EAAA,UAAgC,EAAY,CAAW,EAAY,GAApD,EAAY,EAAwC,IAEnE,kBAAC,GAAD;GAAW,GAAK,MAAe,KAAA,IAAY,CAAC,IAAI,EAAE,cAAW;GAAI,KAAK,EAAY;GAAI,OAAO;EAAc,CAAA,CAE7G;CACmB,CAAA,EACH,CAAA;AAEpB,CAAC;AAUD,SAAgB,EAA+C,EAAE,aAAU,eAAY,gBAAa,cAAW,IAAM,kBAAe,GAAG,KAAmC;CACzK,OACC,kBAAC,EAAU,UAAX;EAAoB,GAAI;EAAxB,UAAA,CACE,GACA,IAAW,kBAAC,GAAD;GAAe,GAAI;GAAe,GAAK,MAAe,KAAA,IAAY,CAAC,IAAI,EAAE,cAAW;GAAI,GAAK,MAAgB,KAAA,IAAY,CAAC,IAAI,EAAE,eAAY;EAAK,CAAA,IAAI,IAC9I;;AAEtB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"code-field.js","names":[],"sources":["../../../src/components/forms/code-field.tsx"],"sourcesContent":["import { cx, withStateClassName } from \"@/internal\";\nimport { useMessages } from \"@/intl\";\nimport { OTPField as BaseOTPField } from \"@base-ui/react/otp-field\";\nimport * as React from \"react\";\nimport \"./forms.css\";\nimport { FieldFrame } from \"./internal\";\nimport type { OTPFieldProps } from \"./otp-field\";\n\nexport interface CodeFieldProps extends Omit<OTPFieldProps, \"length\" | \"separator\" | \"separatorAfter\"> {\n\t/**\n\t * 驗證碼字元數。數值限制為 2 至 12。\n\t * @default 6\n\t */\n\tlength?: number;\n\t/**\n\t * 每個視覺群組顯示的字元數。長度為 9 至 12 時預設每四個字元一組;\n\t * 較短的驗證碼預設各自獨立。設為 1 可強制使用獨立輸入格。\n\t */\n\tgroupSize?: number;\n\tgroupClassName?: string;\n\tgroupStyle?: React.CSSProperties;\n\t/**\n\t * 空白輸入格的選用提示。字串會依序將每個字元分配至各輸入格;\n\t * 需要個別在地化或自訂時可使用函式。\n\t */\n\tplaceholder?: string | ((index: number) => string | undefined);\n}\n\nfunction constrainInteger(value: number, minimum: number, maximum: number): number {\n\tif (!Number.isFinite(value)) return minimum;\n\treturn Math.min(maximum, Math.max(minimum, Math.trunc(value)));\n}\n\n/** 以 Base UI OTP Field 實作的多格驗證碼控制項。 */\nexport const CodeField = React.forwardRef<HTMLDivElement, CodeFieldProps>(function CodeField(\n\t{\n\t\tlabel,\n\t\tdescription,\n\t\terror,\n\t\tinvalid,\n\t\tdisabled,\n\t\treadOnly,\n\t\trequired,\n\t\tname,\n\t\tsize = \"md\",\n\t\tclassName,\n\t\tstyle,\n\t\trequiredIndicator,\n\t\tvalidate,\n\t\tvalidationMode,\n\t\tvalidationDebounceTime,\n\t\tdirty,\n\t\ttouched,\n\t\tactionsRef,\n\t\tinputClassName,\n\t\tinputStyle,\n\t\tgetSlotLabel,\n\t\tlength: lengthProp = 6,\n\t\tgroupSize: groupSizeProp,\n\t\tgroupClassName,\n\t\tgroupStyle,\n\t\tplaceholder,\n\t\tvalidationType = \"numeric\",\n\t\t...otpProps\n\t},\n\tref\n) {\n\tconst messages = useMessages();\n\tconst length = constrainInteger(lengthProp, 2, 12);\n\tconst defaultGroupSize = length >= 9 ? 4 : 1;\n\tconst groupSize = constrainInteger(groupSizeProp ?? defaultGroupSize, 1, length);\n\tconst grouped = groupSize > 1;\n\tconst groups: number[][] = [];\n\tconst placeholderCharacters = typeof placeholder === \"string\" ? Array.from(placeholder) : null;\n\n\tfor (let start = 0; start < length; start += groupSize) {\n\t\tgroups.push(Array.from({ length: Math.min(groupSize, length - start) }, (_, offset) => start + offset));\n\t}\n\n\tconst renderSlot = (index: number, insideGroup: boolean) => (\n\t\t<BaseOTPField.Input\n\t\t\tkey={index}\n\t\t\tclassName={withStateClassName<BaseOTPField.Input.State>(cx(\"lyds-otp-field__input\", \"lyds-code-field__input\", insideGroup && \"lyds-code-field__group-input\"), inputClassName)}\n\t\t\tstyle={inputStyle}\n\t\t\tplaceholder={typeof placeholder === \"function\" ? placeholder(index) : placeholderCharacters?.[index]}\n\t\t\taria-label={index > 0 ? (getSlotLabel?.(index) ?? messages.codeSlotLabel(index + 1, length)) : undefined}\n\t\t/>\n\t);\n\n\treturn (\n\t\t<FieldFrame\n\t\t\tlabel={label}\n\t\t\tdescription={description}\n\t\t\terror={error}\n\t\t\tinvalid={invalid}\n\t\t\tdisabled={disabled}\n\t\t\treadOnly={readOnly}\n\t\t\trequired={required}\n\t\t\tname={name}\n\t\t\tsize={size}\n\t\t\tclassName={className}\n\t\t\tstyle={style}\n\t\t\trequiredIndicator={requiredIndicator}\n\t\t\tvalidate={validate}\n\t\t\tvalidationMode={validationMode}\n\t\t\tvalidationDebounceTime={validationDebounceTime}\n\t\t\tdirty={dirty}\n\t\t\ttouched={touched}\n\t\t\tactionsRef={actionsRef}\n\t\t>\n\t\t\t<BaseOTPField.Root\n\t\t\t\t{...otpProps}\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"lyds-otp-field\", \"lyds-code-field\")}\n\t\t\t\tname={name}\n\t\t\t\tdisabled={disabled}\n\t\t\t\treadOnly={readOnly}\n\t\t\t\trequired={required}\n\t\t\t\tlength={length}\n\t\t\t\tvalidationType={validationType}\n\t\t\t\tdata-size={size}\n\t\t\t\tdata-grouped={grouped || undefined}\n\t\t\t\tdata-group-size={groupSize}\n\t\t\t>\n\t\t\t\t{groups.map((indices, groupIndex) =>\n\t\t\t\t\tgrouped ? (\n\t\t\t\t\t\t<span key={indices[0]} className={cx(\"lyds-code-field__group\", groupClassName)} style={groupStyle} data-group-index={groupIndex}>\n\t\t\t\t\t\t\t{indices.map(index => renderSlot(index, true))}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t) : (\n\t\t\t\t\t\trenderSlot(indices[0] as number, false)\n\t\t\t\t\t)\n\t\t\t\t)}\n\t\t\t</BaseOTPField.Root>\n\t\t</FieldFrame>\n\t);\n});\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"code-field.js","names":[],"sources":["../../../src/components/forms/code-field.tsx"],"sourcesContent":["import { cx, withStateClassName } from \"@/internal\";\nimport { useMessages } from \"@/intl\";\nimport { OTPField as BaseOTPField } from \"@base-ui/react/otp-field\";\nimport * as React from \"react\";\nimport \"./forms.css\";\nimport { FieldFrame } from \"./internal\";\nimport type { OTPFieldProps } from \"./otp-field\";\n\nexport interface CodeFieldProps extends Omit<OTPFieldProps, \"length\" | \"separator\" | \"separatorAfter\"> {\n\t/**\n\t * 驗證碼字元數。數值限制為 2 至 12。\n\t * @default 6\n\t */\n\tlength?: number;\n\t/**\n\t * 每個視覺群組顯示的字元數。長度為 9 至 12 時預設每四個字元一組;\n\t * 較短的驗證碼預設各自獨立。設為 1 可強制使用獨立輸入格。\n\t */\n\tgroupSize?: number;\n\tgroupClassName?: string;\n\tgroupStyle?: React.CSSProperties;\n\t/**\n\t * 空白輸入格的選用提示。字串會依序將每個字元分配至各輸入格;\n\t * 需要個別在地化或自訂時可使用函式。\n\t */\n\tplaceholder?: string | ((index: number) => string | undefined);\n}\n\nfunction constrainInteger(value: number, minimum: number, maximum: number): number {\n\tif (!Number.isFinite(value)) return minimum;\n\treturn Math.min(maximum, Math.max(minimum, Math.trunc(value)));\n}\n\n/** 以 Base UI OTP Field 實作的多格驗證碼控制項。 */\nexport const CodeField = React.forwardRef<HTMLDivElement, CodeFieldProps>(function CodeField(\n\t{\n\t\tlabel,\n\t\tdescription,\n\t\terror,\n\t\tinvalid,\n\t\tdisabled,\n\t\treadOnly,\n\t\trequired,\n\t\tname,\n\t\tsize = \"md\",\n\t\tclassName,\n\t\tstyle,\n\t\trequiredIndicator,\n\t\tvalidate,\n\t\tvalidationMode,\n\t\tvalidationDebounceTime,\n\t\tdirty,\n\t\ttouched,\n\t\tactionsRef,\n\t\tinputClassName,\n\t\tinputStyle,\n\t\tgetSlotLabel,\n\t\tlength: lengthProp = 6,\n\t\tgroupSize: groupSizeProp,\n\t\tgroupClassName,\n\t\tgroupStyle,\n\t\tplaceholder,\n\t\tvalidationType = \"numeric\",\n\t\t...otpProps\n\t},\n\tref\n) {\n\tconst messages = useMessages();\n\tconst length = constrainInteger(lengthProp, 2, 12);\n\tconst defaultGroupSize = length >= 9 ? 4 : 1;\n\tconst groupSize = constrainInteger(groupSizeProp ?? defaultGroupSize, 1, length);\n\tconst grouped = groupSize > 1;\n\tconst groups: number[][] = [];\n\tconst placeholderCharacters = typeof placeholder === \"string\" ? Array.from(placeholder) : null;\n\n\tfor (let start = 0; start < length; start += groupSize) {\n\t\tgroups.push(Array.from({ length: Math.min(groupSize, length - start) }, (_, offset) => start + offset));\n\t}\n\n\tconst renderSlot = (index: number, insideGroup: boolean) => (\n\t\t<BaseOTPField.Input\n\t\t\tkey={index}\n\t\t\tclassName={withStateClassName<BaseOTPField.Input.State>(cx(\"lyds-otp-field__input\", \"lyds-code-field__input\", insideGroup && \"lyds-code-field__group-input\"), inputClassName)}\n\t\t\tstyle={inputStyle}\n\t\t\tplaceholder={typeof placeholder === \"function\" ? placeholder(index) : placeholderCharacters?.[index]}\n\t\t\taria-label={index > 0 ? (getSlotLabel?.(index) ?? messages.codeSlotLabel(index + 1, length)) : undefined}\n\t\t/>\n\t);\n\n\treturn (\n\t\t<FieldFrame\n\t\t\tlabel={label}\n\t\t\tdescription={description}\n\t\t\terror={error}\n\t\t\tinvalid={invalid}\n\t\t\tdisabled={disabled}\n\t\t\treadOnly={readOnly}\n\t\t\trequired={required}\n\t\t\tname={name}\n\t\t\tsize={size}\n\t\t\tclassName={className}\n\t\t\tstyle={style}\n\t\t\trequiredIndicator={requiredIndicator}\n\t\t\tvalidate={validate}\n\t\t\tvalidationMode={validationMode}\n\t\t\tvalidationDebounceTime={validationDebounceTime}\n\t\t\tdirty={dirty}\n\t\t\ttouched={touched}\n\t\t\tactionsRef={actionsRef}\n\t\t>\n\t\t\t<BaseOTPField.Root\n\t\t\t\t{...otpProps}\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"lyds-otp-field\", \"lyds-code-field\")}\n\t\t\t\tname={name}\n\t\t\t\tdisabled={disabled}\n\t\t\t\treadOnly={readOnly}\n\t\t\t\trequired={required}\n\t\t\t\tlength={length}\n\t\t\t\tvalidationType={validationType}\n\t\t\t\tdata-size={size}\n\t\t\t\tdata-grouped={grouped || undefined}\n\t\t\t\tdata-group-size={groupSize}\n\t\t\t>\n\t\t\t\t{groups.map((indices, groupIndex) =>\n\t\t\t\t\tgrouped ? (\n\t\t\t\t\t\t<span key={indices[0]} className={cx(\"lyds-code-field__group\", groupClassName)} style={groupStyle} data-group-index={groupIndex}>\n\t\t\t\t\t\t\t{indices.map(index => renderSlot(index, true))}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t) : (\n\t\t\t\t\t\trenderSlot(indices[0] as number, false)\n\t\t\t\t\t)\n\t\t\t\t)}\n\t\t\t</BaseOTPField.Root>\n\t\t</FieldFrame>\n\t);\n});\n"],"mappings":";;;;;;;;;AA4BA,SAAS,EAAiB,GAAe,GAAiB,GAAyB;CAElF,OADK,OAAO,SAAS,CAAK,IACnB,KAAK,IAAI,GAAS,KAAK,IAAI,GAAS,KAAK,MAAM,CAAK,CAAC,CAAC,IADzB;AAErC;AAGA,IAAa,IAAY,EAAM,WAA2C,SACzE,EACC,UACA,gBACA,UACA,YACA,aACA,aACA,aACA,SACA,UAAO,MACP,cACA,UACA,sBACA,aACA,mBACA,2BACA,UACA,YACA,eACA,mBACA,eACA,iBACA,QAAQ,IAAa,GACrB,WAAW,GACX,mBACA,eACA,gBACA,oBAAiB,WACjB,GAAG,KAEJ,GACC;CACD,IAAM,IAAW,EAAY,GACvB,IAAS,EAAiB,GAAY,GAAG,EAAE,GAE3C,IAAY,EAAiB,MADV,KAAU,IAAI,IAAI,IAC2B,GAAG,CAAM,GACzE,IAAU,IAAY,GACtB,IAAqB,CAAC,GACtB,IAAwB,OAAO,KAAgB,WAAW,MAAM,KAAK,CAAW,IAAI;CAE1F,KAAK,IAAI,IAAQ,GAAG,IAAQ,GAAQ,KAAS,GAC5C,EAAO,KAAK,MAAM,KAAK,EAAE,QAAQ,KAAK,IAAI,GAAW,IAAS,CAAK,EAAE,IAAI,GAAG,MAAW,IAAQ,CAAM,CAAC;CAGvG,IAAM,KAAc,GAAe,MAClC,kBAAC,EAAa,OAAd;EAEC,WAAW,EAA6C,EAAG,yBAAyB,0BAA0B,KAAe,8BAA8B,GAAG,CAAc;EAC5K,OAAO;EACP,aAAa,OAAO,KAAgB,aAAa,EAAY,CAAK,IAAI,IAAwB;EAC9F,cAAY,IAAQ,IAAK,IAAe,CAAK,KAAK,EAAS,cAAc,IAAQ,GAAG,CAAM,IAAK,KAAA;CAC/F,GALK,CAKL;CAGF,OACC,kBAAC,GAAD;EACQ;EACM;EACN;EACE;EACC;EACA;EACA;EACJ;EACA;EACK;EACJ;EACY;EACT;EACM;EACQ;EACjB;EACE;EACG;EAEZ,UAAA,kBAAC,EAAa,MAAd;GACC,GAAI;GACC;GACL,WAAW,EAAG,kBAAkB,iBAAiB;GAC3C;GACI;GACA;GACA;GACF;GACQ;GAChB,aAAW;GACX,gBAAc,KAAW,KAAA;GACzB,mBAAiB;GAEhB,UAAA,EAAO,KAAK,GAAS,MACrB,IACC,kBAAC,QAAD;IAAuB,WAAW,EAAG,0BAA0B,CAAc;IAAG,OAAO;IAAY,oBAAkB;IACnH,UAAA,EAAQ,KAAI,MAAS,EAAW,GAAO,EAAI,CAAC;GACxC,GAFK,EAAQ,EAEb,IAEN,EAAW,EAAQ,IAAc,EAAK,CAExC;EACkB,CAAA;CACR,CAAA;AAEd,CAAC"}
|