@koide-labs/ui 0.0.15 → 0.1.1

package/dist/components/spinner/index.d.ts

@@ -1,2 +1 @@
-import { ViewProps } from '../view';
-export declare function Spinner({ className, ...props }: ViewProps): import("react/jsx-runtime").JSX.Element;
+export { Spinner } from './spinner';

package/dist/components/spinner/index.js

@@ -1,14 +1,5 @@
 "use client";
-import { jsx as n } from "react/jsx-runtime";
-import { c as i } from "../../clsx-OuTLNxxd.js";
-import { Icon as o } from "../icon/index.js";
-import { View as s } from "../view/index.js";
-import '../../index6.css';const p = "_spinner_98pyn_1", t = {
-  spinner: p
-};
-function f({ className: r, ...e }) {
-  return /* @__PURE__ */ n(s, { className: i(t.spinner, r), ...e, children: /* @__PURE__ */ n(o, { name: "loader-2-line" }) });
-}
+import { Spinner as r } from "./spinner.js";
 export {
-  f as Spinner
+  r as Spinner
 };

package/dist/components/spinner/spinner.d.ts

@@ -0,0 +1,7 @@
+import { View } from '../view';
+type SpinnerProps = View.Props;
+declare function Spinner({ className, ...props }: SpinnerProps): import("react/jsx-runtime").JSX.Element;
+export { Spinner };
+export declare namespace Spinner {
+    type Props = SpinnerProps;
+}

package/dist/components/spinner/spinner.js

@@ -0,0 +1,13 @@
+import { jsx as n } from "react/jsx-runtime";
+import { c as o } from "../../clsx-OuTLNxxd.js";
+import { View as i } from "../view/view.js";
+import { Icon as s } from "../icon/icon.js";
+import '../../spinner.css';const m = "_spinner_16nxb_2", p = {
+  spinner: m
+};
+function f({ className: r, ...e }) {
+  return /* @__PURE__ */ n(i, { className: o(p.spinner, r), ...e, children: /* @__PURE__ */ n(s, { name: "loader-2-line" }) });
+}
+export {
+  f as Spinner
+};

package/dist/components/stacked-avatars/index.d.ts

@@ -1,14 +1 @@
-import { AvatarProps } from '../avatar';
-import { Color } from '../view';
-export interface StackedAvatarsProps {
-    /** User objects */
-    users: Array<AvatarProps & {
-        /** Ring color around the avatar */
-        color: Color;
-    }>;
-    /** The maximum number of user to display. Defaults to 3. */
-    visibleUsers?: number;
-    /** The size of the avatars. Defaults to "md". */
-    size?: AvatarProps["size"];
-}
-export declare function StackedAvatars({ users, visibleUsers, size, }: StackedAvatarsProps): import("react/jsx-runtime").JSX.Element;
+export { StackedAvatars } from './stacked-avatars';

package/dist/components/stacked-avatars/index.js

@@ -1,93 +1,5 @@
 "use client";
