@serendie/ui 3.5.1-dev.202605201240 → 3.5.1-dev.202606160617

package/dist/components/BottomNavigation/BottomNavigation.d.ts

@@ -1,2 +1,2 @@
 import { ComponentProps } from 'react';
-export declare const BottomNavigation: ({ children, className, ...props }: ComponentProps<"nav">) => import("react/jsx-runtime").JSX.Element;
+export declare const BottomNavigation: ({ children, className, ...props }: ComponentProps<"nav">) => import("react").JSX.Element;

package/dist/components/DataTable/DataTable.sampleData.d.ts

@@ -0,0 +1,12 @@
+export type DataRow = {
+    id: number;
+    area: string;
+    time: string;
+    status: string;
+    connections: number;
+    households: number;
+    coverage: string;
+    errorRate: string;
+    process: string;
+};
+export declare function createDataTableRows(seed?: number): DataRow[];

package/dist/components/DataTable/DataTable.sampleData.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/DataTable/DataTableComponent.d.ts

@@ -2,5 +2,5 @@ import { TableOptions } from '@tanstack/react-table';
 export interface DataTableComponentProps<TData = Record<string, unknown>> extends Omit<TableOptions<TData>, "getCoreRowModel" | "getSortedRowModel"> {
     className?: string;
 }
-export declare function DataTableComponent<TData = Record<string, unknown>>({ className, enableRowSelection, onRowSelectionChange, onSortingChange, state, ...tableOptions }: DataTableComponentProps<TData>): import("react/jsx-runtime").JSX.Element;
+export declare function DataTableComponent<TData = Record<string, unknown>>({ className, enableRowSelection, onRowSelectionChange, onSortingChange, state, ...tableOptions }: DataTableComponentProps<TData>): import("react").JSX.Element;
 export default DataTableComponent;

package/dist/components/DataTable/table/BodyCheckbox.d.ts

@@ -1,4 +1,4 @@
 import { ChoiceBoxProps } from '../../ChoiceBox';
 export declare const BodyCheckbox: ({ checked, onChange, value, state, ...props }: {
     state?: "enabled" | "hovered" | "selected";
-} & Omit<ChoiceBoxProps, "type">) => import("react/jsx-runtime").JSX.Element;
+} & Omit<ChoiceBoxProps, "type">) => import("react").JSX.Element;

package/dist/components/Divider/Divider.d.ts

@@ -29,5 +29,5 @@ export declare const DividerStyle: import('../../../styled-system/types').Recipe
     };
 }>;
 type DividerProps = ComponentProps<"hr"> & RecipeVariantProps<typeof DividerStyle>;
