@bikdotai/bik-component-library 0.0.581-aidd-beta.16 → 0.0.581-aidd-beta.18

package/dist/cjs/components/dropdown/Common.styled.d.ts

@@ -1,5 +1,6 @@
 export declare const OverLapAbs: import("styled-components").StyledComponent<"div", any, {
     disabled?: boolean | undefined;
+    allowEvents?: boolean | undefined;
 }, never>;
 export declare const OpenDropdownContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const LoadingContainer: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/cjs/components/dropdown/Common.styled.js

@@ -1,15 +1,17 @@
-"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 i=r(e);const o=i.default.div`
-	position: absolute;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../constants/Theme.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=i(e);const o=r.default.div`
+	position: 
+	// if allowEvents is true, then position is relative, else position is absolute
+		${e=>(null==e?void 0:e.allowEvents)?"relative":"absolute"};
 	left: 0px;
 	top: 0px;
 	width: 100%;
 	height: 100%;
 	z-index: 2;
 	cursor: ${e=>(null==e?void 0:e.disabled)?"not-allowed":"pointer"};
-`,p=i.default.div`
+`,p=r.default.div`
 	margin-top: 8px;
 	margin-bottom: 8px;
-`;i.default.div`
+`;r.default.div`
 	display: flex;
 	flex-direction: row;
 	align-items: center;
@@ -17,7 +19,7 @@
 	background: ${t.COLORS.surface.hovered};
 	border: 1px solid ${t.COLORS.stroke.primary};
 	border-radius: 4px;
-`;const d=i.default.div`
+`;const n=r.default.div`
 	width: 360px;
 	height: 100%;
 	padding: 8px;
@@ -32,4 +34,4 @@
 		flex-wrap: wrap;
 		align-items: center;
 	}
-`;exports.ChipInputWrapper=d,exports.OpenDropdownContainer=p,exports.OverLapAbs=o;
+`;exports.ChipInputWrapper=n,exports.OpenDropdownContainer=p,exports.OverLapAbs=o;

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

@@ -10,6 +10,7 @@ export declare const DropdownPopover: React.ForwardRefExoticComponent<OpenDropdo
     tooltipContent?: string | undefined;
     tooltipDirection?: Placement | undefined;
     showTooltipArrow?: boolean | undefined;
+    allowEvents?: boolean | undefined;
 } & React.RefAttributes<{
     openDropdown: boolean;
 }>>;

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),o=require("react/jsx-runtime"),t=require("react"),n=require("react-popper"),r=require("../../dropShadow/DropShadow.js"),i=require("../../tooltips/Tooltip.js"),l=require("../Common.styled.js"),s=require("../OpenedDropdown/components/OpennedDropdown.js");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const p=d(t).default.forwardRef(((d,p)=>{var{children:a,onDropdownVisbilityChange:c,version:u="1.0",tooltipContent:v,tooltipDirection:j,showTooltipArrow:f}=d,h=e.__rest(d,["children","onDropdownVisbilityChange","version","tooltipContent","tooltipDirection","showTooltipArrow"]);const w=p,[b,g]=t.useState(!1),[D,O]=t.useState(null),[y,x]=t.useState(null),m=t.useRef(null),{styles:S,attributes:C}=n.usePopper(D,y,{placement:h.placement,strategy:h.strategy}),q=e=>{var o,t;"2.0"===u&&h.isMultiSelect&&e&&(null===(o=h.onSelect)||void 0===o||o.call(h,[...e])),g(!1),null===(t=null==h?void 0:h.onClose)||void 0===t||t.call(h)};t.useImperativeHandle(w,(()=>({openDropdown:b})),[]),t.useEffect((()=>{(null==w?void 0:w.current)&&(w.current.openDropdown=b)}),[b]),t.useEffect((()=>{null==c||c(b)}),[b]);const _=()=>o.jsxs(o.Fragment,{children:[o.jsx("div",Object.assign({style:{position:"relative"},ref:O},{children:o.jsx(l.OverLapAbs,Object.assign({ref:m,disabled:h.disabled,onClick:e=>{var o;null===(o=h.onDropdownOpen)||void 0===o||o.call(h),b?(g(!1),e.preventDefault()):h.disabled||g(!0)},style:{width:"fit-content",height:"fit-content"}},{children:a}))})),b&&o.jsx(l.OpenDropdownContainer,Object.assign({ref:x,style:Object.assign(Object.assign({},S.popper),{zIndex:3})},C.popper,{children:o.jsx(r.default,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:o.jsx(s.OpenedDropdown,Object.assign({},h,{onSelect:e=>{var o;"2.0"===u&&h.isMultiSelect||(null===(o=h.onSelect)||void 0===o||o.call(h,e),g(!1))},onClose:q,version:u,headerRef:m}))}))}))]});return o.jsx(o.Fragment,{children:b||void 0===v?_():o.jsx(i.Tooltip,Object.assign({body:v,placement:j,hideArrow:!f},{children:o.jsx("div",{children:_()})}))})}));p.displayName="DropdownPopover",exports.DropdownPopover=p;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),o=require("react/jsx-runtime"),n=require("react"),t=require("react-popper"),r=require("../../dropShadow/DropShadow.js"),l=require("../../tooltips/Tooltip.js"),s=require("../Common.styled.js"),i=require("../OpenedDropdown/components/OpennedDropdown.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const d=a(n).default.forwardRef(((a,d)=>{var{children:p,onDropdownVisbilityChange:c,version:u="1.0",tooltipContent:v,tooltipDirection:j,showTooltipArrow:w}=a,b=e.__rest(a,["children","onDropdownVisbilityChange","version","tooltipContent","tooltipDirection","showTooltipArrow"]);const f=d,[h,D]=n.useState(!1),[O,g]=n.useState(null),[x,y]=n.useState(null),m=n.useRef(null),{styles:S,attributes:C}=t.usePopper(O,x,{placement:b.placement,strategy:b.strategy}),q=e=>{var o,n;"2.0"===u&&b.isMultiSelect&&e&&(null===(o=b.onSelect)||void 0===o||o.call(b,[...e])),D(!1),null===(n=null==b?void 0:b.onClose)||void 0===n||n.call(b)};n.useImperativeHandle(f,(()=>({openDropdown:h})),[]),n.useEffect((()=>{(null==f?void 0:f.current)&&(f.current.openDropdown=h)}),[h]),n.useEffect((()=>{null==c||c(h)}),[h]);const E=()=>o.jsxs(o.Fragment,{children:[o.jsxs("div",Object.assign({style:{position:"relative"},ref:g},{children:[o.jsx(s.OverLapAbs,Object.assign({ref:m,allowEvents:b.allowEvents,disabled:b.disabled,onClick:e=>{var o;null===(o=b.onDropdownOpen)||void 0===o||o.call(b),h?(D(!1),e.preventDefault()):b.disabled||D(!0)}},{children:b.allowEvents?p:null})),b.allowEvents?null:p]})),h&&o.jsx(s.OpenDropdownContainer,Object.assign({ref:y,style:Object.assign(Object.assign({},S.popper),{zIndex:3})},C.popper,{children:o.jsx(r.default,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:o.jsx(i.OpenedDropdown,Object.assign({},b,{onSelect:e=>{var o;"2.0"===u&&b.isMultiSelect||(null===(o=b.onSelect)||void 0===o||o.call(b,e),D(!1))},onClose:q,version:u,headerRef:m}))}))}))]});return o.jsx(o.Fragment,{children:h||void 0===v?E():o.jsx(l.Tooltip,Object.assign({body:v,placement:j,hideArrow:!w},{children:o.jsx("div",{children:E()})}))})}));d.displayName="DropdownPopover",exports.DropdownPopover=d;

package/dist/esm/components/dropdown/Common.styled.d.ts

@@ -1,5 +1,6 @@
 export declare const OverLapAbs: import("styled-components").StyledComponent<"div", any, {
     disabled?: boolean | undefined;
+    allowEvents?: boolean | undefined;
 }, never>;
 export declare const OpenDropdownContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const LoadingContainer: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/esm/components/dropdown/Common.styled.js

@@ -1,5 +1,7 @@
-import e from"styled-components";import{COLORS as i}from"../../constants/Theme.js";const r=e.div`
-	position: absolute;
+import e from"styled-components";import{COLORS as i}from"../../constants/Theme.js";const t=e.div`
+	position: 
+	// if allowEvents is true, then position is relative, else position is absolute
+		${e=>(null==e?void 0:e.allowEvents)?"relative":"absolute"};
 	left: 0px;
 	top: 0px;
 	width: 100%;
@@ -17,7 +19,7 @@ import e from"styled-components";import{COLORS as i}from"../../constants/Theme.j
 	background: ${i.surface.hovered};
 	border: 1px solid ${i.stroke.primary};
 	border-radius: 4px;
-`;const t=e.div`
+`;const r=e.div`
 	width: 360px;
 	height: 100%;
 	padding: 8px;
@@ -32,4 +34,4 @@ import e from"styled-components";import{COLORS as i}from"../../constants/Theme.j
 		flex-wrap: wrap;
 		align-items: center;
 	}
-`;export{t as ChipInputWrapper,o as OpenDropdownContainer,r as OverLapAbs};
+`;export{r as ChipInputWrapper,o as OpenDropdownContainer,t as OverLapAbs};

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

@@ -10,6 +10,7 @@ export declare const DropdownPopover: React.ForwardRefExoticComponent<OpenDropdo
     tooltipContent?: string | undefined;
     tooltipDirection?: Placement | undefined;
     showTooltipArrow?: boolean | undefined;
+    allowEvents?: boolean | undefined;
 } & React.RefAttributes<{
     openDropdown: boolean;
 }>>;

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

@@ -1 +1 @@
-import{__rest as o}from"../../../_virtual/_tslib.js";import{jsx as e,Fragment as t,jsxs as n}from"react/jsx-runtime";import i,{useState as r,useRef as l,useImperativeHandle as s,useEffect as p}from"react";import{usePopper as d}from"react-popper";import c from"../../dropShadow/DropShadow.js";import{Tooltip as a}from"../../tooltips/Tooltip.js";import{OverLapAbs as m,OpenDropdownContainer as h}from"../Common.styled.js";import{OpenedDropdown as v}from"../OpenedDropdown/components/OpennedDropdown.js";const u=i.forwardRef(((i,u)=>{var{children:w,onDropdownVisbilityChange:b,version:f="1.0",tooltipContent:j,tooltipDirection:g,showTooltipArrow:y}=i,D=o(i,["children","onDropdownVisbilityChange","version","tooltipContent","tooltipDirection","showTooltipArrow"]);const O=u,[C,S]=r(!1),[x,A]=r(null),[R,T]=r(null),z=l(null),{styles:M,attributes:V}=d(x,R,{placement:D.placement,strategy:D.strategy}),_=o=>{var e,t;"2.0"===f&&D.isMultiSelect&&o&&(null===(e=D.onSelect)||void 0===e||e.call(D,[...o])),S(!1),null===(t=null==D?void 0:D.onClose)||void 0===t||t.call(D)};s(O,(()=>({openDropdown:C})),[]),p((()=>{(null==O?void 0:O.current)&&(O.current.openDropdown=C)}),[C]),p((()=>{null==b||b(C)}),[C]);const k=()=>n(t,{children:[e("div",Object.assign({style:{position:"relative"},ref:A},{children:e(m,Object.assign({ref:z,disabled:D.disabled,onClick:o=>{var e;null===(e=D.onDropdownOpen)||void 0===e||e.call(D),C?(S(!1),o.preventDefault()):D.disabled||S(!0)},style:{width:"fit-content",height:"fit-content"}},{children:w}))})),C&&e(h,Object.assign({ref:T,style:Object.assign(Object.assign({},M.popper),{zIndex:3})},V.popper,{children:e(c,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:e(v,Object.assign({},D,{onSelect:o=>{var e;"2.0"===f&&D.isMultiSelect||(null===(e=D.onSelect)||void 0===e||e.call(D,o),S(!1))},onClose:_,version:f,headerRef:z}))}))}))]});return e(t,{children:C||void 0===j?k():e(a,Object.assign({body:j,placement:g,hideArrow:!y},{children:e("div",{children:k()})}))})}));u.displayName="DropdownPopover";export{u as DropdownPopover};
+import{__rest as o}from"../../../_virtual/_tslib.js";import{jsx as e,Fragment as l,jsxs as n}from"react/jsx-runtime";import t,{useState as r,useRef as i,useImperativeHandle as s,useEffect as p}from"react";import{usePopper as d}from"react-popper";import a from"../../dropShadow/DropShadow.js";import{Tooltip as c}from"../../tooltips/Tooltip.js";import{OverLapAbs as v,OpenDropdownContainer as m}from"../Common.styled.js";import{OpenedDropdown as u}from"../OpenedDropdown/components/OpennedDropdown.js";const w=t.forwardRef(((t,w)=>{var{children:h,onDropdownVisbilityChange:b,version:f="1.0",tooltipContent:j,tooltipDirection:g,showTooltipArrow:D}=t,y=o(t,["children","onDropdownVisbilityChange","version","tooltipContent","tooltipDirection","showTooltipArrow"]);const O=w,[C,S]=r(!1),[E,x]=r(null),[A,R]=r(null),T=i(null),{styles:z,attributes:M}=d(E,A,{placement:y.placement,strategy:y.strategy}),V=o=>{var e,l;"2.0"===f&&y.isMultiSelect&&o&&(null===(e=y.onSelect)||void 0===e||e.call(y,[...o])),S(!1),null===(l=null==y?void 0:y.onClose)||void 0===l||l.call(y)};s(O,(()=>({openDropdown:C})),[]),p((()=>{(null==O?void 0:O.current)&&(O.current.openDropdown=C)}),[C]),p((()=>{null==b||b(C)}),[C]);const _=()=>n(l,{children:[n("div",Object.assign({style:{position:"relative"},ref:x},{children:[e(v,Object.assign({ref:T,allowEvents:y.allowEvents,disabled:y.disabled,onClick:o=>{var e;null===(e=y.onDropdownOpen)||void 0===e||e.call(y),C?(S(!1),o.preventDefault()):y.disabled||S(!0)}},{children:y.allowEvents?h:null})),y.allowEvents?null:h]})),C&&e(m,Object.assign({ref:R,style:Object.assign(Object.assign({},z.popper),{zIndex:3})},M.popper,{children:e(a,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:e(u,Object.assign({},y,{onSelect:o=>{var e;"2.0"===f&&y.isMultiSelect||(null===(e=y.onSelect)||void 0===e||e.call(y,o),S(!1))},onClose:V,version:f,headerRef:T}))}))}))]});return e(l,{children:C||void 0===j?_():e(c,Object.assign({body:j,placement:g,hideArrow:!D},{children:e("div",{children:_()})}))})}));w.displayName="DropdownPopover";export{w as DropdownPopover};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@bikdotai/bik-component-library",
-	"version": "0.0.581-aidd-beta.16",
+	"version": "0.0.581-aidd-beta.18",
 	"description": "Bik Component Library",
 	"repository": {
 		"type": "git",