@jinmi/ui 0.0.0-stage → 6.0.1

package/es/base-ui/Skeleton/style.mjs

@@ -0,0 +1,79 @@
+import { createStaticStyles, keyframes } from "antd-style";
+//#region src/base-ui/Skeleton/style.ts
+const sweep = keyframes`
+  0% {
+    translate: -100% 0;
+  }
+
+  100% {
+    translate: 100% 0;
+  }
+`;
+const fade = keyframes`
+  0%,
+  100% {
+    opacity: 1;
+  }
+
+  50% {
+    opacity: .5;
+  }
+`;
+const styles = createStaticStyles(({ css, cssVar }) => {
+	return {
+		avatar: css`
+      flex: none;
+    `,
+		base: css`
+      user-select: none;
+
+      position: relative;
+
+      overflow: hidden;
+
+      border-radius: ${cssVar.borderRadius};
+
+      background: ${cssVar.colorFillContent};
+
+      @media (prefers-reduced-motion: reduce) {
+        animation: none;
+
+        &::after {
+          display: none;
+        }
+      }
+    `,
+		fade: css`
+      will-change: opacity;
+      animation: ${fade} 1.6s ease-in-out infinite;
+    `,
+		sweep: css`
+      &::after {
+        pointer-events: none;
+        will-change: transform;
+        content: '';
+
+        position: absolute;
+        inset: 0;
+
+        background: linear-gradient(
+          90deg,
+          transparent 0%,
+          ${cssVar.colorFill} 50%,
+          transparent 100%
+        );
+
+        animation: ${sweep} 1.4s ease infinite;
+      }
+    `,
+		text: css`
+      display: flex;
+      flex-direction: column;
+      width: 100%;
+    `
+	};
+});
+//#endregion
+export { styles };
+
+//# sourceMappingURL=style.mjs.map

package/es/base-ui/Skeleton/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Skeleton/style.ts"],"sourcesContent":["import { createStaticStyles, keyframes } from 'antd-style';\r\n\r\nconst sweep = keyframes`\r\n  0% {\r\n    translate: -100% 0;\r\n  }\r\n\r\n  100% {\r\n    translate: 100% 0;\r\n  }\r\n`;\r\n\r\nconst fade = keyframes`\r\n  0%,\r\n  100% {\r\n    opacity: 1;\r\n  }\r\n\r\n  50% {\r\n    opacity: .5;\r\n  }\r\n`;\r\n\r\nexport const styles = createStaticStyles(({ css, cssVar }) => {\r\n  return {\r\n    avatar: css`\r\n      flex: none;\r\n    `,\r\n\r\n    base: css`\r\n      user-select: none;\r\n\r\n      position: relative;\r\n\r\n      overflow: hidden;\r\n\r\n      border-radius: ${cssVar.borderRadius};\r\n\r\n      background: ${cssVar.colorFillContent};\r\n\r\n      @media (prefers-reduced-motion: reduce) {\r\n        animation: none;\r\n\r\n        &::after {\r\n          display: none;\r\n        }\r\n      }\r\n    `,\r\n\r\n    fade: css`\r\n      will-change: opacity;\r\n      animation: ${fade} 1.6s ease-in-out infinite;\r\n    `,\r\n\r\n    sweep: css`\r\n      &::after {\r\n        pointer-events: none;\r\n        will-change: transform;\r\n        content: '';\r\n\r\n        position: absolute;\r\n        inset: 0;\r\n\r\n        background: linear-gradient(\r\n          90deg,\r\n          transparent 0%,\r\n          ${cssVar.colorFill} 50%,\r\n          transparent 100%\r\n        );\r\n\r\n        animation: ${sweep} 1.4s ease infinite;\r\n      }\r\n    `,\r\n\r\n    text: css`\r\n      display: flex;\r\n      flex-direction: column;\r\n      width: 100%;\r\n    `,\r\n  };\r\n});\r\n"],"mappings":";;AAEA,MAAM,QAAQ,SAAS;;;;;;;;;AAUvB,MAAM,OAAO,SAAS;;;;;;;;;;AAWtB,MAAa,SAAS,oBAAoB,EAAE,KAAK,aAAa;CAC5D,OAAO;EACL,QAAQ,GAAG;;;EAIX,MAAM,GAAG;;;;;;;uBAOU,OAAO,aAAa;;oBAEvB,OAAO,iBAAiB;;;;;;;;;;EAWxC,MAAM,GAAG;;mBAEM,KAAK;;EAGpB,OAAO,GAAG;;;;;;;;;;;;YAYF,OAAO,UAAU;;;;qBAIR,MAAM;;;EAIvB,MAAM,GAAG;;;;;CAKX;AACF,CAAC"}

package/es/base-ui/Skeleton/type.d.mts

@@ -0,0 +1,23 @@
+import { HTMLAttributes } from "react";
+//#region src/base-ui/Skeleton/type.d.ts
+type SkeletonAnimation = 'fade' | 'sweep';
+interface SkeletonProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
+  animated?: boolean | SkeletonAnimation;
+  height?: number | string;
+  radius?: number | string;
+  width?: number | string;
+}
+interface SkeletonTextProps extends Omit<SkeletonProps, 'width' | 'height'> {
+  fontSize?: number;
+  gap?: number;
+  lineHeight?: number;
+  rows?: number;
+  width?: number | string | (number | string)[];
+}
+interface SkeletonAvatarProps extends Omit<SkeletonProps, 'radius'> {
+  shape?: 'circle' | 'square';
+  size?: number | string;
+}
+//#endregion
+export { SkeletonAnimation, SkeletonAvatarProps, SkeletonProps, SkeletonTextProps };
+//# sourceMappingURL=type.d.mts.map

package/es/base-ui/Slider/Slider.d.mts

