@bikdotai/bik-component-library 0.0.814 → 0.0.816-beta.0

package/dist/cjs/editor/extensions/editorDropdown.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"editorDropdown.styles.js","sources":["../../../../src/editor/extensions/editorDropdown.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const DropdownContainer = styled.div`\n\tbackground: ${COLORS.surface.standard};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 8px;\n\tbox-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);\n\tpadding: 4px;\n\tmin-width: 330px;\n\tmax-height: 260px;\n\toverflow-y: auto;\n\tfont-size: 14px;\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const DropdownItem = styled.div<{ $isActive?: boolean }>`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 12px 16px;\n\tmin-height: 43px;\n\tborder-radius: 6px;\n\tcursor: pointer;\n\tcolor: ${COLORS.content.primary};\n\tbackground: ${({ $isActive }) =>\n\t\t$isActive ? COLORS.surface.hovered : 'transparent'};\n`;\n\nexport const MentionAvatar = styled.img`\n\twidth: 24px;\n\theight: 24px;\n\tborder-radius: 50%;\n\tobject-fit: cover;\n\tflex-shrink: 0;\n`;\n\nexport const MentionAvatarFallback = styled.div`\n\twidth: 24px;\n\theight: 24px;\n\tborder-radius: 50%;\n\tbackground: ${COLORS.surface.hovered};\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tfont-size: 12px;\n\tfont-weight: 600;\n\tcolor: ${COLORS.content.primary};\n\tflex-shrink: 0;\n`;\n\nexport const MentionLabel = styled.span`\n\tfont-weight: 500;\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const MentionPresenceDot = styled.span<{ $online?: boolean }>`\n\twidth: 8px;\n\theight: 8px;\n\tborder-radius: 50%;\n\tbackground: ${({ $online }) =>\n\t\t$online ? COLORS.content.positive : COLORS.content.placeholder};\n\tmargin-left: auto;\n\tflex-shrink: 0;\n`;\n\nexport const SlashLabel = styled.span`\n\tfont-weight: 500;\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const SlashDescription = styled.span`\n\tfont-size: 12px;\n\tcolor: ${COLORS.content.secondary};\n\tmargin-left: auto;\n`;\n"],"names":["DropdownContainer","styled","COLORS","DropdownItem","$isActive","MentionAvatar","MentionAvatarFallback","MentionLabel","MentionPresenceDot","$online","SlashLabel","SlashDescription"],"mappings":"2JAGaA,EAAoBC,EAAO;AAAA,eACzBC,EAAAA,OAAO,QAAQ,QAAQ;AAAA,qBACjBA,EAAAA,OAAO,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAQhCA,EAAAA,OAAO,QAAQ,OAAO;AAAA,EAGnBC,EAAeF,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAQzBC,EAAAA,OAAO,QAAQ,OAAO;AAAA,eACjB,CAAC,CAAE,UAAAE,KAChBA,EAAYF,EAAAA,OAAO,QAAQ,QAAU,aAAa;AAAA,EAGvCG,EAAgBJ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQvBK,EAAwBL,EAAO;AAAA;AAAA;AAAA;AAAA,eAI7BC,EAAAA,OAAO,QAAQ,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAM3BA,EAAAA,OAAO,QAAQ,OAAO;AAAA;AAAA,EAInBK,EAAeN,EAAO;AAAA;AAAA,UAEzBC,EAAAA,OAAO,QAAQ,OAAO;AAAA,EAGnBM,EAAqBP,EAAO;AAAA;AAAA;AAAA;AAAA,eAI1B,CAAC,CAAE,QAAAQ,CAAA,IAChBA,EAAUP,EAAAA,OAAO,QAAQ,SAAWA,EAAAA,OAAO,QAAQ,WAAW;AAAA;AAAA;AAAA,EAKnDQ,EAAaT,EAAO;AAAA;AAAA,UAEvBC,EAAAA,OAAO,QAAQ,OAAO;AAAA,EAGnBS,EAAmBV,EAAO;AAAA;AAAA,UAE7BC,EAAAA,OAAO,QAAQ,SAAS;AAAA;AAAA"}
+{"version":3,"file":"editorDropdown.styles.js","sources":["../../../../src/editor/extensions/editorDropdown.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const DropdownContainer = styled.div`\n\tbackground: ${COLORS.surface.standard};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 8px;\n\tbox-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);\n\tpadding: 4px;\n\tmin-width: 330px;\n\tmax-height: 260px;\n\toverflow-y: auto;\n\tfont-size: 14px;\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const DropdownItem = styled.div<{ $isActive?: boolean }>`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 12px 16px;\n\tmin-height: 43px;\n\tborder-radius: 6px;\n\tcursor: pointer;\n\tcolor: ${COLORS.content.primary};\n\tbackground: ${({ $isActive }) =>\n\t\t$isActive ? COLORS.surface.hovered : 'transparent'};\n`;\n\nexport const MentionAvatar = styled.img`\n\twidth: 24px;\n\theight: 24px;\n\tborder-radius: 50%;\n\tobject-fit: cover;\n\tflex-shrink: 0;\n`;\n\nexport const MentionAvatarFallback = styled.div`\n\twidth: 24px;\n\theight: 24px;\n\tborder-radius: 50%;\n\tbackground: ${COLORS.surface.hovered};\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tfont-size: 12px;\n\tfont-weight: 600;\n\tcolor: ${COLORS.content.primary};\n\tflex-shrink: 0;\n`;\n\nexport const MentionLabel = styled.span`\n\tfont-weight: 500;\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const MentionPresenceDot = styled.span<{ $online?: boolean }>`\n\twidth: 8px;\n\theight: 8px;\n\tborder-radius: 50%;\n\tbackground: ${({ $online }) =>\n\t\t$online ? COLORS.content.positive : COLORS.content.placeholder};\n\tmargin-left: auto;\n\tflex-shrink: 0;\n`;\n\nexport const SlashLabel = styled.span`\n\tfont-weight: 500;\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const SlashDescription = styled.span`\n\tfont-size: 12px;\n\tcolor: ${COLORS.content.secondary};\n\tmargin-left: auto;\n`;\n"],"names":["DropdownContainer","styled","COLORS","DropdownItem","$isActive","MentionAvatar","MentionAvatarFallback","MentionLabel","MentionPresenceDot","$online","SlashLabel","SlashDescription"],"mappings":"0NAGaA,EAAoBC,EAAAA,QAAO;AAAA,eACzBC,EAAAA,OAAO,QAAQ,QAAQ;AAAA,qBACjBA,EAAAA,OAAO,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAQhCA,EAAAA,OAAO,QAAQ,OAAO;AAAA,EAGnBC,EAAeF,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAQzBC,EAAAA,OAAO,QAAQ,OAAO;AAAA,eACjB,CAAC,CAAE,UAAAE,KAChBA,EAAYF,EAAAA,OAAO,QAAQ,QAAU,aAAa;AAAA,EAGvCG,EAAgBJ,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQvBK,EAAwBL,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,eAI7BC,EAAAA,OAAO,QAAQ,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAM3BA,EAAAA,OAAO,QAAQ,OAAO;AAAA;AAAA,EAInBK,EAAeN,EAAAA,QAAO;AAAA;AAAA,UAEzBC,EAAAA,OAAO,QAAQ,OAAO;AAAA,EAGnBM,EAAqBP,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,eAI1B,CAAC,CAAE,QAAAQ,CAAA,IAChBA,EAAUP,EAAAA,OAAO,QAAQ,SAAWA,EAAAA,OAAO,QAAQ,WAAW;AAAA;AAAA;AAAA,EAKnDQ,EAAaT,EAAAA,QAAO;AAAA;AAAA,UAEvBC,EAAAA,OAAO,QAAQ,OAAO;AAAA,EAGnBS,EAAmBV,EAAAA,QAAO;AAAA;AAAA,UAE7BC,EAAAA,OAAO,QAAQ,SAAS;AAAA;AAAA"}

package/dist/cjs/editor/extensions/mention/MentionExtension.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("../../../node_modules/@tiptap/core/dist/index.js"),u=require("@tiptap/extension-mention"),c=require("@tiptap/react"),d=require("../suggestionPopup.js"),g=require("./MentionDropdown.js");function l(a,r="@",i,o){return()=>{let e,t;return{onStart:n=>{e=new c.ReactRenderer(g.MentionDropdown,{props:{...n,renderItem:i,renderDropdown:o},editor:n.editor}),t=d.createSuggestionPopup(e.element,n.clientRect)},onUpdate:n=>{if(e.updateProps({...n,renderItem:i,renderDropdown:o}),!n.items?.length){t.hide();return}t.show(),t.updatePosition(n.clientRect)},onKeyDown:n=>n.event.key==="Escape"?(t.hide(),!0):e.ref?.onKeyDown(n)??!1,onExit:()=>{t.destroy(),e.destroy()}}}}function b(a,r,i,o){return u.extend({name:"mentionAgent"}).configure({HTMLAttributes:{class:"bik-mention bik-mention--agent"},renderText:({options:e,node:t})=>`${e.suggestion.char}${t.attrs.label}`,renderHTML:({options:e,node:t})=>["span",s.mergeAttributes(e.HTMLAttributes),`${e.suggestion.char}${t.attrs.label}`],suggestion:{char:"@",allowSpaces:!0,items:({query:e})=>a.current.filter(t=>t.label.toLowerCase().includes(e.toLowerCase())),command:({editor:e,range:t,props:n})=>{e.chain().focus().deleteRange(t).insertContent({type:"mentionAgent",attrs:{id:n.id,label:n.label}}).run(),r?.(n,"@")},render:l(r,"@",i,o)}})}function m(a,r,i,o){return u.extend({name:"mentionTeam"}).configure({HTMLAttributes:{class:"bik-mention bik-mention--team"},renderText:({options:e,node:t})=>`${e.suggestion.char}${t.attrs.label}`,renderHTML:({options:e,node:t})=>["span",s.mergeAttributes(e.HTMLAttributes),`${e.suggestion.char}${t.attrs.label}`],suggestion:{char:"#",allowSpaces:!0,items:({query:e})=>a.current.filter(t=>t.label.toLowerCase().includes(e.toLowerCase())),command:({editor:e,range:t,props:n})=>{e.chain().focus().deleteRange(t).insertContent({type:"mentionTeam",attrs:{id:n.id,label:n.label}}).run(),r?.(n,"#")},render:l(r,"#",i,o)}})}exports.buildAgentMentionExtension=b;exports.buildTeamMentionExtension=m;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("../../../node_modules/@tiptap/core/dist/index.js"),c=require("@tiptap/extension-mention"),d=require("@tiptap/react"),g=require("../suggestionPopup.js"),b=require("./MentionDropdown.js"),m=i=>i&&typeof i=="object"&&"default"in i?i:{default:i},s=m(c);function l(i,r="@",o,a){return()=>{let e,t;return{onStart:n=>{e=new d.ReactRenderer(b.MentionDropdown,{props:{...n,renderItem:o,renderDropdown:a},editor:n.editor}),t=g.createSuggestionPopup(e.element,n.clientRect)},onUpdate:n=>{if(e.updateProps({...n,renderItem:o,renderDropdown:a}),!n.items?.length){t.hide();return}t.show(),t.updatePosition(n.clientRect)},onKeyDown:n=>n.event.key==="Escape"?(t.hide(),!0):e.ref?.onKeyDown(n)??!1,onExit:()=>{t.destroy(),e.destroy()}}}}function f(i,r,o,a){return s.default.extend({name:"mentionAgent"}).configure({HTMLAttributes:{class:"bik-mention bik-mention--agent"},renderText:({options:e,node:t})=>`${e.suggestion.char}${t.attrs.label}`,renderHTML:({options:e,node:t})=>["span",u.mergeAttributes(e.HTMLAttributes),`${e.suggestion.char}${t.attrs.label}`],suggestion:{char:"@",allowSpaces:!0,items:({query:e})=>i.current.filter(t=>t.label.toLowerCase().includes(e.toLowerCase())),command:({editor:e,range:t,props:n})=>{e.chain().focus().deleteRange(t).insertContent({type:"mentionAgent",attrs:{id:n.id,label:n.label}}).run(),r?.(n,"@")},render:l(r,"@",o,a)}})}function M(i,r,o,a){return s.default.extend({name:"mentionTeam"}).configure({HTMLAttributes:{class:"bik-mention bik-mention--team"},renderText:({options:e,node:t})=>`${e.suggestion.char}${t.attrs.label}`,renderHTML:({options:e,node:t})=>["span",u.mergeAttributes(e.HTMLAttributes),`${e.suggestion.char}${t.attrs.label}`],suggestion:{char:"#",allowSpaces:!0,items:({query:e})=>i.current.filter(t=>t.label.toLowerCase().includes(e.toLowerCase())),command:({editor:e,range:t,props:n})=>{e.chain().focus().deleteRange(t).insertContent({type:"mentionTeam",attrs:{id:n.id,label:n.label}}).run(),r?.(n,"#")},render:l(r,"#",o,a)}})}exports.buildAgentMentionExtension=f;exports.buildTeamMentionExtension=M;
 //# sourceMappingURL=MentionExtension.js.map

package/dist/cjs/editor/extensions/mention/MentionExtension.js.map

