@bikdotai/bik-component-library 0.0.549-2 → 0.0.549-4

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

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

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

@@ -40,3 +40,4 @@ export type SingleOption = {
 };
 export type MultiSelectOption = SingleOption;
 export type DropdownOption = MultiSelectOption | SingleOption | GroupedOption;
+export type { Placement };

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

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

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

@@ -40,3 +40,4 @@ export type SingleOption = {
 };
 export type MultiSelectOption = SingleOption;
 export type DropdownOption = MultiSelectOption | SingleOption | GroupedOption;
+export type { Placement };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@bikdotai/bik-component-library",
-	"version": "0.0.549-2",
+	"version": "0.0.549-4",
 	"description": "Bik Component Library",
 	"repository": {
 		"type": "git",
@@ -56,6 +56,7 @@
 		"@types/react-slick": "^0.23.13",
 		"bootstrap": "^5.1.3",
 		"browser-image-compression": "^2.0.2",
+		"caniuse-lite": "^1.0.30001646",
 		"chart.js": "^3.9.1",
 		"chartjs-plugin-datalabels": "^2.2.0",
 		"emoji-picker-react": "^4.4.9",