@bitrise/bitkit-v2 0.3.103 → 0.3.105

package/dist/components/BitkitNativeSelect/BitkitNativeSelect.d.ts

@@ -0,0 +1,19 @@
+import { FieldRootProps } from '@chakra-ui/react/field';
+import { NativeSelectRootProps } from '@chakra-ui/react/native-select';
+import { ReactNode } from 'react';
+import { BitkitFieldProps } from '../BitkitField/BitkitField.tsx';
+export interface BitkitNativeSelectProps extends FieldRootProps {
+    errorText?: BitkitFieldProps['errorText'];
+    helperText?: BitkitFieldProps['helperText'];
+    label?: BitkitFieldProps['label'];
+    optional?: BitkitFieldProps['optional'];
+    placeholder?: string;
+    selectProps?: NativeSelectRootProps;
+    size?: 'md' | 'lg';
+    state?: 'disabled' | 'error' | 'readOnly' | 'warning';
+    tooltip?: BitkitFieldProps['tooltip'];
+    warningText?: BitkitFieldProps['warningText'];
+    children: ReactNode;
+}
+declare const BitkitNativeSelect: import('react').ForwardRefExoticComponent<BitkitNativeSelectProps & import('react').RefAttributes<HTMLDivElement>>;
+export default BitkitNativeSelect;

package/dist/components/BitkitNativeSelect/BitkitNativeSelect.js

@@ -0,0 +1,54 @@
+import { jsx as o, jsxs as x } from "react/jsx-runtime";
+import { NativeSelect as n } from "@chakra-ui/react/native-select";
+import { useSlotRecipe as S } from "@chakra-ui/react/styled-system";
+import { forwardRef as y } from "react";
+import N from "../../icons/16x16/IconErrorCircleFilled16.js";
+import k from "../../icons/16x16/IconWarningYellow16.js";
+import F from "../../icons/24x24/IconErrorCircleFilled24.js";
+import b from "../../icons/24x24/IconSelectChevron24.js";
+import B from "../../icons/24x24/IconWarningYellow24.js";
+import C from "../BitkitField/BitkitField.js";
+const R = y(
+  (a, d) => {
+    const {
+      errorText: l,
+      helperText: m,
+      label: p,
+      optional: f,
+      placeholder: g,
+      selectProps: I,
+      size: t = "md",
+      state: e,
+      tooltip: v,
+      warningText: c,
+      children: u,
+      ...h
+    } = a, r = S({ key: "nativeSelect" })(), w = e === "warning" || !!c, s = e === "error" || !!l;
+    let i;
+    return s ? i = t === "lg" ? /* @__PURE__ */ o(F, { css: r.statusIcon, color: "icon/negative" }) : /* @__PURE__ */ o(N, { css: r.statusIcon, color: "icon/negative" }) : w && (i = t === "lg" ? /* @__PURE__ */ o(B, { css: r.statusIcon, color: "icon/warning" }) : /* @__PURE__ */ o(k, { css: r.statusIcon, color: "icon/warning" })), /* @__PURE__ */ o(
+      C,
+      {
+        disabled: e === "disabled",
+        errorText: l,
+        helperText: m,
+        invalid: s,
+        label: p,
+        optional: f,
+        readOnly: e === "readOnly",
+        ref: d,
+        tooltip: v,
+        warningText: c,
+        ...h,
+        children: /* @__PURE__ */ x(n.Root, { size: t, ...I, className: "group", children: [
+          /* @__PURE__ */ o(n.Field, { placeholder: g, children: u }),
+          i,
+          /* @__PURE__ */ o(n.Indicator, { children: /* @__PURE__ */ o(b, {}) })
+        ] })
+      }
+    );
+  }
+);
+R.displayName = "BitkitNativeSelect";
+export {
+  R as default
+};

package/dist/components/BitkitSelect/BitkitSelect.d.ts

@@ -1,19 +1,36 @@
 import { FieldRootProps } from '@chakra-ui/react/field';
