@bikdotai/bik-component-library 0.0.564-beta.picker.4 → 0.0.564-beta.picker.5
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/variable-picker-v3/Content.js +1 -1
- package/dist/cjs/components/variable-picker-v3/DefaultVariableContent.js +1 -1
- package/dist/esm/components/variable-picker-v3/Content.js +1 -1
- package/dist/esm/components/variable-picker-v3/DefaultVariableContent.js +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),s=require("react/jsx-runtime"),t=require("../../assets/icons/arrow_back.svg.js"),a=require("../../assets/icons/cross.svg.js"),i=require("../../assets/icons/plus.svg.js"),l=require("../../assets/icons/triangle_error.svg.js"),r=require("react"),n=require("../../constants/Theme.js"),o=require("../accordion/Accordion.js"),c=require("../icon-button/IconButton.js"),d=require("../input/Input.js"),u=require("../list-item/ListItem.js"),h=require("../switch/Switch.js"),b=require("../tooltips/Tooltip.js"),p=require("../TypographyStyle.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),s=require("react/jsx-runtime"),t=require("../../assets/icons/arrow_back.svg.js"),a=require("../../assets/icons/cross.svg.js"),i=require("../../assets/icons/plus.svg.js"),l=require("../../assets/icons/triangle_error.svg.js"),r=require("react"),n=require("../../constants/Theme.js"),o=require("../accordion/Accordion.js"),c=require("../icon-button/IconButton.js"),d=require("../input/Input.js"),u=require("../list-item/ListItem.js"),h=require("../switch/Switch.js"),b=require("../tooltips/Tooltip.js"),p=require("../TypographyStyle.js"),g=require("./context.js"),j=require("./DefaultVariableContent.js"),x=require("./model.js"),y=require("./NoResult.js"),m=require("./recommendVaribles.js"),f=require("./searchVariables.js"),v=require("./styles.js"),O=require("./SubHeaderItems.js");const S=(e,t)=>{if(0===t.length)return e;const a=e.toLowerCase().indexOf(t.toLowerCase());if(-1===a)return e;const i=e.slice(0,a),l=e.slice(a,a+t.length),r=e.slice(a+t.length);return s.jsxs("span",{children:[i,s.jsx("b",Object.assign({style:{color:n.COLORS.content.primary}},{children:l})),r]})},C=/.*\..*/;exports.VariablePickerContent=V=>{const{data:w,onSelect:R,showHeader:k,showBackButton:q,hideHeaderCross:B,onBackButtonClick:T,isEvaluationList:I,autoOpenFirst:L,headerText:N,contentHeight:_}=V,[D,E]=r.useState(w),[H,P]=r.useState(""),[$,F]=r.useState([]),[A,M]=r.useState(""),[W,z]=r.useState(!1),[K,G]=r.useState([]),[J,Q]=r.useState(!1),[U,X]=r.useState(),Y=J&&V.type===x.PickerType.EMBEDDED&&!B;console.log("variables",D),r.useEffect((()=>{Z(!0)}),[]),r.useEffect((()=>{$.length>0?G([$[$.length-1]]):G(w)}),[$]);const Z=s=>e.__awaiter(void 0,void 0,void 0,(function*(){if(z(s),s){const e=m.showOnlyRecommendedVariables(D,$);E(e)}else if($.length>0){const e=A==$[$.length-1].displayName;if(H.length>0&&e){const e=f.searchVariables(H,K,$);E(e)}else E([$[$.length-1].variables])}else if(H.length>0){const e=f.searchVariables(H,K,$);E(e)}else E(w)})),ee=()=>{if(_)return _;let e=131;return $.length>0&&(e+=32),(V.showHeader||V.showBackButton)&&(e+=40),`calc(100% - ${e}px)`},se=e=>{if(!V.disabled)if(I){const s=(e=>{if(e.actualValue.match(C)){const s=e.actualValue.replace("{{","").replace("}}","").split(".");let t=s[0];return s.forEach(((e,s)=>{if(0===s)return;const a=(e=>/\w+\[\d+\]/g.test(e))(e);if(a){const s=e.match(/(\w+)\[(\d+)\]/);if(s){const e=s[1],a=s[2];t+=`['${e}'][${a}]`}}else t+=`['${e}']`})),t}return e.actualValueEval?e.actualValueEval:e.actualValue})(e);R(Object.assign(Object.assign({},e),{actualValue:s}))}else{if(e.isDefaultValueSupported)return X(e),void Q(!0);R(e)}};return s.jsx(g.VariablePickerContext.Provider,Object.assign({value:{variables:D,searchText:H,subHeaderStack:$,showRecommended:W,setSubHeaderStack:F,setSearchText:P,setVariables:E,setShowRecommended:z}},{children:s.jsxs("div",Object.assign({tabIndex:-1,id:"variable-picker-v3",style:{backgroundColor:"white",borderRadius:4,height:"100%",outline:"none"},onClick:e=>e.stopPropagation()},{children:[(k||q||J)&&s.jsxs(v.HeaderWrapper,Object.assign({openDefault:J},{children:[s.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",gap:8}},{children:[(q||J)&&s.jsx(c.IconButton,{Icon:()=>s.jsx(t.default,{width:16,height:16,style:{display:"flex",color:n.COLORS.content.primary}}),onClick:()=>{console.log("IconButton"),J?J&&Q(!1):T&&T()}}),(k||J)&&s.jsx(p.TitleRegular,{children:J?"Set up":null!=N?N:"Select Variable"})]})),Y&&s.jsx(c.IconButton,{style:{color:"#212121"},Icon:a.default,onClick:()=>V.onClose&&V.onClose()})]})),J&&U?s.jsx(j.DefaultVariableContent,{variable:U,onInsertVariable:e=>{R(e),console.log("uploa",e)}}):s.jsxs(s.Fragment,{children:[s.jsx("div",Object.assign({style:{padding:"0 16px",paddingTop:12,backgroundColor:n.COLORS.surface.subdued,borderTopLeftRadius:4,borderTopRightRadius:4}},{children:s.jsx(d.Input,{id:"search-bar-v3-picker",onBlur:e=>{V.onSearchBlur&&V.onSearchBlur(e)},value:H,noKeyDownChange:!0,placeholder:"Search",onChangeText:e=>{e||M("");const s=f.searchVariables(e,K,$);if(W){const e=m.showOnlyRecommendedVariables(s,$);E(e)}else E(s);P(e);const t=$.length>0?$[$.length-1].displayName:"home";M(t)}})})),s.jsxs(v.RecommendWrapper,{children:[s.jsx(p.BodySecondary,Object.assign({style:{color:n.COLORS.content.secondary}},{children:"Only Recommended"})),s.jsx(h.Switch,{value:W,onValueChange:s=>e.__awaiter(void 0,void 0,void 0,(function*(){yield Z(s)}))})]}),$.length>0&&s.jsxs(v.BackHeader,{children:[s.jsx("div",Object.assign({style:{position:"absolute",left:16}},{children:s.jsx(c.IconButton,{id:"back-btn-v3",style:{display:"flex"},Icon:()=>s.jsx(t.default,{width:12,height:12,style:{color:n.COLORS.content.secondary}}),onClick:e=>{e.stopPropagation();let s=H;const t=[...$],a=t.pop();if(F(t),a.displayName===A&&(P(""),s=""),s.length>0){const e=t.length>0?[t[t.length-1]]:w,a=f.searchVariables(s,e,t);if(W){const e=m.showOnlyRecommendedVariables(a,t);E(e)}else E(a)}else if(t.length>0)if(W){const e=m.showOnlyRecommendedVariables([t[t.length-1].variables],t);E(e)}else E([t[t.length-1].variables]);else if(W){const e=m.showOnlyRecommendedVariables(w,$);E(e)}else E(w)}})})),s.jsx(p.BodyCaption,Object.assign({style:{color:n.COLORS.content.secondary}},{children:$[$.length-1].displayName}))]}),s.jsx(s.Fragment,{children:D.length>0?s.jsx(v.Container,Object.assign({height:ee()},{children:D.map(((e,t)=>{var a,r;return e.displayName&&void 0!==e.variables?s.jsx("div",Object.assign({style:{borderBottom:`1px solid ${n.COLORS.stroke.primary}`}},{children:s.jsx(o.BikAccordion,Object.assign({autoOpen:L&&0===t,headerPadding:"12px 16px",header:s.jsx(p.TitleSmall,Object.assign({style:{color:n.COLORS.content.secondary}},{children:S(e.displayName,H)}))},{children:s.jsx(O.default,{parentVariable:e,disabled:null!==(a=V.disabled)&&void 0!==a&&a,searchText:H,variable:e.variables,onSelect:e=>{if(e.isDefaultValueSupported)return X(e),void Q(!0);R(e)}})}))}),e.displayName+W):e.displayName?s.jsx(b.Tooltip,Object.assign({body:O.renderTooltipBody(e),placement:"bottom"},{children:s.jsx(u.ListItem,{variant:V.disabled?"readonly":(null==e?void 0:e.selected)?"selected":"default",version:"2.0",leadingIcon:(null==e?void 0:e.selected)||V.disabled?s.jsx(s.Fragment,{}):s.jsx(i.default,{width:14,height:14}),customListItemLabel:s.jsxs("div",Object.assign({style:{display:"flex",gap:4}},{children:[s.jsx(p.BodySecondary,Object.assign({style:{fontSize:"14px",color:n.COLORS.text.primary}},{children:S(e.displayName,H)})),!e.isAvailable&&s.jsx(b.Tooltip,Object.assign({body:"Not Recommended"},{children:s.jsx("div",Object.assign({style:{display:"flex",marginTop:2}},{children:s.jsx(l.default,{width:16,height:16,color:n.COLORS.content.secondary})}))}))]})),listItem:{label:e.displayName,value:e.displayName},subText:e.description||"",onClick:()=>se(e)},t)}),t):s.jsx(O.default,{disabled:null!==(r=V.disabled)&&void 0!==r&&r,searchText:H,variable:e,onSelect:e=>se(e)},t)}))})):s.jsx(y.default,{height:ee(),searchText:H})})]})]}))}))},exports.highlightSearchText=S;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("react"),a=require("../button/Button.js"),t=require("../checkBox/CheckBox.js"),s=require("../input/Input.js"),r=require("../TypographyStyle.js");exports.DefaultVariableContent=l=>{var n,d,o;const[u,c]=i.useState(l.variable.defaultValue||""),[p,x]=i.useState(""),[b,g]=i.useState(!!(null===(n=l.variable)||void 0===n?void 0:n.enableDefaultValueForGlobalUsage));return e.jsx(e.Fragment,{children:e.jsxs("div",Object.assign({style:{padding:"0 16px",paddingTop:12,borderTopLeftRadius:4,borderTopRightRadius:4}},{children:[e.jsx("div",Object.assign({style:{paddingBottom:16,borderBottom:"1px solid #E0E0E0"}},{children:e.jsx(r.TitleRegular,{children:null===(d=l.variable)||void 0===d?void 0:d.displayName})})),e.jsxs("div",Object.assign({style:{paddingTop:24}},{children:[e.jsx(s.Input,{onChangeText:e=>{x(""),c(e)},value:u,isRequired:!0,labelText:"Default Value",hintText:"Used if this field is missing for a customer",errorMessage:null!=p?p:"",maxCharLimit:25}),e.jsxs("div",Object.assign({style:{paddingTop:24,gap:8,alignItems:"flex-start"},className:"d-flex"},{children:[e.jsx(t.CheckBox,{isChecked:b,onValueChange:e=>g(e),size:"SMALL",skipHoverState:!0}),e.jsx(r.BodySecondary,Object.assign({style:{marginTop:-2}},{children:`Make this the default value for ‘${null===(o=l.variable)||void 0===o?void 0:o.displayName}’`}))]})),e.jsx("div",Object.assign({style:{padding:"24px 0px",display:"flex",flexDirection:"row",justifyContent:"flex-end"}},{children:e.jsx(a.Button,{buttonText:"Insert Variable",buttonType:"primary",onClick:()=>{if(!u)return void x("This field is required");const e=Object.assign(Object.assign({},l.variable),{defaultValue:u,enableDefaultValueForGlobalUsage:b});l.onInsertVariable(e)}})}))]}))]}))})};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{__awaiter as e}from"../../_virtual/_tslib.js";import{jsx as t,jsxs as o,Fragment as s}from"react/jsx-runtime";import i from"../../assets/icons/arrow_back.svg.js";import l from"../../assets/icons/cross.svg.js";import
|
|
1
|
+
import{__awaiter as e}from"../../_virtual/_tslib.js";import{jsx as t,jsxs as o,Fragment as s}from"react/jsx-runtime";import i from"../../assets/icons/arrow_back.svg.js";import l from"../../assets/icons/cross.svg.js";import a from"../../assets/icons/plus.svg.js";import n from"../../assets/icons/triangle_error.svg.js";import{useState as r,useEffect as c}from"react";import{COLORS as d}from"../../constants/Theme.js";import{BikAccordion as h}from"../accordion/Accordion.js";import{IconButton as p}from"../icon-button/IconButton.js";import{Input as m}from"../input/Input.js";import{ListItem as u}from"../list-item/ListItem.js";import{Switch as g}from"../switch/Switch.js";import{Tooltip as b}from"../tooltips/Tooltip.js";import{TitleRegular as f,BodySecondary as y,BodyCaption as v,TitleSmall as j}from"../TypographyStyle.js";import{VariablePickerContext as x}from"./context.js";import{DefaultVariableContent as O}from"./DefaultVariableContent.js";import{PickerType as w}from"./model.js";import S from"./NoResult.js";import{showOnlyRecommendedVariables as k}from"./recommendVaribles.js";import{searchVariables as C}from"./searchVariables.js";import{HeaderWrapper as V,RecommendWrapper as T,BackHeader as I,Container as B}from"./styles.js";import N,{renderTooltipBody as R}from"./SubHeaderItems.js";const D=(e,s)=>{if(0===s.length)return e;const i=e.toLowerCase().indexOf(s.toLowerCase());if(-1===i)return e;const l=e.slice(0,i),a=e.slice(i,i+s.length),n=e.slice(i+s.length);return o("span",{children:[l,t("b",Object.assign({style:{color:d.content.primary}},{children:a})),n]})},E=/.*\..*/,H=H=>{const{data:L,onSelect:$,showHeader:P,showBackButton:_,hideHeaderCross:A,onBackButtonClick:z,isEvaluationList:F,autoOpenFirst:K,headerText:M,contentHeight:q}=H,[G,J]=r(L),[Q,U]=r(""),[W,X]=r([]),[Y,Z]=r(""),[ee,te]=r(!1),[oe,se]=r([]),[ie,le]=r(!1),[ae,ne]=r(),re=ie&&H.type===w.EMBEDDED&&!A;console.log("variables",G),c((()=>{ce(!0)}),[]),c((()=>{W.length>0?se([W[W.length-1]]):se(L)}),[W]);const ce=t=>e(void 0,void 0,void 0,(function*(){if(te(t),t){const e=k(G,W);J(e)}else if(W.length>0){const e=Y==W[W.length-1].displayName;if(Q.length>0&&e){const e=C(Q,oe,W);J(e)}else J([W[W.length-1].variables])}else if(Q.length>0){const e=C(Q,oe,W);J(e)}else J(L)})),de=()=>{if(q)return q;let e=131;return W.length>0&&(e+=32),(H.showHeader||H.showBackButton)&&(e+=40),`calc(100% - ${e}px)`},he=e=>{if(!H.disabled)if(F){const t=(e=>{if(e.actualValue.match(E)){const t=e.actualValue.replace("{{","").replace("}}","").split(".");let o=t[0];return t.forEach(((e,t)=>{if(0===t)return;const s=(e=>/\w+\[\d+\]/g.test(e))(e);if(s){const t=e.match(/(\w+)\[(\d+)\]/);if(t){const e=t[1],s=t[2];o+=`['${e}'][${s}]`}}else o+=`['${e}']`})),o}return e.actualValueEval?e.actualValueEval:e.actualValue})(e);$(Object.assign(Object.assign({},e),{actualValue:t}))}else{if(e.isDefaultValueSupported)return ne(e),void le(!0);$(e)}};return t(x.Provider,Object.assign({value:{variables:G,searchText:Q,subHeaderStack:W,showRecommended:ee,setSubHeaderStack:X,setSearchText:U,setVariables:J,setShowRecommended:te}},{children:o("div",Object.assign({tabIndex:-1,id:"variable-picker-v3",style:{backgroundColor:"white",borderRadius:4,height:"100%",outline:"none"},onClick:e=>e.stopPropagation()},{children:[(P||_||ie)&&o(V,Object.assign({openDefault:ie},{children:[o("div",Object.assign({style:{display:"flex",alignItems:"center",gap:8}},{children:[(_||ie)&&t(p,{Icon:()=>t(i,{width:16,height:16,style:{display:"flex",color:d.content.primary}}),onClick:()=>{console.log("IconButton"),ie?ie&&le(!1):z&&z()}}),(P||ie)&&t(f,{children:ie?"Set up":null!=M?M:"Select Variable"})]})),re&&t(p,{style:{color:"#212121"},Icon:l,onClick:()=>H.onClose&&H.onClose()})]})),ie&&ae?t(O,{variable:ae,onInsertVariable:e=>{$(e),console.log("uploa",e)}}):o(s,{children:[t("div",Object.assign({style:{padding:"0 16px",paddingTop:12,backgroundColor:d.surface.subdued,borderTopLeftRadius:4,borderTopRightRadius:4}},{children:t(m,{id:"search-bar-v3-picker",onBlur:e=>{H.onSearchBlur&&H.onSearchBlur(e)},value:Q,noKeyDownChange:!0,placeholder:"Search",onChangeText:e=>{e||Z("");const t=C(e,oe,W);if(ee){const e=k(t,W);J(e)}else J(t);U(e);const o=W.length>0?W[W.length-1].displayName:"home";Z(o)}})})),o(T,{children:[t(y,Object.assign({style:{color:d.content.secondary}},{children:"Only Recommended"})),t(g,{value:ee,onValueChange:t=>e(void 0,void 0,void 0,(function*(){yield ce(t)}))})]}),W.length>0&&o(I,{children:[t("div",Object.assign({style:{position:"absolute",left:16}},{children:t(p,{id:"back-btn-v3",style:{display:"flex"},Icon:()=>t(i,{width:12,height:12,style:{color:d.content.secondary}}),onClick:e=>{e.stopPropagation();let t=Q;const o=[...W],s=o.pop();if(X(o),s.displayName===Y&&(U(""),t=""),t.length>0){const e=o.length>0?[o[o.length-1]]:L,s=C(t,e,o);if(ee){const e=k(s,o);J(e)}else J(s)}else if(o.length>0)if(ee){const e=k([o[o.length-1].variables],o);J(e)}else J([o[o.length-1].variables]);else if(ee){const e=k(L,W);J(e)}else J(L)}})})),t(v,Object.assign({style:{color:d.content.secondary}},{children:W[W.length-1].displayName}))]}),t(s,{children:G.length>0?t(B,Object.assign({height:de()},{children:G.map(((e,i)=>{var l,r;return e.displayName&&void 0!==e.variables?t("div",Object.assign({style:{borderBottom:`1px solid ${d.stroke.primary}`}},{children:t(h,Object.assign({autoOpen:K&&0===i,headerPadding:"12px 16px",header:t(j,Object.assign({style:{color:d.content.secondary}},{children:D(e.displayName,Q)}))},{children:t(N,{parentVariable:e,disabled:null!==(l=H.disabled)&&void 0!==l&&l,searchText:Q,variable:e.variables,onSelect:e=>{if(e.isDefaultValueSupported)return ne(e),void le(!0);$(e)}})}))}),e.displayName+ee):e.displayName?t(b,Object.assign({body:R(e),placement:"bottom"},{children:t(u,{variant:H.disabled?"readonly":(null==e?void 0:e.selected)?"selected":"default",version:"2.0",leadingIcon:(null==e?void 0:e.selected)||H.disabled?t(s,{}):t(a,{width:14,height:14}),customListItemLabel:o("div",Object.assign({style:{display:"flex",gap:4}},{children:[t(y,Object.assign({style:{fontSize:"14px",color:d.text.primary}},{children:D(e.displayName,Q)})),!e.isAvailable&&t(b,Object.assign({body:"Not Recommended"},{children:t("div",Object.assign({style:{display:"flex",marginTop:2}},{children:t(n,{width:16,height:16,color:d.content.secondary})}))}))]})),listItem:{label:e.displayName,value:e.displayName},subText:e.description||"",onClick:()=>he(e)},i)}),i):t(N,{disabled:null!==(r=H.disabled)&&void 0!==r&&r,searchText:Q,variable:e,onSelect:e=>he(e)},i)}))})):t(S,{height:de(),searchText:Q})})]})]}))}))};export{H as VariablePickerContent,D as highlightSearchText};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,Fragment as i,jsxs as a}from"react/jsx-runtime";import{useState as
|
|
1
|
+
import{jsx as e,Fragment as i,jsxs as a}from"react/jsx-runtime";import{useState as t}from"react";import{Button as l}from"../button/Button.js";import{CheckBox as r}from"../checkBox/CheckBox.js";import{Input as o}from"../input/Input.js";import{TitleRegular as s,BodySecondary as n}from"../TypographyStyle.js";const d=d=>{var p,u,c;const[b,f]=t(d.variable.defaultValue||""),[g,m]=t(""),[h,v]=t(!!(null===(p=d.variable)||void 0===p?void 0:p.enableDefaultValueForGlobalUsage));return e(i,{children:a("div",Object.assign({style:{padding:"0 16px",paddingTop:12,borderTopLeftRadius:4,borderTopRightRadius:4}},{children:[e("div",Object.assign({style:{paddingBottom:16,borderBottom:"1px solid #E0E0E0"}},{children:e(s,{children:null===(u=d.variable)||void 0===u?void 0:u.displayName})})),a("div",Object.assign({style:{paddingTop:24}},{children:[e(o,{onChangeText:e=>{m(""),f(e)},value:b,isRequired:!0,labelText:"Default Value",hintText:"Used if this field is missing for a customer",errorMessage:null!=g?g:"",maxCharLimit:25}),a("div",Object.assign({style:{paddingTop:24,gap:8,alignItems:"flex-start"},className:"d-flex"},{children:[e(r,{isChecked:h,onValueChange:e=>v(e),size:"SMALL",skipHoverState:!0}),e(n,Object.assign({style:{marginTop:-2}},{children:`Make this the default value for ‘${null===(c=d.variable)||void 0===c?void 0:c.displayName}’`}))]})),e("div",Object.assign({style:{padding:"24px 0px",display:"flex",flexDirection:"row",justifyContent:"flex-end"}},{children:e(l,{buttonText:"Insert Variable",buttonType:"primary",onClick:()=>{if(!b)return void m("This field is required");const e=Object.assign(Object.assign({},d.variable),{defaultValue:b,enableDefaultValueForGlobalUsage:h});d.onInsertVariable(e)}})}))]}))]}))})};export{d as DefaultVariableContent};
|