@bikdotai/bik-component-library 0.0.549-0 → 0.0.549-2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/dropdown/DropdownPopover/index.d.ts +1 -0
- package/dist/cjs/components/dropdown/DropdownPopover/index.js +1 -1
- package/dist/cjs/components/tag/Tag.d.ts +1 -1
- package/dist/cjs/components/tag/Tag.js +1 -1
- package/dist/cjs/components/tag/model.d.ts +0 -7
- package/dist/esm/components/dropdown/DropdownPopover/index.d.ts +1 -0
- package/dist/esm/components/dropdown/DropdownPopover/index.js +1 -1
- package/dist/esm/components/tag/Tag.d.ts +1 -1
- package/dist/esm/components/tag/Tag.js +1 -1
- package/dist/esm/components/tag/model.d.ts +0 -7
- package/package.json +1 -1
|
@@ -6,6 +6,7 @@ export declare const DropdownPopover: React.ForwardRefExoticComponent<OpenDropdo
|
|
|
6
6
|
disabled?: boolean | undefined;
|
|
7
7
|
onDropdownOpen?: (() => void) | undefined;
|
|
8
8
|
onDropdownVisbilityChange?: ((isOpen: boolean) => void) | undefined;
|
|
9
|
+
tooltipContent?: string | undefined;
|
|
9
10
|
} & React.RefAttributes<{
|
|
10
11
|
openDropdown: boolean;
|
|
11
12
|
}>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),
|
|
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;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { TagProps } from './model';
|
|
2
2
|
export declare const Tag: {
|
|
3
|
-
({ tagText, LeadingIcon, TrailingIcon, onLeadingIconClicked, leadingIconId, trailingIconId, onTrailingIconClicked, theme, type, variant, version, cursor,
|
|
3
|
+
({ tagText, LeadingIcon, TrailingIcon, onLeadingIconClicked, leadingIconId, trailingIconId, onTrailingIconClicked, theme, type, variant, version, cursor, }: TagProps): import("react/jsx-runtime").JSX.Element;
|
|
4
4
|
displayName: string;
|
|
5
5
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("react"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("react"),n=require("../TypographyStyle.js"),r=require("./model.js"),t=require("./Tag.styled.js"),a=require("./themes.js");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=s(i);const l=i=>{let{tagText:s,LeadingIcon:l,TrailingIcon:o,onLeadingIconClicked:d,leadingIconId:g,trailingIconId:p,onTrailingIconClicked:j,theme:u="light",type:y="neutral",variant:m="regular",version:h,cursor:b}=i,x=s;const T=u;let O=y;r.ValidTagTypeMap[m][y]||(O="neutral"),"circle"===m&&"number"==typeof x&&x>99&&(x="99+");const I={height:"compressed"===m?11:16,width:"compressed"===m?11:16,color:a.getTagIconColor(u,O),style:{display:"block"}};return e.jsx(t.Tag,Object.assign({cursor:b,theme:T,type:y,variant:m,version:h},{children:e.jsxs("div",Object.assign({className:"container"},{children:[l&&e.jsx("button",Object.assign({className:"icon-leading",onClick:d,id:`${g}-wrapper`||"leading-icon-wrapper"},{children:c.default.createElement(l,Object.assign(Object.assign({},I),{id:g||"leading-icon"}))})),""!==x&&("ai"===y&&"light"===u?"compressed"===m?e.jsx(n.AiBodyTiny,{children:x}):e.jsx(n.AiBodyCaption,{children:x}):"compressed"===m?e.jsx(n.BodyTiny,Object.assign({className:"text"},{children:x})):e.jsx(n.BodyCaption,Object.assign({className:"text"},{children:x}))),o&&e.jsx("button",Object.assign({className:"icon-trailing",onClick:j,id:`${p}-wrapper`||"trailing-icon-wrapper"},{children:c.default.createElement(o,Object.assign(Object.assign({},I),{id:p||"trailing-icon"}))}))]}))}))};l.displayName="Tag",exports.Tag=l;
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { MouseEventHandler } from 'react';
|
|
3
|
-
import { Placement } from '../tooltips/Tooltip';
|
|
4
3
|
export type TagTheme = 'light' | 'dark';
|
|
5
4
|
export type TagVariant = 'regular' | 'circle' | 'compressed';
|
|
6
5
|
export type TagType = 'negative' | 'warning' | 'positive' | 'neutral' | 'white' | 'purple' | 'blue' | 'grey' | 'ai';
|
|
@@ -84,10 +83,4 @@ export interface TagProps extends React.BaseHTMLAttributes<HTMLDivElement> {
|
|
|
84
83
|
tagText: string | number;
|
|
85
84
|
version?: '1.0' | '2.0';
|
|
86
85
|
cursor?: string;
|
|
87
|
-
/**
|
|
88
|
-
* Tooltip content. If blank then not displayed
|
|
89
|
-
*/
|
|
90
|
-
tooltipContent?: string;
|
|
91
|
-
tooltipDirection?: Placement;
|
|
92
|
-
showTooltipArrow?: boolean;
|
|
93
86
|
}
|
|
@@ -6,6 +6,7 @@ export declare const DropdownPopover: React.ForwardRefExoticComponent<OpenDropdo
|
|
|
6
6
|
disabled?: boolean | undefined;
|
|
7
7
|
onDropdownOpen?: (() => void) | undefined;
|
|
8
8
|
onDropdownVisbilityChange?: ((isOpen: boolean) => void) | undefined;
|
|
9
|
+
tooltipContent?: string | undefined;
|
|
9
10
|
} & React.RefAttributes<{
|
|
10
11
|
openDropdown: boolean;
|
|
11
12
|
}>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{__rest as
|
|
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};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { TagProps } from './model';
|
|
2
2
|
export declare const Tag: {
|
|
3
|
-
({ tagText, LeadingIcon, TrailingIcon, onLeadingIconClicked, leadingIconId, trailingIconId, onTrailingIconClicked, theme, type, variant, version, cursor,
|
|
3
|
+
({ tagText, LeadingIcon, TrailingIcon, onLeadingIconClicked, leadingIconId, trailingIconId, onTrailingIconClicked, theme, type, variant, version, cursor, }: TagProps): import("react/jsx-runtime").JSX.Element;
|
|
4
4
|
displayName: string;
|
|
5
5
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as i}from"react/jsx-runtime";import
|
|
1
|
+
import{jsx as e,jsxs as i}from"react/jsx-runtime";import n from"react";import{AiBodyTiny as r,AiBodyCaption as t,BodyTiny as a,BodyCaption as c}from"../TypographyStyle.js";import{ValidTagTypeMap as s}from"./model.js";import{Tag as o}from"./Tag.styled.js";import{getTagIconColor as l}from"./themes.js";const d=d=>{let{tagText:g,LeadingIcon:m,TrailingIcon:p,onLeadingIconClicked:h,leadingIconId:j,trailingIconId:b,onTrailingIconClicked:u,theme:y="light",type:O="neutral",variant:I="regular",version:f,cursor:T}=d,k=g;const v=y;let w=O;s[I][O]||(w="neutral"),"circle"===I&&"number"==typeof k&&k>99&&(k="99+");const N={height:"compressed"===I?11:16,width:"compressed"===I?11:16,color:l(y,w),style:{display:"block"}};return e(o,Object.assign({cursor:T,theme:v,type:O,variant:I,version:f},{children:i("div",Object.assign({className:"container"},{children:[m&&e("button",Object.assign({className:"icon-leading",onClick:h,id:`${j}-wrapper`||"leading-icon-wrapper"},{children:n.createElement(m,Object.assign(Object.assign({},N),{id:j||"leading-icon"}))})),""!==k&&("ai"===O&&"light"===y?e("compressed"===I?r:t,{children:k}):e("compressed"===I?a:c,Object.assign({className:"text"},{children:k}))),p&&e("button",Object.assign({className:"icon-trailing",onClick:u,id:`${b}-wrapper`||"trailing-icon-wrapper"},{children:n.createElement(p,Object.assign(Object.assign({},N),{id:b||"trailing-icon"}))}))]}))}))};d.displayName="Tag";export{d as Tag};
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { MouseEventHandler } from 'react';
|
|
3
|
-
import { Placement } from '../tooltips/Tooltip';
|
|
4
3
|
export type TagTheme = 'light' | 'dark';
|
|
5
4
|
export type TagVariant = 'regular' | 'circle' | 'compressed';
|
|
6
5
|
export type TagType = 'negative' | 'warning' | 'positive' | 'neutral' | 'white' | 'purple' | 'blue' | 'grey' | 'ai';
|
|
@@ -84,10 +83,4 @@ export interface TagProps extends React.BaseHTMLAttributes<HTMLDivElement> {
|
|
|
84
83
|
tagText: string | number;
|
|
85
84
|
version?: '1.0' | '2.0';
|
|
86
85
|
cursor?: string;
|
|
87
|
-
/**
|
|
88
|
-
* Tooltip content. If blank then not displayed
|
|
89
|
-
*/
|
|
90
|
-
tooltipContent?: string;
|
|
91
|
-
tooltipDirection?: Placement;
|
|
92
|
-
showTooltipArrow?: boolean;
|
|
93
86
|
}
|