@bikdotai/bik-component-library 0.0.530-beta0.rt13 → 0.0.530-beta0.rt15

package/dist/cjs/components/bik-layout/MockMenus.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export declare const Menus: ({
     displayName: string;
     key: number;

package/dist/cjs/components/template-preview/RenderVariableUIForPreview.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("../../constants/Theme.js"),t=require("./constants/regexPatterns.js");exports.default=a=>{let{content:n,variablStore:s,brandColor:l=r.COLORS.content.brand}=a;const o=(null==s?void 0:s.length)?s.map((e=>e.updatedValue)):n.match(t.variablePatternGlobal)||[];return t.variablePatternGlobal.lastIndex=0,e.jsx(e.Fragment,{children:n.split(t.variablePattern).map(((r,t)=>o[t]?e.jsxs("span",{children:[r,e.jsx("span",Object.assign({id:`connectors_variable_${t+1}`,style:{color:l,textDecoration:"underline",wordBreak:"break-word"}},{children:o[t]})),e.jsx("span",{children:" "})]},t):e.jsx("span",{children:r},t)))})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("../../constants/Theme.js"),a=require("./constants/regexPatterns.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var s=n(r);exports.default=r=>{let{content:n,variablStore:l,brandColor:o=t.COLORS.content.brand}=r;const i=s.default.useMemo((()=>{if(null==l?void 0:l.length)return l.map((e=>e.updatedValue));{const e=n.match(a.variablePatternGlobal)||[];return a.variablePatternGlobal.lastIndex=0,e}}),[n,l]);return e.jsx(e.Fragment,{children:n.split(a.variablePattern).map(((r,t)=>i[t]?e.jsxs("span",{children:[r,e.jsx("span",Object.assign({id:`connectors_variable_${t+1}`,style:{color:o,textDecoration:"underline",wordBreak:"break-word"}},{children:i[t]})),e.jsx("span",{children:" "})]},t):e.jsx("span",{children:r},t)))})};

package/dist/cjs/components/template-preview/SMS/SMSBubble.d.ts

@@ -2,7 +2,7 @@ import { ReactNode } from 'react';
 export declare const SideCaret: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const SMSContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
 export type SMSBubbleProps = {
-    content: ReactNode | string;
+    content: ReactNode;
     size?: 'small' | 'large';
 };
 declare const SMSBubble: (props: SMSBubbleProps) => import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/template-preview/SMS/SMSBubble.js

@@ -1,12 +1,12 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../assets/icons/union.svg.js"),r=require("styled-components"),s=require("../../../constants/Theme.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=i(r);const o=n.default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../assets/icons/union.svg.js"),r=require("react"),o=require("react-dom/server"),i=require("styled-components"),n=require("../../../constants/Theme.js");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=s(r),d=s(i);const u=d.default.div`
 	position: absolute;
 	width: 30px;
 	height: 30px;
 	left: -10px;
 	bottom: -1px;
-`,d=n.default.div`
+`,l=d.default.div`
 	padding: 12px;
-	background: ${s.COLORS.background.base};
+	background: ${n.COLORS.background.base};
 	border-radius: 16px;
 	position: relative;
-`;exports.SMSContainer=d,exports.SideCaret=o,exports.default=r=>{const{content:i,size:n}=r;return e.jsxs(d,{children:[e.jsx(o,{children:e.jsx(t.default,{color:s.COLORS.background.base,height:27,width:27})}),e.jsx("div",Object.assign({style:{fontSize:"small"===n?12:14},dangerouslySetInnerHTML:"string"==typeof i?{__html:i}:void 0},{children:"string"!=typeof i&&i}))]})};
+`;exports.SMSContainer=l,exports.SideCaret=u,exports.default=r=>{const{content:i,size:s}=r;let d="";return"string"==typeof i||"number"==typeof i||"boolean"==typeof i?d=String(i):a.default.isValidElement(i)?d=o.renderToString(i):Array.isArray(i)&&(d=i.join("")),e.jsxs(l,{children:[e.jsx(u,{children:e.jsx(t.default,{color:n.COLORS.background.base,height:27,width:27})}),e.jsx("div",{style:{fontSize:"small"===s?12:14},dangerouslySetInnerHTML:{__html:d}})]})};

package/dist/cjs/components/template-preview/SmsTemplatePreview.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/arrow_left.svg.js"),l=require("../../assets/icons/more_vertical.svg.js"),r=require("../../assets/icons/search.svg.js"),s=require("../../constants/Theme.js"),n=require("../template-context-mapper/context/templateModalContext.js"),i=require("../TypographyStyle.js"),a=require("./RenderVariableUIForPreview.js"),o=require("./SMS/SMSBubble.js"),d=require("./SmsTemplatePreview.styled.js");exports.default=c=>{let{template:u,variableStore:j,hideHeader:x,display_content:h,onlyTemplateContent:v,size:g}=c;var p,S,m;const b=null==u?void 0:u.content,{hideDeviceContainerInPreview:y,originalVariableList:f}=n.useTemplateModalContext();return console.log("templateContent in smsTemplatePreview",f),y?e.jsx(d.SMSBubbleContainer,Object.assign({size:g},{children:e.jsx(o.default,{size:null!=g?g:"large",content:null!==(p=null!=h?h:a.default({content:b,variablStore:null!=j?j:[]}))&&void 0!==p?p:""})})):e.jsxs(e.Fragment,{children:[!x&&!v&&e.jsx(d.SMSCardHeader,{children:e.jsx(i.TitleRegular,Object.assign({style:{maxWidth:"100%"}},{children:u.name}))}),!v&&e.jsx(d.SMSHeader,{children:e.jsxs(e.Fragment,{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:8}},{children:[e.jsx(t.default,{width:16,height:16,color:s.COLORS.content.secondary}),e.jsx(i.Caption,{children:null===(S=null==u?void 0:u.headers)||void 0===S?void 0:S[0]})]})),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:8}},{children:[e.jsx(r.default,{width:16,height:16,color:s.COLORS.content.secondary}),e.jsx(l.default,{width:16,height:16,color:s.COLORS.content.secondary})]}))]})}),e.jsx(d.SMSBubbleContainer,Object.assign({size:g},{children:e.jsx(o.default,{size:null!=g?g:"large",content:null!==(m=null!=h?h:a.default({content:b,variablStore:null!=j?j:[]}))&&void 0!==m?m:""})}))]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/arrow_left.svg.js"),r=require("../../assets/icons/more_vertical.svg.js"),l=require("../../assets/icons/search.svg.js"),s=require("../../constants/Theme.js"),n=require("../template-context-mapper/context/templateModalContext.js"),i=require("../TypographyStyle.js"),a=require("./RenderVariableUIForPreview.js"),o=require("./SMS/SMSBubble.js"),d=require("./SmsTemplatePreview.styled.js");exports.default=c=>{let{template:u,variableStore:j,hideHeader:x,display_content:h,onlyTemplateContent:v,size:g}=c;var p,S,m;const b=null==u?void 0:u.content,{hideDeviceContainerInPreview:y,originalVariableList:f}=n.useTemplateModalContext();return console.log("templateContent in smsTemplatePreview",f),y?e.jsx(d.SMSBubbleContainer,Object.assign({size:g},{children:e.jsx(o.default,{size:null!=g?g:"large",content:null!==(p=null!=h?h:a.default({content:b,variablStore:null!=j?j:[]}))&&void 0!==p?p:e.jsx(e.Fragment,{})})})):e.jsxs(e.Fragment,{children:[!x&&!v&&e.jsx(d.SMSCardHeader,{children:e.jsx(i.TitleRegular,Object.assign({style:{maxWidth:"100%"}},{children:u.name}))}),!v&&e.jsx(d.SMSHeader,{children:e.jsxs(e.Fragment,{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:8}},{children:[e.jsx(t.default,{width:16,height:16,color:s.COLORS.content.secondary}),e.jsx(i.Caption,{children:null===(S=null==u?void 0:u.headers)||void 0===S?void 0:S[0]})]})),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:8}},{children:[e.jsx(l.default,{width:16,height:16,color:s.COLORS.content.secondary}),e.jsx(r.default,{width:16,height:16,color:s.COLORS.content.secondary})]}))]})}),e.jsx(d.SMSBubbleContainer,Object.assign({size:g},{children:e.jsx(o.default,{size:null!=g?g:"large",content:null!==(m=null!=h?h:a.default({content:b,variablStore:null!=j?j:[]}))&&void 0!==m?m:""})}))]})};