-import { jsx as t, jsxs as l } from "react/jsx-runtime";
-import { c as v } from "../../clsx-OuTLNxxd.js";
-import { Avatar as o } from "../avatar/index.js";
-import { Text as k } from "../text/index.js";
-import { Tooltip as n } from "../tooltip/index.js";
-import { View as i } from "../view/index.js";
-import '../../index4.css';const a = {
-  "stacked-avatars": "_stacked-avatars_7icu0_1",
-  "stacked-avatars__avatar": "_stacked-avatars__avatar_7icu0_7",
-  "stacked-avatars__avatar_color": "_stacked-avatars__avatar_color_7icu0_12",
-  "stacked-avatars__visible": "_stacked-avatars__visible_7icu0_16",
-  "stacked-avatars__visible_size_sm": "_stacked-avatars__visible_size_sm_7icu0_34",
-  "stacked-avatars__visible_size_md": "_stacked-avatars__visible_size_md_7icu0_38",
-  "stacked-avatars__visible_size_lg": "_stacked-avatars__visible_size_lg_7icu0_42",
-  "stacked-avatars__visible_size_xl": "_stacked-avatars__visible_size_xl_7icu0_46",
-  "stacked-avatars__visible_size_2xl": "_stacked-avatars__visible_size_2xl_7icu0_50",
-  "stacked-avatars__visible_size_3xl": "_stacked-avatars__visible_size_3xl_7icu0_54",
-  "stacked-avatars__tooltip-content": "_stacked-avatars__tooltip-content_7icu0_59",
-  "stacked-avatars__tooltip-user": "_stacked-avatars__tooltip-user_7icu0_69",
-  "stacked-avatars__tooltip-text": "_stacked-avatars__tooltip-text_7icu0_77"
-};
-function f({
-  users: s,
-  visibleUsers: e = 3,
-  size: d = "md"
-}) {
-  return /* @__PURE__ */ t(
-    n,
-    {
-      className: a["stacked-avatars__tooltip-content"],
-      trigger: /* @__PURE__ */ l(i, { className: a["stacked-avatars"], children: [
-        s.slice(0, e).map(({ color: c, className: r, ..._ }, m) => /* @__PURE__ */ t(i, { color: c, children: /* @__PURE__ */ t(
-          o,
-          {
-            size: d,
-            className: v(
-              a["stacked-avatars__avatar"],
-              a["stacked-avatars__avatar_color"],
-              r
-            ),
-            style: { zIndex: m },
-            ..._
-          }
-        ) }, _.username)),
-        s.length > e && /* @__PURE__ */ t(
-          i,
-          {
-            className: v(
-              a["stacked-avatars__visible"],
-              a[`stacked-avatars__visible_size_${d}`]
-            ),
-            style: { zIndex: e + 1 },
-            children: /* @__PURE__ */ l(k, { size: "sm", children: [
-              "+",
-              s.length - e
-            ] })
-          }
-        )
-      ] }),
-      children: s.map(({ color: c, className: r, ..._ }) => /* @__PURE__ */ l(
-        i,
-        {
-          color: c,
-          className: a["stacked-avatars__tooltip-user"],
-          children: [
-            /* @__PURE__ */ t(
-              o,
-              {
-                className: v(a["stacked-avatars__avatar_color"], r),
-                ..._,
-                size: "sm"
-              },
-              _.username
-            ),
-            /* @__PURE__ */ t(
-              k,
-              {
-                color: "dimmer",
-                className: a["stacked-avatars__tooltip-text"],
-                children: _.username
-              }
-            )
-          ]
-        },
-        _.username
-      ))
-    }
-  );
-}
+import { StackedAvatars as a } from "./stacked-avatars.js";
 export {
-  f as StackedAvatars
+  a as StackedAvatars
 };

package/dist/components/stacked-avatars/stacked-avatars.d.ts

@@ -0,0 +1,18 @@
+import { Avatar } from '../avatar';
+import { Color } from '../view';
+interface StackedAvatarsProps {
+    /** User objects */
+    users: Array<Avatar.Props & {
+        /** Ring color around the avatar */
+        color: Color;
+    }>;
+    /** The maximum number of user to display. Defaults to 3. */
+    visibleUsers?: number;
+    /** The size of the avatars. Defaults to "md". */
+    size?: Avatar.Props["size"];
+}
+declare function StackedAvatars({ users, visibleUsers, size, }: StackedAvatarsProps): import("react/jsx-runtime").JSX.Element;
+export { StackedAvatars };
+export declare namespace StackedAvatars {
+    type Props = StackedAvatarsProps;
+}

package/dist/components/stacked-avatars/stacked-avatars.js

