@bitrise/bitkit-v2 0.3.172 → 0.3.173

package/dist/components/BitkitTagsInput/BitkitTagsInput.d.ts

@@ -0,0 +1,23 @@
+import { FieldRootProps } from '@chakra-ui/react/field';
+import { TagsInput } from '@chakra-ui/react/tags-input';
+import { BitkitFieldProps } from '../BitkitField/BitkitField';
+export interface BitkitTagsInputProps extends Omit<FieldRootProps, 'children' | 'disabled' | 'invalid' | 'readOnly' | 'required'> {
+    addOnPaste?: TagsInput.RootProps['addOnPaste'];
+    defaultValue?: string[];
+    delimiter?: TagsInput.RootProps['delimiter'];
+    errorText?: BitkitFieldProps['errorText'];
+    helperText?: BitkitFieldProps['helperText'];
+    label?: BitkitFieldProps['label'];
+    max?: number;
+    onValueChange?: TagsInput.RootProps['onValueChange'];
+    optional?: BitkitFieldProps['optional'];
+    placeholder?: string;
+    size?: 'md' | 'lg';
+    state?: 'disabled' | 'error' | 'readOnly' | 'warning';
+    tooltip?: BitkitFieldProps['tooltip'];
+    validate?: TagsInput.RootProps['validate'];
+    value?: string[];
+    warningText?: BitkitFieldProps['warningText'];
+}
+declare const BitkitTagsInput: import('react').ForwardRefExoticComponent<BitkitTagsInputProps & import('react').RefAttributes<HTMLDivElement>>;
+export default BitkitTagsInput;

package/dist/components/BitkitTagsInput/BitkitTagsInput.js

@@ -0,0 +1,63 @@
+import I from "../../icons/IconCross.js";
+import P from "../../icons/IconErrorCircleFilled.js";
+import W from "../../icons/IconWarningYellow.js";
+import $ from "../BitkitField/BitkitField.js";
+import { chakra as f, useSlotRecipe as E } from "@chakra-ui/react/styled-system";
+import { forwardRef as H } from "react";
+import { jsx as e, jsxs as r } from "react/jsx-runtime";
+import { TagsInput as i } from "@chakra-ui/react/tags-input";
+var N = H((v, u) => {
+  const { addOnPaste: x, defaultValue: T, delimiter: k = " ", errorText: g, helperText: y, label: w, max: a, onValueChange: C, optional: b, placeholder: z, size: t = "lg", state: l, tooltip: B, validate: O, value: R, warningText: h, ...j } = v, c = E({ key: "tagsInput" })({ size: t }), D = l === "warning" || !!h, m = l === "error" || !!g, o = l === "disabled", n = l === "readOnly";
+  let s;
+  return m ? s = /* @__PURE__ */ e(P, {
+    color: "icon/negative",
+    size: t === "lg" ? "24" : "16"
+  }) : D && (s = /* @__PURE__ */ e(W, {
+    color: "icon/warning",
+    size: t === "lg" ? "24" : "16"
+  })), /* @__PURE__ */ e(i.Root, {
+    addOnPaste: x,
+    defaultValue: T,
+    delimiter: k,
+    disabled: o,
+    invalid: m,
+    max: a,
+    onValueChange: C,
+    readOnly: n,
+    size: t,
+    validate: O,
+    value: R,
+    children: /* @__PURE__ */ e(i.Context, { children: ({ value: d }) => /* @__PURE__ */ r($, {
+      counterText: a !== void 0 ? `${d.length}/${a}` : void 0,
+      disabled: o,
+      errorText: g,
+      helperText: y,
+      invalid: m,
+      label: w,
+      optional: b,
+      readOnly: n,
+      ref: u,
+      tooltip: B,
+      warningText: h,
+      ...j,
+      children: [/* @__PURE__ */ r(i.Control, { children: [/* @__PURE__ */ r(f.div, {
+        css: c.tagsBlock,
+        children: [d.map((p, F) => /* @__PURE__ */ r(i.Item, {
+          index: F,
+          value: p,
+          children: [/* @__PURE__ */ r(i.ItemPreview, { children: [/* @__PURE__ */ e(i.ItemText, { children: p }), !n && /* @__PURE__ */ e(i.ItemDeleteTrigger, { children: /* @__PURE__ */ e(I, { size: "16" }) })] }), /* @__PURE__ */ e(i.ItemInput, {})]
+        }, p)), /* @__PURE__ */ e(i.Input, { placeholder: z })]
+      }), (s || d.length > 0 && !o && !n) && /* @__PURE__ */ r(f.div, {
+        css: c.suffixBlock,
+        children: [s, d.length > 0 && !o && !n && /* @__PURE__ */ e(i.ClearTrigger, {
+          css: c.clearTrigger,
+          children: /* @__PURE__ */ e(I, { size: t === "lg" ? "24" : "16" })
+        })]
+      })] }), /* @__PURE__ */ e(i.HiddenInput, {})]
+    }) })
+  });
+});
+N.displayName = "BitkitTagsInput";
+export {
+  N as default
+};

package/dist/components/index.d.ts

@@ -42,6 +42,7 @@ export { default as BitkitSelectMenu, type BitkitSelectMenuProps } from './Bitki
 export { default as BitkitSplitButton, type BitkitSplitButtonProps } from './BitkitSplitButton/BitkitSplitButton';
 export { default as BitkitTabs } from './BitkitTabs/BitkitTabs';
 export { default as BitkitTag, type BitkitTagProps } from './BitkitTag/BitkitTag';
