@bikdotai/bik-component-library 0.0.13-beta.40 → 0.0.13-jazz

package/dist/esm/components/discount-modal/DynamicCoupon/DynamicCoupon.d.ts

@@ -0,0 +1,28 @@
+import React from 'react';
+import { DISCOUNT_TYPES, ICouponData, MIN_PURCHASE_REQUIREMENT } from "../type";
+import { SingleOption } from "../../dropdown/type";
+import { Product } from "../../product-picker/type";
+export declare enum DISCOUNT_PRODUCTS {
+    ENTITLED = "entitled",
+    PREREQUISITE = "prerequisite"
+}
+interface DynamicCouponI {
+    discountData: ICouponData;
+    setIsProductPickerOpen: React.Dispatch<React.SetStateAction<DISCOUNT_PRODUCTS | undefined>>;
+    productPickerOpen: DISCOUNT_PRODUCTS | undefined;
+    setDiscountData: React.Dispatch<React.SetStateAction<ICouponData>>;
+    selectedCouponType: DISCOUNT_TYPES | undefined;
+    setSelectedCouponType: React.Dispatch<React.SetStateAction<DISCOUNT_TYPES | undefined>>;
+    selectedMinimumRequirement: MIN_PURCHASE_REQUIREMENT;
+    setSelectedMinimumRequirement: React.Dispatch<React.SetStateAction<MIN_PURCHASE_REQUIREMENT>>;
+    entitledProducts: Product[];
+    prerequisiteProducts: Product[];
+    setEntitledProducts: React.Dispatch<React.SetStateAction<Product[]>>;
+    setPrerequisiteProducts: React.Dispatch<React.SetStateAction<Product[]>>;
+    onChangeCouponType: (option: SingleOption) => void;
+    hideExpiration?: boolean;
+    hideProbability?: boolean;
+    allowStaticCoupon: boolean;
+}
+declare const DynamicCoupon: React.FC<DynamicCouponI>;
+export default DynamicCoupon;

package/dist/esm/components/discount-modal/DynamicCoupon/DynamicCoupon.js