@@ -0,0 +1,6 @@
+import { SliderProps } from "./type.mjs";
+//#region src/base-ui/Slider/Slider.d.ts
+declare const Slider: import("react").NamedExoticComponent<SliderProps>;
+//#endregion
+export { Slider as default };
+//# sourceMappingURL=Slider.d.mts.map

package/es/base-ui/Slider/Slider.mjs

@@ -0,0 +1,34 @@
+"use client";
+import { styles } from "./style.mjs";
+import { memo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cx } from "antd-style";
+import { Slider } from "@base-ui/react/slider";
+//#region src/base-ui/Slider/Slider.tsx
+const Slider$1 = memo(({ className, classNames, styles: customStyles, style, onChange, onChangeComplete, ...rest }) => /* @__PURE__ */ jsx(Slider.Root, {
+	className: cx(styles.root, className),
+	style,
+	onValueChange: (value) => onChange?.(value),
+	onValueCommitted: (value) => onChangeComplete?.(value),
+	...rest,
+	children: /* @__PURE__ */ jsx(Slider.Control, {
+		className: cx(styles.control, classNames?.control),
+		style: customStyles?.control,
+		children: /* @__PURE__ */ jsxs(Slider.Track, {
+			className: cx(styles.track, classNames?.track),
+			style: customStyles?.track,
+			children: [/* @__PURE__ */ jsx(Slider.Indicator, {
+				className: cx(styles.indicator, classNames?.indicator),
+				style: customStyles?.indicator
+			}), /* @__PURE__ */ jsx(Slider.Thumb, {
+				className: cx(styles.thumb, classNames?.thumb),
+				style: customStyles?.thumb
+			})]
+		})
+	})
+}));
+Slider$1.displayName = "Slider";
+//#endregion
+export { Slider$1 as default };
+
+//# sourceMappingURL=Slider.mjs.map

package/es/base-ui/Slider/Slider.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slider.mjs","names":["Slider","BaseSlider"],"sources":["../../../src/base-ui/Slider/Slider.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { Slider as BaseSlider } from '@base-ui/react/slider';\r\nimport { cx } from 'antd-style';\r\nimport { memo } from 'react';\r\n\r\nimport { styles } from './style';\r\nimport type { SliderProps } from './type';\r\n\r\nconst Slider = memo<SliderProps>(\r\n  ({ className, classNames, styles: customStyles, style, onChange, onChangeComplete, ...rest }) => (\r\n    <BaseSlider.Root\r\n      className={cx(styles.root, className)}\r\n      style={style}\r\n      onValueChange={(value) => onChange?.(value as number)}\r\n      onValueCommitted={(value) => onChangeComplete?.(value as number)}\r\n      {...rest}\r\n    >\r\n      <BaseSlider.Control\r\n        className={cx(styles.control, classNames?.control)}\r\n        style={customStyles?.control}\r\n      >\r\n        <BaseSlider.Track\r\n          className={cx(styles.track, classNames?.track)}\r\n          style={customStyles?.track}\r\n        >\r\n          <BaseSlider.Indicator\r\n            className={cx(styles.indicator, classNames?.indicator)}\r\n            style={customStyles?.indicator}\r\n          />\r\n          <BaseSlider.Thumb\r\n            className={cx(styles.thumb, classNames?.thumb)}\r\n            style={customStyles?.thumb}\r\n          />\r\n        </BaseSlider.Track>\r\n      </BaseSlider.Control>\r\n    </BaseSlider.Root>\r\n  ),\r\n);\r\n\r\nSlider.displayName = 'Slider';\r\n\r\nexport default Slider;\r\n"],"mappings":";;;;;;;AASA,MAAMA,WAAS,MACZ,EAAE,WAAW,YAAY,QAAQ,cAAc,OAAO,UAAU,kBAAkB,GAAG,WACpF,oBAACC,OAAW,MAAZ;CACE,WAAW,GAAG,OAAO,MAAM,SAAS;CAC7B;CACP,gBAAgB,UAAU,WAAW,KAAe;CACpD,mBAAmB,UAAU,mBAAmB,KAAe;CAC/D,GAAI;CAEJ,UAAA,oBAACA,OAAW,SAAZ;EACE,WAAW,GAAG,OAAO,SAAS,YAAY,OAAO;EACjD,OAAO,cAAc;EAErB,UAAA,qBAACA,OAAW,OAAZ;GACE,WAAW,GAAG,OAAO,OAAO,YAAY,KAAK;GAC7C,OAAO,cAAc;GAFvB,UAAA,CAIE,oBAACA,OAAW,WAAZ;IACE,WAAW,GAAG,OAAO,WAAW,YAAY,SAAS;IACrD,OAAO,cAAc;GACtB,CAAA,GACD,oBAACA,OAAW,OAAZ;IACE,WAAW,GAAG,OAAO,OAAO,YAAY,KAAK;IAC7C,OAAO,cAAc;GACtB,CAAA,CACe;;CACA,CAAA;AACL,CAAA,CAErB;AAEA,SAAO,cAAc"}

package/es/base-ui/Slider/SliderWithInput.d.mts

@@ -0,0 +1,6 @@
+import { SliderWithInputProps } from "./type.mjs";
+//#region src/base-ui/Slider/SliderWithInput.d.ts
+declare const SliderWithInput: import("react").NamedExoticComponent<SliderWithInputProps>;
+//#endregion
+export { SliderWithInput as default };
+//# sourceMappingURL=SliderWithInput.d.mts.map

package/es/base-ui/Slider/SliderWithInput.mjs