@@ -1 +1 @@
-{"version":3,"file":"MentionExtension.js","sources":["../../../../../src/editor/extensions/mention/MentionExtension.ts"],"sourcesContent":["import { mergeAttributes } from '@tiptap/core';\nimport Mention from '@tiptap/extension-mention';\nimport { ReactRenderer } from '@tiptap/react';\nimport type { ReactNode } from 'react';\nimport type {\n\tMentionDropdownRenderProps,\n\tMentionItem,\n} from '../../BikEditor.types';\nimport {\n\tcreateSuggestionPopup,\n\ttype SuggestionPopup,\n} from '../suggestionPopup';\nimport { MentionDropdown } from './MentionDropdown';\n\nfunction buildRender(\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void,\n\tchar: '@' | '#' = '@',\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode,\n) {\n\treturn () => {\n\t\tlet component: ReactRenderer;\n\t\tlet popup: SuggestionPopup;\n\n\t\treturn {\n\t\t\tonStart: (props: any) => {\n\t\t\t\tcomponent = new ReactRenderer(MentionDropdown, {\n\t\t\t\t\tprops: { ...props, renderItem, renderDropdown },\n\t\t\t\t\teditor: props.editor,\n\t\t\t\t});\n\t\t\t\tpopup = createSuggestionPopup(component.element, props.clientRect);\n\t\t\t},\n\t\t\tonUpdate: (props: any) => {\n\t\t\t\tcomponent.updateProps({ ...props, renderItem, renderDropdown });\n\t\t\t\tif (!props.items?.length) {\n\t\t\t\t\tpopup.hide();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tpopup.show();\n\t\t\t\tpopup.updatePosition(props.clientRect);\n\t\t\t},\n\t\t\tonKeyDown: (props: any) => {\n\t\t\t\tif (props.event.key === 'Escape') {\n\t\t\t\t\tpopup.hide();\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\treturn (component.ref as any)?.onKeyDown(props) ?? false;\n\t\t\t},\n\t\t\tonExit: () => {\n\t\t\t\tpopup.destroy();\n\t\t\t\tcomponent.destroy();\n\t\t\t},\n\t\t};\n\t};\n}\n\nexport function buildAgentMentionExtension(\n\tagentsRef: { current: MentionItem[] },\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void,\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode,\n) {\n\treturn Mention.extend({ name: 'mentionAgent' }).configure({\n\t\tHTMLAttributes: { class: 'bik-mention bik-mention--agent' },\n\t\trenderText: ({ options, node }) =>\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\trenderHTML: ({ options, node }) => [\n\t\t\t'span',\n\t\t\tmergeAttributes(options.HTMLAttributes),\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\t],\n\t\tsuggestion: {\n\t\t\tchar: '@',\n\t\t\tallowSpaces: true,\n\t\t\titems: ({ query }: { query: string }) =>\n\t\t\t\tagentsRef.current.filter((a) =>\n\t\t\t\t\ta.label.toLowerCase().includes(query.toLowerCase()),\n\t\t\t\t),\n\t\t\tcommand: ({ editor, range, props }: any) => {\n\t\t\t\teditor\n\t\t\t\t\t.chain()\n\t\t\t\t\t.focus()\n\t\t\t\t\t.deleteRange(range)\n\t\t\t\t\t.insertContent({\n\t\t\t\t\t\ttype: 'mentionAgent',\n\t\t\t\t\t\tattrs: { id: props.id, label: props.label },\n\t\t\t\t\t})\n\t\t\t\t\t.run();\n\t\t\t\tonSelect?.(props, '@');\n\t\t\t},\n\t\t\trender: buildRender(onSelect, '@', renderItem, renderDropdown),\n\t\t},\n\t});\n}\n\nexport function buildTeamMentionExtension(\n\tteamsRef: { current: MentionItem[] },\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void,\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode,\n) {\n\treturn Mention.extend({ name: 'mentionTeam' }).configure({\n\t\tHTMLAttributes: { class: 'bik-mention bik-mention--team' },\n\t\trenderText: ({ options, node }) =>\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\trenderHTML: ({ options, node }) => [\n\t\t\t'span',\n\t\t\tmergeAttributes(options.HTMLAttributes),\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\t],\n\t\tsuggestion: {\n\t\t\tchar: '#',\n\t\t\tallowSpaces: true,\n\t\t\titems: ({ query }: { query: string }) =>\n\t\t\t\tteamsRef.current.filter((t) =>\n\t\t\t\t\tt.label.toLowerCase().includes(query.toLowerCase()),\n\t\t\t\t),\n\t\t\tcommand: ({ editor, range, props }: any) => {\n\t\t\t\teditor\n\t\t\t\t\t.chain()\n\t\t\t\t\t.focus()\n\t\t\t\t\t.deleteRange(range)\n\t\t\t\t\t.insertContent({\n\t\t\t\t\t\ttype: 'mentionTeam',\n\t\t\t\t\t\tattrs: { id: props.id, label: props.label },\n\t\t\t\t\t})\n\t\t\t\t\t.run();\n\t\t\t\tonSelect?.(props, '#');\n\t\t\t},\n\t\t\trender: buildRender(onSelect, '#', renderItem, renderDropdown),\n\t\t},\n\t});\n}\n"],"names":["buildRender","onSelect","char","renderItem","renderDropdown","component","popup","props","ReactRenderer","MentionDropdown","createSuggestionPopup","buildAgentMentionExtension","agentsRef","Mention","options","node","mergeAttributes","query","a","editor","range","buildTeamMentionExtension","teamsRef"],"mappings":"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"}
+{"version":3,"file":"MentionExtension.js","sources":["../../../../../src/editor/extensions/mention/MentionExtension.ts"],"sourcesContent":["import { mergeAttributes } from '@tiptap/core';\nimport Mention from '@tiptap/extension-mention';\nimport { ReactRenderer } from '@tiptap/react';\nimport type { ReactNode } from 'react';\nimport type {\n\tMentionDropdownRenderProps,\n\tMentionItem,\n} from '../../BikEditor.types';\nimport {\n\tcreateSuggestionPopup,\n\ttype SuggestionPopup,\n} from '../suggestionPopup';\nimport { MentionDropdown } from './MentionDropdown';\n\nfunction buildRender(\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void,\n\tchar: '@' | '#' = '@',\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode,\n) {\n\treturn () => {\n\t\tlet component: ReactRenderer;\n\t\tlet popup: SuggestionPopup;\n\n\t\treturn {\n\t\t\tonStart: (props: any) => {\n\t\t\t\tcomponent = new ReactRenderer(MentionDropdown, {\n\t\t\t\t\tprops: { ...props, renderItem, renderDropdown },\n\t\t\t\t\teditor: props.editor,\n\t\t\t\t});\n\t\t\t\tpopup = createSuggestionPopup(component.element, props.clientRect);\n\t\t\t},\n\t\t\tonUpdate: (props: any) => {\n\t\t\t\tcomponent.updateProps({ ...props, renderItem, renderDropdown });\n\t\t\t\tif (!props.items?.length) {\n\t\t\t\t\tpopup.hide();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tpopup.show();\n\t\t\t\tpopup.updatePosition(props.clientRect);\n\t\t\t},\n\t\t\tonKeyDown: (props: any) => {\n\t\t\t\tif (props.event.key === 'Escape') {\n\t\t\t\t\tpopup.hide();\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\treturn (component.ref as any)?.onKeyDown(props) ?? false;\n\t\t\t},\n\t\t\tonExit: () => {\n\t\t\t\tpopup.destroy();\n\t\t\t\tcomponent.destroy();\n\t\t\t},\n\t\t};\n\t};\n}\n\nexport function buildAgentMentionExtension(\n\tagentsRef: { current: MentionItem[] },\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void,\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode,\n) {\n\treturn Mention.extend({ name: 'mentionAgent' }).configure({\n\t\tHTMLAttributes: { class: 'bik-mention bik-mention--agent' },\n\t\trenderText: ({ options, node }) =>\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\trenderHTML: ({ options, node }) => [\n\t\t\t'span',\n\t\t\tmergeAttributes(options.HTMLAttributes),\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\t],\n\t\tsuggestion: {\n\t\t\tchar: '@',\n\t\t\tallowSpaces: true,\n\t\t\titems: ({ query }: { query: string }) =>\n\t\t\t\tagentsRef.current.filter((a) =>\n\t\t\t\t\ta.label.toLowerCase().includes(query.toLowerCase()),\n\t\t\t\t),\n\t\t\tcommand: ({ editor, range, props }: any) => {\n\t\t\t\teditor\n\t\t\t\t\t.chain()\n\t\t\t\t\t.focus()\n\t\t\t\t\t.deleteRange(range)\n\t\t\t\t\t.insertContent({\n\t\t\t\t\t\ttype: 'mentionAgent',\n\t\t\t\t\t\tattrs: { id: props.id, label: props.label },\n\t\t\t\t\t})\n\t\t\t\t\t.run();\n\t\t\t\tonSelect?.(props, '@');\n\t\t\t},\n\t\t\trender: buildRender(onSelect, '@', renderItem, renderDropdown),\n\t\t},\n\t});\n}\n\nexport function buildTeamMentionExtension(\n\tteamsRef: { current: MentionItem[] },\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void,\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode,\n) {\n\treturn Mention.extend({ name: 'mentionTeam' }).configure({\n\t\tHTMLAttributes: { class: 'bik-mention bik-mention--team' },\n\t\trenderText: ({ options, node }) =>\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\trenderHTML: ({ options, node }) => [\n\t\t\t'span',\n\t\t\tmergeAttributes(options.HTMLAttributes),\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\t],\n\t\tsuggestion: {\n\t\t\tchar: '#',\n\t\t\tallowSpaces: true,\n\t\t\titems: ({ query }: { query: string }) =>\n\t\t\t\tteamsRef.current.filter((t) =>\n\t\t\t\t\tt.label.toLowerCase().includes(query.toLowerCase()),\n\t\t\t\t),\n\t\t\tcommand: ({ editor, range, props }: any) => {\n\t\t\t\teditor\n\t\t\t\t\t.chain()\n\t\t\t\t\t.focus()\n\t\t\t\t\t.deleteRange(range)\n\t\t\t\t\t.insertContent({\n\t\t\t\t\t\ttype: 'mentionTeam',\n\t\t\t\t\t\tattrs: { id: props.id, label: props.label },\n\t\t\t\t\t})\n\t\t\t\t\t.run();\n\t\t\t\tonSelect?.(props, '#');\n\t\t\t},\n\t\t\trender: buildRender(onSelect, '#', renderItem, renderDropdown),\n\t\t},\n\t});\n}\n"],"names":["buildRender","onSelect","char","renderItem","renderDropdown","component","popup","props","ReactRenderer","MentionDropdown","createSuggestionPopup","buildAgentMentionExtension","agentsRef","Mention","options","node","mergeAttributes","query","a","editor","range","buildTeamMentionExtension","teamsRef"],"mappings":"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"}

package/dist/cjs/editor/extensions/slashCommand/SlashCommandExtension.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("../../../node_modules/@tiptap/core/dist/index.js"),a=require("@tiptap/react"),c=require("@tiptap/suggestion"),l=require("../suggestionPopup.js"),d=require("./SlashCommandMenu.js");function m(i,s,o,r){return u.Extension.create({name:"slashCommand",addProseMirrorPlugins(){return[c({editor:this.editor,char:"/",allowSpaces:!0,items:({query:n})=>i.current.filter(t=>t.label.toLowerCase().includes(n.toLowerCase())).slice(0,20),command:({editor:n,range:t,props:e})=>{n.chain().focus().deleteRange(t).run(),s?.(e)},render:()=>{let n,t;return{onStart:e=>{n=new a.ReactRenderer(d.SlashCommandMenu,{props:{...e,renderItem:o,renderDropdown:r},editor:e.editor}),t=l.createSuggestionPopup(n.element,e.clientRect)},onUpdate:e=>{if(n.updateProps({...e,renderItem:o,renderDropdown:r}),!e.items?.length){t.hide();return}t.show(),t.updatePosition(e.clientRect)},onKeyDown:e=>e.event.key==="Escape"?(t.hide(),!0):n.ref?.onKeyDown(e)??!1,onExit:()=>{t.destroy(),n.destroy()}}}})]}})}exports.buildSlashCommandExtension=m;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("../../../node_modules/@tiptap/core/dist/index.js"),s=require("@tiptap/react"),l=require("@tiptap/suggestion"),c=require("../suggestionPopup.js"),d=require("./SlashCommandMenu.js"),m=o=>o&&typeof o=="object"&&"default"in o?o:{default:o},f=m(l);function g(o,u,r,i){return a.Extension.create({name:"slashCommand",addProseMirrorPlugins(){return[f.default({editor:this.editor,char:"/",allowSpaces:!0,items:({query:n})=>o.current.filter(t=>t.label.toLowerCase().includes(n.toLowerCase())).slice(0,20),command:({editor:n,range:t,props:e})=>{n.chain().focus().deleteRange(t).run(),u?.(e)},render:()=>{let n,t;return{onStart:e=>{n=new s.ReactRenderer(d.SlashCommandMenu,{props:{...e,renderItem:r,renderDropdown:i},editor:e.editor}),t=c.createSuggestionPopup(n.element,e.clientRect)},onUpdate:e=>{if(n.updateProps({...e,renderItem:r,renderDropdown:i}),!e.items?.length){t.hide();return}t.show(),t.updatePosition(e.clientRect)},onKeyDown:e=>e.event.key==="Escape"?(t.hide(),!0):n.ref?.onKeyDown(e)??!1,onExit:()=>{t.destroy(),n.destroy()}}}})]}})}exports.buildSlashCommandExtension=g;
 //# sourceMappingURL=SlashCommandExtension.js.map

package/dist/cjs/editor/extensions/slashCommand/SlashCommandExtension.js.map