+export { default as BitkitTagsInput, type BitkitTagsInputProps } from './BitkitTagsInput/BitkitTagsInput';
 export { default as BitkitTextInput, type BitkitTextInputProps } from './BitkitTextInput/BitkitTextInput';
 export { default as BitkitToggle, type BitkitToggleProps } from './BitkitToggle';
 export { default as BitkitToggleButton, type BitkitToggleButtonProps } from './BitkitToggleButton/BitkitToggleButton';

package/dist/main.js

@@ -1,5 +1,5 @@
 import r from "./components/BitkitAccordion/BitkitAccordion.js";
-import { bitkitIcon as i } from "./icons/bitkitIcon.js";
+import { bitkitIcon as t } from "./icons/bitkitIcon.js";
 import n from "./icons/IconAbortCircle.js";
 import c from "./icons/IconAbortCircleFilled.js";
 import e from "./icons/IconAddons.js";
@@ -11,8 +11,8 @@ import g from "./icons/IconApple.js";
 import b from "./icons/IconAppSettings.js";
 import w from "./icons/IconAppStore.js";
 import D from "./icons/IconAppStoreColor.js";
-import v from "./icons/IconArchive.js";
-import T from "./icons/IconArchiveDelete.js";
+import T from "./icons/IconArchive.js";
+import P from "./icons/IconArchiveDelete.js";
 import y from "./icons/IconArchiveRestore.js";
 import M from "./icons/IconArrowBackAndDown.js";
 import G from "./icons/IconArrowBackAndUp.js";
@@ -26,7 +26,7 @@ import X from "./icons/IconArrowRight.js";
 import Z from "./icons/IconArrowsHorizontal.js";
 import $ from "./icons/IconArrowsVertical.js";
 import ro from "./icons/IconArrowUp.js";
-import io from "./icons/IconAutomation.js";
+import to from "./icons/IconAutomation.js";
 import no from "./icons/IconAws.js";
 import co from "./icons/IconAwsColor.js";
 import eo from "./icons/IconBadge3RdParty.js";
@@ -38,7 +38,7 @@ import ho from "./icons/IconBell.js";
 import Ao from "./icons/IconBitbot.js";
 import So from "./icons/IconBitbotError.js";
 import Fo from "./icons/IconBitbucket.js";
-import Po from "./icons/IconBitbucketColor.js";
+import vo from "./icons/IconBitbucketColor.js";
 import Lo from "./icons/IconBitbucketNeutral.js";
 import Ro from "./icons/IconBitbucketWhite.js";
 import xo from "./icons/IconBlockCircle.js";
@@ -53,7 +53,7 @@ import Yo from "./icons/IconBug.js";
 import qo from "./icons/IconBuild.js";
 import or from "./icons/IconBuildCache.js";
 import mr from "./icons/IconBuildCacheFilled.js";
-import tr from "./icons/IconBuildEnvSetup.js";
+import ir from "./icons/IconBuildEnvSetup.js";
 import pr from "./icons/IconCalendar.js";
 import fr from "./icons/IconChangePlan.js";
 import Ir from "./icons/IconChat.js";
@@ -65,7 +65,7 @@ import hr from "./icons/IconChevronLeft.js";
 import Ar from "./icons/IconChevronRight.js";
 import Sr from "./icons/IconChevronUp.js";
 import Fr from "./icons/IconCi.js";
-import Pr from "./icons/IconCiFilled.js";
+import vr from "./icons/IconCiFilled.js";
 import Lr from "./icons/IconCircle.js";
 import Rr from "./icons/IconCircleDashed.js";
 import xr from "./icons/IconCircleHalfFilled.js";
@@ -80,7 +80,7 @@ import Yr from "./icons/IconCommit.js";
 import qr from "./icons/IconConfigure.js";
 import om from "./icons/IconConnectedAccounts.js";
 import mm from "./icons/IconContainer.js";
-import tm from "./icons/IconCopy.js";
+import im from "./icons/IconCopy.js";
 import pm from "./icons/IconCordova.js";
 import fm from "./icons/IconCpu.js";
 import Im from "./icons/IconCreditcard.js";
@@ -92,7 +92,7 @@ import hm from "./icons/IconCrown.js";
 import Am from "./icons/IconCycle.js";
 import Sm from "./icons/IconDashboard.js";
 import Fm from "./icons/IconDashboardFilled.js";
-import Pm from "./icons/IconDeployment.js";
+import vm from "./icons/IconDeployment.js";
 import Lm from "./icons/IconDetails.js";
 import Rm from "./icons/IconDoc.js";
 import xm from "./icons/IconDollar.js";
@@ -105,60 +105,60 @@ import _m from "./icons/IconDoubleCircle.js";
 import Qm from "./icons/IconDownload.js";
 import Ym from "./icons/IconEc2Ami.js";
 import qm from "./icons/IconEnterprise.js";