-import { NativeSelectRootProps } from '@chakra-ui/react/native-select';
-import { ReactNode } from 'react';
-import { BitkitFieldProps } from '../BitkitField/BitkitField';
-export interface BitkitSelectProps extends FieldRootProps {
+import { SelectRootProps, SelectTriggerProps } from '@chakra-ui/react/select';
+import { BitkitFieldProps } from '../BitkitField/BitkitField.tsx';
+import { BitkitSelectContentProps } from '../BitkitSelectMenu/BitkitSelectMenu.tsx';
+export type BitkitSelectTriggerProps = SelectTriggerProps;
+export type BitkitSelectProps = FieldRootProps & {
+    contentProps?: BitkitSelectContentProps;
+    defaultValue?: string;
     errorText?: BitkitFieldProps['errorText'];
     helperText?: BitkitFieldProps['helperText'];
+    isLoading?: boolean;
+    items: Array<{
+        group?: string;
+        value: string;
+        label: string;
+    }>;
     label?: BitkitFieldProps['label'];
+    onValueChange?: (newVal: string) => void;
     optional?: BitkitFieldProps['optional'];
     placeholder?: string;
-    selectProps?: NativeSelectRootProps;
+    selectProps?: Omit<SelectRootProps, 'collection' | 'defaultValue' | 'onValueChange' | 'value'>;
     size?: 'md' | 'lg';
     state?: 'disabled' | 'error' | 'readOnly' | 'warning';
     tooltip?: BitkitFieldProps['tooltip'];
+    triggerProps?: BitkitSelectTriggerProps;
+    value?: string;
     warningText?: BitkitFieldProps['warningText'];
-    children: ReactNode;
-}
+} & ({
+    hasSearch: true;
+    onSearchChange?: (searchText: string) => void;
+} | {
+    hasSearch?: false;
+    onSearchChange?: never;
+});
 declare const BitkitSelect: import('react').ForwardRefExoticComponent<BitkitSelectProps & import('react').RefAttributes<HTMLDivElement>>;
 export default BitkitSelect;

package/dist/components/BitkitSelect/BitkitSelect.js