@@ -0,0 +1,64 @@
+"use client";
+import FlexBasic_default from "../../Flex/FlexBasic.mjs";
+import InputNumber_default from "../Input/InputNumber.mjs";
+import Slider from "./Slider.mjs";
+import { memo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { isNull } from "es-toolkit/compat";
+//#region src/base-ui/Slider/SliderWithInput.tsx
+const SliderWithInput = memo(({ step, value, onChange, max, min, defaultValue, size, controls, gap = 16, style, className, classNames, styles: customStyles, disabled, unlimitedInput = false, changeOnWheel, shadow, variant, ...rest }) => {
+	const handleChange = (next) => {
+		if (isNull(next) || Number.isNaN(next)) return;
+		onChange?.(next);
+	};
+	const { slider: sliderClassName, input: inputClassName, ...sliderPartClassNames } = classNames || {};
+	const { slider: sliderStyle, input: inputStyle, ...sliderPartStyles } = customStyles || {};
+	return /* @__PURE__ */ jsxs(FlexBasic_default, {
+		horizontal: true,
+		align: "center",
+		className,
+		gap,
+		style,
+		children: [/* @__PURE__ */ jsx(Slider, {
+			className: sliderClassName,
+			classNames: sliderPartClassNames,
+			defaultValue,
+			disabled,
+			max,
+			min,
+			step,
+			style: {
+				flex: 1,
+				...sliderStyle
+			},
+			styles: sliderPartStyles,
+			value,
+			onChange: handleChange,
+			...rest
+		}), /* @__PURE__ */ jsx(InputNumber_default, {
+			changeOnWheel,
+			className: inputClassName,
+			controls: size !== "small" && controls !== false,
+			defaultValue,
+			disabled,
+			max: unlimitedInput ? void 0 : max,
+			min,
+			shadow,
+			size,
+			step: step === void 0 || Number.isNaN(step) ? void 0 : step,
+			value,
+			variant,
+			style: {
+				flex: "none",
+				width: size === "small" ? 48 : 88,
+				...inputStyle
+			},
+			onChange: handleChange
+		})]
+	});
+});
+SliderWithInput.displayName = "SliderWithInput";
+//#endregion
+export { SliderWithInput as default };
+
+//# sourceMappingURL=SliderWithInput.mjs.map

package/es/base-ui/Slider/SliderWithInput.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SliderWithInput.mjs","names":["Flexbox","InputNumber"],"sources":["../../../src/base-ui/Slider/SliderWithInput.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { isNull } from 'es-toolkit/compat';\r\nimport { memo } from 'react';\r\n\r\nimport { InputNumber } from '@/base-ui/Input';\r\nimport { Flexbox } from '@/Flex';\r\n\r\nimport Slider from './Slider';\r\nimport type { SliderWithInputProps } from './type';\r\n\r\nconst SliderWithInput = memo<SliderWithInputProps>(\r\n  ({\r\n    step,\r\n    value,\r\n    onChange,\r\n    max,\r\n    min,\r\n    defaultValue,\r\n    size,\r\n    controls,\r\n    gap = 16,\r\n    style,\r\n    className,\r\n    classNames,\r\n    styles: customStyles,\r\n    disabled,\r\n    unlimitedInput = false,\r\n    changeOnWheel,\r\n    shadow,\r\n    variant,\r\n    ...rest\r\n  }) => {\r\n    const handleChange = (next: number | null) => {\r\n      if (isNull(next) || Number.isNaN(next)) return;\r\n      onChange?.(next);\r\n    };\r\n\r\n    const {\r\n      slider: sliderClassName,\r\n      input: inputClassName,\r\n      ...sliderPartClassNames\r\n    } = classNames || {};\r\n    const { slider: sliderStyle, input: inputStyle, ...sliderPartStyles } = customStyles || {};\r\n\r\n    return (\r\n      <Flexbox horizontal align={'center'} className={className} gap={gap} style={style}>\r\n        <Slider\r\n          className={sliderClassName}\r\n          classNames={sliderPartClassNames}\r\n          defaultValue={defaultValue}\r\n          disabled={disabled}\r\n          max={max}\r\n          min={min}\r\n          step={step}\r\n          style={{ flex: 1, ...sliderStyle }}\r\n          styles={sliderPartStyles}\r\n          value={value}\r\n          onChange={handleChange}\r\n          {...rest}\r\n        />\r\n        <InputNumber\r\n          changeOnWheel={changeOnWheel}\r\n          className={inputClassName}\r\n          controls={size !== 'small' && controls !== false}\r\n          defaultValue={defaultValue}\r\n          disabled={disabled}\r\n          max={unlimitedInput ? undefined : max}\r\n          min={min}\r\n          shadow={shadow}\r\n          size={size}\r\n          step={step === undefined || Number.isNaN(step) ? undefined : step}\r\n          value={value}\r\n          variant={variant}\r\n          style={{\r\n            flex: 'none',\r\n            width: size === 'small' ? 48 : 88,\r\n            ...inputStyle,\r\n          }}\r\n          onChange={handleChange}\r\n        />\r\n      </Flexbox>\r\n    );\r\n  },\r\n);\r\n\r\nSliderWithInput.displayName = 'SliderWithInput';\r\n\r\nexport default SliderWithInput;\r\n"],"mappings":";;;;;;;;AAWA,MAAM,kBAAkB,MACrB,EACC,MACA,OACA,UACA,KACA,KACA,cACA,MACA,UACA,MAAM,IACN,OACA,WACA,YACA,QAAQ,cACR,UACA,iBAAiB,OACjB,eACA,QACA,SACA,GAAG,WACC;CACJ,MAAM,gBAAgB,SAAwB;EAC5C,IAAI,OAAO,IAAI,KAAK,OAAO,MAAM,IAAI,GAAG;EACxC,WAAW,IAAI;CACjB;CAEA,MAAM,EACJ,QAAQ,iBACR,OAAO,gBACP,GAAG,yBACD,cAAc,CAAC;CACnB,MAAM,EAAE,QAAQ,aAAa,OAAO,YAAY,GAAG,qBAAqB,gBAAgB,CAAC;CAEzF,OACE,qBAACA,mBAAD;EAAS,YAAA;EAAW,OAAO;EAAqB;EAAgB;EAAY;EAA5E,UAAA,CACE,oBAAC,QAAD;GACE,WAAW;GACX,YAAY;GACE;GACJ;GACL;GACA;GACC;GACN,OAAO;IAAE,MAAM;IAAG,GAAG;GAAY;GACjC,QAAQ;GACD;GACP,UAAU;GACV,GAAI;EACL,CAAA,GACD,oBAACC,qBAAD;GACiB;GACf,WAAW;GACX,UAAU,SAAS,WAAW,aAAa;GAC7B;GACJ;GACV,KAAK,iBAAiB,KAAA,IAAY;GAC7B;GACG;GACF;GACN,MAAM,SAAS,KAAA,KAAa,OAAO,MAAM,IAAI,IAAI,KAAA,IAAY;GACtD;GACE;GACT,OAAO;IACL,MAAM;IACN,OAAO,SAAS,UAAU,KAAK;IAC/B,GAAG;GACL;GACA,UAAU;EACX,CAAA,CACM;;AAEb,CACF;AAEA,gBAAgB,cAAc"}

package/es/base-ui/Slider/index.d.mts

@@ -0,0 +1,5 @@
+import { SliderProps, SliderWithInputProps } from "./type.mjs";
+import Slider from "./Slider.mjs";
+import SliderWithInput from "./SliderWithInput.mjs";
+import { styles } from "./style.mjs";
+export { Slider, type SliderProps, SliderWithInput, type SliderWithInputProps, styles as sliderStyles };

package/es/base-ui/Slider/style.d.mts

@@ -0,0 +1,11 @@
+//#region src/base-ui/Slider/style.d.ts
+declare const styles: {
+  control: string;
+  indicator: string;
+  root: string;
+  thumb: string;
+  track: string;
+};
+//#endregion
+export { styles };
+//# sourceMappingURL=style.d.mts.map

package/es/base-ui/Slider/style.mjs

@@ -0,0 +1,81 @@
+import { focusRing } from "../focusRing.mjs";
+import { createStaticStyles } from "antd-style";
+//#region src/base-ui/Slider/style.ts
+const styles = createStaticStyles(({ css, cssVar }) => ({
+	control: css`
+    display: flex;
+    align-items: center;
+    width: 100%;
+    height: 20px;
+  `,
+	indicator: css`
+    border-radius: inherit;
+    background: ${cssVar.colorPrimary};
+
+    [data-disabled] & {
+      background: ${cssVar.colorTextQuaternary};
+    }
+  `,
+	root: css`
+    display: flex;
+    align-items: center;
+    width: 100%;
+
+    &[data-disabled] {
+      cursor: not-allowed;
+    }
+  `,
+	thumb: css`
+    flex-shrink: 0;
+
+    width: 8px;
+    height: 16px;
+    border-radius: 100px;
+
+    background: ${cssVar.colorPrimary};
+    box-shadow: 0 0 0 1px ${cssVar.colorBgContainer};
+
+    transition: box-shadow 150ms ${cssVar.motionEaseOut};
+
+    &::before {
+      content: '';
+
+      position: absolute;
+      inset-block-start: 50%;
+      inset-inline-start: 50%;
+      translate: -50% -50%;
+
+      width: 24px;
+      height: 40px;
+    }
+
+    &:hover:not([data-disabled] *) {
+      box-shadow: 0 0 0 2px ${cssVar.colorPrimaryBorder};
+    }
+
+    ${focusRing};
+
+    [data-dragging] & {
+      box-shadow: 0 0 0 2px ${cssVar.colorPrimaryBorder};
+    }
+
+    [data-disabled] & {
+      background: ${cssVar.colorTextQuaternary};
+      box-shadow: 0 0 0 1px ${cssVar.colorBgContainer};
+    }
+
+    @media (prefers-reduced-motion: reduce) {
+      transition-duration: 0s;
+    }
+  `,
+	track: css`
+    width: 100%;
+    height: 4px;
+    border-radius: 100px;
+    background: ${cssVar.colorFillSecondary};
+  `
+}));
+//#endregion
+export { styles };
+
+//# sourceMappingURL=style.mjs.map

package/es/base-ui/Slider/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Slider/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\r\n\r\nimport { focusRing } from '@/base-ui/focusRing';\r\n\r\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\r\n  control: css`\r\n    display: flex;\r\n    align-items: center;\r\n    width: 100%;\r\n    height: 20px;\r\n  `,\r\n  indicator: css`\r\n    border-radius: inherit;\r\n    background: ${cssVar.colorPrimary};\r\n\r\n    [data-disabled] & {\r\n      background: ${cssVar.colorTextQuaternary};\r\n    }\r\n  `,\r\n  root: css`\r\n    display: flex;\r\n    align-items: center;\r\n    width: 100%;\r\n\r\n    &[data-disabled] {\r\n      cursor: not-allowed;\r\n    }\r\n  `,\r\n  thumb: css`\r\n    flex-shrink: 0;\r\n\r\n    width: 8px;\r\n    height: 16px;\r\n    border-radius: 100px;\r\n\r\n    background: ${cssVar.colorPrimary};\r\n    box-shadow: 0 0 0 1px ${cssVar.colorBgContainer};\r\n\r\n    transition: box-shadow 150ms ${cssVar.motionEaseOut};\r\n\r\n    &::before {\r\n      content: '';\r\n\r\n      position: absolute;\r\n      inset-block-start: 50%;\r\n      inset-inline-start: 50%;\r\n      translate: -50% -50%;\r\n\r\n      width: 24px;\r\n      height: 40px;\r\n    }\r\n\r\n    &:hover:not([data-disabled] *) {\r\n      box-shadow: 0 0 0 2px ${cssVar.colorPrimaryBorder};\r\n    }\r\n\r\n    ${focusRing};\r\n\r\n    [data-dragging] & {\r\n      box-shadow: 0 0 0 2px ${cssVar.colorPrimaryBorder};\r\n    }\r\n\r\n    [data-disabled] & {\r\n      background: ${cssVar.colorTextQuaternary};\r\n      box-shadow: 0 0 0 1px ${cssVar.colorBgContainer};\r\n    }\r\n\r\n    @media (prefers-reduced-motion: reduce) {\r\n      transition-duration: 0s;\r\n    }\r\n  `,\r\n  track: css`\r\n    width: 100%;\r\n    height: 4px;\r\n    border-radius: 100px;\r\n    background: ${cssVar.colorFillSecondary};\r\n  `,\r\n}));\r\n"],"mappings":";;;AAIA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,SAAS,GAAG;;;;;;CAMZ,WAAW,GAAG;;kBAEE,OAAO,aAAa;;;oBAGlB,OAAO,oBAAoB;;;CAG7C,MAAM,GAAG;;;;;;;;;CAST,OAAO,GAAG;;;;;;;kBAOM,OAAO,aAAa;4BACV,OAAO,iBAAiB;;mCAEjB,OAAO,cAAc;;;;;;;;;;;;;;;8BAe1B,OAAO,mBAAmB;;;MAGlD,UAAU;;;8BAGc,OAAO,mBAAmB;;;;oBAIpC,OAAO,oBAAoB;8BACjB,OAAO,iBAAiB;;;;;;;CAOpD,OAAO,GAAG;;;;kBAIM,OAAO,mBAAmB;;AAE5C,EAAE"}