-import oi from "./icons/IconErrorCircle.js";
-import mi from "./icons/IconErrorCircleFilled.js";
-import ti from "./icons/IconExpand.js";
-import pi from "./icons/IconExtraBuildCapacity.js";
-import fi from "./icons/IconEye.js";
-import Ii from "./icons/IconEyeSlash.js";
-import ai from "./icons/IconFastlane.js";
-import di from "./icons/IconFileDoc.js";
-import ki from "./icons/IconFilePdf.js";
-import ui from "./icons/IconFilePlist.js";
-import hi from "./icons/IconFileZip.js";
-import Ai from "./icons/IconFilter.js";
-import Si from "./icons/IconFlag.js";
-import Fi from "./icons/IconFlutter.js";
-import Pi from "./icons/IconFolder.js";
-import Li from "./icons/IconFullscreen.js";
-import Ri from "./icons/IconFullscreenExit.js";
-import xi from "./icons/IconGauge.js";
-import Ei from "./icons/IconGit.js";
-import Wi from "./icons/IconGithub.js";
-import Hi from "./icons/IconGitlab.js";
-import ji from "./icons/IconGitlabColor.js";
-import Ji from "./icons/IconGitlabWhite.js";
-import _i from "./icons/IconGlobe.js";
-import Qi from "./icons/IconGo.js";
-import Yi from "./icons/IconGoogleColor.js";
-import qi from "./icons/IconGooglePlay.js";
-import ot from "./icons/IconGooglePlayColor.js";
-import mt from "./icons/IconGradle.js";
-import tt from "./icons/IconGroup.js";
-import pt from "./icons/IconHashtag.js";
-import ft from "./icons/IconHeadset.js";
-import It from "./icons/IconHeart.js";
-import at from "./icons/IconHistory.js";
-import dt from "./icons/IconHourglass.js";
-import kt from "./icons/IconImage.js";
-import ut from "./icons/IconInfoCircle.js";
-import ht from "./icons/IconInfoCircleFilled.js";
-import At from "./icons/IconInsights.js";
-import St from "./icons/IconInsightsFilled.js";
-import Ft from "./icons/IconInstall.js";
-import Pt from "./icons/IconInteraction.js";
-import Lt from "./icons/IconInvoice.js";
-import Rt from "./icons/IconIonic.js";
-import xt from "./icons/IconJapanese.js";
-import Et from "./icons/IconJava.js";
-import Wt from "./icons/IconJavaColor.js";
-import Ht from "./icons/IconJavaDuke.js";
-import jt from "./icons/IconJavaDukeColor.js";
-import Jt from "./icons/IconKey.js";
-import _t from "./icons/IconKotlin.js";
-import Qt from "./icons/IconKotlinColor.js";
-import Yt from "./icons/IconKotlinWhite.js";
-import qt from "./icons/IconLaptop.js";
+import ot from "./icons/IconErrorCircle.js";
+import mt from "./icons/IconErrorCircleFilled.js";
+import it from "./icons/IconExpand.js";
+import pt from "./icons/IconExtraBuildCapacity.js";
+import ft from "./icons/IconEye.js";
+import It from "./icons/IconEyeSlash.js";
+import at from "./icons/IconFastlane.js";
+import dt from "./icons/IconFileDoc.js";
+import kt from "./icons/IconFilePdf.js";
+import ut from "./icons/IconFilePlist.js";
+import ht from "./icons/IconFileZip.js";
+import At from "./icons/IconFilter.js";
+import St from "./icons/IconFlag.js";
+import Ft from "./icons/IconFlutter.js";
+import vt from "./icons/IconFolder.js";
+import Lt from "./icons/IconFullscreen.js";
+import Rt from "./icons/IconFullscreenExit.js";
+import xt from "./icons/IconGauge.js";
+import Et from "./icons/IconGit.js";
+import Wt from "./icons/IconGithub.js";
+import Ht from "./icons/IconGitlab.js";
+import jt from "./icons/IconGitlabColor.js";
+import Jt from "./icons/IconGitlabWhite.js";
+import _t from "./icons/IconGlobe.js";
+import Qt from "./icons/IconGo.js";
+import Yt from "./icons/IconGoogleColor.js";
+import qt from "./icons/IconGooglePlay.js";
+import oi from "./icons/IconGooglePlayColor.js";
+import mi from "./icons/IconGradle.js";
+import ii from "./icons/IconGroup.js";
+import pi from "./icons/IconHashtag.js";
+import fi from "./icons/IconHeadset.js";
+import Ii from "./icons/IconHeart.js";
+import ai from "./icons/IconHistory.js";
+import di from "./icons/IconHourglass.js";
+import ki from "./icons/IconImage.js";
+import ui from "./icons/IconInfoCircle.js";
+import hi from "./icons/IconInfoCircleFilled.js";
+import Ai from "./icons/IconInsights.js";
+import Si from "./icons/IconInsightsFilled.js";
+import Fi from "./icons/IconInstall.js";
+import vi from "./icons/IconInteraction.js";
+import Li from "./icons/IconInvoice.js";
+import Ri from "./icons/IconIonic.js";
+import xi from "./icons/IconJapanese.js";
+import Ei from "./icons/IconJava.js";
+import Wi from "./icons/IconJavaColor.js";
+import Hi from "./icons/IconJavaDuke.js";
+import ji from "./icons/IconJavaDukeColor.js";
+import Ji from "./icons/IconKey.js";
+import _i from "./icons/IconKotlin.js";
+import Qi from "./icons/IconKotlinColor.js";
+import Yi from "./icons/IconKotlinWhite.js";
+import qi from "./icons/IconLaptop.js";
 import on from "./icons/IconLaunchdarkly.js";
 import mn from "./icons/IconLegacyApp.js";
 import nn from "./icons/IconLightbulb.js";
@@ -172,8 +172,8 @@ import gn from "./icons/IconMacos.js";
 import bn from "./icons/IconMagicWand.js";
 import wn from "./icons/IconMagnifier.js";
 import Dn from "./icons/IconMail.js";
-import vn from "./icons/IconMedal.js";
-import Tn from "./icons/IconMemory.js";
+import Tn from "./icons/IconMedal.js";
+import Pn from "./icons/IconMemory.js";
 import yn from "./icons/IconMenuGrid.js";
 import Mn from "./icons/IconMenuHamburger.js";
 import Gn from "./icons/IconMessage.js";
@@ -187,7 +187,7 @@ import Xn from "./icons/IconMobile.js";
 import Zn from "./icons/IconMobileLandscape.js";
 import $n from "./icons/IconMonitorChart.js";
 import rp from "./icons/IconMoreHorizontal.js";