@@ -1,52 +1,95 @@
-import { jsx as o, jsxs as x } from "react/jsx-runtime";
-import { NativeSelect as n } from "@chakra-ui/react/native-select";
-import { useSlotRecipe as S } from "@chakra-ui/react/styled-system";
-import { forwardRef as y } from "react";
-import k from "../../icons/16x16/IconErrorCircleFilled16.js";
-import F from "../../icons/16x16/IconWarningYellow16.js";
-import b from "../../icons/24x24/IconErrorCircleFilled24.js";
-import B from "../../icons/24x24/IconSelectChevron24.js";
-import C from "../../icons/24x24/IconWarningYellow24.js";
-import N from "../BitkitField/BitkitField.js";
-const R = y((a, d) => {
+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 { 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) => {
   const {
-    errorText: l,
-    helperText: m,
-    label: p,
-    optional: f,
-    placeholder: g,
-    selectProps: I,
-    size: t = "md",
-    state: e,
-    tooltip: u,
-    warningText: c,
-    children: h,
-    ...v
-  } = a, r = S({ key: "nativeSelect" })(), w = e === "warning" || !!c, s = e === "error" || !!l;
-  let i;
-  return s ? i = t === "lg" ? /* @__PURE__ */ o(b, { css: r.statusIcon, color: "icon/negative" }) : /* @__PURE__ */ o(k, { css: r.statusIcon, color: "icon/negative" }) : w && (i = t === "lg" ? /* @__PURE__ */ o(C, { css: r.statusIcon, color: "icon/warning" }) : /* @__PURE__ */ o(F, { css: r.statusIcon, color: "icon/warning" })), /* @__PURE__ */ o(
-    N,
+    contentProps: h,
+    defaultValue: l,
+    errorText: a,
+    hasSearch: m,
+    helperText: p,
+    isLoading: g,
+    items: f,
+    label: u,
+    onSearchChange: v,
+    onValueChange: I,
+    optional: C,
+    placeholder: S,
+    selectProps: w,
+    size: o = "md",
+    state: t,
+    tooltip: x,
+    triggerProps: B,
+    value: c,
+    warningText: P,
+    ...T
+  } = d, V = t === "error" || !!a, k = F({
+    items: f,
+    groupBy: (i) => i.group || ""
+  });
+  return /* @__PURE__ */ r(
+    z,
     {
-      disabled: e === "disabled",
-      errorText: l,
-      helperText: m,
-      invalid: s,
-      label: p,
-      optional: f,
-      readOnly: e === "readOnly",
-      ref: d,
-      tooltip: u,
-      warningText: c,
-      ...v,
-      children: /* @__PURE__ */ x(n.Root, { size: t, ...I, className: "group", children: [
-        /* @__PURE__ */ o(n.Field, { placeholder: g, children: h }),
-        i,
-        /* @__PURE__ */ o(n.Indicator, { children: /* @__PURE__ */ o(B, {}) })
-      ] })
+      disabled: t === "disabled",
+      errorText: a,
+      helperText: p,
+      invalid: V,
+      label: u,
+      optional: C,
+      readOnly: t === "readOnly",
+      ref: s,
+      tooltip: x,
+      warningText: P,
+      ...T,
+      children: /* @__PURE__ */ n(
+        e.Root,
+        {
+          collection: k,
+          size: o,
+          ...w,
+          defaultValue: l ? [l] : void 0,
+          onValueChange: (i) => I?.(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__ */ r(O, { children: /* @__PURE__ */ r(e.Positioner, { children: /* @__PURE__ */ r(
+              G,
+              {
+                contentProps: h,
+                isLoading: g,
+                ...m ? { hasSearch: !0, onSearchChange: v } : { hasSearch: !1 },
+                size: o
+              }
+            ) }) })
+          ]
+        }
+      )
     }
   );
 });
-R.displayName = "BitkitSelect";
+H.displayName = "BitkitSelect";
 export {
-  R as default
+  H as default
 };

package/dist/components/BitkitSelectMenu/BitkitSelectMenu.d.ts

@@ -0,0 +1,16 @@
+import { SelectContentProps } from '@chakra-ui/react/select';
+export type BitkitSelectMenuProps = {
+    contentProps?: BitkitSelectContentProps;
+    hasSearch?: boolean;
+    isLoading?: boolean;
+    size?: 'md' | 'lg';
+} & ({
+    hasSearch: true;
+    onSearchChange?: (searchText: string) => void;
+} | {
+    hasSearch?: false;
+    onSearchChange?: never;
+});
+export type BitkitSelectContentProps = SelectContentProps;
+declare const BitkitSelectMenu: import('react').ForwardRefExoticComponent<BitkitSelectMenuProps & import('react').RefAttributes<HTMLDivElement>>;
+export default BitkitSelectMenu;

package/dist/components/BitkitSelectMenu/BitkitSelectMenu.js

@@ -0,0 +1,57 @@
+import { jsxs as o, jsx as e } from "react/jsx-runtime";
+import { Box as l } 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 { Separator as y } from "@chakra-ui/react/separator";
+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: [
+    f && /* @__PURE__ */ e(
+      S,
+      {
+        startElement: i === "lg" ? /* @__PURE__ */ e(G, { color: "icon/tertiary" }) : /* @__PURE__ */ e(b, { 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(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: [
+        /* @__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))
+    ] }, t)) })
+  ] });
+});
+B.displayName = "BitkitSelectMenu";
+export {
+  B as default
+};

package/dist/components/index.d.ts

@@ -11,9 +11,11 @@ export { default as BitkitEmptyState, type BitkitEmptyStateProps } from './Bitki
 export { default as BitkitExpandableCard, type BitkitExpandableCardProps, } from './BitkitExpandableCard/BitkitExpandableCard';
 export { default as BitkitField, type BitkitFieldProps } from './BitkitField/BitkitField';
 export { default as BitkitInteractiveTooltip, type BitkitInteractiveTooltipProps, } from './BitkitInteractiveTooltip/BitkitInteractiveTooltip';
+export { default as BitkitNativeSelect, type BitkitNativeSelectProps } from './BitkitNativeSelect/BitkitNativeSelect';
 export { default as BitkitNotification, type BitkitNotificationProps } from './BitkitNotification/BitkitNotification';
 export { default as BitkitNumberInput, type BitkitNumberInputProps } from './BitkitNumberInput/BitkitNumberInput';
 export { default as BitkitSelect, type BitkitSelectProps } from './BitkitSelect/BitkitSelect';
+export { default as BitkitSelectMenu, type BitkitSelectMenuProps } from './BitkitSelectMenu/BitkitSelectMenu';
 export { default as BitkitTabs } from './BitkitTabs/BitkitTabs';
 export { default as BitkitTag, type BitkitTagProps } from './BitkitTag/BitkitTag';
 export { default as BitkitTextInput, type BitkitTextInputProps } from './BitkitTextInput/BitkitTextInput';