@linyao.tw/ui 1.0.0 → 1.1.0

package/README.md

@@ -18,6 +18,14 @@ pnpm add @linyao.tw/ui @phosphor-icons/react
 import "@linyao.tw/ui/styles.css";
 ```
 
+`styles.css` 不含任何遠端請求。需要品牌字型時另外匯入可選入口，或自行代管字型並覆寫 `--font-family-*`：
+
+```tsx
+import "@linyao.tw/ui/fonts.css";
+```
+
+`styles.css` 除了設計變數與元件樣式，也包含一層文件基準樣式：`box-sizing`、`margin`／`padding` 歸零、`body` 的背景與文字色、表單控制項的 `font: inherit` 與 `::selection`。這層放在 `@layer lyds.base`，未分層的應用程式樣式一律勝過它，因此覆寫不需要提高選擇器權重。
+
 ## 使用
 
 ```tsx
@@ -80,6 +88,6 @@ Linyao Design System 以 WCAG 2.2 AA 為目標，提供鍵盤操作、焦點樣
 
 ## 文件
 
-完整的安裝、Storybook、開發、元件、設計變數、主題與發佈規範請參閱 [專案 README](https://github.com/linyao-tw/ui#readme) 與 [文件目錄](https://github.com/linyao-tw/ui/tree/main/docs)。
+變更記錄見 [CHANGELOG.md](https://github.com/linyao-tw/ui/blob/main/CHANGELOG.md)。完整的安裝、Storybook、開發、元件、設計變數、主題與發佈規範請參閱 [專案 README](https://github.com/linyao-tw/ui#readme) 與 [文件目錄](https://github.com/linyao-tw/ui/tree/main/docs)。
 
 授權：Apache-2.0。套件與專案包含相同的完整授權檔。

package/dist/components/date-time/calendar.js

@@ -1,4 +1,5 @@
-import { LocaleBoundary as e, cx as t } from "./shared.js";
+import { cx as e } from "../../internal/class-names.js";
+import { LocaleBoundary as t } from "./shared.js";
 import { CaretLeftIcon as n } from "@phosphor-icons/react/dist/csr/CaretLeft";
 import { CaretRightIcon as r } from "@phosphor-icons/react/dist/csr/CaretRight";
 import { forwardRef as i } from "react";
@@ -68,22 +69,22 @@ function y({ weekdayStyle: e = "short" }) {
 		}) })]
 	});
 }
