@bikdotai/bik-component-library 0.0.374-beta.10 → 0.0.374
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/input-with-vars/InputWithVariables.d.ts +0 -1
- package/dist/cjs/components/input-with-vars/InputWithVariables.js +3 -3
- package/dist/esm/components/input-with-vars/InputWithVariables.d.ts +0 -1
- package/dist/esm/components/input-with-vars/InputWithVariables.js +3 -3
- package/package.json +1 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),a=require("../../assets/icons/PlusIcon.js"),l=require("react"),r=require("styled-components"),i=require("uuid"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),a=require("../../assets/icons/PlusIcon.js"),l=require("react"),r=require("styled-components"),i=require("uuid"),t=require("../../constants/Theme.js"),s=require("../add-variableV2/AddVariableBox.styled.js"),d=require("../add-variableV2/AddVariableV2.js"),u=require("../input/Input.js"),o=require("../TypographyStyle.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const c=n(r).default.div`
|
|
2
2
|
margin-bottom: 32px;
|
|
3
3
|
input {
|
|
4
|
-
color: ${e=>e.isVar?
|
|
4
|
+
color: ${e=>e.isVar?t.COLORS.stroke.brand:"black"};
|
|
5
5
|
}
|
|
6
|
-
`;exports.InputWithVariables=r=>{
|
|
6
|
+
`;exports.InputWithVariables=r=>{const t=l.useRef(null),[n,v]=l.useState(!1),[b]=l.useState(i.v4()),[p,V]=l.useState(),[g,h]=l.useState(r.prevVariable),[j,x]=l.useState(!1),[y,T]=l.useState(!1);return l.useEffect((()=>{p&&p.actualValue&&(r.allowMix?h((e=>({actualValue:e.actualValue+p.actualValue,variableType:"string"}))):h((e=>({actualValue:p.actualValue,variableType:p.variableType,needsFetching:p.needsFetching}))))}),[p]),l.useEffect((()=>{r.onChange(g)}),[g]),e.jsxs(c,Object.assign({isVar:/^{{.*}}$/.test(g.actualValue)},{children:[e.jsx(u.Input,{id:b,ref:t,skipFocus:!0,textControl:!0,isActive:n,value:g.actualValue,validate:e=>[!0,""],errorMessage:"",placeholder:"Add a value",onChangeText:function(e,a){if(r.onlyVariables){const e=(null==a?void 0:a.keyCode)||(null==a?void 0:a.charCode);8!=e&&46!=e||h({actualValue:"",variableType:"string"})}else r.allowMix?h({actualValue:e,variableType:"string"}):h({actualValue:e.replace(/{{.*}}/,""),variableType:"string"})},onReferenceInit:()=>{},onFocus:e=>{var a;v(!0),T(!0),"Search..."!==(null===(a=e.relatedTarget)||void 0===a?void 0:a.placeholder)||j||x(!0)},onBlur:e=>{var a,l,r,i,s,d,u;"addVar"===(null===(a=e.relatedTarget)||void 0===a?void 0:a.id)||"varList"===(null===(l=e.relatedTarget)||void 0===l?void 0:l.id)||(null===(i=null===(r=e.relatedTarget)||void 0===r?void 0:r.className)||void 0===i?void 0:i.includes("exlualr0"))||(null===(d=null===(s=e.relatedTarget)||void 0===s?void 0:s.className)||void 0===d?void 0:d.includes("sc-dZoequ "))?(t.current&&t.current.focus(),v(!0)):"Search..."===(null===(u=e.relatedTarget)||void 0===u?void 0:u.placeholder)?v(!0):(v(!1),x(!1),T(!1))}}),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"space-between"}},{children:[g.actualValue&&r.showHelp?e.jsx("div",Object.assign({style:{marginTop:4}},{children:e.jsx(o.BodyCaption,{children:`This value is of type ${g.variableType}`})})):e.jsx("div",{}),y&&e.jsx(s.AddVariableStyled,Object.assign({right:r.addVarBoxRight,id:"addVar",onClick:()=>{x(!j)}},{children:e.jsxs("div",Object.assign({className:"add"},{children:[e.jsx(a.default,{color:"white"}),e.jsx("div",Object.assign({className:"variable"},{children:"Add variable"}))]}))}))]})),j&&e.jsx(d.AddVariableV2,{data:r.variablesList,showVariable:!0,setShowVariable:()=>{x(!1)},variableValue:p,setVariableValue:V,placeholder:"",pickerSize:"large",enableVariable:!0,selectWithTypes:!0,onSearchBlur:e=>{var a,l,r,i,s,d;"varList"===(null===(a=e.relatedTarget)||void 0===a?void 0:a.id)||(null===(r=null===(l=e.relatedTarget)||void 0===l?void 0:l.className)||void 0===r?void 0:r.includes("exlualr0"))||(null===(s=null===(i=e.relatedTarget)||void 0===i?void 0:i.className)||void 0===s?void 0:s.includes("sc-dZoequ "))?t.current.focus():"Enter here"===(null===(d=e.relatedTarget)||void 0===d?void 0:d.placeholder)?e.relatedTarget.id!==b&&(x(!1),T(!1),v(!1)):(x(!1),T(!1),v(!1))}})]}))};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import{jsxs as e,jsx as a}from"react/jsx-runtime";import l from"../../assets/icons/PlusIcon.js";import{useRef as r,useState as i,useEffect as
|
|
1
|
+
import{jsxs as e,jsx as a}from"react/jsx-runtime";import l from"../../assets/icons/PlusIcon.js";import{useRef as r,useState as i,useEffect as t}from"react";import o from"styled-components";import{v4 as d}from"uuid";import{COLORS as s}from"../../constants/Theme.js";import{AddVariableStyled as n}from"../add-variableV2/AddVariableBox.styled.js";import{AddVariableV2 as c}from"../add-variableV2/AddVariableV2.js";import{Input as u}from"../input/Input.js";import{BodyCaption as v}from"../TypographyStyle.js";const p=o=>{const s=r(null),[p,g]=i(!1),[m]=i(d()),[h,V]=i(),[T,f]=i(o.prevVariable),[y,j]=i(!1),[x,w]=i(!1);return t((()=>{h&&h.actualValue&&(o.allowMix?f((e=>({actualValue:e.actualValue+h.actualValue,variableType:"string"}))):f((e=>({actualValue:h.actualValue,variableType:h.variableType,needsFetching:h.needsFetching}))))}),[h]),t((()=>{o.onChange(T)}),[T]),e(b,Object.assign({isVar:/^{{.*}}$/.test(T.actualValue)},{children:[a(u,{id:m,ref:s,skipFocus:!0,textControl:!0,isActive:p,value:T.actualValue,validate:e=>[!0,""],errorMessage:"",placeholder:"Add a value",onChangeText:function(e,a){if(o.onlyVariables){const e=(null==a?void 0:a.keyCode)||(null==a?void 0:a.charCode);8!=e&&46!=e||f({actualValue:"",variableType:"string"})}else o.allowMix?f({actualValue:e,variableType:"string"}):f({actualValue:e.replace(/{{.*}}/,""),variableType:"string"})},onReferenceInit:()=>{},onFocus:e=>{var a;g(!0),w(!0),"Search..."!==(null===(a=e.relatedTarget)||void 0===a?void 0:a.placeholder)||y||j(!0)},onBlur:e=>{var a,l,r,i,t,o,d;"addVar"===(null===(a=e.relatedTarget)||void 0===a?void 0:a.id)||"varList"===(null===(l=e.relatedTarget)||void 0===l?void 0:l.id)||(null===(i=null===(r=e.relatedTarget)||void 0===r?void 0:r.className)||void 0===i?void 0:i.includes("exlualr0"))||(null===(o=null===(t=e.relatedTarget)||void 0===t?void 0:t.className)||void 0===o?void 0:o.includes("sc-dZoequ "))?(s.current&&s.current.focus(),g(!0)):"Search..."===(null===(d=e.relatedTarget)||void 0===d?void 0:d.placeholder)?g(!0):(g(!1),j(!1),w(!1))}}),e("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"space-between"}},{children:[T.actualValue&&o.showHelp?a("div",Object.assign({style:{marginTop:4}},{children:a(v,{children:`This value is of type ${T.variableType}`})})):a("div",{}),x&&a(n,Object.assign({right:o.addVarBoxRight,id:"addVar",onClick:()=>{j(!y)}},{children:e("div",Object.assign({className:"add"},{children:[a(l,{color:"white"}),a("div",Object.assign({className:"variable"},{children:"Add variable"}))]}))}))]})),y&&a(c,{data:o.variablesList,showVariable:!0,setShowVariable:()=>{j(!1)},variableValue:h,setVariableValue:V,placeholder:"",pickerSize:"large",enableVariable:!0,selectWithTypes:!0,onSearchBlur:e=>{var a,l,r,i,t,o;"varList"===(null===(a=e.relatedTarget)||void 0===a?void 0:a.id)||(null===(r=null===(l=e.relatedTarget)||void 0===l?void 0:l.className)||void 0===r?void 0:r.includes("exlualr0"))||(null===(t=null===(i=e.relatedTarget)||void 0===i?void 0:i.className)||void 0===t?void 0:t.includes("sc-dZoequ "))?s.current.focus():"Enter here"===(null===(o=e.relatedTarget)||void 0===o?void 0:o.placeholder)?e.relatedTarget.id!==m&&(j(!1),w(!1),g(!1)):(j(!1),w(!1),g(!1))}})]}))},b=o.div`
|
|
2
2
|
margin-bottom: 32px;
|
|
3
3
|
input {
|
|
4
|
-
color: ${e=>e.isVar?
|
|
4
|
+
color: ${e=>e.isVar?s.stroke.brand:"black"};
|
|
5
5
|
}
|
|
6
|
-
`;export{
|
|
6
|
+
`;export{p as InputWithVariables};
|