package/es/base-ui/Slider/type.d.mts

@@ -0,0 +1,48 @@
+import { FlexboxProps } from "../../Flex/type.mjs";
+import "../../Flex/index.mjs";
+import { InputNumberProps, InputVariant } from "../Input/type.mjs";
+import "../Input/index.mjs";
+import { CSSProperties, ComponentProps } from "react";
+import { Slider } from "@base-ui/react/slider";
+//#region src/base-ui/Slider/type.d.ts
+type BaseSliderProps = Omit<ComponentProps<typeof Slider.Root>, 'className' | 'style' | 'render' | 'children' | 'onValueChange' | 'value' | 'defaultValue' | 'onChange'>;
+interface SliderProps extends BaseSliderProps {
+  className?: string;
+  classNames?: {
+    control?: string;
+    indicator?: string;
+    thumb?: string;
+    track?: string;
+  };
+  defaultValue?: number;
+  onChange?: (value: number) => void;
+  onChangeComplete?: (value: number) => void;
+  style?: CSSProperties;
+  styles?: {
+    control?: CSSProperties;
+    indicator?: CSSProperties;
+    thumb?: CSSProperties;
+    track?: CSSProperties;
+  };
+  value?: number;
+}
+interface SliderWithInputProps extends Omit<SliderProps, 'classNames' | 'styles'> {
+  changeOnWheel?: boolean;
+  classNames?: SliderProps['classNames'] & {
+    input?: string;
+    slider?: string;
+  };
+  controls?: boolean;
+  gap?: FlexboxProps['gap'];
+  shadow?: boolean;
+  size?: InputNumberProps['size'];
+  styles?: SliderProps['styles'] & {
+    input?: CSSProperties;
+    slider?: CSSProperties;
+  };
+  unlimitedInput?: boolean;
+  variant?: InputVariant;
+}
+//#endregion
+export { SliderProps, SliderWithInputProps };
+//# sourceMappingURL=type.d.mts.map