@@ -0,0 +1 @@
+import{jsxs as e,jsx as t,Fragment as i}from"react/jsx-runtime";import{useEffect as n}from"react";import{Button as s}from"../../button/Button.js";import{DISCOUNT_TYPES as a,MIN_PURCHASE_REQUIREMENT as o}from"../type.js";import{Dropdown as r}from"../../dropdown/Dropdown.js";import"../../dropdown/DropdownPopover/index.js";import"../../zeroState/ZeroState.js";import{TitleRegular as l,BodySecondary as c,TitleMedium as d,BodyPrimary as u,TitleSmall as p}from"../../TypographyStyle.js";import{DEFAULT_THEME as m}from"../../../constants/Theme.js";import"../../dropdown/OpenedDropdown/components/description/Description.styled.js";import"../../checkBox/CheckBox.styled.js";import"../../list-item/ListItem.js";import"../../dropdown/OpenedDropdown/components/menu/FreeFormMenu.styled.js";import"../../dropdown/OpenedDropdown/components/menu/MenuItem.js";import"../../dropdown/OpenedDropdown/components/menu/MenuList.styled.js";import"../../dropdown/OpenedDropdown/components/menu/SelectAllMenu.js";import"../../dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js";import"../../dropdown/OpenedDropdown/components/OpennedDropdown.styled.js";import{Input as b}from"../../input/Input.js";import g from"../../../assets/icons/cross.svg.js";import"../../dropdown/MenuItem/MenuItem.js";import"../../modals/styledModal.js";import"../../../node_modules/lodash.debounce/index.js";import"../../bik-layout/CommonStyles.js";import"../../product-picker/ProductPicker.styled.js";import"../../../utils/DateUtils.js";import"../../tag/Tag.js";import"@tippyjs/react";import"../../tooltips/TooltipInternal.js";import{DynamicCouponContainer as v}from"../DiscountModal.styled.js";import{CouponExpiration as j}from"../CouponExpiration/CouponExpiration.js";import{RadioButton as D}from"../../radioButton/RadioButton.js";import y from"../../../assets/icons/cursor.svg.js";import h from"../../../assets/icons/plus.svg.js";var O;function T(){return null}!function(e){e.ENTITLED="entitled",e.PREREQUISITE="prerequisite"}(O||(O={}));const E=E=>{n((()=>{E.setDiscountData(Object.assign(Object.assign({},E.discountData),{isStaticCoupon:!1}))}),[]);const x=[{value:a.FIXED_AMOUNT,label:"Fixed Amount",selected:E.selectedCouponType===a.FIXED_AMOUNT},{value:a.PERCENTAGE,label:"Percentage",selected:E.selectedCouponType===a.PERCENTAGE},{value:a.BUY_X_GET_Y,label:"Buy X Get Y FREE",selected:E.selectedCouponType===a.BUY_X_GET_Y},{value:a.FREE_SHIPPING,label:"Free shipping",selected:E.selectedCouponType===a.FREE_SHIPPING}],_=[{selected:E.selectedMinimumRequirement===o.NA,label:"No minimum requirements",value:o.NA},{selected:E.selectedMinimumRequirement===o.AMOUNT,label:"Minimum purchase amount (₹)",value:o.AMOUNT},{selected:E.selectedMinimumRequirement===o.QUANTITY,label:"Minimum quantity of items",value:o.QUANTITY}],N=()=>{var i,n,s,a;return e("div",Object.assign({className:"input__rows"},{children:[e("div",Object.assign({className:"input__wrapper"},{children:[t(c,Object.assign({style:{marginBottom:10}},{children:"Min purchase requirements"})),t(r,{options:_,placement:"bottom-start",onSelect:e=>{const t=e.value;E.setSelectedMinimumRequirement(t),E.setDiscountData(Object.assign(Object.assign({},E.discountData),{minQuantity:void 0,minAmount:void 0}))}})]})),t("div",Object.assign({className:"input__wrapper"},{children:E.selectedMinimumRequirement!==o.NA&&t(b,{value:E.selectedMinimumRequirement===o.AMOUNT?null!==(n=null===(i=E.discountData.minAmount)||void 0===i?void 0:i.toString())&&void 0!==n?n:"":null!==(a=null===(s=E.discountData.minQuantity)||void 0===s?void 0:s.toString())&&void 0!==a?a:"",onChangeText:e=>{E.selectedMinimumRequirement===o.AMOUNT?E.setDiscountData(Object.assign(Object.assign({},E.discountData),{minAmount:parseInt(e)})):E.selectedMinimumRequirement===o.QUANTITY&&E.setDiscountData(Object.assign(Object.assign({},E.discountData),{minQuantity:parseInt(e)}))},labelText:E.selectedMinimumRequirement===o.AMOUNT?"Minimum purchase amount":"Minimum purchase quantity",type:"number",placeholder:E.selectedMinimumRequirement===o.AMOUNT?"1000.00":"2"})}))]}))},f=n=>{var a,o;const r=n===O.ENTITLED?E.entitledProducts:E.prerequisiteProducts;return e(i,{children:[t(l,{children:n===O.PREREQUISITE?"Customer spends":"Customer gets"}),e("div",Object.assign({className:"input__rows"},{children:[t("div",Object.assign({className:"input__wrapper"},{children:t(b,{value:n===O.ENTITLED?null===(a=E.discountData.entitledQuantity)||void 0===a?void 0:a.toString():null===(o=E.discountData.prerequisiteQuantity)||void 0===o?void 0:o.toString(),type:"number",onChangeText:e=>{n===O.ENTITLED?E.setDiscountData(Object.assign(Object.assign({},E.discountData),{entitledQuantity:parseInt(e)})):E.setDiscountData(Object.assign(Object.assign({},E.discountData),{prerequisiteQuantity:parseInt(e)}))},labelText:"Add quantity",placeholder:"Add quantity"})})),t("div",{className:"input__wrapper"})]})),t("div",{children:t(s,{buttonText:"Add product",buttonType:"tertiary",LeadingIcon:h,onClick:()=>{E.setIsProductPickerOpen(n)}})}),r.map((i=>e("div",Object.assign({style:{padding:"20px 0 12px 0",borderBottom:`1px solid ${m.colorsV2.stroke.primary}`,display:"flex"}},{children:[e("div",Object.assign({style:{display:"flex",gap:16,alignItems:"center",flex:.8}},{children:[t("img",{src:i.image,onError:e=>{e.target.onerror=null,e.target.src="https://jkfenner.com/wp-content/uploads/2019/11/default.jpg"},style:{height:40,width:40,objectFit:"cover",borderRadius:4}}),t(p,{children:i.name})]})),t("div",Object.assign({style:{flex:.2,display:"flex",justifyContent:"flex-end",alignItems:"center"}},{children:t("div",Object.assign({style:{cursor:"pointer"},onClick:()=>{const e=r.filter((e=>e.id!==i.id));n===O.ENTITLED?E.setEntitledProducts(e):E.setPrerequisiteProducts(e)}},{children:t(g,{width:14,color:m.colorsV2.content.primary})}))}))]}),i.id)))]})};return e(v,{children:[E.allowStaticCoupon&&e("div",Object.assign({className:"input__rows"},{children:[t("div",Object.assign({className:"input__wrapper"},{children:t(r,{options:x,width:"290px",placement:"bottom-start",onSelect:e=>{E.onChangeCouponType(e)}})})),t("div",{className:"input__wrapper"})]})),(E.selectedCouponType===a.PERCENTAGE||E.selectedCouponType===a.FIXED_AMOUNT)&&e(i,{children:[e("div",Object.assign({className:"input__rows"},{children:[t("div",Object.assign({className:"input__wrapper"},{children:t(b,{value:E.discountData.title,onChangeText:e=>{E.setDiscountData(Object.assign(Object.assign({},E.discountData),{title:e}))},labelText:"Code title",placeholder:"eg: Flat 50% Off"})})),t("div",Object.assign({className:"input__wrapper"},{children:t(b,{value:null===(w=null===(C=E.discountData)||void 0===C?void 0:C.value)||void 0===w?void 0:w.toString(),labelText:"Discount code value",type:"number",onChangeText:e=>{E.setDiscountData(Object.assign(Object.assign({},E.discountData),{value:parseInt(e)}))},placeholder:E.selectedCouponType===a.FIXED_AMOUNT?"0.00":"Enter a value",prefixText:E.selectedCouponType===a.FIXED_AMOUNT?"₹":void 0,suffixText:E.selectedCouponType===a.PERCENTAGE?"%":void 0})}))]})),N(),!E.hideProbability&&e("div",Object.assign({className:"input__rows"},{children:[t("div",Object.assign({className:"input__wrapper"},{children:t(b,{type:"number",value:null===(I=E.discountData.probability)||void 0===I?void 0:I.toString(),onChangeText:e=>{E.setDiscountData(Object.assign(Object.assign({},E.discountData),{probability:parseFloat(e)}))},labelText:"Probability",placeholder:"Enter probability in decimals eg: 0.2, 0.5, 0.75"})})),t("div",{className:"input__wrapper"})]}))]}),E.selectedCouponType===a.FREE_SHIPPING&&(()=>{var n;return e(i,{children:[e("div",Object.assign({className:"input__rows"},{children:[t("div",Object.assign({className:"input__wrapper"},{children:t(b,{value:E.discountData.title,onChangeText:e=>{E.setDiscountData(Object.assign(Object.assign({},E.discountData),{title:e}))},labelText:"Code title",placeholder:"eg: Flat 50% Off"})})),t("div",Object.assign({className:"input__wrapper"},{children:!E.hideProbability&&t(b,{value:null===(n=E.discountData.probability)||void 0===n?void 0:n.toString(),type:"number",onChangeText:e=>{E.setDiscountData(Object.assign(Object.assign({},E.discountData),{probability:parseFloat(e)}))},labelText:"Probability",placeholder:"Enter probability in decimals eg: 0.2, 0.5, 0.75"})}))]})),N()]})})(),E.selectedCouponType===a.BUY_X_GET_Y&&(()=>{var i;return e(v,{children:[t("div",Object.assign({className:"input__rows"},{children:e("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:20,flex:1}},{children:[t(b,{value:E.discountData.title,onChangeText:e=>{E.setDiscountData(Object.assign(Object.assign({},E.discountData),{title:e}))},maxCharLimit:32,labelText:"Code title",placeholder:"eg: Flat 50% Off"}),!E.hideProbability&&t(b,{value:null===(i=E.discountData.probability)||void 0===i?void 0:i.toString(),type:"number",onChangeText:e=>{E.setDiscountData(Object.assign(Object.assign({},E.discountData),{probability:parseFloat(e)}))},labelText:"Probability",placeholder:"Enter probability in decimals eg: 0.2, 0.5, 0.75"})]}))})),t(T,{}),f(O.PREREQUISITE),t(T,{}),f(O.ENTITLED),t(T,{}),t(l,{children:"At a discount value"}),e("div",Object.assign({style:{display:"flex",gap:18,alignItems:"center"}},{children:[t(D,{isActive:100!==E.discountData.value,onValueChange:e=>{E.setDiscountData(Object.assign(Object.assign({},E.discountData),{value:void 0}))}}),t(c,{children:"Percentage"}),100!==E.discountData.value&&t(b,{variant:"small",onChangeText:e=>{E.setDiscountData(Object.assign(Object.assign({},E.discountData),{value:parseInt(e)}))},type:"number",placeholder:"Enter percentage eg: 10%",suffixText:"%",width:"238px"})]})),e("div",Object.assign({style:{display:"flex",gap:18}},{children:[t(D,{isActive:100===E.discountData.value,onValueChange:e=>{e?E.setDiscountData(Object.assign(Object.assign({},E.discountData),{value:100})):E.setDiscountData(Object.assign(Object.assign({},E.discountData),{value:void 0}))}}),t(c,{children:"Free"})]}))]})})(),E.selectedCouponType&&!E.hideExpiration&&e(i,{children:[t("div",{style:{height:6,borderTop:`1px solid ${m.colorsV2.stroke.primary}`,marginTop:12}}),t(j,{discountData:E.discountData,setDiscountData:E.setDiscountData})]}),!E.selectedCouponType&&e("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:10,padding:"40px 0",justifyContent:"center",alignItems:"center"}},{children:[t("div",Object.assign({style:{height:52,width:52,backgroundColor:m.colorsV2.background.inverse,borderRadius:"50%",display:"flex",justifyContent:"center",alignItems:"center"}},{children:t(y,{width:32,color:m.colorsV2.content.primaryInverse})})),t(d,{children:"No discount has been selected"}),t(u,{children:"Please select a discount type"})]}))]});var C,w,I};export{O as DISCOUNT_PRODUCTS,E as default};

package/dist/esm/components/discount-modal/StaticCoupon/StaticCoupon.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { ICouponData } from "../type";
+interface StaticCouponI {
+    discountData: ICouponData;
+    setDiscountData: React.Dispatch<React.SetStateAction<ICouponData>>;
+    hideProbability: boolean;
+    discountAdminUrl?: string;
+}
+declare const StaticCoupon: React.FC<StaticCouponI>;
+export default StaticCoupon;

package/dist/esm/components/discount-modal/StaticCoupon/StaticCoupon.js

@@ -0,0 +1 @@
+import{jsxs as t,jsx as o}from"react/jsx-runtime";import i from"../../../assets/icons/info.svg.js";import{useEffect as e}from"react";import{Input as n}from"../../input/Input.js";import{BodySecondaryLink as a,BodySecondary as s}from"../../TypographyStyle.js";import{DEFAULT_THEME as c}from"../../../constants/Theme.js";import{StaticCouponContainerStyled as r}from"../DiscountModal.styled.js";const d=d=>(e((()=>{d.setDiscountData(Object.assign(Object.assign({},d.discountData),{isStaticCoupon:!0}))}),[]),t(r,{children:[o(n,{onChangeText:t=>{d.setDiscountData(Object.assign(Object.assign({},d.discountData),{couponCode:t}))},labelText:"Coupon code",value:d.discountData.couponCode,placeholder:"Enter code created on shopify"}),o(n,{labelText:"Coupon description",value:d.discountData.description,onChangeText:t=>{d.setDiscountData(Object.assign(Object.assign({},d.discountData),{description:t}))},placeholder:"Enter coupon description"}),!d.hideProbability&&o(n,{labelText:"Probability",value:d.discountData.probability?d.discountData.probability.toString():"",onChangeText:t=>{d.setDiscountData(Object.assign(Object.assign({},d.discountData),{probability:parseInt(t)}))},placeholder:"Enter probability"}),d.discountAdminUrl&&t("div",Object.assign({className:"info__container"},{children:[o(i,{height:18,width:18,color:c.colorsV2.content.secondary}),o(a,Object.assign({onClick:()=>{window.open(d.discountAdminUrl,"_blank")}},{children:"Click here"})),o(s,{children:"to create discount code on Shopify"})]}))]}));export{d as default};

package/dist/esm/components/discount-modal/index.d.ts

@@ -0,0 +1,3 @@
+export * from './DiscountModal';
+export * from './CouponExpiration/CouponExpiration';
+export * from './type';

package/dist/esm/components/discount-modal/type.d.ts

@@ -0,0 +1,48 @@
+export declare enum MIN_PURCHASE_REQUIREMENT {
+    AMOUNT = "amount",
+    QUANTITY = "quantity",
+    NA = "na"
+}
+export declare enum DISCOUNT_VALUE_TYPES {
+    FIXED_AMOUNT = "fixedAmount",
+    PERCENTAGE = "percentage"
+}
+export declare enum DISCOUNT_TARGET_TYPES {
+    LINE_ITEM = "lineItem",
+    SHIPPING_LINE = "shippingLine"
+}
+export declare enum DISCOUNT_TARGET_SELECTION {
+    ENTITLED = "entitled",
+    ALL = "all"
+}
+export declare enum DISCOUNT_TYPES {
+    FIXED_AMOUNT = "fixedAmount",
+    PERCENTAGE = "percentage",
+    BUY_X_GET_Y = "buyXGetY",
+    FREE_SHIPPING = "freeShipping"
+}
+export interface ICouponData {
+    description: string;
+    value?: number;
+    valueType: DISCOUNT_VALUE_TYPES;
+    targetType: DISCOUNT_TARGET_TYPES;
+    targetSelection: DISCOUNT_TARGET_SELECTION;
+    minAmount?: number;
+    title: string;
+    minQuantity?: number;
+    expireAfter?: number;
+    expireAt?: Date;
+    isStaticCoupon?: boolean;
+    couponCode?: string;
+    prerequisiteProductIds?: number[];
+    prerequisiteVariantIds?: number[];
+    prerequisiteCollectionIds?: number[];
+    entitledProductIds?: number[];
+    entitledVariantIds?: number[];
+    entitledCollectionIds?: number[];
+    allocationLimit?: number;
+    prerequisiteQuantity?: number;
+    entitledQuantity?: number;
+    minPurchaseReq?: MIN_PURCHASE_REQUIREMENT;
+    probability?: number;
+}

package/dist/esm/components/discount-modal/type.js

@@ -0,0 +1 @@
+var n,e,t,E,i;!function(n){n.AMOUNT="amount",n.QUANTITY="quantity",n.NA="na"}(n||(n={})),function(n){n.FIXED_AMOUNT="fixedAmount",n.PERCENTAGE="percentage"}(e||(e={})),function(n){n.LINE_ITEM="lineItem",n.SHIPPING_LINE="shippingLine"}(t||(t={})),function(n){n.ENTITLED="entitled",n.ALL="all"}(E||(E={})),function(n){n.FIXED_AMOUNT="fixedAmount",n.PERCENTAGE="percentage",n.BUY_X_GET_Y="buyXGetY",n.FREE_SHIPPING="freeShipping"}(i||(i={}));export{E as DISCOUNT_TARGET_SELECTION,t as DISCOUNT_TARGET_TYPES,i as DISCOUNT_TYPES,e as DISCOUNT_VALUE_TYPES,n as MIN_PURCHASE_REQUIREMENT};

package/dist/esm/components/dropShadow/DropShadow.d.ts

@@ -3,5 +3,6 @@ declare const DropShadow: React.FC<{
     level: 'z1' | 'z2';
     position: 'up' | 'down';
     children: React.ReactNode;
+    style?: React.CSSProperties;
 }>;
 export default DropShadow;

package/dist/esm/components/dropShadow/DropShadow.js

@@ -1 +1 @@
-import{jsx as p}from"react/jsx-runtime";const x={z1:{up:"0px -2px 8px rgba(0, 0, 0, 0.12)",down:"0px 2px 8px rgba(0, 0, 0, 0.12)"},z2:{up:"0px -4px 12px rgba(0, 0, 0, 0.12)",down:"0px 4px 12px rgba(0, 0, 0, 0.12)"}},r=r=>{let{level:e="z1",position:o="down",children:t}=r;const n=x[e][o];return p("div",Object.assign({style:{boxShadow:n}},{children:t}))};export{r as default};
+import{jsx as p}from"react/jsx-runtime";const x={z1:{up:"0px -2px 8px rgba(0, 0, 0, 0.12)",down:"0px 2px 8px rgba(0, 0, 0, 0.12)"},z2:{up:"0px -4px 12px rgba(0, 0, 0, 0.12)",down:"0px 4px 12px rgba(0, 0, 0, 0.12)"}},e=e=>{let{level:t="z1",position:n="down",children:r,style:o}=e;const s=x[t][n];return p("div",Object.assign({style:Object.assign({boxShadow:s},null!=o?o:{})},{children:r}))};export{e as default};

package/dist/esm/components/dropdown/Dropdown.d.ts

@@ -5,5 +5,6 @@ export type DropdownProps = OpenDropdownProps & {
     size?: 'default' | 'small';
     disabled?: boolean;
     noErrorHint?: boolean;
+    buttonWidth?: string;
 };
 export declare const Dropdown: React.FC<DropdownProps>;

package/dist/esm/components/dropdown/Dropdown.js

@@ -1 +1 @@
-import{__rest as o}from"../../_virtual/_tslib.js";import{jsx as e}from"react/jsx-runtime";import{useRef as t,useState as r,useEffect as n}from"react";import{COLORS as i}from"../../constants/Theme.js";import l from"../../assets/icons/chevronDown.svg.js";import{Input as s}from"../input/Input.js";import{InputStyleContext as a}from"../input/context/InputStyleProvider.js";import{DropdownPopover as d}from"./DropdownPopover/index.js";function p(){}const c=c=>{var u,m,{placeHolder:h,size:v,onSelect:f,defaultOptions:g,disabled:b,noErrorHint:j}=c,w=o(c,["placeHolder","size","onSelect","defaultOptions","disabled","noErrorHint"]);const x=null!=v?v:"default",y=t(),[H,O]=r(null!=g?g:[]);n((()=>{var o;const e=[];null===(o=null==w?void 0:w.options)||void 0===o||o.forEach((o=>{o.options?o.options.forEach((o=>{o.selected&&e.push(Object.assign(Object.assign({},o),{label:o.label}))})):o.selected&&e.push(o)})),O([...e])}),[w.options]),n((()=>{g&&O([...g])}),[g]);const E=H.length?H.map((o=>o.label)).join(", "):void 0;return e(a.Provider,Object.assign({value:{InputWrapper:{height:"small"===x?32:48,width:null!==(u=w.width)&&void 0!==u?u:"100%",zIndex:1,cursor:"pointer",padding:"6px 8px"},input:{minHeight:"100%"}}},{children:e(d,Object.assign({ref:y,onSelect:function(o){Array.isArray(o)?O([...o]):O([o]),null==f||f(o)},disabled:b},w,{children:e(s,{noErrorHint:j,state:b?"disabled":"none",value:E,errorMessage:w.error,variant:x,placeholder:null!=h?h:"Select an option",width:null!==(m=w.width)&&void 0!==m?m:"100%",onChangeText:p,rightIcon:{icon:()=>{var o;return e(l,{style:{transform:(null===(o=null==y?void 0:y.current)||void 0===o?void 0:o.openDropdown)?"rotate(180deg)":"rotate(0deg)"},onClick:p,width:"small"===x?20:24,height:"small"===x?20:24,color:i.content.primary})}}})}))}))};c.displayName="Dropdown";export{c as Dropdown};
+import{__rest as o}from"../../_virtual/_tslib.js";import{jsx as t}from"react/jsx-runtime";import{useState as e,useRef as n,useEffect as r}from"react";import{COLORS as i}from"../../constants/Theme.js";import l from"../../assets/icons/chevronDown.svg.js";import{Input as s}from"../input/Input.js";import{InputStyleContext as a}from"../input/context/InputStyleProvider.js";import{DropdownPopover as d}from"./DropdownPopover/index.js";function p(){}const c=c=>{var u,m,h,{placeHolder:f,size:v,onSelect:g,defaultOptions:b,disabled:j,noErrorHint:w}=c,x=o(c,["placeHolder","size","onSelect","defaultOptions","disabled","noErrorHint"]);const[y,H]=e(!1),O=null!=v?v:"default",E=n(),[I,S]=e(null!=b?b:[]);r((()=>{var o;const t=[];null===(o=null==x?void 0:x.options)||void 0===o||o.forEach((o=>{o.options?o.options.forEach((o=>{o.selected&&t.push(Object.assign(Object.assign({},o),{label:o.label}))})):o.selected&&t.push(o)})),S([...t])}),[x.options]),r((()=>{b&&S([...b])}),[b]);const D=I.length?I.map((o=>o.label)).join(", "):void 0;return t(a.Provider,Object.assign({value:{InputWrapper:{height:"small"===O?32:48,width:null!==(m=null!==(u=x.buttonWidth)&&void 0!==u?u:x.width)&&void 0!==m?m:"100%",zIndex:1,cursor:"pointer",padding:"6px 8px"},input:{minHeight:"100%"}}},{children:t(d,Object.assign({ref:E,onSelect:function(o){Array.isArray(o)?S([...o]):S([o]),null==g||g(o)},disabled:j,onDropdownVisbilityChange:o=>H(o)},x,{children:t(s,{noErrorHint:w,state:j?"disabled":"none",value:null!=D?D:"",errorMessage:x.error,variant:O,placeholder:null!=f?f:"Select an option",width:null!==(h=x.width)&&void 0!==h?h:"100%",onChangeText:p,rightIcon:{icon:()=>t(l,{style:{transform:y?"rotate(180deg)":"rotate(0deg)"},onClick:p,width:"small"===O?20:24,height:"small"===O?20:24,color:i.content.primary})}})}))}))};c.displayName="Dropdown";export{c as Dropdown};

package/dist/esm/components/dropdown/DropdownPopover/index.d.ts

@@ -4,6 +4,7 @@ export declare const DropdownPopover: React.ForwardRefExoticComponent<OpenDropdo
     isLoading?: boolean | undefined;
     children?: React.ReactNode;
     disabled?: boolean | undefined;
+    onDropdownVisbilityChange?: ((isOpen: boolean) => void) | undefined;
 } & React.RefAttributes<{
     openDropdown: boolean;
 }>>;

package/dist/esm/components/dropdown/DropdownPopover/index.js

@@ -1 +1 @@
-import{__rest as o}from"../../../_virtual/_tslib.js";import{jsxs as e,Fragment as r,jsx as n}from"react/jsx-runtime";import t,{useState as l,useImperativeHandle as i,useEffect as p}from"react";import{usePopper as s}from"react-popper";import d from"../../dropShadow/DropShadow.js";import{OverLapAbs as c,OpenDropdownContainer as a}from"../Common.styled.js";import{OpenedDropdown as m}from"../OpenedDropdown/components/OpennedDropdown.js";const u=t.forwardRef(((t,u)=>{var{children:f}=t,v=o(t,["children"]);const j=u,[b,w]=l(!1),[h,O]=l(null),[D,g]=l(null),{styles:y,attributes:C}=s(h,D,{});return i(j,(()=>({openDropdown:b})),[]),p((()=>{(null==j?void 0:j.current)&&(j.current.openDropdown=b)}),[b]),e(r,{children:[e("div",Object.assign({style:{position:"relative"},ref:O},{children:[n(c,{onClick:o=>{b?o.preventDefault():v.disabled||w(!0)}}),f]})),b&&n(a,Object.assign({ref:g,style:Object.assign(Object.assign({},y.popper),{zIndex:3})},C.popper,{children:n(d,Object.assign({level:"z2",position:"down"},{children:n(m,Object.assign({},v,{onSelect:o=>{var e;null===(e=v.onSelect)||void 0===e||e.call(v,o),w(!1)},onClose:function(){var o;w(!1),null===(o=null==v?void 0:v.onClose)||void 0===o||o.call(v)}}))}))}))]})}));u.displayName="DropdownPopover";export{u as DropdownPopover};
+import{__rest as o}from"../../../_virtual/_tslib.js";import{jsxs as e,Fragment as n,jsx as r}from"react/jsx-runtime";import l,{useState as t,useImperativeHandle as i,useEffect as p}from"react";import{usePopper as s}from"react-popper";import d from"../../dropShadow/DropShadow.js";import{OverLapAbs as a,OpenDropdownContainer as c}from"../Common.styled.js";import{OpenedDropdown as m}from"../OpenedDropdown/components/OpennedDropdown.js";const u=l.forwardRef(((l,u)=>{var{children:f,onDropdownVisbilityChange:v}=l,b=o(l,["children","onDropdownVisbilityChange"]);const j=u,[w,h]=t(!1),[D,g]=t(null),[y,O]=t(null),{styles:C,attributes:S}=s(D,y,{placement:b.placement});return i(j,(()=>({openDropdown:w})),[]),p((()=>{(null==j?void 0:j.current)&&(j.current.openDropdown=w)}),[w]),p((()=>{null==v||v(w)}),[w]),e(n,{children:[e("div",Object.assign({style:{position:"relative"},ref:g},{children:[r(a,{onClick:o=>{w?o.preventDefault():b.disabled||h(!0)}}),f]})),w&&r(c,Object.assign({ref:O,style:Object.assign(Object.assign({},C.popper),{zIndex:3})},S.popper,{children:r(d,Object.assign({level:"z2",position:"down",style:{borderRadius:4}},{children:r(m,Object.assign({},b,{onSelect:o=>{var e;null===(e=b.onSelect)||void 0===e||e.call(b,o),h(!1)},onClose:function(){var o;h(!1),null===(o=null==b?void 0:b.onClose)||void 0===o||o.call(b)}}))}))}))]})}));u.displayName="DropdownPopover";export{u as DropdownPopover};

package/dist/esm/components/dropdown/MenuItem/MenuItem.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { OpenDropdownProps } from "../type";
+export type MenuItemDropdownProps = OpenDropdownProps & {
+    isHorizontal: boolean;
+    children?: React.ReactNode;
+    hideBorder?: boolean;
+};
+export declare const MenuItemDropdown: React.FC<MenuItemDropdownProps>;

package/dist/esm/components/dropdown/MenuItem/MenuItem.js

@@ -0,0 +1,5 @@
+import{jsx as o}from"react/jsx-runtime";import e from"../../../assets/icons/horizontal_dots.svg.js";import t from"../../../assets/icons/vertical_dots.svg.js";import n from"styled-components";import"../Dropdown.js";import{DropdownPopover as r}from"../DropdownPopover/index.js";import"react";import"../../zeroState/ZeroState.js";import"../../TypographyStyle.js";import{COLORS as s}from"../../../constants/Theme.js";import"../OpenedDropdown/components/description/Description.styled.js";import"../../checkBox/CheckBox.styled.js";import"../../list-item/ListItem.js";import"../OpenedDropdown/components/menu/FreeFormMenu.styled.js";import"../OpenedDropdown/components/menu/MenuItem.js";import"../OpenedDropdown/components/menu/MenuList.styled.js";import"../OpenedDropdown/components/menu/SelectAllMenu.js";import"../../button/Button.js";import"../OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js";import"../OpenedDropdown/components/OpennedDropdown.styled.js";import"../../input/Input.js";import{IconButton as p}from"../../icon-button/IconButton.js";const i=n.div`
+	:hover {
+		background: ${s.surface.subdued};
+	}
+`,m=n=>o(i,{children:o(r,Object.assign({},n,{children:o("div",{children:o(p,{Icon:n.isHorizontal?e:t,bordered:!(null==n?void 0:n.hideBorder)})})}))});m.displayName="MenuItemDropdown";export{m as MenuItemDropdown};

package/dist/esm/components/dropdown/OpenedDropdown/components/OpennedDropdown.js

@@ -1 +1 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as l,useRef as n,useEffect as o}from"react";import{useOutside as i}from"../../../../hooks/useOutside.js";import{iterateOnOptions as s}from"../utils/iterationOnOptions.js";import{Description as r}from"./description/Description.js";import{FreeFormMenu as c}from"./menu/FreeFormMenu.js";import{MenuList as u}from"./menu/MenuList.js";import{SelectAllMenu as a}from"./menu/SelectAllMenu.js";import p from"./multiSelect/MultiSelectDropdownBottomBar.js";import{OpennedDropdownContainer as d,MenuListContainer as m}from"./OpennedDropdown.styled.js";import{SearchBox as f}from"./searchbox/SearchBox.js";import{SearchZeroState as h}from"./searchbox/SearchZeroState.js";const b=304,j=290,S=S=>{let{options:g,isSearchable:v,isMultiSelect:O,width:x,allowFreeForm:y,height:F,onClose:w,onSelect:M}=S;const[D,A]=l(null!=g?g:[]),[B,C]=l(null!=x?x:j),[W,k]=l(""),[E,H]=l(null),I=n(null);i(I,(()=>{H(null),null==w||w()}));const L=null!=F?F:b,Z="number"==typeof L?v&&O?L-96:v&&!O||!v&&O?L-48:L:L;function q(e){if(O){const t=s(D,{selected:e.selected},(t=>t.value===e.value));A([...t])}else null==M||M(e)}o((()=>{const e=null!=x?x:j;if(null===E)C(e);else if("number"==typeof e)C(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));C(t)}}),[E]);const z=D.map((e=>{var t;if(W){if(e.options){const t=Object.assign({},e);return t.options=t.options.filter((e=>{var t;return!!(null===(t=e.label)||void 0===t?void 0:t.includes(W))})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.includes(W))?e:null}return e})).filter((e=>null!==e)),G=!!v&&W&&0===z.length;return e(d,Object.assign({ref:I,style:{maxWidth:E?800:400,width:B}},{children:[e("div",Object.assign({style:{width:E?"50%":"100%",display:"flex",flexDirection:"column"}},{children:[!!v&&t(f,{onSearch:function(e){k(e)}}),e(m,Object.assign({maxHeight:Z},{children:[!!O&&!G&&t(a,{options:D,onSelect:function(e){if("selectAll"===e){const e=s(D,{selected:!0},(e=>!e.disabled));A([...e])}else if("notSelected"===e){const e=s(D,{selected:!1},(e=>!e.disabled));A([...e])}}}),!y&&G&&t(h,{searchedString:W}),y&&G&&t(c,{isMultiSelect:O,onSelect:function(e){if(!O)return void q({label:W,value:W,isFreeForm:!0,selected:!0});const t=D.map((t=>t.options?t:Object.assign(Object.assign({},t),{selected:t.label===W&&t.value===W&&e})));e&&(t.some((e=>e.label===W&&e.value===W))||t.unshift({label:W,value:W,isFreeForm:!0,selected:!0})),A([...t])},searchedString:W}),t(u,{onSelect:q,showDescription:function(e,t){H(e&&t?{title:e,description:t}:null)},isMultiSelect:O,options:z})]})),!!O&&t(p,{onClear:function(){const e=s(D,{selected:!1});A([...e])},onApply:function(){const e=[];D.forEach((t=>{if(t.options){const l=t.options.filter((e=>!0===e.selected));e.push(Object.assign(Object.assign({},t),{options:[...l]}))}else t.selected&&e.push(Object.assign({},t))})),null==M||M([...e])},list:D})]})),!!E&&t(r,{title:E.title,description:E.description})]}))};export{S as OpenedDropdown};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as l,useEffect as o,useRef as s}from"react";import{ZeroState as i}from"../../../zeroState/ZeroState.js";import{useOutside as n}from"../../../../hooks/useOutside.js";import{iterateOnOptions as r}from"../utils/iterationOnOptions.js";import{Description as c}from"./description/Description.js";import{FreeFormMenu as a}from"./menu/FreeFormMenu.js";import{MenuList as u}from"./menu/MenuList.js";import{SelectAllMenu as p}from"./menu/SelectAllMenu.js";import d from"./multiSelect/MultiSelectDropdownBottomBar.js";import{OpennedDropdownContainer as f,MenuListContainer as m}from"./OpennedDropdown.styled.js";import{SearchBox as h}from"./searchbox/SearchBox.js";import{SearchZeroState as b}from"./searchbox/SearchZeroState.js";const g=304,j=290,S=S=>{let{options:v,isSearchable:O,isMultiSelect:w,width:y,allowFreeForm:x,height:C,onClose:F,onSelect:L}=S;const[M,D]=l(null!=v?v:[]);o((()=>{D(v)}),[v]);const[A,B]=l(null!=y?y:j),[k,H]=l(""),[Z,q]=l(null),z=s(null);n(z,(()=>{q(null),null==F||F()}));const E=null!=C?C:g,I="number"==typeof E?O&&w?E-96:O&&!w||!O&&w?E-48:E:E;function N(e){if(w){const t=r(M,{selected:e.selected},(t=>t.value===e.value));D([...t])}else null==L||L(e)}o((()=>{const e=null!=y?y:j;if(null===Z)B(e);else if("number"==typeof e)B(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));B(t)}}),[Z]);const P=[],T=M.map((e=>{var t;if(k){if(e.options){const t=Object.assign({},e);return t.options=t.options.filter((e=>{var t;return!!(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(k.toLowerCase()))&&(P.push(!k||e.label===k),!0)})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(k.toLowerCase()))?(P.push(!k||e.label===k),e):null}return e})).filter((e=>null!==e)),W=!!O&&k&&0===T.length;return e(f,Object.assign({ref:z,style:{width:A}},{children:[e("div",Object.assign({style:{width:Z?"50%":"100%",display:"flex",flexDirection:"column"}},{children:[!!O&&t(h,{onSearch:function(e){H(e)}}),T.length||k?e(m,Object.assign({minHeight:E,maxHeight:I},{children:[!!w&&!W&&t(p,{options:M,onSelect:function(e){if("selectAll"===e){const e=r(M,{selected:!0},(e=>{var t;return k?(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(k.toLowerCase()))&&!e.disabled:!e.disabled}));D([...e])}else if("notSelected"===e){const e=r(M,{selected:!1},(e=>!e.disabled));D([...e])}}}),!x&&W&&t(b,{searchedString:k}),x&&(W||!!P.length&&P.every((e=>!1===e)))&&t(a,{isMultiSelect:w,onSelect:function(e){if(!w)return void N({label:k,value:k,isFreeForm:!0,selected:!0});const t=M.map((t=>t.options?t:Object.assign(Object.assign({},t),{selected:t.label===k&&t.value===k?e:t.selected})));e&&(t.some((e=>e.label===k&&e.value===k))||t.unshift({label:k,value:k,isFreeForm:!0,selected:!0})),D([...t])},searchedString:k}),t(u,{onSelect:N,showDescription:function(e,t){q(e&&t?{title:e,description:t}:null)},isMultiSelect:w,options:T})]})):t("div",Object.assign({style:{height:E,display:"flex"}},{children:t(i,{title:"No results found",subTitle:"Please try again later or contact us at support@bik.ai if you require further assistance."})})),!!w&&!(!T.length&&!k)&&t(d,{onClear:function(){const e=r(M,{selected:!1});D([...e])},onApply:function(){const e=[];M.forEach((t=>{if(t.options){const l=t.options.filter((e=>!0===e.selected));e.push(Object.assign(Object.assign({},t),{options:[...l]}))}else t.selected&&e.push(Object.assign({},t))})),null==L||L([...e])},list:M})]})),!!Z&&t(c,{title:Z.title,description:Z.description})]}))};export{S as OpenedDropdown};