@@ -0,0 +1,92 @@
+import { jsx as t, jsxs as c } from "react/jsx-runtime";
+import { c as v } from "../../clsx-OuTLNxxd.js";
+import { T as x } from "../../tooltip-oCp-elli.js";
+import { View as r } from "../view/view.js";
+import { Avatar as o } from "../avatar/avatar.js";
+import { Text as k } from "../text/text.js";
+import '../../stacked-avatars.css';const a = {
+  "stacked-avatars": "_stacked-avatars_qhxl3_2",
+  "stacked-avatars__avatar": "_stacked-avatars__avatar_qhxl3_8",
+  "stacked-avatars__avatar_color": "_stacked-avatars__avatar_color_qhxl3_13",
+  "stacked-avatars__visible": "_stacked-avatars__visible_qhxl3_17",
+  "stacked-avatars__visible_size_sm": "_stacked-avatars__visible_size_sm_qhxl3_35",
+  "stacked-avatars__visible_size_md": "_stacked-avatars__visible_size_md_qhxl3_39",
+  "stacked-avatars__visible_size_lg": "_stacked-avatars__visible_size_lg_qhxl3_43",
+  "stacked-avatars__visible_size_xl": "_stacked-avatars__visible_size_xl_qhxl3_47",
+  "stacked-avatars__visible_size_2xl": "_stacked-avatars__visible_size_2xl_qhxl3_51",
+  "stacked-avatars__visible_size_3xl": "_stacked-avatars__visible_size_3xl_qhxl3_55",
+  "stacked-avatars__tooltip-content": "_stacked-avatars__tooltip-content_qhxl3_60",
+  "stacked-avatars__tooltip-user": "_stacked-avatars__tooltip-user_qhxl3_70",
+  "stacked-avatars__tooltip-text": "_stacked-avatars__tooltip-text_qhxl3_78"
+};
+function f({
+  users: s,
+  visibleUsers: e = 3,
+  size: d = "md"
+}) {
+  return /* @__PURE__ */ t(
+    x,
+    {
+      className: a["stacked-avatars__tooltip-content"],
+      trigger: /* @__PURE__ */ c(r, { className: a["stacked-avatars"], children: [
+        s.slice(0, e).map(({ color: l, className: i, ..._ }, m) => /* @__PURE__ */ t(r, { color: l, children: /* @__PURE__ */ t(
+          o,
+          {
+            size: d,
+            className: v(
+              a["stacked-avatars__avatar"],
+              a["stacked-avatars__avatar_color"],
+              i
+            ),
+            style: { zIndex: m },
+            ..._
+          }
+        ) }, _.username)),
+        s.length > e && /* @__PURE__ */ t(
+          r,
+          {
+            className: v(
+              a["stacked-avatars__visible"],
+              a[`stacked-avatars__visible_size_${d}`]
+            ),
+            style: { zIndex: e + 1 },
+            children: /* @__PURE__ */ c(k, { size: "sm", children: [
+              "+",
+              s.length - e
+            ] })
+          }
+        )
+      ] }),
+      children: s.map(({ color: l, className: i, ..._ }) => /* @__PURE__ */ c(
+        r,
+        {
+          color: l,
+          className: a["stacked-avatars__tooltip-user"],
+          children: [
+            /* @__PURE__ */ t(
+              o,
+              {
+                className: v(a["stacked-avatars__avatar_color"], i),
+                ..._,
+                size: "sm"
+              },
+              _.username
+            ),
+            /* @__PURE__ */ t(
+              k,
+              {
+                color: "dimmer",
+                className: a["stacked-avatars__tooltip-text"],
+                children: _.username
+              }
+            )
+          ]
+        },
+        _.username
+      ))
+    }
+  );
+}
+export {
+  f as StackedAvatars
+};

package/dist/components/status-banner/index.d.ts

