@bitrise/bitkit-v2 0.3.108 → 0.3.110

package/dist/components/BitkitExpandableCard/BitkitExpandableCard.js

@@ -1,27 +1,27 @@
-import { jsx as n, jsxs as o } from "react/jsx-runtime";
-import { Box as r } from "@chakra-ui/react/box";
+import { jsx as e, jsxs as i } from "react/jsx-runtime";
+import { Box as t } from "@chakra-ui/react/box";
 import { Card as y } from "@chakra-ui/react/card";
-import { Collapsible as i } from "@chakra-ui/react/collapsible";
+import { Collapsible as r } from "@chakra-ui/react/collapsible";
 import { useSlotRecipe as b } from "@chakra-ui/react/styled-system";
-import { Text as d } from "@chakra-ui/react/text";
-import I from "../../icons/24x24/IconChevronDown24.js";
-const T = (a) => {
-  const { children: p, defaultExpanded: f, expanded: m, icon: s, onChange: t, secdText: l, size: x = "lg", suffix: c, title: h, ...g } = a, e = b({ key: "expandableCard" })({ size: x }), C = t ? (u) => t(u.open) : void 0;
-  return /* @__PURE__ */ n(y.Root, { css: e.root, children: /* @__PURE__ */ o(i.Root, { defaultOpen: f, open: m, onOpenChange: C, ...g, children: [
-    /* @__PURE__ */ o(i.Trigger, { css: e.header, children: [
-      /* @__PURE__ */ o(r, { display: "flex", alignItems: "center", gap: "8", children: [
-        s && /* @__PURE__ */ n(r, { css: e.icon, children: s }),
-        /* @__PURE__ */ o(r, { display: "flex", alignItems: "flex-start", flexDirection: "column", children: [
-          h,
-          !!l && /* @__PURE__ */ n(d, { css: e.secdText, children: l })
+import { Text as a } from "@chakra-ui/react/text";
+import O from "../../utilities/AssetSelectChevron.js";
+const T = (p) => {
+  const { children: x, defaultExpanded: f, expanded: m, icon: o, onChange: l, secdText: c, size: h = "lg", suffix: d, title: C, ...g } = p, n = b({ key: "expandableCard" })({ size: h }), u = l ? (s) => l(s.open) : void 0;
+  return /* @__PURE__ */ e(y.Root, { css: n.root, children: /* @__PURE__ */ i(r.Root, { defaultOpen: f, open: m, onOpenChange: u, ...g, children: [
+    /* @__PURE__ */ i(r.Trigger, { css: n.header, children: [
+      /* @__PURE__ */ i(t, { display: "flex", alignItems: "center", gap: "8", children: [
+        o && /* @__PURE__ */ e(t, { css: n.icon, children: o }),
+        /* @__PURE__ */ i(t, { display: "flex", alignItems: "flex-start", flexDirection: "column", children: [
+          C,
+          !!c && /* @__PURE__ */ e(a, { css: n.secdText, children: c })
         ] })
       ] }),
-      /* @__PURE__ */ o(r, { display: "flex", alignItems: "center", children: [
-        !!c && /* @__PURE__ */ n(d, { css: e.suffix, children: c }),
-        /* @__PURE__ */ n(I, { css: e.chevron })
+      /* @__PURE__ */ i(t, { display: "flex", alignItems: "center", children: [
+        !!d && /* @__PURE__ */ e(a, { css: n.suffix, children: d }),
+        /* @__PURE__ */ e(r.Context, { children: (s) => /* @__PURE__ */ e(O, { isOpen: s.open }) })
       ] })
     ] }),
-    /* @__PURE__ */ n(i.Content, { css: e.collapsible, children: /* @__PURE__ */ n(r, { css: e.body, children: p }) })
+    /* @__PURE__ */ e(r.Content, { css: n.collapsible, children: /* @__PURE__ */ e(t, { css: n.body, children: x }) })
   ] }) });
 };
 T.displayName = "BitkitExpandableCard";

package/dist/components/BitkitField/BitkitField.js

@@ -1,28 +1,28 @@
 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 { Field as r } from "@chakra-ui/react/field";
+import { Text as p } from "@chakra-ui/react/text";
+import { forwardRef as T } from "react";
 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: [
-    n || o ? /* @__PURE__ */ c(t.Label, { children: [
+import b from "../BitkitTooltip/BitkitTooltip.js";
+const y = T((m, x) => {
+  const { counterText: o, children: s, disabled: f, errorText: t, helperText: l, label: n, optional: a, tooltip: d, warningText: i, ...h } = m;
+  return /* @__PURE__ */ c(r.Root, { disabled: f, required: !a, ref: x, ...h, children: [
+    n || o ? /* @__PURE__ */ c(r.Label, { children: [
       n,
       " ",
-      p && /* @__PURE__ */ e(
-        t.RequiredIndicator,
+      a && /* @__PURE__ */ e(
+        r.RequiredIndicator,
         {
-          fallback: /* @__PURE__ */ e(d, { as: "span", color: "input/text/helper", textStyle: "body/md/regular", children: "(optional)" })
+          fallback: /* @__PURE__ */ e(p, { as: "span", textStyle: "body/md/regular", children: "(optional)" })
         }
       ),
-      !!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 })
+      !!d && /* @__PURE__ */ e(b, { text: d ?? "", children: /* @__PURE__ */ e(u, { color: "icon/tertiary" }) }),
+      o && /* @__PURE__ */ e(p, { as: "span", marginInlineStart: "auto", textStyle: "comp/input/helperText", children: o })
     ] }) : null,
-    h,
-    !!l && !r && !i && /* @__PURE__ */ e(t.HelperText, { children: l }),
-    !!i && !r && /* @__PURE__ */ e(t.HelperText, { color: "text/body", children: i }),
-    !!r && /* @__PURE__ */ e(t.ErrorText, { children: r })
+    s,
+    !!l && !t && !i && /* @__PURE__ */ e(r.HelperText, { children: l }),
+    !!i && !t && /* @__PURE__ */ e(r.HelperText, { color: "text/body", children: i }),
+    !!t && /* @__PURE__ */ e(r.ErrorText, { children: t })
   ] });
 });
 y.displayName = "BitkitField";

package/dist/components/BitkitSelect/BitkitSelect.js

@@ -1,86 +1,86 @@
-import { jsx as r, jsxs as n } from "react/jsx-runtime";
-import { Box as b } from "@chakra-ui/react/box";
-import { createListCollection as F } from "@chakra-ui/react/collection";
+import { jsx as e, jsxs as l } from "react/jsx-runtime";
+import { createListCollection as k } from "@chakra-ui/react/collection";
 import { Portal as O } from "@chakra-ui/react/portal";
-import { Select as e } from "@chakra-ui/react/select";
-import { forwardRef as j } from "react";
-import D from "../../icons/16x16/IconChevronDown16.js";
-import E from "../../icons/16x16/IconErrorCircleFilled16.js";
-import L from "../../icons/16x16/IconWarningYellow16.js";
-import R from "../../icons/24x24/IconChevronDown24.js";
-import W from "../../icons/24x24/IconErrorCircleFilled24.js";
-import Y from "../../icons/24x24/IconWarningYellow24.js";
-import z from "../BitkitField/BitkitField.js";
-import G from "../BitkitSelectMenu/BitkitSelectMenu.js";
-const H = j((d, s) => {
+import { Select as r } from "@chakra-ui/react/select";
+import { forwardRef as b } from "react";
+import F from "../../icons/16x16/IconErrorCircleFilled16.js";
+import j from "../../icons/16x16/IconWarningYellow16.js";
+import E from "../../icons/24x24/IconErrorCircleFilled24.js";
+import L from "../../icons/24x24/IconWarningYellow24.js";
+import R from "../../utilities/AssetSelectChevron.js";
+import W from "../BitkitField/BitkitField.js";
+import Y from "../BitkitSelectMenu/BitkitSelectMenu.js";
+const z = b((d, h) => {
   const {
-    contentProps: h,
-    defaultValue: l,
+    contentProps: s,
+    defaultValue: n,
     errorText: a,
-    hasSearch: m,
-    helperText: p,
+    hasSearch: p,
+    helperText: m,
     isLoading: g,
     items: f,
     label: u,
-    onSearchChange: v,
-    onValueChange: I,
+    onSearchChange: S,
+    onValueChange: v,
     optional: C,
-    placeholder: S,
-    selectProps: w,
-    size: o = "md",
-    state: t,
-    tooltip: x,
-    triggerProps: B,
+    placeholder: I,
+    selectProps: x,
+    size: t = "md",
+    state: o,
+    tooltip: w,
+    triggerProps: y,
     value: c,
-    warningText: P,
-    ...T
-  } = d, V = t === "error" || !!a, k = F({
+    warningText: B,
+    ...P
+  } = d, T = o === "error" || !!a, V = k({
     items: f,
     groupBy: (i) => i.group || ""
   });
-  return /* @__PURE__ */ r(
-    z,
+  return /* @__PURE__ */ e(
+    W,
     {
-      disabled: t === "disabled",
+      disabled: o === "disabled",
       errorText: a,
-      helperText: p,
-      invalid: V,
+      helperText: m,
+      invalid: T,
       label: u,
       optional: C,
-      readOnly: t === "readOnly",
-      ref: s,
-      tooltip: x,
-      warningText: P,
-      ...T,
-      children: /* @__PURE__ */ n(
-        e.Root,
+      readOnly: o === "readOnly",
+      ref: h,
+      tooltip: w,
+      warningText: B,
+      ...P,
+      children: /* @__PURE__ */ l(
+        r.Root,
         {
-          collection: k,
-          size: o,
-          ...w,
-          defaultValue: l ? [l] : void 0,
-          onValueChange: (i) => I?.(i.value[0]),
+          collection: V,
+          size: t,
+          ...x,
+          defaultValue: n ? [n] : void 0,
+          onValueChange: (i) => v?.(i.value[0]),
           value: c ? [c] : void 0,
           children: [
-            /* @__PURE__ */ r(e.HiddenSelect, {}),
-            /* @__PURE__ */ n(e.Control, { children: [
-              /* @__PURE__ */ r(e.Trigger, { ...B, children: /* @__PURE__ */ r(e.ValueText, { placeholder: S || "Select option" }) }),
-              /* @__PURE__ */ n(e.IndicatorGroup, { children: [
-                t === "error" && /* @__PURE__ */ r(e.Indicator, { children: o === "lg" ? /* @__PURE__ */ r(W, { color: "icon/negative" }) : /* @__PURE__ */ r(E, { color: "icon/negative", height: "16", width: "16" }) }),
-                t === "warning" && /* @__PURE__ */ r(e.Indicator, { children: o === "lg" ? /* @__PURE__ */ r(Y, {}) : /* @__PURE__ */ r(L, { height: "16", width: "16" }) }),
-                /* @__PURE__ */ r(e.Indicator, { children: /* @__PURE__ */ r(e.Context, { children: (i) => {
-                  const y = i.open;
-                  return /* @__PURE__ */ r(b, { transform: y ? "rotate(180deg)" : "rotate(0deg)", transition: "transform 0.2s ease", children: o === "lg" ? /* @__PURE__ */ r(R, {}) : /* @__PURE__ */ r(D, {}) });
-                } }) })
+            /* @__PURE__ */ e(r.HiddenSelect, {}),
+            /* @__PURE__ */ l(r.Control, { children: [
+              /* @__PURE__ */ e(r.Trigger, { ...y, children: /* @__PURE__ */ e(
+                r.ValueText,
+                {
+                  placeholder: I || o === "readOnly" ? "(not selected)" : "Select an option"
+                }
+              ) }),
+              /* @__PURE__ */ l(r.IndicatorGroup, { children: [
+                o === "error" && /* @__PURE__ */ e(r.Indicator, { children: t === "lg" ? /* @__PURE__ */ e(E, { color: "icon/negative" }) : /* @__PURE__ */ e(F, { color: "icon/negative", height: "16", width: "16" }) }),
+                o === "warning" && /* @__PURE__ */ e(r.Indicator, { children: t === "lg" ? /* @__PURE__ */ e(L, {}) : /* @__PURE__ */ e(j, { height: "16", width: "16" }) }),
+                /* @__PURE__ */ e(r.Indicator, { children: /* @__PURE__ */ e(r.Context, { children: (i) => /* @__PURE__ */ e(R, { isOpen: i.open }) }) })
               ] })
             ] }),
-            /* @__PURE__ */ r(O, { children: /* @__PURE__ */ r(e.Positioner, { children: /* @__PURE__ */ r(
-              G,
+            /* @__PURE__ */ e(O, { children: /* @__PURE__ */ e(r.Positioner, { children: /* @__PURE__ */ e(
+              Y,
               {
-                contentProps: h,
+                contentProps: s,
                 isLoading: g,
-                ...m ? { hasSearch: !0, onSearchChange: v } : { hasSearch: !1 },
-                size: o
+                ...p ? { hasSearch: !0, onSearchChange: S } : { hasSearch: !1 },
+                size: t
               }
             ) }) })
           ]
@@ -89,7 +89,7 @@ const H = j((d, s) => {
     }
   );
 });
-H.displayName = "BitkitSelect";
+z.displayName = "BitkitSelect";
 export {
-  H as default
+  z as default
 };

package/dist/components/BitkitSelectMenu/BitkitSelectMenu.js

@@ -1,57 +1,44 @@
 import { jsxs as o, jsx as e } from "react/jsx-runtime";
-import { Box as l } from "@chakra-ui/react/box";
+import { Box as a } from "@chakra-ui/react/box";
 import { Input as g } from "@chakra-ui/react/input";
-import { InputGroup as S } from "@chakra-ui/react/input-group";
-import { useSelectContext as x, Select as n } from "@chakra-ui/react/select";
+import { InputGroup as x } from "@chakra-ui/react/input-group";
+import { useSelectContext as S, Select as i } from "@chakra-ui/react/select";
 import { Separator as y } from "@chakra-ui/react/separator";
+import { Spinner as C } from "@chakra-ui/react/spinner";
 import { useSlotRecipe as k } from "@chakra-ui/react/styled-system";
 import { Text as s } from "@chakra-ui/react/text";
-import { forwardRef as C } from "react";
-import G from "../../icons/24x24/IconMagnifier24.js";
-import b from "../../icons/16x16/IconMagnifier16.js";
-import L from "../../icons/24x24/IconSpinnerPurple24.js";
-import M from "../../icons/16x16/IconSpinnerPurple16.js";
-import j from "../../icons/24x24/IconCheck24.js";
-import v from "../../icons/16x16/IconCheck16.js";
-const B = C((m, a) => {
-  const { contentProps: p = {}, hasSearch: f = !1, isLoading: d = !1, onSearchChange: h, size: i } = m, { collection: u } = x(), r = k({ key: "select" })({ size: i });
-  return /* @__PURE__ */ o(n.Content, { css: r.content, ref: a, ...p, children: [
+import { forwardRef as G } from "react";
+import b from "../../icons/24x24/IconMagnifier24.js";
+import v from "../../icons/16x16/IconMagnifier16.js";
+import L from "../../icons/24x24/IconCheck24.js";
+import M from "../../icons/16x16/IconCheck16.js";
+const j = G((m, l) => {
+  const { contentProps: p = {}, hasSearch: f = !1, isLoading: d = !1, onSearchChange: h, size: c } = m, { collection: u } = S(), r = k({ key: "select" })({ size: c });
+  return /* @__PURE__ */ o(i.Content, { css: r.content, ref: l, ...p, children: [
     f && /* @__PURE__ */ e(
-      S,
+      x,
       {
-        startElement: i === "lg" ? /* @__PURE__ */ e(G, { color: "icon/tertiary" }) : /* @__PURE__ */ e(b, { color: "icon/tertiary" }),
+        startElement: c === "lg" ? /* @__PURE__ */ e(b, { color: "icon/tertiary" }) : /* @__PURE__ */ e(v, { color: "icon/tertiary" }),
         css: r.searchInputGroup,
         children: /* @__PURE__ */ e(g, { placeholder: "Search...", css: r.searchInput, onChange: (t) => h?.(t.target.value) })
       }
     ),
-    /* @__PURE__ */ e(l, { overflowY: "auto", children: d ? /* @__PURE__ */ o(l, { display: "flex", alignItems: "center", gap: "12", justifyContent: "left", css: r.item, children: [
-      /* @__PURE__ */ e(
-        l,
-        {
-          style: {
-            animation: "spin 1s linear infinite",
-            "@keyframes spin": {
-              "0%": { transform: "rotate(0deg)" },
-              "100%": { transform: "rotate(360deg)" }
-            }
-          },
-          children: i === "lg" ? /* @__PURE__ */ e(L, {}) : /* @__PURE__ */ e(M, {})
-        }
-      ),
+    /* @__PURE__ */ e(a, { overflowY: "auto", children: d ? /* @__PURE__ */ o(a, { display: "flex", alignItems: "center", gap: "12", justifyContent: "left", css: r.item, children: [
+      /* @__PURE__ */ e(C, { variant: "purple" }),
       /* @__PURE__ */ e(s, { color: "text/secondary", textStyle: "body/md/regular", children: "Loading..." })
-    ] }) : u.group().map(([t, I]) => /* @__PURE__ */ o(n.ItemGroup, { children: [
-      t && /* @__PURE__ */ o(n.ItemGroupLabel, { css: r.itemGroupLabel, children: [
+    ] }) : u.group().map(([t, I]) => /* @__PURE__ */ o(i.ItemGroup, { children: [
+      t && /* @__PURE__ */ o(i.ItemGroupLabel, { css: r.itemGroupLabel, children: [
         /* @__PURE__ */ e(s, { color: "text/tertiary", flexShrink: "0", textStyle: "heading/h6", children: t }),
         /* @__PURE__ */ e(y, { flex: "1" })
       ] }),
-      I.map((c) => /* @__PURE__ */ o(n.Item, { css: r.item, item: c, ref: a, children: [
-        c.label,
-        /* @__PURE__ */ e(n.ItemIndicator, { children: i === "lg" ? /* @__PURE__ */ e(j, { css: r.itemIndicator }) : /* @__PURE__ */ e(v, { css: r.itemIndicator }) })
-      ] }, c.value))
+      I.map((n) => /* @__PURE__ */ o(i.Item, { css: r.item, item: n, ref: l, children: [
+        n.label,
+        /* @__PURE__ */ e(i.ItemIndicator, { children: c === "lg" ? /* @__PURE__ */ e(L, { css: r.itemIndicator }) : /* @__PURE__ */ e(M, { css: r.itemIndicator }) })
+      ] }, n.value))
     ] }, t)) })
   ] });
 });
-B.displayName = "BitkitSelectMenu";
+j.displayName = "BitkitSelectMenu";
 export {
-  B as default
+  j as default
 };

package/dist/theme/slot-recipes/ExpandableCard.recipe.d.ts

@@ -1,4 +1,4 @@
-declare const expandableCardSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"body" | "footer" | "header" | "title" | "icon" | "root" | "description" | "collapsible" | "secdText" | "suffix" | "chevron", {
+declare const expandableCardSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"body" | "footer" | "header" | "title" | "icon" | "root" | "description" | "collapsible" | "secdText" | "suffix", {
     size: {
         md: {
             header: {

package/dist/theme/slot-recipes/ExpandableCard.recipe.js

@@ -1,8 +1,8 @@
 import { cardAnatomy as e } from "@chakra-ui/react/anatomy";
 import { defineSlotRecipe as o } from "@chakra-ui/react/styled-system";
-const t = o({
+const d = o({
   className: "expandable-card",
-  slots: [...e.keys(), "chevron", "collapsible", "icon", "secdText", "suffix"],
+  slots: [...e.keys(), "collapsible", "icon", "secdText", "suffix"],
   base: {
     root: {
       backgroundColor: "background/primary",
@@ -35,12 +35,6 @@ const t = o({
         animationDuration: "moderate"
       }
     },
-    chevron: {
-      "[data-state=open] &": {
-        transform: "rotate(-180deg)"
-      },
-      transition: "transform 0.2s ease"
-    },
     body: {
       borderTop: "1px solid",
       borderColor: "border/minimal",
@@ -75,5 +69,5 @@ const t = o({
   }
 });
 export {
-  t as default
+  d as default
 };

package/dist/theme/slot-recipes/Select.recipe.js

@@ -15,7 +15,7 @@ const l = o({
       gap: e(8),
       justifyContent: "space-between",
       px: e(16),
-      py: e(8),
+      py: e(11),
       borderRadius: e(4),
       userSelect: "none",
       textAlign: "start",
@@ -38,7 +38,7 @@ const l = o({
     indicatorGroup: {
       display: "flex",
       alignItems: "center",
-      gap: "1",
+      gap: e(8),
       pos: "absolute",
       insetEnd: "0",
       top: "0",
@@ -87,6 +87,7 @@ const l = o({
       py: e(12),
       textAlign: "start",
       textStyle: "body/lg/regular",
+      lineHeight: e(24),
       _highlighted: {
         bg: "neutral.95"
       },
@@ -128,10 +129,6 @@ const l = o({
       borderColor: "border/minimal",
       appearance: "none",
       paddingLeft: e(16)
-    },
-    valueText: {
-      height: e(32),
-      lineHeight: e(32)
     }
   },
   variants: {
@@ -160,7 +157,7 @@ const l = o({
         },
         trigger: {
           textStyle: "body/md/regular",
-          py: e(4)
+          py: e(9)
         }
       },
       lg: {}

package/dist/theme/slot-recipes/index.d.ts

@@ -72,7 +72,7 @@ declare const slotRecipes: {
             };
         };
     }>;
-    expandableCard: import('@chakra-ui/react').SlotRecipeDefinition<"body" | "footer" | "header" | "title" | "icon" | "root" | "description" | "collapsible" | "secdText" | "suffix" | "chevron", {
+    expandableCard: import('@chakra-ui/react').SlotRecipeDefinition<"body" | "footer" | "header" | "title" | "icon" | "root" | "description" | "collapsible" | "secdText" | "suffix", {
         size: {
             md: {
                 header: {

package/dist/utilities/AssetSelectChevron.d.ts

@@ -0,0 +1,5 @@
+export type AssetSelectChevronProps = {
+    isOpen: boolean;
+};
+declare const AssetSelectChevron: ({ isOpen }: AssetSelectChevronProps) => import("react/jsx-runtime").JSX.Element;
+export default AssetSelectChevron;

package/dist/utilities/AssetSelectChevron.js

@@ -0,0 +1,7 @@
+import { jsx as r } from "react/jsx-runtime";
+import { Box as e } from "@chakra-ui/react/box";
+import o from "../icons/24x24/IconSelectChevron24.js";
+const m = ({ isOpen: t }) => /* @__PURE__ */ r(e, { transform: t ? "rotate(180deg)" : "rotate(0deg)", transition: "transform 0.2s ease", children: /* @__PURE__ */ r(o, {}) });
+export {
+  m as default
+};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bitrise/bitkit-v2",
   "private": false,
-  "version": "0.3.108",
+  "version": "0.3.110",
   "description": "Bitrise Design System Components built with Chakra UI V3",
   "keywords": [
     "react",