@linyao.tw/ui 1.0.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/README.md +9 -1
- package/dist/components/date-time/calendar.js +8 -6
- package/dist/components/date-time/calendar.js.map +1 -1
- package/dist/components/date-time/date-field.js +10 -8
- package/dist/components/date-time/date-field.js.map +1 -1
- package/dist/components/date-time/date-picker.js +8 -6
- package/dist/components/date-time/date-picker.js.map +1 -1
- package/dist/components/date-time/date-range-picker.js +8 -6
- package/dist/components/date-time/date-range-picker.js.map +1 -1
- package/dist/components/date-time/index.js +1 -1
- package/dist/components/date-time/shared.d.ts +0 -1
- package/dist/components/date-time/shared.js +7 -9
- package/dist/components/date-time/shared.js.map +1 -1
- package/dist/components/date-time/time-field.js +8 -6
- package/dist/components/date-time/time-field.js.map +1 -1
- package/dist/components/feedback/alert.js +35 -34
- package/dist/components/feedback/alert.js.map +1 -1
- package/dist/components/feedback/banner.js +15 -14
- package/dist/components/feedback/banner.js.map +1 -1
- package/dist/components/feedback/empty-state.d.ts +2 -1
- package/dist/components/feedback/empty-state.js +31 -31
- package/dist/components/feedback/empty-state.js.map +1 -1
- package/dist/components/feedback/feedback.types.d.ts +0 -1
- package/dist/components/feedback/feedback.types.js +3 -5
- package/dist/components/feedback/feedback.types.js.map +1 -1
- package/dist/components/feedback/index.d.ts +8 -8
- package/dist/components/feedback/meter.js +21 -21
- package/dist/components/feedback/meter.js.map +1 -1
- package/dist/components/feedback/progress.js +21 -21
- package/dist/components/feedback/progress.js.map +1 -1
- package/dist/components/feedback/skeleton.js +11 -11
- package/dist/components/feedback/skeleton.js.map +1 -1
- package/dist/components/feedback/spinner.js +25 -25
- package/dist/components/feedback/spinner.js.map +1 -1
- package/dist/components/feedback/toast.js +23 -21
- package/dist/components/feedback/toast.js.map +1 -1
- package/dist/components/forms/{CodeField.d.ts → code-field.d.ts} +1 -1
- package/dist/components/forms/code-field.js +66 -0
- package/dist/components/forms/code-field.js.map +1 -0
- package/dist/components/forms/{FileUpload.d.ts → file-upload.d.ts} +1 -1
- package/dist/components/forms/{FileUpload.js → file-upload.js} +128 -111
- package/dist/components/forms/file-upload.js.map +1 -0
- package/dist/components/forms/index.d.ts +6 -6
- package/dist/components/forms/{Input.js → input.js} +4 -3
- package/dist/components/forms/input.js.map +1 -0
- package/dist/components/forms/internal.d.ts +0 -2
- package/dist/components/forms/internal.js +22 -25
- package/dist/components/forms/internal.js.map +1 -1
- package/dist/components/forms/number-field.js +74 -0
- package/dist/components/forms/number-field.js.map +1 -0
- package/dist/components/forms/otp-field.js +58 -0
- package/dist/components/forms/otp-field.js.map +1 -0
- package/dist/components/forms/{TextField.d.ts → text-field.d.ts} +5 -0
- package/dist/components/forms/text-field.js +201 -0
- package/dist/components/forms/text-field.js.map +1 -0
- package/dist/components/foundations/{Avatar.js → avatar.js} +13 -10
- package/dist/components/foundations/avatar.js.map +1 -0
- package/dist/components/foundations/{Badge.d.ts → badge.d.ts} +1 -1
- package/dist/components/foundations/{Badge.js → badge.js} +4 -3
- package/dist/components/foundations/badge.js.map +1 -0
- package/dist/components/foundations/{Button.js → button.js} +4 -3
- package/dist/components/foundations/button.js.map +1 -0
- package/dist/components/foundations/{Card.d.ts → card.d.ts} +9 -2
- package/dist/components/foundations/{Card.js → card.js} +6 -5
- package/dist/components/foundations/card.js.map +1 -0
- package/dist/components/foundations/{IconButton.d.ts → icon-button.d.ts} +2 -8
- package/dist/components/foundations/{IconButton.js → icon-button.js} +5 -4
- package/dist/components/foundations/icon-button.js.map +1 -0
- package/dist/components/foundations/index.d.ts +9 -9
- package/dist/components/foundations/{Link.d.ts → link.d.ts} +1 -1
- package/dist/components/foundations/link.js +47 -0
- package/dist/components/foundations/link.js.map +1 -0
- package/dist/components/foundations/{ListCell.d.ts → list-cell.d.ts} +1 -8
- package/dist/components/foundations/{ListCell.js → list-cell.js} +4 -3
- package/dist/components/foundations/list-cell.js.map +1 -0
- package/dist/components/foundations/{SectionHeading.d.ts → section-heading.d.ts} +5 -2
- package/dist/components/foundations/{SectionHeading.js → section-heading.js} +4 -3
- package/dist/components/foundations/section-heading.js.map +1 -0
- package/dist/components/foundations/{Separator.js → separator.js} +4 -3
- package/dist/components/foundations/separator.js.map +1 -0
- package/dist/components/navigation-data/breadcrumb-pagination.js +89 -81
- package/dist/components/navigation-data/breadcrumb-pagination.js.map +1 -1
- package/dist/components/navigation-data/command-palette.d.ts +26 -0
- package/dist/components/navigation-data/command-palette.js +101 -72
- package/dist/components/navigation-data/command-palette.js.map +1 -1
- package/dist/components/navigation-data/header-tab-bar.js +50 -46
- package/dist/components/navigation-data/header-tab-bar.js.map +1 -1
- package/dist/components/navigation-data/index.d.ts +7 -7
- package/dist/components/navigation-data/menubar-toolbar.js +2 -1
- package/dist/components/navigation-data/menubar-toolbar.js.map +1 -1
- package/dist/components/navigation-data/navigation-menu.js +2 -1
- package/dist/components/navigation-data/navigation-menu.js.map +1 -1
- package/dist/components/navigation-data/scroll-area.js +2 -1
- package/dist/components/navigation-data/scroll-area.js.map +1 -1
- package/dist/components/navigation-data/table-collection.d.ts +12 -3
- package/dist/components/navigation-data/table-collection.js +12 -9
- package/dist/components/navigation-data/table-collection.js.map +1 -1
- package/dist/components/overlays/dialog.d.ts +23 -3
- package/dist/components/overlays/dialog.js +138 -130
- package/dist/components/overlays/dialog.js.map +1 -1
- package/dist/components/overlays/disclosure.js +2 -1
- package/dist/components/overlays/disclosure.js.map +1 -1
- package/dist/components/overlays/drawer.d.ts +9 -2
- package/dist/components/overlays/drawer.js +158 -151
- package/dist/components/overlays/drawer.js.map +1 -1
- package/dist/components/overlays/floating.js +116 -113
- package/dist/components/overlays/floating.js.map +1 -1
- package/dist/components/overlays/index.d.ts +4 -4
- package/dist/components/selection/combobox.js +94 -93
- package/dist/components/selection/combobox.js.map +1 -1
- package/dist/components/selection/controls.d.ts +4 -1
- package/dist/components/selection/controls.js +141 -118
- package/dist/components/selection/controls.js.map +1 -1
- package/dist/components/selection/menu.js +121 -121
- package/dist/components/selection/menu.js.map +1 -1
- package/dist/components/selection/select.js +108 -107
- package/dist/components/selection/select.js.map +1 -1
- package/dist/fonts.css +13 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +39 -33
- package/dist/internal/accessible-name.d.ts +12 -0
- package/dist/internal/class-names.d.ts +12 -0
- package/dist/{components/selection/classnames.js → internal/class-names.js} +4 -3
- package/dist/internal/class-names.js.map +1 -0
- package/dist/internal/index.d.ts +3 -0
- package/dist/{components/foundations/shared.d.ts → internal/render.d.ts} +2 -1
- package/dist/intl/index.d.ts +3 -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.d.ts +48 -0
- package/dist/intl/messages.js +81 -0
- package/dist/intl/messages.js.map +1 -0
- package/dist/intl/provider.d.ts +18 -0
- package/dist/intl/provider.js +31 -0
- package/dist/intl/provider.js.map +1 -0
- package/dist/styles.css +1 -1
- package/package.json +6 -4
- package/dist/components/feedback/feedback.module.js +0 -42
- package/dist/components/feedback/feedback.module.js.map +0 -1
- package/dist/components/forms/CodeField.js +0 -63
- package/dist/components/forms/CodeField.js.map +0 -1
- package/dist/components/forms/FileUpload.js.map +0 -1
- package/dist/components/forms/Input.js.map +0 -1
- package/dist/components/forms/NumberField.js +0 -71
- package/dist/components/forms/NumberField.js.map +0 -1
- package/dist/components/forms/OTPField.js +0 -54
- package/dist/components/forms/OTPField.js.map +0 -1
- package/dist/components/forms/TextField.js +0 -199
- package/dist/components/forms/TextField.js.map +0 -1
- package/dist/components/foundations/Avatar.js.map +0 -1
- package/dist/components/foundations/Badge.js.map +0 -1
- package/dist/components/foundations/Button.js.map +0 -1
- package/dist/components/foundations/Card.js.map +0 -1
- package/dist/components/foundations/IconButton.js.map +0 -1
- package/dist/components/foundations/Link.js +0 -40
- package/dist/components/foundations/Link.js.map +0 -1
- package/dist/components/foundations/ListCell.js.map +0 -1
- package/dist/components/foundations/SectionHeading.js.map +0 -1
- package/dist/components/foundations/Separator.js.map +0 -1
- package/dist/components/foundations/shared.js +0 -8
- package/dist/components/foundations/shared.js.map +0 -1
- package/dist/components/navigation-data/utils.d.ts +0 -2
- package/dist/components/navigation-data/utils.js +0 -11
- package/dist/components/navigation-data/utils.js.map +0 -1
- package/dist/components/overlays/class-names.d.ts +0 -6
- package/dist/components/overlays/class-names.js +0 -11
- package/dist/components/overlays/class-names.js.map +0 -1
- package/dist/components/selection/classnames.d.ts +0 -4
- package/dist/components/selection/classnames.js.map +0 -1
- package/dist/components/selection/selection.module.js +0 -51
- package/dist/components/selection/selection.module.js.map +0 -1
- /package/dist/components/forms/{Input.d.ts → input.d.ts} +0 -0
- /package/dist/components/forms/{NumberField.d.ts → number-field.d.ts} +0 -0
- /package/dist/components/forms/{OTPField.d.ts → otp-field.d.ts} +0 -0
- /package/dist/components/foundations/{Avatar.d.ts → avatar.d.ts} +0 -0
- /package/dist/components/foundations/{Button.d.ts → button.d.ts} +0 -0
- /package/dist/components/foundations/{Separator.d.ts → separator.d.ts} +0 -0
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Avatar.js","names":[],"sources":["../../../src/components/foundations/Avatar.tsx"],"sourcesContent":["import { Avatar as BaseAvatar, type AvatarImageProps, type AvatarRootProps, type ImageLoadingStatus } from \"@base-ui/react/avatar\";\nimport * as React from \"react\";\nimport { mergeClassNames } from \"./shared\";\n\nexport type AvatarSize = \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\nexport type AvatarVariant = \"neutral\" | \"accent\";\nexport type AvatarStatus = \"online\" | \"away\" | \"busy\" | \"offline\";\n\nexport interface AvatarBaseProps extends Omit<AvatarRootProps, \"children\" | \"className\" | \"style\"> {\n\tsrc?: string;\n\talt: string;\n\tfallback?: React.ReactNode;\n\tfallbackDelay?: number;\n\tsize?: AvatarSize;\n\tvariant?: AvatarVariant;\n\timageProps?: Omit<AvatarImageProps, \"alt\" | \"className\" | \"onLoadingStatusChange\" | \"src\"> & { className?: string };\n\tonLoadingStatusChange?: (status: ImageLoadingStatus) => void;\n\tclassName?: string;\n\tstyle?: React.CSSProperties;\n}\n\nexport type AvatarProps = AvatarBaseProps & ({ status?: never; statusLabel?: never } | { status: AvatarStatus; statusLabel: string });\n\nfunction getInitials(label: string): string {\n\treturn label\n\t\t.trim()\n\t\t.split(/\\s+/u)\n\t\t.slice(0, 2)\n\t\t.map(part => Array.from(part)[0] ?? \"\")\n\t\t.join(\"\")\n\t\t.toUpperCase();\n}\n\nexport const Avatar = React.forwardRef<HTMLSpanElement, AvatarProps>(function Avatar(\n\t{ src, alt, fallback, fallbackDelay, size = \"md\", variant = \"neutral\", status, statusLabel, imageProps, onLoadingStatusChange, className, style, ...props },\n\tref\n) {\n\tconst accessibleLabel = statusLabel ? `${alt}, ${statusLabel}` : alt;\n\n\treturn (\n\t\t<BaseAvatar.Root\n\t\t\t{...props}\n\t\t\tref={ref}\n\t\t\taria-label={props[\"aria-label\"] ?? accessibleLabel}\n\t\t\trole={props.role ?? \"img\"}\n\t\t\tdata-size={size}\n\t\t\tdata-variant={variant}\n\t\t\tclassName={mergeClassNames(\"lyds-avatar\", className)}\n\t\t\tstyle={style}\n\t\t>\n\t\t\t{src ? <BaseAvatar.Image {...imageProps} src={src} alt=\"\" className={mergeClassNames(\"lyds-avatar__image\", imageProps?.className)} onLoadingStatusChange={onLoadingStatusChange} /> : null}\n\t\t\t<BaseAvatar.Fallback className=\"lyds-avatar__fallback\" delay={fallbackDelay}>\n\t\t\t\t{fallback ?? getInitials(alt)}\n\t\t\t</BaseAvatar.Fallback>\n\t\t\t{status ? <span className=\"lyds-avatar__status\" data-status={status} aria-hidden=\"true\" /> : null}\n\t\t</BaseAvatar.Root>\n\t);\n});\n\nAvatar.displayName = \"Avatar\";\n"],"mappings":";;;;;AAuBA,SAAS,EAAY,GAAuB;CAC3C,OAAO,EACL,KAAK,CAAC,CACN,MAAM,MAAM,CAAC,CACb,MAAM,GAAG,CAAC,CAAC,CACX,KAAI,MAAQ,MAAM,KAAK,CAAI,CAAC,CAAC,MAAM,EAAE,CAAC,CACtC,KAAK,EAAE,CAAC,CACR,YAAY;AACf;AAEA,IAAa,IAAS,EAAM,WAAyC,SACpE,EAAE,QAAK,QAAK,aAAU,kBAAe,UAAO,MAAM,aAAU,WAAW,WAAQ,gBAAa,eAAY,0BAAuB,cAAW,UAAO,GAAG,KACpJ,GACC;CACD,IAAM,IAAkB,IAAc,GAAG,EAAI,IAAI,MAAgB;CAEjE,OACC,kBAAC,EAAW,MAAZ;EACC,GAAI;EACC;EACL,cAAY,EAAM,iBAAiB;EACnC,MAAM,EAAM,QAAQ;EACpB,aAAW;EACX,gBAAc;EACd,WAAW,EAAgB,eAAe,CAAS;EAC5C;EARR,UAAA;GAUE,IAAM,kBAAC,EAAW,OAAZ;IAAkB,GAAI;IAAiB;IAAK,KAAI;IAAG,WAAW,EAAgB,sBAAsB,GAAY,SAAS;IAA0B;GAAwB,CAAA,IAAI;GACtL,kBAAC,EAAW,UAAZ;IAAqB,WAAU;IAAwB,OAAO;IAC5D,UAAA,KAAY,EAAY,CAAG;GACR,CAAA;GACpB,IAAS,kBAAC,QAAD;IAAM,WAAU;IAAsB,eAAa;IAAQ,eAAY;GAAQ,CAAA,IAAI;EAC7E;;AAEnB,CAAC;AAED,EAAO,cAAc"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Badge.js","names":[],"sources":["../../../src/components/foundations/Badge.tsx"],"sourcesContent":["import { useRender } from \"@base-ui/react/use-render\";\nimport * as React from \"react\";\nimport { type ComponentRenderProp, type ElementProps, mergeClassNames } from \"./shared\";\n\nexport type BadgeVariant = \"neutral\" | \"accent\" | \"success\" | \"warning\" | \"danger\";\nexport type BadgeSize = \"sm\" | \"md\";\n\nexport interface BadgeState extends Record<string, unknown> {\n\tsize: BadgeSize;\n\tvariant: BadgeVariant;\n}\n\nexport interface BadgeProps extends Omit<ElementProps<\"span\">, \"children\"> {\n\tchildren: React.ReactNode;\n\tvariant?: BadgeVariant;\n\tsize?: BadgeSize;\n\trender?: ComponentRenderProp<BadgeState>;\n}\n\nexport const Badge = React.forwardRef<HTMLSpanElement, BadgeProps>(function Badge({ children, variant = \"neutral\", size = \"md\", render, className, ...props }, ref) {\n\treturn useRender<BadgeState, HTMLSpanElement>({\n\t\tdefaultTagName: \"span\",\n\t\tref,\n\t\trender,\n\t\tstate: { size, variant },\n\t\tprops: {\n\t\t\t...props,\n\t\t\tchildren: (\n\t\t\t\t<>\n\t\t\t\t\t<span className=\"lyds-badge__indicator\" aria-hidden=\"true\" />\n\t\t\t\t\t<span className=\"lyds-badge__label\">{children}</span>\n\t\t\t\t</>\n\t\t\t),\n\t\t\tclassName: mergeClassNames(\"lyds-badge\", className)\n\t\t}\n\t});\n});\n\nBadge.displayName = \"Badge\";\n"],"mappings":";;;;;AAmBA,IAAa,IAAQ,EAAM,WAAwC,SAAe,EAAE,aAAU,aAAU,WAAW,UAAO,MAAM,WAAQ,cAAW,GAAG,KAAS,GAAK;CACnK,OAAO,EAAuC;EAC7C,gBAAgB;EAChB;EACA;EACA,OAAO;GAAE;GAAM;EAAQ;EACvB,OAAO;GACN,GAAG;GACH,UACC,kBAAA,GAAA,EAAA,UAAA,CACC,kBAAC,QAAD;IAAM,WAAU;IAAwB,eAAY;GAAQ,CAAA,GAC5D,kBAAC,QAAD;IAAM,WAAU;IAAqB;GAAe,CAAA,CACnD,EAAA,CAAA;GAEH,WAAW,EAAgB,cAAc,CAAS;EACnD;CACD,CAAC;AACF,CAAC;AAED,EAAM,cAAc"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","names":[],"sources":["../../../src/components/foundations/Button.tsx"],"sourcesContent":["import { Button as BaseButton, type ButtonProps as BaseButtonProps } from \"@base-ui/react/button\";\nimport * as React from \"react\";\nimport { mergeClassNames } from \"./shared\";\n\nexport type ButtonVariant = \"primary\" | \"secondary\" | \"neutral\" | \"quiet\" | \"danger\";\nexport type ButtonSize = \"sm\" | \"md\" | \"lg\";\n\nexport interface ButtonProps extends Omit<BaseButtonProps, \"children\" | \"className\" | \"style\"> {\n\tchildren: React.ReactNode;\n\tvariant?: ButtonVariant;\n\tsize?: ButtonSize;\n\tloading?: boolean;\n\tloadingIndicator?: React.ReactNode;\n\t/** 裝飾性的前置圖示。請使用 @phosphor-icons/react;按鈕文字仍是無障礙名稱。 */\n\tstartIcon?: React.ReactNode;\n\t/** 裝飾性的後置圖示。請使用 @phosphor-icons/react;按鈕文字仍是無障礙名稱。 */\n\tendIcon?: React.ReactNode;\n\tclassName?: string;\n\tstyle?: React.CSSProperties;\n}\n\nexport const Button = React.forwardRef<HTMLElement, ButtonProps>(function Button(\n\t{ children, variant = \"primary\", size = \"md\", loading = false, loadingIndicator, startIcon, endIcon, className, disabled = false, focusableWhenDisabled, type, nativeButton, style, ...props },\n\tref\n) {\n\tconst isDisabled = disabled || loading;\n\n\treturn (\n\t\t<BaseButton\n\t\t\t{...props}\n\t\t\tref={ref}\n\t\t\tnativeButton={nativeButton}\n\t\t\ttype={type ?? (nativeButton === false ? undefined : \"button\")}\n\t\t\tdisabled={isDisabled}\n\t\t\tfocusableWhenDisabled={focusableWhenDisabled ?? loading}\n\t\t\taria-busy={loading || undefined}\n\t\t\tdata-loading={loading ? \"\" : undefined}\n\t\t\tdata-variant={variant}\n\t\t\tdata-size={size}\n\t\t\tclassName={mergeClassNames(\"lyds-button\", className)}\n\t\t\tstyle={style}\n\t\t>\n\t\t\t{loading ? (\n\t\t\t\t<span className=\"lyds-button__spinner\" aria-hidden=\"true\">\n\t\t\t\t\t{loadingIndicator}\n\t\t\t\t</span>\n\t\t\t) : startIcon ? (\n\t\t\t\t<span className=\"lyds-button__icon\" aria-hidden=\"true\">\n\t\t\t\t\t{startIcon}\n\t\t\t\t</span>\n\t\t\t) : null}\n\t\t\t<span className=\"lyds-button__label\">{children}</span>\n\t\t\t{!loading && endIcon ? (\n\t\t\t\t<span className=\"lyds-button__icon\" aria-hidden=\"true\">\n\t\t\t\t\t{endIcon}\n\t\t\t\t</span>\n\t\t\t) : null}\n\t\t</BaseButton>\n\t);\n});\n\nButton.displayName = \"Button\";\n"],"mappings":";;;;;AAqBA,IAAa,IAAS,EAAM,WAAqC,SAChE,EAAE,aAAU,aAAU,WAAW,UAAO,MAAM,aAAU,IAAO,qBAAkB,cAAW,YAAS,cAAW,cAAW,IAAO,0BAAuB,SAAM,iBAAc,UAAO,GAAG,KACvL,GACC;CACD,IAAM,IAAa,KAAY;CAE/B,OACC,kBAAC,GAAD;EACC,GAAI;EACC;EACS;EACd,MAAM,MAAS,MAAiB,KAAQ,KAAA,IAAY;EACpD,UAAU;EACV,uBAAuB,KAAyB;EAChD,aAAW,KAAW,KAAA;EACtB,gBAAc,IAAU,KAAK,KAAA;EAC7B,gBAAc;EACd,aAAW;EACX,WAAW,EAAgB,eAAe,CAAS;EAC5C;EAZR,UAAA;GAcE,IACA,kBAAC,QAAD;IAAM,WAAU;IAAuB,eAAY;IACjD,UAAA;GACI,CAAA,IACH,IACH,kBAAC,QAAD;IAAM,WAAU;IAAoB,eAAY;IAC9C,UAAA;GACI,CAAA,IACH;GACJ,kBAAC,QAAD;IAAM,WAAU;IAAsB;GAAe,CAAA;GACpD,CAAC,KAAW,IACZ,kBAAC,QAAD;IAAM,WAAU;IAAoB,eAAY;IAC9C,UAAA;GACI,CAAA,IACH;EACO;;AAEd,CAAC;AAED,EAAO,cAAc"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Card.js","names":[],"sources":["../../../src/components/foundations/Card.tsx"],"sourcesContent":["import { useRender } from \"@base-ui/react/use-render\";\nimport * as React from \"react\";\nimport { type ComponentRenderProp, type ElementProps, mergeClassNames } from \"./shared\";\n\nexport type CardVariant = \"material\" | \"elevated\" | \"inset\" | \"outline\" | \"cloud\";\nexport type CardSize = \"sm\" | \"md\" | \"lg\";\n\nexport interface CardState extends Record<string, unknown> {\n\tsize: CardSize;\n\tvariant: CardVariant;\n}\n\nexport interface CardProps extends Omit<ElementProps<\"div\">, \"children\"> {\n\tchildren: React.ReactNode;\n\tvariant?: CardVariant;\n\tsize?: CardSize;\n\trender?: ComponentRenderProp<CardState>;\n}\n\nexport const Card = React.forwardRef<HTMLDivElement, CardProps>(function Card({ children, variant = \"material\", size = \"md\", render, className, ...props }, ref) {\n\treturn useRender<CardState, HTMLDivElement>({\n\t\tdefaultTagName: \"div\",\n\t\tref,\n\t\trender,\n\t\tstate: { size, variant },\n\t\tprops: {\n\t\t\t...props,\n\t\t\tchildren,\n\t\t\tclassName: mergeClassNames(\"lyds-card\", className)\n\t\t}\n\t});\n});\n\nCard.displayName = \"Card\";\n\nexport type CloudBoxProps = Omit<CardProps, \"variant\">;\n\nexport const CloudBox = React.forwardRef<HTMLDivElement, CloudBoxProps>(function CloudBox(props, ref) {\n\treturn <Card {...props} ref={ref} variant=\"cloud\" />;\n});\n\nCloudBox.displayName = \"CloudBox\";\n\ntype CardSlotProps<ElementType extends React.ElementType> = Omit<ElementProps<ElementType>, \"children\"> & {\n\tchildren: React.ReactNode;\n\trender?: ComponentRenderProp<Record<string, unknown>>;\n};\n\nfunction useCardSlot<Element extends HTMLElement>(\n\tdefaultTagName: keyof React.JSX.IntrinsicElements,\n\tslotName: string,\n\tchildren: React.ReactNode,\n\trender: ComponentRenderProp<Record<string, unknown>> | undefined,\n\tclassName: string | undefined,\n\tprops: Record<string, unknown>,\n\tref: React.ForwardedRef<Element>\n) {\n\treturn useRender<Record<string, unknown>, Element>({\n\t\tdefaultTagName,\n\t\tref,\n\t\trender,\n\t\tprops: {\n\t\t\t...props,\n\t\t\tchildren,\n\t\t\tclassName: mergeClassNames(`lyds-card__${slotName}`, className)\n\t\t}\n\t});\n}\n\nexport type CardHeaderProps = CardSlotProps<\"div\">;\nexport const CardHeader = React.forwardRef<HTMLDivElement, CardHeaderProps>(function CardHeader({ children, render, className, ...props }, ref) {\n\treturn useCardSlot(\"div\", \"header\", children, render, className, props, ref);\n});\n\nexport type CardTitleProps = CardSlotProps<\"h3\">;\nexport const CardTitle = React.forwardRef<HTMLHeadingElement, CardTitleProps>(function CardTitle({ children, render, className, ...props }, ref) {\n\treturn useCardSlot(\"h3\", \"title\", children, render, className, props, ref);\n});\n\nexport type CardDescriptionProps = CardSlotProps<\"p\">;\nexport const CardDescription = React.forwardRef<HTMLParagraphElement, CardDescriptionProps>(function CardDescription({ children, render, className, ...props }, ref) {\n\treturn useCardSlot(\"p\", \"description\", children, render, className, props, ref);\n});\n\nexport type CardBodyProps = CardSlotProps<\"div\">;\nexport const CardBody = React.forwardRef<HTMLDivElement, CardBodyProps>(function CardBody({ children, render, className, ...props }, ref) {\n\treturn useCardSlot(\"div\", \"body\", children, render, className, props, ref);\n});\n\nexport type CardFooterProps = CardSlotProps<\"div\">;\nexport const CardFooter = React.forwardRef<HTMLDivElement, CardFooterProps>(function CardFooter({ children, render, className, ...props }, ref) {\n\treturn useCardSlot(\"div\", \"footer\", children, render, className, props, ref);\n});\n"],"mappings":";;;;;AAmBA,IAAa,IAAO,EAAM,WAAsC,SAAc,EAAE,aAAU,aAAU,YAAY,UAAO,MAAM,WAAQ,cAAW,GAAG,KAAS,GAAK;CAChK,OAAO,EAAqC;EAC3C,gBAAgB;EAChB;EACA;EACA,OAAO;GAAE;GAAM;EAAQ;EACvB,OAAO;GACN,GAAG;GACH;GACA,WAAW,EAAgB,aAAa,CAAS;EAClD;CACD,CAAC;AACF,CAAC;AAED,EAAK,cAAc;AAInB,IAAa,IAAW,EAAM,WAA0C,SAAkB,GAAO,GAAK;CACrG,OAAO,kBAAC,GAAD;EAAM,GAAI;EAAY;EAAK,SAAQ;CAAS,CAAA;AACpD,CAAC;AAED,EAAS,cAAc;AAOvB,SAAS,EACR,GACA,GACA,GACA,GACA,GACA,GACA,GACC;CACD,OAAO,EAA4C;EAClD;EACA;EACA;EACA,OAAO;GACN,GAAG;GACH;GACA,WAAW,EAAgB,cAAc,KAAY,CAAS;EAC/D;CACD,CAAC;AACF;AAGA,IAAa,IAAa,EAAM,WAA4C,SAAoB,EAAE,aAAU,WAAQ,cAAW,GAAG,KAAS,GAAK;CAC/I,OAAO,EAAY,OAAO,UAAU,GAAU,GAAQ,GAAW,GAAO,CAAG;AAC5E,CAAC,GAGY,IAAY,EAAM,WAA+C,SAAmB,EAAE,aAAU,WAAQ,cAAW,GAAG,KAAS,GAAK;CAChJ,OAAO,EAAY,MAAM,SAAS,GAAU,GAAQ,GAAW,GAAO,CAAG;AAC1E,CAAC,GAGY,IAAkB,EAAM,WAAuD,SAAyB,EAAE,aAAU,WAAQ,cAAW,GAAG,KAAS,GAAK;CACpK,OAAO,EAAY,KAAK,eAAe,GAAU,GAAQ,GAAW,GAAO,CAAG;AAC/E,CAAC,GAGY,IAAW,EAAM,WAA0C,SAAkB,EAAE,aAAU,WAAQ,cAAW,GAAG,KAAS,GAAK;CACzI,OAAO,EAAY,OAAO,QAAQ,GAAU,GAAQ,GAAW,GAAO,CAAG;AAC1E,CAAC,GAGY,IAAa,EAAM,WAA4C,SAAoB,EAAE,aAAU,WAAQ,cAAW,GAAG,KAAS,GAAK;CAC/I,OAAO,EAAY,OAAO,UAAU,GAAU,GAAQ,GAAW,GAAO,CAAG;AAC5E,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"IconButton.js","names":[],"sources":["../../../src/components/foundations/IconButton.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Button, type ButtonProps } from \"./Button\";\nimport { mergeClassNames } from \"./shared\";\n\ntype AccessibleName =\n\t| {\n\t\t\t\"aria-label\": string;\n\t\t\t\"aria-labelledby\"?: string;\n\t }\n\t| {\n\t\t\t\"aria-label\"?: string;\n\t\t\t\"aria-labelledby\": string;\n\t };\n\ntype IconButtonBaseProps = Omit<ButtonProps, \"aria-label\" | \"aria-labelledby\" | \"children\" | \"endIcon\" | \"startIcon\"> & {\n\tchildren: React.ReactNode;\n};\n\nexport type IconButtonProps = IconButtonBaseProps & AccessibleName;\n\nexport const IconButton = React.forwardRef<HTMLElement, IconButtonProps>(function IconButton({ children, className, loading = false, ...props }, ref) {\n\treturn (\n\t\t<Button {...props} ref={ref} className={mergeClassNames(\"lyds-icon-button\", className)} loading={loading}>\n\t\t\t{loading ? null : children}\n\t\t</Button>\n\t);\n});\n\nIconButton.displayName = \"IconButton\";\n"],"mappings":";;;;;AAoBA,IAAa,IAAa,EAAM,WAAyC,SAAoB,EAAE,aAAU,cAAW,aAAU,IAAO,GAAG,KAAS,GAAK;CACrJ,OACC,kBAAC,GAAD;EAAQ,GAAI;EAAY;EAAK,WAAW,EAAgB,oBAAoB,CAAS;EAAY;EAC/F,UAAA,IAAU,OAAO;CACX,CAAA;AAEV,CAAC;AAED,EAAW,cAAc"}
|
|
@@ -1,40 +0,0 @@
|
|
|
1
|
-
import { mergeClassNames as e } from "./shared.js";
|
|
2
|
-
import * as t from "react";
|
|
3
|
-
import { useRender as n } from "@base-ui/react/use-render";
|
|
4
|
-
//#region src/components/foundations/Link.tsx
|
|
5
|
-
var r = t.forwardRef(function({ children: t, variant: r = "default", size: i = "md", disabled: a = !1, external: o = !1, render: s, className: c, href: l, target: u, rel: d, onClick: f, ...p }, m) {
|
|
6
|
-
let h = {
|
|
7
|
-
disabled: a,
|
|
8
|
-
external: o,
|
|
9
|
-
size: i,
|
|
10
|
-
variant: r
|
|
11
|
-
}, g = u === "_blank" && !d ? "noopener noreferrer" : d;
|
|
12
|
-
return n({
|
|
13
|
-
defaultTagName: "a",
|
|
14
|
-
ref: m,
|
|
15
|
-
render: a ? void 0 : s,
|
|
16
|
-
state: h,
|
|
17
|
-
props: {
|
|
18
|
-
...p,
|
|
19
|
-
children: t,
|
|
20
|
-
href: a ? void 0 : l,
|
|
21
|
-
target: u,
|
|
22
|
-
rel: g,
|
|
23
|
-
"aria-disabled": a || void 0,
|
|
24
|
-
tabIndex: a ? -1 : p.tabIndex,
|
|
25
|
-
className: e("lyds-link", c),
|
|
26
|
-
onClick: (e) => {
|
|
27
|
-
if (a) {
|
|
28
|
-
e.preventDefault(), e.stopPropagation();
|
|
29
|
-
return;
|
|
30
|
-
}
|
|
31
|
-
f?.(e);
|
|
32
|
-
}
|
|
33
|
-
}
|
|
34
|
-
});
|
|
35
|
-
});
|
|
36
|
-
r.displayName = "Link";
|
|
37
|
-
//#endregion
|
|
38
|
-
export { r as Link };
|
|
39
|
-
|
|
40
|
-
//# sourceMappingURL=Link.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Link.js","names":[],"sources":["../../../src/components/foundations/Link.tsx"],"sourcesContent":["import { useRender } from \"@base-ui/react/use-render\";\nimport * as React from \"react\";\nimport { type ComponentRenderProp, type ElementProps, mergeClassNames } from \"./shared\";\n\nexport type LinkVariant = \"default\" | \"accent\" | \"subtle\";\nexport type LinkSize = \"sm\" | \"md\" | \"lg\";\n\nexport interface LinkState extends Record<string, unknown> {\n\tdisabled: boolean;\n\texternal: boolean;\n\tsize: LinkSize;\n\tvariant: LinkVariant;\n}\n\nexport interface LinkProps extends Omit<ElementProps<\"a\">, \"children\"> {\n\tchildren: React.ReactNode;\n\tvariant?: LinkVariant;\n\tsize?: LinkSize;\n\tdisabled?: boolean;\n\texternal?: boolean;\n\trender?: ComponentRenderProp<LinkState>;\n}\n\nexport const Link = React.forwardRef<HTMLAnchorElement, LinkProps>(function Link(\n\t{ children, variant = \"default\", size = \"md\", disabled = false, external = false, render, className, href, target, rel, onClick, ...props },\n\tref\n) {\n\tconst state: LinkState = { disabled, external, size, variant };\n\tconst secureRel = target === \"_blank\" && !rel ? \"noopener noreferrer\" : rel;\n\n\treturn useRender<LinkState, HTMLAnchorElement>({\n\t\tdefaultTagName: \"a\",\n\t\tref,\n\t\t// 多型 `render` 函式或路由元件可能重新加入導覽行為。\n\t\t// 停用時改用無互動的原生連結,確保元件契約成立。\n\t\trender: disabled ? undefined : render,\n\t\tstate,\n\t\tprops: {\n\t\t\t...props,\n\t\t\tchildren,\n\t\t\thref: disabled ? undefined : href,\n\t\t\ttarget,\n\t\t\trel: secureRel,\n\t\t\t\"aria-disabled\": disabled || undefined,\n\t\t\ttabIndex: disabled ? -1 : props.tabIndex,\n\t\t\tclassName: mergeClassNames(\"lyds-link\", className),\n\t\t\tonClick: (event: React.MouseEvent<HTMLAnchorElement>) => {\n\t\t\t\tif (disabled) {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tonClick?.(event);\n\t\t\t}\n\t\t}\n\t});\n});\n\nLink.displayName = \"Link\";\n"],"mappings":";;;;AAuBA,IAAa,IAAO,EAAM,WAAyC,SAClE,EAAE,aAAU,aAAU,WAAW,UAAO,MAAM,cAAW,IAAO,cAAW,IAAO,WAAQ,cAAW,SAAM,WAAQ,QAAK,YAAS,GAAG,KACpI,GACC;CACD,IAAM,IAAmB;EAAE;EAAU;EAAU;EAAM;CAAQ,GACvD,IAAY,MAAW,YAAY,CAAC,IAAM,wBAAwB;CAExE,OAAO,EAAwC;EAC9C,gBAAgB;EAChB;EAGA,QAAQ,IAAW,KAAA,IAAY;EAC/B;EACA,OAAO;GACN,GAAG;GACH;GACA,MAAM,IAAW,KAAA,IAAY;GAC7B;GACA,KAAK;GACL,iBAAiB,KAAY,KAAA;GAC7B,UAAU,IAAW,KAAK,EAAM;GAChC,WAAW,EAAgB,aAAa,CAAS;GACjD,UAAU,MAA+C;IACxD,IAAI,GAAU;KAEb,AADA,EAAM,eAAe,GACrB,EAAM,gBAAgB;KACtB;IACD;IAEA,IAAU,CAAK;GAChB;EACD;CACD,CAAC;AACF,CAAC;AAED,EAAK,cAAc"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ListCell.js","names":[],"sources":["../../../src/components/foundations/ListCell.tsx"],"sourcesContent":["import { useRender } from \"@base-ui/react/use-render\";\nimport * as React from \"react\";\nimport { type ComponentRenderProp, type ElementProps, mergeClassNames } from \"./shared\";\n\nexport type ListCellVariant = \"default\" | \"inset\";\nexport type ListCellSize = \"sm\" | \"md\" | \"lg\";\nexport type ListCellCurrentSemantics = \"page\" | \"step\" | \"location\" | \"date\" | \"time\";\n\nexport interface ListCellState extends Record<string, unknown> {\n\tdisabled: boolean;\n\tinteractive: boolean;\n\tselected: boolean;\n\tsize: ListCellSize;\n\tvariant: ListCellVariant;\n}\n\ntype ListCellSelectionProps =\n\t| {\n\t\t\tselected?: never;\n\t\t\tselectionSemantics?: never;\n\t }\n\t| {\n\t\t\tselected: boolean;\n\t\t\tselectionSemantics: ListCellCurrentSemantics;\n\t }\n\t| {\n\t\t\tselected: boolean;\n\t\t\tselectionSemantics: \"selected\";\n\t\t\trole: \"gridcell\" | \"option\" | \"row\" | \"tab\" | \"treeitem\";\n\t };\n\nexport type ListCellProps = Omit<ElementProps<\"div\">, \"children\" | \"title\"> &\n\tListCellSelectionProps & {\n\t\tchildren?: React.ReactNode;\n\t\tleading?: React.ReactNode;\n\t\ttitle?: React.ReactNode;\n\t\tdescription?: React.ReactNode;\n\t\tmetadata?: React.ReactNode;\n\t\ttrailing?: React.ReactNode;\n\t\taction?: ListCellActionProps;\n\t\tactionRef?: React.Ref<HTMLElement>;\n\t\tvariant?: ListCellVariant;\n\t\tsize?: ListCellSize;\n\t\tdisabled?: boolean;\n\t\trender?: ComponentRenderProp<ListCellState>;\n\t};\n\ninterface ListCellContextValue {\n\tcurrent: ListCellCurrentSemantics | false | undefined;\n\tdisabled: boolean;\n}\n\nconst ListCellContext = React.createContext<ListCellContextValue>({ current: undefined, disabled: false });\n\ntype AccessibleName =\n\t| {\n\t\t\t\"aria-label\": string;\n\t\t\t\"aria-labelledby\"?: string;\n\t }\n\t| {\n\t\t\t\"aria-label\"?: string;\n\t\t\t\"aria-labelledby\": string;\n\t };\n\ntype ListCellLinkActionProps = Omit<ElementProps<\"a\">, \"aria-label\" | \"aria-labelledby\" | \"children\" | \"className\"> & {\n\thref: string;\n\tclassName?: string;\n\tdisabled?: boolean;\n};\n\ntype ListCellButtonActionProps = Omit<ElementProps<\"button\">, \"aria-label\" | \"aria-labelledby\" | \"children\" | \"className\" | \"href\"> & {\n\thref?: never;\n\tclassName?: string;\n\tdisabled?: boolean;\n};\n\nexport type ListCellActionProps = AccessibleName & (ListCellLinkActionProps | ListCellButtonActionProps);\n\nexport const ListCellAction = React.forwardRef<HTMLElement, ListCellActionProps>(function ListCellAction(props, ref) {\n\tconst context = React.useContext(ListCellContext);\n\tconst disabled = context.disabled || props.disabled === true;\n\n\tif (\"href\" in props && props.href !== undefined) {\n\t\tconst { className, href, onClick, rel, target, ...linkProps } = props;\n\t\treturn (\n\t\t\t<a\n\t\t\t\t{...linkProps}\n\t\t\t\tref={ref as React.Ref<HTMLAnchorElement>}\n\t\t\t\thref={disabled ? undefined : href}\n\t\t\t\ttarget={target}\n\t\t\t\trel={target === \"_blank\" && !rel ? \"noopener noreferrer\" : rel}\n\t\t\t\taria-current={props[\"aria-current\"] ?? context.current}\n\t\t\t\taria-disabled={disabled || undefined}\n\t\t\t\ttabIndex={disabled ? -1 : linkProps.tabIndex}\n\t\t\t\tclassName={mergeClassNames(\"lyds-list-cell__action\", className)}\n\t\t\t\tonClick={event => {\n\t\t\t\t\tif (disabled) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\tonClick?.(event);\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<span className=\"lyds-sr-only\">{props[\"aria-label\"] ?? \"\"}</span>\n\t\t\t</a>\n\t\t);\n\t}\n\n\tconst { className, onClick, type, ...buttonProps } = props;\n\treturn (\n\t\t<button\n\t\t\t{...buttonProps}\n\t\t\tref={ref as React.Ref<HTMLButtonElement>}\n\t\t\ttype={type ?? \"button\"}\n\t\t\tdisabled={disabled}\n\t\t\taria-current={props[\"aria-current\"] ?? context.current}\n\t\t\tclassName={mergeClassNames(\"lyds-list-cell__action\", className)}\n\t\t\tonClick={onClick}\n\t\t/>\n\t);\n});\n\nListCellAction.displayName = \"ListCellAction\";\n\nexport const ListCell = React.forwardRef<HTMLElement, ListCellProps>(function ListCell(\n\t{\n\t\tchildren,\n\t\tleading,\n\t\ttitle,\n\t\tdescription,\n\t\tmetadata,\n\t\ttrailing,\n\t\taction,\n\t\tactionRef,\n\t\tvariant = \"default\",\n\t\tsize = \"md\",\n\t\tselected = false,\n\t\tselectionSemantics,\n\t\tdisabled = false,\n\t\trender,\n\t\tclassName,\n\t\t...props\n\t},\n\tref\n) {\n\tconst interactive = action != null;\n\tconst state: ListCellState = { disabled, interactive, selected, size, variant };\n\tconst slotContent = children ?? (\n\t\t<>\n\t\t\t{leading != null ? <ListCellLeading>{leading}</ListCellLeading> : null}\n\t\t\t<ListCellContent>\n\t\t\t\t{title != null ? <ListCellTitle>{title}</ListCellTitle> : null}\n\t\t\t\t{description != null ? <ListCellDescription>{description}</ListCellDescription> : null}\n\t\t\t</ListCellContent>\n\t\t\t{metadata != null ? <ListCellMetadata>{metadata}</ListCellMetadata> : null}\n\t\t\t{trailing != null ? <ListCellTrailing>{trailing}</ListCellTrailing> : null}\n\t\t</>\n\t);\n\tconst currentSemantics = selectionSemantics && selectionSemantics !== \"selected\" ? selectionSemantics : undefined;\n\tconst current = currentSemantics ? (selected ? currentSemantics : false) : undefined;\n\n\treturn useRender<ListCellState, HTMLElement>({\n\t\tdefaultTagName: \"div\",\n\t\tref,\n\t\trender,\n\t\tstate,\n\t\tprops: {\n\t\t\t...props,\n\t\t\tclassName: mergeClassNames(\"lyds-list-cell\", className),\n\t\t\t\"aria-current\": !action && current !== undefined ? current : props[\"aria-current\"],\n\t\t\t\"aria-disabled\": !action && disabled ? true : props[\"aria-disabled\"],\n\t\t\t\"aria-selected\": selectionSemantics === \"selected\" ? selected : props[\"aria-selected\"],\n\t\t\tchildren: (\n\t\t\t\t<ListCellContext.Provider value={{ current, disabled }}>\n\t\t\t\t\t{action ? <ListCellAction ref={actionRef} {...action} /> : null}\n\t\t\t\t\t{slotContent}\n\t\t\t\t</ListCellContext.Provider>\n\t\t\t)\n\t\t}\n\t});\n});\n\nListCell.displayName = \"ListCell\";\n\ntype ListCellSlotName = \"leading\" | \"content\" | \"title\" | \"description\" | \"metadata\" | \"trailing\";\n\ninterface ListCellSlotProps extends Omit<ElementProps<\"span\">, \"children\"> {\n\tchildren: React.ReactNode;\n\trender?: ComponentRenderProp<Record<string, unknown>>;\n}\n\nfunction createListCellSlot(slotName: ListCellSlotName) {\n\tconst Slot = React.forwardRef<HTMLElement, ListCellSlotProps>(function ListCellSlot({ children, render, className, ...props }, ref) {\n\t\treturn useRender<Record<string, unknown>, HTMLElement>({\n\t\t\tdefaultTagName: \"span\",\n\t\t\tref,\n\t\t\trender,\n\t\t\tprops: {\n\t\t\t\t...props,\n\t\t\t\tchildren,\n\t\t\t\tclassName: mergeClassNames(`lyds-list-cell__${slotName}`, className)\n\t\t\t}\n\t\t});\n\t});\n\n\tSlot.displayName = `ListCell${slotName[0]?.toUpperCase() ?? \"\"}${slotName.slice(1)}`;\n\treturn Slot;\n}\n\nexport const ListCellLeading = createListCellSlot(\"leading\");\nexport const ListCellContent = createListCellSlot(\"content\");\nexport const ListCellTitle = createListCellSlot(\"title\");\nexport const ListCellDescription = createListCellSlot(\"description\");\nexport const ListCellMetadata = createListCellSlot(\"metadata\");\nexport const ListCellTrailing = createListCellSlot(\"trailing\");\n"],"mappings":";;;;;AAoDA,IAAM,IAAkB,EAAM,cAAoC;CAAE,SAAS,KAAA;CAAW,UAAU;AAAM,CAAC,GA0B5F,IAAiB,EAAM,WAA6C,SAAwB,GAAO,GAAK;CACpH,IAAM,IAAU,EAAM,WAAW,CAAe,GAC1C,IAAW,EAAQ,YAAY,EAAM,aAAa;CAExD,IAAI,UAAU,KAAS,EAAM,SAAS,KAAA,GAAW;EAChD,IAAM,EAAE,cAAW,SAAM,YAAS,QAAK,WAAQ,GAAG,MAAc;EAChE,OACC,kBAAC,KAAD;GACC,GAAI;GACC;GACL,MAAM,IAAW,KAAA,IAAY;GACrB;GACR,KAAK,MAAW,YAAY,CAAC,IAAM,wBAAwB;GAC3D,gBAAc,EAAM,mBAAmB,EAAQ;GAC/C,iBAAe,KAAY,KAAA;GAC3B,UAAU,IAAW,KAAK,EAAU;GACpC,WAAW,EAAgB,0BAA0B,CAAS;GAC9D,UAAS,MAAS;IACjB,IAAI,GAAU;KACb,EAAM,eAAe;KACrB;IACD;IACA,IAAU,CAAK;GAChB;GAEA,UAAA,kBAAC,QAAD;IAAM,WAAU;IAAgB,UAAA,EAAM,iBAAiB;GAAS,CAAA;EAC9D,CAAA;CAEL;CAEA,IAAM,EAAE,cAAW,YAAS,SAAM,GAAG,MAAgB;CACrD,OACC,kBAAC,UAAD;EACC,GAAI;EACC;EACL,MAAM,KAAQ;EACJ;EACV,gBAAc,EAAM,mBAAmB,EAAQ;EAC/C,WAAW,EAAgB,0BAA0B,CAAS;EACrD;CACT,CAAA;AAEH,CAAC;AAED,EAAe,cAAc;AAE7B,IAAa,IAAW,EAAM,WAAuC,SACpE,EACC,aACA,YACA,UACA,gBACA,aACA,aACA,WACA,cACA,aAAU,WACV,UAAO,MACP,cAAW,IACX,uBACA,cAAW,IACX,WACA,cACA,GAAG,KAEJ,GACC;CAED,IAAM,IAAuB;EAAE;EAAU,aADrB,KAAU;EACwB;EAAU;EAAM;CAAQ,GACxE,IAAc,KACnB,kBAAA,GAAA,EAAA,UAAA;EACE,KAAW,OAAsD,OAA/C,kBAAC,GAAD,EAAA,UAAkB,EAAyB,CAAA;EAC9D,kBAAC,GAAD,EAAA,UAAA,CACE,KAAS,OAAgD,OAAzC,kBAAC,GAAD,EAAA,UAAgB,EAAqB,CAAA,GACrD,KAAe,OAAkE,OAA3D,kBAAC,GAAD,EAAA,UAAsB,EAAiC,CAAA,CAC9D,EAAA,CAAA;EAChB,KAAY,OAAyD,OAAlD,kBAAC,GAAD,EAAA,UAAmB,EAA2B,CAAA;EACjE,KAAY,OAAyD,OAAlD,kBAAC,GAAD,EAAA,UAAmB,EAA2B,CAAA;CACjE,EAAA,CAAA,GAEG,IAAmB,KAAsB,MAAuB,aAAa,IAAqB,KAAA,GAClG,IAAU,IAAoB,IAAW,IAAmB,KAAS,KAAA;CAE3E,OAAO,EAAsC;EAC5C,gBAAgB;EAChB;EACA;EACA;EACA,OAAO;GACN,GAAG;GACH,WAAW,EAAgB,kBAAkB,CAAS;GACtD,gBAAgB,CAAC,KAAU,MAAY,KAAA,IAAY,IAAU,EAAM;GACnE,iBAAiB,CAAC,KAAU,IAAW,KAAO,EAAM;GACpD,iBAAiB,MAAuB,aAAa,IAAW,EAAM;GACtE,UACC,kBAAC,EAAgB,UAAjB;IAA0B,OAAO;KAAE;KAAS;IAAS;IAArD,UAAA,CACE,IAAS,kBAAC,GAAD;KAAgB,KAAK;KAAW,GAAI;IAAS,CAAA,IAAI,MAC1D,CACwB;;EAE5B;CACD,CAAC;AACF,CAAC;AAED,EAAS,cAAc;AASvB,SAAS,EAAmB,GAA4B;CACvD,IAAM,IAAO,EAAM,WAA2C,SAAsB,EAAE,aAAU,WAAQ,cAAW,GAAG,KAAS,GAAK;EACnI,OAAO,EAAgD;GACtD,gBAAgB;GAChB;GACA;GACA,OAAO;IACN,GAAG;IACH;IACA,WAAW,EAAgB,mBAAmB,KAAY,CAAS;GACpE;EACD,CAAC;CACF,CAAC;CAGD,OADA,EAAK,cAAc,WAAW,EAAS,EAAE,EAAE,YAAY,KAAK,KAAK,EAAS,MAAM,CAAC,KAC1E;AACR;AAEA,IAAa,IAAkB,EAAmB,SAAS,GAC9C,IAAkB,EAAmB,SAAS,GAC9C,IAAgB,EAAmB,OAAO,GAC1C,IAAsB,EAAmB,aAAa,GACtD,IAAmB,EAAmB,UAAU,GAChD,IAAmB,EAAmB,UAAU"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"SectionHeading.js","names":[],"sources":["../../../src/components/foundations/SectionHeading.tsx"],"sourcesContent":["import { useRender } from \"@base-ui/react/use-render\";\nimport * as React from \"react\";\nimport { type ComponentRenderProp, type ElementProps, mergeClassNames } from \"./shared\";\n\nexport type SectionHeadingSize = \"sm\" | \"md\" | \"lg\";\nexport type SectionHeadingLevel = 2 | 3 | 4 | 5 | 6;\n\nexport interface SectionHeadingState extends Record<string, unknown> {\n\tsize: SectionHeadingSize;\n}\n\nexport interface SectionHeadingProps extends Omit<ElementProps<\"header\">, \"children\" | \"title\"> {\n\tchildren: React.ReactNode;\n\tannotation?: React.ReactNode;\n\tdescription?: React.ReactNode;\n\taction?: React.ReactNode;\n\tlevel?: SectionHeadingLevel;\n\tsize?: SectionHeadingSize;\n\trender?: ComponentRenderProp<SectionHeadingState>;\n}\n\nexport const SectionHeading = React.forwardRef<HTMLElement, SectionHeadingProps>(function SectionHeading(\n\t{ children, annotation, description, action, level = 2, size = \"md\", render, className, ...props },\n\tref\n) {\n\tconst HeadingTag = `h${level}` as const;\n\n\treturn useRender<SectionHeadingState, HTMLElement>({\n\t\tdefaultTagName: \"header\",\n\t\tref,\n\t\trender,\n\t\tstate: { size },\n\t\tprops: {\n\t\t\t...props,\n\t\t\tclassName: mergeClassNames(\"lyds-section-heading\", className),\n\t\t\tchildren: (\n\t\t\t\t<>\n\t\t\t\t\t<span className=\"lyds-section-heading__rail\" aria-hidden=\"true\" />\n\t\t\t\t\t<span className=\"lyds-section-heading__content\">\n\t\t\t\t\t\t{annotation != null ? <span className=\"lyds-section-heading__annotation\">{annotation}</span> : null}\n\t\t\t\t\t\t<HeadingTag className=\"lyds-section-heading__title\">{children}</HeadingTag>\n\t\t\t\t\t\t{description != null ? <span className=\"lyds-section-heading__description\">{description}</span> : null}\n\t\t\t\t\t</span>\n\t\t\t\t\t{action != null ? <span className=\"lyds-section-heading__action\">{action}</span> : null}\n\t\t\t\t</>\n\t\t\t)\n\t\t}\n\t});\n});\n\nSectionHeading.displayName = \"SectionHeading\";\n"],"mappings":";;;;;AAqBA,IAAa,IAAiB,EAAM,WAA6C,SAChF,EAAE,aAAU,eAAY,gBAAa,WAAQ,WAAQ,GAAG,UAAO,MAAM,WAAQ,cAAW,GAAG,KAC3F,GACC;CACD,IAAM,IAAa,IAAI;CAEvB,OAAO,EAA4C;EAClD,gBAAgB;EAChB;EACA;EACA,OAAO,EAAE,QAAK;EACd,OAAO;GACN,GAAG;GACH,WAAW,EAAgB,wBAAwB,CAAS;GAC5D,UACC,kBAAA,GAAA,EAAA,UAAA;IACC,kBAAC,QAAD;KAAM,WAAU;KAA6B,eAAY;IAAQ,CAAA;IACjE,kBAAC,QAAD;KAAM,WAAU;KAAhB,UAAA;MACE,KAAc,OAAgF,OAAzE,kBAAC,QAAD;OAAM,WAAU;OAAoC,UAAA;MAAiB,CAAA;MAC3F,kBAAC,GAAD;OAAY,WAAU;OAA+B;MAAqB,CAAA;MACzE,KAAe,OAAkF,OAA3E,kBAAC,QAAD;OAAM,WAAU;OAAqC,UAAA;MAAkB,CAAA;KACzF;;IACL,KAAU,OAAwE,OAAjE,kBAAC,QAAD;KAAM,WAAU;KAAgC,UAAA;IAAa,CAAA;GAC9E,EAAA,CAAA;EAEJ;CACD,CAAC;AACF,CAAC;AAED,EAAe,cAAc"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Separator.js","names":[],"sources":["../../../src/components/foundations/Separator.tsx"],"sourcesContent":["import { Separator as BaseSeparator, type SeparatorProps as BaseSeparatorProps } from \"@base-ui/react/separator\";\nimport * as React from \"react\";\nimport { mergeClassNames } from \"./shared\";\n\nexport type SeparatorVariant = \"solid\" | \"technical\";\nexport type SeparatorSpacing = \"none\" | \"sm\" | \"md\" | \"lg\";\n\nexport interface SeparatorProps extends Omit<BaseSeparatorProps, \"className\" | \"style\"> {\n\tvariant?: SeparatorVariant;\n\tspacing?: SeparatorSpacing;\n\tclassName?: string;\n\tstyle?: React.CSSProperties;\n}\n\nexport const Separator = React.forwardRef<HTMLDivElement, SeparatorProps>(function Separator({ variant = \"solid\", spacing = \"md\", orientation = \"horizontal\", className, style, ...props }, ref) {\n\treturn <BaseSeparator {...props} ref={ref} orientation={orientation} data-variant={variant} data-spacing={spacing} className={mergeClassNames(\"lyds-separator\", className)} style={style} />;\n});\n\nSeparator.displayName = \"Separator\";\n"],"mappings":";;;;;AAcA,IAAa,IAAY,EAAM,WAA2C,SAAmB,EAAE,aAAU,SAAS,aAAU,MAAM,iBAAc,cAAc,cAAW,UAAO,GAAG,KAAS,GAAK;CAChM,OAAO,kBAAC,GAAD;EAAe,GAAI;EAAY;EAAkB;EAAa,gBAAc;EAAS,gBAAc;EAAS,WAAW,EAAgB,kBAAkB,CAAS;EAAU;CAAQ,CAAA;AAC5L,CAAC;AAED,EAAU,cAAc"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"shared.js","names":[],"sources":["../../../src/components/foundations/shared.ts"],"sourcesContent":["import type { useRender } from \"@base-ui/react/use-render\";\nimport type * as React from \"react\";\n\nexport type ComponentRenderProp<State extends Record<string, unknown>> = useRender.RenderProp<State>;\n\nexport type ElementProps<ElementType extends React.ElementType> = Omit<React.ComponentPropsWithoutRef<ElementType>, \"color\">;\n\nexport function mergeClassNames(...classNames: Array<string | undefined | false>): string {\n\treturn classNames.filter(Boolean).join(\" \");\n}\n"],"mappings":";AAOA,SAAgB,EAAgB,GAAG,GAAuD;CACzF,OAAO,EAAW,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;AAC3C"}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
//#region src/components/navigation-data/utils.ts
|
|
2
|
-
function e(...e) {
|
|
3
|
-
return e.filter(Boolean).join(" ");
|
|
4
|
-
}
|
|
5
|
-
function t(t, n) {
|
|
6
|
-
return typeof n == "function" ? (r) => e(t, n(r)) : e(t, n);
|
|
7
|
-
}
|
|
8
|
-
//#endregion
|
|
9
|
-
export { e as cx, t as withBaseClass };
|
|
10
|
-
|
|
11
|
-
//# sourceMappingURL=utils.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"utils.js","names":[],"sources":["../../../src/components/navigation-data/utils.ts"],"sourcesContent":["export function cx(...classes: Array<string | false | null | undefined>): string {\n\treturn classes.filter(Boolean).join(\" \");\n}\n\nexport function withBaseClass<State>(baseClassName: string, className?: string | ((state: State) => string | undefined)): string | ((state: State) => string) {\n\tif (typeof className === \"function\") {\n\t\treturn state => cx(baseClassName, className(state));\n\t}\n\n\treturn cx(baseClassName, className);\n}\n"],"mappings":";AAAA,SAAgB,EAAG,GAAG,GAA2D;CAChF,OAAO,EAAQ,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;AACxC;AAEA,SAAgB,EAAqB,GAAuB,GAAkG;CAK7J,OAJI,OAAO,KAAc,cACjB,MAAS,EAAG,GAAe,EAAU,CAAK,CAAC,IAG5C,EAAG,GAAe,CAAS;AACnC"}
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
type StatefulClassName<State> = string | ((state: State) => string | undefined) | undefined;
|
|
2
|
-
/**
|
|
3
|
-
* 加入 Linyao Design System 的 CSS 類別,並保留 Base UI 可依狀態計算的 className API。
|
|
4
|
-
*/
|
|
5
|
-
export declare function mergeClassName<State>(lydsClassName: string, className: StatefulClassName<State>): string | ((state: State) => string);
|
|
6
|
-
export {};
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
//#region src/components/overlays/class-names.ts
|
|
2
|
-
function e(e, t) {
|
|
3
|
-
return typeof t == "function" ? (n) => {
|
|
4
|
-
let r = t(n);
|
|
5
|
-
return r ? `${e} ${r}` : e;
|
|
6
|
-
} : t ? `${e} ${t}` : e;
|
|
7
|
-
}
|
|
8
|
-
//#endregion
|
|
9
|
-
export { e as mergeClassName };
|
|
10
|
-
|
|
11
|
-
//# sourceMappingURL=class-names.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"class-names.js","names":[],"sources":["../../../src/components/overlays/class-names.ts"],"sourcesContent":["type StatefulClassName<State> = string | ((state: State) => string | undefined) | undefined;\n\n/**\n * 加入 Linyao Design System 的 CSS 類別,並保留 Base UI 可依狀態計算的 className API。\n */\nexport function mergeClassName<State>(lydsClassName: string, className: StatefulClassName<State>): string | ((state: State) => string) {\n\tif (typeof className === \"function\") {\n\t\treturn state => {\n\t\t\tconst resolvedClassName = className(state);\n\t\t\treturn resolvedClassName ? `${lydsClassName} ${resolvedClassName}` : lydsClassName;\n\t\t};\n\t}\n\n\treturn className ? `${lydsClassName} ${className}` : lydsClassName;\n}\n"],"mappings":";AAKA,SAAgB,EAAsB,GAAuB,GAA0E;CAQtI,OAPI,OAAO,KAAc,cACjB,MAAS;EACf,IAAM,IAAoB,EAAU,CAAK;EACzC,OAAO,IAAoB,GAAG,EAAc,GAAG,MAAsB;CACtE,IAGM,IAAY,GAAG,EAAc,GAAG,MAAc;AACtD"}
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
export type StateClassName<State> = string | ((state: State) => string | undefined);
|
|
2
|
-
export declare function cx(...values: Array<string | false | null | undefined>): string;
|
|
3
|
-
export declare function mergeStateClassName<State>(base: string, className?: StateClassName<State>): StateClassName<State>;
|
|
4
|
-
export declare function combineStateClassNames<State>(first?: StateClassName<State>, second?: StateClassName<State>): StateClassName<State>;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"classnames.js","names":[],"sources":["../../../src/components/selection/classnames.ts"],"sourcesContent":["export type StateClassName<State> = string | ((state: State) => string | undefined);\n\nexport function cx(...values: Array<string | false | null | undefined>): string {\n\treturn values.filter(Boolean).join(\" \");\n}\n\nexport function mergeStateClassName<State>(base: string, className?: StateClassName<State>): StateClassName<State> {\n\tif (typeof className === \"function\") {\n\t\treturn state => cx(base, className(state));\n\t}\n\n\treturn cx(base, className);\n}\n\nexport function combineStateClassNames<State>(first?: StateClassName<State>, second?: StateClassName<State>): StateClassName<State> {\n\tif (typeof first === \"function\" || typeof second === \"function\") {\n\t\treturn state => cx(typeof first === \"function\" ? first(state) : first, typeof second === \"function\" ? second(state) : second);\n\t}\n\n\treturn cx(first, second);\n}\n"],"mappings":";AAEA,SAAgB,EAAG,GAAG,GAA0D;CAC/E,OAAO,EAAO,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;AACvC;AAEA,SAAgB,EAA2B,GAAc,GAA0D;CAKlH,OAJI,OAAO,KAAc,cACjB,MAAS,EAAG,GAAM,EAAU,CAAK,CAAC,IAGnC,EAAG,GAAM,CAAS;AAC1B;AAEA,SAAgB,EAA8B,GAA+B,GAAuD;CAKnI,OAJI,OAAO,KAAU,cAAc,OAAO,KAAW,cAC7C,MAAS,EAAG,OAAO,KAAU,aAAa,EAAM,CAAK,IAAI,GAAO,OAAO,KAAW,aAAa,EAAO,CAAK,IAAI,CAAM,IAGtH,EAAG,GAAO,CAAM;AACxB"}
|
|
@@ -1,51 +0,0 @@
|
|
|
1
|
-
//#region src/components/selection/selection.module.css
|
|
2
|
-
var e = "_checkbox_1m4md_1", t = "_radio_1m4md_2", n = "_toggle_1m4md_4", r = "_selectTrigger_1m4md_5", i = "_comboboxTrigger_1m4md_6", a = "_comboboxClear_1m4md_7", o = "_menuTrigger_1m4md_8", s = "_menuItem_1m4md_9", c = "_comboboxInput_1m4md_69", l = "_contextTrigger_1m4md_74", u = "_sliderThumb_1m4md_75", d = "_choiceGroup_1m4md_84", f = "_slider_1m4md_75", p = "_segmentedControl_1m4md_86", m = "_switchThumb_1m4md_104", h = "_checkboxIndicator_1m4md_114", g = "_choiceLabel_1m4md_144", _ = "_choiceCopy_1m4md_157", v = "_choiceTitle_1m4md_162", y = "_choiceDescription_1m4md_168", b = "_radioIndicator_1m4md_177", x = "_switchSignal_1m4md_224", S = "_sliderValue_1m4md_259", C = "_sliderControl_1m4md_266", w = "_sliderTrack_1m4md_280", T = "_sliderIndicator_1m4md_294", E = "_toggleQuiet_1m4md_358", D = "_toggleGroup_1m4md_366", O = "_comboboxInputGroup_1m4md_473", k = "_selectValue_1m4md_525", A = "_selectIcon_1m4md_530", j = "_optionIndicator_1m4md_544", M = "_menuItemIndicator_1m4md_545", N = "_positioner_1m4md_598", P = "_popup_1m4md_603", F = "_menuPopup_1m4md_604", I = "_optionList_1m4md_628", L = "_option_1m4md_544", R = "_optionText_1m4md_686", z = "_optionDescription_1m4md_692", B = "_emptyOption_1m4md_693", V = "_groupLabel_1m4md_704", H = "_separator_1m4md_711", U = {
|
|
3
|
-
checkbox: e,
|
|
4
|
-
radio: t,
|
|
5
|
-
switch: "_switch_1m4md_3",
|
|
6
|
-
toggle: n,
|
|
7
|
-
selectTrigger: r,
|
|
8
|
-
comboboxTrigger: i,
|
|
9
|
-
comboboxClear: a,
|
|
10
|
-
menuTrigger: o,
|
|
11
|
-
menuItem: s,
|
|
12
|
-
comboboxInput: c,
|
|
13
|
-
contextTrigger: l,
|
|
14
|
-
sliderThumb: u,
|
|
15
|
-
choiceGroup: d,
|
|
16
|
-
slider: f,
|
|
17
|
-
segmentedControl: p,
|
|
18
|
-
switchThumb: m,
|
|
19
|
-
checkboxIndicator: h,
|
|
20
|
-
choiceLabel: g,
|
|
21
|
-
choiceCopy: _,
|
|
22
|
-
choiceTitle: v,
|
|
23
|
-
choiceDescription: y,
|
|
24
|
-
radioIndicator: b,
|
|
25
|
-
switchSignal: x,
|
|
26
|
-
sliderValue: S,
|
|
27
|
-
sliderControl: C,
|
|
28
|
-
sliderTrack: w,
|
|
29
|
-
sliderIndicator: T,
|
|
30
|
-
toggleQuiet: E,
|
|
31
|
-
toggleGroup: D,
|
|
32
|
-
comboboxInputGroup: O,
|
|
33
|
-
selectValue: k,
|
|
34
|
-
selectIcon: A,
|
|
35
|
-
optionIndicator: j,
|
|
36
|
-
menuItemIndicator: M,
|
|
37
|
-
positioner: N,
|
|
38
|
-
popup: P,
|
|
39
|
-
menuPopup: F,
|
|
40
|
-
optionList: I,
|
|
41
|
-
option: L,
|
|
42
|
-
optionText: R,
|
|
43
|
-
optionDescription: z,
|
|
44
|
-
emptyOption: B,
|
|
45
|
-
groupLabel: V,
|
|
46
|
-
separator: H
|
|
47
|
-
};
|
|
48
|
-
//#endregion
|
|
49
|
-
export { e as checkbox, h as checkboxIndicator, _ as choiceCopy, y as choiceDescription, d as choiceGroup, g as choiceLabel, v as choiceTitle, a as comboboxClear, c as comboboxInput, O as comboboxInputGroup, i as comboboxTrigger, l as contextTrigger, U as default, B as emptyOption, V as groupLabel, s as menuItem, M as menuItemIndicator, F as menuPopup, o as menuTrigger, L as option, z as optionDescription, j as optionIndicator, I as optionList, R as optionText, P as popup, N as positioner, t as radio, b as radioIndicator, p as segmentedControl, A as selectIcon, r as selectTrigger, k as selectValue, H as separator, f as slider, C as sliderControl, T as sliderIndicator, u as sliderThumb, w as sliderTrack, S as sliderValue, x as switchSignal, m as switchThumb, n as toggle, D as toggleGroup, E as toggleQuiet };
|
|
50
|
-
|
|
51
|
-
//# sourceMappingURL=selection.module.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"selection.module.js","names":[],"sources":["../../../src/components/selection/selection.module.css"],"sourcesContent":[".checkbox,\n.radio,\n.switch,\n.toggle,\n.selectTrigger,\n.comboboxTrigger,\n.comboboxClear,\n.menuTrigger,\n.menuItem {\n\t-webkit-tap-highlight-color: var(--background-transparent);\n}\n\n.checkbox,\n.radio {\n\tposition: relative;\n\tdisplay: inline-grid;\n\tplace-items: center;\n\tflex: 0 0 auto;\n\twidth: 1.5rem;\n\theight: 1.5rem;\n\tpadding: 0.0625rem;\n\tcolor: var(--control-on-primary);\n\tbackground: var(--control-track);\n\tbackground-clip: content-box;\n\tborder: 0;\n\tcursor: pointer;\n\ttransition:\n\t\tbackground-color var(--motion-duration-fast) var(--motion-ease-out),\n\t\ttransform var(--motion-duration-fast) var(--motion-ease-snap);\n}\n\n.checkbox {\n\tborder-radius: 0.25rem;\n}\n\n.checkbox:hover:not([data-disabled]):not([data-readonly]),\n.radio:hover:not([data-disabled]):not([data-readonly]) {\n\tbackground-color: var(--control-border-hover);\n}\n\n.checkbox[data-checked],\n.checkbox[data-indeterminate],\n.radio[data-checked] {\n\tbackground-color: var(--control-primary);\n}\n\n.checkbox[data-checked]:hover:not([data-disabled]):not([data-readonly]),\n.checkbox[data-indeterminate]:hover:not([data-disabled]):not([data-readonly]),\n.radio[data-checked]:hover:not([data-disabled]):not([data-readonly]) {\n\tbackground-color: var(--control-primary-hover);\n}\n\n.checkbox[data-checked]:active:not([data-disabled]):not([data-readonly]),\n.checkbox[data-indeterminate]:active:not([data-disabled]):not([data-readonly]),\n.radio[data-checked]:active:not([data-disabled]):not([data-readonly]) {\n\tbackground-color: var(--control-primary-pressed);\n}\n\n.checkbox:active:not([data-disabled]):not([data-readonly]),\n.radio:active:not([data-disabled]):not([data-readonly]) {\n\ttransform: scale(var(--motion-press-scale));\n}\n\n.checkbox:focus-visible,\n.radio:focus-visible,\n.switch:focus-visible,\n.toggle:focus-visible,\n.selectTrigger:focus-visible,\n.comboboxInput:focus-visible,\n.comboboxTrigger:focus-visible,\n.comboboxClear:focus-visible,\n.menuTrigger:focus-visible,\n.menuItem:focus-visible,\n.contextTrigger:focus-visible,\n.sliderThumb:has(input:focus-visible) {\n\toutline: 0.125rem solid var(--focus-ring);\n\toutline-offset: 0.125rem;\n}\n\n.checkbox[data-disabled],\n.radio[data-disabled],\n.switch[data-disabled],\n.toggle[data-disabled],\n.choiceGroup[data-disabled],\n.slider[data-disabled],\n.segmentedControl[data-disabled] {\n\tcursor: not-allowed;\n}\n\n.checkbox[data-disabled],\n.radio[data-disabled],\n.switch[data-disabled] {\n\tbackground: var(--control-surface-disabled);\n\tcolor: var(--text-disabled);\n}\n\n.checkbox[data-disabled][data-checked],\n.checkbox[data-disabled][data-indeterminate],\n.radio[data-disabled][data-checked],\n.switch[data-disabled][data-checked] {\n\tbackground: var(--control-primary-disabled);\n}\n\n.switch[data-disabled] .switchThumb {\n\topacity: 0.7;\n}\n\n.checkbox[data-readonly],\n.radio[data-readonly],\n.switch[data-readonly] {\n\tcursor: default;\n}\n\n.checkboxIndicator {\n\tdisplay: grid;\n\tplace-items: center;\n\twidth: 100%;\n\theight: 100%;\n\topacity: 0;\n\ttransform: scale(0.72);\n\ttransition:\n\t\topacity var(--motion-duration-fast) var(--motion-ease-out),\n\t\ttransform var(--motion-duration-fast) var(--motion-ease-snap);\n}\n\n.checkboxIndicator[data-checked],\n.checkboxIndicator[data-indeterminate] {\n\topacity: 1;\n\ttransform: scale(1);\n}\n\n.checkboxIndicator svg {\n\twidth: var(--icon-size-sm);\n\theight: var(--icon-size-sm);\n}\n\n.choiceGroup {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: var(--space-2);\n\tcolor: var(--text-main);\n}\n\n.choiceLabel {\n\tdisplay: inline-flex;\n\talign-items: center;\n\tgap: var(--space-3);\n\tmin-height: var(--control-target-min);\n\tpadding-block: var(--space-2);\n\tcursor: pointer;\n}\n\n.choiceLabel:has([data-disabled]) {\n\tcursor: not-allowed;\n}\n\n.choiceCopy {\n\tdisplay: grid;\n\tgap: var(--space-1);\n}\n\n.choiceTitle {\n\tfont: var(--font-weight-medium) var(--font-size-sm) / var(--line-height-body) var(--font-family-sans);\n\tletter-spacing: var(--letter-spacing-body);\n\tcolor: var(--text-title);\n}\n\n.choiceDescription {\n\tfont: var(--font-weight-regular) var(--font-size-xs) / var(--line-height-body) var(--font-family-sans);\n\tcolor: var(--text-secondary);\n}\n\n.radio {\n\tborder-radius: var(--radius-round);\n}\n\n.radioIndicator {\n\twidth: 0.5rem;\n\theight: 0.5rem;\n\tbackground: var(--control-on-primary);\n\tborder-radius: var(--radius-round);\n\topacity: 0;\n\ttransform: scale(0.4);\n\ttransition:\n\t\topacity var(--motion-duration-fast) var(--motion-ease-out),\n\t\ttransform var(--motion-duration-fast) var(--motion-ease-snap);\n}\n\n.radioIndicator[data-checked] {\n\topacity: 1;\n\ttransform: scale(1);\n}\n\n.switch {\n\tposition: relative;\n\tdisplay: inline-flex;\n\talign-items: center;\n\twidth: 3.25rem;\n\theight: 1.875rem;\n\tpadding: 0.0625rem;\n\tbackground: var(--control-track);\n\tborder: 0;\n\tborder-radius: var(--radius-round);\n\tcursor: pointer;\n\ttransition: background-color var(--motion-duration-normal) var(--motion-ease-out);\n}\n\n.switch:hover:not([data-disabled]):not([data-readonly]) {\n\tbackground: var(--control-border-hover);\n}\n\n.switch[data-checked] {\n\tbackground: var(--control-primary);\n}\n\n.switch[data-checked]:hover:not([data-disabled]):not([data-readonly]) {\n\tbackground: var(--control-primary-hover);\n}\n\n.switch[data-checked]:active:not([data-disabled]):not([data-readonly]) {\n\tbackground: var(--control-primary-pressed);\n}\n\n.switchSignal {\n\tdisplay: none;\n}\n\n.switchThumb {\n\twidth: 1.75rem;\n\theight: 1.75rem;\n\tbackground: var(--control-knob);\n\tborder: 0;\n\tborder-radius: var(--radius-round);\n\tbox-shadow: var(--shadow-switch-knob);\n\ttransition:\n\t\ttranslate var(--motion-duration-normal) var(--motion-ease-snap),\n\t\tbackground-color var(--motion-duration-fast) var(--motion-ease-out);\n}\n\n.switch[data-checked] .switchThumb {\n\ttranslate: 1.375rem 0;\n}\n\n.slider {\n\tdisplay: grid;\n\tgap: var(--space-2);\n\twidth: 100%;\n\tmin-width: 10rem;\n\ttouch-action: none;\n\tuser-select: none;\n}\n\n.slider[data-orientation=\"vertical\"] {\n\twidth: auto;\n\tmin-width: 0;\n\theight: 10rem;\n}\n\n.sliderValue {\n\tjustify-self: end;\n\tfont: var(--font-weight-medium) var(--font-size-xs) / 1 var(--font-family-mono);\n\tfont-variant-numeric: tabular-nums;\n\tcolor: var(--text-secondary);\n}\n\n.sliderControl {\n\tdisplay: flex;\n\talign-items: center;\n\twidth: 100%;\n\theight: var(--control-target-min);\n\tcursor: pointer;\n}\n\n.sliderControl[data-orientation=\"vertical\"] {\n\tjustify-content: center;\n\twidth: var(--control-target-min);\n\theight: 100%;\n}\n\n.sliderTrack {\n\tposition: relative;\n\twidth: 100%;\n\theight: 0.25rem;\n\tbackground: var(--control-border-hover);\n\tborder: 0;\n\tborder-radius: var(--radius-round);\n}\n\n.sliderTrack[data-orientation=\"vertical\"] {\n\twidth: 0.25rem;\n\theight: 100%;\n}\n\n.sliderIndicator {\n\tbackground: var(--control-selected);\n\tborder-radius: inherit;\n}\n\n.sliderThumb {\n\twidth: 1.5rem;\n\theight: 1.5rem;\n\tbackground: var(--control-knob);\n\tborder: 0;\n\tborder-radius: var(--radius-round);\n\tbox-shadow: var(--shadow-low);\n\tcursor: grab;\n\ttransition:\n\t\tbox-shadow var(--motion-duration-fast) var(--motion-ease-out),\n\t\ttransform var(--motion-duration-fast) var(--motion-ease-out);\n}\n\n.sliderThumb:hover:not([data-disabled]) {\n\tbox-shadow: var(--shadow-medium);\n}\n\n.sliderThumb[data-dragging] {\n\tcursor: grabbing;\n\ttransform: scale(1.04);\n}\n\n.toggle,\n.menuTrigger {\n\tdisplay: inline-flex;\n\talign-items: center;\n\tjustify-content: center;\n\tgap: var(--space-2);\n\tmin-height: var(--control-height-md);\n\tpadding-inline: var(--space-3);\n\tfont: var(--font-weight-medium) var(--font-size-sm) / 1 var(--font-family-sans);\n\tletter-spacing: var(--letter-spacing-body);\n\tcolor: var(--text-main);\n\tbackground: var(--control-secondary);\n\tborder: 0;\n\tborder-radius: var(--radius-md);\n\tcursor: pointer;\n\ttransition:\n\t\tbackground-color var(--motion-duration-fast) var(--motion-ease-out),\n\t\tcolor var(--motion-duration-fast) var(--motion-ease-out),\n\t\ttransform var(--motion-duration-fast) var(--motion-ease-out);\n}\n\n.toggle:hover:not([data-disabled]),\n.menuTrigger:hover:not([data-disabled]) {\n\tbackground: var(--control-secondary-hover);\n}\n\n.toggle:active:not([data-disabled]),\n.menuTrigger:active:not([data-disabled]) {\n\tbackground: var(--control-secondary-pressed);\n\ttransform: scale(var(--motion-press-scale));\n}\n\n.toggle[data-pressed] {\n\tcolor: var(--text-accent);\n\tbackground: var(--control-selected-muted);\n}\n\n.toggleQuiet {\n\tbackground: var(--background-transparent);\n}\n\n.toggleQuiet:hover:not([data-disabled]) {\n\tbackground: var(--control-secondary-hover);\n}\n\n.toggleGroup,\n.segmentedControl {\n\tdisplay: inline-flex;\n\talign-items: stretch;\n}\n\n.toggleGroup {\n\tgap: var(--space-1);\n}\n\n.toggleGroup[data-orientation=\"vertical\"],\n.segmentedControl[data-orientation=\"vertical\"] {\n\tflex-direction: column;\n}\n\n.segmentedControl {\n\tjustify-self: start;\n\tinline-size: min(100%, 20.5rem);\n\tmax-width: 100%;\n\tmin-height: 3.5rem;\n\toverflow-x: auto;\n\tpadding: 1px;\n\tbackground: var(--control-quaternary);\n\tborder: 0;\n\tborder-radius: var(--radius-md);\n}\n\n.segmentedControl[data-size=\"sm\"] {\n\tmin-height: 2.5rem;\n}\n\n.segmentedControl > .toggle {\n\tposition: relative;\n\tflex: 1 1 0;\n\tmin-width: 3.375rem;\n\tmin-height: calc(3.5rem - 0.125rem);\n\tpadding-inline: var(--space-2);\n\tfont-size: var(--font-size-md);\n\tfont-weight: var(--font-weight-regular);\n\tletter-spacing: -0.02em;\n\tcolor: var(--text-secondary);\n\tbackground: var(--background-transparent);\n\tborder: 0;\n\tborder-radius: 0.6875rem;\n\tbox-shadow: var(--shadow-control-context);\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n}\n\n.segmentedControl > .toggle + .toggle::before {\n\tposition: absolute;\n\tinset-block-start: 50%;\n\tinset-inline-start: -1px;\n\twidth: 1px;\n\theight: 2rem;\n\tbackground: var(--divider-main);\n\tcontent: \"\";\n\ttransform: translateY(-50%) scaleX(0.5);\n}\n\n.segmentedControl[data-size=\"sm\"] > .toggle {\n\tmin-height: calc(2.5rem - 0.125rem);\n\tfont-size: var(--font-size-sm);\n\tletter-spacing: -0.01em;\n}\n\n.segmentedControl > .toggle:hover:not([data-disabled]):not([data-pressed]) {\n\tcolor: var(--text-main);\n\tbackground: var(--control-secondary-hover);\n}\n\n.segmentedControl > .toggle:active:not([data-disabled]) {\n\ttransform: none;\n}\n\n.segmentedControl > .toggle[data-pressed] {\n\tfont-weight: var(--font-weight-semibold);\n\tcolor: var(--text-title);\n\tbackground: var(--control-surface-selected);\n\tbox-shadow: var(--shadow-floating-control);\n}\n\n.segmentedControl > .toggle[data-pressed]::before,\n.segmentedControl > .toggle[data-pressed] + .toggle::before {\n\topacity: 0;\n}\n\n.segmentedControl[data-orientation=\"vertical\"] {\n\tinline-size: auto;\n\tmin-height: 0;\n\toverflow: visible;\n}\n\n.segmentedControl[data-orientation=\"vertical\"] > .toggle {\n\tmin-height: var(--control-height-md);\n}\n\n.segmentedControl[data-orientation=\"vertical\"] > .toggle + .toggle::before {\n\tinset-block-start: -1px;\n\tinset-inline-start: 50%;\n\twidth: 2rem;\n\theight: 1px;\n\ttransform: translateX(-50%) scaleY(0.5);\n}\n\n.selectTrigger,\n.comboboxInputGroup {\n\tdisplay: flex;\n\talign-items: center;\n\twidth: 100%;\n\tmin-width: 12rem;\n\tmin-height: var(--control-height-lg);\n\tcolor: var(--text-main);\n\tbackground: var(--background-elevated);\n\tborder: 1px solid var(--border-control);\n\tborder-radius: var(--radius-md);\n\ttransition:\n\t\tbackground-color var(--motion-duration-fast) var(--motion-ease-out),\n\t\tborder-color var(--motion-duration-fast) var(--motion-ease-out),\n\t\tbox-shadow var(--motion-duration-fast) var(--motion-ease-out);\n}\n\n.selectTrigger {\n\tjustify-content: space-between;\n\tgap: var(--space-3);\n\tpadding-inline: var(--space-4);\n\tfont: var(--font-weight-regular) var(--font-size-md) / var(--line-height-body) var(--font-family-sans);\n\tletter-spacing: var(--letter-spacing-body);\n\tcursor: pointer;\n}\n\n.selectTrigger:hover:not([data-disabled]),\n.comboboxInputGroup:hover:not([data-disabled]) {\n\tbackground: var(--control-surface-hover);\n\tborder-color: var(--divider-strong);\n}\n\n.selectTrigger[data-popup-open],\n.comboboxInputGroup[data-popup-open],\n.comboboxInputGroup:focus-within {\n\tborder-color: var(--border-control-focus);\n\tbox-shadow: 0 0 0 1px var(--border-control-focus);\n}\n\n.selectTrigger[aria-invalid=\"true\"],\n.comboboxInput[aria-invalid=\"true\"],\n.selectTrigger[data-invalid],\n.comboboxInputGroup[data-invalid] {\n\tborder-color: var(--border-invalid);\n}\n\n.selectTrigger[data-disabled],\n.comboboxInputGroup[data-disabled] {\n\tcolor: var(--text-disabled);\n\tbackground: var(--control-surface-disabled);\n\tcursor: not-allowed;\n}\n\n.selectValue[data-placeholder],\n.comboboxInput::placeholder {\n\tcolor: var(--control-placeholder);\n}\n\n.selectIcon {\n\tdisplay: inline-grid;\n\tplace-items: center;\n\twidth: var(--icon-size-sm);\n\theight: var(--icon-size-sm);\n\tcolor: var(--icon-secondary);\n\ttransition: transform var(--motion-duration-normal) var(--motion-ease-out);\n}\n\n.selectTrigger[data-popup-open] .selectIcon {\n\ttransform: rotate(180deg);\n}\n\n.selectIcon > svg,\n.optionIndicator > svg,\n.menuItemIndicator > svg {\n\twidth: 100%;\n\theight: 100%;\n}\n\n.comboboxInputGroup {\n\toverflow: hidden;\n}\n\n.comboboxInput {\n\tmin-width: 0;\n\tmin-height: calc(var(--control-height-lg) - 0.125rem);\n\tflex: 1;\n\tpadding-inline: var(--space-4);\n\tfont: var(--font-weight-regular) var(--font-size-md) / var(--line-height-body) var(--font-family-sans);\n\tletter-spacing: var(--letter-spacing-body);\n\tcolor: var(--text-main);\n\tbackground: var(--background-transparent);\n\tborder: 0;\n\toutline: 0;\n}\n\n.comboboxTrigger,\n.comboboxClear {\n\tdisplay: inline-grid;\n\tplace-items: center;\n\tflex: 0 0 auto;\n\twidth: var(--control-target-min);\n\tmin-height: calc(var(--control-height-lg) - 0.125rem);\n\tfont: var(--font-weight-medium) var(--font-size-md) / 1 var(--font-family-sans);\n\tcolor: var(--icon-secondary);\n\tbackground: var(--background-transparent);\n\tborder: 0;\n\tborder-inline-start: 1px solid var(--divider-subtle);\n\tcursor: pointer;\n}\n\n.comboboxTrigger:hover:not([data-disabled]),\n.comboboxClear:hover:not([data-disabled]) {\n\tcolor: var(--icon-main);\n\tbackground: var(--control-surface-hover);\n}\n\n.comboboxClear:not([data-visible]) {\n\tdisplay: none;\n}\n\n.comboboxTrigger > svg,\n.comboboxClear > svg {\n\twidth: var(--icon-size-sm);\n\theight: var(--icon-size-sm);\n}\n\n.positioner {\n\tz-index: var(--z-dropdown);\n\toutline: 0;\n}\n\n.popup,\n.menuPopup {\n\tmin-width: var(--anchor-width);\n\tmax-width: min(24rem, calc(100vw - var(--space-6)));\n\tmax-height: min(22rem, var(--available-height));\n\toverflow: hidden;\n\tcolor: var(--text-main);\n\tbackground: var(--background-elevated);\n\tborder: 0;\n\tborder-radius: var(--radius-md);\n\tbox-shadow: var(--shadow-medium);\n\ttransform-origin: var(--transform-origin);\n\ttransition:\n\t\topacity var(--motion-duration-fast) var(--motion-ease-out),\n\t\ttransform var(--motion-duration-fast) var(--motion-ease-out);\n}\n\n.popup[data-starting-style],\n.popup[data-ending-style],\n.menuPopup[data-starting-style],\n.menuPopup[data-ending-style] {\n\topacity: 0;\n\ttransform: translateY(calc(var(--motion-distance-sm) * -1)) scale(0.98);\n}\n\n.optionList {\n\tmax-height: inherit;\n\toverflow-y: auto;\n\toverscroll-behavior: contain;\n\tpadding: var(--space-1);\n\tscroll-padding-block: var(--space-1);\n}\n\n.option,\n.menuItem {\n\tposition: relative;\n\tdisplay: flex;\n\talign-items: center;\n\tgap: var(--space-2);\n\tmin-height: var(--control-target-min);\n\tpadding: var(--space-2) var(--space-3);\n\tfont: var(--font-weight-regular) var(--font-size-sm) / var(--line-height-body) var(--font-family-sans);\n\tletter-spacing: var(--letter-spacing-body);\n\tcolor: var(--text-main);\n\tbackground: var(--background-transparent);\n\tborder: 0;\n\tborder-radius: var(--radius-sm);\n\toutline: 0;\n\tcursor: pointer;\n\tuser-select: none;\n}\n\n.menuItem:not([data-disabled]) {\n\tcursor: pointer;\n}\n\n.option[data-highlighted],\n.menuItem[data-highlighted] {\n\tcolor: var(--text-title);\n\tbackground: var(--control-surface-hover);\n}\n\n.option[data-selected] {\n\tcolor: var(--text-title);\n\tbackground: var(--background-selected);\n}\n\n.option[data-disabled],\n.menuItem[data-disabled] {\n\tcolor: var(--text-disabled);\n\tcursor: not-allowed;\n}\n\n.optionIndicator,\n.menuItemIndicator {\n\tdisplay: inline-grid;\n\tplace-items: center;\n\tflex: 0 0 auto;\n\twidth: var(--icon-size-sm);\n\theight: var(--icon-size-sm);\n\tcolor: var(--icon-accent);\n}\n\n.optionText {\n\tdisplay: grid;\n\tflex: 1;\n\tgap: var(--space-1);\n}\n\n.optionDescription,\n.emptyOption {\n\tfont-size: var(--font-size-xs);\n\tcolor: var(--text-secondary);\n}\n\n.emptyOption {\n\tpadding: var(--space-4);\n\tfont-family: var(--font-family-sans);\n\ttext-align: center;\n}\n\n.groupLabel {\n\tpadding: var(--space-3) var(--space-3) var(--space-1);\n\tfont: var(--font-weight-medium) var(--font-size-xs) / var(--line-height-body) var(--font-family-sans);\n\tletter-spacing: var(--letter-spacing-body);\n\tcolor: var(--text-secondary);\n}\n\n.separator {\n\theight: 1px;\n\tmargin-block: var(--space-1);\n\tbackground: var(--divider-main);\n}\n\n.menuPopup {\n\tmin-width: 13rem;\n\tpadding: var(--space-1);\n}\n\n.menuPopup:focus-visible {\n\toutline: 0.125rem solid var(--focus-ring);\n\toutline-offset: 0.125rem;\n}\n\n.menuItemIndicator {\n\tmargin-inline-start: auto;\n}\n\n.contextTrigger {\n\tdisplay: block;\n\tborder: 1px solid var(--divider-main);\n\tborder-radius: var(--radius-md);\n\toutline: 0;\n}\n\n@media (prefers-reduced-motion: reduce) {\n\t.checkbox,\n\t.checkboxIndicator,\n\t.radio,\n\t.radioIndicator,\n\t.switch,\n\t.switchThumb,\n\t.sliderThumb,\n\t.toggle,\n\t.menuTrigger,\n\t.selectTrigger,\n\t.selectIcon,\n\t.comboboxInputGroup,\n\t.popup,\n\t.menuPopup {\n\t\ttransition-duration: var(--motion-duration-instant);\n\t}\n}\n\n@media (forced-colors: active) {\n\t.checkbox,\n\t.radio,\n\t.switch,\n\t.sliderTrack,\n\t.sliderThumb,\n\t.toggle,\n\t.menuTrigger,\n\t.selectTrigger,\n\t.comboboxInputGroup,\n\t.popup,\n\t.menuPopup,\n\t.contextTrigger {\n\t\tborder: 1px solid CanvasText;\n\t}\n\n\t.checkbox[data-checked],\n\t.checkbox[data-indeterminate],\n\t.checkbox[data-checked]:hover,\n\t.checkbox[data-indeterminate]:hover,\n\t.checkbox[data-checked]:active,\n\t.checkbox[data-indeterminate]:active,\n\t.radio[data-checked],\n\t.radio[data-checked]:hover,\n\t.radio[data-checked]:active,\n\t.switch[data-checked],\n\t.switch[data-checked]:hover,\n\t.switch[data-checked]:active,\n\t.sliderIndicator,\n\t.toggle[data-pressed] {\n\t\tbackground: Highlight;\n\t\tcolor: HighlightText;\n\t}\n\n\t.switchThumb,\n\t.sliderThumb,\n\t.segmentedControl > .toggle[data-pressed] {\n\t\tbox-shadow: none;\n\t}\n}\n"],"mappings":""}
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|