package/dist/esm/components/dropdown/OpenedDropdown/components/OpennedDropdown.styled.d.ts

@@ -2,4 +2,5 @@ export declare const OpennedDropdownContainer: import("styled-components").Style
 export declare const ItemContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const MenuListContainer: import("styled-components").StyledComponent<"div", any, {
     maxHeight: number | string;
+    minHeight: number | string;
 }, never>;

package/dist/esm/components/dropdown/OpenedDropdown/components/OpennedDropdown.styled.js

@@ -1,4 +1,4 @@
-import o from"styled-components";import{COLORS as e}from"../../../../constants/Theme.js";const t=o.div`
+import o from"styled-components";import{COLORS as e}from"../../../../constants/Theme.js";const r=o.div`
 	border-radius: 4px;
 	border: 1px solid ${e.stroke.primary};
 	max-height: 640px;
@@ -15,10 +15,12 @@ import o from"styled-components";import{COLORS as e}from"../../../../constants/T
 	border-bottom-color: ${e.stroke.primary};
 	width: 100%;
 	height: 100%;
-`;const i=o.div`
+`;const t=o.div`
 	max-height: ${o=>"number"==typeof o.maxHeight?`${o.maxHeight}px`:o.maxHeight};
+
 	overflow-y: auto;
 	flex: 1;
 	display: flex;
 	flex-direction: column;
