@bitrise/bitkit-v2 0.3.62 → 0.3.64

package/dist/components/BitkitField/BitkitField.js

@@ -2,8 +2,8 @@ import { jsxs as c, jsx as e } from "react/jsx-runtime";
 import { Field as t } from "@chakra-ui/react/field";
 import { Text as d } from "@chakra-ui/react/text";
 import { forwardRef as f } from "react";
-import u from "../BitkitTooltip/BitkitTooltip.js";
-import T from "../../icons/16x16/IconInfoCircle16.js";
+import u from "../../icons/16x16/IconInfoCircle16.js";
+import T from "../BitkitTooltip/BitkitTooltip.js";
 const y = f((x, m) => {
   const { counterText: o, children: h, errorText: r, helperText: l, label: n, optional: p, tooltip: a, warningText: i, ...s } = x;
   return /* @__PURE__ */ c(t.Root, { required: !p, ref: m, ...s, children: [
@@ -16,7 +16,7 @@ const y = f((x, m) => {
           fallback: /* @__PURE__ */ e(d, { as: "span", color: "input/text/helper", textStyle: "body/md/regular", children: "(optional)" })
         }
       ),
-      !!a && /* @__PURE__ */ e(u, { text: a ?? "", children: /* @__PURE__ */ e(T, { color: "icon/tertiary" }) }),
+      !!a && /* @__PURE__ */ e(T, { text: a ?? "", children: /* @__PURE__ */ e(u, { color: "icon/tertiary" }) }),
       o && /* @__PURE__ */ e(d, { as: "span", color: "input/text/helper", marginInlineStart: "auto", textStyle: "comp/input/helperText", children: o })
     ] }) : null,
     h,

package/dist/components/BitkitNumberInput/BitkitNumberInput.js

@@ -2,15 +2,15 @@ import { jsx as r, jsxs as c } from "react/jsx-runtime";
 import { Box as w } from "@chakra-ui/react/box";
 import { NumberInput as i } from "@chakra-ui/react/number-input";
 import { forwardRef as b } from "react";
-import { triggerSeparatorStyle as v } from "../../theme/slot-recipes/NumberInput.recipe.js";
-import { rem as y } from "../../theme/themeUtils.js";
-import T from "../BitkitField/BitkitField.js";
-import B from "../../icons/16x16/IconMinus16.js";
-import C from "../../icons/16x16/IconPlus16.js";
-import N from "../../icons/24x24/IconErrorCircleFilled24.js";
-import j from "../../icons/16x16/IconErrorCircleFilled16.js";
-import k from "../../icons/24x24/IconWarningYellow24.js";
-import F from "../../icons/16x16/IconWarningYellow16.js";
+import v from "../../icons/16x16/IconErrorCircleFilled16.js";
+import y from "../../icons/16x16/IconMinus16.js";
+import T from "../../icons/16x16/IconPlus16.js";
+import B from "../../icons/16x16/IconWarningYellow16.js";
+import C from "../../icons/24x24/IconErrorCircleFilled24.js";
+import N from "../../icons/24x24/IconWarningYellow24.js";
+import { triggerSeparatorStyle as j } from "../../theme/slot-recipes/NumberInput.recipe.js";
+import { rem as k } from "../../theme/themeUtils.js";
+import F from "../BitkitField/BitkitField.js";
 const W = b((a, d) => {
   const {
     defaultValue: p,
@@ -26,8 +26,8 @@ const W = b((a, d) => {
     ...h
   } = a, x = e === "warning" || !!l, m = e === "error" || !!t;
   let o;
-  return m ? o = n === "lg" ? /* @__PURE__ */ r(N, { color: "icon/negative" }) : /* @__PURE__ */ r(j, { color: "icon/negative" }) : x && (o = n === "lg" ? /* @__PURE__ */ r(k, { color: "icon/warning" }) : /* @__PURE__ */ r(F, { color: "icon/warning" })), /* @__PURE__ */ r(
-    T,
+  return m ? o = n === "lg" ? /* @__PURE__ */ r(C, { color: "icon/negative" }) : /* @__PURE__ */ r(v, { color: "icon/negative" }) : x && (o = n === "lg" ? /* @__PURE__ */ r(N, { color: "icon/warning" }) : /* @__PURE__ */ r(B, { color: "icon/warning" })), /* @__PURE__ */ r(
+    F,
     {
       disabled: e === "disabled",
       errorText: t,
@@ -43,15 +43,15 @@ const W = b((a, d) => {
       children: /* @__PURE__ */ c(
         i.Root,
         {
-          css: o ? { "--control-width": y(150) } : void 0,
+          css: o ? { "--control-width": k(150) } : void 0,
           defaultValue: p,
           size: n,
           ...f,
           children: [
             /* @__PURE__ */ c(i.Control, { children: [
               o && /* @__PURE__ */ r(w, { paddingInline: "12px", display: "flex", alignItems: "center", justifyContent: "center", children: o }),
-              /* @__PURE__ */ r(i.DecrementTrigger, { _before: o ? v : void 0, children: /* @__PURE__ */ r(B, {}) }),
-              /* @__PURE__ */ r(i.IncrementTrigger, { children: /* @__PURE__ */ r(C, {}) })
+              /* @__PURE__ */ r(i.DecrementTrigger, { _before: o ? j : void 0, children: /* @__PURE__ */ r(y, {}) }),
+              /* @__PURE__ */ r(i.IncrementTrigger, { children: /* @__PURE__ */ r(T, {}) })
             ] }),
             /* @__PURE__ */ r(i.Input, {})
           ]

package/dist/components/BitkitTextField/BitkitTextField.js

@@ -2,12 +2,12 @@ import { jsx as r } from "react/jsx-runtime";
 import { Input as T } from "@chakra-ui/react/input";
 import { InputGroup as E } from "@chakra-ui/react/input-group";
 import { forwardRef as F } from "react";
-import { rem as m } from "../../theme/themeUtils.js";
-import b from "../BitkitField/BitkitField.js";
-import k from "../../icons/24x24/IconErrorCircleFilled24.js";
-import y from "../../icons/16x16/IconErrorCircleFilled16.js";
+import b from "../../icons/16x16/IconErrorCircleFilled16.js";
+import k from "../../icons/16x16/IconWarningYellow16.js";
+import y from "../../icons/24x24/IconErrorCircleFilled24.js";
 import B from "../../icons/24x24/IconWarningYellow24.js";
-import W from "../../icons/16x16/IconWarningYellow16.js";
+import { rem as m } from "../../theme/themeUtils.js";
+import W from "../BitkitField/BitkitField.js";
 const C = F((c, p) => {
   const {
     counter: s,
@@ -25,10 +25,10 @@ const C = F((c, p) => {
     ...I
   } = c, h = i === "warning" || !!a, d = i === "error" || !!l;
   let t;
-  d ? t = o === "lg" ? /* @__PURE__ */ r(k, { color: "icon/negative" }) : /* @__PURE__ */ r(y, { color: "icon/negative" }) : h && (t = o === "lg" ? /* @__PURE__ */ r(B, { color: "icon/warning" }) : /* @__PURE__ */ r(W, { color: "icon/warning" }));
+  d ? t = o === "lg" ? /* @__PURE__ */ r(y, { color: "icon/negative" }) : /* @__PURE__ */ r(b, { color: "icon/negative" }) : h && (t = o === "lg" ? /* @__PURE__ */ r(B, { color: "icon/warning" }) : /* @__PURE__ */ r(k, { color: "icon/warning" }));
   const w = s && n && e?.value !== void 0 ? `${e.value.toString().length}/${n}` : void 0;
   return /* @__PURE__ */ r(
-    b,
+    W,
     {
       counterText: w,
       disabled: i === "disabled",

package/dist/components/BitkitToggle/BitkitToggle.d.ts

@@ -0,0 +1,3 @@
+import { BitkitToggleProps } from './BitkitToggle.types';
+declare const BitkitToggle: import('react').ForwardRefExoticComponent<BitkitToggleProps & import('react').RefAttributes<HTMLInputElement>>;
+export default BitkitToggle;

package/dist/components/BitkitToggle/BitkitToggle.js

@@ -0,0 +1,80 @@
+import { jsx as e, jsxs as c } from "react/jsx-runtime";
+import { Box as f } from "@chakra-ui/react/box";
+import { Skeleton as b } from "@chakra-ui/react/skeleton";
+import { useSlotRecipe as y } from "@chakra-ui/react/styled-system";
+import { Switch as i } from "@chakra-ui/react/switch";
+import { forwardRef as g } from "react";
+import T from "../../icons/16x16/IconCheck16.js";
+import x from "../../icons/16x16/IconCross16.js";
+import I from "../../icons/24x24/IconCheck24.js";
+import B from "../../icons/24x24/IconCross24.js";
+import C from "./components/BitkitToggleHelperText.js";
+import R from "./components/BitkitToggleLabel.js";
+import w from "./components/BitkitToggleReadOnly.js";
+import j from "./components/BitkitToggleValueText.js";
+const L = g(
+  (a, s) => {
+    const { label: l, optional: r, tooltip: m, helperText: d, valueText: n, size: t = "md", state: o = "default", ...k } = a, p = y({ key: "switch" })({ size: t }), h = t === "sm" ? x : B, D = t === "sm" ? T : I;
+    return /* @__PURE__ */ c(
+      i.Root,
+      {
+        gap: "4",
+        size: t,
+        required: !r,
+        flexDirection: "column",
+        alignItems: "flex-start",
+        readOnly: o === "readOnly",
+        disabled: o === "disabled" || o === "disabledInput" || o === "skeleton",
+        ...k,
+        children: [
+          /* @__PURE__ */ e(i.HiddenInput, { ref: s }),
+          /* @__PURE__ */ e(R, { label: l, state: o, tooltip: m, optional: r }),
+          /* @__PURE__ */ c(f, { css: p.root, children: [
+            /* @__PURE__ */ e(w, { state: o, children: /* @__PURE__ */ e(b, { loading: o === "skeleton", borderRadius: "12", height: t === "sm" ? "16" : "24", children: /* @__PURE__ */ c(i.Control, { children: [
+              /* @__PURE__ */ e(i.Thumb, {}),
+              /* @__PURE__ */ e(i.Indicator, { fallback: /* @__PURE__ */ e(h, {}), children: /* @__PURE__ */ e(D, {}) })
+            ] }) }) }),
+            /* @__PURE__ */ e(j, { size: t, state: o, valueText: n })
+          ] }),
+          /* @__PURE__ */ e(C, { state: o, helperText: d })
+        ]
+      }
+    );
+  }
+);
+L.displayName = "BitkitToggleDynamicLabel";
+const O = g((a, s) => {
+  const { label: l, optional: r, tooltip: m, helperText: d, size: n = "sm", state: t = "default", ...o } = a, u = y({ key: "switch" })({ size: n }), p = n === "sm" ? x : B, h = n === "sm" ? T : I;
+  return /* @__PURE__ */ c(
+    i.Root,
+    {
+      size: n,
+      display: "flex",
+      required: !r,
+      justifyContent: "space-between",
+      readOnly: t === "readOnly",
+      disabled: t === "disabled" || t === "disabledInput" || t === "skeleton",
+      ...o,
+      children: [
+        /* @__PURE__ */ e(i.HiddenInput, { ref: s }),
+        (l || d) && /* @__PURE__ */ c(f, { display: "flex", flexDirection: "column", gap: "4", mr: "24", children: [
+          /* @__PURE__ */ e(R, { label: l, state: t, tooltip: m, optional: r }),
+          /* @__PURE__ */ e(C, { state: t, helperText: d })
+        ] }),
+        /* @__PURE__ */ e(f, { css: u.root, children: /* @__PURE__ */ e(w, { state: t, children: /* @__PURE__ */ e(b, { loading: t === "skeleton", borderRadius: "12", height: n === "sm" ? "16" : "24", children: /* @__PURE__ */ c(i.Control, { children: [
+          /* @__PURE__ */ e(i.Thumb, {}),
+          /* @__PURE__ */ e(i.Indicator, { fallback: /* @__PURE__ */ e(p, {}), children: /* @__PURE__ */ e(h, {}) })
+        ] }) }) }) })
+      ]
+    }
+  );
+});
+O.displayName = "BitkitToggleFixedLabel";
+const v = g((a, s) => {
+  const { variant: l, ...r } = a;
+  return l === "dynamic-label" || l === void 0 ? /* @__PURE__ */ e(L, { ref: s, ...r }) : /* @__PURE__ */ e(O, { ref: s, ...r });
+});
+v.displayName = "BitkitToggle";
+export {
+  v as default
+};

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

@@ -0,0 +1,22 @@
+import { SwitchRootProps } from '@chakra-ui/react/switch';
+import { ReactNode } from 'react';
+export type OnOff = {
+    on: ReactNode;
+    off: ReactNode;
+};
+export interface BitkitToggleDynamicLabelProps extends Omit<SwitchRootProps, 'disabled' | 'readOnly' | 'required'> {
+    variant?: 'dynamic-label';
+    tooltip?: string;
+    optional?: boolean;
+    valueText?: ReactNode | OnOff;
+    helperText?: ReactNode | OnOff;
+    state?: 'default' | 'disabled' | 'disabledInput' | 'readOnly' | 'skeleton';
+}
+export interface BitkitToggleFixedLabelProps extends Omit<SwitchRootProps, 'disabled' | 'readOnly' | 'required'> {
+    variant?: 'fixed-label';
+    tooltip?: string;
+    optional?: boolean;
+    helperText?: ReactNode | OnOff;
+    state?: 'default' | 'disabled' | 'disabledInput' | 'readOnly' | 'skeleton';
+}
+export type BitkitToggleProps = BitkitToggleDynamicLabelProps | BitkitToggleFixedLabelProps;

package/dist/components/BitkitToggle/BitkitToggle.utils.d.ts

@@ -0,0 +1,3 @@
+import { ReactNode } from 'react';
+import { OnOff } from './BitkitToggle.types';
+export declare function isOnOff(obj: ReactNode | OnOff): obj is OnOff;

package/dist/components/BitkitToggle/BitkitToggle.utils.js

@@ -0,0 +1,6 @@
+function f(n) {
+  return typeof n == "object" && n !== null && "on" in n && "off" in n;
+}
+export {
+  f as isOnOff
+};

package/dist/components/BitkitToggle/components/BitkitToggleHelperText.d.ts

@@ -0,0 +1,3 @@
+import { BitkitToggleProps } from '../BitkitToggle.types';
+declare const BitkitToggleHelperText: ({ state, helperText }: Pick<BitkitToggleProps, "state" | "helperText">) => import("react/jsx-runtime").JSX.Element | null;
+export default BitkitToggleHelperText;

package/dist/components/BitkitToggle/components/BitkitToggleHelperText.js

@@ -0,0 +1,20 @@
+import { jsx as o } from "react/jsx-runtime";
+import { Skeleton as l } from "@chakra-ui/react/skeleton";
+import { useSwitchContext as d } from "@chakra-ui/react/switch";
+import { Text as r } from "@chakra-ui/react/text";
+import { isOnOff as f } from "../BitkitToggle.utils.js";
+const b = ({ state: e, helperText: t }) => {
+  const { checked: n, disabled: s } = d();
+  if (e === "skeleton")
+    return /* @__PURE__ */ o(l, { height: "12", width: "128", my: "2" });
+  if (!t)
+    return null;
+  const i = {
+    textStyle: "comp/input/helperText",
+    color: s && e !== "disabledInput" ? "text/disabled" : "input/text/helper"
+  };
+  return f(t) ? /* @__PURE__ */ o(r, { ...i, children: n ? t.on : t.off }) : /* @__PURE__ */ o(r, { ...i, children: t });
+};
+export {
+  b as default
+};

package/dist/components/BitkitToggle/components/BitkitToggleLabel.d.ts

@@ -0,0 +1,3 @@
+import { BitkitToggleProps } from '../BitkitToggle.types';
+declare const BitkitToggleLabel: ({ label, state, tooltip, optional, }: Pick<BitkitToggleProps, "label" | "state" | "tooltip" | "optional">) => import("react/jsx-runtime").JSX.Element | null;
+export default BitkitToggleLabel;

package/dist/components/BitkitToggle/components/BitkitToggleLabel.js

@@ -0,0 +1,33 @@
+import { jsxs as s, jsx as t } from "react/jsx-runtime";
+import { Flex as m } from "@chakra-ui/react/flex";
+import { useSwitchContext as a } from "@chakra-ui/react/switch";
+import { Text as l } from "@chakra-ui/react/text";
+import c from "../../../icons/16x16/IconInfoCircle16.js";
+import p from "../../BitkitTooltip/BitkitTooltip.js";
+const g = ({
+  label: e,
+  state: o,
+  tooltip: r,
+  optional: n
+}) => {
+  const { disabled: d } = a();
+  if (!e)
+    return null;
+  const i = d && o !== "disabledInput" && o !== "skeleton";
+  return /* @__PURE__ */ s(m, { gap: "4", alignItems: "center", children: [
+    /* @__PURE__ */ t(l, { as: "span", textStyle: "body/md/semibold", color: i ? "text/disabled" : "text/body", children: e }),
+    !!n && /* @__PURE__ */ t(
+      l,
+      {
+        as: "span",
+        textStyle: "body/md/regular",
+        color: i ? "text/disabled" : "input/text/helper",
+        children: "(optional)"
+      }
+    ),
+    !!r && /* @__PURE__ */ t(p, { text: r, children: /* @__PURE__ */ t(c, { color: "icon/tertiary" }) })
+  ] });
+};
+export {
+  g as default
+};

package/dist/components/BitkitToggle/components/BitkitToggleReadOnly.d.ts

@@ -0,0 +1,4 @@
+import { BitkitToggleProps } from '../BitkitToggle.types';
+type Props = Pick<BitkitToggleProps, 'state' | 'children'>;
+declare const BitkitToggleReadOnly: ({ state, children }: Props) => string | number | bigint | boolean | Iterable<import('react').ReactNode> | Promise<string | number | bigint | boolean | import('react').ReactPortal | import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>> | Iterable<import('react').ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element | null | undefined;
+export default BitkitToggleReadOnly;

package/dist/components/BitkitToggle/components/BitkitToggleReadOnly.js

@@ -0,0 +1,10 @@
+import { jsx as t } from "react/jsx-runtime";
+import { useSwitchContext as n } from "@chakra-ui/react";
+import i from "../../DataDisplay/BitkitBadge/BitkitBadge.js";
+const d = ({ state: e, children: o }) => {
+  const { checked: r } = n();
+  return e === "readOnly" && r ? /* @__PURE__ */ t(i, { colorScheme: "positive", variant: "subtle", children: "ON" }) : e === "readOnly" && !r ? /* @__PURE__ */ t(i, { colorScheme: "neutral", variant: "subtle", children: "OFF" }) : o;
+};
+export {
+  d as default
+};

package/dist/components/BitkitToggle/components/BitkitToggleValueText.d.ts

@@ -0,0 +1,3 @@
+import { BitkitToggleDynamicLabelProps } from '../BitkitToggle.types';
+declare const BitkitToggleValueText: ({ size, state, valueText, }: Pick<BitkitToggleDynamicLabelProps, "size" | "state" | "valueText">) => import("react/jsx-runtime").JSX.Element | null;
+export default BitkitToggleValueText;

package/dist/components/BitkitToggle/components/BitkitToggleValueText.js

@@ -0,0 +1,15 @@
+import { jsx as t } from "react/jsx-runtime";
+import { Skeleton as f } from "@chakra-ui/react/skeleton";
+import { useSwitchContext as m, Switch as i } from "@chakra-ui/react/switch";
+import { isOnOff as c } from "../BitkitToggle.utils.js";
+const p = ({
+  size: o,
+  state: n,
+  valueText: r
+}) => {
+  const { checked: e } = m();
+  return n === "skeleton" ? /* @__PURE__ */ t(f, { height: o === "sm" ? "12" : "16", width: o === "sm" ? "64" : "128" }) : r ? c(r) ? /* @__PURE__ */ t(i.Label, { children: e ? r.on : r.off }) : /* @__PURE__ */ t(i.Label, { children: r }) : null;
+};
+export {
+  p as default
+};

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

@@ -0,0 +1,2 @@
+export { default } from './BitkitToggle';
+export type { BitkitToggleProps } from './BitkitToggle.types';

package/dist/components/DataDisplay/BitkitBadge/BitkitBadge.js

@@ -0,0 +1,23 @@
+import { jsxs as n } from "react/jsx-runtime";
+import { Badge as a } from "@chakra-ui/react/badge";
+import { forwardRef as o } from "react";
+const m = o((t, d) => {
+  const { children: i, icon: r, ...e } = t;
+  return /* @__PURE__ */ n(
+    a,
+    {
+      ref: d,
+      ...e,
+      paddingInlineStart: i && !r ? "8" : "4",
+      paddingInlineEnd: i ? "8" : "4",
+      children: [
+        r,
+        i
+      ]
+    }
+  );
+});
+m.displayName = "BitkitBadge";
+export {
+  m as default
+};

package/dist/components/index.d.ts

@@ -2,4 +2,5 @@ export { default as BitkitButton, type BitkitButtonProps } from './BitkitButton/
 export { default as BitkitField, type BitkitFieldProps } from './BitkitField/BitkitField';
 export { default as BitkitNumberInput, type BitkitNumberInputProps } from './BitkitNumberInput/BitkitNumberInput';
 export { default as BitkitTextField, type BitkitTextFieldProps } from './BitkitTextField/BitkitTextField';
+export { default as BitkitToggle, type BitkitToggleProps } from './BitkitToggle';
 export { default as BitkitTooltip, type BitkitTooltipProps } from './BitkitTooltip/BitkitTooltip';