package/es/base-ui/Spin/NetworkGlyph.mjs

@@ -0,0 +1,70 @@
+import { styles } from "./style.mjs";
+import { memo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/base-ui/Spin/NetworkGlyph.tsx
+const layers = [
+	0,
+	1,
+	2
+];
+const unit = 25;
+const nodes = layers.flatMap((layer) => layers.map((row) => ({
+	x: unit + layer * unit,
+	y: unit + row * unit
+})));
+const lines = layers.slice(0, -1).flatMap((layer) => layers.flatMap((from) => layers.map((to) => ({
+	x1: unit + layer * unit,
+	x2: unit + (layer + 1) * unit,
+	y1: unit + from * unit,
+	y2: unit + to * unit
+}))));
+const particles = [
+	0,
+	1,
+	2
+];
+const minRenderedPx = (units, px, floorPx) => Math.max(units, floorPx * 100 / px);
+const NetworkGlyph = memo(({ px }) => {
+	const boxStyle = {
+		"--spin-node-size": `${minRenderedPx(6, px, 2)}px`,
+		"--spin-particle-size": `${minRenderedPx(3, px, 1.5)}px`,
+		"transform": `scale(${px / 100})`
+	};
+	return /* @__PURE__ */ jsx("span", {
+		className: styles.network,
+		style: {
+			height: px,
+			width: px
+		},
+		children: /* @__PURE__ */ jsxs("span", {
+			className: styles.networkBox,
+			style: boxStyle,
+			children: [
+				/* @__PURE__ */ jsx("svg", {
+					className: styles.networkLines,
+					viewBox: "0 0 100 100",
+					children: lines.map((line) => /* @__PURE__ */ jsx("line", { ...line }, `${line.x1}-${line.y1}-${line.y2}`))
+				}),
+				nodes.map(({ x, y }, index) => /* @__PURE__ */ jsx("i", {
+					className: styles.networkNode,
+					style: {
+						animationDelay: `${index * .2}s`,
+						left: x,
+						top: y
+					}
+				}, `${x}-${y}`)),
+				particles.map((index) => /* @__PURE__ */ jsx("i", {
+					className: styles.networkParticle,
+					style: { animationDelay: `${index * .6}s` }
+				}, index)),
+				/* @__PURE__ */ jsx("b", { className: styles.networkCore }),
+				/* @__PURE__ */ jsx("u", { className: styles.networkRing })
+			]
+		})
+	});
+});
+NetworkGlyph.displayName = "NetworkGlyph";
+//#endregion
+export { NetworkGlyph as default };
+
+//# sourceMappingURL=NetworkGlyph.mjs.map

package/es/base-ui/Spin/NetworkGlyph.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"NetworkGlyph.mjs","names":[],"sources":["../../../src/base-ui/Spin/NetworkGlyph.tsx"],"sourcesContent":["import type { CSSProperties } from 'react';\r\nimport { memo } from 'react';\r\n\r\nimport { styles } from './style';\r\n\r\nconst layers = [0, 1, 2] as const;\r\nconst unit = 25;\r\n\r\nconst nodes = layers.flatMap((layer) =>\r\n  layers.map((row) => ({ x: unit + layer * unit, y: unit + row * unit })),\r\n);\r\n\r\nconst lines = layers.slice(0, -1).flatMap((layer) =>\r\n  layers.flatMap((from) =>\r\n    layers.map((to) => ({\r\n      x1: unit + layer * unit,\r\n      x2: unit + (layer + 1) * unit,\r\n      y1: unit + from * unit,\r\n      y2: unit + to * unit,\r\n    })),\r\n  ),\r\n);\r\n\r\nconst particles = [0, 1, 2] as const;\r\n\r\nconst minRenderedPx = (units: number, px: number, floorPx: number) =>\r\n  Math.max(units, (floorPx * 100) / px);\r\n\r\nconst NetworkGlyph = memo<{ px: number }>(({ px }) => {\r\n  const boxStyle = {\r\n    '--spin-node-size': `${minRenderedPx(6, px, 2)}px`,\r\n    '--spin-particle-size': `${minRenderedPx(3, px, 1.5)}px`,\r\n    'transform': `scale(${px / 100})`,\r\n  } as CSSProperties;\r\n\r\n  return (\r\n    <span className={styles.network} style={{ height: px, width: px }}>\r\n      <span className={styles.networkBox} style={boxStyle}>\r\n        <svg className={styles.networkLines} viewBox=\"0 0 100 100\">\r\n          {lines.map((line) => (\r\n            <line key={`${line.x1}-${line.y1}-${line.y2}`} {...line} />\r\n          ))}\r\n        </svg>\r\n        {nodes.map(({ x, y }, index) => (\r\n          <i\r\n            className={styles.networkNode}\r\n            key={`${x}-${y}`}\r\n            style={{ animationDelay: `${index * 0.2}s`, left: x, top: y }}\r\n          />\r\n        ))}\r\n        {particles.map((index) => (\r\n          <i\r\n            className={styles.networkParticle}\r\n            key={index}\r\n            style={{ animationDelay: `${index * 0.6}s` }}\r\n          />\r\n        ))}\r\n        <b className={styles.networkCore} />\r\n        <u className={styles.networkRing} />\r\n      </span>\r\n    </span>\r\n  );\r\n});\r\n\r\nNetworkGlyph.displayName = 'NetworkGlyph';\r\n\r\nexport default NetworkGlyph;\r\n"],"mappings":";;;;AAKA,MAAM,SAAS;CAAC;CAAG;CAAG;AAAC;AACvB,MAAM,OAAO;AAEb,MAAM,QAAQ,OAAO,SAAS,UAC5B,OAAO,KAAK,SAAS;CAAE,GAAG,OAAO,QAAQ;CAAM,GAAG,OAAO,MAAM;AAAK,EAAE,CACxE;AAEA,MAAM,QAAQ,OAAO,MAAM,GAAG,EAAE,CAAC,CAAC,SAAS,UACzC,OAAO,SAAS,SACd,OAAO,KAAK,QAAQ;CAClB,IAAI,OAAO,QAAQ;CACnB,IAAI,QAAQ,QAAQ,KAAK;CACzB,IAAI,OAAO,OAAO;CAClB,IAAI,OAAO,KAAK;AAClB,EAAE,CACJ,CACF;AAEA,MAAM,YAAY;CAAC;CAAG;CAAG;AAAC;AAE1B,MAAM,iBAAiB,OAAe,IAAY,YAChD,KAAK,IAAI,OAAQ,UAAU,MAAO,EAAE;AAEtC,MAAM,eAAe,MAAsB,EAAE,SAAS;CACpD,MAAM,WAAW;EACf,oBAAoB,GAAG,cAAc,GAAG,IAAI,CAAC,EAAE;EAC/C,wBAAwB,GAAG,cAAc,GAAG,IAAI,GAAG,EAAE;EACrD,aAAa,SAAS,KAAK,IAAI;CACjC;CAEA,OACE,oBAAC,QAAD;EAAM,WAAW,OAAO;EAAS,OAAO;GAAE,QAAQ;GAAI,OAAO;EAAG;EAC9D,UAAA,qBAAC,QAAD;GAAM,WAAW,OAAO;GAAY,OAAO;GAA3C,UAAA;IACE,oBAAC,OAAD;KAAK,WAAW,OAAO;KAAc,SAAQ;KAC1C,UAAA,MAAM,KAAK,SACV,oBAAC,QAAD,EAA+C,GAAI,KAAO,GAA/C,GAAG,KAAK,GAAG,GAAG,KAAK,GAAG,GAAG,KAAK,IAAiB,CAC3D;IACE,CAAA;IACJ,MAAM,KAAK,EAAE,GAAG,KAAK,UACpB,oBAAC,KAAD;KACE,WAAW,OAAO;KAElB,OAAO;MAAE,gBAAgB,GAAG,QAAQ,GAAI;MAAI,MAAM;MAAG,KAAK;KAAE;IAC7D,GAFM,GAAG,EAAE,GAAG,GAEd,CACF;IACA,UAAU,KAAK,UACd,oBAAC,KAAD;KACE,WAAW,OAAO;KAElB,OAAO,EAAE,gBAAgB,GAAG,QAAQ,GAAI,GAAG;IAC5C,GAFM,KAEN,CACF;IACD,oBAAC,KAAD,EAAG,WAAW,OAAO,YAAc,CAAA;IACnC,oBAAC,KAAD,EAAG,WAAW,OAAO,YAAc,CAAA;GAC/B;;CACF,CAAA;AAEV,CAAC;AAED,aAAa,cAAc"}