-`;export{i as MenuListContainer,t as OpennedDropdownContainer};
+	background-color: ${e.surface.standard};
+`;export{t as MenuListContainer,r as OpennedDropdownContainer};

package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuItem.d.ts

@@ -5,4 +5,5 @@ export declare const MenuItem: React.FC<{
     isMultiSelect?: boolean;
     showDescription: (title?: string, description?: string) => void;
     onSelect: (option: SingleOption) => void;
+    last?: boolean;
 }>;

package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuItem.js

@@ -1,4 +1,4 @@
 import{jsx as e,Fragment as t}from"react/jsx-runtime";import o from"styled-components";import{CheckBox as i}from"../../../../checkBox/CheckBox.js";import{ListItem as n}from"../../../../list-item/ListItem.js";import{BodyCaption as s}from"../../../../TypographyStyle.js";import{COLORS as r}from"../../../../../constants/Theme.js";import{FreeFormContainer as l}from"./FreeFormMenu.styled.js";const c=o(n)`
 	padding: 14px 16px !important;
 	cursor: default;
-`,a=o=>{let{option:n,isMultiSelect:a,showDescription:m,onSelect:d}=o;var p;function u(e){n.disabled||d(Object.assign(Object.assign({},n),{selected:e}))}return e(c,{onClick:e=>{e.preventDefault(),u(!n.selected)},onMouseOver:function(){n.description?m(n.label,n.description):m()},listItem:{value:n.value,label:n.label},subText:n.subText,leadingIcon:a?e(i,{isDisabled:null!==(p=n.disabled)&&void 0!==p&&p,isChecked:!!n.selected,onValueChange:u}):e(t,{}),customComponent:n.customComponent,trailingIcon:n.isFreeForm?e(l,{children:e(s,Object.assign({style:{color:r.content.secondary}},{children:"Freeform"}))}):n.trailingIcon?e(t,{children:n.trailingIcon}):e(t,{}),variant:n.disabled?"inactive":n.selected?"selected":"default"})};export{a as MenuItem};
+`,a=o=>{let{option:n,isMultiSelect:a,showDescription:m,onSelect:d,last:p}=o;var u;function b(e){n.disabled||d(Object.assign(Object.assign({},n),{selected:e}))}return e(c,{style:p?{borderBottom:0}:{},onClick:e=>{e.preventDefault(),b(!n.selected)},onMouseOver:function(){n.description?m(n.label,n.description):m()},listItem:{value:n.value,label:n.label},subText:n.subText,leadingIcon:a?e(i,{isDisabled:null!==(u=n.disabled)&&void 0!==u&&u,isChecked:!!n.selected,onValueChange:b}):e(t,{}),customComponent:n.customComponent,trailingIcon:n.isFreeForm?e(l,{children:e(s,Object.assign({style:{color:r.content.secondary}},{children:"Freeform"}))}):n.trailingIcon?e(t,{children:n.trailingIcon}):e(t,{}),variant:n.disabled?"inactive":n.selected?"selected":"default"})};export{a as MenuItem};

package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuList.js

@@ -1 +1 @@
-import{jsx as t,Fragment as e,jsxs as o}from"react/jsx-runtime";import{MenuItem as i}from"./MenuItem.js";import{StyledGroupedLabel as n}from"./MenuList.styled.js";const r=r=>{let{options:s,isMultiSelect:l,showDescription:c,onSelect:p}=r;return t(e,{children:s.map(((e,r)=>{if(e.options){const s=e;return o("div",{children:[t(n,{children:s.label}),s.options.map(((e,o)=>t(i,{onSelect:p,showDescription:c,isMultiSelect:l,option:e},o)))]},r)}return t(i,{onSelect:p,showDescription:c,isMultiSelect:l,option:e},r)}))})};export{r as MenuList};
+import{jsx as t,Fragment as e,jsxs as o}from"react/jsx-runtime";import{MenuItem as i}from"./MenuItem.js";import{StyledGroupedLabel as n}from"./MenuList.styled.js";const s=s=>{let{options:r,isMultiSelect:l,showDescription:c,onSelect:p}=s;return t(e,{children:r.map(((e,s)=>{const m=s===r.length-1;if(e.options){const r=e;return o("div",{children:[t(n,{children:r.label}),r.options.map(((e,o)=>t(i,{last:m,onSelect:p,showDescription:c,isMultiSelect:l,option:e},o)))]},s)}return t(i,{last:m,onSelect:p,showDescription:c,isMultiSelect:l,option:e},s)}))})};export{s as MenuList};

package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuList.styled.d.ts

@@ -1 +1,4 @@
-export declare const StyledGroupedLabel: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledGroupedLabel: import("styled-components").StyledComponent<"div", any, {
+    numberOfLines?: number | undefined;
+    color?: string | undefined;
+}, never>;

package/dist/esm/components/dropdown/OpenedDropdown/components/searchbox/SearchBox.js

@@ -1 +1 @@
-import{jsx as r,Fragment as o}from"react/jsx-runtime";import{createRef as t}from"react";import{Input as e}from"../../../../input/Input.js";import{InputStyleContext as n}from"../../../../input/context/InputStyleProvider.js";import{COLORS as i}from"../../../../../constants/Theme.js";import c from"../../../../../assets/icons/cross.svg.js";import s from"../../../../../assets/icons/search.svg.js";const p=p=>{let{onSearch:a}=p;const l=t();return r(n.Provider,Object.assign({value:{InputWrapper:{borderRadius:0,border:0,borderBottom:"1px solid "+i.stroke.primary,padding:"14px 16px"},IconHolder:{marginLeft:0},input:{marginLeft:4,minHeight:"100%"}}},{children:r(e,{ref:l,placeholder:"Search",leftIcon:{icon:()=>r(s,{width:24,height:24,color:i.content.placeholder})},rightIcon:{icon:()=>{var t;return(null===(t=null==l?void 0:l.current)||void 0===t?void 0:t.value)?r(c,{onClick:()=>{l.current&&(l.current.value=""),a("")},width:24,height:24,color:i.content.placeholder}):r(o,{})}},onChangeText:a})}))};export{p as SearchBox};
+import{jsx as r,Fragment as o}from"react/jsx-runtime";import{useState as t}from"react";import{Input as e}from"../../../../input/Input.js";import{InputStyleContext as n}from"../../../../input/context/InputStyleProvider.js";import{COLORS as i}from"../../../../../constants/Theme.js";import s from"../../../../../assets/icons/cross.svg.js";import c from"../../../../../assets/icons/search.svg.js";const p=p=>{let{onSearch:m}=p;const[a,h]=t(""),[d,l]=t(!1);return r(n.Provider,Object.assign({value:{InputWrapper:{borderRadius:0,border:0,borderBottom:"1px solid "+i.stroke.primary,padding:"14px 16px"},IconHolder:{marginLeft:0},input:{marginLeft:4,minHeight:"100%"}}},{children:r(e,{placeholder:"Search",leftIcon:{icon:()=>r(c,{width:24,height:24,color:i.content.placeholder})},rightIcon:{icon:()=>a?r(s,{onClick:()=>{l(!0),m(""),h("")},width:24,height:24,color:i.content.placeholder}):r(o,{})},reset:d,onChangeText:r=>{l(!1),h(r),m(r)}})}))};export{p as SearchBox};

package/dist/esm/components/dropdown/OpenedDropdown/components/searchbox/SearchZeroState.js

@@ -1 +1 @@
-import{jsx as t}from"react/jsx-runtime";import{ZeroState as r}from"../../../../zeroState/ZeroState.js";const e=e=>{let{searchedString:o}=e;return t(r,{title:"No results found",subTitle:`Sorry we could not find any results for "${null!=o?o:""}"`})};export{e as SearchZeroState};
+import{jsx as t}from"react/jsx-runtime";import{ZeroState as r}from"../../../../zeroState/ZeroState.js";const e=e=>{let{searchedString:o}=e;return t("div",Object.assign({style:{margin:"28px auto"}},{children:t(r,{title:"No results found",subTitle:`Sorry we could not find any results for "${null!=o?o:""}"`})}))};export{e as SearchZeroState};

package/dist/esm/components/dropdown/OpenedDropdown/utils/iterationOnOptions.d.ts

@@ -3,7 +3,7 @@ import { DropdownOption, SingleOption } from '../../type';
 export declare function iterateOnOptions(options: DropdownOption[], newVal: Partial<SingleOption>, checkCB?: (optionForValidation: SingleOption) => boolean): ({
     label: string;
     value: string;
-    descriptions?: string | null | undefined;
+    description?: string | null | undefined;
     selected?: boolean | undefined;
     disabled?: boolean | undefined;
     isFreeForm?: boolean | undefined;
@@ -13,7 +13,7 @@ export declare function iterateOnOptions(options: DropdownOption[], newVal: Part
 } | {
     label?: string | undefined;
     value?: string | undefined;
-    descriptions?: string | null | undefined;
+    description?: string | null | undefined;
     selected?: boolean | undefined;
     disabled?: boolean | undefined;
     isFreeForm?: boolean | undefined;

package/dist/esm/components/dropdown/index.d.ts

@@ -1,3 +1,4 @@
 export * from './Dropdown';
 export * from './DropdownPopover';
 export * from './OpenedDropdown';
+export * from './MenuItem/MenuItem';

package/dist/esm/components/dropdown/type.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="react" />
+import { Placement } from '@popperjs/core';
 export interface OpenDropdownProps {
     defaultOptions?: DropdownOption[];
     options: DropdownOption[];
@@ -10,6 +11,7 @@ export interface OpenDropdownProps {
     allowFreeForm?: boolean;
     onClose?: () => void;
     onSelect?: (option: DropdownOption | DropdownOption[]) => void;
+    placement?: Placement;
 }
 export type GroupedOption = {
     label?: string;

package/dist/esm/components/fab-menu/FABMenu.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { DropdownOption } from '../dropdown/type';
 import { DROP_POSITION, FAB_POSITION, MENU_ALIGNMENT } from '../floating-action-button/FloatingActionButton.styles';
-import { TooltipPlacement } from '../tooltips';
+import { Placement } from '../tooltips';
 export declare const FABMenu: React.FC<{
     onSelect: (selected: DropdownOption | DropdownOption[]) => void;
     menuOptions: DropdownOption[];
@@ -14,8 +14,9 @@ export declare const FABMenu: React.FC<{
     buttonIcon?: JSX.Element;
     buttonPaddingHorizontal?: number;
     buttonPaddingVertical?: number;
-    tooltipPlacement?: TooltipPlacement;
+    tooltipPlacement?: Placement;
     tooltipText?: string;
+    tooltipWidth?: number;
     zIndex?: number;
     isRound?: boolean;
     dropPosition?: DROP_POSITION;

package/dist/esm/components/fab-menu/FABMenu.js

@@ -1 +1 @@
-import{jsx as t}from"react/jsx-runtime";import{OpenedDropdown as o}from"../dropdown/OpenedDropdown/components/OpennedDropdown.js";import{FloatingActionButton as n}from"../floating-action-button/FloatingActionButton.js";import"../floating-action-button/FloatingActionButton.styles.js";const i=i=>{const{onSelect:e,menuOptions:d,buttonWidth:r,buttonHeight:l,buttonColor:u,buttonPosition:p,menuWidth:c,menuHeight:s,buttonIcon:a,buttonPaddingHorizontal:m,buttonPaddingVertical:g,tooltipPlacement:b,tooltipText:h,zIndex:P,isRound:x,dropPosition:f,menuAligment:j}=i;return t("div",{children:t(n,Object.assign({icon:a,width:r,height:l,color:u,position:p,buttonPaddingHorizontal:m,buttonPaddingVertical:g,tooltipPlacement:b,tooltipText:h,zIndex:P,isRound:x,dropPosition:f,menuAligment:j},{children:t(o,{options:d,height:s||90,width:`${c}px`,onSelect:e})}))})};export{i as FABMenu};
+import{jsx as t}from"react/jsx-runtime";import{OpenedDropdown as o}from"../dropdown/OpenedDropdown/components/OpennedDropdown.js";import{FloatingActionButton as n}from"../floating-action-button/FloatingActionButton.js";import"../floating-action-button/FloatingActionButton.styles.js";const i=i=>{const{onSelect:e,menuOptions:d,buttonWidth:r,buttonHeight:l,buttonColor:p,buttonPosition:u,menuWidth:c,menuHeight:s,buttonIcon:a,buttonPaddingHorizontal:m,buttonPaddingVertical:g,tooltipPlacement:h,tooltipText:b,zIndex:P,isRound:x,dropPosition:f,menuAligment:j,tooltipWidth:w}=i;return t("div",{children:t(n,Object.assign({icon:a,width:r,height:l,color:p,position:u,buttonPaddingHorizontal:m,buttonPaddingVertical:g,tooltipPlacement:h,tooltipText:b,zIndex:P,isRound:x,dropPosition:f,menuAligment:j,tootipWidth:w},{children:t(o,{options:d,height:s||90,width:`${c}px`,onSelect:e})}))})};export{i as FABMenu};

package/dist/esm/components/file-uploader/FileUploader.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { FileUploaderProps } from "./Models";
+declare const FileUploader: React.FC<FileUploaderProps>;
+export default FileUploader;

package/dist/esm/components/file-uploader/FileUploaderStyle.d.ts

@@ -0,0 +1,7 @@
+export declare const FileUploaderStyle: import("styled-components").StyledComponent<"div", any, {
+    showProgressBar: boolean;
+    width?: string | undefined;
+}, never>;
+export declare const FileUploadedStyle: import("styled-components").StyledComponent<"div", any, {
+    width?: string | undefined;
+}, never>;

package/dist/esm/components/file-uploader/FileUploaderStyle.js

@@ -0,0 +1,166 @@
+import e from"styled-components";import{COLORS as i}from"../../constants/Theme.js";e.div`
+	height: 100%;
+	width: 440px;
+	border: 1px dashed ${i.stroke.primary};
+	border-radius: 4px;
+	gap: 24px;
+	align-items: cneter;
+	background-color: ${i.surface.subdued};
+	.fileUploader {
+		display: flex;
+		flex-direction: column;
+		padding: 24px;
+		gap: 32px;
+		&__header {
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+			justify-content: center;
+			gap: 8px;
+			&__icon {
+				cursor: default;
+				display: flex;
+				width: 80px;
+				height: 80px;
+				background-color: ${i.background.base};
+				border-radius: 50%;
+				align-items: center;
+				justify-content: center;
+			}
+			&__title {
+				cursor: default;
+				display: flex;
+				width: calc(100% - 24px);
+				justify-content: center;
+				padding-top: 8px;
+			}
+			&__caption {
+				cursor: default;
+			}
+		}
+		&__body {
+			display: flex;
+			flex-direction: column;
+			gap: 16px;
+			&__divider {
+				display: flex;
+				.left {
+					border-top: 1px solid ${i.stroke.primary};
+					flex-grow: 1;
+					margin-top: 8px;
+					margin-right: 8px;
+				}
+				.right {
+					border-top: 1px solid ${i.stroke.primary};
+					flex-grow: 1;
+					margin-top: 8px;
+					margin-left: 8px;
+				}
+			}
+			&__upload {
+				display: flex;
+				flex-direction: row;
+				width: 100%;
+				height: 40px;
+				border: 1px solid ${i.content.brand};
+				border-radius: 4px;
+				label {
+					width: 100%;
+					height: 100%;
+					cursor: pointer;
+					.file-uploader {
+						display: flex;
+						flex-direction: row;
+						width: 100%;
+						height: 100%;
+						align-items: center;
+						justify-content: center;
+						color: ${i.content.brand};
+						gap: 10px;
+					}
+				}
+			}
+			&__cancel-button {
+				align-self: center;
+			}
+		}
+	}
+
+	.fileUploadError {
+		height: 36px;
+		width: 100%;
+		position: relative;
+	}
+`,e.div`
+	display: flex;
+	flex-direction: column;
+	height: 100%;
+	width: 440px;
+	border: 1px dashed ${i.stroke.primary};
+	border-radius: 4px;
+	gap: 24px;
+	align-items: cneter;
+	background-color: ${i.surface.subdued};
+	padding: 60px 16px;
+	.fileUploaded {
+		width: 100%;
+		&__header {
+			display: flex;
+			flex-direction: column;
+			width: 100%;
+			align-items: center;
+			justify-content: center;
+			gap: 16px;
+			&__icon {
+				display: flex;
+				width: 80px;
+				height: 80px;
+				background-color: ${i.background.positive.vibrant};
+				border-radius: 50%;
+				align-items: center;
+				justify-content: center;
+			}
+		}
+		&__body {
+			display: flex;
+			flex-direction: column;
+			width: 100%;
+			gap: 24px;
+			&__file-detail {
+				display: flex;
+				flex-direction: row;
+				height: 56px;
+				background-color: ${i.surface.standard};
+				border: 1px solid ${i.stroke.primary};
+				border-radius: 4px;
+				align-items: center;
+				padding: 16px;
+				gap: 12px;
+				&__icon {
+					display: flex;
+					width: fit-content;
+				}
+				&__name {
+					overflow: hidden;
+					white-space: nowrap;
+					text-overflow: ellipsis;
+				}
+				&__size {
+					display: flex;
+					margin-left: auto;
+					width: fit-content;
+				}
+			}
+			&__buttons {
+				display: flex;
+				flex-direction: row;
+				gap: 12px;
+				&__edit,
+				&__done {
+					display: flex;
+					flex: 1;
+				}
+			}
+		}
+	}
+`;

package/dist/esm/components/file-uploader/Models.d.ts

@@ -0,0 +1,34 @@
+export interface FileMetaData {
+    fileId: string;
+    fileName: string;
+    fileSize: string;
+    fileType: string;
+    fileUrl: string;
+    uploadType: 'URL' | 'FileUpload';
+    uploadDate: Date;
+}
+export interface FileUploadRules {
+    allowedFormats: string;
+    allowedSize: {
+        [key: string]: number;
+    };
+}
+export interface FileUploaderInterface {
+    onFileUpload: (file: File, metaData: FileMetaData) => void;
+    fileUploadRules: FileUploadRules;
+    onError: (error: string) => void;
+}
+export interface FileMetaFromUrl {
+    type: string;
+    size: number;
+}
+export interface FileUploaderProps {
+    uploadFile?: (file: File, fileName: string) => Promise<string>;
+    getFileMetaFromUrl?: (url: string) => Promise<FileMetaFromUrl>;
+    fileUploadRules: FileUploadRules;
+    onError: (error: string) => void;
+    uploadProgress: number;
+    onCancel: () => void;
+    onSuccess: (file: File, fileMeta: FileMetaData) => void;
+    fileName?: string;
+}

package/dist/esm/components/file-uploader/index.d.ts

@@ -0,0 +1 @@
+export * from './FileUploader';

package/dist/esm/components/file-uploader/useMockUrlUpload.d.ts

@@ -0,0 +1,8 @@
+import { FileMetaFromUrl } from "./Models";
+interface URLUploadOptions {
+    getFileMetaFromUrl: (url: string) => Promise<FileMetaFromUrl>;
+    error?: string;
+    success?: boolean;
+}
+declare const useMockUrlUpload: () => URLUploadOptions;
+export default useMockUrlUpload;