@koide-labs/ui 0.0.15 → 0.1.1

package/dist/components/avatar/index.js

@@ -1,162 +1,5 @@
 "use client";
-import { jsx as m, jsxs as L } from "react/jsx-runtime";
-import { c as R } from "../../clsx-OuTLNxxd.js";
-import * as o from "react";
-import { u as f, N as h } from "../../useRenderElement-DwToLA61.js";
-import { f as k } from "../../formatErrorMessage-BqPuTBN-.js";
-import { u as C } from "../../useStableCallback-CkTrVkNX.js";
-import { u as N } from "../../useIsoLayoutEffect-CIDbvm3Q.js";
-import { u as M } from "../../useTimeout-CflX-kz3.js";
-import '../../index24.css';const g = /* @__PURE__ */ o.createContext(void 0);
-process.env.NODE_ENV !== "production" && (g.displayName = "AvatarRootContext");
-function b() {
-  const e = o.useContext(g);
-  if (e === void 0)
-    throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: AvatarRootContext is missing. Avatar parts must be placed within <Avatar.Root>." : k(13));
-  return e;
-}
-const p = {
-  imageLoadingStatus: () => null
-}, z = /* @__PURE__ */ o.forwardRef(function(a, s) {
-  const {
-    className: c,
-    render: i,
-    ...r
-  } = a, [t, l] = o.useState("idle"), _ = o.useMemo(() => ({
-    imageLoadingStatus: t
-  }), [t]), u = o.useMemo(() => ({
-    imageLoadingStatus: t,
-    setImageLoadingStatus: l
-  }), [t, l]), n = f("span", a, {
-    state: _,
-    ref: s,
-    props: r,
-    stateAttributesMapping: p
-  });
-  return /* @__PURE__ */ m(g.Provider, {
-    value: u,
-    children: n
-  });
-});
-process.env.NODE_ENV !== "production" && (z.displayName = "AvatarRoot");
-function w(e, {
-  referrerPolicy: a,
-  crossOrigin: s
-}) {
-  const [c, i] = o.useState("idle");
-  return N(() => {
-    if (!e)
-      return i("error"), h;
-    let r = !0;
-    const t = new window.Image(), l = (_) => () => {
-      r && i(_);
-    };
-    return i("loading"), t.onload = l("loaded"), t.onerror = l("error"), a && (t.referrerPolicy = a), t.crossOrigin = s ?? null, t.src = e, () => {
-      r = !1;
-    };
-  }, [e, s, a]), c;
-}
-const S = /* @__PURE__ */ o.forwardRef(function(a, s) {
-  const {
-    className: c,
-    render: i,
-    onLoadingStatusChange: r,
-    referrerPolicy: t,
-    crossOrigin: l,
-    ..._
-  } = a, u = b(), n = w(a.src, {
-    referrerPolicy: t,
-    crossOrigin: l
-  }), d = C((x) => {
-    r?.(x), u.setImageLoadingStatus(x);
-  });
-  N(() => {
-    n !== "idle" && d(n);
-  }, [n, d]);
-  const A = o.useMemo(() => ({
-    imageLoadingStatus: n
-  }), [n]);
-  return f("img", a, {
-    state: A,
-    ref: s,
-    props: _,
-    stateAttributesMapping: p,
-    enabled: n === "loaded"
-  });
-});
-process.env.NODE_ENV !== "production" && (S.displayName = "AvatarImage");
-const E = /* @__PURE__ */ o.forwardRef(function(a, s) {
-  const {
-    className: c,
-    render: i,
-    delay: r,
-    ...t
-  } = a, {
-    imageLoadingStatus: l
-  } = b(), [_, u] = o.useState(r === void 0), n = M();
-  o.useEffect(() => (r !== void 0 && n.start(r, () => u(!0)), n.clear), [n, r]);
-  const d = o.useMemo(() => ({
-    imageLoadingStatus: l
-  }), [l]);
-  return f("span", a, {
-    state: d,
-    ref: s,
-    props: t,
-    stateAttributesMapping: p,
-    enabled: l !== "loaded" && _
-  });
-});
-process.env.NODE_ENV !== "production" && (E.displayName = "AvatarFallback");
-const y = "_avatar_2v9li_1", I = "_avatar__image_2v9li_15", O = "_avatar__fallback_2v9li_21", D = "_avatar_size_sm_2v9li_34", V = "_avatar_size_md_2v9li_38", F = "_avatar_size_lg_2v9li_42", P = "_avatar_size_xl_2v9li_46", j = "_avatar_size_2xl_2v9li_50", U = "_avatar_size_3xl_2v9li_54", v = {
-  avatar: y,
-  avatar__image: I,
-  avatar__fallback: O,
-  avatar_size_sm: D,
-  avatar_size_md: V,
-  avatar_size_lg: F,
-  avatar_size_xl: P,
-  avatar_size_2xl: j,
-  avatar_size_3xl: U
-};
-function W({
-  image: e,
-  username: a,
-  fullName: s,
-  size: c = "md",
-  className: i,
-  ...r
-}) {
-  const t = B(a, s);
-  return /* @__PURE__ */ L(
-    z,
-    {
-      className: R(
-        v.avatar,
-        v[`avatar_size_${c}`],
-        i
-      ),
-      ...r,
-      children: [
-        e ? /* @__PURE__ */ m(
-          S,
-          {
-            src: e,
-            className: v.avatar__image
-          }
-        ) : null,
-        /* @__PURE__ */ m(E, { className: v.avatar__fallback, children: t })
-      ]
-    }
-  );
-}
-function B(e, a) {
-  let s = e.substring(0, 2);
-  if (a) {
-    const [c, i] = a.split(" ");
-    s = c && i ? c.charAt(0) + i.charAt(0) : a.substring(0, 2);
-  }
-  return s.toLocaleUpperCase();
-}
+import { Avatar as t } from "./avatar.js";
 export {
-  W as Avatar
+  t as Avatar
 };