package/es/base-ui/Spin/Spin.d.mts

@@ -0,0 +1,6 @@
+import { SpinProps } from "./type.mjs";
+//#region src/base-ui/Spin/Spin.d.ts
+declare const Spin: import("react").NamedExoticComponent<SpinProps>;
+//#endregion
+export { Spin as default };
+//# sourceMappingURL=Spin.d.mts.map

package/es/base-ui/Spin/Spin.mjs

@@ -0,0 +1,102 @@
+"use client";
+import Icon from "../../Icon/Icon.mjs";
+import { styles } from "./style.mjs";
+import NetworkGlyph from "./NetworkGlyph.mjs";
+import { memo, useMemo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cx } from "antd-style";
+import { LoaderCircle } from "lucide-react";
+//#region src/base-ui/Spin/Spin.tsx
+const sizeMap = {
+	large: 32,
+	middle: 20,
+	small: 14
+};
+const resolveSize = (size) => typeof size === "number" ? size : sizeMap[size];
+const Spin = memo(({ children, className, indicator, percent, ref, size = "middle", spinning = true, style, tip, variant = "default", ...rest }) => {
+	const px = useMemo(() => resolveSize(size), [size]);
+	const glyph = useMemo(() => {
+		if (indicator) return indicator;
+		if (variant === "network") return /* @__PURE__ */ jsx(NetworkGlyph, { px });
+		if (typeof percent === "number") {
+			const clamped = Math.min(100, Math.max(0, percent));
+			const circumference = 2 * Math.PI * 9;
+			const offset = circumference * (1 - clamped / 100);
+			return /* @__PURE__ */ jsxs("svg", {
+				className: cx(styles.glyph, styles.ring),
+				height: px,
+				viewBox: "0 0 24 24",
+				width: px,
+				children: [/* @__PURE__ */ jsx("circle", {
+					className: styles.ringTrack,
+					cx: 12,
+					cy: 12,
+					fill: "none",
+					r: 9,
+					strokeWidth: 2.5
+				}), /* @__PURE__ */ jsx("circle", {
+					className: styles.ringProgress,
+					cx: 12,
+					cy: 12,
+					fill: "none",
+					r: 9,
+					strokeDasharray: circumference,
+					strokeDashoffset: offset,
+					strokeLinecap: "round",
+					strokeWidth: 2.5
+				})]
+			});
+		}
+		return /* @__PURE__ */ jsx(Icon, {
+			spin: true,
+			className: styles.glyph,
+			icon: LoaderCircle,
+			size: px
+		});
+	}, [
+		indicator,
+		variant,
+		percent,
+		px
+	]);
+	if (!spinning) return children ?? null;
+	if (!children) return /* @__PURE__ */ jsx("div", {
+		"aria-busy": true,
+		"aria-live": "polite",
+		className: cx(styles.root, className),
+		ref,
+		role: "status",
+		style,
+		...rest,
+		children: /* @__PURE__ */ jsx("span", {
+			"aria-hidden": true,
+			className: styles.glyphBox,
+			children: glyph
+		})
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		className: cx(styles.wrapper, className),
+		ref,
+		style,
+		...rest,
+		children: [children, /* @__PURE__ */ jsxs("div", {
+			"aria-busy": true,
+			"aria-live": "polite",
+			className: styles.overlay,
+			role: "status",
+			children: [/* @__PURE__ */ jsx("span", {
+				"aria-hidden": true,
+				className: styles.glyphBox,
+				children: glyph
+			}), tip && /* @__PURE__ */ jsx("span", {
+				className: styles.tip,
+				children: tip
+			})]
+		})]
+	});
+});
+Spin.displayName = "Spin";
+//#endregion
+export { Spin as default };
+
+//# sourceMappingURL=Spin.mjs.map