-function b({ weekdayStyle: e, showMonthYearPickers: n, disabled: r, className: i }) {
+function b({ weekdayStyle: t, showMonthYearPickers: n, disabled: r, className: i }) {
 	return /* @__PURE__ */ _("div", {
-		className: t("lyds-calendar-panel", i),
+		className: e("lyds-calendar-panel", i),
 		children: [/* @__PURE__ */ g(v, {
 			showMonthYearPickers: n,
 			disabled: r
-		}), /* @__PURE__ */ g(y, { weekdayStyle: e })]
+		}), /* @__PURE__ */ g(y, { weekdayStyle: t })]
 	});
 }
 function x({ locale: n, className: r, disabled: i, readOnly: a, invalid: s, onValueChange: c, weekdayStyle: l, ...u }, d) {
-	return /* @__PURE__ */ g(e, {
+	return /* @__PURE__ */ g(t, {
 		locale: n,
 		children: /* @__PURE__ */ g(o, {
 			...u,
 			ref: d,
-			className: t("lyds-calendar", r),
+			className: e("lyds-calendar", r),
 			...i === void 0 ? {} : { isDisabled: i },
 			...a === void 0 ? {} : { isReadOnly: a },
 			...s === void 0 ? {} : { isInvalid: s },

package/dist/components/date-time/calendar.js.map

@@ -1 +1 @@
-{"version":3,"file":"calendar.js","names":[],"sources":["../../../src/components/date-time/calendar.tsx"],"sourcesContent":["import 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, cx } from \"./shared\";\n\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"}
+{"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"}

package/dist/components/date-time/date-field.js

@@ -1,12 +1,13 @@
-import { FieldLabel as e, FieldMessages as t, LocaleBoundary as n, cx as r } from "./shared.js";
+import { cx as e } from "../../internal/class-names.js";
+import { FieldLabel as t, FieldMessages as n, LocaleBoundary as r } from "./shared.js";
 import { forwardRef as i } from "react";
 import { jsx as a, jsxs as o } from "react/jsx-runtime";
 import { DateField as s, DateInput as c, DateSegment as l } from "react-aria-components/DateField";
 //#region src/components/date-time/date-field.tsx
-function u({ className: e, slot: t }) {
+function u({ className: t, slot: n }) {
 	return /* @__PURE__ */ a(c, {
-		className: r("lyds-date-input", e),
-		...t ? { slot: t } : {},
+		className: e("lyds-date-input", t),
+		...n ? { slot: n } : {},
 		children: (e) => /* @__PURE__ */ a(l, {
 			segment: e,
 			className: "lyds-date-segment"
@@ -14,12 +15,12 @@ function u({ className: e, slot: t }) {
 	});
 }
 function d({ label: i, description: c, error: l, locale: d, size: f = "md", className: p, disabled: m, readOnly: h, required: g, invalid: _, onValueChange: v, ...y }, b) {
-	return /* @__PURE__ */ a(n, {
+	return /* @__PURE__ */ a(r, {
 		locale: d,
 		children: /* @__PURE__ */ o(s, {
 			...y,
 			ref: b,
-			className: r("lyds-date-field", p),
+			className: e("lyds-date-field", p),
 			"data-size": f,
 			...m === void 0 ? {} : { isDisabled: m },
 			...h === void 0 ? {} : { isReadOnly: h },
@@ -27,9 +28,9 @@ function d({ label: i, description: c, error: l, locale: d, size: f = "md", clas
 			..._ === void 0 ? {} : { isInvalid: _ },
 			...v === void 0 ? {} : { onChange: v },
 			children: [
-				/* @__PURE__ */ a(e, { children: i }),
+				/* @__PURE__ */ a(t, { children: i }),
 				/* @__PURE__ */ a(u, {}),
-				/* @__PURE__ */ a(t, {
+				/* @__PURE__ */ a(n, {
 					description: c,
 					error: l
 				})

package/dist/components/date-time/date-field.js.map

@@ -1 +1 @@
-{"version":3,"file":"date-field.js","names":[],"sources":["../../../src/components/date-time/date-field.tsx"],"sourcesContent":["import 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, cx, type DateTimeFieldChromeProps } from \"./shared\";\n\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"}
+{"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"}

package/dist/components/date-time/date-picker.js

@@ -1,4 +1,5 @@
-import { CalendarGlyph as e, FieldLabel as t, FieldMessages as n, LocaleBoundary as r, cx as i } from "./shared.js";
+import { cx as e } from "../../internal/class-names.js";
+import { CalendarGlyph as t, FieldLabel as n, FieldMessages as r, LocaleBoundary as i } from "./shared.js";
 import { CalendarPanel as a } from "./calendar.js";
 import { DateInputSegments as o } from "./date-field.js";
 import { forwardRef as s } from "react";
@@ -11,12 +12,12 @@ import { Group as m } from "react-aria-components/Group";
 import { Popover as h } from "react-aria-components/Popover";
 //#region src/components/date-time/date-picker.tsx
 function g({ label: s, description: g, error: _, locale: v, size: y = "md", className: b, open: x, disabled: S, readOnly: C, required: w, invalid: T, onValueChange: E, firstDayOfWeek: D, weekdayStyle: O, showMonthYearPickers: k, popoverPlacement: A = "bottom start", ...j }, M, N) {
-	return /* @__PURE__ */ u(r, {
+	return /* @__PURE__ */ u(i, {
 		locale: v,
 		children: /* @__PURE__ */ d(f, {
 			...j,
 			ref: M,
-			className: i("lyds-date-field", "lyds-date-picker", N && "lyds-date-time-picker", b),
+			className: e("lyds-date-field", "lyds-date-picker", N && "lyds-date-time-picker", b),
 			"data-size": y,
 			...x === void 0 ? {} : { isOpen: x },
 			...S === void 0 ? {} : { isDisabled: S },
@@ -26,15 +27,15 @@ function g({ label: s, description: g, error: _, locale: v, size: y = "md", clas
 			...E === void 0 ? {} : { onChange: E },
 			...D === void 0 ? {} : { firstDayOfWeek: D },
 			children: [
-				/* @__PURE__ */ u(t, { children: s }),
+				/* @__PURE__ */ u(n, { children: s }),
 				/* @__PURE__ */ d(m, {
 					className: "lyds-date-picker-group",
 					children: [/* @__PURE__ */ u(o, { className: "lyds-date-picker-input" }), /* @__PURE__ */ u(c, {
 						className: "lyds-date-picker-button",
-						children: /* @__PURE__ */ u(e, {})
+						children: /* @__PURE__ */ u(t, {})
 					})]
 				}),
-				/* @__PURE__ */ u(n, {
+				/* @__PURE__ */ u(r, {
 					description: g,
 					error: _
 				}),

package/dist/components/date-time/date-picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"date-picker.js","names":[],"sources":["../../../src/components/date-time/date-picker.tsx"],"sourcesContent":["import 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, cx, type DateTimeFieldChromeProps } from \"./shared\";\n\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"}
+{"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"}

package/dist/components/date-time/date-range-picker.js

@@ -1,4 +1,5 @@
-import { CalendarGlyph as e, FieldLabel as t, FieldMessages as n, LocaleBoundary as r, cx as i } from "./shared.js";
+import { cx as e } from "../../internal/class-names.js";
+import { CalendarGlyph as t, FieldLabel as n, FieldMessages as r, LocaleBoundary as i } from "./shared.js";
 import { CalendarPanel as a } from "./calendar.js";
 import { DateInputSegments as o } from "./date-field.js";
 import { forwardRef as s } from "react";
@@ -10,12 +11,12 @@ import { Popover as p } from "react-aria-components/Popover";
 import { DateRangePicker as m, RangeCalendar as h } from "react-aria-components/DateRangePicker";
 //#region src/components/date-time/date-range-picker.tsx
 function g({ label: s, description: g, error: _, locale: v, size: y = "md", className: b, open: x, disabled: S, readOnly: C, required: w, invalid: T, onValueChange: E, firstDayOfWeek: D, weekdayStyle: O, showMonthYearPickers: k, popoverPlacement: A = "bottom start", ...j }, M) {
-	return /* @__PURE__ */ l(r, {
+	return /* @__PURE__ */ l(i, {
 		locale: v,
 		children: /* @__PURE__ */ u(m, {
 			...j,
 			ref: M,
-			className: i("lyds-date-field", "lyds-date-picker", "lyds-date-range-picker", b),
+			className: e("lyds-date-field", "lyds-date-picker", "lyds-date-range-picker", b),
 			"data-size": y,
 			...x === void 0 ? {} : { isOpen: x },
 			...S === void 0 ? {} : { isDisabled: S },
@@ -25,7 +26,7 @@ function g({ label: s, description: g, error: _, locale: v, size: y = "md", clas
 			...E === void 0 ? {} : { onChange: E },
 			...D === void 0 ? {} : { firstDayOfWeek: D },
 			children: [
-				/* @__PURE__ */ l(t, { children: s }),
+				/* @__PURE__ */ l(n, { children: s }),
 				/* @__PURE__ */ u(f, {
 					className: "lyds-date-picker-group",
 					children: [
@@ -44,11 +45,11 @@ function g({ label: s, description: g, error: _, locale: v, size: y = "md", clas
 						}),
 						/* @__PURE__ */ l(c, {
 							className: "lyds-date-picker-button",
-							children: /* @__PURE__ */ l(e, {})
+							children: /* @__PURE__ */ l(t, {})
 						})
 					]
 				}),
-				/* @__PURE__ */ l(n, {
+				/* @__PURE__ */ l(r, {
 					description: g,
 					error: _
 				}),

package/dist/components/date-time/date-range-picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"date-range-picker.js","names":[],"sources":["../../../src/components/date-time/date-range-picker.tsx"],"sourcesContent":["import 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, cx, type DateTimeFieldChromeProps } from \"./shared\";\n\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"}
+{"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"}

package/dist/components/date-time/index.js

@@ -1,4 +1,3 @@
-/* empty css          */
 import { Calendar as e } from "./calendar.js";
 import { DateField as t } from "./date-field.js";
 import { DatePicker as n, DateTimePicker as r } from "./date-picker.js";

package/dist/components/date-time/shared.d.ts

@@ -12,7 +12,6 @@ export interface DateTimeFieldChromeProps {
     size?: DateTimeSize;
     className?: string;
 }
-export declare function cx(...values: Array<string | false | null | undefined>): string;
 export declare function LocaleBoundary({ locale, children }: {
     locale?: string | undefined;
     children: ReactNode;

package/dist/components/date-time/shared.js

@@ -6,22 +6,19 @@ import { Label as i } from "react-aria-components/Label";
 import { Text as a } from "react-aria-components/Text";
 import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
 //#region src/components/date-time/shared.tsx
-function l(...e) {
-	return e.filter(Boolean).join(" ");
-}
-function u({ locale: e, children: t }) {
+function l({ locale: e, children: t }) {
 	return e ? /* @__PURE__ */ s(r, {
 		locale: e,
 		children: t
 	}) : /* @__PURE__ */ s(o, { children: t });
 }
-function d({ children: e }) {
+function u({ children: e }) {
 	return e == null ? null : /* @__PURE__ */ s(i, {
 		className: "lyds-date-label",
 		children: e
 	});
 }
-function f({ description: e, error: t }) {
+function d({ description: e, error: t }) {
 	return /* @__PURE__ */ c(o, { children: [e == null ? null : /* @__PURE__ */ s(a, {
 		slot: "description",
 		className: "lyds-date-description",
@@ -33,14 +30,14 @@ function f({ description: e, error: t }) {
 		children: t
 	})] });
 }
-function p() {
+function f() {
 	return /* @__PURE__ */ s(e, {
 		"aria-hidden": "true",
 		className: "lyds-date-glyph",
 		weight: "regular"
 	});
 }
-function m() {
+function p() {
 	return /* @__PURE__ */ s(t, {
 		"aria-hidden": "true",
 		className: "lyds-date-glyph",
@@ -48,6 +45,6 @@ function m() {
 	});
 }
 //#endregion
-export { p as CalendarGlyph, m as ClockGlyph, d as FieldLabel, f as FieldMessages, u as LocaleBoundary, l as cx };
+export { f as CalendarGlyph, p as ClockGlyph, u as FieldLabel, d as FieldMessages, l as LocaleBoundary };
 
 //# sourceMappingURL=shared.js.map

package/dist/components/date-time/shared.js.map

@@ -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 cx(...values: Array<string | false | null | undefined>): string {\n\treturn values.filter(Boolean).join(\" \");\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,EAAG,GAAG,GAA0D;CAC/E,OAAO,EAAO,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;AACvC;AAEA,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"}
+{"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"}

package/dist/components/date-time/time-field.js

@@ -1,15 +1,16 @@
-import { ClockGlyph as e, FieldLabel as t, FieldMessages as n, LocaleBoundary as r, cx as i } from "./shared.js";
+import { cx as e } from "../../internal/class-names.js";
+import { ClockGlyph as t, FieldLabel as n, FieldMessages as r, LocaleBoundary as i } from "./shared.js";
 import { forwardRef as a } from "react";
 import { jsx as o, jsxs as s } from "react/jsx-runtime";
 import { DateInput as c, DateSegment as l, TimeField as u } from "react-aria-components/TimeField";
 //#region src/components/date-time/time-field.tsx
 function d({ label: a, description: d, error: f, locale: p, size: m = "md", className: h, disabled: g, readOnly: _, required: v, invalid: y, onValueChange: b, ...x }, S, C) {
-	return /* @__PURE__ */ o(r, {
+	return /* @__PURE__ */ o(i, {
 		locale: p,
 		children: /* @__PURE__ */ s(u, {
 			...x,
 			ref: S,
-			className: i("lyds-date-field", "lyds-time-field", C && "lyds-time-picker", h),
+			className: e("lyds-date-field", "lyds-time-field", C && "lyds-time-picker", h),
 			"data-size": m,
 			...g === void 0 ? {} : { isDisabled: g },
 			..._ === void 0 ? {} : { isReadOnly: _ },
@@ -17,7 +18,7 @@ function d({ label: a, description: d, error: f, locale: p, size: m = "md", clas
 			...y === void 0 ? {} : { isInvalid: y },
 			...b === void 0 ? {} : { onChange: b },
 			children: [
-				/* @__PURE__ */ o(t, { children: a }),
+				/* @__PURE__ */ o(n, { children: a }),
 				/* @__PURE__ */ s("div", {
 					className: "lyds-date-input-shell",
 					children: [/* @__PURE__ */ o(c, {
@@ -28,10 +29,10 @@ function d({ label: a, description: d, error: f, locale: p, size: m = "md", clas
 						})
 					}), C ? /* @__PURE__ */ o("span", {
 						className: "lyds-date-input-affordance",
-						children: /* @__PURE__ */ o(e, {})
+						children: /* @__PURE__ */ o(t, {})
 					}) : null]
 				}),
-				/* @__PURE__ */ o(n, {
+				/* @__PURE__ */ o(r, {
 					description: d,
 					error: f
 				})

package/dist/components/date-time/time-field.js.map

@@ -1 +1 @@
-{"version":3,"file":"time-field.js","names":[],"sources":["../../../src/components/date-time/time-field.tsx"],"sourcesContent":["import 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, cx, type DateTimeFieldChromeProps } from \"./shared\";\n\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"}
+{"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"}

package/dist/components/feedback/alert.js

@@ -1,44 +1,44 @@
-import e from "./feedback.module.js";
-import { getLiveRegionProps as t, mergeClassNames as n } from "./feedback.types.js";
-import { forwardRef as r } from "react";
-import { jsx as i } from "react/jsx-runtime";
+import { cx as e } from "../../internal/class-names.js";
+import { getLiveRegionProps as t } from "./feedback.types.js";
+import { forwardRef as n } from "react";
+import { jsx as r } from "react/jsx-runtime";
 //#region src/components/feedback/alert.tsx
-var a = r(function({ "aria-live": r, className: a, live: o = "off", role: s, status: c = "neutral", ...l }, u) {
-	let d = t(o);
-	return /* @__PURE__ */ i("div", {
-		ref: u,
-		className: n(e.feedbackPanel, e.alert, a),
-		"data-status": c,
-		role: s ?? d.role,
-		"aria-live": r ?? d["aria-live"],
-		...l
+var i = n(function({ "aria-live": n, className: i, live: a = "off", role: o, status: s = "neutral", ...c }, l) {
+	let u = t(a);
+	return /* @__PURE__ */ r("div", {
+		ref: l,
+		className: e("lyds-feedback-panel", "lyds-alert", i),
+		"data-status": s,
+		role: o ?? u.role,
+		"aria-live": n ?? u["aria-live"],
+		...c
 	});
-}), o = a, s = r(function({ className: t, ...r }, a) {
-	return /* @__PURE__ */ i("div", {
-		ref: a,
-		className: n(e.feedbackContent, t),
-		...r
+}), a = i, o = n(function({ className: t, ...n }, i) {
+	return /* @__PURE__ */ r("div", {
+		ref: i,
+		className: e("lyds-feedback__content", t),
+		...n
 	});
-}), c = r(function({ className: t, ...r }, a) {
-	return /* @__PURE__ */ i("div", {
-		ref: a,
-		className: n(e.feedbackTitle, t),
-		...r
+}), s = n(function({ className: t, ...n }, i) {
+	return /* @__PURE__ */ r("div", {
+		ref: i,
+		className: e("lyds-feedback__title", t),
+		...n
 	});
-}), l = r(function({ className: t, ...r }, a) {
-	return /* @__PURE__ */ i("p", {
-		ref: a,
-		className: n(e.feedbackDescription, t),
-		...r
+}), c = n(function({ className: t, ...n }, i) {
+	return /* @__PURE__ */ r("p", {
+		ref: i,
+		className: e("lyds-feedback__description", t),
+		...n
 	});
-}), u = r(function({ className: t, ...r }, a) {
-	return /* @__PURE__ */ i("div", {
-		ref: a,
-		className: n(e.feedbackActions, t),
-		...r
+}), l = n(function({ className: t, ...n }, i) {
+	return /* @__PURE__ */ r("div", {
+		ref: i,
+		className: e("lyds-feedback__actions", t),
+		...n
 	});
 });
 //#endregion
-export { a as Alert, u as AlertActions, s as AlertContent, l as AlertDescription, c as AlertTitle, o as AlertView };
+export { i as Alert, l as AlertActions, o as AlertContent, c as AlertDescription, s as AlertTitle, a as AlertView };
 
 //# sourceMappingURL=alert.js.map

package/dist/components/feedback/alert.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert.js","names":[],"sources":["../../../src/components/feedback/alert.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes } from \"react\";\n\nimport styles from \"./feedback.module.css\";\nimport { getLiveRegionProps, mergeClassNames, type FeedbackLiveMode, type FeedbackStatus } from \"./feedback.types\";\n\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={mergeClassNames(styles.feedbackPanel, styles.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={mergeClassNames(styles.feedbackContent, className)} {...props} />;\n});\n\nexport const AlertTitle = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(function AlertTitle({ className, ...props }, ref) {\n\treturn <div ref={ref} className={mergeClassNames(styles.feedbackTitle, className)} {...props} />;\n});\n\nexport const AlertDescription = forwardRef<HTMLParagraphElement, HTMLAttributes<HTMLParagraphElement>>(function AlertDescription({ className, ...props }, ref) {\n\treturn <p ref={ref} className={mergeClassNames(styles.feedbackDescription, className)} {...props} />;\n});\n\nexport const AlertActions = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(function AlertActions({ className, ...props }, ref) {\n\treturn <div ref={ref} className={mergeClassNames(styles.feedbackActions, className)} {...props} />;\n});\n"],"mappings":";;;;;AAkBA,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,EAAgB,EAAO,eAAe,EAAO,OAAO,CAAS;EACxE,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,EAAgB,EAAO,iBAAiB,CAAS;EAAG,GAAI;CAAQ,CAAA;AAClG,CAAC,GAEY,IAAa,EAA2D,SAAoB,EAAE,cAAW,GAAG,KAAS,GAAK;CACtI,OAAO,kBAAC,OAAD;EAAU;EAAK,WAAW,EAAgB,EAAO,eAAe,CAAS;EAAG,GAAI;CAAQ,CAAA;AAChG,CAAC,GAEY,IAAmB,EAAuE,SAA0B,EAAE,cAAW,GAAG,KAAS,GAAK;CAC9J,OAAO,kBAAC,KAAD;EAAQ;EAAK,WAAW,EAAgB,EAAO,qBAAqB,CAAS;EAAG,GAAI;CAAQ,CAAA;AACpG,CAAC,GAEY,IAAe,EAA2D,SAAsB,EAAE,cAAW,GAAG,KAAS,GAAK;CAC1I,OAAO,kBAAC,OAAD;EAAU;EAAK,WAAW,EAAgB,EAAO,iBAAiB,CAAS;EAAG,GAAI;CAAQ,CAAA;AAClG,CAAC"}
+{"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"}