@gobolt/genesis 0.0.7

package/dist/components/atoms/input/styles.js

@@ -0,0 +1,415 @@
+import { d as fe } from "../../../styled-components.browser.esm-CZ1XM4o4.js";
+import * as o from "react";
+import { useContext as Z, useMemo as de, useState as pe, useRef as me } from "react";
+import { C as q, c as H, A as te, m as ge, n as Ce, B as ye, k as ee, H as ve, _ as oe, F as be, G as se } from "../../../index-BWys7dkb.js";
+import { F as X, u as Oe } from "../../../context-CZsFJmh6.js";
+import { u as he, i as xe, a as Ee, I as Q, b as Ie, T as Pe } from "../../../TextArea-3MOYYuAQ.js";
+import { p as Se, R as we } from "../../../SearchOutlined-DuzJkIiQ.js";
+import { g as _e } from "../../../useVariants-CEpw6Ww6.js";
+import { a as re, b as ze } from "../../../Compact-CJBo3f0u.js";
+import { I as ae } from "../../../AntdIcon-Bsnbyy6g.js";
+import { o as Ne } from "../../../isVisible-CNQjrJPN.js";
+import { c as ne } from "../../../reactNode-sKPeiqPL.js";
+import { B as je } from "../../../button-BNV2qdrP.js";
+const $e = (e) => {
+  const {
+    getPrefixCls: s,
+    direction: r
+  } = Z(q), {
+    prefixCls: n,
+    className: t
+  } = e, u = s("input-group", n), v = s("input"), [g, b] = he(v), O = H(u, {
+    [`${u}-lg`]: e.size === "large",
+    [`${u}-sm`]: e.size === "small",
+    [`${u}-compact`]: e.compact,
+    [`${u}-rtl`]: r === "rtl"
+  }, b, t), C = Z(X), m = de(() => Object.assign(Object.assign({}, C), {
+    isFormItemInput: !1
+  }), [C]);
+  return process.env.NODE_ENV !== "production" && te("Input.Group").deprecated(!1, "Input.Group", "Space.Compact"), g(/* @__PURE__ */ o.createElement("span", {
+    className: O,
+    style: e.style,
+    onMouseEnter: e.onMouseEnter,
+    onMouseLeave: e.onMouseLeave,
+    onFocus: e.onFocus,
+    onBlur: e.onBlur
+  }, /* @__PURE__ */ o.createElement(X.Provider, {
+    value: m
+  }, e.children)));
+}, Re = (e) => {
+  const {
+    componentCls: s,
+    paddingXS: r
+  } = e;
+  return {
+    [s]: {
+      display: "inline-flex",
+      alignItems: "center",
+      flexWrap: "nowrap",
+      columnGap: r,
+      "&-rtl": {
+        direction: "rtl"
+      },
+      [`${s}-input`]: {
+        textAlign: "center",
+        paddingInline: e.paddingXXS
+      },
+      // ================= Size =================
+      [`&${s}-sm ${s}-input`]: {
+        paddingInline: e.calc(e.paddingXXS).div(2).equal()
+      },
+      [`&${s}-lg ${s}-input`]: {
+        paddingInline: e.paddingXS
+      }
+    }
+  };
+}, ke = ge(["Input", "OTP"], (e) => {
+  const s = Ce(e, xe(e));
+  return [Re(s)];
+}, Ee);
+var Ae = function(e, s) {
+  var r = {};
+  for (var n in e) Object.prototype.hasOwnProperty.call(e, n) && s.indexOf(n) < 0 && (r[n] = e[n]);
+  if (e != null && typeof Object.getOwnPropertySymbols == "function") for (var t = 0, n = Object.getOwnPropertySymbols(e); t < n.length; t++)
+    s.indexOf(n[t]) < 0 && Object.prototype.propertyIsEnumerable.call(e, n[t]) && (r[n[t]] = e[n[t]]);
+  return r;
+};
+const Me = /* @__PURE__ */ o.forwardRef((e, s) => {
+  const {
+    value: r,
+    onChange: n,
+    onActiveChange: t,
+    index: u,
+    mask: v
+  } = e, g = Ae(e, ["value", "onChange", "onActiveChange", "index", "mask"]), b = r && typeof v == "string" ? v : r, O = (f) => {
+    n(u, f.target.value);
+  }, C = o.useRef(null);
+  o.useImperativeHandle(s, () => C.current);
+  const m = () => {
+    ye(() => {
+      var f;
+      const y = (f = C.current) === null || f === void 0 ? void 0 : f.input;
+      document.activeElement === y && y && y.select();
+    });
+  }, w = (f) => {
+    const {
+      key: y,
+      ctrlKey: R,
+      metaKey: k
+    } = f;
+    y === "ArrowLeft" ? t(u - 1) : y === "ArrowRight" ? t(u + 1) : y === "z" && (R || k) && f.preventDefault(), m();
+  }, P = (f) => {
+    f.key === "Backspace" && !r && t(u - 1), m();
+  };
+  return /* @__PURE__ */ o.createElement(Q, Object.assign({
+    type: v === !0 ? "password" : "text"
+  }, g, {
+    ref: C,
+    value: b,
+    onInput: O,
+    onFocus: m,
+    onKeyDown: w,
+    onKeyUp: P,
+    onMouseDown: m,
+    onMouseUp: m
+  }));
+});
+var Te = function(e, s) {
+  var r = {};
+  for (var n in e) Object.prototype.hasOwnProperty.call(e, n) && s.indexOf(n) < 0 && (r[n] = e[n]);
+  if (e != null && typeof Object.getOwnPropertySymbols == "function") for (var t = 0, n = Object.getOwnPropertySymbols(e); t < n.length; t++)
+    s.indexOf(n[t]) < 0 && Object.prototype.propertyIsEnumerable.call(e, n[t]) && (r[n[t]] = e[n[t]]);
+  return r;
+};
+function U(e) {
+  return (e || "").split("");
+}
+const De = /* @__PURE__ */ o.forwardRef((e, s) => {
+  const {
+    prefixCls: r,
+    length: n = 6,
+    size: t,
+    defaultValue: u,
+    value: v,
+    onChange: g,
+    formatter: b,
+    variant: O,
+    disabled: C,
+    status: m,
+    autoFocus: w,
+    mask: P,
+    type: f,
+    onInput: y,
+    inputMode: R
+  } = e, k = Te(e, ["prefixCls", "length", "size", "defaultValue", "value", "onChange", "formatter", "variant", "disabled", "status", "autoFocus", "mask", "type", "onInput", "inputMode"]);
+  if (process.env.NODE_ENV !== "production") {
+    const a = te("Input.OTP");
+    process.env.NODE_ENV !== "production" && a(!(typeof P == "string" && P.length > 1), "usage", "`mask` prop should be a single character.");
+  }
+  const {
+    getPrefixCls: _,
+    direction: z
+  } = o.useContext(q), E = _("otp", r), B = Se(k, {
+    aria: !0,
+    data: !0,
+    attr: !0
+  }), S = Oe(E), [A, F, M] = ke(E, S), h = re((a) => t ?? a), N = o.useContext(X), j = _e(N.status, m), T = o.useMemo(() => Object.assign(Object.assign({}, N), {
+    status: j,
+    hasFeedback: !1,
+    feedbackIcon: null
+  }), [N, j]), I = o.useRef(null), x = o.useRef({});
+  o.useImperativeHandle(s, () => ({
+    focus: () => {
+      var a;
+      (a = x.current[0]) === null || a === void 0 || a.focus();
+    },
+    blur: () => {
+      var a;
+      for (let l = 0; l < n; l += 1)
+        (a = x.current[l]) === null || a === void 0 || a.blur();
+    },
+    nativeElement: I.current
+  }));
+  const L = (a) => b ? b(a) : a, [G, K] = o.useState(U(L(u || "")));
+  o.useEffect(() => {
+    v !== void 0 && K(U(v));
+  }, [v]);
+  const W = ee((a) => {
+    K(a), y && y(a), g && a.length === n && a.every((l) => l) && a.some((l, c) => G[c] !== l) && g(a.join(""));
+  }), J = ee((a, l) => {
+    let c = ve(G);
+    for (let p = 0; p < a; p += 1)
+      c[p] || (c[p] = "");
+    l.length <= 1 ? c[a] = l : c = c.slice(0, a).concat(U(l)), c = c.slice(0, n);
+    for (let p = c.length - 1; p >= 0 && !c[p]; p -= 1)
+      c.pop();
+    const D = L(c.map((p) => p || " ").join(""));
+    return c = U(D).map((p, Y) => p === " " && !c[Y] ? c[Y] : p), c;
+  }), i = (a, l) => {
+    var c;
+    const D = J(a, l), p = Math.min(a + l.length, n - 1);
+    p !== a && D[a] !== void 0 && ((c = x.current[p]) === null || c === void 0 || c.focus()), W(D);
+  }, d = (a) => {
+    var l;
+    (l = x.current[a]) === null || l === void 0 || l.focus();
+  }, $ = {
+    variant: O,
+    disabled: C,
+    status: j,
+    mask: P,
+    type: f,
+    inputMode: R
+  };
+  return A(/* @__PURE__ */ o.createElement("div", Object.assign({}, B, {
+    ref: I,
+    className: H(E, {
+      [`${E}-sm`]: h === "small",
+      [`${E}-lg`]: h === "large",
+      [`${E}-rtl`]: z === "rtl"
+    }, M, F)
+  }), /* @__PURE__ */ o.createElement(X.Provider, {
+    value: T
+  }, Array.from({
+    length: n
+  }).map((a, l) => {
+    const c = `otp-${l}`, D = G[l] || "";
+    return /* @__PURE__ */ o.createElement(Me, Object.assign({
+      ref: (p) => {
+        x.current[l] = p;
+      },
+      key: c,
+      index: l,
+      size: h,
+      htmlSize: 1,
+      className: `${E}-input`,
+      onChange: i,
+      value: D,
+      onActiveChange: d,
+      autoFocus: l === 0 && w
+    }, $));
+  }))));
+});
+var Ve = { icon: { tag: "svg", attrs: { viewBox: "64 64 896 896", focusable: "false" }, children: [{ tag: "path", attrs: { d: "M942.2 486.2Q889.47 375.11 816.7 305l-50.88 50.88C807.31 395.53 843.45 447.4 874.7 512 791.5 684.2 673.4 766 512 766q-72.67 0-133.87-22.38L323 798.75Q408 838 512 838q288.3 0 430.2-300.3a60.29 60.29 0 000-51.5zm-63.57-320.64L836 122.88a8 8 0 00-11.32 0L715.31 232.2Q624.86 186 512 186q-288.3 0-430.2 300.3a60.3 60.3 0 000 51.5q56.69 119.4 136.5 191.41L112.48 835a8 8 0 000 11.31L155.17 889a8 8 0 0011.31 0l712.15-712.12a8 8 0 000-11.32zM149.3 512C232.6 339.8 350.7 258 512 258c54.54 0 104.13 9.36 149.12 28.39l-70.3 70.3a176 176 0 00-238.13 238.13l-83.42 83.42C223.1 637.49 183.3 582.28 149.3 512zm246.7 0a112.11 112.11 0 01146.2-106.69L401.31 546.2A112 112 0 01396 512z" } }, { tag: "path", attrs: { d: "M508 624c-3.46 0-6.87-.16-10.25-.47l-52.82 52.82a176.09 176.09 0 00227.42-227.42l-52.82 52.82c.31 3.38.47 6.79.47 10.25a111.94 111.94 0 01-112 112z" } }] }, name: "eye-invisible", theme: "outlined" }, Be = function(s, r) {
+  return /* @__PURE__ */ o.createElement(ae, oe({}, s, {
+    ref: r,
+    icon: Ve
+  }));
+}, ie = /* @__PURE__ */ o.forwardRef(Be);
+process.env.NODE_ENV !== "production" && (ie.displayName = "EyeInvisibleOutlined");
+var Fe = { icon: { tag: "svg", attrs: { viewBox: "64 64 896 896", focusable: "false" }, children: [{ tag: "path", attrs: { d: "M942.2 486.2C847.4 286.5 704.1 186 512 186c-192.2 0-335.4 100.5-430.2 300.3a60.3 60.3 0 000 51.5C176.6 737.5 319.9 838 512 838c192.2 0 335.4-100.5 430.2-300.3 7.7-16.2 7.7-35 0-51.5zM512 766c-161.3 0-279.4-81.8-362.7-254C232.6 339.8 350.7 258 512 258c161.3 0 279.4 81.8 362.7 254C791.5 684.2 673.4 766 512 766zm-4-430c-97.2 0-176 78.8-176 176s78.8 176 176 176 176-78.8 176-176-78.8-176-176-176zm0 288c-61.9 0-112-50.1-112-112s50.1-112 112-112 112 50.1 112 112-50.1 112-112 112z" } }] }, name: "eye", theme: "outlined" }, Le = function(s, r) {
+  return /* @__PURE__ */ o.createElement(ae, oe({}, s, {
+    ref: r,
+    icon: Fe
+  }));
+}, le = /* @__PURE__ */ o.forwardRef(Le);
+process.env.NODE_ENV !== "production" && (le.displayName = "EyeOutlined");
+var Ge = function(e, s) {
+  var r = {};
+  for (var n in e) Object.prototype.hasOwnProperty.call(e, n) && s.indexOf(n) < 0 && (r[n] = e[n]);
+  if (e != null && typeof Object.getOwnPropertySymbols == "function") for (var t = 0, n = Object.getOwnPropertySymbols(e); t < n.length; t++)
+    s.indexOf(n[t]) < 0 && Object.prototype.propertyIsEnumerable.call(e, n[t]) && (r[n[t]] = e[n[t]]);
+  return r;
+};
+const Ke = (e) => e ? /* @__PURE__ */ o.createElement(le, null) : /* @__PURE__ */ o.createElement(ie, null), Ue = {
+  click: "onClick",
+  hover: "onMouseOver"
+}, ce = /* @__PURE__ */ o.forwardRef((e, s) => {
+  const {
+    disabled: r,
+    action: n = "click",
+    visibilityToggle: t = !0,
+    iconRender: u = Ke
+  } = e, v = o.useContext(be), g = r ?? v, b = typeof t == "object" && t.visible !== void 0, [O, C] = pe(() => b ? t.visible : !1), m = me(null);
+  o.useEffect(() => {
+    b && C(t.visible);
+  }, [b, t]);
+  const w = Ie(m), P = () => {
+    var h;
+    if (g)
+      return;
+    O && w();
+    const N = !O;
+    C(N), typeof t == "object" && ((h = t.onVisibleChange) === null || h === void 0 || h.call(t, N));
+  }, f = (h) => {
+    const N = Ue[n] || "", j = u(O), T = {
+      [N]: P,
+      className: `${h}-icon`,
+      key: "passwordIcon",
+      onMouseDown: (I) => {
+        I.preventDefault();
+      },
+      onMouseUp: (I) => {
+        I.preventDefault();
+      }
+    };
+    return /* @__PURE__ */ o.cloneElement(/* @__PURE__ */ o.isValidElement(j) ? j : /* @__PURE__ */ o.createElement("span", null, j), T);
+  }, {
+    className: y,
+    prefixCls: R,
+    inputPrefixCls: k,
+    size: _
+  } = e, z = Ge(e, ["className", "prefixCls", "inputPrefixCls", "size"]), {
+    getPrefixCls: E
+  } = o.useContext(q), B = E("input", k), S = E("input-password", R), A = t && f(S), F = H(S, y, {
+    [`${S}-${_}`]: !!_
+  }), M = Object.assign(Object.assign({}, Ne(z, ["suffix", "iconRender", "visibilityToggle"])), {
+    type: O ? "text" : "password",
+    className: F,
+    prefixCls: B,
+    suffix: A
+  });
+  return _ && (M.size = _), /* @__PURE__ */ o.createElement(Q, Object.assign({
+    ref: se(s, m)
+  }, M));
+});
+process.env.NODE_ENV !== "production" && (ce.displayName = "Input.Password");
+var Xe = function(e, s) {
+  var r = {};
+  for (var n in e) Object.prototype.hasOwnProperty.call(e, n) && s.indexOf(n) < 0 && (r[n] = e[n]);
+  if (e != null && typeof Object.getOwnPropertySymbols == "function") for (var t = 0, n = Object.getOwnPropertySymbols(e); t < n.length; t++)
+    s.indexOf(n[t]) < 0 && Object.prototype.propertyIsEnumerable.call(e, n[t]) && (r[n[t]] = e[n[t]]);
+  return r;
+};
+const ue = /* @__PURE__ */ o.forwardRef((e, s) => {
+  const {
+    prefixCls: r,
+    inputPrefixCls: n,
+    className: t,
+    size: u,
+    suffix: v,
+    enterButton: g = !1,
+    addonAfter: b,
+    loading: O,
+    disabled: C,
+    onSearch: m,
+    onChange: w,
+    onCompositionStart: P,
+    onCompositionEnd: f
+  } = e, y = Xe(e, ["prefixCls", "inputPrefixCls", "className", "size", "suffix", "enterButton", "addonAfter", "loading", "disabled", "onSearch", "onChange", "onCompositionStart", "onCompositionEnd"]), {
+    getPrefixCls: R,
+    direction: k
+  } = o.useContext(q), _ = o.useRef(!1), z = R("input-search", r), E = R("input", n), {
+    compactSize: B
+  } = ze(z, k), S = re((i) => {
+    var d;
+    return (d = u ?? B) !== null && d !== void 0 ? d : i;
+  }), A = o.useRef(null), F = (i) => {
+    i != null && i.target && i.type === "click" && m && m(i.target.value, i, {
+      source: "clear"
+    }), w == null || w(i);
+  }, M = (i) => {
+    var d;
+    document.activeElement === ((d = A.current) === null || d === void 0 ? void 0 : d.input) && i.preventDefault();
+  }, h = (i) => {
+    var d, $;
+    m && m(($ = (d = A.current) === null || d === void 0 ? void 0 : d.input) === null || $ === void 0 ? void 0 : $.value, i, {
+      source: "input"
+    });
+  }, N = (i) => {
+    _.current || O || h(i);
+  }, j = typeof g == "boolean" ? /* @__PURE__ */ o.createElement(we, null) : null, T = `${z}-button`;
+  let I;
+  const x = g || {}, L = x.type && x.type.__ANT_BUTTON === !0;
+  L || x.type === "button" ? I = ne(x, Object.assign({
+    onMouseDown: M,
+    onClick: (i) => {
+      var d, $;
+      ($ = (d = x == null ? void 0 : x.props) === null || d === void 0 ? void 0 : d.onClick) === null || $ === void 0 || $.call(d, i), h(i);
+    },
+    key: "enterButton"
+  }, L ? {
+    className: T,
+    size: S
+  } : {})) : I = /* @__PURE__ */ o.createElement(je, {
+    className: T,
+    type: g ? "primary" : void 0,
+    size: S,
+    disabled: C,
+    key: "enterButton",
+    onMouseDown: M,
+    onClick: h,
+    loading: O,
+    icon: j
+  }, g), b && (I = [I, ne(b, {
+    key: "addonAfter"
+  })]);
+  const G = H(z, {
+    [`${z}-rtl`]: k === "rtl",
+    [`${z}-${S}`]: !!S,
+    [`${z}-with-button`]: !!g
+  }, t), K = Object.assign(Object.assign({}, y), {
+    className: G,
+    prefixCls: E,
+    type: "search"
+  }), W = (i) => {
+    _.current = !0, P == null || P(i);
+  }, J = (i) => {
+    _.current = !1, f == null || f(i);
+  };
+  return /* @__PURE__ */ o.createElement(Q, Object.assign({
+    ref: se(A, s),
+    onPressEnter: N
+  }, K, {
+    size: S,
+    onCompositionStart: W,
+    onCompositionEnd: J,
+    addonAfter: I,
+    suffix: v,
+    onChange: F,
+    disabled: C
+  }));
+});
+process.env.NODE_ENV !== "production" && (ue.displayName = "Search");
+const V = Q;
+V.Group = $e;
+V.Search = ue;
+V.TextArea = Pe;
+V.Password = ce;
+V.OTP = De;
+const rn = fe(V)`
+  ${({ theme: e, type: s, variant: r, state: n, breakpoint: t }) => {
+}}
+`;
+export {
+  rn as Input
+};