@@ -1,17 +1 @@
-import { useRender } from '@base-ui/react';
-import { Size } from '../../styles/tokens';
-import { IconName } from '../icon/icon-names';
-import { Color } from '../view';
-export interface StatusBannerProps extends Omit<useRender.ComponentProps<"div">, "children"> {
-    /** Communicate purpose with color */
-    color?: Color;
-    /** Icon on the left side  */
-    icon: IconName;
-    /** Optional title */
-    title?: string;
-    /** Actual content of the status banner */
-    description: string;
-    /** Size, defaults to lg */
-    size?: Extract<Size, "md" | "lg">;
-}
-export declare function StatusBanner({ color, icon, title, description, size, render, className, ...props }: StatusBannerProps): import("react/jsx-runtime").JSX.Element;
+export { StatusBanner } from './status-banner';

package/dist/components/status-banner/index.js

@@ -1,72 +1,5 @@
 "use client";
-import { jsxs as _, jsx as s } from "react/jsx-runtime";
-import { c as b } from "../../clsx-OuTLNxxd.js";
-import { Heading as d } from "../heading/index.js";
-import { Icon as g } from "../icon/index.js";
-import { Text as p } from "../text/index.js";
-import { View as i } from "../view/index.js";
-import '../../index3.css';const t = {
-  "status-banner": "_status-banner_zygt6_1",
-  "status-banner_variant_neutral": "_status-banner_variant_neutral_zygt6_14",
-  "status-banner_variant_colorway": "_status-banner_variant_colorway_zygt6_20",
-  "status-banner_size_md": "_status-banner_size_md_zygt6_26",
-  "status-banner_size_lg": "_status-banner_size_lg_zygt6_32",
-  "status-banner__content": "_status-banner__content_zygt6_38",
-  "status-banner__description": "_status-banner__description_zygt6_44",
-  "status-banner__close": "_status-banner__close_zygt6_49"
-}, a = {
-  md: {
-    icon: "md",
-    title: "md",
-    description: "sm"
-  },
-  lg: {
-    icon: "xl",
-    title: "lg",
-    description: "md"
-  }
-};
-function w({
-  color: e,
-  icon: r,
-  title: o,
-  description: l,
-  size: n = "lg",
-  render: u,
-  className: c,
-  ...m
-}) {
-  return /* @__PURE__ */ _(
-    i,
-    {
-      render: u,
-      ...m,
-      color: e,
-      className: b(
-        t["status-banner"],
-        t[`status-banner_size_${n}`],
-        e ? t["status-banner_variant_colorway"] : t["status-banner_variant_neutral"],
-        c
-      ),
-      children: [
-        r ? /* @__PURE__ */ s(g, { name: r, size: a[n].icon }) : null,
-        /* @__PURE__ */ _(i, { className: t["status-banner__content"], children: [
-          /* @__PURE__ */ s(d, { level: 1, size: a[n].title, color: "inherit", children: o }),
-          /* @__PURE__ */ s(
-            p,
-            {
-              className: t["status-banner__description"],
-              multiline: !0,
-              size: a[n].description,
-              color: "inherit",
-              children: l
-            }
-          )
-        ] })
-      ]
-    }
-  );
-}
+import { StatusBanner as n } from "./status-banner.js";
 export {
-  w as StatusBanner
+  n as StatusBanner
 };

package/dist/components/status-banner/status-banner.d.ts

@@ -0,0 +1,22 @@
+import { useRender } from '@base-ui/react';
+import { Size } from '../../styles/tokens';
+import { Icon } from '../icon';
+import { Color } from '../view';
+type StatusBannerSize = Extract<Size, "md" | "lg">;
+interface StatusBannerProps extends Omit<useRender.ComponentProps<"div">, "children"> {
+    /** Communicate purpose with color */
+    color?: Color;
+    /** Icon on the left side  */
+    icon: Icon.Name;
+    /** Optional title */
+    title?: string;
+    /** Actual content of the status banner */
+    description: string;
+    /** Size, defaults to lg */
+    size?: StatusBannerSize;
+}
+declare function StatusBanner({ color, icon, title, description, size, render, className, ...props }: StatusBannerProps): import("react/jsx-runtime").JSX.Element;
+export { StatusBanner };
+export declare namespace StatusBanner {
+    type Props = StatusBannerProps;
+}