package/dist/components/badge/badge.d.ts

@@ -0,0 +1,20 @@
+import { useRender } from '@base-ui/react';
+import { Icon } from '../icon';
+import { Color } from '../view';
+interface BadgeProps extends Omit<useRender.ComponentProps<"span">, "children"> {
+    /** Optional icon, goes before name */
+    icon?: Icon.Name;
+    /** Name of badge to be displayed, goes after icon */
+    name: string;
+    /** Communicate purpose with color. Defaults to "primary". */
+    color?: Color;
+    /** Add shiny hover effect. */
+    shiny?: boolean;
+    /** Tagline of badge. */
+    tagline?: string;
+}
+declare function Badge({ icon, name, color, shiny, tagline, render, className, ...props }: BadgeProps): import("react/jsx-runtime").JSX.Element;
+export { Badge };
+export declare namespace Badge {
+    type Props = BadgeProps;
+}

package/dist/components/badge/badge.js

@@ -0,0 +1,42 @@
+import { jsx as e, jsxs as p, Fragment as g } from "react/jsx-runtime";
+import { c as f } from "../../clsx-OuTLNxxd.js";
+import { T as _ } from "../../tooltip-oCp-elli.js";
+import { Text as b } from "../text/text.js";
+import { View as h } from "../view/view.js";
+import { Icon as u } from "../icon/icon.js";
+import { u as x } from "../../useRender-C3vlzS3t.js";
+import { m as y } from "../../useRenderElement-DngNDu_P.js";
+import '../../badge.css';const T = "_badge_184a8_2", j = "_badge_shiny_184a8_17", m = {
+  badge: T,
+  badge_shiny: j
+};
+function V({
+  icon: r,
+  name: t,
+  color: n,
+  shiny: a,
+  tagline: o,
+  render: i,
+  className: d,
+  ...l
+}) {
+  const c = x({
+    defaultTagName: "span",
+    render: i,
+    props: y(l, {
+      className: f(
+        m.badge,
+        a && m.badge_shiny,
+        d
+      ),
+      children: /* @__PURE__ */ p(g, { children: [
+        r ? /* @__PURE__ */ e(u, { name: r }) : null,
+        t
+      ] })
+    })
+  }), s = /* @__PURE__ */ e(h, { color: n, children: c });
+  return o ? /* @__PURE__ */ e(_, { trigger: s, children: /* @__PURE__ */ e(b, { size: "sm", multiline: !0, children: o }) }) : s;
+}
+export {
+  V as Badge
+};

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

