@ifhover/leaf-ui 0.5.0 → 0.6.0

package/dist/esm/browser/modules/qrcode/qrcode.js

@@ -1,14 +1,17 @@
 "use client";
+import '../../../styles/foundation.css';
 import '../../../styles/components/qrcode.css';
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Download, RefreshCw } from "lucide-react";
 import { QRCodeSVG } from "qrcode.react";
 import { useRef } from "react";
-import { Button } from "../button/index.js";
-import { Loading } from "../loading/index.js";
+import { ButtonControl } from "../button/button.js";
+import { useComponentProps } from "../config-provider/component-defaults.js";
+import { LoadingControl } from "../loading/loading.js";
 import { classes } from "../shared/classes.js";
 import { useText } from "../shared/use-text.js";
-function QRCode({ value, size = 160, color = 'var(--leaf-color-text)', backgroundColor = 'var(--leaf-color-surface)', level = 'M', logo, logoSize = 32, status = 'active', onRefresh, downloadable = false, fileName = 'qrcode.svg', className, ...props }) {
+function QRCode(rawProps) {
+    const { value, size = 160, color = 'var(--leaf-color-text)', backgroundColor = 'var(--leaf-color-surface)', level = 'M', logo, logoSize = 32, status = 'active', onRefresh, downloadable = false, fileName = 'qrcode.svg', className, ...props } = useComponentProps('QRCode', rawProps);
     const t = useText();
     const root = useRef(null);
     const download = ()=>{
@@ -49,7 +52,7 @@ function QRCode({ value, size = 160, color = 'var(--leaf-color-text)', backgroun
                         marginSize: 2,
                         fgColor: color,
                         bgColor: backgroundColor,
-                        title: props['aria-label'] ?? t('二维码', 'QR code'),
+                        title: props['aria-label'] ?? t('qrCode.qrCode'),
                         imageSettings: logo ? {
                             src: logo,
                             width: logoSize,
@@ -59,21 +62,21 @@ function QRCode({ value, size = 160, color = 'var(--leaf-color-text)', backgroun
                     }),
                     'active' !== status && /*#__PURE__*/ jsx("div", {
                         className: "leaf-qr-code__overlay",
-                        children: 'loading' === status ? /*#__PURE__*/ jsx(Loading, {}) : /*#__PURE__*/ jsx(Button, {
+                        children: 'loading' === status ? /*#__PURE__*/ jsx(LoadingControl, {}) : /*#__PURE__*/ jsx(ButtonControl, {
                             variant: "outline",
                             startIcon: /*#__PURE__*/ jsx(RefreshCw, {}),
                             onClick: onRefresh,
-                            children: t('刷新二维码', 'Refresh code')
+                            children: t('qrCode.refreshCode')
                         })
                     })
                 ]
             }),
-            downloadable && /*#__PURE__*/ jsx(Button, {
+            downloadable && /*#__PURE__*/ jsx(ButtonControl, {
                 size: "sm",
                 variant: "ghost",
                 startIcon: /*#__PURE__*/ jsx(Download, {}),
                 onClick: download,
-                children: t('下载', 'Download')
+                children: t('common.download')
             })
         ]
     });

package/dist/esm/browser/modules/qrcode/qrcode.js.map

@@ -1 +1 @@
-{"version":3,"file":"qrcode/qrcode.js","sources":["../../../../../src/qrcode/qrcode.tsx"],"sourcesContent":["import { Download, RefreshCw } from 'lucide-react';\nimport { QRCodeSVG } from 'qrcode.react';\nimport { type HTMLAttributes, useRef } from 'react';\nimport { Button } from '../button';\nimport { Loading } from '../loading';\nimport { classes } from '../shared/classes';\nimport { useText } from '../shared/use-text';\nexport interface QRCodeProps extends HTMLAttributes<HTMLDivElement> {\n  value: string;\n  size?: number;\n  color?: string;\n  backgroundColor?: string;\n  level?: 'L' | 'M' | 'Q' | 'H';\n  logo?: string;\n  logoSize?: number;\n  status?: 'active' | 'loading' | 'expired';\n  onRefresh?: () => void;\n  downloadable?: boolean;\n  fileName?: string;\n}\nexport function QRCode({\n  value,\n  size = 160,\n  color = 'var(--leaf-color-text)',\n  backgroundColor = 'var(--leaf-color-surface)',\n  level = 'M',\n  logo,\n  logoSize = 32,\n  status = 'active',\n  onRefresh,\n  downloadable = false,\n  fileName = 'qrcode.svg',\n  className,\n  ...props\n}: QRCodeProps) {\n  const t = useText();\n  const root = useRef<HTMLDivElement>(null);\n  const download = () => {\n    const svg = root.current?.querySelector('svg');\n    if (!svg) return;\n    const clone = svg.cloneNode(true) as SVGSVGElement;\n    const original = Array.from(svg.querySelectorAll('[fill]'));\n    clone.querySelectorAll('[fill]').forEach((element, index) => {\n      element.setAttribute('fill', getComputedStyle(original[index] ?? svg).fill);\n    });\n    const address = URL.createObjectURL(\n      new Blob([new XMLSerializer().serializeToString(clone)], { type: 'image/svg+xml' }),\n    );\n    const anchor = document.createElement('a');\n    anchor.href = address;\n    anchor.download = fileName;\n    anchor.click();\n    setTimeout(() => URL.revokeObjectURL(address), 1000);\n  };\n  return (\n    <div {...props} ref={root} className={classes('leaf-qr-code', className)}>\n      <div\n        className=\"leaf-qr-code__image\"\n        style={{ width: Math.max(64, size), height: Math.max(64, size) }}\n      >\n        <QRCodeSVG\n          value={value}\n          size={Math.max(64, size)}\n          level={level}\n          marginSize={2}\n          fgColor={color}\n          bgColor={backgroundColor}\n          title={props['aria-label'] ?? t('二维码', 'QR code')}\n          imageSettings={\n            logo ? { src: logo, width: logoSize, height: logoSize, excavate: true } : undefined\n          }\n        />\n        {status !== 'active' && (\n          <div className=\"leaf-qr-code__overlay\">\n            {status === 'loading' ? (\n              <Loading />\n            ) : (\n              <Button variant=\"outline\" startIcon={<RefreshCw />} onClick={onRefresh}>\n                {t('刷新二维码', 'Refresh code')}\n              </Button>\n            )}\n          </div>\n        )}\n      </div>\n      {downloadable && (\n        <Button size=\"sm\" variant=\"ghost\" startIcon={<Download />} onClick={download}>\n          {t('下载', 'Download')}\n        </Button>\n      )}\n    </div>\n  );\n}\n"],"names":["QRCode","value","size","color","backgroundColor","level","logo","logoSize","status","onRefresh","downloadable","fileName","className","props","t","useText","root","useRef","download","svg","clone","original","Array","element","index","getComputedStyle","address","URL","Blob","XMLSerializer","anchor","document","setTimeout","classes","Math","QRCodeSVG","undefined","Loading","Button","RefreshCw","Download"],"mappings":";;;;;;;;;;AAoBO,SAASA,OAAO,EACrBC,KAAK,EACLC,OAAO,GAAG,EACVC,QAAQ,wBAAwB,EAChCC,kBAAkB,2BAA2B,EAC7CC,QAAQ,GAAG,EACXC,IAAI,EACJC,WAAW,EAAE,EACbC,SAAS,QAAQ,EACjBC,SAAS,EACTC,eAAe,KAAK,EACpBC,WAAW,YAAY,EACvBC,SAAS,EACT,GAAGC,OACS;IACZ,MAAMC,IAAIC;IACV,MAAMC,OAAOC,OAAuB;IACpC,MAAMC,WAAW;QACf,MAAMC,MAAMH,KAAK,OAAO,EAAE,cAAc;QACxC,IAAI,CAACG,KAAK;QACV,MAAMC,QAAQD,IAAI,SAAS,CAAC;QAC5B,MAAME,WAAWC,MAAM,IAAI,CAACH,IAAI,gBAAgB,CAAC;QACjDC,MAAM,gBAAgB,CAAC,UAAU,OAAO,CAAC,CAACG,SAASC;YACjDD,QAAQ,YAAY,CAAC,QAAQE,iBAAiBJ,QAAQ,CAACG,MAAM,IAAIL,KAAK,IAAI;QAC5E;QACA,MAAMO,UAAUC,IAAI,eAAe,CACjC,IAAIC,KAAK;YAAC,IAAIC,gBAAgB,iBAAiB,CAACT;SAAO,EAAE;YAAE,MAAM;QAAgB;QAEnF,MAAMU,SAASC,SAAS,aAAa,CAAC;QACtCD,OAAO,IAAI,GAAGJ;QACdI,OAAO,QAAQ,GAAGnB;QAClBmB,OAAO,KAAK;QACZE,WAAW,IAAML,IAAI,eAAe,CAACD,UAAU;IACjD;IACA,OAAO,WAAP,GACE,KAAC;QAAK,GAAGb,KAAK;QAAE,KAAKG;QAAM,WAAWiB,QAAQ,gBAAgBrB;;0BAC5D,KAAC;gBACC,WAAU;gBACV,OAAO;oBAAE,OAAOsB,KAAK,GAAG,CAAC,IAAIhC;oBAAO,QAAQgC,KAAK,GAAG,CAAC,IAAIhC;gBAAM;;kCAE/D,IAACiC,WAASA;wBACR,OAAOlC;wBACP,MAAMiC,KAAK,GAAG,CAAC,IAAIhC;wBACnB,OAAOG;wBACP,YAAY;wBACZ,SAASF;wBACT,SAASC;wBACT,OAAOS,KAAK,CAAC,aAAa,IAAIC,EAAE,OAAO;wBACvC,eACER,OAAO;4BAAE,KAAKA;4BAAM,OAAOC;4BAAU,QAAQA;4BAAU,UAAU;wBAAK,IAAI6B;;oBAGlE,aAAX5B,UAAuB,WAAZ,GACV,IAAC;wBAAI,WAAU;kCACZA,AAAW,cAAXA,SAAuB,WAAZ,GACV,IAAC6B,SAAOA,CAAAA,KAAAA,WAAAA,GAER,IAACC,QAAMA;4BAAC,SAAQ;4BAAU,yBAAW,IAACC,WAASA,CAAAA;4BAAK,SAAS9B;sCAC1DK,EAAE,SAAS;;;;;YAMrBJ,gBAAgB,WAAhBA,GACC,IAAC4B,QAAMA;gBAAC,MAAK;gBAAK,SAAQ;gBAAQ,yBAAW,IAACE,UAAQA,CAAAA;gBAAK,SAAStB;0BACjEJ,EAAE,MAAM;;;;AAKnB"}
+{"version":3,"file":"qrcode/qrcode.js","sources":["../../../../../src/qrcode/qrcode.tsx"],"sourcesContent":["import { Download, RefreshCw } from 'lucide-react';\nimport { QRCodeSVG } from 'qrcode.react';\nimport { type HTMLAttributes, useRef } from 'react';\nimport { ButtonControl } from '../button/button';\nimport { useComponentProps } from '../config-provider/component-defaults';\nimport { LoadingControl as Loading } from '../loading/loading';\nimport { classes } from '../shared/classes';\nimport { useText } from '../shared/use-text';\nexport interface QRCodeProps extends HTMLAttributes<HTMLDivElement> {\n  value: string;\n  size?: number;\n  color?: string;\n  backgroundColor?: string;\n  level?: 'L' | 'M' | 'Q' | 'H';\n  logo?: string;\n  logoSize?: number;\n  status?: 'active' | 'loading' | 'expired';\n  onRefresh?: () => void;\n  downloadable?: boolean;\n  fileName?: string;\n}\nexport function QRCode(rawProps: QRCodeProps) {\n  const {\n    value,\n    size = 160,\n    color = 'var(--leaf-color-text)',\n    backgroundColor = 'var(--leaf-color-surface)',\n    level = 'M',\n    logo,\n    logoSize = 32,\n    status = 'active',\n    onRefresh,\n    downloadable = false,\n    fileName = 'qrcode.svg',\n    className,\n    ...props\n  } = useComponentProps('QRCode', rawProps);\n  const t = useText();\n  const root = useRef<HTMLDivElement>(null);\n  const download = () => {\n    const svg = root.current?.querySelector('svg');\n    if (!svg) return;\n    const clone = svg.cloneNode(true) as SVGSVGElement;\n    const original = Array.from(svg.querySelectorAll('[fill]'));\n    clone.querySelectorAll('[fill]').forEach((element, index) => {\n      element.setAttribute('fill', getComputedStyle(original[index] ?? svg).fill);\n    });\n    const address = URL.createObjectURL(\n      new Blob([new XMLSerializer().serializeToString(clone)], { type: 'image/svg+xml' }),\n    );\n    const anchor = document.createElement('a');\n    anchor.href = address;\n    anchor.download = fileName;\n    anchor.click();\n    setTimeout(() => URL.revokeObjectURL(address), 1000);\n  };\n  return (\n    <div {...props} ref={root} className={classes('leaf-qr-code', className)}>\n      <div\n        className=\"leaf-qr-code__image\"\n        style={{ width: Math.max(64, size), height: Math.max(64, size) }}\n      >\n        <QRCodeSVG\n          value={value}\n          size={Math.max(64, size)}\n          level={level}\n          marginSize={2}\n          fgColor={color}\n          bgColor={backgroundColor}\n          title={props['aria-label'] ?? t('qrCode.qrCode')}\n          imageSettings={\n            logo ? { src: logo, width: logoSize, height: logoSize, excavate: true } : undefined\n          }\n        />\n        {status !== 'active' && (\n          <div className=\"leaf-qr-code__overlay\">\n            {status === 'loading' ? (\n              <Loading />\n            ) : (\n              <ButtonControl variant=\"outline\" startIcon={<RefreshCw />} onClick={onRefresh}>\n                {t('qrCode.refreshCode')}\n              </ButtonControl>\n            )}\n          </div>\n        )}\n      </div>\n      {downloadable && (\n        <ButtonControl size=\"sm\" variant=\"ghost\" startIcon={<Download />} onClick={download}>\n          {t('common.download')}\n        </ButtonControl>\n      )}\n    </div>\n  );\n}\n"],"names":["QRCode","rawProps","value","size","color","backgroundColor","level","logo","logoSize","status","onRefresh","downloadable","fileName","className","props","useComponentProps","t","useText","root","useRef","download","svg","clone","original","Array","element","index","getComputedStyle","address","URL","Blob","XMLSerializer","anchor","document","setTimeout","classes","Math","QRCodeSVG","undefined","Loading","ButtonControl","RefreshCw","Download"],"mappings":";;;;;;;;;;;;AAqBO,SAASA,OAAOC,QAAqB;IAC1C,MAAM,EACJC,KAAK,EACLC,OAAO,GAAG,EACVC,QAAQ,wBAAwB,EAChCC,kBAAkB,2BAA2B,EAC7CC,QAAQ,GAAG,EACXC,IAAI,EACJC,WAAW,EAAE,EACbC,SAAS,QAAQ,EACjBC,SAAS,EACTC,eAAe,KAAK,EACpBC,WAAW,YAAY,EACvBC,SAAS,EACT,GAAGC,OACJ,GAAGC,kBAAkB,UAAUd;IAChC,MAAMe,IAAIC;IACV,MAAMC,OAAOC,OAAuB;IACpC,MAAMC,WAAW;QACf,MAAMC,MAAMH,KAAK,OAAO,EAAE,cAAc;QACxC,IAAI,CAACG,KAAK;QACV,MAAMC,QAAQD,IAAI,SAAS,CAAC;QAC5B,MAAME,WAAWC,MAAM,IAAI,CAACH,IAAI,gBAAgB,CAAC;QACjDC,MAAM,gBAAgB,CAAC,UAAU,OAAO,CAAC,CAACG,SAASC;YACjDD,QAAQ,YAAY,CAAC,QAAQE,iBAAiBJ,QAAQ,CAACG,MAAM,IAAIL,KAAK,IAAI;QAC5E;QACA,MAAMO,UAAUC,IAAI,eAAe,CACjC,IAAIC,KAAK;YAAC,IAAIC,gBAAgB,iBAAiB,CAACT;SAAO,EAAE;YAAE,MAAM;QAAgB;QAEnF,MAAMU,SAASC,SAAS,aAAa,CAAC;QACtCD,OAAO,IAAI,GAAGJ;QACdI,OAAO,QAAQ,GAAGpB;QAClBoB,OAAO,KAAK;QACZE,WAAW,IAAML,IAAI,eAAe,CAACD,UAAU;IACjD;IACA,OAAO,WAAP,GACE,KAAC;QAAK,GAAGd,KAAK;QAAE,KAAKI;QAAM,WAAWiB,QAAQ,gBAAgBtB;;0BAC5D,KAAC;gBACC,WAAU;gBACV,OAAO;oBAAE,OAAOuB,KAAK,GAAG,CAAC,IAAIjC;oBAAO,QAAQiC,KAAK,GAAG,CAAC,IAAIjC;gBAAM;;kCAE/D,IAACkC,WAASA;wBACR,OAAOnC;wBACP,MAAMkC,KAAK,GAAG,CAAC,IAAIjC;wBACnB,OAAOG;wBACP,YAAY;wBACZ,SAASF;wBACT,SAASC;wBACT,OAAOS,KAAK,CAAC,aAAa,IAAIE,EAAE;wBAChC,eACET,OAAO;4BAAE,KAAKA;4BAAM,OAAOC;4BAAU,QAAQA;4BAAU,UAAU;wBAAK,IAAI8B;;oBAGlE,aAAX7B,UAAuB,WAAZ,GACV,IAAC;wBAAI,WAAU;kCACZA,AAAW,cAAXA,SAAuB,WAAZ,GACV,IAAC8B,gBAAOA,CAAAA,KAAAA,WAAAA,GAER,IAACC,eAAaA;4BAAC,SAAQ;4BAAU,yBAAW,IAACC,WAASA,CAAAA;4BAAK,SAAS/B;sCACjEM,EAAE;;;;;YAMZL,gBAAgB,WAAhBA,GACC,IAAC6B,eAAaA;gBAAC,MAAK;gBAAK,SAAQ;gBAAQ,yBAAW,IAACE,UAAQA,CAAAA;gBAAK,SAAStB;0BACxEJ,EAAE;;;;AAKb"}

package/dist/esm/browser/modules/radio/index.js

@@ -1,2 +1,2 @@
 "use client";
-export * from "./radio.js";
+export { Radio, RadioGroup } from "./radio.js";

package/dist/esm/browser/modules/radio/radio.js

@@ -1,10 +1,12 @@
 "use client";
+import '../../../styles/foundation.css';
 import '../../../styles/components/radio.css';
 import { jsx, jsxs } from "react/jsx-runtime";
 import { forwardRef, useId } from "react";
+import { useComponentProps } from "../config-provider/component-defaults.js";
 import { useFormField } from "../form/form.js";
 import { classes } from "../shared/classes.js";
-const radio_Radio = /*#__PURE__*/ forwardRef(function({ size = 'md', variant = 'plain', description, icon, extra, className, style, disabled: disabledProp, children, ...props }, ref) {
+const radio_RadioControl = /*#__PURE__*/ forwardRef(function({ size = 'md', variant = 'plain', description, icon, extra, className, style, disabled: disabledProp, children, ...props }, ref) {
     const field = useFormField();
     const id = useId();
     const disabled = disabledProp || field?.disabled;
@@ -66,8 +68,9 @@ const radio_Radio = /*#__PURE__*/ forwardRef(function({ size = 'md', variant = '
         ]
     });
 });
-radio_Radio.displayName = 'Radio';
-const radio_RadioGroup = /*#__PURE__*/ forwardRef(function({ options, value, defaultValue, name, label, size = 'md', variant = 'plain', direction = 'horizontal', required, onChange, disabled: disabledProp, className, ...props }, ref) {
+radio_RadioControl.displayName = 'RadioControl';
+const radio_RadioGroup = /*#__PURE__*/ forwardRef(function(rawProps, ref) {
+    const { options, value, defaultValue, name, label, size = 'md', variant = 'plain', direction = 'horizontal', required, onChange, disabled: disabledProp, className, ...props } = useComponentProps('RadioGroup', rawProps);
     const id = useId();
     const field = useFormField();
     const disabled = disabledProp || field?.disabled;
@@ -91,7 +94,7 @@ const radio_RadioGroup = /*#__PURE__*/ forwardRef(function({ options, value, def
             }),
             /*#__PURE__*/ jsx("div", {
                 className: "leaf-radio-group__options",
-                children: options.map((option)=>/*#__PURE__*/ jsx(radio_Radio, {
+                children: options.map((option)=>/*#__PURE__*/ jsx(radio_RadioControl, {
                         id: `${props.id ?? field?.id ?? id}-${option.value}`,
                         size: size,
                         variant: 'card' === variant ? 'card' : 'plain',
@@ -112,6 +115,14 @@ const radio_RadioGroup = /*#__PURE__*/ forwardRef(function({ options, value, def
     });
 });
 radio_RadioGroup.displayName = 'RadioGroup';
-export { radio_Radio as Radio, radio_RadioGroup as RadioGroup };
+const radio_Radio = /*#__PURE__*/ forwardRef(function(rawProps, ref) {
+    const props = useComponentProps('Radio', rawProps);
+    return /*#__PURE__*/ jsx(radio_RadioControl, {
+        ...props,
+        ref: ref
+    });
+});
+radio_Radio.displayName = 'Radio';
+export { radio_Radio as Radio, radio_RadioControl as RadioControl, radio_RadioGroup as RadioGroup };
 
 //# sourceMappingURL=radio.js.map

package/dist/esm/browser/modules/radio/radio.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio/radio.js","sources":["../../../../../src/radio/radio.tsx"],"sourcesContent":["import {\n  type ChangeEventHandler,\n  type FieldsetHTMLAttributes,\n  forwardRef,\n  type InputHTMLAttributes,\n  type ReactNode,\n  useId,\n} from 'react';\nimport { useFormField } from '../form/form';\nimport { classes } from '../shared/classes';\nimport type { ControlSize } from '../shared/types';\nexport interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'type'> {\n  size?: ControlSize;\n  variant?: 'plain' | 'card';\n  description?: ReactNode;\n  icon?: ReactNode;\n  extra?: ReactNode;\n}\nexport const Radio = forwardRef<HTMLInputElement, RadioProps>(function Radio(\n  {\n    size = 'md',\n    variant = 'plain',\n    description,\n    icon,\n    extra,\n    className,\n    style,\n    disabled: disabledProp,\n    children,\n    ...props\n  },\n  ref,\n) {\n  const field = useFormField();\n  const id = useId();\n  const disabled = disabledProp || field?.disabled;\n  return (\n    <label\n      className={classes(\n        'leaf-radio',\n        `leaf-radio--${size}`,\n        `leaf-radio--${variant}`,\n        description != null && 'leaf-radio--described',\n        className,\n      )}\n      style={style}\n      data-disabled={disabled ? '' : undefined}\n    >\n      <span className=\"leaf-radio__control\">\n        <input\n          {...props}\n          id={props.id ?? field?.id}\n          required={props.required ?? field?.required}\n          aria-labelledby={\n            props['aria-labelledby'] ??\n            (!props['aria-label'] && children != null ? `${id}-label` : undefined)\n          }\n          aria-describedby={\n            [\n              props['aria-describedby'],\n              field?.descriptionId,\n              description != null && `${id}-description`,\n              extra != null && `${id}-extra`,\n            ]\n              .filter(Boolean)\n              .join(' ') || undefined\n          }\n          aria-invalid={field?.error ? true : props['aria-invalid']}\n          ref={ref}\n          type=\"radio\"\n          disabled={disabled}\n          className=\"leaf-radio__input\"\n        />\n        <span className=\"leaf-radio__mark\" />\n      </span>\n      {icon != null && (\n        <span className=\"leaf-radio__icon\" aria-hidden=\"true\">\n          {icon}\n        </span>\n      )}\n      {(children != null || description != null) && (\n        <span className=\"leaf-radio__copy\">\n          {children != null && (\n            <span id={`${id}-label`} className=\"leaf-radio__label\">\n              {children}\n            </span>\n          )}\n          {description != null && (\n            <span id={`${id}-description`} className=\"leaf-radio__description\">\n              {description}\n            </span>\n          )}\n        </span>\n      )}\n      {extra != null && (\n        <span id={`${id}-extra`} className=\"leaf-radio__extra\">\n          {extra}\n        </span>\n      )}\n    </label>\n  );\n});\nRadio.displayName = 'Radio';\nexport interface RadioOption {\n  label: ReactNode;\n  description?: ReactNode;\n  icon?: ReactNode;\n  extra?: ReactNode;\n  value: string;\n  disabled?: boolean;\n}\nexport interface RadioGroupProps\n  extends Omit<\n    FieldsetHTMLAttributes<HTMLFieldSetElement>,\n    'onChange' | 'defaultValue' | 'children'\n  > {\n  options: readonly RadioOption[];\n  value?: string;\n  defaultValue?: string;\n  name?: string;\n  label?: ReactNode;\n  size?: ControlSize;\n  variant?: 'plain' | 'card' | 'list';\n  direction?: 'horizontal' | 'vertical';\n  required?: boolean;\n  onChange?: ChangeEventHandler<HTMLInputElement>;\n}\nexport const RadioGroup = forwardRef<HTMLFieldSetElement, RadioGroupProps>(function RadioGroup(\n  {\n    options,\n    value,\n    defaultValue,\n    name,\n    label,\n    size = 'md',\n    variant = 'plain',\n    direction = 'horizontal',\n    required,\n    onChange,\n    disabled: disabledProp,\n    className,\n    ...props\n  },\n  ref,\n) {\n  const id = useId();\n  const field = useFormField();\n  const disabled = disabledProp || field?.disabled;\n  return (\n    <fieldset\n      {...props}\n      ref={ref}\n      id={props.id ?? field?.id}\n      aria-labelledby={props['aria-labelledby'] ?? (!label ? field?.labelId : undefined)}\n      aria-describedby={\n        [props['aria-describedby'], field?.descriptionId].filter(Boolean).join(' ') || undefined\n      }\n      aria-invalid={field?.error ? true : props['aria-invalid']}\n      tabIndex={-1}\n      disabled={disabled}\n      className={classes(\n        'leaf-radio-group',\n        `leaf-radio-group--${direction}`,\n        `leaf-radio-group--${variant}`,\n        className,\n      )}\n    >\n      {label && <legend className=\"leaf-radio-group__legend\">{label}</legend>}\n      <div className=\"leaf-radio-group__options\">\n        {options.map((option) => (\n          <Radio\n            key={option.value}\n            id={`${props.id ?? field?.id ?? id}-${option.value}`}\n            size={size}\n            variant={variant === 'card' ? 'card' : 'plain'}\n            description={option.description}\n            icon={option.icon}\n            extra={option.extra}\n            name={name ?? id}\n            value={option.value}\n            disabled={disabled || option.disabled}\n            required={required ?? field?.required}\n            checked={value === undefined ? undefined : value === option.value}\n            defaultChecked={value === undefined ? defaultValue === option.value : undefined}\n            onChange={onChange}\n          >\n            {option.label}\n          </Radio>\n        ))}\n      </div>\n    </fieldset>\n  );\n});\nRadioGroup.displayName = 'RadioGroup';\n"],"names":["Radio","forwardRef","size","variant","description","icon","extra","className","style","disabledProp","children","props","ref","field","useFormField","id","useId","disabled","classes","undefined","Boolean","RadioGroup","options","value","defaultValue","name","label","direction","required","onChange","option"],"mappings":"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"}
+{"version":3,"file":"radio/radio.js","sources":["../../../../../src/radio/radio.tsx"],"sourcesContent":["import {\n  type ChangeEventHandler,\n  type FieldsetHTMLAttributes,\n  forwardRef,\n  type InputHTMLAttributes,\n  type ReactNode,\n  useId,\n} from 'react';\nimport { useComponentProps } from '../config-provider/component-defaults';\nimport { useFormField } from '../form/form';\nimport { classes } from '../shared/classes';\nimport type { ControlSize } from '../shared/types';\nexport interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'type'> {\n  size?: ControlSize;\n  variant?: 'plain' | 'card';\n  description?: ReactNode;\n  icon?: ReactNode;\n  extra?: ReactNode;\n}\nexport const RadioControl = forwardRef<HTMLInputElement, RadioProps>(function RadioControl(\n  {\n    size = 'md',\n    variant = 'plain',\n    description,\n    icon,\n    extra,\n    className,\n    style,\n    disabled: disabledProp,\n    children,\n    ...props\n  }: RadioProps,\n  ref,\n) {\n  const field = useFormField();\n  const id = useId();\n  const disabled = disabledProp || field?.disabled;\n  return (\n    <label\n      className={classes(\n        'leaf-radio',\n        `leaf-radio--${size}`,\n        `leaf-radio--${variant}`,\n        description != null && 'leaf-radio--described',\n        className,\n      )}\n      style={style}\n      data-disabled={disabled ? '' : undefined}\n    >\n      <span className=\"leaf-radio__control\">\n        <input\n          {...props}\n          id={props.id ?? field?.id}\n          required={props.required ?? field?.required}\n          aria-labelledby={\n            props['aria-labelledby'] ??\n            (!props['aria-label'] && children != null ? `${id}-label` : undefined)\n          }\n          aria-describedby={\n            [\n              props['aria-describedby'],\n              field?.descriptionId,\n              description != null && `${id}-description`,\n              extra != null && `${id}-extra`,\n            ]\n              .filter(Boolean)\n              .join(' ') || undefined\n          }\n          aria-invalid={field?.error ? true : props['aria-invalid']}\n          ref={ref}\n          type=\"radio\"\n          disabled={disabled}\n          className=\"leaf-radio__input\"\n        />\n        <span className=\"leaf-radio__mark\" />\n      </span>\n      {icon != null && (\n        <span className=\"leaf-radio__icon\" aria-hidden=\"true\">\n          {icon}\n        </span>\n      )}\n      {(children != null || description != null) && (\n        <span className=\"leaf-radio__copy\">\n          {children != null && (\n            <span id={`${id}-label`} className=\"leaf-radio__label\">\n              {children}\n            </span>\n          )}\n          {description != null && (\n            <span id={`${id}-description`} className=\"leaf-radio__description\">\n              {description}\n            </span>\n          )}\n        </span>\n      )}\n      {extra != null && (\n        <span id={`${id}-extra`} className=\"leaf-radio__extra\">\n          {extra}\n        </span>\n      )}\n    </label>\n  );\n});\nRadioControl.displayName = 'RadioControl';\nexport interface RadioOption {\n  label: ReactNode;\n  description?: ReactNode;\n  icon?: ReactNode;\n  extra?: ReactNode;\n  value: string;\n  disabled?: boolean;\n}\nexport interface RadioGroupProps\n  extends Omit<\n    FieldsetHTMLAttributes<HTMLFieldSetElement>,\n    'onChange' | 'defaultValue' | 'children'\n  > {\n  options: readonly RadioOption[];\n  value?: string;\n  defaultValue?: string;\n  name?: string;\n  label?: ReactNode;\n  size?: ControlSize;\n  variant?: 'plain' | 'card' | 'list';\n  direction?: 'horizontal' | 'vertical';\n  required?: boolean;\n  onChange?: ChangeEventHandler<HTMLInputElement>;\n}\nexport const RadioGroup = forwardRef<HTMLFieldSetElement, RadioGroupProps>(function RadioGroup(\n  rawProps: RadioGroupProps,\n  ref,\n) {\n  const {\n    options,\n    value,\n    defaultValue,\n    name,\n    label,\n    size = 'md',\n    variant = 'plain',\n    direction = 'horizontal',\n    required,\n    onChange,\n    disabled: disabledProp,\n    className,\n    ...props\n  } = useComponentProps('RadioGroup', rawProps);\n  const id = useId();\n  const field = useFormField();\n  const disabled = disabledProp || field?.disabled;\n  return (\n    <fieldset\n      {...props}\n      ref={ref}\n      id={props.id ?? field?.id}\n      aria-labelledby={props['aria-labelledby'] ?? (!label ? field?.labelId : undefined)}\n      aria-describedby={\n        [props['aria-describedby'], field?.descriptionId].filter(Boolean).join(' ') || undefined\n      }\n      aria-invalid={field?.error ? true : props['aria-invalid']}\n      tabIndex={-1}\n      disabled={disabled}\n      className={classes(\n        'leaf-radio-group',\n        `leaf-radio-group--${direction}`,\n        `leaf-radio-group--${variant}`,\n        className,\n      )}\n    >\n      {label && <legend className=\"leaf-radio-group__legend\">{label}</legend>}\n      <div className=\"leaf-radio-group__options\">\n        {options.map((option) => (\n          <RadioControl\n            key={option.value}\n            id={`${props.id ?? field?.id ?? id}-${option.value}`}\n            size={size}\n            variant={variant === 'card' ? 'card' : 'plain'}\n            description={option.description}\n            icon={option.icon}\n            extra={option.extra}\n            name={name ?? id}\n            value={option.value}\n            disabled={disabled || option.disabled}\n            required={required ?? field?.required}\n            checked={value === undefined ? undefined : value === option.value}\n            defaultChecked={value === undefined ? defaultValue === option.value : undefined}\n            onChange={onChange}\n          >\n            {option.label}\n          </RadioControl>\n        ))}\n      </div>\n    </fieldset>\n  );\n});\nRadioGroup.displayName = 'RadioGroup';\n\nexport const Radio = forwardRef<HTMLInputElement, RadioProps>(function Radio(\n  rawProps: RadioProps,\n  ref,\n) {\n  const props = useComponentProps('Radio', rawProps);\n  return <RadioControl {...props} ref={ref} />;\n});\nRadio.displayName = 'Radio';\n"],"names":["RadioControl","forwardRef","size","variant","description","icon","extra","className","style","disabledProp","children","props","ref","field","useFormField","id","useId","disabled","classes","undefined","Boolean","RadioGroup","rawProps","options","value","defaultValue","name","label","direction","required","onChange","useComponentProps","option","Radio"],"mappings":"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"}

package/dist/esm/browser/modules/rate/rate.js

@@ -1,17 +1,20 @@
 "use client";
+import '../../../styles/foundation.css';
 import '../../../styles/components/rate.css';
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Star } from "lucide-react";
 import { useRef, useState } from "react";
+import { useComponentProps } from "../config-provider/component-defaults.js";
 import { useLeafConfig } from "../config-provider/context.js";
 import { useFormField } from "../form/form.js";
 import { classes } from "../shared/classes.js";
 import { FormValue, useFieldValue } from "../shared/field.js";
-function Rate({ value, defaultValue = 0, onChange, count = 5, allowHalf = false, allowClear = true, disabled: disabledProp, readOnly = false, size = 'md', color, colorByValue = false, colors = [
-    '#ef5350',
-    '#f49b23',
-    '#ffc53d'
-], name, form, required: requiredProp, className, style, 'aria-label': label, ...props }) {
+function Rate(rawProps) {
+    const { value, defaultValue = 0, onChange, count = 5, allowHalf = false, allowClear = true, disabled: disabledProp, readOnly = false, size = 'md', color, colorByValue = false, colors = [
+        '#ef5350',
+        '#f49b23',
+        '#ffc53d'
+    ], name, form, required: requiredProp, className, style, 'aria-label': label, ...props } = useComponentProps('Rate', rawProps);
     const { messages } = useLeafConfig();
     const field = useFormField();
     const disabled = disabledProp || field?.disabled;
@@ -42,7 +45,7 @@ function Rate({ value, defaultValue = 0, onChange, count = 5, allowHalf = false,
         id: props.id ?? field?.id,
         ref: root,
         role: "radiogroup",
-        "aria-label": label ?? (field?.labelId ? void 0 : messages.rating),
+        "aria-label": label ?? (field?.labelId ? void 0 : messages.rate.label),
         "aria-labelledby": props['aria-labelledby'] ?? field?.labelId,
         "aria-disabled": disabled || void 0,
         "aria-readonly": readOnly || void 0,

package/dist/esm/browser/modules/rate/rate.js.map

@@ -1 +1 @@
-{"version":3,"file":"rate/rate.js","sources":["../../../../../src/rate/rate.tsx"],"sourcesContent":["import { Star } from 'lucide-react';\nimport { type HTMLAttributes, useRef, useState } from 'react';\nimport { useLeafConfig } from '../config-provider/context';\nimport { useFormField } from '../form/form';\nimport { classes } from '../shared/classes';\nimport { FormValue, useFieldValue } from '../shared/field';\nimport type { ControlSize } from '../shared/types';\n\nexport interface RateProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange' | 'defaultValue'> {\n  value?: number;\n  defaultValue?: number;\n  onChange?: (value: number) => void;\n  count?: number;\n  allowHalf?: boolean;\n  allowClear?: boolean;\n  disabled?: boolean;\n  readOnly?: boolean;\n  size?: ControlSize;\n  color?: string;\n  colorByValue?: boolean;\n  colors?: readonly [string, string, string];\n  name?: string;\n  form?: string;\n  required?: boolean;\n}\nexport function Rate({\n  value,\n  defaultValue = 0,\n  onChange,\n  count = 5,\n  allowHalf = false,\n  allowClear = true,\n  disabled: disabledProp,\n  readOnly = false,\n  size = 'md',\n  color,\n  colorByValue = false,\n  colors = ['#ef5350', '#f49b23', '#ffc53d'],\n  name,\n  form,\n  required: requiredProp,\n  className,\n  style,\n  'aria-label': label,\n  ...props\n}: RateProps) {\n  const { messages } = useLeafConfig();\n  const field = useFormField();\n  const disabled = disabledProp || field?.disabled;\n  const required = requiredProp ?? field?.required;\n  const maximum = Math.max(1, Math.min(20, Number.isFinite(count) ? Math.floor(count) : 5));\n  const step = allowHalf ? 0.5 : 1;\n  const normalize = (number: number) =>\n    Math.min(maximum, Math.max(0, Number.isFinite(number) ? Math.round(number / step) * step : 0));\n  const trigger = useRef<HTMLButtonElement>(null);\n  const root = useRef<HTMLDivElement>(null);\n  const [current, setCurrent] = useFieldValue(value, defaultValue, trigger, form);\n  const selected = normalize(current);\n  const [hovered, setHovered] = useState<number>();\n  const [focused, setFocused] = useState<number>();\n  const displayed = disabled || readOnly ? selected : (hovered ?? selected);\n  const activeColor =\n    color ??\n    (colorByValue\n      ? colors[displayed / maximum <= 0.4 ? 0 : displayed / maximum <= 0.7 ? 1 : 2]\n      : undefined);\n  const values = Array.from({ length: maximum / step }, (_, index) => (index + 1) * step);\n  const focusValue = values.includes(focused ?? 0) ? focused : selected || step;\n  const choose = (next: number) => {\n    if (disabled || readOnly) return;\n    const normalized = normalize(next);\n    setCurrent(normalized);\n    if (normalized !== selected) onChange?.(normalized);\n  };\n  return (\n    <div\n      {...props}\n      id={props.id ?? field?.id}\n      ref={root}\n      role=\"radiogroup\"\n      aria-label={label ?? (field?.labelId ? undefined : messages.rating)}\n      aria-labelledby={props['aria-labelledby'] ?? field?.labelId}\n      aria-disabled={disabled || undefined}\n      aria-readonly={readOnly || undefined}\n      aria-required={required || undefined}\n      aria-describedby={\n        [props['aria-describedby'], field?.descriptionId].filter(Boolean).join(' ') || undefined\n      }\n      className={classes('leaf-rate', `leaf-rate--${size}`, className)}\n      style={{ ...(activeColor ? { '--leaf-rate-color': activeColor } : {}), ...style }}\n      onPointerLeave={() => setHovered(undefined)}\n      onBlur={(event) => {\n        props.onBlur?.(event);\n        if (!event.currentTarget.contains(event.relatedTarget)) setFocused(undefined);\n      }}\n    >\n      {Array.from({ length: maximum }, (_, index) => (\n        // biome-ignore lint/suspicious/noArrayIndexKey: Each star has a fixed numeric position in the rating scale.\n        <span className=\"leaf-rate__star\" key={`star-${index}`}>\n          <Star className=\"leaf-rate__empty\" aria-hidden=\"true\" />\n          <span\n            className=\"leaf-rate__fill\"\n            aria-hidden=\"true\"\n            style={{ width: `${Math.max(0, Math.min(1, displayed - index)) * 100}%` }}\n          >\n            <Star />\n          </span>\n          {(allowHalf ? [index + 0.5, index + 1] : [index + 1]).map((number) => (\n            // biome-ignore lint/a11y/useSemanticElements: Custom rating radios support half values, clearing and read-only state with one roving tab stop.\n            <button\n              type=\"button\"\n              key={number}\n              ref={number === step ? trigger : undefined}\n              role=\"radio\"\n              aria-checked={number === selected}\n              aria-label={`${number} / ${maximum}`}\n              disabled={disabled}\n              aria-disabled={readOnly || undefined}\n              className=\"leaf-rate__option\"\n              tabIndex={number === focusValue ? 0 : -1}\n              onFocus={() => setFocused(number)}\n              onPointerEnter={() => {\n                if (!disabled && !readOnly) setHovered(number);\n              }}\n              onClick={() => choose(allowClear && number === selected ? 0 : number)}\n              onKeyDown={(event) => {\n                if (disabled || readOnly) return;\n                let next: number | undefined;\n                if (event.key === 'Home') next = step;\n                else if (event.key === 'End') next = maximum;\n                else if (['ArrowRight', 'ArrowUp', 'ArrowLeft', 'ArrowDown'].includes(event.key))\n                  next = Math.max(\n                    step,\n                    Math.min(\n                      maximum,\n                      number + (['ArrowRight', 'ArrowUp'].includes(event.key) ? step : -step),\n                    ),\n                  );\n                else if ((event.key === 'Delete' || event.key === 'Backspace') && allowClear)\n                  next = 0;\n                if (next !== undefined) {\n                  event.preventDefault();\n                  choose(next);\n                  setHovered(undefined);\n                  const target = root.current?.querySelector<HTMLButtonElement>(\n                    `[aria-label='${next || step} / ${maximum}']`,\n                  );\n                  target?.focus();\n                }\n              }}\n            />\n          ))}\n        </span>\n      ))}\n      <FormValue\n        name={name}\n        form={form}\n        value={selected ? String(selected) : ''}\n        disabled={disabled}\n        required={required}\n        triggerRef={trigger}\n      />\n    </div>\n  );\n}\n"],"names":["Rate","value","defaultValue","onChange","count","allowHalf","allowClear","disabledProp","readOnly","size","color","colorByValue","colors","name","form","requiredProp","className","style","label","props","messages","useLeafConfig","field","useFormField","disabled","required","maximum","Math","Number","step","normalize","number","trigger","useRef","root","current","setCurrent","useFieldValue","selected","hovered","setHovered","useState","focused","setFocused","displayed","activeColor","undefined","values","Array","_","index","focusValue","choose","next","normalized","Boolean","classes","event","Star","target","FormValue","String"],"mappings":"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"}
+{"version":3,"file":"rate/rate.js","sources":["../../../../../src/rate/rate.tsx"],"sourcesContent":["import { Star } from 'lucide-react';\nimport { type HTMLAttributes, useRef, useState } from 'react';\nimport { useComponentProps } from '../config-provider/component-defaults';\nimport { useLeafConfig } from '../config-provider/context';\nimport { useFormField } from '../form/form';\nimport { classes } from '../shared/classes';\nimport { FormValue, useFieldValue } from '../shared/field';\nimport type { ControlSize } from '../shared/types';\n\nexport interface RateProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange' | 'defaultValue'> {\n  value?: number;\n  defaultValue?: number;\n  onChange?: (value: number) => void;\n  count?: number;\n  allowHalf?: boolean;\n  allowClear?: boolean;\n  disabled?: boolean;\n  readOnly?: boolean;\n  size?: ControlSize;\n  color?: string;\n  colorByValue?: boolean;\n  colors?: readonly [string, string, string];\n  name?: string;\n  form?: string;\n  required?: boolean;\n}\nexport function Rate(rawProps: RateProps) {\n  const {\n    value,\n    defaultValue = 0,\n    onChange,\n    count = 5,\n    allowHalf = false,\n    allowClear = true,\n    disabled: disabledProp,\n    readOnly = false,\n    size = 'md',\n    color,\n    colorByValue = false,\n    colors = ['#ef5350', '#f49b23', '#ffc53d'],\n    name,\n    form,\n    required: requiredProp,\n    className,\n    style,\n    'aria-label': label,\n    ...props\n  } = useComponentProps('Rate', rawProps);\n  const { messages } = useLeafConfig();\n  const field = useFormField();\n  const disabled = disabledProp || field?.disabled;\n  const required = requiredProp ?? field?.required;\n  const maximum = Math.max(1, Math.min(20, Number.isFinite(count) ? Math.floor(count) : 5));\n  const step = allowHalf ? 0.5 : 1;\n  const normalize = (number: number) =>\n    Math.min(maximum, Math.max(0, Number.isFinite(number) ? Math.round(number / step) * step : 0));\n  const trigger = useRef<HTMLButtonElement>(null);\n  const root = useRef<HTMLDivElement>(null);\n  const [current, setCurrent] = useFieldValue(value, defaultValue, trigger, form);\n  const selected = normalize(current);\n  const [hovered, setHovered] = useState<number>();\n  const [focused, setFocused] = useState<number>();\n  const displayed = disabled || readOnly ? selected : (hovered ?? selected);\n  const activeColor =\n    color ??\n    (colorByValue\n      ? colors[displayed / maximum <= 0.4 ? 0 : displayed / maximum <= 0.7 ? 1 : 2]\n      : undefined);\n  const values = Array.from({ length: maximum / step }, (_, index) => (index + 1) * step);\n  const focusValue = values.includes(focused ?? 0) ? focused : selected || step;\n  const choose = (next: number) => {\n    if (disabled || readOnly) return;\n    const normalized = normalize(next);\n    setCurrent(normalized);\n    if (normalized !== selected) onChange?.(normalized);\n  };\n  return (\n    <div\n      {...props}\n      id={props.id ?? field?.id}\n      ref={root}\n      role=\"radiogroup\"\n      aria-label={label ?? (field?.labelId ? undefined : messages.rate.label)}\n      aria-labelledby={props['aria-labelledby'] ?? field?.labelId}\n      aria-disabled={disabled || undefined}\n      aria-readonly={readOnly || undefined}\n      aria-required={required || undefined}\n      aria-describedby={\n        [props['aria-describedby'], field?.descriptionId].filter(Boolean).join(' ') || undefined\n      }\n      className={classes('leaf-rate', `leaf-rate--${size}`, className)}\n      style={{ ...(activeColor ? { '--leaf-rate-color': activeColor } : {}), ...style }}\n      onPointerLeave={() => setHovered(undefined)}\n      onBlur={(event) => {\n        props.onBlur?.(event);\n        if (!event.currentTarget.contains(event.relatedTarget)) setFocused(undefined);\n      }}\n    >\n      {Array.from({ length: maximum }, (_, index) => (\n        // biome-ignore lint/suspicious/noArrayIndexKey: Each star has a fixed numeric position in the rating scale.\n        <span className=\"leaf-rate__star\" key={`star-${index}`}>\n          <Star className=\"leaf-rate__empty\" aria-hidden=\"true\" />\n          <span\n            className=\"leaf-rate__fill\"\n            aria-hidden=\"true\"\n            style={{ width: `${Math.max(0, Math.min(1, displayed - index)) * 100}%` }}\n          >\n            <Star />\n          </span>\n          {(allowHalf ? [index + 0.5, index + 1] : [index + 1]).map((number) => (\n            // biome-ignore lint/a11y/useSemanticElements: Custom rating radios support half values, clearing and read-only state with one roving tab stop.\n            <button\n              type=\"button\"\n              key={number}\n              ref={number === step ? trigger : undefined}\n              role=\"radio\"\n              aria-checked={number === selected}\n              aria-label={`${number} / ${maximum}`}\n              disabled={disabled}\n              aria-disabled={readOnly || undefined}\n              className=\"leaf-rate__option\"\n              tabIndex={number === focusValue ? 0 : -1}\n              onFocus={() => setFocused(number)}\n              onPointerEnter={() => {\n                if (!disabled && !readOnly) setHovered(number);\n              }}\n              onClick={() => choose(allowClear && number === selected ? 0 : number)}\n              onKeyDown={(event) => {\n                if (disabled || readOnly) return;\n                let next: number | undefined;\n                if (event.key === 'Home') next = step;\n                else if (event.key === 'End') next = maximum;\n                else if (['ArrowRight', 'ArrowUp', 'ArrowLeft', 'ArrowDown'].includes(event.key))\n                  next = Math.max(\n                    step,\n                    Math.min(\n                      maximum,\n                      number + (['ArrowRight', 'ArrowUp'].includes(event.key) ? step : -step),\n                    ),\n                  );\n                else if ((event.key === 'Delete' || event.key === 'Backspace') && allowClear)\n                  next = 0;\n                if (next !== undefined) {\n                  event.preventDefault();\n                  choose(next);\n                  setHovered(undefined);\n                  const target = root.current?.querySelector<HTMLButtonElement>(\n                    `[aria-label='${next || step} / ${maximum}']`,\n                  );\n                  target?.focus();\n                }\n              }}\n            />\n          ))}\n        </span>\n      ))}\n      <FormValue\n        name={name}\n        form={form}\n        value={selected ? String(selected) : ''}\n        disabled={disabled}\n        required={required}\n        triggerRef={trigger}\n      />\n    </div>\n  );\n}\n"],"names":["Rate","rawProps","value","defaultValue","onChange","count","allowHalf","allowClear","disabledProp","readOnly","size","color","colorByValue","colors","name","form","requiredProp","className","style","label","props","useComponentProps","messages","useLeafConfig","field","useFormField","disabled","required","maximum","Math","Number","step","normalize","number","trigger","useRef","root","current","setCurrent","useFieldValue","selected","hovered","setHovered","useState","focused","setFocused","displayed","activeColor","undefined","values","Array","_","index","focusValue","choose","next","normalized","Boolean","classes","event","Star","target","FormValue","String"],"mappings":"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"}

package/dist/esm/browser/modules/result/result.js

@@ -1,8 +1,10 @@
 "use client";
+import '../../../styles/foundation.css';
 import '../../../styles/components/result.css';
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Check, Inbox, Info, TriangleAlert, X } from "lucide-react";
 import { useRef } from "react";
+import { useComponentProps } from "../config-provider/component-defaults.js";
 import { useLeafConfig } from "../config-provider/context.js";
 import { classes } from "../shared/classes.js";
 import { useContentTransition } from "../shared/presence.js";
@@ -13,12 +15,12 @@ const icons = {
     error: X,
     info: Info
 };
-function Result({ status = 'empty', title, description, icon, extra, size = 'md', children, className, ...props }) {
+function ResultControl({ status = 'empty', title, description, icon, extra, size = 'md', children, className, ...props }) {
     const { messages } = useLeafConfig();
     const root = useRef(null);
     useContentTransition(root, status);
     const Icon = icons[status];
-    const heading = void 0 !== title ? title : 'empty' === status ? messages.noData : messages['success' === status ? 'resultSuccess' : 'warning' === status ? 'resultWarning' : 'error' === status ? 'resultError' : 'resultInfo'];
+    const heading = void 0 !== title ? title : 'empty' === status ? messages.common.noData : messages.result['success' === status ? 'success' : 'warning' === status ? 'warning' : 'error' === status ? 'error' : 'info'];
     return /*#__PURE__*/ jsxs("div", {
         ...props,
         ref: root,
@@ -48,6 +50,12 @@ function Result({ status = 'empty', title, description, icon, extra, size = 'md'
         ]
     });
 }
-export { Result };
+function Result(rawProps) {
+    const props = useComponentProps('Result', rawProps);
+    return /*#__PURE__*/ jsx(ResultControl, {
+        ...props
+    });
+}
+export { Result, ResultControl };
 
 //# sourceMappingURL=result.js.map

package/dist/esm/browser/modules/result/result.js.map

@@ -1 +1 @@
-{"version":3,"file":"result/result.js","sources":["../../../../../src/result/result.tsx"],"sourcesContent":["import { Check, Inbox, Info, TriangleAlert, X } from 'lucide-react';\nimport { type HTMLAttributes, type ReactNode, useRef } from 'react';\nimport { useLeafConfig } from '../config-provider/context';\nimport { classes } from '../shared/classes';\nimport { useContentTransition } from '../shared/presence';\n\nexport interface ResultProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {\n  status?: 'empty' | 'success' | 'warning' | 'error' | 'info';\n  title?: ReactNode;\n  description?: ReactNode;\n  icon?: ReactNode;\n  extra?: ReactNode;\n  size?: 'sm' | 'md';\n}\nconst icons = {\n  empty: Inbox,\n  success: Check,\n  warning: TriangleAlert,\n  error: X,\n  info: Info,\n};\nexport function Result({\n  status = 'empty',\n  title,\n  description,\n  icon,\n  extra,\n  size = 'md',\n  children,\n  className,\n  ...props\n}: ResultProps) {\n  const { messages } = useLeafConfig();\n  const root = useRef<HTMLDivElement>(null);\n  useContentTransition(root, status);\n  const Icon = icons[status];\n  const heading =\n    title !== undefined\n      ? title\n      : status === 'empty'\n        ? messages.noData\n        : messages[\n            status === 'success'\n              ? 'resultSuccess'\n              : status === 'warning'\n                ? 'resultWarning'\n                : status === 'error'\n                  ? 'resultError'\n                  : 'resultInfo'\n          ];\n  return (\n    <div\n      {...props}\n      ref={root}\n      className={classes(\n        'leaf-result',\n        `leaf-result--${status}`,\n        `leaf-result--${size}`,\n        className,\n      )}\n    >\n      {icon !== null && (\n        <div className=\"leaf-result__icon\" aria-hidden=\"true\" key={status}>\n          {icon ?? <Icon />}\n        </div>\n      )}\n      {heading !== null && <div className=\"leaf-result__title\">{heading}</div>}\n      {description != null && <div className=\"leaf-result__description\">{description}</div>}\n      {children != null && <div className=\"leaf-result__content\">{children}</div>}\n      {extra != null && <div className=\"leaf-result__extra\">{extra}</div>}\n    </div>\n  );\n}\n"],"names":["icons","Inbox","Check","TriangleAlert","X","Info","Result","status","title","description","icon","extra","size","children","className","props","messages","useLeafConfig","root","useRef","useContentTransition","Icon","heading","undefined","classes"],"mappings":";;;;;;;;AAcA,MAAMA,QAAQ;IACZ,OAAOC;IACP,SAASC;IACT,SAASC;IACT,OAAOC;IACP,MAAMC;AACR;AACO,SAASC,OAAO,EACrBC,SAAS,OAAO,EAChBC,KAAK,EACLC,WAAW,EACXC,IAAI,EACJC,KAAK,EACLC,OAAO,IAAI,EACXC,QAAQ,EACRC,SAAS,EACT,GAAGC,OACS;IACZ,MAAM,EAAEC,QAAQ,EAAE,GAAGC;IACrB,MAAMC,OAAOC,OAAuB;IACpCC,qBAAqBF,MAAMX;IAC3B,MAAMc,OAAOrB,KAAK,CAACO,OAAO;IAC1B,MAAMe,UACJd,AAAUe,WAAVf,QACIA,QACAD,AAAW,YAAXA,SACES,SAAS,MAAM,GACfA,QAAQ,CACNT,AAAW,cAAXA,SACI,kBACAA,AAAW,cAAXA,SACE,kBACAA,AAAW,YAAXA,SACE,gBACA,aACT;IACT,OAAO,WAAP,GACE,KAAC;QACE,GAAGQ,KAAK;QACT,KAAKG;QACL,WAAWM,QACT,eACA,CAAC,aAAa,EAAEjB,QAAQ,EACxB,CAAC,aAAa,EAAEK,MAAM,EACtBE;;YAGQ,SAATJ,QAAiB,WAAR,GACR,IAAC;gBAAI,WAAU;gBAAoB,eAAY;0BAC5CA,QAAQ,WAARA,GAAQ,IAACW,MAAAA,CAAAA;eAD+Cd;YAIhD,SAAZe,WAAoB,WAAR,GAAQ,IAAC;gBAAI,WAAU;0BAAsBA;;YAC1C,QAAfb,eAAuB,WAAR,GAAQ,IAAC;gBAAI,WAAU;0BAA4BA;;YACtD,QAAZI,YAAoB,WAAR,GAAQ,IAAC;gBAAI,WAAU;0BAAwBA;;YAClD,QAATF,SAAiB,WAAR,GAAQ,IAAC;gBAAI,WAAU;0BAAsBA;;;;AAG7D"}
+{"version":3,"file":"result/result.js","sources":["../../../../../src/result/result.tsx"],"sourcesContent":["import { Check, Inbox, Info, TriangleAlert, X } from 'lucide-react';\nimport { type HTMLAttributes, type ReactNode, useRef } from 'react';\nimport { useComponentProps } from '../config-provider/component-defaults';\nimport { useLeafConfig } from '../config-provider/context';\nimport { classes } from '../shared/classes';\nimport { useContentTransition } from '../shared/presence';\n\nexport interface ResultProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {\n  status?: 'empty' | 'success' | 'warning' | 'error' | 'info';\n  title?: ReactNode;\n  description?: ReactNode;\n  icon?: ReactNode;\n  extra?: ReactNode;\n  size?: 'sm' | 'md';\n}\nconst icons = {\n  empty: Inbox,\n  success: Check,\n  warning: TriangleAlert,\n  error: X,\n  info: Info,\n};\nexport function ResultControl({\n  status = 'empty',\n  title,\n  description,\n  icon,\n  extra,\n  size = 'md',\n  children,\n  className,\n  ...props\n}: ResultProps) {\n  const { messages } = useLeafConfig();\n  const root = useRef<HTMLDivElement>(null);\n  useContentTransition(root, status);\n  const Icon = icons[status];\n  const heading =\n    title !== undefined\n      ? title\n      : status === 'empty'\n        ? messages.common.noData\n        : messages.result[\n            status === 'success'\n              ? 'success'\n              : status === 'warning'\n                ? 'warning'\n                : status === 'error'\n                  ? 'error'\n                  : 'info'\n          ];\n  return (\n    <div\n      {...props}\n      ref={root}\n      className={classes(\n        'leaf-result',\n        `leaf-result--${status}`,\n        `leaf-result--${size}`,\n        className,\n      )}\n    >\n      {icon !== null && (\n        <div className=\"leaf-result__icon\" aria-hidden=\"true\" key={status}>\n          {icon ?? <Icon />}\n        </div>\n      )}\n      {heading !== null && <div className=\"leaf-result__title\">{heading}</div>}\n      {description != null && <div className=\"leaf-result__description\">{description}</div>}\n      {children != null && <div className=\"leaf-result__content\">{children}</div>}\n      {extra != null && <div className=\"leaf-result__extra\">{extra}</div>}\n    </div>\n  );\n}\n\nexport function Result(rawProps: ResultProps) {\n  const props = useComponentProps('Result', rawProps);\n  return <ResultControl {...props} />;\n}\n"],"names":["icons","Inbox","Check","TriangleAlert","X","Info","ResultControl","status","title","description","icon","extra","size","children","className","props","messages","useLeafConfig","root","useRef","useContentTransition","Icon","heading","undefined","classes","Result","rawProps","useComponentProps"],"mappings":";;;;;;;;;;AAeA,MAAMA,QAAQ;IACZ,OAAOC;IACP,SAASC;IACT,SAASC;IACT,OAAOC;IACP,MAAMC;AACR;AACO,SAASC,cAAc,EAC5BC,SAAS,OAAO,EAChBC,KAAK,EACLC,WAAW,EACXC,IAAI,EACJC,KAAK,EACLC,OAAO,IAAI,EACXC,QAAQ,EACRC,SAAS,EACT,GAAGC,OACS;IACZ,MAAM,EAAEC,QAAQ,EAAE,GAAGC;IACrB,MAAMC,OAAOC,OAAuB;IACpCC,qBAAqBF,MAAMX;IAC3B,MAAMc,OAAOrB,KAAK,CAACO,OAAO;IAC1B,MAAMe,UACJd,AAAUe,WAAVf,QACIA,QACAD,AAAW,YAAXA,SACES,SAAS,MAAM,CAAC,MAAM,GACtBA,SAAS,MAAM,CACbT,AAAW,cAAXA,SACI,YACAA,AAAW,cAAXA,SACE,YACAA,AAAW,YAAXA,SACE,UACA,OACT;IACT,OAAO,WAAP,GACE,KAAC;QACE,GAAGQ,KAAK;QACT,KAAKG;QACL,WAAWM,QACT,eACA,CAAC,aAAa,EAAEjB,QAAQ,EACxB,CAAC,aAAa,EAAEK,MAAM,EACtBE;;YAGQ,SAATJ,QAAiB,WAAR,GACR,IAAC;gBAAI,WAAU;gBAAoB,eAAY;0BAC5CA,QAAQ,WAARA,GAAQ,IAACW,MAAAA,CAAAA;eAD+Cd;YAIhD,SAAZe,WAAoB,WAAR,GAAQ,IAAC;gBAAI,WAAU;0BAAsBA;;YAC1C,QAAfb,eAAuB,WAAR,GAAQ,IAAC;gBAAI,WAAU;0BAA4BA;;YACtD,QAAZI,YAAoB,WAAR,GAAQ,IAAC;gBAAI,WAAU;0BAAwBA;;YAClD,QAATF,SAAiB,WAAR,GAAQ,IAAC;gBAAI,WAAU;0BAAsBA;;;;AAG7D;AAEO,SAASc,OAAOC,QAAqB;IAC1C,MAAMX,QAAQY,kBAAkB,UAAUD;IAC1C,OAAO,WAAP,GAAO,IAACpB,eAAaA;QAAE,GAAGS,KAAK;;AACjC"}

package/dist/esm/browser/modules/scrollarea/scrollarea.js

@@ -1,11 +1,14 @@
 "use client";
+import '../../../styles/foundation.css';
 import '../../../styles/components/scrollarea.css';
 import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
-import { Scrollbar } from "../scrollbar/index.js";
+import { useComponentProps } from "../config-provider/component-defaults.js";
+import { ScrollbarControl } from "../scrollbar/scrollbar.js";
 import { classes } from "../shared/classes.js";
-const scrollarea_ScrollArea = /*#__PURE__*/ forwardRef(function({ orientation = 'vertical', className, ...props }, ref) {
-    return /*#__PURE__*/ jsx(Scrollbar, {
+const scrollarea_ScrollArea = /*#__PURE__*/ forwardRef(function(rawProps, ref) {
+    const { orientation = 'vertical', className, ...props } = useComponentProps('ScrollArea', rawProps);
+    return /*#__PURE__*/ jsx(ScrollbarControl, {
         ...props,
         ref: ref,
         orientation: orientation,

package/dist/esm/browser/modules/scrollarea/scrollarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"scrollarea/scrollarea.js","sources":["../../../../../src/scrollarea/scrollarea.tsx"],"sourcesContent":["import { forwardRef } from 'react';\nimport { Scrollbar, type ScrollbarProps } from '../scrollbar';\nimport { classes } from '../shared/classes';\nexport interface ScrollAreaProps extends ScrollbarProps {}\nexport const ScrollArea = forwardRef<HTMLDivElement, ScrollAreaProps>(function ScrollArea(\n  { orientation = 'vertical', className, ...props },\n  ref,\n) {\n  return (\n    <Scrollbar\n      {...props}\n      ref={ref}\n      orientation={orientation}\n      className={classes('leaf-scroll-area', className)}\n    />\n  );\n});\n"],"names":["ScrollArea","forwardRef","orientation","className","props","ref","Scrollbar","classes"],"mappings":";;;;;;AAIO,MAAMA,wBAAa,WAAHA,GAAGC,WAA4C,SACpE,EAAEC,cAAc,UAAU,EAAEC,SAAS,EAAE,GAAGC,OAAO,EACjDC,GAAG;IAEH,OAAO,WAAP,GACE,IAACC,WAASA;QACP,GAAGF,KAAK;QACT,KAAKC;QACL,aAAaH;QACb,WAAWK,QAAQ,oBAAoBJ;;AAG7C"}
+{"version":3,"file":"scrollarea/scrollarea.js","sources":["../../../../../src/scrollarea/scrollarea.tsx"],"sourcesContent":["import { forwardRef } from 'react';\nimport { useComponentProps } from '../config-provider/component-defaults';\nimport type { ScrollbarProps } from '../scrollbar';\nimport { ScrollbarControl as Scrollbar } from '../scrollbar/scrollbar';\nimport { classes } from '../shared/classes';\nexport interface ScrollAreaProps extends ScrollbarProps {}\nexport const ScrollArea = forwardRef<HTMLDivElement, ScrollAreaProps>(function ScrollArea(\n  rawProps: ScrollAreaProps,\n  ref,\n) {\n  const {\n    orientation = 'vertical',\n    className,\n    ...props\n  } = useComponentProps('ScrollArea', rawProps);\n  return (\n    <Scrollbar\n      {...props}\n      ref={ref}\n      orientation={orientation}\n      className={classes('leaf-scroll-area', className)}\n    />\n  );\n});\n"],"names":["ScrollArea","forwardRef","rawProps","ref","orientation","className","props","useComponentProps","Scrollbar","classes"],"mappings":";;;;;;;;AAMO,MAAMA,wBAAa,WAAHA,GAAGC,WAA4C,SACpEC,QAAyB,EACzBC,GAAG;IAEH,MAAM,EACJC,cAAc,UAAU,EACxBC,SAAS,EACT,GAAGC,OACJ,GAAGC,kBAAkB,cAAcL;IACpC,OAAO,WAAP,GACE,IAACM,kBAASA;QACP,GAAGF,KAAK;QACT,KAAKH;QACL,aAAaC;QACb,WAAWK,QAAQ,oBAAoBJ;;AAG7C"}

package/dist/esm/browser/modules/scrollbar/scrollbar.js

@@ -1,7 +1,9 @@
 "use client";
+import '../../../styles/foundation.css';
 import '../../../styles/components/scrollbar.css';
 import { jsx, jsxs } from "react/jsx-runtime";
 import { forwardRef, useCallback, useEffect, useId, useRef, useState } from "react";
+import { useComponentProps } from "../config-provider/component-defaults.js";
 import { classes } from "../shared/classes.js";
 import { useMergedRef } from "../shared/field.js";
 import { useText } from "../shared/use-text.js";
@@ -14,7 +16,7 @@ const initialGeometry = {
     top: 0,
     rtl: false
 };
-const scrollbar_Scrollbar = /*#__PURE__*/ forwardRef(function({ height, maxHeight, orientation = 'both', scrollbar = 'auto', viewportClassName, viewportStyle, contentClassName, contentStyle, verticalOffset = 0, className, style, children, tabIndex = 0, onScroll, id: providedId, role = 'region', 'aria-label': label, 'aria-labelledby': labelledBy, 'aria-describedby': describedBy, ...props }, forwarded) {
+const scrollbar_ScrollbarControl = /*#__PURE__*/ forwardRef(function({ height, maxHeight, orientation = 'both', scrollbar = 'auto', viewportClassName, viewportStyle, contentClassName, contentStyle, verticalOffset = 0, className, style, children, tabIndex = 0, onScroll, id: providedId, role = 'region', 'aria-label': label, 'aria-labelledby': labelledBy, 'aria-describedby': describedBy, ...props }, forwarded) {
     const viewport = useRef(null);
     const content = useRef(null);
     const ref = useMergedRef(viewport, forwarded);
@@ -129,7 +131,7 @@ const scrollbar_Scrollbar = /*#__PURE__*/ forwardRef(function({ height, maxHeigh
                     role: "scrollbar",
                     tabIndex: maximum ? 0 : -1,
                     className: "leaf-scrollbar__control",
-                    "aria-label": vertical ? t('纵向滚动条', 'Vertical scrollbar') : t('横向滚动条', 'Horizontal scrollbar'),
+                    "aria-label": vertical ? t('scrollbar.verticalScrollbar') : t('scrollbar.horizontalScrollbar'),
                     "aria-controls": id,
                     "aria-orientation": vertical ? 'vertical' : 'horizontal',
                     "aria-valuemin": 0,
@@ -238,6 +240,14 @@ const scrollbar_Scrollbar = /*#__PURE__*/ forwardRef(function({ height, maxHeigh
         ]
     });
 });
-export { scrollbar_Scrollbar as Scrollbar };
+const scrollbar_Scrollbar = /*#__PURE__*/ forwardRef(function(rawProps, ref) {
+    const props = useComponentProps('Scrollbar', rawProps);
+    return /*#__PURE__*/ jsx(scrollbar_ScrollbarControl, {
+        ...props,
+        ref: ref
+    });
+});
+scrollbar_Scrollbar.displayName = 'Scrollbar';
+export { scrollbar_Scrollbar as Scrollbar, scrollbar_ScrollbarControl as ScrollbarControl };
 
 //# sourceMappingURL=scrollbar.js.map

package/dist/esm/browser/modules/scrollbar/scrollbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"scrollbar/scrollbar.js","sources":["../../../../../src/scrollbar/scrollbar.tsx"],"sourcesContent":["import {\n  type CSSProperties,\n  forwardRef,\n  type HTMLAttributes,\n  useCallback,\n  useEffect,\n  useId,\n  useRef,\n  useState,\n} from 'react';\nimport { classes } from '../shared/classes';\nimport { useMergedRef } from '../shared/field';\nimport { useText } from '../shared/use-text';\n\nexport interface ScrollbarProps extends HTMLAttributes<HTMLDivElement> {\n  height?: CSSProperties['height'];\n  maxHeight?: CSSProperties['maxHeight'];\n  orientation?: 'vertical' | 'horizontal' | 'both';\n  scrollbar?: 'auto' | 'always' | 'hidden';\n  viewportClassName?: string;\n  viewportStyle?: CSSProperties;\n  contentClassName?: string;\n  contentStyle?: CSSProperties;\n  verticalOffset?: number;\n}\n\ninterface Geometry {\n  width: number;\n  height: number;\n  scrollWidth: number;\n  scrollHeight: number;\n  left: number;\n  top: number;\n  rtl: boolean;\n}\n\nconst initialGeometry: Geometry = {\n  width: 0,\n  height: 0,\n  scrollWidth: 0,\n  scrollHeight: 0,\n  left: 0,\n  top: 0,\n  rtl: false,\n};\n\nexport const Scrollbar = forwardRef<HTMLDivElement, ScrollbarProps>(function Scrollbar(\n  {\n    height,\n    maxHeight,\n    orientation = 'both',\n    scrollbar = 'auto',\n    viewportClassName,\n    viewportStyle,\n    contentClassName,\n    contentStyle,\n    verticalOffset = 0,\n    className,\n    style,\n    children,\n    tabIndex = 0,\n    onScroll,\n    id: providedId,\n    role = 'region',\n    'aria-label': label,\n    'aria-labelledby': labelledBy,\n    'aria-describedby': describedBy,\n    ...props\n  },\n  forwarded,\n) {\n  const viewport = useRef<HTMLDivElement>(null);\n  const content = useRef<HTMLDivElement>(null);\n  const ref = useMergedRef(viewport, forwarded);\n  const generatedId = useId();\n  const id = providedId ?? generatedId;\n  const t = useText();\n  const [geometry, setGeometry] = useState(initialGeometry);\n  const [scrolling, setScrolling] = useState(false);\n  const [dragging, setDragging] = useState(false);\n  const frame = useRef<number | undefined>(undefined);\n  const timeout = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);\n  const drag = useRef<{ pointerId: number; offset: number; vertical: boolean } | undefined>(\n    undefined,\n  );\n  const measure = useCallback(() => {\n    const element = viewport.current;\n    if (!element) return;\n    const next: Geometry = {\n      width: element.clientWidth,\n      height: element.clientHeight,\n      scrollWidth: element.scrollWidth,\n      scrollHeight: element.scrollHeight,\n      left: Math.abs(element.scrollLeft),\n      top: element.scrollTop,\n      rtl: getComputedStyle(element).direction === 'rtl',\n    };\n    setGeometry((previous) =>\n      Object.keys(next).every(\n        (key) => next[key as keyof Geometry] === previous[key as keyof Geometry],\n      )\n        ? previous\n        : next,\n    );\n  }, []);\n  const schedule = useCallback(() => {\n    if (frame.current !== undefined) return;\n    frame.current = requestAnimationFrame(() => {\n      frame.current = undefined;\n      measure();\n    });\n  }, [measure]);\n  useEffect(() => {\n    measure();\n    const observer =\n      typeof ResizeObserver === 'undefined' ? undefined : new ResizeObserver(measure);\n    if (viewport.current) observer?.observe(viewport.current);\n    if (content.current) observer?.observe(content.current);\n    const mutation =\n      typeof MutationObserver === 'undefined' ? undefined : new MutationObserver(schedule);\n    if (content.current)\n      mutation?.observe(content.current, {\n        childList: true,\n        subtree: true,\n        characterData: true,\n        attributes: true,\n      });\n    window.addEventListener('resize', schedule);\n    return () => {\n      observer?.disconnect();\n      mutation?.disconnect();\n      window.removeEventListener('resize', schedule);\n      if (frame.current !== undefined) cancelAnimationFrame(frame.current);\n      frame.current = undefined;\n      clearTimeout(timeout.current);\n    };\n  }, [measure, schedule]);\n\n  function setPosition(vertical: boolean, value: number) {\n    const element = viewport.current;\n    if (!element) return;\n    const maximum = vertical\n      ? element.scrollHeight - element.clientHeight\n      : element.scrollWidth - element.clientWidth;\n    const position = Math.min(Math.max(0, value), Math.max(0, maximum));\n    if (vertical) element.scrollTop = position;\n    else element.scrollLeft = geometry.rtl ? -position : position;\n    schedule();\n  }\n\n  const horizontalOverflow =\n    orientation !== 'vertical' && geometry.scrollWidth > geometry.width + 1;\n  const verticalOverflow =\n    orientation !== 'horizontal' && geometry.scrollHeight > geometry.height + 1;\n  const inset = Math.min(Math.max(0, verticalOffset), Math.max(0, geometry.height - 32));\n  const viewportAccessibility = {\n    role,\n    'aria-label': label,\n    'aria-labelledby': labelledBy,\n    'aria-describedby': describedBy,\n  };\n\n  function bar(vertical: boolean) {\n    const visibleSize = vertical ? geometry.height : geometry.width;\n    const contentSize = vertical ? geometry.scrollHeight : geometry.scrollWidth;\n    const offset = vertical ? inset : 0;\n    const crossOverflow = vertical ? horizontalOverflow : verticalOverflow;\n    const trackSize = Math.max(0, visibleSize - offset - 8 - (crossOverflow ? 8 : 0));\n    const thumbSize = Math.min(\n      trackSize,\n      Math.max(24, (trackSize * (visibleSize - offset)) / Math.max(1, contentSize - offset)),\n    );\n    const maximum = Math.max(0, contentSize - visibleSize);\n    const position = Math.min(maximum, Math.max(0, vertical ? geometry.top : geometry.left));\n    const thumbPosition = maximum ? (position / maximum) * (trackSize - thumbSize) : 0;\n    const logicalPosition =\n      !vertical && geometry.rtl ? trackSize - thumbSize - thumbPosition : thumbPosition;\n    return (\n      <div\n        key={vertical ? 'vertical' : 'horizontal'}\n        className={classes(\n          'leaf-scrollbar__bar',\n          vertical ? 'leaf-scrollbar__bar--vertical' : 'leaf-scrollbar__bar--horizontal',\n        )}\n        style={\n          vertical\n            ? { top: inset + 4, bottom: horizontalOverflow ? 12 : 4 }\n            : {\n                right: verticalOverflow && !geometry.rtl ? 12 : 4,\n                left: verticalOverflow && geometry.rtl ? 12 : 4,\n              }\n        }\n      >\n        <span\n          aria-hidden=\"true\"\n          className=\"leaf-scrollbar__thumb\"\n          style={\n            vertical\n              ? { height: thumbSize, transform: `translateY(${logicalPosition}px)` }\n              : { width: thumbSize, transform: `translateX(${logicalPosition}px)` }\n          }\n        />\n        <div\n          role=\"scrollbar\"\n          tabIndex={maximum ? 0 : -1}\n          className=\"leaf-scrollbar__control\"\n          aria-label={\n            vertical\n              ? t('纵向滚动条', 'Vertical scrollbar')\n              : t('横向滚动条', 'Horizontal scrollbar')\n          }\n          aria-controls={id}\n          aria-orientation={vertical ? 'vertical' : 'horizontal'}\n          aria-valuemin={0}\n          aria-valuemax={maximum}\n          aria-valuenow={position}\n          aria-disabled={!maximum || undefined}\n          onKeyDown={(event) => {\n            if (!maximum) return;\n            const current = viewport.current;\n            const position = current\n              ? vertical\n                ? current.scrollTop\n                : Math.abs(current.scrollLeft)\n              : 0;\n            let value: number | undefined;\n            if (event.key === 'Home') value = 0;\n            if (event.key === 'End') value = maximum;\n            if (event.key === 'PageDown') value = position + visibleSize;\n            if (event.key === 'PageUp') value = position - visibleSize;\n            if (event.key === 'ArrowDown') value = position + 40;\n            if (event.key === 'ArrowUp') value = position - 40;\n            if (event.key === 'ArrowRight') value = position + (geometry.rtl ? -40 : 40);\n            if (event.key === 'ArrowLeft') value = position + (geometry.rtl ? 40 : -40);\n            if (value === undefined) return;\n            event.preventDefault();\n            setPosition(vertical, value);\n          }}\n          onPointerDown={(event) => {\n            if (event.button !== 0 || !maximum) return;\n            event.preventDefault();\n            const rect = event.currentTarget.getBoundingClientRect();\n            const pointer = vertical ? event.clientY - rect.top : event.clientX - rect.left;\n            const onThumb = pointer >= logicalPosition && pointer <= logicalPosition + thumbSize;\n            drag.current = {\n              pointerId: event.pointerId,\n              vertical,\n              offset: onThumb ? pointer - logicalPosition : thumbSize / 2,\n            };\n            event.currentTarget.setPointerCapture?.(event.pointerId);\n            setDragging(true);\n            if (!onThumb) {\n              const next = Math.min(trackSize - thumbSize, Math.max(0, pointer - thumbSize / 2));\n              setPosition(\n                vertical,\n                ((!vertical && geometry.rtl ? trackSize - thumbSize - next : next) /\n                  Math.max(1, trackSize - thumbSize)) *\n                  maximum,\n              );\n            }\n          }}\n          onPointerMove={(event) => {\n            const active = drag.current;\n            if (!active || active.pointerId !== event.pointerId || active.vertical !== vertical)\n              return;\n            const rect = event.currentTarget.getBoundingClientRect();\n            const pointer = vertical ? event.clientY - rect.top : event.clientX - rect.left;\n            const next = Math.min(trackSize - thumbSize, Math.max(0, pointer - active.offset));\n            setPosition(\n              vertical,\n              ((!vertical && geometry.rtl ? trackSize - thumbSize - next : next) /\n                Math.max(1, trackSize - thumbSize)) *\n                maximum,\n            );\n          }}\n          onPointerUp={() => {\n            drag.current = undefined;\n            setDragging(false);\n          }}\n          onPointerCancel={() => {\n            drag.current = undefined;\n            setDragging(false);\n          }}\n          onLostPointerCapture={() => {\n            drag.current = undefined;\n            setDragging(false);\n          }}\n        />\n      </div>\n    );\n  }\n\n  return (\n    <div\n      {...props}\n      className={classes('leaf-scrollbar', className)}\n      data-scrollbar={scrollbar}\n      data-scrolling={scrolling || undefined}\n      data-dragging={dragging || undefined}\n      style={{ height, maxHeight, ...style }}\n    >\n      <div\n        ref={ref}\n        id={id}\n        tabIndex={tabIndex}\n        {...viewportAccessibility}\n        className={classes('leaf-scrollbar__viewport', viewportClassName)}\n        style={{\n          height: (style?.height ?? height) === undefined ? undefined : '100%',\n          overflowX: orientation === 'vertical' ? 'hidden' : 'auto',\n          overflowY: orientation === 'horizontal' ? 'hidden' : 'auto',\n          ...viewportStyle,\n        }}\n        onScroll={(event) => {\n          schedule();\n          setScrolling(true);\n          clearTimeout(timeout.current);\n          timeout.current = setTimeout(() => setScrolling(false), 700);\n          onScroll?.(event);\n        }}\n      >\n        <div\n          ref={content}\n          className={classes('leaf-scrollbar__content', contentClassName)}\n          style={contentStyle}\n        >\n          {children}\n        </div>\n      </div>\n      {scrollbar !== 'hidden' &&\n        (verticalOverflow || (scrollbar === 'always' && orientation !== 'horizontal')) &&\n        bar(true)}\n      {scrollbar !== 'hidden' &&\n        (horizontalOverflow || (scrollbar === 'always' && orientation !== 'vertical')) &&\n        bar(false)}\n    </div>\n  );\n});\n"],"names":["initialGeometry","Scrollbar","forwardRef","height","maxHeight","orientation","scrollbar","viewportClassName","viewportStyle","contentClassName","contentStyle","verticalOffset","className","style","children","tabIndex","onScroll","providedId","role","label","labelledBy","describedBy","props","forwarded","viewport","useRef","content","ref","useMergedRef","generatedId","useId","id","t","useText","geometry","setGeometry","useState","scrolling","setScrolling","dragging","setDragging","frame","undefined","timeout","drag","measure","useCallback","element","next","Math","getComputedStyle","previous","Object","key","schedule","requestAnimationFrame","useEffect","observer","ResizeObserver","mutation","MutationObserver","window","cancelAnimationFrame","clearTimeout","setPosition","vertical","value","maximum","position","horizontalOverflow","verticalOverflow","inset","viewportAccessibility","bar","visibleSize","contentSize","offset","crossOverflow","trackSize","thumbSize","thumbPosition","logicalPosition","classes","event","current","rect","pointer","onThumb","active","setTimeout"],"mappings":"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"}
+{"version":3,"file":"scrollbar/scrollbar.js","sources":["../../../../../src/scrollbar/scrollbar.tsx"],"sourcesContent":["import {\n  type CSSProperties,\n  forwardRef,\n  type HTMLAttributes,\n  useCallback,\n  useEffect,\n  useId,\n  useRef,\n  useState,\n} from 'react';\nimport { useComponentProps } from '../config-provider/component-defaults';\nimport { classes } from '../shared/classes';\nimport { useMergedRef } from '../shared/field';\nimport { useText } from '../shared/use-text';\n\nexport interface ScrollbarProps extends HTMLAttributes<HTMLDivElement> {\n  height?: CSSProperties['height'];\n  maxHeight?: CSSProperties['maxHeight'];\n  orientation?: 'vertical' | 'horizontal' | 'both';\n  scrollbar?: 'auto' | 'always' | 'hidden';\n  viewportClassName?: string;\n  viewportStyle?: CSSProperties;\n  contentClassName?: string;\n  contentStyle?: CSSProperties;\n  verticalOffset?: number;\n}\n\ninterface Geometry {\n  width: number;\n  height: number;\n  scrollWidth: number;\n  scrollHeight: number;\n  left: number;\n  top: number;\n  rtl: boolean;\n}\n\nconst initialGeometry: Geometry = {\n  width: 0,\n  height: 0,\n  scrollWidth: 0,\n  scrollHeight: 0,\n  left: 0,\n  top: 0,\n  rtl: false,\n};\n\nexport const ScrollbarControl = forwardRef<HTMLDivElement, ScrollbarProps>(\n  function ScrollbarControl(\n    {\n      height,\n      maxHeight,\n      orientation = 'both',\n      scrollbar = 'auto',\n      viewportClassName,\n      viewportStyle,\n      contentClassName,\n      contentStyle,\n      verticalOffset = 0,\n      className,\n      style,\n      children,\n      tabIndex = 0,\n      onScroll,\n      id: providedId,\n      role = 'region',\n      'aria-label': label,\n      'aria-labelledby': labelledBy,\n      'aria-describedby': describedBy,\n      ...props\n    }: ScrollbarProps,\n    forwarded,\n  ) {\n    const viewport = useRef<HTMLDivElement>(null);\n    const content = useRef<HTMLDivElement>(null);\n    const ref = useMergedRef(viewport, forwarded);\n    const generatedId = useId();\n    const id = providedId ?? generatedId;\n    const t = useText();\n    const [geometry, setGeometry] = useState(initialGeometry);\n    const [scrolling, setScrolling] = useState(false);\n    const [dragging, setDragging] = useState(false);\n    const frame = useRef<number | undefined>(undefined);\n    const timeout = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);\n    const drag = useRef<{ pointerId: number; offset: number; vertical: boolean } | undefined>(\n      undefined,\n    );\n    const measure = useCallback(() => {\n      const element = viewport.current;\n      if (!element) return;\n      const next: Geometry = {\n        width: element.clientWidth,\n        height: element.clientHeight,\n        scrollWidth: element.scrollWidth,\n        scrollHeight: element.scrollHeight,\n        left: Math.abs(element.scrollLeft),\n        top: element.scrollTop,\n        rtl: getComputedStyle(element).direction === 'rtl',\n      };\n      setGeometry((previous) =>\n        Object.keys(next).every(\n          (key) => next[key as keyof Geometry] === previous[key as keyof Geometry],\n        )\n          ? previous\n          : next,\n      );\n    }, []);\n    const schedule = useCallback(() => {\n      if (frame.current !== undefined) return;\n      frame.current = requestAnimationFrame(() => {\n        frame.current = undefined;\n        measure();\n      });\n    }, [measure]);\n    useEffect(() => {\n      measure();\n      const observer =\n        typeof ResizeObserver === 'undefined' ? undefined : new ResizeObserver(measure);\n      if (viewport.current) observer?.observe(viewport.current);\n      if (content.current) observer?.observe(content.current);\n      const mutation =\n        typeof MutationObserver === 'undefined' ? undefined : new MutationObserver(schedule);\n      if (content.current)\n        mutation?.observe(content.current, {\n          childList: true,\n          subtree: true,\n          characterData: true,\n          attributes: true,\n        });\n      window.addEventListener('resize', schedule);\n      return () => {\n        observer?.disconnect();\n        mutation?.disconnect();\n        window.removeEventListener('resize', schedule);\n        if (frame.current !== undefined) cancelAnimationFrame(frame.current);\n        frame.current = undefined;\n        clearTimeout(timeout.current);\n      };\n    }, [measure, schedule]);\n\n    function setPosition(vertical: boolean, value: number) {\n      const element = viewport.current;\n      if (!element) return;\n      const maximum = vertical\n        ? element.scrollHeight - element.clientHeight\n        : element.scrollWidth - element.clientWidth;\n      const position = Math.min(Math.max(0, value), Math.max(0, maximum));\n      if (vertical) element.scrollTop = position;\n      else element.scrollLeft = geometry.rtl ? -position : position;\n      schedule();\n    }\n\n    const horizontalOverflow =\n      orientation !== 'vertical' && geometry.scrollWidth > geometry.width + 1;\n    const verticalOverflow =\n      orientation !== 'horizontal' && geometry.scrollHeight > geometry.height + 1;\n    const inset = Math.min(Math.max(0, verticalOffset), Math.max(0, geometry.height - 32));\n    const viewportAccessibility = {\n      role,\n      'aria-label': label,\n      'aria-labelledby': labelledBy,\n      'aria-describedby': describedBy,\n    };\n\n    function bar(vertical: boolean) {\n      const visibleSize = vertical ? geometry.height : geometry.width;\n      const contentSize = vertical ? geometry.scrollHeight : geometry.scrollWidth;\n      const offset = vertical ? inset : 0;\n      const crossOverflow = vertical ? horizontalOverflow : verticalOverflow;\n      const trackSize = Math.max(0, visibleSize - offset - 8 - (crossOverflow ? 8 : 0));\n      const thumbSize = Math.min(\n        trackSize,\n        Math.max(24, (trackSize * (visibleSize - offset)) / Math.max(1, contentSize - offset)),\n      );\n      const maximum = Math.max(0, contentSize - visibleSize);\n      const position = Math.min(maximum, Math.max(0, vertical ? geometry.top : geometry.left));\n      const thumbPosition = maximum ? (position / maximum) * (trackSize - thumbSize) : 0;\n      const logicalPosition =\n        !vertical && geometry.rtl ? trackSize - thumbSize - thumbPosition : thumbPosition;\n      return (\n        <div\n          key={vertical ? 'vertical' : 'horizontal'}\n          className={classes(\n            'leaf-scrollbar__bar',\n            vertical ? 'leaf-scrollbar__bar--vertical' : 'leaf-scrollbar__bar--horizontal',\n          )}\n          style={\n            vertical\n              ? { top: inset + 4, bottom: horizontalOverflow ? 12 : 4 }\n              : {\n                  right: verticalOverflow && !geometry.rtl ? 12 : 4,\n                  left: verticalOverflow && geometry.rtl ? 12 : 4,\n                }\n          }\n        >\n          <span\n            aria-hidden=\"true\"\n            className=\"leaf-scrollbar__thumb\"\n            style={\n              vertical\n                ? { height: thumbSize, transform: `translateY(${logicalPosition}px)` }\n                : { width: thumbSize, transform: `translateX(${logicalPosition}px)` }\n            }\n          />\n          <div\n            role=\"scrollbar\"\n            tabIndex={maximum ? 0 : -1}\n            className=\"leaf-scrollbar__control\"\n            aria-label={\n              vertical ? t('scrollbar.verticalScrollbar') : t('scrollbar.horizontalScrollbar')\n            }\n            aria-controls={id}\n            aria-orientation={vertical ? 'vertical' : 'horizontal'}\n            aria-valuemin={0}\n            aria-valuemax={maximum}\n            aria-valuenow={position}\n            aria-disabled={!maximum || undefined}\n            onKeyDown={(event) => {\n              if (!maximum) return;\n              const current = viewport.current;\n              const position = current\n                ? vertical\n                  ? current.scrollTop\n                  : Math.abs(current.scrollLeft)\n                : 0;\n              let value: number | undefined;\n              if (event.key === 'Home') value = 0;\n              if (event.key === 'End') value = maximum;\n              if (event.key === 'PageDown') value = position + visibleSize;\n              if (event.key === 'PageUp') value = position - visibleSize;\n              if (event.key === 'ArrowDown') value = position + 40;\n              if (event.key === 'ArrowUp') value = position - 40;\n              if (event.key === 'ArrowRight') value = position + (geometry.rtl ? -40 : 40);\n              if (event.key === 'ArrowLeft') value = position + (geometry.rtl ? 40 : -40);\n              if (value === undefined) return;\n              event.preventDefault();\n              setPosition(vertical, value);\n            }}\n            onPointerDown={(event) => {\n              if (event.button !== 0 || !maximum) return;\n              event.preventDefault();\n              const rect = event.currentTarget.getBoundingClientRect();\n              const pointer = vertical ? event.clientY - rect.top : event.clientX - rect.left;\n              const onThumb = pointer >= logicalPosition && pointer <= logicalPosition + thumbSize;\n              drag.current = {\n                pointerId: event.pointerId,\n                vertical,\n                offset: onThumb ? pointer - logicalPosition : thumbSize / 2,\n              };\n              event.currentTarget.setPointerCapture?.(event.pointerId);\n              setDragging(true);\n              if (!onThumb) {\n                const next = Math.min(trackSize - thumbSize, Math.max(0, pointer - thumbSize / 2));\n                setPosition(\n                  vertical,\n                  ((!vertical && geometry.rtl ? trackSize - thumbSize - next : next) /\n                    Math.max(1, trackSize - thumbSize)) *\n                    maximum,\n                );\n              }\n            }}\n            onPointerMove={(event) => {\n              const active = drag.current;\n              if (!active || active.pointerId !== event.pointerId || active.vertical !== vertical)\n                return;\n              const rect = event.currentTarget.getBoundingClientRect();\n              const pointer = vertical ? event.clientY - rect.top : event.clientX - rect.left;\n              const next = Math.min(trackSize - thumbSize, Math.max(0, pointer - active.offset));\n              setPosition(\n                vertical,\n                ((!vertical && geometry.rtl ? trackSize - thumbSize - next : next) /\n                  Math.max(1, trackSize - thumbSize)) *\n                  maximum,\n              );\n            }}\n            onPointerUp={() => {\n              drag.current = undefined;\n              setDragging(false);\n            }}\n            onPointerCancel={() => {\n              drag.current = undefined;\n              setDragging(false);\n            }}\n            onLostPointerCapture={() => {\n              drag.current = undefined;\n              setDragging(false);\n            }}\n          />\n        </div>\n      );\n    }\n\n    return (\n      <div\n        {...props}\n        className={classes('leaf-scrollbar', className)}\n        data-scrollbar={scrollbar}\n        data-scrolling={scrolling || undefined}\n        data-dragging={dragging || undefined}\n        style={{ height, maxHeight, ...style }}\n      >\n        <div\n          ref={ref}\n          id={id}\n          tabIndex={tabIndex}\n          {...viewportAccessibility}\n          className={classes('leaf-scrollbar__viewport', viewportClassName)}\n          style={{\n            height: (style?.height ?? height) === undefined ? undefined : '100%',\n            overflowX: orientation === 'vertical' ? 'hidden' : 'auto',\n            overflowY: orientation === 'horizontal' ? 'hidden' : 'auto',\n            ...viewportStyle,\n          }}\n          onScroll={(event) => {\n            schedule();\n            setScrolling(true);\n            clearTimeout(timeout.current);\n            timeout.current = setTimeout(() => setScrolling(false), 700);\n            onScroll?.(event);\n          }}\n        >\n          <div\n            ref={content}\n            className={classes('leaf-scrollbar__content', contentClassName)}\n            style={contentStyle}\n          >\n            {children}\n          </div>\n        </div>\n        {scrollbar !== 'hidden' &&\n          (verticalOverflow || (scrollbar === 'always' && orientation !== 'horizontal')) &&\n          bar(true)}\n        {scrollbar !== 'hidden' &&\n          (horizontalOverflow || (scrollbar === 'always' && orientation !== 'vertical')) &&\n          bar(false)}\n      </div>\n    );\n  },\n);\n\nexport const Scrollbar = forwardRef<HTMLDivElement, ScrollbarProps>(function Scrollbar(\n  rawProps: ScrollbarProps,\n  ref,\n) {\n  const props = useComponentProps('Scrollbar', rawProps);\n  return <ScrollbarControl {...props} ref={ref} />;\n});\nScrollbar.displayName = 'Scrollbar';\n"],"names":["initialGeometry","ScrollbarControl","forwardRef","height","maxHeight","orientation","scrollbar","viewportClassName","viewportStyle","contentClassName","contentStyle","verticalOffset","className","style","children","tabIndex","onScroll","providedId","role","label","labelledBy","describedBy","props","forwarded","viewport","useRef","content","ref","useMergedRef","generatedId","useId","id","t","useText","geometry","setGeometry","useState","scrolling","setScrolling","dragging","setDragging","frame","undefined","timeout","drag","measure","useCallback","element","next","Math","getComputedStyle","previous","Object","key","schedule","requestAnimationFrame","useEffect","observer","ResizeObserver","mutation","MutationObserver","window","cancelAnimationFrame","clearTimeout","setPosition","vertical","value","maximum","position","horizontalOverflow","verticalOverflow","inset","viewportAccessibility","bar","visibleSize","contentSize","offset","crossOverflow","trackSize","thumbSize","thumbPosition","logicalPosition","classes","event","current","rect","pointer","onThumb","active","setTimeout","Scrollbar","rawProps","useComponentProps"],"mappings":"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"}

package/dist/esm/browser/modules/segmented/segmented.js

@@ -1,13 +1,16 @@
 "use client";
+import '../../../styles/foundation.css';
 import '../../../styles/components/segmented.css';
 import { jsx, jsxs } from "react/jsx-runtime";
 import { forwardRef, useId, useRef } from "react";
+import { useComponentProps } from "../config-provider/component-defaults.js";
 import { useLeafConfig } from "../config-provider/context.js";
 import { useFormField } from "../form/form.js";
 import { classes } from "../shared/classes.js";
 import { FormValue, useFieldValue, useMergedRef } from "../shared/field.js";
 import { useMovingIndicator } from "../tabs/use-moving-indicator.js";
-const segmented_Segmented = /*#__PURE__*/ forwardRef(function({ options, value, defaultValue, onChange, disabled: disabledProp, size = 'md', block = false, name, form, className, ...props }, ref) {
+const segmented_Segmented = /*#__PURE__*/ forwardRef(function(rawProps, ref) {
+    const { options, value, defaultValue, onChange, disabled: disabledProp, size = 'md', block = false, name, form, className, ...props } = useComponentProps('Segmented', rawProps);
     const field = useFormField();
     const { direction } = useLeafConfig();
     const root = useRef(null);