package/dist/components/atoms/select/Select.d.ts

@@ -0,0 +1,11 @@
+import { default as React } from 'react';
+import { TYPE, STATE } from '../../../constants';
+import { SelectProps as AntSelectProps } from 'antd/es/button';
+
+export type GenesisSelectType = keyof typeof TYPE;
+export interface SelectProps extends AntSelectProps {
+    type?: GenesisSelectType;
+    state?: keyof typeof STATE;
+}
+declare const Select: React.FC<SelectProps>;
+export default Select;

package/dist/components/atoms/select/Select.js

@@ -0,0 +1,24 @@
+import { jsx as e } from "react/jsx-runtime";
+import { Select as d, SelectDropdown as m, StyledMenuItem as i } from "./styles.js";
+import { useBreakpoint as p } from "../../../providers/ThemeProvider.js";
+import { TYPE as l, STATE as s } from "../../../constants/index.js";
+const D = ({
+  type: o = l.primary,
+  state: r = s.active,
+  ...n
+}) => {
+  const t = p();
+  return /* @__PURE__ */ e(
+    d,
+    {
+      type: o,
+      state: r,
+      breakpoint: t,
+      dropdownRender: (c) => /* @__PURE__ */ e(m, { type: o, state: r, children: /* @__PURE__ */ e(i, { type: o, state: r, children: c }) }),
+      ...n
+    }
+  );
+};
+export {
+  D as default
+};

package/dist/components/atoms/select/__stories__/Select.stories.d.ts

@@ -0,0 +1,8 @@
+import { Meta, StoryObj } from '@storybook/react';
+import { default as Select } from '../Select';
+
+declare const meta: Meta<typeof Select>;
+export default meta;
+type Story = StoryObj<typeof Select>;
+export declare const Default: Story;
+export declare const DefaultValue: Story;

package/dist/components/atoms/select/__tests__/Select.test.d.ts

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