@@ -1,16 +1 @@
-import { useRender } from '@base-ui/react';
-import { IconName } from '../icon/icon-names';
-import { Color } from '../view';
-export interface BadgeProps extends Omit<useRender.ComponentProps<"span">, "children"> {
-    /** Optional icon, goes before name */
-    icon?: IconName;
-    /** Name of badge to be displayed, goes after icon */
-    name: string;
-    /** Communicate purpose with color. Defaults to "primary". */
-    color?: Color;
-    /** Add shiny hover effect. */
-    shiny?: boolean;
-    /** Tagline of badge. */
-    tagline?: string;
-}
-export declare function Badge({ icon, name, color, shiny, tagline, render, className, ...props }: BadgeProps): import("react/jsx-runtime").JSX.Element;
+export { Badge } from './badge';

package/dist/components/badge/index.js

@@ -1,43 +1,5 @@
 "use client";
-import { jsx as e, jsxs as g, Fragment as p } from "react/jsx-runtime";
-import { c as f } from "../../clsx-OuTLNxxd.js";
-import { Icon as u } from "../icon/index.js";
-import { Text as _ } from "../text/index.js";
-import { Tooltip as b } from "../tooltip/index.js";
-import { View as h } from "../view/index.js";
-import { u as x } from "../../useRender-CLx7dR_1.js";
-import { m as y } from "../../useRenderElement-DwToLA61.js";
-import '../../index8.css';const T = "_badge_sf2gl_1", j = "_badge_shiny_sf2gl_16", t = {
-  badge: T,
-  badge_shiny: j
-};
-function V({
-  icon: r,
-  name: m,
-  color: n,
-  shiny: i,
-  tagline: s,
-  render: a,
-  className: l,
-  ...d
-}) {
-  const c = x({
-    defaultTagName: "span",
-    render: a,
-    props: y(d, {
-      className: f(
-        t.badge,
-        i && t.badge_shiny,
-        l
-      ),
-      children: /* @__PURE__ */ g(p, { children: [
-        r ? /* @__PURE__ */ e(u, { name: r }) : null,
-        m
-      ] })
-    })
-  }), o = /* @__PURE__ */ e(h, { color: n, children: c });
-  return s ? /* @__PURE__ */ e(b, { trigger: o, children: /* @__PURE__ */ e(_, { size: "sm", multiline: !0, children: s }) }) : o;
-}
+import { Badge as r } from "./badge.js";
 export {
-  V as Badge
+  r as Badge
 };

package/dist/components/button/button.d.ts

@@ -0,0 +1,27 @@
+import { Size } from '../../styles/tokens';
+import { Icon } from '../icon';
+import { View } from '../view';
+interface ButtonProps extends View.Props<"button"> {
+    /**
+     * Size of the button
+     */
+    size?: Size;
+    /**
+     * Icon to display on the left side of the button content
+     */
+    leftIcon?: Icon.Name;
+    /**
+     * Icon to display on the right side of the button content
+     */
+    rightIcon?: Icon.Name;
+    /**
+     * The button can remain keyboard accessible while being rendered as another tag
+     * {@link https://base-ui.com/react/components/button}
+     */
+    nativeButton?: boolean;
+}
+declare function Button({ size, leftIcon, rightIcon, children, render, ...props }: ButtonProps): import("react/jsx-runtime").JSX.Element;
+export { Button };
+export declare namespace Button {
+    type Props = ButtonProps;
+}

package/dist/components/button/button.js

@@ -0,0 +1,47 @@
+import { jsxs as l, jsx as _ } from "react/jsx-runtime";
+import { c as g } from "../../clsx-OuTLNxxd.js";
+import { textify as m } from "../../-utils.js";
+import { View as r } from "../view/view.js";
+import { Icon as e } from "../icon/icon.js";
+import { B as s } from "../../Button-BmcVHRRW.js";
+import '../../button.css';const c = "_button_y8f8w_2", f = "_button_height_sm_y8f8w_15", x = "_button_height_md_y8f8w_20", a = "_button_height_lg_y8f8w_25", y = "_button_height_xl_y8f8w_30", d = "_button_height_2xl_y8f8w_35", w = "_button_height_3xl_y8f8w_40", i = {
+  button: c,
+  button_height_sm: f,
+  button_height_md: x,
+  button_height_lg: a,
+  button_height_xl: y,
+  button_height_2xl: d,
+  button_height_3xl: w
+};
+function N({
+  size: t = "md",
+  leftIcon: o,
+  rightIcon: n,
+  children: u,
+  render: b,
+  ...h
+}) {
+  return /* @__PURE__ */ l(
+    r,
+    {
+      interactive: !0,
+      render: /* @__PURE__ */ _(
+        s,
+        {
+          className: g(i.button, i[`button_height_${t}`]),
+          focusableWhenDisabled: !!h.loading,
+          render: b
+        }
+      ),
+      ...h,
+      children: [
+        o ? /* @__PURE__ */ _(e, { name: o, size: t }) : null,
+        m(u, { size: t, color: "inherit" }),
+        n ? /* @__PURE__ */ _(e, { name: n, size: t }) : null
+      ]
+    }
+  );
+}
+export {
+  N as Button
+};

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