-import ip from "./icons/IconMoreVertical.js";
+import tp from "./icons/IconMoreVertical.js";
 import np from "./icons/IconNews.js";
 import cp from "./icons/IconNextjs.js";
 import ep from "./icons/IconNodejs.js";
@@ -199,8 +199,8 @@ import gp from "./icons/IconPause.js";
 import bp from "./icons/IconPencil.js";
 import wp from "./icons/IconPeople.js";
 import Dp from "./icons/IconPercent.js";
-import vp from "./icons/IconPerson.js";
-import Tp from "./icons/IconPersonWithDesk.js";
+import Tp from "./icons/IconPerson.js";
+import Pp from "./icons/IconPersonWithDesk.js";
 import yp from "./icons/IconPlay.js";
 import Mp from "./icons/IconPlus.js";
 import Gp from "./icons/IconPlusCircle.js";
@@ -214,7 +214,7 @@ import Xp from "./icons/IconPuzzle.js";
 import Zp from "./icons/IconPython.js";
 import $p from "./icons/IconPythonColor.js";
 import rc from "./icons/IconQuestionCircle.js";
-import ic from "./icons/IconQuestionCircleFilled.js";
+import tc from "./icons/IconQuestionCircleFilled.js";
 import nc from "./icons/IconReact.js";
 import cc from "./icons/IconRefresh.js";
 import ec from "./icons/IconRegex.js";
@@ -226,8 +226,8 @@ import gc from "./icons/IconResponsiveness.js";
 import bc from "./icons/IconReviewerApproved.js";
 import wc from "./icons/IconReviewerAssigned.js";
 import Dc from "./icons/IconReviewerRejected.js";
-import vc from "./icons/IconRuby.js";
-import Tc from "./icons/IconRubyColor.js";
+import Tc from "./icons/IconRuby.js";
+import Pc from "./icons/IconRubyColor.js";
 import yc from "./icons/IconSave.js";
 import Mc from "./icons/IconSecurityShield.js";
 import Gc from "./icons/IconSettings.js";
@@ -253,7 +253,7 @@ import hf from "./icons/IconStopwatch.js";
 import Af from "./icons/IconTag.js";
 import Sf from "./icons/IconTasks.js";
 import Ff from "./icons/IconTeams.js";
-import Pf from "./icons/IconTeamsColor.js";
+import vf from "./icons/IconTeamsColor.js";
 import Lf from "./icons/IconTemplateCode.js";
 import Rf from "./icons/IconTerminal.js";
 import xf from "./icons/IconTestQuarantine.js";
@@ -268,7 +268,7 @@ import Yf from "./icons/IconUbuntuColor.js";
 import qf from "./icons/IconUnity3D.js";
 import oe from "./icons/IconUpload.js";
 import me from "./icons/IconValidateShield.js";
-import te from "./icons/IconVideo.js";
+import ie from "./icons/IconVideo.js";
 import pe from "./icons/IconWarning.js";
 import fe from "./icons/IconWarningYellow.js";
 import Ie from "./icons/IconWebhooks.js";
@@ -280,7 +280,7 @@ import he from "./icons/IconXcode.js";
 import Ae from "./icons/IconXTwitter.js";
 import Se from "./components/BitkitLabelTooltip/BitkitLabelTooltip.js";
 import Fe from "./components/BitkitCloseButton/BitkitCloseButton.js";
-import Pe from "./components/BitkitActionBar/BitkitActionBar.js";
+import ve from "./components/BitkitActionBar/BitkitActionBar.js";
 import Le from "./components/BitkitColorButton/BitkitColorButton.js";
 import Re from "./components/BitkitAlert/BitkitAlert.js";
 import xe from "./components/BitkitAvatar/BitkitAvatar.js";
@@ -295,7 +295,7 @@ import Ye from "./components/BitkitTooltip/BitkitTooltip.js";
 import qe from "./components/BitkitCodeSnippet/BitkitCodeSnippet.js";
 import oI from "./components/BitkitField/BitkitField.js";
 import mI from "./components/BitkitCombobox/BitkitCombobox.js";
-import tI from "./components/BitkitControlButton/BitkitControlButton.js";
+import iI from "./components/BitkitControlButton/BitkitControlButton.js";
 import pI from "./components/BitkitDefinitionTooltip/BitkitDefinitionTooltip.js";
 import fI from "./components/BitkitDialog/BitkitDialogBody.js";
 import II from "./components/BitkitDialog/BitkitDialogContent.js";
@@ -307,7 +307,7 @@ import hI from "./components/BitkitExplainerList/BitkitExplainerList.js";
 import AI from "./components/BitkitIconButton/BitkitIconButton.js";
 import SI from "./components/BitkitInlineLoading/BitkitInlineLoading.js";
 import FI from "./components/BitkitInteractiveTooltip/BitkitInteractiveTooltip.js";
-import PI from "./components/BitkitLink/BitkitLink.js";
+import vI from "./components/BitkitLink/BitkitLink.js";
 import LI from "./components/BitkitLinkButton/BitkitLinkButton.js";
 import RI from "./components/BitkitNativeSelect/BitkitNativeSelect.js";
 import xI from "./components/BitkitNumberInput/BitkitNumberInput.js";
@@ -322,15 +322,16 @@ import YI from "./components/BitkitSelect/BitkitSelect.js";
 import qI from "./components/BitkitSplitButton/BitkitSplitButton.js";
 import ol from "./components/BitkitTabs/BitkitTabs.js";
 import ml from "./components/BitkitTag/BitkitTag.js";