package/dist/components/status-banner/status-banner.js

@@ -0,0 +1,71 @@
+import { jsxs as _, jsx as s } from "react/jsx-runtime";
+import { c as b } from "../../clsx-OuTLNxxd.js";
+import { View as i } from "../view/view.js";
+import { Icon as d } from "../icon/icon.js";
+import { Heading as p } from "../heading/heading.js";
+import { Text as y } from "../text/text.js";
+import '../../status-banner.css';const t = {
+  "status-banner": "_status-banner_1ci6y_2",
+  "status-banner_variant_neutral": "_status-banner_variant_neutral_1ci6y_15",
+  "status-banner_variant_colorway": "_status-banner_variant_colorway_1ci6y_21",
+  "status-banner_size_md": "_status-banner_size_md_1ci6y_27",
+  "status-banner_size_lg": "_status-banner_size_lg_1ci6y_33",
+  "status-banner__content": "_status-banner__content_1ci6y_39",
+  "status-banner__description": "_status-banner__description_1ci6y_45",
+  "status-banner__close": "_status-banner__close_1ci6y_50"
+}, a = {
+  md: {
+    icon: "md",
+    title: "md",
+    description: "sm"
+  },
+  lg: {
+    icon: "xl",
+    title: "lg",
+    description: "md"
+  }
+};
+function w({
+  color: e,
+  icon: r,
+  title: c,
+  description: o,
+  size: n = "lg",
+  render: l,
+  className: u,
+  ...m
+}) {
+  return /* @__PURE__ */ _(
+    i,
+    {
+      render: l,
+      ...m,
+      color: e,
+      className: b(
+        t["status-banner"],
+        t[`status-banner_size_${n}`],
+        e ? t["status-banner_variant_colorway"] : t["status-banner_variant_neutral"],
+        u
+      ),
+      children: [
+        r ? /* @__PURE__ */ s(d, { name: r, size: a[n].icon }) : null,
+        /* @__PURE__ */ _(i, { className: t["status-banner__content"], children: [
+          /* @__PURE__ */ s(p, { level: 1, size: a[n].title, color: "inherit", children: c }),
+          /* @__PURE__ */ s(
+            y,
+            {
+              className: t["status-banner__description"],
+              multiline: !0,
+              size: a[n].description,
+              color: "inherit",
+              children: o
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+export {
+  w as StatusBanner
+};

package/dist/components/surface/index.d.ts

@@ -1,27 +1,2 @@
-import { useRender } from '@base-ui/react';
-import { Color } from '../view';
-export interface SurfaceProps extends useRender.ComponentProps<"div"> {
-    /**
-     * Explicitly sets the background color of the surface.
-     * If this prop is set, the `elevated` prop will be ignored.
-     */
-    background?: Background;
-    /**
-     * If true, the surface will be elevated by one level from the current
-     * context. If false, the surface will be at the same level as before.
-     *
-     * If the `background` prop is set, this prop will be ignored.
-     */
-    elevated?: boolean;
-    /**
-     * Add CSS color variables.
-     */
-    color?: Color;
-}
-export declare const Surface: {
-    ({ background, elevated, className, ...props }: SurfaceProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-declare const backgrounds: readonly ["root", "default", "higher", "highest"];
-export type Background = (typeof backgrounds)[number];
-export {};
+export { Surface } from './surface';
+export * from './surface.types';

package/dist/components/surface/index.js

@@ -1,42 +1,5 @@
 "use client";
-import { jsx as s } from "react/jsx-runtime";
-import { c as f } from "../../clsx-OuTLNxxd.js";
-import { createContext as i, useContext as l } from "react";
-import { View as h } from "../view/index.js";
-import '../../index17.css';const _ = "_surface_65s6k_1", a = {
-  surface: _,
-  "surface--root": "_surface--root_65s6k_5",
-  "surface--default": "_surface--default_65s6k_13",
-  "surface--higher": "_surface--higher_65s6k_21",
-  "surface--highest": "_surface--highest_65s6k_29"
-}, c = i(0), m = ({
-  background: e,
-  elevated: r,
-  className: n,
-  ...u
-}) => {
-  let t = l(c);
-  return e ? t = d(e) : r && t++, /* @__PURE__ */ s(c.Provider, { value: t, children: /* @__PURE__ */ s(
-    h,
-    {
-      className: f(
-        a.surface,
-        a[`surface--${g(t)}`],
-        n
-      ),
-      ...u
-    }
-  ) });
-};
-m.displayName = "Surface";
-const o = ["root", "default", "higher", "highest"];
-function d(e = "root") {
-  const r = o.indexOf(e);
-  return Math.min(Math.max(r, 0), o.length - 1);
-}
-function g(e = 0) {
-  return o[e] || "root";
-}
+import { Surface as c } from "./surface.js";
 export {
-  m as Surface
+  c as Surface
 };

package/dist/components/surface/surface.d.ts

@@ -0,0 +1,26 @@
+import { useRender } from '@base-ui/react';
+import { Color } from '../view';
+import { Background } from './surface.types';
+interface SurfaceProps extends useRender.ComponentProps<"div"> {
+    /**
+     * Explicitly sets the background color of the surface.
+     * If this prop is set, the `elevated` prop will be ignored.
+     */
+    background?: Background;
+    /**
+     * If true, the surface will be elevated by one level from the current
+     * context. If false, the surface will be at the same level as before.
+     *
+     * If the `background` prop is set, this prop will be ignored.
+     */
+    elevated?: boolean;
+    /**
+     * Add CSS color variables.
+     */
+    color?: Color;
+}
+declare function Surface({ background, elevated, className, ...props }: SurfaceProps): import("react/jsx-runtime").JSX.Element;
+export { Surface };
+export declare namespace Surface {
+    type Props = SurfaceProps;
+}

package/dist/components/surface/surface.js

@@ -0,0 +1,36 @@
+import { jsx as a } from "react/jsx-runtime";
+import { c as u } from "../../clsx-OuTLNxxd.js";
+import { createContext as i, useContext as h } from "react";
+import { View as l } from "../view/view.js";
+import '../../surface.css';const _ = "_surface_38ylh_2", s = {
+  surface: _,
+  "surface--root": "_surface--root_38ylh_6",
+  "surface--default": "_surface--default_38ylh_14",
+  "surface--higher": "_surface--higher_38ylh_22",
+  "surface--highest": "_surface--highest_38ylh_30"
+}, c = i(0);
+function p({ background: e, elevated: r, className: n, ...f }) {
+  let t = h(c);
+  return e ? t = m(e) : r && t++, /* @__PURE__ */ a(c.Provider, { value: t, children: /* @__PURE__ */ a(
+    l,
+    {
+      className: u(
+        s.surface,
+        s[`surface--${g(t)}`],
+        n
+      ),
+      ...f
+    }
+  ) });
+}
+const o = ["root", "default", "higher", "highest"];
+function m(e = "root") {
+  const r = o.indexOf(e);
+  return Math.min(Math.max(r, 0), o.length - 1);
+}
+function g(e = 0) {
+  return o[e] || "root";
+}
+export {
+  p as Surface
+};

package/dist/components/surface/surface.types.d.ts

@@ -0,0 +1 @@
+export type Background = "root" | "default" | "higher" | "highest";

package/dist/components/surface/surface.types.js

@@ -0,0 +1 @@
+

package/dist/components/switch/index.d.ts

@@ -1,5 +1 @@
-import { Switch as SwitchPrimitive } from '@base-ui/react/switch';
-import { Color } from '../view';
-export declare function Switch({ color, ...props }: SwitchPrimitive.Root.Props & {
-    color?: Color;
-}): import("react/jsx-runtime").JSX.Element;
+export { Switch } from './switch';