@@ -1 +1 @@
-{"version":3,"file":"SlashCommandExtension.js","sources":["../../../../../src/editor/extensions/slashCommand/SlashCommandExtension.ts"],"sourcesContent":["import { Extension } from '@tiptap/core';\nimport { ReactRenderer } from '@tiptap/react';\nimport Suggestion from '@tiptap/suggestion';\nimport type { ReactNode } from 'react';\nimport type {\n\tSlashCommandDropdownRenderProps,\n\tSlashCommandItem,\n} from '../../BikEditor.types';\nimport {\n\tcreateSuggestionPopup,\n\ttype SuggestionPopup,\n} from '../suggestionPopup';\nimport { SlashCommandMenu } from './SlashCommandMenu';\n\nexport function buildSlashCommandExtension(\n\tcommandsRef: { current: SlashCommandItem[] },\n\tonSelect?: (command: SlashCommandItem) => void,\n\trenderItem?: (item: SlashCommandItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: SlashCommandDropdownRenderProps) => ReactNode,\n) {\n\treturn Extension.create({\n\t\tname: 'slashCommand',\n\t\taddProseMirrorPlugins() {\n\t\t\treturn [\n\t\t\t\tSuggestion({\n\t\t\t\t\teditor: this.editor,\n\t\t\t\t\tchar: '/',\n\t\t\t\t\tallowSpaces: true,\n\t\t\t\t\titems: ({ query }: any) =>\n\t\t\t\t\t\tcommandsRef.current\n\t\t\t\t\t\t\t.filter((c) =>\n\t\t\t\t\t\t\t\tc.label.toLowerCase().includes(query.toLowerCase()),\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t.slice(0, 20),\n\t\t\t\t\tcommand: ({ editor, range, props }: any) => {\n\t\t\t\t\t\teditor.chain().focus().deleteRange(range).run();\n\t\t\t\t\t\tonSelect?.(props);\n\t\t\t\t\t},\n\t\t\t\t\trender: () => {\n\t\t\t\t\t\tlet component: ReactRenderer;\n\t\t\t\t\t\tlet popup: SuggestionPopup;\n\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\tonStart: (props: any) => {\n\t\t\t\t\t\t\t\tcomponent = new ReactRenderer(SlashCommandMenu, {\n\t\t\t\t\t\t\t\t\tprops: { ...props, renderItem, renderDropdown },\n\t\t\t\t\t\t\t\t\teditor: props.editor,\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\tpopup = createSuggestionPopup(\n\t\t\t\t\t\t\t\t\tcomponent.element,\n\t\t\t\t\t\t\t\t\tprops.clientRect,\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\tonUpdate: (props: any) => {\n\t\t\t\t\t\t\t\tcomponent.updateProps({ ...props, renderItem, renderDropdown });\n\t\t\t\t\t\t\t\tif (!props.items?.length) {\n\t\t\t\t\t\t\t\t\tpopup.hide();\n\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tpopup.show();\n\t\t\t\t\t\t\t\tpopup.updatePosition(props.clientRect);\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\tonKeyDown: (props: any) => {\n\t\t\t\t\t\t\t\tif (props.event.key === 'Escape') {\n\t\t\t\t\t\t\t\t\tpopup.hide();\n\t\t\t\t\t\t\t\t\treturn true;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\treturn (component.ref as any)?.onKeyDown(props) ?? false;\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\tonExit: () => {\n\t\t\t\t\t\t\t\tpopup.destroy();\n\t\t\t\t\t\t\t\tcomponent.destroy();\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t};\n\t\t\t\t\t},\n\t\t\t\t}),\n\t\t\t];\n\t\t},\n\t});\n}\n"],"names":["buildSlashCommandExtension","commandsRef","onSelect","renderItem","renderDropdown","Extension","Suggestion","query","c","editor","range","props","component","popup","ReactRenderer","SlashCommandMenu","createSuggestionPopup"],"mappings":"qRAcO,SAASA,EACfC,EACAC,EACAC,EACAC,EACC,CACD,OAAOC,EAAAA,UAAU,OAAO,CACvB,KAAM,eACN,uBAAwB,CACvB,MAAO,CACNC,EAAW,CACV,OAAQ,KAAK,OACb,KAAM,IACN,YAAa,GACb,MAAO,CAAC,CAAE,MAAAC,CAAA,IACTN,EAAY,QACV,OAAQO,GACRA,EAAE,MAAM,cAAc,SAASD,EAAM,YAAA,CAAa,CAAA,EAElD,MAAM,EAAG,EAAE,EACd,QAAS,CAAC,CAAE,OAAAE,EAAQ,MAAAC,EAAO,MAAAC,KAAiB,CAC3CF,EAAO,QAAQ,MAAA,EAAQ,YAAYC,CAAK,EAAE,IAAA,EAC1CR,IAAWS,CAAK,CACjB,EACA,OAAQ,IAAM,CACb,IAAIC,EACAC,EAEJ,MAAO,CACN,QAAUF,GAAe,CACxBC,EAAY,IAAIE,EAAAA,cAAcC,mBAAkB,CAC/C,MAAO,CAAE,GAAGJ,EAAO,WAAAR,EAAY,eAAAC,CAAA,EAC/B,OAAQO,EAAM,MAAA,CACd,EACDE,EAAQG,EAAAA,sBACPJ,EAAU,QACVD,EAAM,UAAA,CAER,EACA,SAAWA,GAAe,CAEzB,GADAC,EAAU,YAAY,CAAE,GAAGD,EAAO,WAAAR,EAAY,eAAAC,EAAgB,EAC1D,CAACO,EAAM,OAAO,OAAQ,CACzBE,EAAM,KAAA,EACN,MACD,CACAA,EAAM,KAAA,EACNA,EAAM,eAAeF,EAAM,UAAU,CACtC,EACA,UAAYA,GACPA,EAAM,MAAM,MAAQ,UACvBE,EAAM,KAAA,EACC,IAEAD,EAAU,KAAa,UAAUD,CAAK,GAAK,GAEpD,OAAQ,IAAM,CACbE,EAAM,QAAA,EACND,EAAU,QAAA,CACX,CAAA,CAEF,CAAA,CACA,CAAA,CAEH,CAAA,CACA,CACF"}
+{"version":3,"file":"SlashCommandExtension.js","sources":["../../../../../src/editor/extensions/slashCommand/SlashCommandExtension.ts"],"sourcesContent":["import { Extension } from '@tiptap/core';\nimport { ReactRenderer } from '@tiptap/react';\nimport Suggestion from '@tiptap/suggestion';\nimport type { ReactNode } from 'react';\nimport type {\n\tSlashCommandDropdownRenderProps,\n\tSlashCommandItem,\n} from '../../BikEditor.types';\nimport {\n\tcreateSuggestionPopup,\n\ttype SuggestionPopup,\n} from '../suggestionPopup';\nimport { SlashCommandMenu } from './SlashCommandMenu';\n\nexport function buildSlashCommandExtension(\n\tcommandsRef: { current: SlashCommandItem[] },\n\tonSelect?: (command: SlashCommandItem) => void,\n\trenderItem?: (item: SlashCommandItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: SlashCommandDropdownRenderProps) => ReactNode,\n) {\n\treturn Extension.create({\n\t\tname: 'slashCommand',\n\t\taddProseMirrorPlugins() {\n\t\t\treturn [\n\t\t\t\tSuggestion({\n\t\t\t\t\teditor: this.editor,\n\t\t\t\t\tchar: '/',\n\t\t\t\t\tallowSpaces: true,\n\t\t\t\t\titems: ({ query }: any) =>\n\t\t\t\t\t\tcommandsRef.current\n\t\t\t\t\t\t\t.filter((c) =>\n\t\t\t\t\t\t\t\tc.label.toLowerCase().includes(query.toLowerCase()),\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t.slice(0, 20),\n\t\t\t\t\tcommand: ({ editor, range, props }: any) => {\n\t\t\t\t\t\teditor.chain().focus().deleteRange(range).run();\n\t\t\t\t\t\tonSelect?.(props);\n\t\t\t\t\t},\n\t\t\t\t\trender: () => {\n\t\t\t\t\t\tlet component: ReactRenderer;\n\t\t\t\t\t\tlet popup: SuggestionPopup;\n\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\tonStart: (props: any) => {\n\t\t\t\t\t\t\t\tcomponent = new ReactRenderer(SlashCommandMenu, {\n\t\t\t\t\t\t\t\t\tprops: { ...props, renderItem, renderDropdown },\n\t\t\t\t\t\t\t\t\teditor: props.editor,\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\tpopup = createSuggestionPopup(\n\t\t\t\t\t\t\t\t\tcomponent.element,\n\t\t\t\t\t\t\t\t\tprops.clientRect,\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\tonUpdate: (props: any) => {\n\t\t\t\t\t\t\t\tcomponent.updateProps({ ...props, renderItem, renderDropdown });\n\t\t\t\t\t\t\t\tif (!props.items?.length) {\n\t\t\t\t\t\t\t\t\tpopup.hide();\n\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tpopup.show();\n\t\t\t\t\t\t\t\tpopup.updatePosition(props.clientRect);\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\tonKeyDown: (props: any) => {\n\t\t\t\t\t\t\t\tif (props.event.key === 'Escape') {\n\t\t\t\t\t\t\t\t\tpopup.hide();\n\t\t\t\t\t\t\t\t\treturn true;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\treturn (component.ref as any)?.onKeyDown(props) ?? false;\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\tonExit: () => {\n\t\t\t\t\t\t\t\tpopup.destroy();\n\t\t\t\t\t\t\t\tcomponent.destroy();\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t};\n\t\t\t\t\t},\n\t\t\t\t}),\n\t\t\t];\n\t\t},\n\t});\n}\n"],"names":["buildSlashCommandExtension","commandsRef","onSelect","renderItem","renderDropdown","Extension","Suggestion","query","c","editor","range","props","component","popup","ReactRenderer","SlashCommandMenu","createSuggestionPopup"],"mappings":"oVAcO,SAASA,EACfC,EACAC,EACAC,EACAC,EACC,CACD,OAAOC,EAAAA,UAAU,OAAO,CACvB,KAAM,eACN,uBAAwB,CACvB,MAAO,CACNC,UAAW,CACV,OAAQ,KAAK,OACb,KAAM,IACN,YAAa,GACb,MAAO,CAAC,CAAE,MAAAC,CAAA,IACTN,EAAY,QACV,OAAQO,GACRA,EAAE,MAAM,cAAc,SAASD,EAAM,YAAA,CAAa,CAAA,EAElD,MAAM,EAAG,EAAE,EACd,QAAS,CAAC,CAAE,OAAAE,EAAQ,MAAAC,EAAO,MAAAC,KAAiB,CAC3CF,EAAO,QAAQ,MAAA,EAAQ,YAAYC,CAAK,EAAE,IAAA,EAC1CR,IAAWS,CAAK,CACjB,EACA,OAAQ,IAAM,CACb,IAAIC,EACAC,EAEJ,MAAO,CACN,QAAUF,GAAe,CACxBC,EAAY,IAAIE,EAAAA,cAAcC,mBAAkB,CAC/C,MAAO,CAAE,GAAGJ,EAAO,WAAAR,EAAY,eAAAC,CAAA,EAC/B,OAAQO,EAAM,MAAA,CACd,EACDE,EAAQG,EAAAA,sBACPJ,EAAU,QACVD,EAAM,UAAA,CAER,EACA,SAAWA,GAAe,CAEzB,GADAC,EAAU,YAAY,CAAE,GAAGD,EAAO,WAAAR,EAAY,eAAAC,EAAgB,EAC1D,CAACO,EAAM,OAAO,OAAQ,CACzBE,EAAM,KAAA,EACN,MACD,CACAA,EAAM,KAAA,EACNA,EAAM,eAAeF,EAAM,UAAU,CACtC,EACA,UAAYA,GACPA,EAAM,MAAM,MAAQ,UACvBE,EAAM,KAAA,EACC,IAEAD,EAAU,KAAa,UAAUD,CAAK,GAAK,GAEpD,OAAQ,IAAM,CACbE,EAAM,QAAA,EACND,EAAU,QAAA,CACX,CAAA,CAEF,CAAA,CACA,CAAA,CAEH,CAAA,CACA,CACF"}

package/dist/esm/components/analytics-chips-and-dropdowns/AnalyticsDropdown.js

@@ -1,5 +1,4 @@
 import { jsx as s, Fragment as Y, jsxs as x } from "react/jsx-runtime";
-import "bootstrap/dist/css/bootstrap.min.css";
 import { useState as S, useRef as K, useEffect as C } from "react";
 import { Dropdown as k } from "react-bootstrap";
 import Q from "react-dom";
@@ -7,7 +6,7 @@ import { DEFAULT_THEME as _, BASE_COLORS as h } from "../../constants/Theme.js";
 import { Caption as W, BodySecondary as q, BodyCaption as H } from "../TypographyStyle.js";
 import { MainDropdown as U, ItemMenuContainer as X } from "./CommonStyles.js";
 import { DatePicker as Z } from "../datePicker/DatePicker.js";