-export declare const Divider: (props: DividerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Divider: (props: DividerProps) => import("react").JSX.Element;
 export {};

package/dist/components/List/List.d.ts

@@ -1,2 +1,2 @@
 import { ComponentProps } from 'react';
-export declare const List: ({ children, ...props }: ComponentProps<"ul">) => import("react/jsx-runtime").JSX.Element;
+export declare const List: ({ children, ...props }: ComponentProps<"ul">) => import("react").JSX.Element;

package/dist/components/ProgressIndicator/AnimatedArc.d.ts

@@ -3,4 +3,5 @@ export declare const AnimatedArc: React.FC<{
     className?: string;
     radius: number;
     width: number;
+    progress?: number;
 }>;

package/dist/components/ProgressIndicator/AnimatedArc.js

@@ -1,46 +1,43 @@
-import { jsx as A } from "react/jsx-runtime";
-import n from "react";
-import { describeArc as R } from "./util.js";
-const h = 2.5, S = ({ className: f, radius: o, width: c }) => {
-  const [t, i] = n.useState(0), s = n.useRef(null), a = n.useRef(null);
-  n.useEffect(() => {
-    const e = (r) => {
-      s.current == null && (s.current = r);
-      const u = (r - s.current) / 1e3;
-      s.current = r;
-      const m = u / h;
-      i((p) => (p + m) % 1), a.current = requestAnimationFrame(e);
+import { jsx as R } from "react/jsx-runtime";
+import e from "react";
+import { getAnimatedArcProps as P } from "./animatedArcProps.js";
+const F = 2.5, E = ({ className: l, radius: u, width: o, progress: t }) => {
+  const [s, m] = e.useState(0), r = e.useRef(null), n = e.useRef(null);
+  e.useEffect(() => {
+    if (t != null)
+      return;
+    const a = (c) => {
+      r.current == null && (r.current = c);
+      const d = (c - r.current) / 1e3;
+      r.current = c;
+      const A = d / F;
+      m((p) => (p + A) % 1), n.current = requestAnimationFrame(a);
     };
-    return a.current = requestAnimationFrame(e), () => {
-      a.current != null && cancelAnimationFrame(a.current);
+    return n.current = requestAnimationFrame(a), () => {
+      n.current != null && cancelAnimationFrame(n.current);
     };
-  }, []);
-  const { d: l, rotationDeg: d } = n.useMemo(() => {
-    const e = t * Math.PI * 2, r = 180 + 40 * Math.sin(-e) + 40, u = 90 * Math.sin(e) + 90;
-    return { d: R(
-      o + c,
-      // cx
-      o + c,
-      // cy
-      o,
-      // r
-      t * 360 + u,
-      t * 360 + r
-    ), rotationDeg: t * 360 };
-  }, [t, o, c]);
-  return /* @__PURE__ */ A(
+  }, [t]);
+  const { d: f, rotationDeg: i } = e.useMemo(
+    () => P({
+      progress: t ?? s,
+      radius: u,
+      width: o
+    }),
+    [t, s, u, o]
+  );
+  return /* @__PURE__ */ R(
     "path",
     {
-      d: l,
-      transform: `rotate(${d})`,
+      d: f,
+      transform: `rotate(${i})`,
       strokeLinecap: "butt",
       stroke: "currentColor",
-      strokeWidth: c,
+      strokeWidth: o,
       fill: "none",
-      className: f
+      className: l
     }
   );
 };
 export {
-  S as AnimatedArc
+  E as AnimatedArc
 };

package/dist/components/ProgressIndicator/AnimatedArc.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/ProgressIndicator/ProgressIndicator.d.ts

@@ -6,6 +6,6 @@ export interface ProgressIndicatorProps extends React.ComponentProps<"div"> {
     max?: number;
 }
 export declare const ProgressIndicator: {
-    ({ value, max, type, size, className, style, ...props }: ProgressIndicatorProps): import("react/jsx-runtime").JSX.Element;
+    ({ value, max, type, size, className, style, ...props }: ProgressIndicatorProps): React.JSX.Element;
     displayName: string;
 };

package/dist/components/ProgressIndicator/ProgressIndicatorIndeterminate.d.ts

@@ -3,8 +3,9 @@ export interface ProgressIndicatorIndeterminateProps extends React.ComponentProp
     type?: "linear" | "circular";
     size?: "small" | "medium" | "large";
     color?: "primary" | "subtle";
+    animationProgress?: number;
 }
 export declare const ProgressIndicatorIndeterminate: {
-    ({ type, size, color, className, style, ...props }: ProgressIndicatorIndeterminateProps): import("react/jsx-runtime").JSX.Element;
+    ({ type, size, color, animationProgress, className, style, ...props }: ProgressIndicatorIndeterminateProps): React.JSX.Element;
     displayName: string;
 };

package/dist/components/ProgressIndicator/ProgressIndicatorIndeterminate.js

@@ -1,8 +1,9 @@
-import { jsx as i, jsxs as p } from "react/jsx-runtime";
-import { AnimatedArc as h } from "./AnimatedArc.js";
-import { cx as c } from "../../styled-system/css/cx.js";
-import { cva as o } from "../../styled-system/css/cva.js";
-const m = o({
+import { jsx as i, jsxs as h } from "react/jsx-runtime";
+import { AnimatedArc as y } from "./AnimatedArc.js";
+import { normalizeProgress as f } from "./animatedArcProps.js";
+import { cx as u } from "../../styled-system/css/cx.js";
+import { cva as l } from "../../styled-system/css/cva.js";
+const p = l({
   base: {
     position: "relative",
     display: "flex",
@@ -80,7 +81,7 @@ const m = o({
     size: "medium",
     color: "primary"
   }
-}), g = o({
+}), b = l({
   base: {
     position: "absolute",
     backgroundColor: "sd.reference.color.scale.gray.100"
@@ -106,7 +107,7 @@ const m = o({
     }
   },
   compoundVariants: []
-}), u = o({
+}), g = l({
   base: {
     position: "absolute"
   },
@@ -140,7 +141,7 @@ const m = o({
     }
   },
   compoundVariants: []
-}), y = (e) => ({
+}), x = (r) => ({
   small: {
     radius: 6,
     strokeWidth: 2
@@ -153,37 +154,40 @@ const m = o({
     radius: 20,
     strokeWidth: 8
   }
-})[e], f = ({
-  type: e = "linear",
-  size: r = "medium",
+})[r], v = ({
+  type: r = "linear",
+  size: e = "medium",
   color: s = "primary",
-  className: l,
-  style: n,
-  ...d
+  animationProgress: n,
+  className: d,
+  style: c,
+  ...m
 }) => {
-  if (e === "circular") {
-    const { radius: a, strokeWidth: t } = y(r);
+  const a = n == null ? void 0 : f(n);
+  if (r === "circular") {
+    const { radius: t, strokeWidth: o } = x(e);
     return /* @__PURE__ */ i(
       "div",
       {
-        className: c(
-          m({ type: e, size: r, color: s }),
-          l
+        className: u(
+          p({ type: r, size: e, color: s }),
+          d
         ),
         role: "progressbar",
         "aria-valuetext": "Loading",
-        style: n,
-        ...d,
+        style: c,
+        ...m,
         children: /* @__PURE__ */ i(
           "svg",
           {
-            viewBox: `0 0 ${a * 2 + t * 2} ${a * 2 + t * 2}`,
+            viewBox: `0 0 ${t * 2 + o * 2} ${t * 2 + o * 2}`,
             children: /* @__PURE__ */ i(
-              h,
+              y,
               {
-                className: u({ type: e, size: r, color: s }),
-                radius: a,
-                width: t
+                className: g({ type: r, size: e, color: s }),
+                radius: t,
+                width: o,
+                progress: a
               }
             )
           }
@@ -191,25 +195,34 @@ const m = o({
       }
     );
   }
-  return /* @__PURE__ */ p(
+  return /* @__PURE__ */ h(
     "div",
     {
-      className: c(
-        m({ type: e, size: r, color: s }),
-        l
+      className: u(
+        p({ type: r, size: e, color: s }),
+        d
       ),
       role: "progressbar",
       "aria-valuetext": "Loading",
-      style: n,
-      ...d,
+      style: c,
+      ...m,
       children: [
-        /* @__PURE__ */ i("div", { className: g({ type: e, size: r }) }),
-        /* @__PURE__ */ i("div", { className: u({ type: e, size: r, color: s }) })
+        /* @__PURE__ */ i("div", { className: b({ type: r, size: e }) }),
+        /* @__PURE__ */ i(
+          "div",
+          {
+            className: g({ type: r, size: e, color: s }),
+            style: a == null ? void 0 : {
+              animation: "none",
+              transform: `translateX(${a * 300 - 150}%)`
+            }
+          }
+        )
       ]
     }
   );
 };
-f.displayName = "ProgressIndicatorIndeterminate";
+v.displayName = "ProgressIndicatorIndeterminate";
 export {
-  f as ProgressIndicatorIndeterminate
+  v as ProgressIndicatorIndeterminate
 };

package/dist/components/ProgressIndicator/animatedArcProps.d.ts

@@ -0,0 +1,11 @@
+type AnimatedArcProps = {
+    progress: number;
+    radius: number;
+    width: number;
+};
+export declare const normalizeProgress: (progress: number) => number;
+export declare const getAnimatedArcProps: ({ progress, radius, width, }: AnimatedArcProps) => {
+    d: string;
+    rotationDeg: number;
+};
+export {};

package/dist/components/ProgressIndicator/animatedArcProps.js

@@ -0,0 +1,19 @@
+import { describeArc as a } from "./util.js";
+const i = (n) => (n % 1 + 1) % 1, h = ({
+  progress: n,
+  radius: o,
+  width: r
+}) => {
+  const t = i(n), e = t * Math.PI * 2, s = 180 + 40 * Math.sin(-e) + 40, c = 90 * Math.sin(e) + 90;
+  return { d: a(
+    o + r,
+    o + r,
+    o,
+    t * 360 + c,
+    t * 360 + s
+  ), rotationDeg: t * 360 };
+};
+export {
+  h as getAnimatedArcProps,
+  i as normalizeProgress
+};

package/dist/components/Tabs/TabItem.d.ts

@@ -18,5 +18,5 @@ type ExclusiveBadgeProps = ({
     dot?: boolean;
 });
 export type TabItemProps = TabItemBaseProps & RecipeVariantProps<typeof TabItemStyle> & ArkTabs.TriggerProps & ExclusiveBadgeProps;
-export declare const TabItem: ({ title, value, disabled, dot, badge, className, ...props }: TabItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TabItem: ({ title, value, disabled, dot, badge, className, ...props }: TabItemProps) => import("react").JSX.Element;
 export {};

package/dist/components/Tabs/Tabs.d.ts

@@ -1,3 +1,3 @@
 import { Tabs as ArkTabs } from '@ark-ui/react';
 export declare const TabsStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"list" | "root", import('../../../styled-system/types').SlotRecipeVariantRecord<"list" | "root">>;
-export declare const Tabs: ({ children, className, ...props }: ArkTabs.RootProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Tabs: ({ children, className, ...props }: ArkTabs.RootProps) => import("react").JSX.Element;

package/dist/i18n/provider.d.ts

@@ -32,7 +32,7 @@ export interface SerendieProviderProps {
  * </SerendieProvider>
  * ```
  */
-export declare function SerendieProvider({ lang, colorTheme, colorMode, children, }: SerendieProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function SerendieProvider({ lang, colorTheme, colorMode, children, }: SerendieProviderProps): import("react").JSX.Element;
 /**
  * @deprecated LanguageProvider は SerendieProvider にリネームされました
  */

package/dist/node_modules/@zag-js/accordion/dist/accordion.connect.js

@@ -1,15 +1,15 @@
 import { getEventKey as G } from "../../dom-query/dist/event.js";
 import { isSafari as E } from "../../dom-query/dist/platform.js";
-import { dataAttr as r } from "../../dom-query/dist/shared.js";
-import { parts as u } from "./accordion.anatomy.js";
+import { dataAttr as i } from "../../dom-query/dist/shared.js";
+import { parts as l } from "./accordion.anatomy.js";
 import { getRootId as I, getItemContentId as f, getItemTriggerId as v, getItemId as S } from "./accordion.dom.js";
-function H(T, s) {
-  const { send: d, context: p, prop: a, scope: i, computed: c } = T, m = p.get("focusedValue"), g = p.get("value"), y = a("multiple");
+function H(T, u) {
+  const { send: o, context: p, prop: a, scope: d, computed: c } = T, m = p.get("focusedValue"), g = p.get("value"), y = a("multiple");
   function O(t) {
     let e = t;
-    !y && e.length > 1 && (e = [e[0]]), d({ type: "VALUE.SET", value: e });
+    !y && e.length > 1 && (e = [e[0]]), o({ type: "VALUE.SET", value: e });
   }
-  function l(t) {
+  function s(t) {
     return {
       expanded: g.includes(t.value),
       focused: m === t.value,
@@ -20,99 +20,98 @@ function H(T, s) {
     focusedValue: m,
     value: g,
     setValue: O,
-    getItemState: l,
+    getItemState: s,
     getRootProps() {
-      return s.element({
-        ...u.root.attrs,
+      return u.element({
+        ...l.root.attrs,
         dir: a("dir"),
-        id: I(i),
+        id: I(d),
         "data-orientation": a("orientation")
       });
     },
     getItemProps(t) {
-      const e = l(t);
-      return s.element({
-        ...u.item.attrs,
+      const e = s(t);
+      return u.element({
+        ...l.item.attrs,
         dir: a("dir"),
-        id: S(i, t.value),
+        id: S(d, t.value),
         "data-state": e.expanded ? "open" : "closed",
-        "data-focus": r(e.focused),
-        "data-disabled": r(e.disabled),
+        "data-focus": i(e.focused),
+        "data-disabled": i(e.disabled),
         "data-orientation": a("orientation")
       });
     },
     getItemContentProps(t) {
-      const e = l(t);
-      return s.element({
-        ...u.itemContent.attrs,
+      const e = s(t);
+      return u.element({
+        ...l.itemContent.attrs,
         dir: a("dir"),
         role: "region",
-        id: f(i, t.value),
-        "aria-labelledby": v(i, t.value),
+        id: f(d, t.value),
+        "aria-labelledby": v(d, t.value),
         hidden: !e.expanded,
         "data-state": e.expanded ? "open" : "closed",
-        "data-disabled": r(e.disabled),
-        "data-focus": r(e.focused),
+        "data-disabled": i(e.disabled),
+        "data-focus": i(e.focused),
         "data-orientation": a("orientation")
       });
     },
     getItemIndicatorProps(t) {
-      const e = l(t);
-      return s.element({
-        ...u.itemIndicator.attrs,
+      const e = s(t);
+      return u.element({
+        ...l.itemIndicator.attrs,
         dir: a("dir"),
         "aria-hidden": !0,
         "data-state": e.expanded ? "open" : "closed",
-        "data-disabled": r(e.disabled),
-        "data-focus": r(e.focused),
+        "data-disabled": i(e.disabled),
+        "data-focus": i(e.focused),
         "data-orientation": a("orientation")
       });
     },
     getItemTriggerProps(t) {
-      const { value: e } = t, o = l(t);
-      return s.button({
-        ...u.itemTrigger.attrs,
+      const { value: e } = t, r = s(t);
+      return u.button({
+        ...l.itemTrigger.attrs,
         type: "button",
         dir: a("dir"),
-        id: v(i, e),
-        "aria-controls": f(i, e),
-        "data-controls": f(i, e),
-        "aria-expanded": o.expanded,
-        disabled: o.disabled,
+        id: v(d, e),
+        "aria-controls": f(d, e),
+        "data-controls": f(d, e),
+        "aria-expanded": r.expanded,
+        disabled: r.disabled,
         "data-orientation": a("orientation"),
-        "aria-disabled": o.disabled,
-        "data-state": o.expanded ? "open" : "closed",
-        "data-focus": r(o.focused),
-        "data-ownedby": I(i),
+        "data-state": r.expanded ? "open" : "closed",
+        "data-focus": i(r.focused),
+        "data-ownedby": I(d),
         onFocus() {
-          o.disabled || d({ type: "TRIGGER.FOCUS", value: e });
+          r.disabled || o({ type: "TRIGGER.FOCUS", value: e });
         },
         onBlur() {
-          o.disabled || d({ type: "TRIGGER.BLUR" });
+          r.disabled || o({ type: "TRIGGER.BLUR" });
         },
         onClick(n) {
-          o.disabled || (E() && n.currentTarget.focus(), d({ type: "TRIGGER.CLICK", value: e }));
+          r.disabled || (E() && n.currentTarget.focus(), o({ type: "TRIGGER.CLICK", value: e }));
         },
         onKeyDown(n) {
-          if (n.defaultPrevented || o.disabled) return;
+          if (n.defaultPrevented || r.disabled) return;
           const R = {
             ArrowDown() {
-              c("isHorizontal") || d({ type: "GOTO.NEXT", value: e });
+              c("isHorizontal") || o({ type: "GOTO.NEXT", value: e });
             },
             ArrowUp() {
-              c("isHorizontal") || d({ type: "GOTO.PREV", value: e });
+              c("isHorizontal") || o({ type: "GOTO.PREV", value: e });
             },
             ArrowRight() {
-              c("isHorizontal") && d({ type: "GOTO.NEXT", value: e });
+              c("isHorizontal") && o({ type: "GOTO.NEXT", value: e });
             },
             ArrowLeft() {
-              c("isHorizontal") && d({ type: "GOTO.PREV", value: e });
+              c("isHorizontal") && o({ type: "GOTO.PREV", value: e });
             },
             Home() {
-              d({ type: "GOTO.FIRST", value: e });
+              o({ type: "GOTO.FIRST", value: e });
             },
             End() {
-              d({ type: "GOTO.LAST", value: e });
+              o({ type: "GOTO.LAST", value: e });
             }
           }, x = G(n, {
             dir: a("dir"),