-import tl from "./components/BitkitTextInput/BitkitTextInput.js";
-import pl from "./components/BitkitToggle/BitkitToggle.js";
-import fl from "./components/BitkitToggleButton/BitkitToggleButton.js";
-import Il from "./components/BitkitUnorderedList/BitkitUnorderedList.js";
-import al from "./theme/index.js";
-import dl from "./providers/BitkitProvider.js";
+import il from "./components/BitkitTagsInput/BitkitTagsInput.js";
+import pl from "./components/BitkitTextInput/BitkitTextInput.js";
+import fl from "./components/BitkitToggle/BitkitToggle.js";
+import Il from "./components/BitkitToggleButton/BitkitToggleButton.js";
+import al from "./components/BitkitUnorderedList/BitkitUnorderedList.js";
+import dl from "./theme/index.js";
+import kl from "./providers/BitkitProvider.js";
 export {
   r as BitkitAccordion,
-  Pe as BitkitActionBar,
+  ve as BitkitActionBar,
   Re as BitkitAlert,
   xe as BitkitAvatar,
   Ee as BitkitBadge,
@@ -343,7 +344,7 @@ export {
   qe as BitkitCodeSnippet,
   Le as BitkitColorButton,
   mI as BitkitCombobox,
-  tI as BitkitControlButton,
+  iI as BitkitControlButton,
   pI as BitkitDefinitionTooltip,
   dI as BitkitDialog,
   fI as BitkitDialogBody,
@@ -357,13 +358,13 @@ export {
   SI as BitkitInlineLoading,
   FI as BitkitInteractiveTooltip,
   Se as BitkitLabelTooltip,
-  PI as BitkitLink,
+  vI as BitkitLink,
   LI as BitkitLinkButton,
   RI as BitkitNativeSelect,
   xI as BitkitNumberInput,
   EI as BitkitOrderedList,
   WI as BitkitOverflowTooltip,
-  dl as BitkitProvider,
+  kl as BitkitProvider,
   HI as BitkitRadio,
   jI as BitkitRadioGroup,
   JI as BitkitRibbon,
@@ -374,11 +375,12 @@ export {
   qI as BitkitSplitButton,
   ol as BitkitTabs,
   ml as BitkitTag,
-  tl as BitkitTextInput,
-  pl as BitkitToggle,
-  fl as BitkitToggleButton,
+  il as BitkitTagsInput,
+  pl as BitkitTextInput,
+  fl as BitkitToggle,
+  Il as BitkitToggleButton,
   Ye as BitkitTooltip,
-  Il as BitkitUnorderedList,
+  al as BitkitUnorderedList,
   n as IconAbortCircle,
   c as IconAbortCircleFilled,
   e as IconAddons,
@@ -390,8 +392,8 @@ export {
   w as IconAppStore,
   D as IconAppStoreColor,
   g as IconApple,
-  v as IconArchive,
-  T as IconArchiveDelete,
+  T as IconArchive,
+  P as IconArchiveDelete,
   y as IconArchiveRestore,
   M as IconArrowBackAndDown,
   G as IconArrowBackAndUp,
@@ -405,7 +407,7 @@ export {
   ro as IconArrowUp,
   Z as IconArrowsHorizontal,
   $ as IconArrowsVertical,
-  io as IconAutomation,
+  to as IconAutomation,
   no as IconAws,
   co as IconAwsColor,
   eo as IconBadge3RdParty,
@@ -417,7 +419,7 @@ export {
   Ao as IconBitbot,
   So as IconBitbotError,
   Fo as IconBitbucket,
-  Po as IconBitbucketColor,
+  vo as IconBitbucketColor,
   Lo as IconBitbucketNeutral,
   Ro as IconBitbucketWhite,
   xo as IconBlockCircle,
@@ -432,7 +434,7 @@ export {
   qo as IconBuild,
   or as IconBuildCache,
   mr as IconBuildCacheFilled,
-  tr as IconBuildEnvSetup,
+  ir as IconBuildEnvSetup,
   pr as IconCalendar,
   fr as IconChangePlan,
   Ir as IconChat,
@@ -444,7 +446,7 @@ export {
   Ar as IconChevronRight,
   Sr as IconChevronUp,
   Fr as IconCi,
-  Pr as IconCiFilled,
+  vr as IconCiFilled,
   Lr as IconCircle,
   Rr as IconCircleDashed,
   xr as IconCircleHalfFilled,
@@ -459,7 +461,7 @@ export {
   qr as IconConfigure,
   om as IconConnectedAccounts,
   mm as IconContainer,
-  tm as IconCopy,
+  im as IconCopy,
   pm as IconCordova,
   fm as IconCpu,
   Im as IconCreditcard,
@@ -471,7 +473,7 @@ export {
   Am as IconCycle,
   Sm as IconDashboard,
   Fm as IconDashboardFilled,
-  Pm as IconDeployment,
+  vm as IconDeployment,
   Lm as IconDetails,
   Rm as IconDoc,
   xm as IconDollar,
@@ -484,60 +486,60 @@ export {
   Qm as IconDownload,
   Ym as IconEc2Ami,
   qm as IconEnterprise,
-  oi as IconErrorCircle,
-  mi as IconErrorCircleFilled,
-  ti as IconExpand,
-  pi as IconExtraBuildCapacity,
-  fi as IconEye,
-  Ii as IconEyeSlash,
-  ai as IconFastlane,
-  di as IconFileDoc,
-  ki as IconFilePdf,
-  ui as IconFilePlist,
-  hi as IconFileZip,
-  Ai as IconFilter,
-  Si as IconFlag,
-  Fi as IconFlutter,
-  Pi as IconFolder,
-  Li as IconFullscreen,
-  Ri as IconFullscreenExit,
-  xi as IconGauge,
-  Ei as IconGit,
-  Wi as IconGithub,
-  Hi as IconGitlab,
-  ji as IconGitlabColor,
-  Ji as IconGitlabWhite,
-  _i as IconGlobe,
-  Qi as IconGo,
-  Yi as IconGoogleColor,
-  qi as IconGooglePlay,
-  ot as IconGooglePlayColor,
-  mt as IconGradle,
-  tt as IconGroup,
-  pt as IconHashtag,
-  ft as IconHeadset,
-  It as IconHeart,
-  at as IconHistory,
-  dt as IconHourglass,
-  kt as IconImage,
-  ut as IconInfoCircle,
-  ht as IconInfoCircleFilled,
-  At as IconInsights,
-  St as IconInsightsFilled,
-  Ft as IconInstall,
-  Pt as IconInteraction,
-  Lt as IconInvoice,
-  Rt as IconIonic,
-  xt as IconJapanese,
-  Et as IconJava,
-  Wt as IconJavaColor,
-  Ht as IconJavaDuke,
-  jt as IconJavaDukeColor,
-  Jt as IconKey,
-  _t as IconKotlin,
-  Qt as IconKotlinColor,
-  Yt as IconKotlinWhite,
-  qt as IconLaptop,
+  ot as IconErrorCircle,
+  mt as IconErrorCircleFilled,
+  it as IconExpand,
+  pt as IconExtraBuildCapacity,
+  ft as IconEye,
+  It as IconEyeSlash,
+  at as IconFastlane,
+  dt as IconFileDoc,
+  kt as IconFilePdf,
+  ut as IconFilePlist,
+  ht as IconFileZip,
+  At as IconFilter,
+  St as IconFlag,
+  Ft as IconFlutter,
+  vt as IconFolder,
+  Lt as IconFullscreen,
+  Rt as IconFullscreenExit,
+  xt as IconGauge,
+  Et as IconGit,
+  Wt as IconGithub,
+  Ht as IconGitlab,
+  jt as IconGitlabColor,
+  Jt as IconGitlabWhite,
+  _t as IconGlobe,
+  Qt as IconGo,
+  Yt as IconGoogleColor,
+  qt as IconGooglePlay,
+  oi as IconGooglePlayColor,
+  mi as IconGradle,
+  ii as IconGroup,
+  pi as IconHashtag,
+  fi as IconHeadset,
+  Ii as IconHeart,
+  ai as IconHistory,
+  di as IconHourglass,
+  ki as IconImage,
+  ui as IconInfoCircle,
+  hi as IconInfoCircleFilled,
+  Ai as IconInsights,
+  Si as IconInsightsFilled,
+  Fi as IconInstall,
+  vi as IconInteraction,
+  Li as IconInvoice,
+  Ri as IconIonic,
+  xi as IconJapanese,
+  Ei as IconJava,
+  Wi as IconJavaColor,
+  Hi as IconJavaDuke,
+  ji as IconJavaDukeColor,
+  Ji as IconKey,
+  _i as IconKotlin,
+  Qi as IconKotlinColor,
+  Yi as IconKotlinWhite,
+  qi as IconLaptop,
   on as IconLaunchdarkly,
   mn as IconLegacyApp,
   nn as IconLightbulb,
@@ -551,8 +553,8 @@ export {
   bn as IconMagicWand,
   wn as IconMagnifier,
   Dn as IconMail,
-  vn as IconMedal,
-  Tn as IconMemory,
+  Tn as IconMedal,
+  Pn as IconMemory,
   yn as IconMenuGrid,
   Mn as IconMenuHamburger,
   Gn as IconMessage,
@@ -566,7 +568,7 @@ export {
   Zn as IconMobileLandscape,
   $n as IconMonitorChart,
   rp as IconMoreHorizontal,
-  ip as IconMoreVertical,
+  tp as IconMoreVertical,
   np as IconNews,
   cp as IconNextjs,
   ep as IconNodejs,
@@ -578,8 +580,8 @@ export {
   bp as IconPencil,
   wp as IconPeople,
   Dp as IconPercent,
-  vp as IconPerson,
-  Tp as IconPersonWithDesk,
+  Tp as IconPerson,
+  Pp as IconPersonWithDesk,
   yp as IconPlay,
   Mp as IconPlus,
   Gp as IconPlusCircle,
@@ -593,7 +595,7 @@ export {
   Zp as IconPython,
   $p as IconPythonColor,
   rc as IconQuestionCircle,
-  ic as IconQuestionCircleFilled,
+  tc as IconQuestionCircleFilled,
   nc as IconReact,
   cc as IconRefresh,
   ec as IconRegex,
@@ -605,8 +607,8 @@ export {
   bc as IconReviewerApproved,
   wc as IconReviewerAssigned,
   Dc as IconReviewerRejected,
-  vc as IconRuby,
-  Tc as IconRubyColor,
+  Tc as IconRuby,
+  Pc as IconRubyColor,
   yc as IconSave,
   Mc as IconSecurityShield,
   Gc as IconSettings,
@@ -632,7 +634,7 @@ export {
   Af as IconTag,
   Sf as IconTasks,
   Ff as IconTeams,
-  Pf as IconTeamsColor,
+  vf as IconTeamsColor,
   Lf as IconTemplateCode,
   Rf as IconTerminal,
   xf as IconTestQuarantine,
@@ -647,7 +649,7 @@ export {
   qf as IconUnity3D,
   oe as IconUpload,
   me as IconValidateShield,
-  te as IconVideo,
+  ie as IconVideo,
   pe as IconWarning,
   fe as IconWarningYellow,
   ae as IconWebUi,
@@ -657,6 +659,6 @@ export {
   Ae as IconXTwitter,
   ue as IconXamarin,
   he as IconXcode,
-  i as bitkitIcon,
-  al as bitriseTheme
+  t as bitkitIcon,
+  dl as bitriseTheme
 };

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

@@ -1,4 +1,4 @@
-declare const fileUploadSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root" | "item" | "itemContent" | "trigger" | "clearTrigger" | "itemGroup" | "dropzone" | "itemDeleteTrigger" | "itemName" | "itemPreview" | "itemPreviewImage" | "itemSizeText" | "dropzoneContent" | "fileText", {
+declare const fileUploadSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root" | "item" | "itemContent" | "trigger" | "clearTrigger" | "itemGroup" | "itemPreview" | "itemDeleteTrigger" | "dropzone" | "itemName" | "itemPreviewImage" | "itemSizeText" | "dropzoneContent" | "fileText", {
     variant: {
         image: {
             root: {

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

@@ -0,0 +1,35 @@
+declare const tagsInputSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"input" | "label" | "root" | "item" | "clearTrigger" | "control" | "itemText" | "itemPreview" | "itemInput" | "itemDeleteTrigger" | "tagsBlock" | "suffixBlock", {
+    size: {
+        md: {
+            control: {
+                paddingInline: "8";
+            };
+            tagsBlock: {
+                paddingBlock: "8";
+            };
+            suffixBlock: {
+                height: "40";
+            };
+            input: {
+                height: "24";
+                textStyle: "body/md/regular";
+            };
+        };
+        lg: {
+            control: {
+                paddingInlineStart: "12";
+                paddingInlineEnd: "8";
+            };
+            tagsBlock: {
+                paddingBlock: "12";
+            };
+            suffixBlock: {
+                height: "48";
+            };
+            input: {
+                textStyle: "body/lg/regular";
+            };
+        };
+    };
+}>;
+export default tagsInputSlotRecipe;

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

@@ -0,0 +1,166 @@
+import { rem as e } from "../themeUtils.js";
+import { defineSlotRecipe as r } from "@chakra-ui/react/styled-system";
+import { tagsInputAnatomy as o } from "@chakra-ui/react/anatomy";
+var i = r({
+  className: "tags-input",
+  slots: o.extendWith("tagsBlock", "suffixBlock").keys(),
+  base: {
+    root: { width: "full" },
+    control: {
+      background: "background/primary",
+      borderColor: "border/regular",
+      borderRadius: "4",
+      borderStyle: "solid",
+      borderWidth: e(1),
+      boxShadow: "inset/field",
+      display: "flex",
+      height: e(88),
+      overflowY: "auto",
+      transition: "border-color 200ms",
+      _focusWithin: { focusRing: "outside" },
+      _hover: { borderColor: "border/hover" },
+      _invalid: {
+        borderColor: "border/error",
+        _hover: { borderColor: "border/error" }
+      },
+      _disabled: {
+        background: "background/disabled",
+        borderColor: "border/disabled",
+        cursor: "not-allowed",
+        _hover: { borderColor: "border/disabled" }
+      },
+      _readOnly: {
+        background: "background/disabled",
+        borderColor: "border/disabled",
+        _hover: { borderColor: "border/disabled" }
+      }
+    },
+    tagsBlock: {
+      alignContent: "flex-start",
+      display: "flex",
+      flex: "1",
+      flexWrap: "wrap",
+      gap: "8",
+      minWidth: 0
+    },
+    suffixBlock: {
+      alignItems: "center",
+      alignSelf: "flex-start",
+      display: "flex",
+      flexShrink: "0",
+      gap: "8",
+      paddingInline: "4",
+      position: "sticky",
+      top: "0",
+      "&:has(button)": { paddingInline: 0 }
+    },
+    input: {
+      background: "transparent",
+      color: "input/text/inputValue",
+      flex: "1",
+      minWidth: e(80),
+      outline: "none",
+      _placeholder: { color: "input/text/placeholder" },
+      _disabled: {
+        cursor: "not-allowed",
+        _placeholder: { color: "text/disabled" }
+      },
+      _readOnly: { display: "none" }
+    },
+    item: {
+      display: "flex",
+      maxWidth: "100%",
+      minWidth: 0
+    },
+    itemPreview: {
+      alignItems: "center",
+      background: "sys/neutral/subtle",
+      borderColor: "sys/neutral/muted",
+      borderRadius: "4",
+      borderStyle: "solid",
+      borderWidth: e(1),
+      color: "text/primary",
+      display: "flex",
+      gap: "4",
+      height: "24",
+      maxWidth: "100%",
+      overflow: "hidden",
+      paddingBlock: "2",
+      paddingInlineEnd: "1",
+      paddingInlineStart: "8",
+      textStyle: "comp/tag/sm",
+      _highlighted: { background: "sys/neutral/moderate" },
+      _disabled: {
+        background: "background/disabled",
+        borderColor: "border/disabled",
+        color: "text/on-disabled"
+      },
+      "&:not(:has(button))": { paddingInlineEnd: "8" }
+    },
+    itemText: {
+      overflow: "hidden",
+      textOverflow: "ellipsis",
+      whiteSpace: "nowrap"
+    },
+    itemInput: {
+      background: "transparent",
+      height: "24",
+      minWidth: "20",
+      outline: "none"
+    },
+    itemDeleteTrigger: {
+      alignItems: "center",
+      borderRadius: "2",
+      color: "icon/secondary",
+      cursor: "pointer",
+      display: "flex",
+      flexShrink: "0",
+      height: "20",
+      justifyContent: "center",
+      width: "20",
+      _hover: { background: "sys/neutral/moderate" },
+      _disabled: {
+        cursor: "not-allowed",
+        opacity: "0.5"
+      }
+    },
+    clearTrigger: {
+      alignItems: "center",
+      borderRadius: "4",
+      color: "icon/secondary",
+      cursor: "pointer",
+      display: "flex",
+      justifyContent: "center",
+      padding: "4",
+      _hover: { background: "sys/neutral/moderate" },
+      _disabled: {
+        cursor: "not-allowed",
+        opacity: "0.5"
+      }
+    }
+  },
+  variants: { size: {
+    md: {
+      control: { paddingInline: "8" },
+      tagsBlock: { paddingBlock: "8" },
+      suffixBlock: { height: "40" },
+      input: {
+        height: "24",
+        textStyle: "body/md/regular"
+      }
+    },
+    lg: {
+      control: {
+        paddingInlineStart: "12",
+        paddingInlineEnd: "8"
+      },
+      tagsBlock: { paddingBlock: "12" },
+      suffixBlock: { height: "48" },
+      input: { textStyle: "body/lg/regular" }
+    }
+  } },
+  defaultVariants: { size: "lg" }
+});
+export {
+  i as default
+};

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

@@ -613,7 +613,7 @@ declare const slotRecipes: {
     }>;
     field: import('@chakra-ui/react').SlotRecipeDefinition<"input" | "label" | "select" | "textarea" | "root" | "helperText" | "errorText" | "requiredIndicator", import('@chakra-ui/react').SlotRecipeVariantRecord<"input" | "label" | "select" | "textarea" | "root" | "helperText" | "errorText" | "requiredIndicator">>;
     fieldset: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "legend" | "root" | "helperText" | "errorText", import('@chakra-ui/react').SlotRecipeVariantRecord<"content" | "legend" | "root" | "helperText" | "errorText">>;
-    fileUpload: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root" | "item" | "itemContent" | "trigger" | "clearTrigger" | "itemGroup" | "dropzone" | "itemDeleteTrigger" | "itemName" | "itemPreview" | "itemPreviewImage" | "itemSizeText" | "dropzoneContent" | "fileText", {
+    fileUpload: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root" | "item" | "itemContent" | "trigger" | "clearTrigger" | "itemGroup" | "itemPreview" | "itemDeleteTrigger" | "dropzone" | "itemName" | "itemPreviewImage" | "itemSizeText" | "dropzoneContent" | "fileText", {
         variant: {
             image: {
                 root: {
@@ -990,6 +990,40 @@ declare const slotRecipes: {
             };
         };
     }>;
+    tagsInput: import('@chakra-ui/react').SlotRecipeDefinition<"input" | "label" | "root" | "item" | "clearTrigger" | "control" | "itemText" | "itemPreview" | "itemInput" | "itemDeleteTrigger" | "tagsBlock" | "suffixBlock", {
+        size: {
+            md: {
+                control: {
+                    paddingInline: "8";
+                };
+                tagsBlock: {
+                    paddingBlock: "8";
+                };
+                suffixBlock: {
+                    height: "40";
+                };
+                input: {
+                    height: "24";
+                    textStyle: "body/md/regular";
+                };
+            };
+            lg: {
+                control: {
+                    paddingInlineStart: "12";
+                    paddingInlineEnd: "8";
+                };
+                tagsBlock: {
+                    paddingBlock: "12";
+                };
+                suffixBlock: {
+                    height: "48";
+                };
+                input: {
+                    textStyle: "body/lg/regular";
+                };
+            };
+        };
+    }>;
     tooltip: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "trigger" | "arrow" | "arrowTip" | "positioner", {
         variant: {
             dark: {

package/dist/theme/slot-recipes/index.js

@@ -11,8 +11,8 @@ import a from "./Combobox.recipe.js";
 import f from "./DatePicker.recipe.js";
 import { selectSlotRecipe as S } from "./Select.recipe.js";
 import R from "./DatePickerSelect.recipe.js";
-import d from "./Dialog.recipe.js";
-import n from "./EmptyState.recipe.js";
+import n from "./Dialog.recipe.js";
+import d from "./EmptyState.recipe.js";
 import b from "./ExpandableCard.recipe.js";
 import s from "./Field.recipe.js";
 import u from "./Fieldset.recipe.js";
@@ -24,14 +24,15 @@ import h from "./Menu.recipe.js";
 import B from "./NativeSelect.recipe.js";
 import C from "./RadioGroup.recipe.js";
 import G from "./Ribbon.recipe.js";
-import P from "./SegmentGroup.recipe.js";
-import w from "./SplitButton.recipe.js";
-import y from "./Switch.recipe.js";
-import I from "./Table.recipe.js";
+import I from "./SegmentGroup.recipe.js";
+import P from "./SplitButton.recipe.js";
+import w from "./Switch.recipe.js";
+import y from "./Table.recipe.js";
 import L from "./Tabs.recipe.js";
 import U from "./Tag.recipe.js";
-import j from "./Tooltip.recipe.js";
-var Ro = {
+import j from "./TagsInput.recipe.js";
+import q from "./Tooltip.recipe.js";
+var bo = {
   accordion: e,
   actionBar: t,
   alert: i,
@@ -43,8 +44,8 @@ var Ro = {
   combobox: a,
   datePicker: f,
   datePickerSelect: R,
-  dialog: d,
-  emptyState: n,
+  dialog: n,
+  emptyState: d,
   expandableCard: b,
   field: s,
   fieldset: u,
@@ -57,15 +58,16 @@ var Ro = {
   numberInput: o,
   radioGroup: C,
   ribbon: G,
-  segmentGroup: P,
+  segmentGroup: I,
   select: S,
-  splitButton: w,
-  switch: y,
-  table: I,
+  splitButton: P,
+  switch: w,
+  table: y,
   tabs: L,
   tag: U,
-  tooltip: j
+  tagsInput: j,
+  tooltip: q
 };
 export {
-  Ro as default
+  bo as default
 };

package/package.json

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