@@ -1,24 +1 @@
-import { ComponentProps } from 'react';
-import { Size } from '../../styles/tokens';
-import { IconName } from '../icon/icon-names';
-import { ViewProps } from '../view';
-export type ButtonProps = ComponentProps<"button"> & ViewProps<"button"> & {
-    /**
-     * Size of the button
-     */
-    size?: Size;
-    /**
-     * Icon to display on the left side of the button content
-     */
-    leftIcon?: IconName;
-    /**
-     * Icon to display on the right side of the button content
-     */
-    rightIcon?: IconName;
-    /**
-     * The button can remain keyboard accessible while being rendered as another tag
-     * {@link https://base-ui.com/react/components/button}
-     */
-    nativeButton?: boolean;
-};
-export declare function Button({ size, leftIcon, rightIcon, children, render, ...props }: ButtonProps): import("react/jsx-runtime").JSX.Element;
+export { Button } from './button';

package/dist/components/button/index.js

@@ -1,48 +1,5 @@
 "use client";
-import { jsxs as b, jsx as _ } from "react/jsx-runtime";
-import { c as l } from "../../clsx-OuTLNxxd.js";
-import { textify as g } from "../../-utils.js";
-import { Icon as e } from "../icon/index.js";
-import { View as m } from "../view/index.js";
-import { B as r } from "../../Button-DrPFFzo7.js";
-import '../../index9.css';const a = "_button_14saj_1", c = "_button_height_sm_14saj_14", x = "_button_height_md_14saj_19", j = "_button_height_lg_14saj_24", d = "_button_height_xl_14saj_29", f = "_button_height_2xl_14saj_34", p = "_button_height_3xl_14saj_39", i = {
-  button: a,
-  button_height_sm: c,
-  button_height_md: x,
-  button_height_lg: j,
-  button_height_xl: d,
-  button_height_2xl: f,
-  button_height_3xl: p
-};
-function N({
-  size: t = "md",
-  leftIcon: o,
-  rightIcon: n,
-  children: u,
-  render: s,
-  ...h
-}) {
-  return /* @__PURE__ */ b(
-    m,
-    {
-      interactive: !0,
-      render: /* @__PURE__ */ _(
-        r,
-        {
-          className: l(i.button, i[`button_height_${t}`]),
-          focusableWhenDisabled: !!h.loading,
-          render: s
-        }
-      ),
-      ...h,
-      children: [
-        o ? /* @__PURE__ */ _(e, { name: o, size: t }) : null,
-        g(u, { size: t, color: "inherit" }),
-        n ? /* @__PURE__ */ _(e, { name: n, size: t }) : null
-      ]
-    }
-  );
-}
+import { Button as o } from "./button.js";
 export {
-  N as Button
+  o as Button
 };

package/dist/components/checkbox/checkbox.d.ts

@@ -0,0 +1,13 @@
+import { Checkbox as CheckboxPrimitive } from '@base-ui/react/checkbox';
+import { Color } from '../view';
+interface CheckboxProps extends CheckboxPrimitive.Root.Props {
+    /** Optional color for checkbox. Defaults to "primary". */
+    color?: Color;
+    /** Optional label. If one is provided, we wrap radio in a label element. Otherwise, we just return a standard radio. */
+    label?: string;
+}
+declare function Checkbox({ color, label, ...props }: CheckboxProps): import("react/jsx-runtime").JSX.Element;
+export { Checkbox };
+export declare namespace Checkbox {
+    type Props = CheckboxProps;
+}