-const re = ({
+const ae = ({
   options: t,
   placeholder: r = "Select an option",
   selected: o,
@@ -253,7 +252,7 @@ const re = ({
   return o;
 };
 export {
-  re as AnalyticsDropdown,
+  ae as AnalyticsDropdown,
   V as EachItem,
   m as formatDate
 };

package/dist/esm/components/analytics-chips-and-dropdowns/AnalyticsDropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"AnalyticsDropdown.js","sources":["../../../../src/components/analytics-chips-and-dropdowns/AnalyticsDropdown.tsx"],"sourcesContent":["import 'bootstrap/dist/css/bootstrap.min.css';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { Dropdown } from 'react-bootstrap';\nimport { DropDirection } from 'react-bootstrap/esm/DropdownContext';\nimport ReactDOM from 'react-dom';\nimport { BASE_COLORS, DEFAULT_THEME } from '@src/constants/Theme';\nimport { DatePicker } from '../datePicker';\nimport { BodyCaption, BodySecondary, Caption } from '../TypographyStyle';\nimport { ItemMenuContainer, MainDropdown } from './CommonStyles';\n\nexport interface DropdownOptions {\n\tlabel: string;\n\tsubLabel?: string;\n\tvalue: string;\n\tkey: string | number;\n\tnoOfDays?: number;\n\tisCustom?: boolean;\n\tdateRangeSelectionOptions?: {\n\t\tselectRange: boolean;\n\t\tselectedDates?: Date[];\n\t\tselectedDate?: Date;\n\t\tminDate?: Date;\n\t\tmaxDate?: Date;\n\t};\n}\n\nexport interface AnalyticsDropdownInterface {\n\toptions: DropdownOptions[];\n\tselected?: DropdownOptions;\n\tplaceholder?: string;\n\tresetDropdown?: boolean;\n\tonOptionSelected: (\n\t\tchosen: DropdownOptions & {\n\t\t\tselectedRange?: [Date, Date];\n\t\t},\n\t) => void;\n\tmaxHeight?: string;\n\tbackgroundcolor?: string;\n\tcalendarPopperConfig?: {\n\t\toffsetSkid?: number;\n\t\toffsetDistance?: number;\n\t};\n\tvariant?: 'small' | 'default';\n\tdatePickerPlacement?: DropDirection;\n\tcloseDropdown?: boolean;\n\tlabelColor?: string;\n\tstyleProps?: React.CSSProperties;\n\tshowTimePicker?: boolean;\n}\n\nexport const AnalyticsDropdown: React.FC<AnalyticsDropdownInterface> = ({\n\toptions,\n\tplaceholder = 'Select an option',\n\tselected,\n\tonOptionSelected,\n\tresetDropdown,\n\tmaxHeight,\n\tbackgroundcolor,\n\tcalendarPopperConfig,\n\tvariant = 'default',\n\tdatePickerPlacement,\n\tcloseDropdown,\n\tlabelColor,\n\tstyleProps,\n\tshowTimePicker = false,\n}) => {\n\tconst [openCalender, setCalender] = useState(false);\n\tconst [selectedOption, setSelectedOption] = useState(selected);\n\tconst [selectedDate, setSelectedDate] = useState<Date[]>();\n\tconst [showDropdown, setShowDropdown] = useState(false);\n\tconst [optionPlaceholder, setOptionPlaceholder] = useState(selected);\n\tconst dropdownRef = useRef<HTMLDivElement | null>(null);\n\tconst LabelText = variant === 'small' ? Caption : BodySecondary;\n\n\tuseEffect(() => {\n\t\tresetDropdown && setSelectedOption(undefined);\n\t}, [resetDropdown]);\n\n\tuseEffect(() => {\n\t\tif (\n\t\t\tselected?.isCustom &&\n\t\t\tselected.dateRangeSelectionOptions?.selectedDates\n\t\t) {\n\t\t\tsetSelectedDate(selected.dateRangeSelectionOptions.selectedDates);\n\t\t} else {\n\t\t\tsetSelectedDate(undefined);\n\t\t}\n\t\tsetSelectedOption(selected);\n\t}, [selected]);\n\n\tuseEffect(() => {\n\t\tsetShowDropdown(false);\n\t\tsetCalender(false);\n\t}, [closeDropdown]);\n\n\tconst setDropdown = (forceState?: boolean) => {\n\t\tif (forceState !== undefined) {\n\t\t\tsetShowDropdown(forceState);\n\t\t\topenCalender && setCalender(false);\n\t\t} else {\n\t\t\tsetShowDropdown((prevState) => !prevState);\n\t\t}\n\t};\n\n\tconst handleClickOutside = (event: MouseEvent) => {\n\t\tif (\n\t\t\tdropdownRef.current &&\n\t\t\t!dropdownRef.current.contains(event.target as Node)\n\t\t) {\n\t\t\tif (openCalender) {\n\t\t\t\tsetCalender(false);\n\t\t\t}\n\t\t\tsetDropdown(false);\n\t\t}\n\t};\n\n\tuseEffect(() => {\n\t\tif (showDropdown) {\n\t\t\tdocument.addEventListener('mousedown', handleClickOutside);\n\t\t}\n\t\treturn () => {\n\t\t\tdocument.removeEventListener('mousedown', handleClickOutside);\n\t\t};\n\t}, [showDropdown]);\n\n\treturn (\n\t\t<>\n\t\t\t<MainDropdown\n\t\t\t\tdrop={'down'}\n\t\t\t\tshow={showDropdown}\n\t\t\t\tonToggle={setDropdown}\n\t\t\t\tbgColor={backgroundcolor}\n\t\t\t\tid=\"analytic-dropdown\"\n\t\t\t>\n\t\t\t\t<Dropdown.Toggle\n\t\t\t\t\tid=\"dropdown-autoclose-outside\"\n\t\t\t\t\tclassName=\"main--dropdown\"\n\t\t\t\t\tstyle={\n\t\t\t\t\t\tvariant === 'small'\n\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\tgap: 6,\n\t\t\t\t\t\t\t\t\tpadding: '4px 8px',\n\t\t\t\t\t\t\t\t\tbackgroundColor: '#FAFAFA',\n\t\t\t\t\t\t\t\t\tborderRadius: 4,\n\t\t\t\t\t\t\t\t\tborder: `1px solid ${DEFAULT_THEME.colorsV2.stroke.primary}`,\n\t\t\t\t\t\t\t  }\n\t\t\t\t\t\t\t: styleProps\n\t\t\t\t\t\t\t? styleProps\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t<LabelText\n\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\tvariant === 'small' || labelColor\n\t\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\t\tcolor:\n\t\t\t\t\t\t\t\t\t\t\tlabelColor || DEFAULT_THEME.colorsV2.content.secondary,\n\t\t\t\t\t\t\t\t  }\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{selectedOption?.isCustom\n\t\t\t\t\t\t\t? selectedDate\n\t\t\t\t\t\t\t\t? formatDate(selectedDate[0], showTimePicker) ===\n\t\t\t\t\t\t\t\t  formatDate(selectedDate[1], showTimePicker)\n\t\t\t\t\t\t\t\t\t? `${formatDate(selectedDate[0], showTimePicker)}`\n\t\t\t\t\t\t\t\t\t: `${formatDate(\n\t\t\t\t\t\t\t\t\t\t\tselectedDate[0],\n\t\t\t\t\t\t\t\t\t\t\tshowTimePicker,\n\t\t\t\t\t\t\t\t\t  )} to ${formatDate(selectedDate[1], showTimePicker)}`\n\t\t\t\t\t\t\t\t: optionPlaceholder?.label\n\t\t\t\t\t\t\t\t? optionPlaceholder?.label\n\t\t\t\t\t\t\t\t: placeholder\n\t\t\t\t\t\t\t: selectedOption\n\t\t\t\t\t\t\t? selectedOption?.label\n\t\t\t\t\t\t\t: placeholder}\n\t\t\t\t\t</LabelText>\n\t\t\t\t</Dropdown.Toggle>\n\t\t\t\t{ReactDOM.createPortal(\n\t\t\t\t\t<Dropdown.Menu\n\t\t\t\t\t\tclassName=\"main--dropdown\"\n\t\t\t\t\t\tstyle={{ padding: 0 }}\n\t\t\t\t\t\tref={dropdownRef}\n\t\t\t\t\t>\n\t\t\t\t\t\t<MainDropdown\n\t\t\t\t\t\t\tdrop={datePickerPlacement ?? 'end'}\n\t\t\t\t\t\t\tid=\"sub--dropdown\"\n\t\t\t\t\t\t\tshow={openCalender}\n\t\t\t\t\t\t\tonToggle={(toggleCalender) => {\n\t\t\t\t\t\t\t\t!toggleCalender && setShowDropdown(false);\n\t\t\t\t\t\t\t\tsetCalender(!openCalender);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tmaxHeight: maxHeight ? maxHeight : 'auto',\n\t\t\t\t\t\t\t\t\toverflowY: 'scroll',\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{options.map((eachOption, index) => (\n\t\t\t\t\t\t\t\t\t<div key={eachOption?.key}>\n\t\t\t\t\t\t\t\t\t\t{eachOption?.isCustom ? (\n\t\t\t\t\t\t\t\t\t\t\t<Dropdown.Toggle className=\"sub--dropdown\">\n\t\t\t\t\t\t\t\t\t\t\t\t<EachItem\n\t\t\t\t\t\t\t\t\t\t\t\t\tisFirstItem={index === 0}\n\t\t\t\t\t\t\t\t\t\t\t\t\tisLastItem={index === options.length - 1}\n\t\t\t\t\t\t\t\t\t\t\t\t\teachOption={eachOption}\n\t\t\t\t\t\t\t\t\t\t\t\t\tselectedOption={selectedOption}\n\t\t\t\t\t\t\t\t\t\t\t\t\tselectedDate={selectedDate}\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClickingEachItem={(option) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetSelectedOption(option);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetCalender(true);\n\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\trangeSelection={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\teachOption?.dateRangeSelectionOptions?.selectRange\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? true\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: false\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\tshowTimePicker={showTimePicker}\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t</Dropdown.Toggle>\n\t\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t\t<EachItem\n\t\t\t\t\t\t\t\t\t\t\t\tisFirstItem={index === 0}\n\t\t\t\t\t\t\t\t\t\t\t\tisLastItem={index === options.length - 1}\n\t\t\t\t\t\t\t\t\t\t\t\teachOption={eachOption}\n\t\t\t\t\t\t\t\t\t\t\t\tselectedOption={selectedOption}\n\t\t\t\t\t\t\t\t\t\t\t\tselectedDate={selectedDate}\n\t\t\t\t\t\t\t\t\t\t\t\tonClickingEachItem={(option) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\tsetSelectedDate(undefined);\n\t\t\t\t\t\t\t\t\t\t\t\t\tsetSelectedOption(option);\n\t\t\t\t\t\t\t\t\t\t\t\t\tsetOptionPlaceholder(option);\n\t\t\t\t\t\t\t\t\t\t\t\t\tsetDropdown();\n\t\t\t\t\t\t\t\t\t\t\t\t\tif (!option.noOfDays) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonOptionSelected(option);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\tconst endDate = new Date();\n\t\t\t\t\t\t\t\t\t\t\t\t\tconst startDate = new Date();\n\t\t\t\t\t\t\t\t\t\t\t\t\tstartDate.setDate(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tendDate.getDate() - option.noOfDays,\n\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\tonOptionSelected({\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t...option,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tselectedRange: [startDate, endDate],\n\t\t\t\t\t\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\tshowTimePicker={showTimePicker}\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<Dropdown.Menu\n\t\t\t\t\t\t\t\tclassName=\"sub--dropdown\"\n\t\t\t\t\t\t\t\tpopperConfig={{\n\t\t\t\t\t\t\t\t\tmodifiers: [\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\tname: 'offset',\n\t\t\t\t\t\t\t\t\t\t\toptions: {\n\t\t\t\t\t\t\t\t\t\t\t\toffset: [\n\t\t\t\t\t\t\t\t\t\t\t\t\tcalendarPopperConfig?.offsetSkid || 0,\n\t\t\t\t\t\t\t\t\t\t\t\t\tcalendarPopperConfig?.offsetDistance || 0,\n\t\t\t\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<DatePicker\n\t\t\t\t\t\t\t\t\tselectRange={\n\t\t\t\t\t\t\t\t\t\tselectedOption?.dateRangeSelectionOptions?.selectRange ||\n\t\t\t\t\t\t\t\t\t\tfalse\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tshowTimePicker={showTimePicker}\n\t\t\t\t\t\t\t\t\tmaxDate={selectedOption?.dateRangeSelectionOptions?.maxDate}\n\t\t\t\t\t\t\t\t\tminDate={selectedOption?.dateRangeSelectionOptions?.minDate}\n\t\t\t\t\t\t\t\t\tselectedDates={selectedDate}\n\t\t\t\t\t\t\t\t\tonSelectRange={(selectedStartDate, selectedEndDate) => {\n\t\t\t\t\t\t\t\t\t\tconst updatedDates = [selectedStartDate, selectedEndDate];\n\n\t\t\t\t\t\t\t\t\t\tif (selectedOption?.dateRangeSelectionOptions) {\n\t\t\t\t\t\t\t\t\t\t\tselectedOption.dateRangeSelectionOptions.selectedDates =\n\t\t\t\t\t\t\t\t\t\t\t\tupdatedDates;\n\t\t\t\t\t\t\t\t\t\t\tonOptionSelected({\n\t\t\t\t\t\t\t\t\t\t\t\t...selectedOption,\n\t\t\t\t\t\t\t\t\t\t\t\tselectedRange: [selectedStartDate, selectedEndDate],\n\t\t\t\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tsetOptionPlaceholder(selectedOption);\n\t\t\t\t\t\t\t\t\t\tsetCalender(false);\n\t\t\t\t\t\t\t\t\t\tsetSelectedDate(updatedDates);\n\t\t\t\t\t\t\t\t\t\tsetShowDropdown(!showDropdown);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonSelectDate={(selectedDate) => {\n\t\t\t\t\t\t\t\t\t\tif (selectedOption?.dateRangeSelectionOptions) {\n\t\t\t\t\t\t\t\t\t\t\tselectedOption.dateRangeSelectionOptions.selectedDates = [\n\t\t\t\t\t\t\t\t\t\t\t\tselectedDate,\n\t\t\t\t\t\t\t\t\t\t\t\tselectedDate,\n\t\t\t\t\t\t\t\t\t\t\t];\n\t\t\t\t\t\t\t\t\t\t\tonOptionSelected({\n\t\t\t\t\t\t\t\t\t\t\t\t...selectedOption,\n\t\t\t\t\t\t\t\t\t\t\t\tselectedRange: [selectedDate, selectedDate],\n\t\t\t\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tsetOptionPlaceholder(selectedOption);\n\t\t\t\t\t\t\t\t\t\tsetCalender(false);\n\t\t\t\t\t\t\t\t\t\tsetSelectedDate([selectedDate, selectedDate]);\n\t\t\t\t\t\t\t\t\t\tsetShowDropdown(!showDropdown);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</Dropdown.Menu>\n\t\t\t\t\t\t</MainDropdown>\n\t\t\t\t\t</Dropdown.Menu>,\n\t\t\t\t\tdocument.body,\n\t\t\t\t)}\n\t\t\t</MainDropdown>\n\t\t</>\n\t);\n};\n\nexport const EachItem: React.FC<{\n\teachOption: DropdownOptions;\n\tselectedOption: DropdownOptions | undefined;\n\tselectedDate: Date[] | undefined;\n\tonClickingEachItem: (optionSelected: DropdownOptions) => void;\n\trangeSelection?: boolean;\n\tisLastItem?: boolean;\n\tisFirstItem?: boolean;\n\tshowTimePicker?: boolean;\n}> = ({\n\teachOption,\n\tselectedOption,\n\tselectedDate,\n\tonClickingEachItem,\n\trangeSelection,\n\tisLastItem,\n\tisFirstItem,\n\tshowTimePicker,\n}) => {\n\treturn (\n\t\t<ItemMenuContainer\n\t\t\tisFirstItem={isFirstItem}\n\t\t\tisLastItem={isLastItem}\n\t\t\tkey={eachOption.key}\n\t\t\tonClick={() => onClickingEachItem(eachOption)}\n\t\t\tisSelected={\n\t\t\t\teachOption.isCustom\n\t\t\t\t\t? eachOption.key == selectedOption?.key && !!selectedDate\n\t\t\t\t\t: eachOption.key == selectedOption?.key\n\t\t\t}\n\t\t>\n\t\t\t<BodySecondary\n\t\t\t\tcolor={\n\t\t\t\t\teachOption.key == selectedOption?.key\n\t\t\t\t\t\t? BASE_COLORS.positive[900]\n\t\t\t\t\t\t: BASE_COLORS.grayscale[900]\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t{eachOption.label}\n\t\t\t</BodySecondary>\n\t\t\t{eachOption.subLabel ? (\n\t\t\t\t<BodyCaption style={{ color: BASE_COLORS.grayscale[700] }}>\n\t\t\t\t\t{eachOption.subLabel}\n\t\t\t\t</BodyCaption>\n\t\t\t) : (\n\t\t\t\t<></>\n\t\t\t)}\n\t\t\t{selectedDate &&\n\t\t\t\tselectedOption?.isCustom &&\n\t\t\t\teachOption.key == selectedOption?.key && (\n\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\twhiteSpace: 'normal',\n\t\t\t\t\t\t\twordBreak: 'break-word',\n\t\t\t\t\t\t\ttextAlign: 'left',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{rangeSelection\n\t\t\t\t\t\t\t? `${formatDate(selectedDate[0], showTimePicker)} to ${formatDate(\n\t\t\t\t\t\t\t\t\tselectedDate[1],\n\t\t\t\t\t\t\t\t\tshowTimePicker,\n\t\t\t\t\t\t\t  )}`\n\t\t\t\t\t\t\t: `${formatDate(selectedDate[0], showTimePicker)}`}\n\t\t\t\t\t</BodyCaption>\n\t\t\t\t)}\n\t\t</ItemMenuContainer>\n\t);\n};\n\nexport const formatDate = (dateVal: Date, includeTime?: boolean) => {\n\tconst dateString = dateVal.toLocaleString('default', {\n\t\tday: 'numeric',\n\t\tmonth: 'short',\n\t\tyear: 'numeric',\n\t});\n\n\tif (includeTime) {\n\t\tconst timeString = dateVal.toLocaleString('default', {\n\t\t\thour: 'numeric',\n\t\t\tminute: '2-digit',\n\t\t\thour12: true,\n\t\t});\n\t\treturn `${dateString} (${timeString})`;\n\t}\n\n\treturn dateString;\n};\n"],"names":["AnalyticsDropdown","options","placeholder","selected","onOptionSelected","resetDropdown","maxHeight","backgroundcolor","calendarPopperConfig","variant","datePickerPlacement","closeDropdown","labelColor","styleProps","showTimePicker","openCalender","setCalender","useState","selectedOption","setSelectedOption","selectedDate","setSelectedDate","showDropdown","setShowDropdown","optionPlaceholder","setOptionPlaceholder","dropdownRef","useRef","LabelText","Caption","BodySecondary","useEffect","setDropdown","forceState","prevState","handleClickOutside","event","jsx","Fragment","jsxs","MainDropdown","Dropdown","DEFAULT_THEME","formatDate","ReactDOM","toggleCalender","eachOption","index","EachItem","option","endDate","startDate","DatePicker","selectedStartDate","selectedEndDate","updatedDates","onClickingEachItem","rangeSelection","isLastItem","isFirstItem","ItemMenuContainer","BASE_COLORS","BodyCaption","dateVal","includeTime","dateString","timeString"],"mappings":"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"}
+{"version":3,"file":"AnalyticsDropdown.js","sources":["../../../../src/components/analytics-chips-and-dropdowns/AnalyticsDropdown.tsx"],"sourcesContent":["import 'bootstrap/dist/css/bootstrap.min.css';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { Dropdown } from 'react-bootstrap';\nimport { DropDirection } from 'react-bootstrap/esm/DropdownContext';\nimport ReactDOM from 'react-dom';\nimport { BASE_COLORS, DEFAULT_THEME } from '@src/constants/Theme';\nimport { DatePicker } from '../datePicker';\nimport { BodyCaption, BodySecondary, Caption } from '../TypographyStyle';\nimport { ItemMenuContainer, MainDropdown } from './CommonStyles';\n\nexport interface DropdownOptions {\n\tlabel: string;\n\tsubLabel?: string;\n\tvalue: string;\n\tkey: string | number;\n\tnoOfDays?: number;\n\tisCustom?: boolean;\n\tdateRangeSelectionOptions?: {\n\t\tselectRange: boolean;\n\t\tselectedDates?: Date[];\n\t\tselectedDate?: Date;\n\t\tminDate?: Date;\n\t\tmaxDate?: Date;\n\t};\n}\n\nexport interface AnalyticsDropdownInterface {\n\toptions: DropdownOptions[];\n\tselected?: DropdownOptions;\n\tplaceholder?: string;\n\tresetDropdown?: boolean;\n\tonOptionSelected: (\n\t\tchosen: DropdownOptions & {\n\t\t\tselectedRange?: [Date, Date];\n\t\t},\n\t) => void;\n\tmaxHeight?: string;\n\tbackgroundcolor?: string;\n\tcalendarPopperConfig?: {\n\t\toffsetSkid?: number;\n\t\toffsetDistance?: number;\n\t};\n\tvariant?: 'small' | 'default';\n\tdatePickerPlacement?: DropDirection;\n\tcloseDropdown?: boolean;\n\tlabelColor?: string;\n\tstyleProps?: React.CSSProperties;\n\tshowTimePicker?: boolean;\n}\n\nexport const AnalyticsDropdown: React.FC<AnalyticsDropdownInterface> = ({\n\toptions,\n\tplaceholder = 'Select an option',\n\tselected,\n\tonOptionSelected,\n\tresetDropdown,\n\tmaxHeight,\n\tbackgroundcolor,\n\tcalendarPopperConfig,\n\tvariant = 'default',\n\tdatePickerPlacement,\n\tcloseDropdown,\n\tlabelColor,\n\tstyleProps,\n\tshowTimePicker = false,\n}) => {\n\tconst [openCalender, setCalender] = useState(false);\n\tconst [selectedOption, setSelectedOption] = useState(selected);\n\tconst [selectedDate, setSelectedDate] = useState<Date[]>();\n\tconst [showDropdown, setShowDropdown] = useState(false);\n\tconst [optionPlaceholder, setOptionPlaceholder] = useState(selected);\n\tconst dropdownRef = useRef<HTMLDivElement | null>(null);\n\tconst LabelText = variant === 'small' ? Caption : BodySecondary;\n\n\tuseEffect(() => {\n\t\tresetDropdown && setSelectedOption(undefined);\n\t}, [resetDropdown]);\n\n\tuseEffect(() => {\n\t\tif (\n\t\t\tselected?.isCustom &&\n\t\t\tselected.dateRangeSelectionOptions?.selectedDates\n\t\t) {\n\t\t\tsetSelectedDate(selected.dateRangeSelectionOptions.selectedDates);\n\t\t} else {\n\t\t\tsetSelectedDate(undefined);\n\t\t}\n\t\tsetSelectedOption(selected);\n\t}, [selected]);\n\n\tuseEffect(() => {\n\t\tsetShowDropdown(false);\n\t\tsetCalender(false);\n\t}, [closeDropdown]);\n\n\tconst setDropdown = (forceState?: boolean) => {\n\t\tif (forceState !== undefined) {\n\t\t\tsetShowDropdown(forceState);\n\t\t\topenCalender && setCalender(false);\n\t\t} else {\n\t\t\tsetShowDropdown((prevState) => !prevState);\n\t\t}\n\t};\n\n\tconst handleClickOutside = (event: MouseEvent) => {\n\t\tif (\n\t\t\tdropdownRef.current &&\n\t\t\t!dropdownRef.current.contains(event.target as Node)\n\t\t) {\n\t\t\tif (openCalender) {\n\t\t\t\tsetCalender(false);\n\t\t\t}\n\t\t\tsetDropdown(false);\n\t\t}\n\t};\n\n\tuseEffect(() => {\n\t\tif (showDropdown) {\n\t\t\tdocument.addEventListener('mousedown', handleClickOutside);\n\t\t}\n\t\treturn () => {\n\t\t\tdocument.removeEventListener('mousedown', handleClickOutside);\n\t\t};\n\t}, [showDropdown]);\n\n\treturn (\n\t\t<>\n\t\t\t<MainDropdown\n\t\t\t\tdrop={'down'}\n\t\t\t\tshow={showDropdown}\n\t\t\t\tonToggle={setDropdown}\n\t\t\t\tbgColor={backgroundcolor}\n\t\t\t\tid=\"analytic-dropdown\"\n\t\t\t>\n\t\t\t\t<Dropdown.Toggle\n\t\t\t\t\tid=\"dropdown-autoclose-outside\"\n\t\t\t\t\tclassName=\"main--dropdown\"\n\t\t\t\t\tstyle={\n\t\t\t\t\t\tvariant === 'small'\n\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\tgap: 6,\n\t\t\t\t\t\t\t\t\tpadding: '4px 8px',\n\t\t\t\t\t\t\t\t\tbackgroundColor: '#FAFAFA',\n\t\t\t\t\t\t\t\t\tborderRadius: 4,\n\t\t\t\t\t\t\t\t\tborder: `1px solid ${DEFAULT_THEME.colorsV2.stroke.primary}`,\n\t\t\t\t\t\t\t  }\n\t\t\t\t\t\t\t: styleProps\n\t\t\t\t\t\t\t? styleProps\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t<LabelText\n\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\tvariant === 'small' || labelColor\n\t\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\t\tcolor:\n\t\t\t\t\t\t\t\t\t\t\tlabelColor || DEFAULT_THEME.colorsV2.content.secondary,\n\t\t\t\t\t\t\t\t  }\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{selectedOption?.isCustom\n\t\t\t\t\t\t\t? selectedDate\n\t\t\t\t\t\t\t\t? formatDate(selectedDate[0], showTimePicker) ===\n\t\t\t\t\t\t\t\t  formatDate(selectedDate[1], showTimePicker)\n\t\t\t\t\t\t\t\t\t? `${formatDate(selectedDate[0], showTimePicker)}`\n\t\t\t\t\t\t\t\t\t: `${formatDate(\n\t\t\t\t\t\t\t\t\t\t\tselectedDate[0],\n\t\t\t\t\t\t\t\t\t\t\tshowTimePicker,\n\t\t\t\t\t\t\t\t\t  )} to ${formatDate(selectedDate[1], showTimePicker)}`\n\t\t\t\t\t\t\t\t: optionPlaceholder?.label\n\t\t\t\t\t\t\t\t? optionPlaceholder?.label\n\t\t\t\t\t\t\t\t: placeholder\n\t\t\t\t\t\t\t: selectedOption\n\t\t\t\t\t\t\t? selectedOption?.label\n\t\t\t\t\t\t\t: placeholder}\n\t\t\t\t\t</LabelText>\n\t\t\t\t</Dropdown.Toggle>\n\t\t\t\t{ReactDOM.createPortal(\n\t\t\t\t\t<Dropdown.Menu\n\t\t\t\t\t\tclassName=\"main--dropdown\"\n\t\t\t\t\t\tstyle={{ padding: 0 }}\n\t\t\t\t\t\tref={dropdownRef}\n\t\t\t\t\t>\n\t\t\t\t\t\t<MainDropdown\n\t\t\t\t\t\t\tdrop={datePickerPlacement ?? 'end'}\n\t\t\t\t\t\t\tid=\"sub--dropdown\"\n\t\t\t\t\t\t\tshow={openCalender}\n\t\t\t\t\t\t\tonToggle={(toggleCalender) => {\n\t\t\t\t\t\t\t\t!toggleCalender && setShowDropdown(false);\n\t\t\t\t\t\t\t\tsetCalender(!openCalender);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tmaxHeight: maxHeight ? maxHeight : 'auto',\n\t\t\t\t\t\t\t\t\toverflowY: 'scroll',\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{options.map((eachOption, index) => (\n\t\t\t\t\t\t\t\t\t<div key={eachOption?.key}>\n\t\t\t\t\t\t\t\t\t\t{eachOption?.isCustom ? (\n\t\t\t\t\t\t\t\t\t\t\t<Dropdown.Toggle className=\"sub--dropdown\">\n\t\t\t\t\t\t\t\t\t\t\t\t<EachItem\n\t\t\t\t\t\t\t\t\t\t\t\t\tisFirstItem={index === 0}\n\t\t\t\t\t\t\t\t\t\t\t\t\tisLastItem={index === options.length - 1}\n\t\t\t\t\t\t\t\t\t\t\t\t\teachOption={eachOption}\n\t\t\t\t\t\t\t\t\t\t\t\t\tselectedOption={selectedOption}\n\t\t\t\t\t\t\t\t\t\t\t\t\tselectedDate={selectedDate}\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClickingEachItem={(option) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetSelectedOption(option);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetCalender(true);\n\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\trangeSelection={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\teachOption?.dateRangeSelectionOptions?.selectRange\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? true\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: false\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\tshowTimePicker={showTimePicker}\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t</Dropdown.Toggle>\n\t\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t\t<EachItem\n\t\t\t\t\t\t\t\t\t\t\t\tisFirstItem={index === 0}\n\t\t\t\t\t\t\t\t\t\t\t\tisLastItem={index === options.length - 1}\n\t\t\t\t\t\t\t\t\t\t\t\teachOption={eachOption}\n\t\t\t\t\t\t\t\t\t\t\t\tselectedOption={selectedOption}\n\t\t\t\t\t\t\t\t\t\t\t\tselectedDate={selectedDate}\n\t\t\t\t\t\t\t\t\t\t\t\tonClickingEachItem={(option) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\tsetSelectedDate(undefined);\n\t\t\t\t\t\t\t\t\t\t\t\t\tsetSelectedOption(option);\n\t\t\t\t\t\t\t\t\t\t\t\t\tsetOptionPlaceholder(option);\n\t\t\t\t\t\t\t\t\t\t\t\t\tsetDropdown();\n\t\t\t\t\t\t\t\t\t\t\t\t\tif (!option.noOfDays) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonOptionSelected(option);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\tconst endDate = new Date();\n\t\t\t\t\t\t\t\t\t\t\t\t\tconst startDate = new Date();\n\t\t\t\t\t\t\t\t\t\t\t\t\tstartDate.setDate(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tendDate.getDate() - option.noOfDays,\n\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\tonOptionSelected({\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t...option,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tselectedRange: [startDate, endDate],\n\t\t\t\t\t\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\tshowTimePicker={showTimePicker}\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<Dropdown.Menu\n\t\t\t\t\t\t\t\tclassName=\"sub--dropdown\"\n\t\t\t\t\t\t\t\tpopperConfig={{\n\t\t\t\t\t\t\t\t\tmodifiers: [\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\tname: 'offset',\n\t\t\t\t\t\t\t\t\t\t\toptions: {\n\t\t\t\t\t\t\t\t\t\t\t\toffset: [\n\t\t\t\t\t\t\t\t\t\t\t\t\tcalendarPopperConfig?.offsetSkid || 0,\n\t\t\t\t\t\t\t\t\t\t\t\t\tcalendarPopperConfig?.offsetDistance || 0,\n\t\t\t\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<DatePicker\n\t\t\t\t\t\t\t\t\tselectRange={\n\t\t\t\t\t\t\t\t\t\tselectedOption?.dateRangeSelectionOptions?.selectRange ||\n\t\t\t\t\t\t\t\t\t\tfalse\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tshowTimePicker={showTimePicker}\n\t\t\t\t\t\t\t\t\tmaxDate={selectedOption?.dateRangeSelectionOptions?.maxDate}\n\t\t\t\t\t\t\t\t\tminDate={selectedOption?.dateRangeSelectionOptions?.minDate}\n\t\t\t\t\t\t\t\t\tselectedDates={selectedDate}\n\t\t\t\t\t\t\t\t\tonSelectRange={(selectedStartDate, selectedEndDate) => {\n\t\t\t\t\t\t\t\t\t\tconst updatedDates = [selectedStartDate, selectedEndDate];\n\n\t\t\t\t\t\t\t\t\t\tif (selectedOption?.dateRangeSelectionOptions) {\n\t\t\t\t\t\t\t\t\t\t\tselectedOption.dateRangeSelectionOptions.selectedDates =\n\t\t\t\t\t\t\t\t\t\t\t\tupdatedDates;\n\t\t\t\t\t\t\t\t\t\t\tonOptionSelected({\n\t\t\t\t\t\t\t\t\t\t\t\t...selectedOption,\n\t\t\t\t\t\t\t\t\t\t\t\tselectedRange: [selectedStartDate, selectedEndDate],\n\t\t\t\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tsetOptionPlaceholder(selectedOption);\n\t\t\t\t\t\t\t\t\t\tsetCalender(false);\n\t\t\t\t\t\t\t\t\t\tsetSelectedDate(updatedDates);\n\t\t\t\t\t\t\t\t\t\tsetShowDropdown(!showDropdown);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonSelectDate={(selectedDate) => {\n\t\t\t\t\t\t\t\t\t\tif (selectedOption?.dateRangeSelectionOptions) {\n\t\t\t\t\t\t\t\t\t\t\tselectedOption.dateRangeSelectionOptions.selectedDates = [\n\t\t\t\t\t\t\t\t\t\t\t\tselectedDate,\n\t\t\t\t\t\t\t\t\t\t\t\tselectedDate,\n\t\t\t\t\t\t\t\t\t\t\t];\n\t\t\t\t\t\t\t\t\t\t\tonOptionSelected({\n\t\t\t\t\t\t\t\t\t\t\t\t...selectedOption,\n\t\t\t\t\t\t\t\t\t\t\t\tselectedRange: [selectedDate, selectedDate],\n\t\t\t\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tsetOptionPlaceholder(selectedOption);\n\t\t\t\t\t\t\t\t\t\tsetCalender(false);\n\t\t\t\t\t\t\t\t\t\tsetSelectedDate([selectedDate, selectedDate]);\n\t\t\t\t\t\t\t\t\t\tsetShowDropdown(!showDropdown);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</Dropdown.Menu>\n\t\t\t\t\t\t</MainDropdown>\n\t\t\t\t\t</Dropdown.Menu>,\n\t\t\t\t\tdocument.body,\n\t\t\t\t)}\n\t\t\t</MainDropdown>\n\t\t</>\n\t);\n};\n\nexport const EachItem: React.FC<{\n\teachOption: DropdownOptions;\n\tselectedOption: DropdownOptions | undefined;\n\tselectedDate: Date[] | undefined;\n\tonClickingEachItem: (optionSelected: DropdownOptions) => void;\n\trangeSelection?: boolean;\n\tisLastItem?: boolean;\n\tisFirstItem?: boolean;\n\tshowTimePicker?: boolean;\n}> = ({\n\teachOption,\n\tselectedOption,\n\tselectedDate,\n\tonClickingEachItem,\n\trangeSelection,\n\tisLastItem,\n\tisFirstItem,\n\tshowTimePicker,\n}) => {\n\treturn (\n\t\t<ItemMenuContainer\n\t\t\tisFirstItem={isFirstItem}\n\t\t\tisLastItem={isLastItem}\n\t\t\tkey={eachOption.key}\n\t\t\tonClick={() => onClickingEachItem(eachOption)}\n\t\t\tisSelected={\n\t\t\t\teachOption.isCustom\n\t\t\t\t\t? eachOption.key == selectedOption?.key && !!selectedDate\n\t\t\t\t\t: eachOption.key == selectedOption?.key\n\t\t\t}\n\t\t>\n\t\t\t<BodySecondary\n\t\t\t\tcolor={\n\t\t\t\t\teachOption.key == selectedOption?.key\n\t\t\t\t\t\t? BASE_COLORS.positive[900]\n\t\t\t\t\t\t: BASE_COLORS.grayscale[900]\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t{eachOption.label}\n\t\t\t</BodySecondary>\n\t\t\t{eachOption.subLabel ? (\n\t\t\t\t<BodyCaption style={{ color: BASE_COLORS.grayscale[700] }}>\n\t\t\t\t\t{eachOption.subLabel}\n\t\t\t\t</BodyCaption>\n\t\t\t) : (\n\t\t\t\t<></>\n\t\t\t)}\n\t\t\t{selectedDate &&\n\t\t\t\tselectedOption?.isCustom &&\n\t\t\t\teachOption.key == selectedOption?.key && (\n\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\twhiteSpace: 'normal',\n\t\t\t\t\t\t\twordBreak: 'break-word',\n\t\t\t\t\t\t\ttextAlign: 'left',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{rangeSelection\n\t\t\t\t\t\t\t? `${formatDate(selectedDate[0], showTimePicker)} to ${formatDate(\n\t\t\t\t\t\t\t\t\tselectedDate[1],\n\t\t\t\t\t\t\t\t\tshowTimePicker,\n\t\t\t\t\t\t\t  )}`\n\t\t\t\t\t\t\t: `${formatDate(selectedDate[0], showTimePicker)}`}\n\t\t\t\t\t</BodyCaption>\n\t\t\t\t)}\n\t\t</ItemMenuContainer>\n\t);\n};\n\nexport const formatDate = (dateVal: Date, includeTime?: boolean) => {\n\tconst dateString = dateVal.toLocaleString('default', {\n\t\tday: 'numeric',\n\t\tmonth: 'short',\n\t\tyear: 'numeric',\n\t});\n\n\tif (includeTime) {\n\t\tconst timeString = dateVal.toLocaleString('default', {\n\t\t\thour: 'numeric',\n\t\t\tminute: '2-digit',\n\t\t\thour12: true,\n\t\t});\n\t\treturn `${dateString} (${timeString})`;\n\t}\n\n\treturn dateString;\n};\n"],"names":["AnalyticsDropdown","options","placeholder","selected","onOptionSelected","resetDropdown","maxHeight","backgroundcolor","calendarPopperConfig","variant","datePickerPlacement","closeDropdown","labelColor","styleProps","showTimePicker","openCalender","setCalender","useState","selectedOption","setSelectedOption","selectedDate","setSelectedDate","showDropdown","setShowDropdown","optionPlaceholder","setOptionPlaceholder","dropdownRef","useRef","LabelText","Caption","BodySecondary","useEffect","setDropdown","forceState","prevState","handleClickOutside","event","jsx","Fragment","jsxs","MainDropdown","Dropdown","DEFAULT_THEME","formatDate","ReactDOM","toggleCalender","eachOption","index","EachItem","option","endDate","startDate","DatePicker","selectedStartDate","selectedEndDate","updatedDates","onClickingEachItem","rangeSelection","isLastItem","isFirstItem","ItemMenuContainer","BASE_COLORS","BodyCaption","dateVal","includeTime","dateString","timeString"],"mappings":"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"}

package/dist/esm/components/carousel-preview/CarouselPreview.js

@@ -1,9 +1,7 @@
-import { jsx as r, jsxs as x } from "react/jsx-runtime";
+import { jsx as e, jsxs as x } from "react/jsx-runtime";
 import I from "../../assets/icons/aiContentIcon.svg.js";
 import S from "react";
 import A from "react-slick";
-import "slick-carousel/slick/slick-theme.css";
-import "slick-carousel/slick/slick.css";
 import { Container as T, CarouselSlickContainer as R } from "./CarouselPreview.style.js";
 import w from "./CarouselPreviewCard.js";
 import { AiContentBadge as v } from "../template-preview/TemplatePreview.styled.js";
@@ -11,10 +9,10 @@ import { useTemplateModalContext as M } from "../template-context-mapper/context
 import { determineCardIndex as j, isRCSChannel as y } from "../template-preview/helpers/templateMiscHelper.js";
 import { RCSCarousalContainer as L } from "../template-preview/RCS/RCSPreview.styled.js";
 import { CustomCarouselLeftArrow as _, CustomCarouselRightArrow as k } from "./CustomCarouselArrows.js";
-const P = S.forwardRef(
+const K = S.forwardRef(
   ({
     channel: t,
-    template: e,
+    template: r,
     isPreview: s,
     removeBottomBorder: c,
     borderRadius: o,
@@ -29,7 +27,7 @@ const P = S.forwardRef(
       setIsCarouselHovered: C,
       cardIndex: n,
       showVariablePicker: p
-    } = M(), g = n == -1 ? j(t) : n, f = e?.components?.[g]?.cards, h = f?.length ? /* @__PURE__ */ r(
+    } = M(), g = n == -1 ? j(t) : n, f = r?.components?.[g]?.cards, h = f?.length ? /* @__PURE__ */ e(
       B,
       {
         cards: f,
@@ -39,25 +37,25 @@ const P = S.forwardRef(
         isPreview: s,
         showArrows: l,
         channel: t,
-        template: e,
+        template: r,
         setIsCarouselHovered: C,
         showSampleValues: !!a,
         showVariablePicker: p
       }
     ) : null;
-    return y(t) ? /* @__PURE__ */ r(L, { borderRadius: o, children: h }) : /* @__PURE__ */ x(
+    return y(t) ? /* @__PURE__ */ e(L, { borderRadius: o, children: h }) : /* @__PURE__ */ x(
       T,
       {
         removeBottomBorder: c,
         borderRadius: o,
         hideBorder: u,
         children: [
-          (!!e?.aiContentConfigId || !!e?.isAiGenerated) && /* @__PURE__ */ r(v, { children: /* @__PURE__ */ r(I, { width: 48, height: 48 }) }),
-          /* @__PURE__ */ r(
+          (!!r?.aiContentConfigId || !!r?.isAiGenerated) && /* @__PURE__ */ e(v, { children: /* @__PURE__ */ e(I, { width: 48, height: 48 }) }),
+          /* @__PURE__ */ e(
             w,
             {
               channel: t,
-              currentTemplate: e,
+              currentTemplate: r,
               carouselCardIndex: -1,
               isPreview: s,
               width: "77%"
@@ -70,7 +68,7 @@ const P = S.forwardRef(
   }
 ), B = ({
   cards: t,
-  cardCount: e,
+  cardCount: r,
   selectedCarouselIndex: s,
   sliderRef: c,
   isPreview: o,
@@ -80,14 +78,14 @@ const P = S.forwardRef(
   setIsCarouselHovered: i,
   showSampleValues: m,
   showVariablePicker: d
-}) => /* @__PURE__ */ r(
+}) => /* @__PURE__ */ e(
   R,
   {
-    cardCount: e,
+    cardCount: r,
     selectedCarouselIndex: s,
     onMouseEnter: () => !d && i?.(!0),
     onMouseLeave: () => !d && i?.(!1),
-    children: /* @__PURE__ */ r(
+    children: /* @__PURE__ */ e(
       A,
       {
         ref: c,
@@ -99,8 +97,8 @@ const P = S.forwardRef(
         centerMode: !0,
         arrows: l,
         adaptiveHeight: !0,
-        nextArrow: /* @__PURE__ */ r(k, { isPreview: o ?? !1 }),
-        prevArrow: /* @__PURE__ */ r(_, { isPreview: o ?? !1 }),
+        nextArrow: /* @__PURE__ */ e(k, { isPreview: o ?? !1 }),
+        prevArrow: /* @__PURE__ */ e(_, { isPreview: o ?? !1 }),
         children: t?.map((C, n) => {
           const p = {
             components: C.components,
@@ -108,7 +106,7 @@ const P = S.forwardRef(
             content: a?.content,
             templateType: a?.templateType
           };
-          return /* @__PURE__ */ r(
+          return /* @__PURE__ */ e(
             w,
             {
               channel: u,
@@ -126,6 +124,6 @@ const P = S.forwardRef(
   }
 );
 export {
-  P as CarouselPreview
+  K as CarouselPreview
 };
 //# sourceMappingURL=CarouselPreview.js.map

package/dist/esm/components/carousel-preview/CarouselPreview.js.map

@@ -1 +1 @@
-{"version":3,"file":"CarouselPreview.js","sources":["../../../../src/components/carousel-preview/CarouselPreview.tsx"],"sourcesContent":["/* eslint-disable react/display-name */\nimport AiContentIcon from '@src/assets/icons/aiContentIcon.svg';\nimport React from 'react';\nimport Slider from 'react-slick';\nimport 'slick-carousel/slick/slick-theme.css';\nimport 'slick-carousel/slick/slick.css';\nimport {\n\tCarouselSlickContainer,\n\tContainer,\n} from '@src/components/carousel-preview/CarouselPreview.style';\nimport CarouselPreviewCard from '@src/components/carousel-preview/CarouselPreviewCard';\nimport { CHANNEL_TYPE } from '@src/components/template-preview/models/Channels';\nimport {\n\tWhatsAppCarouselTemplate,\n\tWhatsAppCarouselTemplateCards,\n} from '@src/components/template-preview/models/WhatsappCarouselTemplate';\nimport { AiContentBadge } from '@src/components/template-preview/TemplatePreview.styled';\nimport { useTemplateModalContext } from '../template-context-mapper/context/templateModalContext';\nimport {\n\tdetermineCardIndex,\n\tisRCSChannel,\n} from '../template-preview/helpers/templateMiscHelper';\nimport { AllTemplateTypes } from '../template-preview/models/types';\nimport { RCSCarousalContainer } from '../template-preview/RCS/RCSPreview.styled';\nimport {\n\tCustomCarouselLeftArrow,\n\tCustomCarouselRightArrow,\n} from './CustomCarouselArrows';\n\nexport const CarouselPreview = React.forwardRef<\n\tHTMLDivElement,\n\t{\n\t\tchannel: CHANNEL_TYPE;\n\t\ttemplate: AllTemplateTypes;\n\t\tshowSampleValues?: boolean;\n\t\tisPreview?: boolean;\n\t\tremoveBottomBorder?: boolean;\n\t\tborderRadius?: string;\n\t\tshowArrows?: boolean;\n\t\thideBorder?: boolean;\n\t}\n>(\n\t({\n\t\tchannel,\n\t\ttemplate,\n\t\tisPreview,\n\t\tremoveBottomBorder,\n\t\tborderRadius,\n\t\tshowArrows,\n\t\thideBorder,\n\t\tshowSampleValues,\n\t}) => {\n\t\tconst {\n\t\t\tsliderRef,\n\t\t\tselectedCarouselIndex,\n\t\t\tcardCount,\n\t\t\tsetIsCarouselHovered,\n\t\t\tcardIndex: cardsIndex,\n\t\t\tshowVariablePicker,\n\t\t} = useTemplateModalContext();\n\n\t\tconst cardIndex =\n\t\t\tcardsIndex == -1 ? determineCardIndex(channel) : cardsIndex;\n\t\tconst cards = (template as WhatsAppCarouselTemplate)?.components?.[\n\t\t\tcardIndex\n\t\t]?.cards;\n\n\t\tconst carouselSlider = cards?.length ? (\n\t\t\t<CarouselSlider\n\t\t\t\tcards={cards}\n\t\t\t\tcardCount={cardCount ?? 0}\n\t\t\t\tselectedCarouselIndex={selectedCarouselIndex ?? -1}\n\t\t\t\tsliderRef={sliderRef}\n\t\t\t\tisPreview={isPreview}\n\t\t\t\tshowArrows={showArrows}\n\t\t\t\tchannel={channel}\n\t\t\t\ttemplate={template as WhatsAppCarouselTemplate}\n\t\t\t\tsetIsCarouselHovered={setIsCarouselHovered}\n\t\t\t\tshowSampleValues={!!showSampleValues}\n\t\t\t\tshowVariablePicker={showVariablePicker}\n\t\t\t/>\n\t\t) : null;\n\n\t\tif (isRCSChannel(channel)) {\n\t\t\treturn (\n\t\t\t\t<RCSCarousalContainer borderRadius={borderRadius}>\n\t\t\t\t\t{carouselSlider}\n\t\t\t\t</RCSCarousalContainer>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<Container\n\t\t\t\tremoveBottomBorder={removeBottomBorder}\n\t\t\t\tborderRadius={borderRadius}\n\t\t\t\thideBorder={hideBorder}\n\t\t\t>\n\t\t\t\t{(!!template?.['aiContentConfigId'] ||\n\t\t\t\t\t!!template?.['isAiGenerated']) && (\n\t\t\t\t\t<AiContentBadge>\n\t\t\t\t\t\t<AiContentIcon width={48} height={48} />\n\t\t\t\t\t</AiContentBadge>\n\t\t\t\t)}\n\t\t\t\t<CarouselPreviewCard\n\t\t\t\t\tchannel={channel}\n\t\t\t\t\tcurrentTemplate={template}\n\t\t\t\t\tcarouselCardIndex={-1}\n\t\t\t\t\tisPreview={isPreview}\n\t\t\t\t\twidth=\"77%\"\n\t\t\t\t/>\n\t\t\t\t{carouselSlider}\n\t\t\t</Container>\n\t\t);\n\t},\n);\n\nconst CarouselSlider = ({\n\tcards,\n\tcardCount,\n\tselectedCarouselIndex,\n\tsliderRef,\n\tisPreview,\n\tshowArrows,\n\tchannel,\n\ttemplate,\n\tsetIsCarouselHovered,\n\tshowSampleValues,\n\tshowVariablePicker,\n}: {\n\tcards: WhatsAppCarouselTemplateCards[];\n\tcardCount: number;\n\tselectedCarouselIndex: number;\n\tsliderRef: any;\n\tisPreview?: boolean;\n\tshowArrows?: boolean;\n\tchannel: CHANNEL_TYPE;\n\ttemplate: WhatsAppCarouselTemplate;\n\tsetIsCarouselHovered?: (value: boolean) => void;\n\tshowSampleValues?: boolean;\n\tshowVariablePicker?: boolean;\n}) => (\n\t<CarouselSlickContainer\n\t\tcardCount={cardCount}\n\t\tselectedCarouselIndex={selectedCarouselIndex}\n\t\tonMouseEnter={() => !showVariablePicker && setIsCarouselHovered?.(true)}\n\t\tonMouseLeave={() => !showVariablePicker && setIsCarouselHovered?.(false)}\n\t>\n\t\t<Slider\n\t\t\tref={sliderRef}\n\t\t\tswipeToSlide\n\t\t\tdraggable\n\t\t\tswipe\n\t\t\tinfinite={false}\n\t\t\tfocusOnSelect={!isPreview}\n\t\t\tcenterMode\n\t\t\tarrows={showArrows}\n\t\t\tadaptiveHeight\n\t\t\tnextArrow={<CustomCarouselRightArrow isPreview={isPreview ?? false} />}\n\t\t\tprevArrow={<CustomCarouselLeftArrow isPreview={isPreview ?? false} />}\n\t\t>\n\t\t\t{cards?.map((carousel, index) => {\n\t\t\t\tconst currentCarousel = {\n\t\t\t\t\tcomponents: carousel.components,\n\t\t\t\t\tmapping: template?.mapping?.cards?.[index],\n\t\t\t\t\tcontent: template?.['content'],\n\t\t\t\t\ttemplateType: template?.['templateType'],\n\t\t\t\t};\n\t\t\t\treturn (\n\t\t\t\t\t<CarouselPreviewCard\n\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\tchannel={channel}\n\t\t\t\t\t\tcurrentTemplate={currentCarousel}\n\t\t\t\t\t\tcarouselCardIndex={index}\n\t\t\t\t\t\tisPreview={isPreview}\n\t\t\t\t\t\twidth=\"100%\"\n\t\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t})}\n\t\t</Slider>\n\t</CarouselSlickContainer>\n);\n"],"names":["CarouselPreview","React","channel","template","isPreview","removeBottomBorder","borderRadius","showArrows","hideBorder","showSampleValues","sliderRef","selectedCarouselIndex","cardCount","setIsCarouselHovered","cardsIndex","showVariablePicker","useTemplateModalContext","cardIndex","determineCardIndex","cards","carouselSlider","jsx","CarouselSlider","isRCSChannel","RCSCarousalContainer","jsxs","Container","AiContentBadge","AiContentIcon","CarouselPreviewCard","CarouselSlickContainer","Slider","CustomCarouselRightArrow","CustomCarouselLeftArrow","carousel","index","currentCarousel"],"mappings":"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"}
+{"version":3,"file":"CarouselPreview.js","sources":["../../../../src/components/carousel-preview/CarouselPreview.tsx"],"sourcesContent":["/* eslint-disable react/display-name */\nimport AiContentIcon from '@src/assets/icons/aiContentIcon.svg';\nimport React from 'react';\nimport Slider from 'react-slick';\nimport 'slick-carousel/slick/slick-theme.css';\nimport 'slick-carousel/slick/slick.css';\nimport {\n\tCarouselSlickContainer,\n\tContainer,\n} from '@src/components/carousel-preview/CarouselPreview.style';\nimport CarouselPreviewCard from '@src/components/carousel-preview/CarouselPreviewCard';\nimport { CHANNEL_TYPE } from '@src/components/template-preview/models/Channels';\nimport {\n\tWhatsAppCarouselTemplate,\n\tWhatsAppCarouselTemplateCards,\n} from '@src/components/template-preview/models/WhatsappCarouselTemplate';\nimport { AiContentBadge } from '@src/components/template-preview/TemplatePreview.styled';\nimport { useTemplateModalContext } from '../template-context-mapper/context/templateModalContext';\nimport {\n\tdetermineCardIndex,\n\tisRCSChannel,\n} from '../template-preview/helpers/templateMiscHelper';\nimport { AllTemplateTypes } from '../template-preview/models/types';\nimport { RCSCarousalContainer } from '../template-preview/RCS/RCSPreview.styled';\nimport {\n\tCustomCarouselLeftArrow,\n\tCustomCarouselRightArrow,\n} from './CustomCarouselArrows';\n\nexport const CarouselPreview = React.forwardRef<\n\tHTMLDivElement,\n\t{\n\t\tchannel: CHANNEL_TYPE;\n\t\ttemplate: AllTemplateTypes;\n\t\tshowSampleValues?: boolean;\n\t\tisPreview?: boolean;\n\t\tremoveBottomBorder?: boolean;\n\t\tborderRadius?: string;\n\t\tshowArrows?: boolean;\n\t\thideBorder?: boolean;\n\t}\n>(\n\t({\n\t\tchannel,\n\t\ttemplate,\n\t\tisPreview,\n\t\tremoveBottomBorder,\n\t\tborderRadius,\n\t\tshowArrows,\n\t\thideBorder,\n\t\tshowSampleValues,\n\t}) => {\n\t\tconst {\n\t\t\tsliderRef,\n\t\t\tselectedCarouselIndex,\n\t\t\tcardCount,\n\t\t\tsetIsCarouselHovered,\n\t\t\tcardIndex: cardsIndex,\n\t\t\tshowVariablePicker,\n\t\t} = useTemplateModalContext();\n\n\t\tconst cardIndex =\n\t\t\tcardsIndex == -1 ? determineCardIndex(channel) : cardsIndex;\n\t\tconst cards = (template as WhatsAppCarouselTemplate)?.components?.[\n\t\t\tcardIndex\n\t\t]?.cards;\n\n\t\tconst carouselSlider = cards?.length ? (\n\t\t\t<CarouselSlider\n\t\t\t\tcards={cards}\n\t\t\t\tcardCount={cardCount ?? 0}\n\t\t\t\tselectedCarouselIndex={selectedCarouselIndex ?? -1}\n\t\t\t\tsliderRef={sliderRef}\n\t\t\t\tisPreview={isPreview}\n\t\t\t\tshowArrows={showArrows}\n\t\t\t\tchannel={channel}\n\t\t\t\ttemplate={template as WhatsAppCarouselTemplate}\n\t\t\t\tsetIsCarouselHovered={setIsCarouselHovered}\n\t\t\t\tshowSampleValues={!!showSampleValues}\n\t\t\t\tshowVariablePicker={showVariablePicker}\n\t\t\t/>\n\t\t) : null;\n\n\t\tif (isRCSChannel(channel)) {\n\t\t\treturn (\n\t\t\t\t<RCSCarousalContainer borderRadius={borderRadius}>\n\t\t\t\t\t{carouselSlider}\n\t\t\t\t</RCSCarousalContainer>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<Container\n\t\t\t\tremoveBottomBorder={removeBottomBorder}\n\t\t\t\tborderRadius={borderRadius}\n\t\t\t\thideBorder={hideBorder}\n\t\t\t>\n\t\t\t\t{(!!template?.['aiContentConfigId'] ||\n\t\t\t\t\t!!template?.['isAiGenerated']) && (\n\t\t\t\t\t<AiContentBadge>\n\t\t\t\t\t\t<AiContentIcon width={48} height={48} />\n\t\t\t\t\t</AiContentBadge>\n\t\t\t\t)}\n\t\t\t\t<CarouselPreviewCard\n\t\t\t\t\tchannel={channel}\n\t\t\t\t\tcurrentTemplate={template}\n\t\t\t\t\tcarouselCardIndex={-1}\n\t\t\t\t\tisPreview={isPreview}\n\t\t\t\t\twidth=\"77%\"\n\t\t\t\t/>\n\t\t\t\t{carouselSlider}\n\t\t\t</Container>\n\t\t);\n\t},\n);\n\nconst CarouselSlider = ({\n\tcards,\n\tcardCount,\n\tselectedCarouselIndex,\n\tsliderRef,\n\tisPreview,\n\tshowArrows,\n\tchannel,\n\ttemplate,\n\tsetIsCarouselHovered,\n\tshowSampleValues,\n\tshowVariablePicker,\n}: {\n\tcards: WhatsAppCarouselTemplateCards[];\n\tcardCount: number;\n\tselectedCarouselIndex: number;\n\tsliderRef: any;\n\tisPreview?: boolean;\n\tshowArrows?: boolean;\n\tchannel: CHANNEL_TYPE;\n\ttemplate: WhatsAppCarouselTemplate;\n\tsetIsCarouselHovered?: (value: boolean) => void;\n\tshowSampleValues?: boolean;\n\tshowVariablePicker?: boolean;\n}) => (\n\t<CarouselSlickContainer\n\t\tcardCount={cardCount}\n\t\tselectedCarouselIndex={selectedCarouselIndex}\n\t\tonMouseEnter={() => !showVariablePicker && setIsCarouselHovered?.(true)}\n\t\tonMouseLeave={() => !showVariablePicker && setIsCarouselHovered?.(false)}\n\t>\n\t\t<Slider\n\t\t\tref={sliderRef}\n\t\t\tswipeToSlide\n\t\t\tdraggable\n\t\t\tswipe\n\t\t\tinfinite={false}\n\t\t\tfocusOnSelect={!isPreview}\n\t\t\tcenterMode\n\t\t\tarrows={showArrows}\n\t\t\tadaptiveHeight\n\t\t\tnextArrow={<CustomCarouselRightArrow isPreview={isPreview ?? false} />}\n\t\t\tprevArrow={<CustomCarouselLeftArrow isPreview={isPreview ?? false} />}\n\t\t>\n\t\t\t{cards?.map((carousel, index) => {\n\t\t\t\tconst currentCarousel = {\n\t\t\t\t\tcomponents: carousel.components,\n\t\t\t\t\tmapping: template?.mapping?.cards?.[index],\n\t\t\t\t\tcontent: template?.['content'],\n\t\t\t\t\ttemplateType: template?.['templateType'],\n\t\t\t\t};\n\t\t\t\treturn (\n\t\t\t\t\t<CarouselPreviewCard\n\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\tchannel={channel}\n\t\t\t\t\t\tcurrentTemplate={currentCarousel}\n\t\t\t\t\t\tcarouselCardIndex={index}\n\t\t\t\t\t\tisPreview={isPreview}\n\t\t\t\t\t\twidth=\"100%\"\n\t\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t})}\n\t\t</Slider>\n\t</CarouselSlickContainer>\n);\n"],"names":["CarouselPreview","React","channel","template","isPreview","removeBottomBorder","borderRadius","showArrows","hideBorder","showSampleValues","sliderRef","selectedCarouselIndex","cardCount","setIsCarouselHovered","cardsIndex","showVariablePicker","useTemplateModalContext","cardIndex","determineCardIndex","cards","carouselSlider","jsx","CarouselSlider","isRCSChannel","RCSCarousalContainer","jsxs","Container","AiContentBadge","AiContentIcon","CarouselPreviewCard","CarouselSlickContainer","Slider","CustomCarouselRightArrow","CustomCarouselLeftArrow","carousel","index","currentCarousel"],"mappings":"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"}

package/dist/esm/components/floating-action-button/FloatingActionButton.js

@@ -1,5 +1,4 @@
 import { jsx as o, Fragment as m, jsxs as A } from "react/jsx-runtime";
-import "bootstrap/dist/css/bootstrap.min.css";
 import { useState as F } from "react";
 import { Dropdown as N } from "react-bootstrap";
 import { COLORS as w } from "../../constants/Theme.js";
@@ -9,15 +8,15 @@ import { FAB_POSITION as y, DROP_POSITION as b, MENU_ALIGNMENT as k, FloatingAct
 import { Tooltip as _ } from "../tooltips/Tooltip.js";
 const f = (h) => {
   const {
-    width: n,
-    height: r,
-    color: e,
+    width: i,
+    height: e,
+    color: r,
     onClick: l,
     icon: t,
     tooltipPlacement: d,
     tooltipText: c,
     tootipWidth: p,
-    isRound: i
+    isRound: n
   } = h;
   return c ? /* @__PURE__ */ o(
     _,
@@ -28,11 +27,11 @@ const f = (h) => {
       children: /* @__PURE__ */ o(
         O,
         {
-          width: n,
-          height: r,
-          color: e,
+          width: i,
+          height: e,
+          color: r,
           onClick: l,
-          isRound: i,
+          isRound: n,
           children: t || /* @__PURE__ */ o(T, { width: 22, height: 22 })
         }
       )
@@ -40,25 +39,25 @@ const f = (h) => {
   ) : /* @__PURE__ */ o(m, { children: /* @__PURE__ */ o(
     O,
     {
-      width: n,
-      height: r,
-      color: e,
+      width: i,
+      height: e,
+      color: r,
       onClick: l,
-      isRound: i,
+      isRound: n,
       children: t || /* @__PURE__ */ o(T, { width: 22, height: 22 })
     }
   ) });
-}, X = (h) => {
+}, V = (h) => {
   const {
-    icon: n,
-    onClick: r,
-    children: e,
+    icon: i,
+    onClick: e,
+    children: r,
     tooltipText: l,
     isRound: t = !0,
     width: d = 48,
     height: c = 48,
     color: p = w.background.inverse,
-    position: i = y.TOP_LEFT,
+    position: n = y.TOP_LEFT,
     buttonPaddingHorizontal: P = 20,
     buttonPaddingVertical: C = 20,
     zIndex: D = 1,
@@ -73,7 +72,7 @@ const f = (h) => {
       width: d,
       height: c,
       color: p,
-      position: i,
+      position: n,
       buttonPaddingHorizontal: P,
       buttonPaddingVertical: C,
       zIndex: D,
@@ -85,7 +84,7 @@ const f = (h) => {
           },
           drop: g,
           align: I,
-          children: e ? /* @__PURE__ */ A(m, { children: [
+          children: r ? /* @__PURE__ */ A(m, { children: [
             /* @__PURE__ */ o(R, { drop: g, children: /* @__PURE__ */ o(
               f,
               {
@@ -93,16 +92,16 @@ const f = (h) => {
                 height: c,
                 color: p,
                 tooltipPlacement: a,
-                onClick: r,
+                onClick: e,
                 tooltipText: l,
-                icon: n,
-                position: i,
+                icon: i,
+                position: n,
                 isRound: t,
                 isDropdownOpen: u,
                 tootipWidth: s
               }
             ) }),
-            /* @__PURE__ */ o(N.Menu, { children: e })
+            /* @__PURE__ */ o(N.Menu, { children: r })
           ] }) : /* @__PURE__ */ o(
             f,
             {
@@ -110,10 +109,10 @@ const f = (h) => {
               height: c,
               color: p,
               tooltipPlacement: a,
-              onClick: r,
+              onClick: e,
               tooltipText: l,
-              icon: n,
-              position: i,
+              icon: i,
+              position: n,
               isRound: t,
               isDropdownOpen: u,
               tootipWidth: s
@@ -125,6 +124,6 @@ const f = (h) => {
   ) });
 };
 export {
-  X as FloatingActionButton
+  V as FloatingActionButton
 };
 //# sourceMappingURL=FloatingActionButton.js.map

package/dist/esm/components/floating-action-button/FloatingActionButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"FloatingActionButton.js","sources":["../../../../src/components/floating-action-button/FloatingActionButton.tsx"],"sourcesContent":["import 'bootstrap/dist/css/bootstrap.min.css';\nimport React, { useState } from 'react';\nimport { Dropdown } from 'react-bootstrap';\nimport { COLORS } from '@src/constants/Theme';\nimport { Placement, Tooltip } from '../tooltips';\nimport { BodyCaption } from '../TypographyStyle';\nimport DefaultIcon from './../../assets/icons/question-mark.svg';\nimport {\n\tDROP_POSITION,\n\tDropdownToggleContainer,\n\tFAB_POSITION,\n\tFloatingActionButtonContainer,\n\tFloatingActionButtonOuterContainer,\n\tMENU_ALIGNMENT,\n\tStyledDropdown,\n\tTooltipStyled,\n} from './FloatingActionButton.styles';\n\nconst FloatingActionToggleButtonJSX: React.FC<{\n\tonClick?: () => void;\n\tchildren?: React.ReactNode;\n\twidth: number;\n\theight: number;\n\ticon?: JSX.Element;\n\tcolor: string;\n\tposition?: FAB_POSITION;\n\ttooltipText?: string;\n\ttootipWidth?: number;\n\ttooltipPlacement: Placement;\n\tisRound: boolean;\n\tisDropdownOpen: boolean;\n}> = (props) => {\n\tconst {\n\t\twidth,\n\t\theight,\n\t\tcolor,\n\t\tonClick,\n\t\ticon,\n\t\ttooltipPlacement,\n\t\ttooltipText,\n\t\ttootipWidth,\n\t\tisRound,\n\t} = props;\n\treturn tooltipText ? (\n\t\t<Tooltip\n\t\t\ttooltipContent={\n\t\t\t\t<TooltipStyled tooltipWidth={tootipWidth}>\n\t\t\t\t\t<BodyCaption color={COLORS.content.primaryInverse}>\n\t\t\t\t\t\t{props.tooltipText}\n\t\t\t\t\t</BodyCaption>\n\t\t\t\t</TooltipStyled>\n\t\t\t}\n\t\t\tplacement={tooltipPlacement}\n\t\t\tbody={''}\n\t\t>\n\t\t\t<FloatingActionButtonContainer\n\t\t\t\twidth={width}\n\t\t\t\theight={height}\n\t\t\t\tcolor={color}\n\t\t\t\tonClick={onClick}\n\t\t\t\tisRound={isRound}\n\t\t\t>\n\t\t\t\t{icon ? icon : <DefaultIcon width={22} height={22} />}\n\t\t\t</FloatingActionButtonContainer>\n\t\t</Tooltip>\n\t) : (\n\t\t<>\n\t\t\t<FloatingActionButtonContainer\n\t\t\t\twidth={width}\n\t\t\t\theight={height}\n\t\t\t\tcolor={color}\n\t\t\t\tonClick={onClick}\n\t\t\t\tisRound={isRound}\n\t\t\t>\n\t\t\t\t{icon ? icon : <DefaultIcon width={22} height={22} />}\n\t\t\t</FloatingActionButtonContainer>\n\t\t</>\n\t);\n};\nexport const FloatingActionButton: React.FC<{\n\tonClick?: () => void;\n\tchildren?: React.ReactNode;\n\twidth?: number;\n\theight?: number;\n\ticon?: JSX.Element;\n\tcolor?: string;\n\tposition?: FAB_POSITION;\n\tbuttonPaddingHorizontal?: number;\n\tbuttonPaddingVertical?: number;\n\ttooltipText?: string;\n\ttooltipPlacement?: Placement;\n\tzIndex?: number;\n\tisRound?: boolean;\n\tdropPosition?: DROP_POSITION;\n\tmenuAligment?: MENU_ALIGNMENT;\n\ttootipWidth?: number;\n}> = (props) => {\n\tconst {\n\t\ticon,\n\t\tonClick,\n\t\tchildren,\n\t\ttooltipText,\n\t\tisRound = true,\n\t\twidth = 48,\n\t\theight = 48,\n\t\tcolor = COLORS.background.inverse,\n\t\tposition = FAB_POSITION.TOP_LEFT,\n\t\tbuttonPaddingHorizontal = 20,\n\t\tbuttonPaddingVertical = 20,\n\t\tzIndex = 1,\n\t\ttooltipPlacement = 'right',\n\t\tdropPosition = DROP_POSITION.DOWN,\n\t\tmenuAligment = MENU_ALIGNMENT.END,\n\t\ttootipWidth,\n\t} = props;\n\tconst [isDropdownOpen, setIsDropdownOpen] = useState(false);\n\n\treturn (\n\t\t<>\n\t\t\t<FloatingActionButtonOuterContainer\n\t\t\t\twidth={width}\n\t\t\t\theight={height}\n\t\t\t\tcolor={color}\n\t\t\t\tposition={position}\n\t\t\t\tbuttonPaddingHorizontal={buttonPaddingHorizontal}\n\t\t\t\tbuttonPaddingVertical={buttonPaddingVertical}\n\t\t\t\tzIndex={zIndex}\n\t\t\t>\n\t\t\t\t<StyledDropdown\n\t\t\t\t\tonToggle={(nextShow: boolean, meta: any) => {\n\t\t\t\t\t\tsetIsDropdownOpen(nextShow);\n\t\t\t\t\t}}\n\t\t\t\t\tdrop={dropPosition}\n\t\t\t\t\talign={menuAligment}\n\t\t\t\t>\n\t\t\t\t\t{children ? (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<DropdownToggleContainer drop={dropPosition}>\n\t\t\t\t\t\t\t\t<FloatingActionToggleButtonJSX\n\t\t\t\t\t\t\t\t\twidth={width}\n\t\t\t\t\t\t\t\t\theight={height}\n\t\t\t\t\t\t\t\t\tcolor={color}\n\t\t\t\t\t\t\t\t\ttooltipPlacement={tooltipPlacement}\n\t\t\t\t\t\t\t\t\tonClick={onClick}\n\t\t\t\t\t\t\t\t\ttooltipText={tooltipText}\n\t\t\t\t\t\t\t\t\ticon={icon}\n\t\t\t\t\t\t\t\t\tposition={position}\n\t\t\t\t\t\t\t\t\tisRound={isRound}\n\t\t\t\t\t\t\t\t\tisDropdownOpen={isDropdownOpen}\n\t\t\t\t\t\t\t\t\ttootipWidth={tootipWidth}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</DropdownToggleContainer>\n\t\t\t\t\t\t\t<Dropdown.Menu>{children}</Dropdown.Menu>\n\t\t\t\t\t\t</>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<FloatingActionToggleButtonJSX\n\t\t\t\t\t\t\twidth={width}\n\t\t\t\t\t\t\theight={height}\n\t\t\t\t\t\t\tcolor={color}\n\t\t\t\t\t\t\ttooltipPlacement={tooltipPlacement}\n\t\t\t\t\t\t\tonClick={onClick}\n\t\t\t\t\t\t\ttooltipText={tooltipText}\n\t\t\t\t\t\t\ticon={icon}\n\t\t\t\t\t\t\tposition={position}\n\t\t\t\t\t\t\tisRound={isRound}\n\t\t\t\t\t\t\tisDropdownOpen={isDropdownOpen}\n\t\t\t\t\t\t\ttootipWidth={tootipWidth}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</StyledDropdown>\n\t\t\t</FloatingActionButtonOuterContainer>\n\t\t</>\n\t);\n};\n"],"names":["FloatingActionToggleButtonJSX","props","width","height","color","onClick","icon","tooltipPlacement","tooltipText","tootipWidth","isRound","jsx","Tooltip","TooltipStyled","BodyCaption","COLORS","FloatingActionButtonContainer","DefaultIcon","Fragment","FloatingActionButton","children","position","FAB_POSITION","buttonPaddingHorizontal","buttonPaddingVertical","zIndex","dropPosition","DROP_POSITION","menuAligment","MENU_ALIGNMENT","isDropdownOpen","setIsDropdownOpen","useState","FloatingActionButtonOuterContainer","StyledDropdown","nextShow","meta","jsxs","DropdownToggleContainer","Dropdown"],"mappings":";;;;;;;;;AAkBA,MAAMA,IAaD,CAACC,MAAU;AACf,QAAM;AAAA,IACL,OAAAC;AAAA,IACA,QAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC;AAAA,IACA,MAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,aAAAC;AAAA,IACA,SAAAC;AAAA,EAAA,IACGT;AACJ,SAAOO,IACN,gBAAAG;AAAA,IAACC;AAAA,IAAA;AAAA,MACA,gBACC,gBAAAD,EAACE,GAAA,EAAc,cAAcJ,GAC5B,UAAA,gBAAAE,EAACG,GAAA,EAAY,OAAOC,EAAO,QAAQ,gBACjC,UAAAd,EAAM,aACR,GACD;AAAA,MAED,WAAWM;AAAA,MACX,MAAM;AAAA,MAEN,UAAA,gBAAAI;AAAA,QAACK;AAAA,QAAA;AAAA,UACA,OAAAd;AAAA,UACA,QAAAC;AAAA,UACA,OAAAC;AAAA,UACA,SAAAC;AAAA,UACA,SAAAK;AAAA,UAEC,eAAc,gBAAAC,EAACM,KAAY,OAAO,IAAI,QAAQ,GAAA,CAAI;AAAA,QAAA;AAAA,MAAA;AAAA,IACpD;AAAA,EAAA,IAGD,gBAAAN,EAAAO,GAAA,EACC,UAAA,gBAAAP;AAAA,IAACK;AAAA,IAAA;AAAA,MACA,OAAAd;AAAA,MACA,QAAAC;AAAA,MACA,OAAAC;AAAA,MACA,SAAAC;AAAA,MACA,SAAAK;AAAA,MAEC,eAAc,gBAAAC,EAACM,KAAY,OAAO,IAAI,QAAQ,GAAA,CAAI;AAAA,IAAA;AAAA,EAAA,GAErD;AAEF,GACaE,IAiBR,CAAClB,MAAU;AACf,QAAM;AAAA,IACL,MAAAK;AAAA,IACA,SAAAD;AAAA,IACA,UAAAe;AAAA,IACA,aAAAZ;AAAA,IACA,SAAAE,IAAU;AAAA,IACV,OAAAR,IAAQ;AAAA,IACR,QAAAC,IAAS;AAAA,IACT,OAAAC,IAAQW,EAAO,WAAW;AAAA,IAC1B,UAAAM,IAAWC,EAAa;AAAA,IACxB,yBAAAC,IAA0B;AAAA,IAC1B,uBAAAC,IAAwB;AAAA,IACxB,QAAAC,IAAS;AAAA,IACT,kBAAAlB,IAAmB;AAAA,IACnB,cAAAmB,IAAeC,EAAc;AAAA,IAC7B,cAAAC,IAAeC,EAAe;AAAA,IAC9B,aAAApB;AAAA,EAAA,IACGR,GACE,CAAC6B,GAAgBC,CAAiB,IAAIC,EAAS,EAAK;AAE1D,SACC,gBAAArB,EAAAO,GAAA,EACC,UAAA,gBAAAP;AAAA,IAACsB;AAAA,IAAA;AAAA,MACA,OAAA/B;AAAA,MACA,QAAAC;AAAA,MACA,OAAAC;AAAA,MACA,UAAAiB;AAAA,MACA,yBAAAE;AAAA,MACA,uBAAAC;AAAA,MACA,QAAAC;AAAA,MAEA,UAAA,gBAAAd;AAAA,QAACuB;AAAA,QAAA;AAAA,UACA,UAAU,CAACC,GAAmBC,MAAc;AAC3C,YAAAL,EAAkBI,CAAQ;AAAA,UAC3B;AAAA,UACA,MAAMT;AAAA,UACN,OAAOE;AAAA,UAEN,cACA,gBAAAS,EAAAnB,GAAA,EACC,UAAA;AAAA,YAAA,gBAAAP,EAAC2B,GAAA,EAAwB,MAAMZ,GAC9B,UAAA,gBAAAf;AAAA,cAACX;AAAA,cAAA;AAAA,gBACA,OAAAE;AAAA,gBACA,QAAAC;AAAA,gBACA,OAAAC;AAAA,gBACA,kBAAAG;AAAA,gBACA,SAAAF;AAAA,gBACA,aAAAG;AAAA,gBACA,MAAAF;AAAA,gBACA,UAAAe;AAAA,gBACA,SAAAX;AAAA,gBACA,gBAAAoB;AAAA,gBACA,aAAArB;AAAA,cAAA;AAAA,YAAA,GAEF;AAAA,YACA,gBAAAE,EAAC4B,EAAS,MAAT,EAAe,UAAAnB,EAAA,CAAS;AAAA,UAAA,EAAA,CAC1B,IAEA,gBAAAT;AAAA,YAACX;AAAA,YAAA;AAAA,cACA,OAAAE;AAAA,cACA,QAAAC;AAAA,cACA,OAAAC;AAAA,cACA,kBAAAG;AAAA,cACA,SAAAF;AAAA,cACA,aAAAG;AAAA,cACA,MAAAF;AAAA,cACA,UAAAe;AAAA,cACA,SAAAX;AAAA,cACA,gBAAAoB;AAAA,cACA,aAAArB;AAAA,YAAA;AAAA,UAAA;AAAA,QACD;AAAA,MAAA;AAAA,IAEF;AAAA,EAAA,GAEF;AAEF;"}
+{"version":3,"file":"FloatingActionButton.js","sources":["../../../../src/components/floating-action-button/FloatingActionButton.tsx"],"sourcesContent":["import 'bootstrap/dist/css/bootstrap.min.css';\nimport React, { useState } from 'react';\nimport { Dropdown } from 'react-bootstrap';\nimport { COLORS } from '@src/constants/Theme';\nimport { Placement, Tooltip } from '../tooltips';\nimport { BodyCaption } from '../TypographyStyle';\nimport DefaultIcon from './../../assets/icons/question-mark.svg';\nimport {\n\tDROP_POSITION,\n\tDropdownToggleContainer,\n\tFAB_POSITION,\n\tFloatingActionButtonContainer,\n\tFloatingActionButtonOuterContainer,\n\tMENU_ALIGNMENT,\n\tStyledDropdown,\n\tTooltipStyled,\n} from './FloatingActionButton.styles';\n\nconst FloatingActionToggleButtonJSX: React.FC<{\n\tonClick?: () => void;\n\tchildren?: React.ReactNode;\n\twidth: number;\n\theight: number;\n\ticon?: JSX.Element;\n\tcolor: string;\n\tposition?: FAB_POSITION;\n\ttooltipText?: string;\n\ttootipWidth?: number;\n\ttooltipPlacement: Placement;\n\tisRound: boolean;\n\tisDropdownOpen: boolean;\n}> = (props) => {\n\tconst {\n\t\twidth,\n\t\theight,\n\t\tcolor,\n\t\tonClick,\n\t\ticon,\n\t\ttooltipPlacement,\n\t\ttooltipText,\n\t\ttootipWidth,\n\t\tisRound,\n\t} = props;\n\treturn tooltipText ? (\n\t\t<Tooltip\n\t\t\ttooltipContent={\n\t\t\t\t<TooltipStyled tooltipWidth={tootipWidth}>\n\t\t\t\t\t<BodyCaption color={COLORS.content.primaryInverse}>\n\t\t\t\t\t\t{props.tooltipText}\n\t\t\t\t\t</BodyCaption>\n\t\t\t\t</TooltipStyled>\n\t\t\t}\n\t\t\tplacement={tooltipPlacement}\n\t\t\tbody={''}\n\t\t>\n\t\t\t<FloatingActionButtonContainer\n\t\t\t\twidth={width}\n\t\t\t\theight={height}\n\t\t\t\tcolor={color}\n\t\t\t\tonClick={onClick}\n\t\t\t\tisRound={isRound}\n\t\t\t>\n\t\t\t\t{icon ? icon : <DefaultIcon width={22} height={22} />}\n\t\t\t</FloatingActionButtonContainer>\n\t\t</Tooltip>\n\t) : (\n\t\t<>\n\t\t\t<FloatingActionButtonContainer\n\t\t\t\twidth={width}\n\t\t\t\theight={height}\n\t\t\t\tcolor={color}\n\t\t\t\tonClick={onClick}\n\t\t\t\tisRound={isRound}\n\t\t\t>\n\t\t\t\t{icon ? icon : <DefaultIcon width={22} height={22} />}\n\t\t\t</FloatingActionButtonContainer>\n\t\t</>\n\t);\n};\nexport const FloatingActionButton: React.FC<{\n\tonClick?: () => void;\n\tchildren?: React.ReactNode;\n\twidth?: number;\n\theight?: number;\n\ticon?: JSX.Element;\n\tcolor?: string;\n\tposition?: FAB_POSITION;\n\tbuttonPaddingHorizontal?: number;\n\tbuttonPaddingVertical?: number;\n\ttooltipText?: string;\n\ttooltipPlacement?: Placement;\n\tzIndex?: number;\n\tisRound?: boolean;\n\tdropPosition?: DROP_POSITION;\n\tmenuAligment?: MENU_ALIGNMENT;\n\ttootipWidth?: number;\n}> = (props) => {\n\tconst {\n\t\ticon,\n\t\tonClick,\n\t\tchildren,\n\t\ttooltipText,\n\t\tisRound = true,\n\t\twidth = 48,\n\t\theight = 48,\n\t\tcolor = COLORS.background.inverse,\n\t\tposition = FAB_POSITION.TOP_LEFT,\n\t\tbuttonPaddingHorizontal = 20,\n\t\tbuttonPaddingVertical = 20,\n\t\tzIndex = 1,\n\t\ttooltipPlacement = 'right',\n\t\tdropPosition = DROP_POSITION.DOWN,\n\t\tmenuAligment = MENU_ALIGNMENT.END,\n\t\ttootipWidth,\n\t} = props;\n\tconst [isDropdownOpen, setIsDropdownOpen] = useState(false);\n\n\treturn (\n\t\t<>\n\t\t\t<FloatingActionButtonOuterContainer\n\t\t\t\twidth={width}\n\t\t\t\theight={height}\n\t\t\t\tcolor={color}\n\t\t\t\tposition={position}\n\t\t\t\tbuttonPaddingHorizontal={buttonPaddingHorizontal}\n\t\t\t\tbuttonPaddingVertical={buttonPaddingVertical}\n\t\t\t\tzIndex={zIndex}\n\t\t\t>\n\t\t\t\t<StyledDropdown\n\t\t\t\t\tonToggle={(nextShow: boolean, meta: any) => {\n\t\t\t\t\t\tsetIsDropdownOpen(nextShow);\n\t\t\t\t\t}}\n\t\t\t\t\tdrop={dropPosition}\n\t\t\t\t\talign={menuAligment}\n\t\t\t\t>\n\t\t\t\t\t{children ? (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<DropdownToggleContainer drop={dropPosition}>\n\t\t\t\t\t\t\t\t<FloatingActionToggleButtonJSX\n\t\t\t\t\t\t\t\t\twidth={width}\n\t\t\t\t\t\t\t\t\theight={height}\n\t\t\t\t\t\t\t\t\tcolor={color}\n\t\t\t\t\t\t\t\t\ttooltipPlacement={tooltipPlacement}\n\t\t\t\t\t\t\t\t\tonClick={onClick}\n\t\t\t\t\t\t\t\t\ttooltipText={tooltipText}\n\t\t\t\t\t\t\t\t\ticon={icon}\n\t\t\t\t\t\t\t\t\tposition={position}\n\t\t\t\t\t\t\t\t\tisRound={isRound}\n\t\t\t\t\t\t\t\t\tisDropdownOpen={isDropdownOpen}\n\t\t\t\t\t\t\t\t\ttootipWidth={tootipWidth}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</DropdownToggleContainer>\n\t\t\t\t\t\t\t<Dropdown.Menu>{children}</Dropdown.Menu>\n\t\t\t\t\t\t</>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<FloatingActionToggleButtonJSX\n\t\t\t\t\t\t\twidth={width}\n\t\t\t\t\t\t\theight={height}\n\t\t\t\t\t\t\tcolor={color}\n\t\t\t\t\t\t\ttooltipPlacement={tooltipPlacement}\n\t\t\t\t\t\t\tonClick={onClick}\n\t\t\t\t\t\t\ttooltipText={tooltipText}\n\t\t\t\t\t\t\ticon={icon}\n\t\t\t\t\t\t\tposition={position}\n\t\t\t\t\t\t\tisRound={isRound}\n\t\t\t\t\t\t\tisDropdownOpen={isDropdownOpen}\n\t\t\t\t\t\t\ttootipWidth={tootipWidth}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</StyledDropdown>\n\t\t\t</FloatingActionButtonOuterContainer>\n\t\t</>\n\t);\n};\n"],"names":["FloatingActionToggleButtonJSX","props","width","height","color","onClick","icon","tooltipPlacement","tooltipText","tootipWidth","isRound","jsx","Tooltip","TooltipStyled","BodyCaption","COLORS","FloatingActionButtonContainer","DefaultIcon","Fragment","FloatingActionButton","children","position","FAB_POSITION","buttonPaddingHorizontal","buttonPaddingVertical","zIndex","dropPosition","DROP_POSITION","menuAligment","MENU_ALIGNMENT","isDropdownOpen","setIsDropdownOpen","useState","FloatingActionButtonOuterContainer","StyledDropdown","nextShow","meta","jsxs","DropdownToggleContainer","Dropdown"],"mappings":"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"}

package/dist/esm/components/image-cropper/BikImageCropper.js

@@ -1,9 +1,8 @@
 import { jsx as o } from "react/jsx-runtime";
 import { useState as h } from "react";
 import p from "react-image-crop";
-import "react-image-crop/dist/ReactCrop.css";
 import { StyledModal as I } from "../modals/styledModal.js";
-const L = (a) => {
+const E = (a) => {
   const [s, l] = h(!1), [c, C] = h(void 0), [g, w] = h({ width: 0, height: 0 }), [f, d] = h(!1), u = async (e) => {
     if (d(!0), a.src && e?.width && e?.height) {
       const t = new Image();
@@ -100,7 +99,7 @@ const L = (a) => {
   );
 };
 export {
-  L as BikImageCropper,
-  L as default
+  E as BikImageCropper,
+  E as default
 };
 //# sourceMappingURL=BikImageCropper.js.map