@bikdotai/bik-component-library 0.0.799-beta.3 → 0.0.799-beta.4

package/dist/cjs/components/dropdown-button/DropdownButton.d.ts

@@ -1,9 +1,11 @@
 import React from 'react';
 import { DropdownProps } from "../dropdown";
 import { ButtonProps } from '../button/model';
+import { IconButtonProps } from '../icon-button/model';
 export interface DropdownButtonProps {
     dropdownProps: DropdownProps;
-    buttonProps: ButtonProps;
     iconProps: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
+    buttonProps?: ButtonProps;
+    iconButtonProps?: IconButtonProps;
 }
 export declare const DropdownButton: React.FC<DropdownButtonProps>;

package/dist/cjs/components/dropdown-button/DropdownButton.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),o=require("react/jsx-runtime"),r=require("../dropdown/DropdownPopover/index.js");require("../dropdown/Dropdown.js"),require("../dropdown/ChipDropdown.js"),require("react"),require("../zeroState/ZeroState.js"),require("../../constants/Theme.js"),require("lodash/debounce"),require("../TypographyStyle.js"),require("../dropdown/OpenedDropdown/components/description/Description.styled.js"),require("../checkBox/CheckBox.styled.js"),require("../list-item/ListItem.js"),require("../dropdown/OpenedDropdown/components/menu/FreeFormMenu.styled.js"),require("../dropdown/OpenedDropdown/components/menu/MenuItem.js"),require("../dropdown/OpenedDropdown/components/menu/MenuList.styled.js");var n=require("../button/Button.js");require("../dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js"),require("../dropdown/OpenedDropdown/components/OpennedDropdown.styled.js"),require("../icon-button/IconButton.js"),require("../input/Input.js"),require("../dropdown/MenuItem/MenuItem.js");var t=require("../button/themes.js"),s=require("../spinner/Spinner.js"),i=require("./DropdownButton.style.js");exports.DropdownButton=d=>{var p,u;const a=d.buttonProps,l=e.__rest(a,["onClick"]);return o.jsxs(i.DropdownButtonStyle,Object.assign({type:d.buttonProps.buttonType,disabled:d.buttonProps.disabled},{children:[(null===(p=d.buttonProps)||void 0===p?void 0:p.isLoading)&&o.jsx(i.LoaderContainer,Object.assign({type:d.buttonProps.buttonType},{children:o.jsx(s.Spinner,{className:"spinner",size:"small",color:t.SpinnerColorMap(d.buttonProps.buttonType||"primary",d.buttonProps.inverse)})})),o.jsx(n.Button,Object.assign({},d.buttonProps,{isLoading:!1,style:{borderRadius:"0px",borderTopLeftRadius:"4px",borderBottomLeftRadius:"4px",borderRight:"0px"}})),o.jsx("div",{className:"dd-button-divider"}),o.jsx(r.DropdownPopover,Object.assign({},d.dropdownProps,{isChildLoading:null===(u=d.buttonProps)||void 0===u?void 0:u.isLoading},{children:o.jsx(n.Button,Object.assign({},l,{isLoading:!1,buttonText:"",TrailingIcon:d.iconProps,style:{borderRadius:"0px",borderTopRightRadius:"4px",borderBottomRightRadius:"4px"}}))}))]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var o=require("../../_virtual/_tslib.js"),e=require("react/jsx-runtime"),r=require("../dropdown/DropdownPopover/index.js");require("../dropdown/Dropdown.js"),require("../dropdown/ChipDropdown.js"),require("react"),require("../zeroState/ZeroState.js"),require("../../constants/Theme.js"),require("lodash/debounce"),require("../TypographyStyle.js"),require("../dropdown/OpenedDropdown/components/description/Description.styled.js"),require("../checkBox/CheckBox.styled.js"),require("../list-item/ListItem.js"),require("../dropdown/OpenedDropdown/components/menu/FreeFormMenu.styled.js"),require("../dropdown/OpenedDropdown/components/menu/MenuItem.js"),require("../dropdown/OpenedDropdown/components/menu/MenuList.styled.js");var n=require("../button/Button.js");require("../dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js"),require("../dropdown/OpenedDropdown/components/OpennedDropdown.styled.js");var t=require("../icon-button/IconButton.js");require("../input/Input.js"),require("../dropdown/MenuItem/MenuItem.js");var s=require("../button/themes.js"),i=require("../spinner/Spinner.js"),d=require("./DropdownButton.style.js");exports.DropdownButton=p=>{var u,l,a,c,b,j;const x=!!p.iconButtonProps,m=x?null===(u=p.iconButtonProps)||void 0===u?void 0:u.disabled:null===(l=p.buttonProps)||void 0===l?void 0:l.disabled;if(x){const{iconButtonProps:o}=p;return e.jsxs(d.DropdownButtonStyle,Object.assign({type:void 0,disabled:m,isIconButton:!0,iconButtonType:null!==(a=null==o?void 0:o.iconButtonType)&&void 0!==a?a:"primary"},{children:[e.jsx(t.IconButton,Object.assign({},o,{style:{borderRadius:"0px",borderTopLeftRadius:"4px",borderBottomLeftRadius:"4px"}})),e.jsx("div",{className:"dd-button-divider"}),e.jsx(r.DropdownPopover,Object.assign({},p.dropdownProps,{isChildLoading:!1},{children:e.jsx(t.IconButton,{Icon:p.iconProps,iconButtonType:null!==(c=null==o?void 0:o.iconButtonType)&&void 0!==c?c:"primary",disabled:m,style:{borderRadius:"0px",borderTopRightRadius:"4px",borderBottomRightRadius:"4px"}})}))]}))}const y=p.buttonProps,w=o.__rest(y,["onClick"]);return e.jsxs(d.DropdownButtonStyle,Object.assign({type:p.buttonProps.buttonType,disabled:p.buttonProps.disabled},{children:[(null===(b=p.buttonProps)||void 0===b?void 0:b.isLoading)&&e.jsx(d.LoaderContainer,Object.assign({type:p.buttonProps.buttonType},{children:e.jsx(i.Spinner,{className:"spinner",size:"small",color:s.SpinnerColorMap(p.buttonProps.buttonType||"primary",p.buttonProps.inverse)})})),e.jsx(n.Button,Object.assign({},p.buttonProps,{isLoading:!1,style:{borderRadius:"0px",borderTopLeftRadius:"4px",borderBottomLeftRadius:"4px",borderRight:"0px"}})),e.jsx("div",{className:"dd-button-divider"}),e.jsx(r.DropdownPopover,Object.assign({},p.dropdownProps,{isChildLoading:null===(j=p.buttonProps)||void 0===j?void 0:j.isLoading},{children:e.jsx(n.Button,Object.assign({},w,{isLoading:!1,buttonText:"",TrailingIcon:p.iconProps,style:{borderRadius:"0px",borderTopRightRadius:"4px",borderBottomRightRadius:"4px"}}))}))]}))};

package/dist/cjs/components/dropdown-button/DropdownButton.style.d.ts

@@ -1,7 +1,10 @@
 import { Type } from '../button/model';
+import { IconButtonType } from '../icon-button/model';
 export declare const DropdownButtonStyle: import("styled-components").StyledComponent<"div", any, {
     type: Type | undefined;
     disabled: boolean | undefined;
+    isIconButton?: boolean | undefined;
+    iconButtonType?: IconButtonType | undefined;
 }, never>;
 export declare const LoaderContainer: import("styled-components").StyledComponent<"div", any, {
     type: Type | undefined;

package/dist/cjs/components/dropdown-button/DropdownButton.style.js

@@ -1,14 +1,15 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../constants/Theme.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=r(e);const i=n.default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("styled-components"),e=require("../../constants/Theme.js");function r(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var n=r(t);const i=n.default.div`
 	display: flex;
 	flex-direction: row;
 	width: max-content;
 	position: relative;
 	align-items: stretch;
+	${t=>{var r,n,i;return t.isIconButton&&`\n\t\tborder-radius: 4px;\n\t\tbackground: ${n=null!==(r=t.iconButtonType)&&void 0!==r?r:"primary",i=t.disabled,i?e.COLORS.background.inactive:"primary"===n?e.COLORS.background.inverseLight:"transparent"};\n\t\toverflow: hidden;\n\t`}}
 	.dd-button-divider {
-		width: ${e=>["primary","destructive"].includes(e.type)?"1px":"0px"};
-		background-color: ${e=>{return r=e.type,(null==e?void 0:e.disabled)?t.COLORS.content.inactive:"primary"===r?"#CDA2FC":t.COLORS.content.primaryInverse;var r}};
+		width: ${t=>["primary","destructive"].includes(t.type)||t.isIconButton?"1px":"0px"};
+		background-color: ${t=>{return t.isIconButton?"rgba(255, 255, 255, 0.3)":(r=t.type,(null==t?void 0:t.disabled)?e.COLORS.content.inactive:"primary"===r?"#CDA2FC":e.COLORS.content.primaryInverse);var r}};
 	}
-`,d=n.default.div`
+`,o=n.default.div`
 	position: absolute;
 	inset: 0;
 	display: flex;
@@ -17,6 +18,6 @@
 	justify-content: center;
 	width: 100%;
 	border-radius: 4px;
-	background: ${e=>(e=>{switch(e){case"destructive":return t.COLORS.background.negative.light;case"secondaryGray":return t.COLORS.surface.subdued;default:return t.COLORS.background.brandLight}})(e.type)};
+	background: ${t=>(t=>{switch(t){case"destructive":return e.COLORS.background.negative.light;case"secondaryGray":return e.COLORS.surface.subdued;default:return e.COLORS.background.brandLight}})(t.type)};
 	z-index: 3;
-`;exports.DropdownButtonStyle=i,exports.LoaderContainer=d;
+`;exports.DropdownButtonStyle=i,exports.LoaderContainer=o;

package/dist/esm/components/dropdown-button/DropdownButton.d.ts

@@ -1,9 +1,11 @@
 import React from 'react';
 import { DropdownProps } from "../dropdown";
 import { ButtonProps } from '../button/model';
+import { IconButtonProps } from '../icon-button/model';
 export interface DropdownButtonProps {
     dropdownProps: DropdownProps;
-    buttonProps: ButtonProps;
     iconProps: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
+    buttonProps?: ButtonProps;
+    iconButtonProps?: IconButtonProps;
 }
 export declare const DropdownButton: React.FC<DropdownButtonProps>;

package/dist/esm/components/dropdown-button/DropdownButton.js

@@ -1 +1 @@
-import{__rest as o}from"../../_virtual/_tslib.js";import{jsxs as t,jsx as n}from"react/jsx-runtime";import{DropdownPopover as r}from"../dropdown/DropdownPopover/index.js";import"../dropdown/Dropdown.js";import"../dropdown/ChipDropdown.js";import"react";import"../zeroState/ZeroState.js";import"../../constants/Theme.js";import"lodash/debounce";import"../TypographyStyle.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{Button as e}from"../button/Button.js";import"../dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js";import"../dropdown/OpenedDropdown/components/OpennedDropdown.styled.js";import"../icon-button/IconButton.js";import"../input/Input.js";import"../dropdown/MenuItem/MenuItem.js";import{SpinnerColorMap as p}from"../button/themes.js";import{Spinner as s}from"../spinner/Spinner.js";import{DropdownButtonStyle as i,LoaderContainer as d}from"./DropdownButton.style.js";const m=m=>{var u,a;const c=m.buttonProps,l=o(c,["onClick"]);return t(i,Object.assign({type:m.buttonProps.buttonType,disabled:m.buttonProps.disabled},{children:[(null===(u=m.buttonProps)||void 0===u?void 0:u.isLoading)&&n(d,Object.assign({type:m.buttonProps.buttonType},{children:n(s,{className:"spinner",size:"small",color:p(m.buttonProps.buttonType||"primary",m.buttonProps.inverse)})})),n(e,Object.assign({},m.buttonProps,{isLoading:!1,style:{borderRadius:"0px",borderTopLeftRadius:"4px",borderBottomLeftRadius:"4px",borderRight:"0px"}})),n("div",{className:"dd-button-divider"}),n(r,Object.assign({},m.dropdownProps,{isChildLoading:null===(a=m.buttonProps)||void 0===a?void 0:a.isLoading},{children:n(e,Object.assign({},l,{isLoading:!1,buttonText:"",TrailingIcon:m.iconProps,style:{borderRadius:"0px",borderTopRightRadius:"4px",borderBottomRightRadius:"4px"}}))}))]}))};export{m as DropdownButton};
+import{__rest as o}from"../../_virtual/_tslib.js";import{jsxs as t,jsx as n}from"react/jsx-runtime";import{DropdownPopover as r}from"../dropdown/DropdownPopover/index.js";import"../dropdown/Dropdown.js";import"../dropdown/ChipDropdown.js";import"react";import"../zeroState/ZeroState.js";import"../../constants/Theme.js";import"lodash/debounce";import"../TypographyStyle.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{Button as i}from"../button/Button.js";import"../dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js";import"../dropdown/OpenedDropdown/components/OpennedDropdown.styled.js";import{IconButton as e}from"../icon-button/IconButton.js";import"../input/Input.js";import"../dropdown/MenuItem/MenuItem.js";import{SpinnerColorMap as d}from"../button/themes.js";import{Spinner as s}from"../spinner/Spinner.js";import{DropdownButtonStyle as p,LoaderContainer as u}from"./DropdownButton.style.js";const m=m=>{var l,a,c,b,j,y;const w=!!m.iconButtonProps,g=w?null===(l=m.iconButtonProps)||void 0===l?void 0:l.disabled:null===(a=m.buttonProps)||void 0===a?void 0:a.disabled;if(w){const{iconButtonProps:o}=m;return t(p,Object.assign({type:void 0,disabled:g,isIconButton:!0,iconButtonType:null!==(c=null==o?void 0:o.iconButtonType)&&void 0!==c?c:"primary"},{children:[n(e,Object.assign({},o,{style:{borderRadius:"0px",borderTopLeftRadius:"4px",borderBottomLeftRadius:"4px"}})),n("div",{className:"dd-button-divider"}),n(r,Object.assign({},m.dropdownProps,{isChildLoading:!1},{children:n(e,{Icon:m.iconProps,iconButtonType:null!==(b=null==o?void 0:o.iconButtonType)&&void 0!==b?b:"primary",disabled:g,style:{borderRadius:"0px",borderTopRightRadius:"4px",borderBottomRightRadius:"4px"}})}))]}))}const v=m.buttonProps,h=o(v,["onClick"]);return t(p,Object.assign({type:m.buttonProps.buttonType,disabled:m.buttonProps.disabled},{children:[(null===(j=m.buttonProps)||void 0===j?void 0:j.isLoading)&&n(u,Object.assign({type:m.buttonProps.buttonType},{children:n(s,{className:"spinner",size:"small",color:d(m.buttonProps.buttonType||"primary",m.buttonProps.inverse)})})),n(i,Object.assign({},m.buttonProps,{isLoading:!1,style:{borderRadius:"0px",borderTopLeftRadius:"4px",borderBottomLeftRadius:"4px",borderRight:"0px"}})),n("div",{className:"dd-button-divider"}),n(r,Object.assign({},m.dropdownProps,{isChildLoading:null===(y=m.buttonProps)||void 0===y?void 0:y.isLoading},{children:n(i,Object.assign({},h,{isLoading:!1,buttonText:"",TrailingIcon:m.iconProps,style:{borderRadius:"0px",borderTopRightRadius:"4px",borderBottomRightRadius:"4px"}}))}))]}))};export{m as DropdownButton};

package/dist/esm/components/dropdown-button/DropdownButton.style.d.ts

@@ -1,7 +1,10 @@
 import { Type } from '../button/model';
+import { IconButtonType } from '../icon-button/model';
 export declare const DropdownButtonStyle: import("styled-components").StyledComponent<"div", any, {
     type: Type | undefined;
     disabled: boolean | undefined;
+    isIconButton?: boolean | undefined;
+    iconButtonType?: IconButtonType | undefined;
 }, never>;
 export declare const LoaderContainer: import("styled-components").StyledComponent<"div", any, {
     type: Type | undefined;

package/dist/esm/components/dropdown-button/DropdownButton.style.js

@@ -1,14 +1,15 @@
-import e from"styled-components";import{COLORS as t}from"../../constants/Theme.js";const r=e.div`
+import t from"styled-components";import{COLORS as e}from"../../constants/Theme.js";const r=t.div`
 	display: flex;
 	flex-direction: row;
 	width: max-content;
 	position: relative;
 	align-items: stretch;
+	${t=>{var r,n,i;return t.isIconButton&&`\n\t\tborder-radius: 4px;\n\t\tbackground: ${n=null!==(r=t.iconButtonType)&&void 0!==r?r:"primary",i=t.disabled,i?e.background.inactive:"primary"===n?e.background.inverseLight:"transparent"};\n\t\toverflow: hidden;\n\t`}}
 	.dd-button-divider {
-		width: ${e=>["primary","destructive"].includes(e.type)?"1px":"0px"};
-		background-color: ${e=>{return r=e.type,(null==e?void 0:e.disabled)?t.content.inactive:"primary"===r?"#CDA2FC":t.content.primaryInverse;var r}};
+		width: ${t=>["primary","destructive"].includes(t.type)||t.isIconButton?"1px":"0px"};
+		background-color: ${t=>{return t.isIconButton?"rgba(255, 255, 255, 0.3)":(r=t.type,(null==t?void 0:t.disabled)?e.content.inactive:"primary"===r?"#CDA2FC":e.content.primaryInverse);var r}};
 	}
-`,i=e.div`
+`,n=t.div`
 	position: absolute;
 	inset: 0;
 	display: flex;
@@ -17,6 +18,6 @@ import e from"styled-components";import{COLORS as t}from"../../constants/Theme.j
 	justify-content: center;
 	width: 100%;
 	border-radius: 4px;
-	background: ${e=>(e=>{switch(e){case"destructive":return t.background.negative.light;case"secondaryGray":return t.surface.subdued;default:return t.background.brandLight}})(e.type)};
+	background: ${t=>(t=>{switch(t){case"destructive":return e.background.negative.light;case"secondaryGray":return e.surface.subdued;default:return e.background.brandLight}})(t.type)};
 	z-index: 3;
-`;export{r as DropdownButtonStyle,i as LoaderContainer};
+`;export{r as DropdownButtonStyle,n as LoaderContainer};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@bikdotai/bik-component-library",
-	"version": "0.0.799-beta.3",
+	"version": "0.0.799-beta.4",
 	"description": "Bik Component Library",
 	"repository": {
 		"type": "git",