package/dist/esm/components/bik-layout/MockMenus.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export declare const Menus: ({
     displayName: string;
     key: number;

package/dist/esm/components/template-preview/RenderVariableUIForPreview.js

@@ -1 +1 @@
-import{jsx as e,Fragment as n,jsxs as t}from"react/jsx-runtime";import{COLORS as r}from"../../constants/Theme.js";import{variablePatternGlobal as a,variablePattern as o}from"./constants/regexPatterns.js";const s=s=>{let{content:l,variablStore:c,brandColor:i=r.content.brand}=s;const d=(null==c?void 0:c.length)?c.map((e=>e.updatedValue)):l.match(a)||[];return a.lastIndex=0,e(n,{children:l.split(o).map(((n,r)=>d[r]?t("span",{children:[n,e("span",Object.assign({id:`connectors_variable_${r+1}`,style:{color:i,textDecoration:"underline",wordBreak:"break-word"}},{children:d[r]})),e("span",{children:" "})]},r):e("span",{children:n},r)))})};export{s as default};
+import{jsx as r,Fragment as e,jsxs as t}from"react/jsx-runtime";import n from"react";import{COLORS as o}from"../../constants/Theme.js";import{variablePatternGlobal as a,variablePattern as s}from"./constants/regexPatterns.js";const c=c=>{let{content:i,variablStore:l,brandColor:d=o.content.brand}=c;const m=n.useMemo((()=>{if(null==l?void 0:l.length)return l.map((r=>r.updatedValue));{const r=i.match(a)||[];return a.lastIndex=0,r}}),[i,l]);return r(e,{children:i.split(s).map(((e,n)=>m[n]?t("span",{children:[e,r("span",Object.assign({id:`connectors_variable_${n+1}`,style:{color:d,textDecoration:"underline",wordBreak:"break-word"}},{children:m[n]})),r("span",{children:" "})]},n):r("span",{children:e},n)))})};export{c as default};

package/dist/esm/components/template-preview/SMS/SMSBubble.d.ts

@@ -2,7 +2,7 @@ import { ReactNode } from 'react';
 export declare const SideCaret: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const SMSContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
 export type SMSBubbleProps = {
-    content: ReactNode | string;
+    content: ReactNode;
     size?: 'small' | 'large';
 };
 declare const SMSBubble: (props: SMSBubbleProps) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/template-preview/SMS/SMSBubble.js

@@ -1,12 +1,12 @@
-import{jsxs as t,jsx as o}from"react/jsx-runtime";import e from"../../../assets/icons/union.svg.js";import i from"styled-components";import{COLORS as n}from"../../../constants/Theme.js";const s=i.div`
+import{jsxs as t,jsx as o}from"react/jsx-runtime";import e from"../../../assets/icons/union.svg.js";import r from"react";import{renderToString as i}from"react-dom/server";import n from"styled-components";import{COLORS as s}from"../../../constants/Theme.js";const a=n.div`
 	position: absolute;
 	width: 30px;
 	height: 30px;
 	left: -10px;
 	bottom: -1px;
-`,r=i.div`
+`,m=n.div`
 	padding: 12px;
-	background: ${n.background.base};
+	background: ${s.background.base};
 	border-radius: 16px;
 	position: relative;
-`,d=i=>{const{content:d,size:a}=i;return t(r,{children:[o(s,{children:o(e,{color:n.background.base,height:27,width:27})}),o("div",Object.assign({style:{fontSize:"small"===a?12:14},dangerouslySetInnerHTML:"string"==typeof d?{__html:d}:void 0},{children:"string"!=typeof d&&d}))]})};export{r as SMSContainer,s as SideCaret,d as default};
+`,p=n=>{const{content:p,size:d}=n;let l="";return"string"==typeof p||"number"==typeof p||"boolean"==typeof p?l=String(p):r.isValidElement(p)?l=i(p):Array.isArray(p)&&(l=p.join("")),t(m,{children:[o(a,{children:o(e,{color:s.background.base,height:27,width:27})}),o("div",{style:{fontSize:"small"===d?12:14},dangerouslySetInnerHTML:{__html:l}})]})};export{m as SMSContainer,a as SideCaret,p as default};

package/dist/esm/components/template-preview/SmsTemplatePreview.js

@@ -1 +1 @@
-import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import n from"../../assets/icons/arrow_left.svg.js";import o from"../../assets/icons/more_vertical.svg.js";import r from"../../assets/icons/search.svg.js";import{COLORS as l}from"../../constants/Theme.js";import{useTemplateModalContext as s}from"../template-context-mapper/context/templateModalContext.js";import{TitleRegular as a,Caption as c}from"../TypographyStyle.js";import d from"./RenderVariableUIForPreview.js";import m from"./SMS/SMSBubble.js";import{SMSBubbleContainer as p,SMSCardHeader as h,SMSHeader as v}from"./SmsTemplatePreview.styled.js";const g=g=>{let{template:f,variableStore:j,hideHeader:u,display_content:y,onlyTemplateContent:b,size:w}=g;var x,S,z;const O=null==f?void 0:f.content,{hideDeviceContainerInPreview:T,originalVariableList:C}=s();return console.log("templateContent in smsTemplatePreview",C),T?e(p,Object.assign({size:w},{children:e(m,{size:null!=w?w:"large",content:null!==(x=null!=y?y:d({content:O,variablStore:null!=j?j:[]}))&&void 0!==x?x:""})})):t(i,{children:[!u&&!b&&e(h,{children:e(a,Object.assign({style:{maxWidth:"100%"}},{children:f.name}))}),!b&&e(v,{children:t(i,{children:[t("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:8}},{children:[e(n,{width:16,height:16,color:l.content.secondary}),e(c,{children:null===(S=null==f?void 0:f.headers)||void 0===S?void 0:S[0]})]})),t("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:8}},{children:[e(r,{width:16,height:16,color:l.content.secondary}),e(o,{width:16,height:16,color:l.content.secondary})]}))]})}),e(p,Object.assign({size:w},{children:e(m,{size:null!=w?w:"large",content:null!==(z=null!=y?y:d({content:O,variablStore:null!=j?j:[]}))&&void 0!==z?z:""})}))]})};export{g as default};
+import{jsx as e,Fragment as t,jsxs as i}from"react/jsx-runtime";import n from"../../assets/icons/arrow_left.svg.js";import o from"../../assets/icons/more_vertical.svg.js";import r from"../../assets/icons/search.svg.js";import{COLORS as l}from"../../constants/Theme.js";import{useTemplateModalContext as s}from"../template-context-mapper/context/templateModalContext.js";import{TitleRegular as a,Caption as c}from"../TypographyStyle.js";import d from"./RenderVariableUIForPreview.js";import m from"./SMS/SMSBubble.js";import{SMSBubbleContainer as p,SMSCardHeader as h,SMSHeader as v}from"./SmsTemplatePreview.styled.js";const g=g=>{let{template:f,variableStore:j,hideHeader:u,display_content:y,onlyTemplateContent:b,size:w}=g;var x,S,z;const O=null==f?void 0:f.content,{hideDeviceContainerInPreview:T,originalVariableList:C}=s();return console.log("templateContent in smsTemplatePreview",C),T?e(p,Object.assign({size:w},{children:e(m,{size:null!=w?w:"large",content:null!==(x=null!=y?y:d({content:O,variablStore:null!=j?j:[]}))&&void 0!==x?x:e(t,{})})})):i(t,{children:[!u&&!b&&e(h,{children:e(a,Object.assign({style:{maxWidth:"100%"}},{children:f.name}))}),!b&&e(v,{children:i(t,{children:[i("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:8}},{children:[e(n,{width:16,height:16,color:l.content.secondary}),e(c,{children:null===(S=null==f?void 0:f.headers)||void 0===S?void 0:S[0]})]})),i("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:8}},{children:[e(r,{width:16,height:16,color:l.content.secondary}),e(o,{width:16,height:16,color:l.content.secondary})]}))]})}),e(p,Object.assign({size:w},{children:e(m,{size:null!=w?w:"large",content:null!==(z=null!=y?y:d({content:O,variablStore:null!=j?j:[]}))&&void 0!==z?z:""})}))]})};export{g as default};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@bikdotai/bik-component-library",
-	"version": "0.0.530-beta0.rt13",
+	"version": "0.0.530-beta0.rt15",
 	"description": "Bik Component Library",
 	"repository": {
 		"type": "git",