package/es/base-ui/Spin/Spin.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spin.mjs","names":[],"sources":["../../../src/base-ui/Spin/Spin.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { cx } from 'antd-style';\r\nimport { LoaderCircle } from 'lucide-react';\r\nimport { memo, useMemo } from 'react';\r\n\r\nimport Icon from '@/Icon';\r\n\r\nimport NetworkGlyph from './NetworkGlyph';\r\nimport { styles } from './style';\r\nimport type { SpinProps, SpinSize } from './type';\r\n\r\nconst sizeMap: Record<'small' | 'middle' | 'large', number> = {\r\n  large: 32,\r\n  middle: 20,\r\n  small: 14,\r\n};\r\n\r\nconst resolveSize = (size: SpinSize) => (typeof size === 'number' ? size : sizeMap[size]);\r\n\r\nconst Spin = memo<SpinProps>(\r\n  ({\r\n    children,\r\n    className,\r\n    indicator,\r\n    percent,\r\n    ref,\r\n    size = 'middle',\r\n    spinning = true,\r\n    style,\r\n    tip,\r\n    variant = 'default',\r\n    ...rest\r\n  }) => {\r\n    const px = useMemo(() => resolveSize(size), [size]);\r\n\r\n    const glyph = useMemo(() => {\r\n      if (indicator) return indicator;\r\n\r\n      if (variant === 'network') return <NetworkGlyph px={px} />;\r\n\r\n      if (typeof percent === 'number') {\r\n        const clamped = Math.min(100, Math.max(0, percent));\r\n        const circumference = 2 * Math.PI * 9;\r\n        const offset = circumference * (1 - clamped / 100);\r\n\r\n        return (\r\n          <svg className={cx(styles.glyph, styles.ring)} height={px} viewBox=\"0 0 24 24\" width={px}>\r\n            <circle\r\n              className={styles.ringTrack}\r\n              cx={12}\r\n              cy={12}\r\n              fill=\"none\"\r\n              r={9}\r\n              strokeWidth={2.5}\r\n            />\r\n            <circle\r\n              className={styles.ringProgress}\r\n              cx={12}\r\n              cy={12}\r\n              fill=\"none\"\r\n              r={9}\r\n              strokeDasharray={circumference}\r\n              strokeDashoffset={offset}\r\n              strokeLinecap=\"round\"\r\n              strokeWidth={2.5}\r\n            />\r\n          </svg>\r\n        );\r\n      }\r\n\r\n      return <Icon spin className={styles.glyph} icon={LoaderCircle} size={px} />;\r\n    }, [indicator, variant, percent, px]);\r\n\r\n    if (!spinning) return children ?? null;\r\n\r\n    if (!children) {\r\n      return (\r\n        <div\r\n          aria-busy\r\n          aria-live=\"polite\"\r\n          className={cx(styles.root, className)}\r\n          ref={ref}\r\n          role=\"status\"\r\n          style={style}\r\n          {...rest}\r\n        >\r\n          <span aria-hidden className={styles.glyphBox}>\r\n            {glyph}\r\n          </span>\r\n        </div>\r\n      );\r\n    }\r\n\r\n    return (\r\n      <div className={cx(styles.wrapper, className)} ref={ref} style={style} {...rest}>\r\n        {children}\r\n        <div aria-busy aria-live=\"polite\" className={styles.overlay} role=\"status\">\r\n          <span aria-hidden className={styles.glyphBox}>\r\n            {glyph}\r\n          </span>\r\n          {tip && <span className={styles.tip}>{tip}</span>}\r\n        </div>\r\n      </div>\r\n    );\r\n  },\r\n);\r\n\r\nSpin.displayName = 'Spin';\r\n\r\nexport default Spin;\r\n"],"mappings":";;;;;;;;;AAYA,MAAM,UAAwD;CAC5D,OAAO;CACP,QAAQ;CACR,OAAO;AACT;AAEA,MAAM,eAAe,SAAoB,OAAO,SAAS,WAAW,OAAO,QAAQ;AAEnF,MAAM,OAAO,MACV,EACC,UACA,WACA,WACA,SACA,KACA,OAAO,UACP,WAAW,MACX,OACA,KACA,UAAU,WACV,GAAG,WACC;CACJ,MAAM,KAAK,cAAc,YAAY,IAAI,GAAG,CAAC,IAAI,CAAC;CAElD,MAAM,QAAQ,cAAc;EAC1B,IAAI,WAAW,OAAO;EAEtB,IAAI,YAAY,WAAW,OAAO,oBAAC,cAAD,EAAkB,GAAK,CAAA;EAEzD,IAAI,OAAO,YAAY,UAAU;GAC/B,MAAM,UAAU,KAAK,IAAI,KAAK,KAAK,IAAI,GAAG,OAAO,CAAC;GAClD,MAAM,gBAAgB,IAAI,KAAK,KAAK;GACpC,MAAM,SAAS,iBAAiB,IAAI,UAAU;GAE9C,OACE,qBAAC,OAAD;IAAK,WAAW,GAAG,OAAO,OAAO,OAAO,IAAI;IAAG,QAAQ;IAAI,SAAQ;IAAY,OAAO;IAAtF,UAAA,CACE,oBAAC,UAAD;KACE,WAAW,OAAO;KAClB,IAAI;KACJ,IAAI;KACJ,MAAK;KACL,GAAG;KACH,aAAa;IACd,CAAA,GACD,oBAAC,UAAD;KACE,WAAW,OAAO;KAClB,IAAI;KACJ,IAAI;KACJ,MAAK;KACL,GAAG;KACH,iBAAiB;KACjB,kBAAkB;KAClB,eAAc;KACd,aAAa;IACd,CAAA,CACE;;EAET;EAEA,OAAO,oBAAC,MAAD;GAAM,MAAA;GAAK,WAAW,OAAO;GAAO,MAAM;GAAc,MAAM;EAAK,CAAA;CAC5E,GAAG;EAAC;EAAW;EAAS;EAAS;CAAE,CAAC;CAEpC,IAAI,CAAC,UAAU,OAAO,YAAY;CAElC,IAAI,CAAC,UACH,OACE,oBAAC,OAAD;EACE,aAAA;EACA,aAAU;EACV,WAAW,GAAG,OAAO,MAAM,SAAS;EAC/B;EACL,MAAK;EACE;EACP,GAAI;EAEJ,UAAA,oBAAC,QAAD;GAAM,eAAA;GAAY,WAAW,OAAO;GACjC,UAAA;EACG,CAAA;CACH,CAAA;CAIT,OACE,qBAAC,OAAD;EAAK,WAAW,GAAG,OAAO,SAAS,SAAS;EAAQ;EAAY;EAAO,GAAI;EAA3E,UAAA,CACG,UACD,qBAAC,OAAD;GAAK,aAAA;GAAU,aAAU;GAAS,WAAW,OAAO;GAAS,MAAK;GAAlE,UAAA,CACE,oBAAC,QAAD;IAAM,eAAA;IAAY,WAAW,OAAO;IACjC,UAAA;GACG,CAAA,GACL,OAAO,oBAAC,QAAD;IAAM,WAAW,OAAO;IAAM,UAAA;GAAU,CAAA,CAC7C;EACF,CAAA,CAAA;;AAET,CACF;AAEA,KAAK,cAAc"}

package/es/base-ui/Spin/index.d.mts

@@ -0,0 +1,3 @@
+import { SpinProps, SpinSize, SpinVariant } from "./type.mjs";
+import Spin from "./Spin.mjs";
+export { type SpinProps, type SpinSize, type SpinVariant, Spin as default };