npm - @xplor-education/core-stencil-components - Versions diffs - 3.1.2 → 3.1.4 - Mend

@xplor-education/core-stencil-components 3.1.2 → 3.1.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (261) hide show

package/components/{p-B49oUO_9.js → p-AzuDJugb.js} RENAMED Viewed

@@ -9,7 +9,7 @@ const XplorDropdown = /*@__PURE__*/ proxyCustomElement(class XplorDropdown exten
         this.__attachShadow();
     }
     render() {
-        return (h(Host, { key: '51c3f9372a79efeeffc662149ada3cd50c76fcbf' }, h("select", { key: '5bf6285178fd454f76089f62ad17d49654e88bf8', class: "xplor-dropdown", onChange: this.handleChange }, this.options.map((option) => (h("option", { value: option, selected: this.selected === option }, option))))));
+        return (h(Host, { key: 'a4cdcfb36108dbb84eeea5a4afbcbc59652e9cb0' }, h("select", { key: '1ad560027207d9b0fe9d9986c9ab4e6ab947c71c', class: "xplor-dropdown", onChange: this.handleChange }, this.options.map((option) => (h("option", { value: option, selected: this.selected === option }, option))))));
     }
     static get style() { return xplorDropdownCss; }
 }, [1, "xplor-dropdown", {
@@ -32,6 +32,6 @@ function defineCustomElement() {
 }
 export { XplorDropdown as X, defineCustomElement as d };
-//# sourceMappingURL=p-B49oUO_9.js.map
+//# sourceMappingURL=p-AzuDJugb.js.map
-//# sourceMappingURL=p-B49oUO_9.js.map
+//# sourceMappingURL=p-AzuDJugb.js.map

package/components/{p-B49oUO_9.js.map → p-AzuDJugb.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-~~B49oUO_9~~.js","mappings":";;AAAA,MAAM,gBAAgB,GAAG,66NAA66N;;MCOz7N,aAAa,iBAAAA,kBAAA,CAAA,MAAA,aAAA,SAAAC,CAAA,CAAA;;;;;;IAKxB,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,KAAK,EAAC,gBAAgB,EAAC,QAAQ,EAAE,IAAI,CAAC,YAAY,IACvD,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,MACvB,CAAA,CAAA,QAAA,EAAA,EAAQ,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,KAAK,MAAM,EAAA,EACtD,MAAM,CACA,CACV,CAAC,CACK,CACJ;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/xplor-dropdown/xplor-dropdown.scss?tag=xplor-dropdown&encapsulation=shadow","src/components/xplor-dropdown/xplor-dropdown.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.xplor-dropdown {\n display: block;\n cursor: pointer;\n margin-right: 10px;\n border: 1px solid;\n border-radius: 1rem;\n font-size: 14px;\n font-weight: 500;\n -webkit-box-pack: center;\n letter-spacing: 0.75px;\n height: 45px;\n text-align: center;\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n}","import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'xplor-dropdown',\n styleUrl: 'xplor-dropdown.scss',\n shadow: true,\n})\nexport class XplorDropdown {\n @Prop() options: string[];\n @Prop() selected: string;\n @Prop() handleChange: (event: Event) => void;\n\n render() {\n return (\n <Host>\n <select class=\"xplor-dropdown\" onChange={this.handleChange}>\n {this.options.map((option) => (\n <option value={option} selected={this.selected === option}>\n {option}\n </option>\n ))}\n </select>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"p-AzuDJugb.js","mappings":";;AAAA,MAAM,gBAAgB,GAAG,66NAA66N;;MCOz7N,aAAa,iBAAAA,kBAAA,CAAA,MAAA,aAAA,SAAAC,CAAA,CAAA;;;;;;IAKxB,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,KAAK,EAAC,gBAAgB,EAAC,QAAQ,EAAE,IAAI,CAAC,YAAY,IACvD,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,MACvB,CAAA,CAAA,QAAA,EAAA,EAAQ,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,KAAK,MAAM,EAAA,EACtD,MAAM,CACA,CACV,CAAC,CACK,CACJ;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/xplor-dropdown/xplor-dropdown.scss?tag=xplor-dropdown&encapsulation=shadow","src/components/xplor-dropdown/xplor-dropdown.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.xplor-dropdown {\n display: block;\n cursor: pointer;\n margin-right: 10px;\n border: 1px solid;\n border-radius: 1rem;\n font-size: 14px;\n font-weight: 500;\n -webkit-box-pack: center;\n letter-spacing: 0.75px;\n height: 45px;\n text-align: center;\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n}","import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'xplor-dropdown',\n styleUrl: 'xplor-dropdown.scss',\n shadow: true,\n})\nexport class XplorDropdown {\n @Prop() options: string[];\n @Prop() selected: string;\n @Prop() handleChange: (event: Event) => void;\n\n render() {\n return (\n <Host>\n <select class=\"xplor-dropdown\" onChange={this.handleChange}>\n {this.options.map((option) => (\n <option value={option} selected={this.selected === option}>\n {option}\n </option>\n ))}\n </select>\n </Host>\n );\n }\n}\n"],"version":3}

package/components/{p-D4jVa8dE.js → p-BQ6aLuGP.js} RENAMED Viewed

@@ -160,10 +160,10 @@ const XplorTooltip = /*@__PURE__*/ proxyCustomElement(class XplorTooltip extends
         };
     }
     render() {
-        return (h(Host, { key: '135c627d93956798eef4e842ec256a0f156c771a' }, h("div", { key: '1a4253fa4f893d7726227c346c9ebc850c7ee463', class: "tooltip-trigger", ref: (el) => (this.triggerEl = el), onClick: this.handleClick, "aria-describedby": this.open ? this.tooltipId : undefined }, h("slot", { key: '8970f94fa612b40e573a66102533b1f54387b9b2', name: "trigger" })), this.open && (h("div", { key: 'c1b873e3b9ccaf8747c772672282e63615528be7', class: {
+        return (h(Host, { key: 'aa588e55e6f61fdc836e6463940837ee9b01bff0' }, h("div", { key: '8aa1430d9762baccfa60341362c08a37db894433', class: "tooltip-trigger", ref: (el) => (this.triggerEl = el), onClick: this.handleClick, "aria-describedby": this.open ? this.tooltipId : undefined }, h("slot", { key: 'a12f087b5025c462f4c31a7d38d642ac133dab13', name: "trigger" })), this.open && (h("div", { key: '357ee3a461a83df7ef6b4c7bb693e88e24aae0df', class: {
                 'tooltip': true,
                 [`tooltip--${this.position}`]: true,
-            }, style: this.tooltipStyle, ref: (el) => (this.tooltipEl = el), role: "tooltip", id: this.tooltipId }, h("div", { key: '93af160a6f7fc1776ca358f3f91f0fecb381ce8d', class: "tooltip__content" }, h("slot", { key: 'cb1c56d228c3f494d668dad73e2af6b303af9f42' }, this.content)), this.arrow && (h("div", { key: '9d528e58c6b772c4b72096533bdb1f0df710aa8f', class: "tooltip__arrow", style: this.arrowStyle }))))));
+            }, style: this.tooltipStyle, ref: (el) => (this.tooltipEl = el), role: "tooltip", id: this.tooltipId }, h("div", { key: '2845a038bd1964a7237d82d48aed518b112d5973', class: "tooltip__content" }, h("slot", { key: '70ac6bc962d70e8f68b1be63ae3586bd6f3be46d' }, this.content)), this.arrow && (h("div", { key: '2858ec182c4c4cafd5f8367b9a5578077c1250b4', class: "tooltip__arrow", style: this.arrowStyle }))))));
     }
     get el() { return this; }
     static get style() { return xplorTooltipCss; }
@@ -192,6 +192,6 @@ function defineCustomElement() {
 }
 export { XplorTooltip as X, defineCustomElement as d };
-//# sourceMappingURL=p-D4jVa8dE.js.map
+//# sourceMappingURL=p-BQ6aLuGP.js.map
-//# sourceMappingURL=p-D4jVa8dE.js.map
+//# sourceMappingURL=p-BQ6aLuGP.js.map

package/components/{p-D4jVa8dE.js.map → p-BQ6aLuGP.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-D4jVa8dE.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/xplor-tooltip/xplor-tooltip.scss?tag=xplor-tooltip&encapsulation=scoped","src/components/xplor-tooltip/xplor-tooltip.tsx"],"sourcesContent":[":host {\n display: inline-block;\n position: relative;\n}\n\n.tooltip-trigger {\n display: inline-flex;\n cursor: pointer;\n}\n\n.tooltip {\n position: fixed;\n z-index: 9999;\n background-color: #424242;\n color: #fff;\n border-radius: 4px;\n padding: 0.5rem 0.75rem;\n font-size: 0.875rem;\n line-height: 1.4;\n max-width: 300px;\n word-wrap: break-word;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n pointer-events: none;\n opacity: 0;\n animation: tooltipFadeIn 0.2s ease forwards;\n}\n\n@keyframes tooltipFadeIn {\n from {\n opacity: 0;\n transform: scale(0.9);\n }\n\n to {\n opacity: 1;\n transform: scale(1);\n }\n}\n\n.tooltip__content {\n position: relative;\n z-index: 1;\n}\n\n.tooltip__arrow {\n position: absolute;\n width: 12px;\n height: 12px;\n background-color: #424242;\n z-index: 0;\n}\n\n.tooltip--top .tooltip__arrow {\n margin-top: -6px;\n box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1);\n}\n\n.tooltip--bottom .tooltip__arrow {\n box-shadow: -2px -2px 4px rgba(0, 0, 0, 0.1);\n}\n\n.tooltip--left .tooltip__arrow {\n margin-left: -6px;\n display: block;\n box-shadow: 2px -2px 4px rgba(0, 0, 0, 0.1);\n}\n\n.tooltip--right .tooltip__arrow {\n box-shadow: -2px 2px 4px rgba(0, 0, 0, 0.1);\n}","import { Component, Host, h, Prop, State, Element, Listen } from '@stencil/core';\n\nlet tooltipIdCounter = 0;\n\nexport type TooltipPosition = 'top' \| 'bottom' \| 'left' \| 'right';\nexport type TooltipTrigger = 'hover' \| 'click' \| 'manual';\n\n@Component({\n tag: 'xplor-tooltip',\n styleUrl: 'xplor-tooltip.scss',\n scoped: true,\n})\nexport class XplorTooltip {\n @Element() el: HTMLElement;\n\n @Prop() position: TooltipPosition = 'top';\n @Prop() trigger: TooltipTrigger = 'hover';\n @Prop() arrow: boolean = true;\n @Prop({ mutable: true }) open: boolean = false;\n @Prop() content: string;\n @Prop() disabled: boolean = false;\n\n @State() tooltipStyle: any = {};\n @State() arrowStyle: any = {};\n\n private tooltipId = `xplor-tooltip-${++tooltipIdCounter}`;\n\n private triggerEl: HTMLDivElement;\n private tooltipEl: HTMLDivElement;\n private hideTimeout: any;\n\n componentDidLoad() {\n if (this.trigger === 'hover') {\n this.setupHoverListeners();\n }\n }\n\n disconnectedCallback() {\n this.cleanupListeners();\n if (this.hideTimeout) {\n clearTimeout(this.hideTimeout);\n }\n }\n\n private setupHoverListeners() {\n if (this.triggerEl) {\n this.triggerEl.addEventListener('mouseenter', this.handleMouseEnter);\n this.triggerEl.addEventListener('mouseleave', this.handleMouseLeave);\n this.triggerEl.addEventListener('focusin', this.handleFocusIn);\n this.triggerEl.addEventListener('focusout', this.handleFocusOut);\n }\n }\n\n private cleanupListeners() {\n if (this.triggerEl) {\n this.triggerEl.removeEventListener('mouseenter', this.handleMouseEnter);\n this.triggerEl.removeEventListener('mouseleave', this.handleMouseLeave);\n this.triggerEl.removeEventListener('focusin', this.handleFocusIn);\n this.triggerEl.removeEventListener('focusout', this.handleFocusOut);\n }\n }\n\n private handleMouseEnter = () => {\n if (this.disabled) return;\n if (this.hideTimeout) {\n clearTimeout(this.hideTimeout);\n }\n this.showTooltip();\n };\n\n private handleMouseLeave = () => {\n if (this.disabled) return;\n this.hideTimeout = setTimeout(() => {\n this.hideTooltip();\n }, 100);\n };\n\n private handleFocusIn = () => {\n if (this.disabled) return;\n this.showTooltip();\n };\n\n private handleFocusOut = () => {\n if (this.disabled) return;\n this.hideTooltip();\n };\n\n private handleClick = () => {\n if (this.disabled) return;\n if (this.trigger === 'click') {\n this.open = !this.open;\n if (this.open) {\n requestAnimationFrame(() => this.updatePosition());\n }\n }\n };\n\n @Listen('click', { target: 'document' })\n handleDocumentClick(event: MouseEvent) {\n if (this.trigger === 'click' && this.open) {\n const target = event.target as Node;\n if (!this.el.contains(target)) {\n this.open = false;\n }\n }\n }\n\n private showTooltip() {\n this.open = true;\n requestAnimationFrame(() => this.updatePosition());\n }\n\n private hideTooltip() {\n this.open = false;\n }\n\n private updatePosition() {\n if (!this.triggerEl \|\| !this.tooltipEl) return;\n\n const triggerRect = this.triggerEl.getBoundingClientRect();\n const tooltipRect = this.tooltipEl.getBoundingClientRect();\n const gap = 8; // Space between trigger and tooltip\n const arrowSize = this.arrow ? 6 : 0;\n\n let top = 0;\n let left = 0;\n let arrowTop = '';\n let arrowLeft = '';\n let arrowTransform = '';\n\n switch (this.position) {\n case 'top':\n top = triggerRect.top - tooltipRect.height - gap - arrowSize;\n left = triggerRect.left + triggerRect.width / 2 - tooltipRect.width / 2;\n arrowTop = '100%';\n arrowLeft = '50%';\n arrowTransform = 'translateX(-50%) rotate(45deg)';\n break;\n\n case 'bottom':\n top = triggerRect.bottom + gap + arrowSize;\n left = triggerRect.left + triggerRect.width / 2 - tooltipRect.width / 2;\n arrowTop = '-6px';\n arrowLeft = '50%';\n arrowTransform = 'translateX(-50%) rotate(45deg)';\n break;\n\n case 'left':\n top = triggerRect.top + triggerRect.height / 2 - tooltipRect.height / 2;\n left = triggerRect.left - tooltipRect.width - gap - arrowSize;\n arrowTop = '50%';\n arrowLeft = '100%';\n arrowTransform = 'translateY(-50%) rotate(45deg)';\n break;\n\n case 'right':\n top = triggerRect.top + triggerRect.height / 2 - tooltipRect.height / 2;\n left = triggerRect.right + gap + arrowSize;\n arrowTop = '50%';\n arrowLeft = '-6px';\n arrowTransform = 'translateY(-50%) rotate(45deg)';\n break;\n }\n\n // Keep tooltip within viewport\n const viewportPadding = 8;\n if (left < viewportPadding) {\n left = viewportPadding;\n } else if (left + tooltipRect.width > window.innerWidth - viewportPadding) {\n left = window.innerWidth - tooltipRect.width - viewportPadding;\n }\n\n if (top < viewportPadding) {\n top = viewportPadding;\n } else if (top + tooltipRect.height > window.innerHeight - viewportPadding) {\n top = window.innerHeight - tooltipRect.height - viewportPadding;\n }\n\n this.tooltipStyle = {\n top: `${top}px`,\n left: `${left}px`,\n };\n\n this.arrowStyle = {\n top: arrowTop,\n left: arrowLeft,\n transform: arrowTransform,\n };\n }\n\n render() {\n return (\n <Host>\n <div\n class=\"tooltip-trigger\"\n ref={(el) => (this.triggerEl = el)}\n onClick={this.handleClick}\n aria-describedby={this.open ? this.tooltipId : undefined}\n >\n <slot name=\"trigger\" />\n </div>\n\n {this.open && (\n <div\n class={{\n 'tooltip': true,\n [`tooltip--${this.position}`]: true,\n }}\n style={this.tooltipStyle}\n ref={(el) => (this.tooltipEl = el)}\n role=\"tooltip\"\n id={this.tooltipId}\n >\n <div class=\"tooltip__content\">\n <slot>{this.content}</slot>\n </div>\n {this.arrow && (\n <div\n class=\"tooltip__arrow\"\n style={this.arrowStyle}\n />\n )}\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"p-BQ6aLuGP.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/xplor-tooltip/xplor-tooltip.scss?tag=xplor-tooltip&encapsulation=scoped","src/components/xplor-tooltip/xplor-tooltip.tsx"],"sourcesContent":[":host {\n display: inline-block;\n position: relative;\n}\n\n.tooltip-trigger {\n display: inline-flex;\n cursor: pointer;\n}\n\n.tooltip {\n position: fixed;\n z-index: 9999;\n background-color: #424242;\n color: #fff;\n border-radius: 4px;\n padding: 0.5rem 0.75rem;\n font-size: 0.875rem;\n line-height: 1.4;\n max-width: 300px;\n word-wrap: break-word;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n pointer-events: none;\n opacity: 0;\n animation: tooltipFadeIn 0.2s ease forwards;\n}\n\n@keyframes tooltipFadeIn {\n from {\n opacity: 0;\n transform: scale(0.9);\n }\n\n to {\n opacity: 1;\n transform: scale(1);\n }\n}\n\n.tooltip__content {\n position: relative;\n z-index: 1;\n}\n\n.tooltip__arrow {\n position: absolute;\n width: 12px;\n height: 12px;\n background-color: #424242;\n z-index: 0;\n}\n\n.tooltip--top .tooltip__arrow {\n margin-top: -6px;\n box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1);\n}\n\n.tooltip--bottom .tooltip__arrow {\n box-shadow: -2px -2px 4px rgba(0, 0, 0, 0.1);\n}\n\n.tooltip--left .tooltip__arrow {\n margin-left: -6px;\n display: block;\n box-shadow: 2px -2px 4px rgba(0, 0, 0, 0.1);\n}\n\n.tooltip--right .tooltip__arrow {\n box-shadow: -2px 2px 4px rgba(0, 0, 0, 0.1);\n}","import { Component, Host, h, Prop, State, Element, Listen } from '@stencil/core';\n\nlet tooltipIdCounter = 0;\n\nexport type TooltipPosition = 'top' \| 'bottom' \| 'left' \| 'right';\nexport type TooltipTrigger = 'hover' \| 'click' \| 'manual';\n\n@Component({\n tag: 'xplor-tooltip',\n styleUrl: 'xplor-tooltip.scss',\n scoped: true,\n})\nexport class XplorTooltip {\n @Element() el: HTMLElement;\n\n @Prop() position: TooltipPosition = 'top';\n @Prop() trigger: TooltipTrigger = 'hover';\n @Prop() arrow: boolean = true;\n @Prop({ mutable: true }) open: boolean = false;\n @Prop() content: string;\n @Prop() disabled: boolean = false;\n\n @State() tooltipStyle: any = {};\n @State() arrowStyle: any = {};\n\n private tooltipId = `xplor-tooltip-${++tooltipIdCounter}`;\n\n private triggerEl: HTMLDivElement;\n private tooltipEl: HTMLDivElement;\n private hideTimeout: any;\n\n componentDidLoad() {\n if (this.trigger === 'hover') {\n this.setupHoverListeners();\n }\n }\n\n disconnectedCallback() {\n this.cleanupListeners();\n if (this.hideTimeout) {\n clearTimeout(this.hideTimeout);\n }\n }\n\n private setupHoverListeners() {\n if (this.triggerEl) {\n this.triggerEl.addEventListener('mouseenter', this.handleMouseEnter);\n this.triggerEl.addEventListener('mouseleave', this.handleMouseLeave);\n this.triggerEl.addEventListener('focusin', this.handleFocusIn);\n this.triggerEl.addEventListener('focusout', this.handleFocusOut);\n }\n }\n\n private cleanupListeners() {\n if (this.triggerEl) {\n this.triggerEl.removeEventListener('mouseenter', this.handleMouseEnter);\n this.triggerEl.removeEventListener('mouseleave', this.handleMouseLeave);\n this.triggerEl.removeEventListener('focusin', this.handleFocusIn);\n this.triggerEl.removeEventListener('focusout', this.handleFocusOut);\n }\n }\n\n private handleMouseEnter = () => {\n if (this.disabled) return;\n if (this.hideTimeout) {\n clearTimeout(this.hideTimeout);\n }\n this.showTooltip();\n };\n\n private handleMouseLeave = () => {\n if (this.disabled) return;\n this.hideTimeout = setTimeout(() => {\n this.hideTooltip();\n }, 100);\n };\n\n private handleFocusIn = () => {\n if (this.disabled) return;\n this.showTooltip();\n };\n\n private handleFocusOut = () => {\n if (this.disabled) return;\n this.hideTooltip();\n };\n\n private handleClick = () => {\n if (this.disabled) return;\n if (this.trigger === 'click') {\n this.open = !this.open;\n if (this.open) {\n requestAnimationFrame(() => this.updatePosition());\n }\n }\n };\n\n @Listen('click', { target: 'document' })\n handleDocumentClick(event: MouseEvent) {\n if (this.trigger === 'click' && this.open) {\n const target = event.target as Node;\n if (!this.el.contains(target)) {\n this.open = false;\n }\n }\n }\n\n private showTooltip() {\n this.open = true;\n requestAnimationFrame(() => this.updatePosition());\n }\n\n private hideTooltip() {\n this.open = false;\n }\n\n private updatePosition() {\n if (!this.triggerEl \|\| !this.tooltipEl) return;\n\n const triggerRect = this.triggerEl.getBoundingClientRect();\n const tooltipRect = this.tooltipEl.getBoundingClientRect();\n const gap = 8; // Space between trigger and tooltip\n const arrowSize = this.arrow ? 6 : 0;\n\n let top = 0;\n let left = 0;\n let arrowTop = '';\n let arrowLeft = '';\n let arrowTransform = '';\n\n switch (this.position) {\n case 'top':\n top = triggerRect.top - tooltipRect.height - gap - arrowSize;\n left = triggerRect.left + triggerRect.width / 2 - tooltipRect.width / 2;\n arrowTop = '100%';\n arrowLeft = '50%';\n arrowTransform = 'translateX(-50%) rotate(45deg)';\n break;\n\n case 'bottom':\n top = triggerRect.bottom + gap + arrowSize;\n left = triggerRect.left + triggerRect.width / 2 - tooltipRect.width / 2;\n arrowTop = '-6px';\n arrowLeft = '50%';\n arrowTransform = 'translateX(-50%) rotate(45deg)';\n break;\n\n case 'left':\n top = triggerRect.top + triggerRect.height / 2 - tooltipRect.height / 2;\n left = triggerRect.left - tooltipRect.width - gap - arrowSize;\n arrowTop = '50%';\n arrowLeft = '100%';\n arrowTransform = 'translateY(-50%) rotate(45deg)';\n break;\n\n case 'right':\n top = triggerRect.top + triggerRect.height / 2 - tooltipRect.height / 2;\n left = triggerRect.right + gap + arrowSize;\n arrowTop = '50%';\n arrowLeft = '-6px';\n arrowTransform = 'translateY(-50%) rotate(45deg)';\n break;\n }\n\n // Keep tooltip within viewport\n const viewportPadding = 8;\n if (left < viewportPadding) {\n left = viewportPadding;\n } else if (left + tooltipRect.width > window.innerWidth - viewportPadding) {\n left = window.innerWidth - tooltipRect.width - viewportPadding;\n }\n\n if (top < viewportPadding) {\n top = viewportPadding;\n } else if (top + tooltipRect.height > window.innerHeight - viewportPadding) {\n top = window.innerHeight - tooltipRect.height - viewportPadding;\n }\n\n this.tooltipStyle = {\n top: `${top}px`,\n left: `${left}px`,\n };\n\n this.arrowStyle = {\n top: arrowTop,\n left: arrowLeft,\n transform: arrowTransform,\n };\n }\n\n render() {\n return (\n <Host>\n <div\n class=\"tooltip-trigger\"\n ref={(el) => (this.triggerEl = el)}\n onClick={this.handleClick}\n aria-describedby={this.open ? this.tooltipId : undefined}\n >\n <slot name=\"trigger\" />\n </div>\n\n {this.open && (\n <div\n class={{\n 'tooltip': true,\n [`tooltip--${this.position}`]: true,\n }}\n style={this.tooltipStyle}\n ref={(el) => (this.tooltipEl = el)}\n role=\"tooltip\"\n id={this.tooltipId}\n >\n <div class=\"tooltip__content\">\n <slot>{this.content}</slot>\n </div>\n {this.arrow && (\n <div\n class=\"tooltip__arrow\"\n style={this.arrowStyle}\n />\n )}\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}

package/components/{p-VIJbFoA4.js → p-BZQ63ULK.js} RENAMED Viewed

@@ -213,7 +213,7 @@ const XplorInlineDatePicker = /*@__PURE__*/ proxyCustomElement(class XplorInline
     render() {
         const sidebarDate = this.getSidebarDate();
         const dayHeaders = this.startWeekOnSunday ? this.dayNames : this.dayNamesStartMonday;
-        return (h(Host, { key: '031460c16f831f29173bbac372ee4de5b0473828' }, h("div", { key: 'b0d890fec94358a882d10a30b229196ee8fc4ea5', class: "xplor-inline-date-picker", style: { '--picker-color': this.color } }, h("div", { key: '2d5496299d0091d1960fb8507726f15828d68313', class: "xplor-inline-date-picker__sidebar" }, h("div", { key: 'b1645b35975a52e916eb6d18ccda16c3b90519c3', class: "xplor-inline-date-picker__sidebar-year" }, sidebarDate.year), h("div", { key: 'b812bbbd4686d06d6c4c602846c870777847c9ca', class: "xplor-inline-date-picker__sidebar-day" }, sidebarDate.day, ","), h("div", { key: 'd78744d1b353ddafa302693ac105837f33be736e', class: "xplor-inline-date-picker__sidebar-date" }, sidebarDate.date)), h("div", { key: '1e0519719bff8801a3f6a7d23c8140b4017656d8', class: "xplor-inline-date-picker__calendar" }, h("div", { key: '1f13bb35c2bbbc921f6f4d0a4dde12e47d010c81', class: "xplor-inline-date-picker__header" }, h("button", { key: 'dd726c543dc74ed85bb3dd128b45e5a74ffde1f6', type: "button", class: "xplor-inline-date-picker__arrow", onClick: this.previousMonth, "aria-label": "Previous month" }, "\u2039"), h("div", { key: 'ffb6cf26f1b1a0ef2c75ccb827f38110a6cfbdbe', class: "xplor-inline-date-picker__title" }, this.monthNames[this.currentMonth], " ", this.currentYear), h("button", { key: '69b0c08aae5b24b2814c37be40de942ed2ff8abb', type: "button", class: "xplor-inline-date-picker__arrow", onClick: this.nextMonth, "aria-label": "Next month" }, "\u203A")), h("div", { key: '25ef6b996fdccc121b44f6dafe018aef316ab09d', class: "xplor-inline-date-picker__weekdays" }, dayHeaders.map((day) => (h("div", { class: "xplor-inline-date-picker__weekday" }, day)))), h("div", { key: '6d092079f76ab7c06fcdb07c8d43d0cd9ace8faa', class: "xplor-inline-date-picker__days", role: "grid" }, this.renderCalendarDays())))));
+        return (h(Host, { key: '0e2c9ee42cbe61406ab4bac151dbf0e40475ed23' }, h("div", { key: '5e4a7875966f6f4a37f81446d58b68672c35dac3', class: "xplor-inline-date-picker", style: { '--picker-color': this.color } }, h("div", { key: 'fa29ee023214d89bed7ceb205578f8be89e09337', class: "xplor-inline-date-picker__sidebar" }, h("div", { key: '556e7992f45d9bc4ad0b0b9dd1fdd08d4b69c5d9', class: "xplor-inline-date-picker__sidebar-year" }, sidebarDate.year), h("div", { key: '0b581be2477f17c0d80dbce52fc2ad3d31e9b0a3', class: "xplor-inline-date-picker__sidebar-day" }, sidebarDate.day, ","), h("div", { key: 'd17c951c734d23365dce0c417e53e215a6d810c8', class: "xplor-inline-date-picker__sidebar-date" }, sidebarDate.date)), h("div", { key: '0829d8eac4d5300c425c0bc3540fb7e2a67a8127', class: "xplor-inline-date-picker__calendar" }, h("div", { key: '026c1ffc57ca6ebc8c81d9ca5168b06108fb98fa', class: "xplor-inline-date-picker__header" }, h("button", { key: 'a3093ab8152b08681ffb746bd2441e64ea0ad117', type: "button", class: "xplor-inline-date-picker__arrow", onClick: this.previousMonth, "aria-label": "Previous month" }, "\u2039"), h("div", { key: '924e78c2f181360b899816a64403470029667876', class: "xplor-inline-date-picker__title" }, this.monthNames[this.currentMonth], " ", this.currentYear), h("button", { key: 'b9d70ec267b289f7c9c920eb12ee19b0f94d2852', type: "button", class: "xplor-inline-date-picker__arrow", onClick: this.nextMonth, "aria-label": "Next month" }, "\u203A")), h("div", { key: 'd9cddf3b2ec7a57d489fdc9dfb97a48b4e04836a', class: "xplor-inline-date-picker__weekdays" }, dayHeaders.map((day) => (h("div", { class: "xplor-inline-date-picker__weekday" }, day)))), h("div", { key: 'bfed53b3822299f0c9c42f7662cff6b0e7dcdc48', class: "xplor-inline-date-picker__days", role: "grid" }, this.renderCalendarDays())))));
     }
     get el() { return this; }
     static get style() { return xplorInlineDatePickerCss; }
@@ -244,6 +244,6 @@ function defineCustomElement() {
 }
 export { XplorInlineDatePicker as X, defineCustomElement as d };
-//# sourceMappingURL=p-VIJbFoA4.js.map
+//# sourceMappingURL=p-BZQ63ULK.js.map
-//# sourceMappingURL=p-VIJbFoA4.js.map
+//# sourceMappingURL=p-BZQ63ULK.js.map

package/components/{p-VIJbFoA4.js.map → p-BZQ63ULK.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-VIJbFoA4.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/xplor-inline-date-picker/xplor-inline-date-picker.scss?tag=xplor-inline-date-picker&encapsulation=scoped","src/components/xplor-inline-date-picker/xplor-inline-date-picker.tsx"],"sourcesContent":[":host {\n display: inline-block;\n}\n\n.xplor-inline-date-picker {\n --picker-color: #008480;\n display: flex;\n border-radius: 1rem;\n background-color: white;\n box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2),\n 0 8px 10px 1px rgba(0, 0, 0, 0.14),\n 0 3px 14px 2px rgba(0, 0, 0, 0.12);\n overflow: hidden;\n\n &__sidebar {\n background-color: var(--picker-color);\n color: white;\n padding: 1rem;\n min-width: 180px;\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n }\n\n &__sidebar-year {\n font-size: 0.875rem;\n font-weight: 700;\n }\n\n &__sidebar-day {\n font-size: 1.75rem;\n font-weight: 700;\n }\n\n &__sidebar-date {\n font-size: 1.75rem;\n font-weight: 700;\n }\n\n &__calendar {\n display: flex;\n flex-direction: column;\n width: 320px;\n padding: 1rem;\n }\n\n &__header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: 1rem;\n padding: 0.5rem 0;\n }\n\n &__title {\n font-size: 1rem;\n font-weight: 700;\n color: rgba(0, 0, 0, 0.87);\n }\n\n &__arrow {\n width: 2rem;\n height: 2rem;\n border: none;\n background: transparent;\n font-size: 1.5rem;\n color: rgba(0, 0, 0, 0.54);\n cursor: pointer;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: background-color 0.2s ease;\n\n &:hover {\n background-color: rgba(0, 0, 0, 0.04);\n }\n\n &:active {\n background-color: rgba(0, 0, 0, 0.08);\n }\n }\n\n &__weekdays {\n display: grid;\n grid-template-columns: repeat(7, 1fr);\n gap: 0.25rem;\n margin-bottom: 0.5rem;\n }\n\n &__weekday {\n text-align: center;\n font-size: 0.75rem;\n font-weight: 700;\n color: rgba(0, 0, 0, 0.6);\n padding: 0.5rem 0;\n }\n\n &__days {\n display: grid;\n grid-template-columns: repeat(7, 1fr);\n gap: 0.25rem;\n }\n\n &__day {\n aspect-ratio: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 0.875rem;\n font-weight: 500;\n border-radius: 50%;\n cursor: pointer;\n transition: background-color 0.2s ease;\n position: relative;\n\n &:not(&--empty):not(&--disabled):hover {\n background-color: rgba(0, 0, 0, 0.04);\n }\n\n &--empty {\n cursor: default;\n }\n\n &--today {\n color: var(--picker-color);\n font-weight: 700;\n\n &::before {\n content: '';\n position: absolute;\n inset: 0;\n border: 2px solid var(--picker-color);\n border-radius: 50%;\n }\n }\n\n &--selected {\n background-color: var(--picker-color);\n color: white;\n font-weight: 700;\n\n &:hover {\n background-color: var(--picker-color);\n opacity: 0.9;\n }\n\n &::before {\n display: none;\n }\n }\n\n &--disabled {\n color: rgba(0, 0, 0, 0.38);\n cursor: not-allowed;\n pointer-events: none;\n }\n }\n}\n\n// Compact variant (no sidebar)\n:host([compact]) {\n .xplor-inline-date-picker {\n &__sidebar {\n display: none;\n }\n\n &__calendar {\n width: 280px;\n }\n }\n}\n","import { Component, Host, h, Prop, Event, EventEmitter, State, Element, Listen } from '@stencil/core';\n\n@Component({\n tag: 'xplor-inline-date-picker',\n styleUrl: 'xplor-inline-date-picker.scss',\n scoped: true,\n})\nexport class XplorInlineDatePicker {\n @Element() el: HTMLElement;\n /*\n Selected date (YYYY-MM-DD format)\n /\n @Prop({ mutable: true }) selectedDate: string = '';\n\n /\n Minimum selectable date (YYYY-MM-DD format)\n /\n @Prop() min: string = '';\n\n /\n Maximum selectable date (YYYY-MM-DD format)\n /\n @Prop() max: string = '';\n\n /\n Whether the date picker is readonly\n /\n @Prop() readonly: boolean = false;\n\n /\n Primary color\n /\n @Prop() color: string = '#008480';\n\n /\n Whether to start week on Sunday (default: true)\n /\n @Prop() startWeekOnSunday: boolean = true;\n\n /\n Date selection event\n /\n @Event() dateSelected: EventEmitter<string>;\n\n /\n Month change event\n */\n @Event() monthChanged: EventEmitter<{ year: number; month: number }>;\n\n @State() currentYear: number;\n @State() currentMonth: number;\n @State() viewDate: Date;\n @State() focusedDay: number = 0;\n\n private monthNames = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];\n private dayNames = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];\n private dayNamesStartMonday = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'];\n\n componentWillLoad() {\n const date = this.selectedDate ? new Date(this.selectedDate) : new Date();\n this.currentYear = date.getFullYear();\n this.currentMonth = date.getMonth();\n this.viewDate = new Date(this.currentYear, this.currentMonth, 1);\n this.focusedDay = date.getDate();\n }\n\n @Listen('keydown')\n handleKeyDown(event: KeyboardEvent) {\n const daysInMonth = this.getDaysInMonth();\n\n switch (event.key) {\n case 'ArrowLeft':\n event.preventDefault();\n if (this.focusedDay > 1) {\n this.focusedDay--;\n } else {\n this.previousMonth();\n this.focusedDay = this.getDaysInMonth();\n }\n break;\n case 'ArrowRight':\n event.preventDefault();\n if (this.focusedDay < daysInMonth) {\n this.focusedDay++;\n } else {\n this.nextMonth();\n this.focusedDay = 1;\n }\n break;\n case 'ArrowUp':\n event.preventDefault();\n if (this.focusedDay > 7) {\n this.focusedDay -= 7;\n } else {\n this.previousMonth();\n this.focusedDay = this.getDaysInMonth() - (7 - this.focusedDay);\n }\n break;\n case 'ArrowDown':\n event.preventDefault();\n if (this.focusedDay + 7 <= daysInMonth) {\n this.focusedDay += 7;\n } else {\n const remainder = this.focusedDay + 7 - daysInMonth;\n this.nextMonth();\n this.focusedDay = remainder;\n }\n break;\n case 'Enter':\n case ' ':\n event.preventDefault();\n if (this.focusedDay >= 1 && this.focusedDay <= daysInMonth) {\n this.selectDate(this.focusedDay);\n }\n break;\n default:\n return;\n }\n\n // Focus the day cell after render\n requestAnimationFrame(() => {\n const dayEl = this.el.querySelector(`[data-day=\"${this.focusedDay}\"]`) as HTMLElement;\n if (dayEl) dayEl.focus();\n });\n }\n\n private previousMonth = () => {\n if (this.currentMonth === 0) {\n this.currentMonth = 11;\n this.currentYear--;\n } else {\n this.currentMonth--;\n }\n this.viewDate = new Date(this.currentYear, this.currentMonth, 1);\n this.monthChanged.emit({ year: this.currentYear, month: this.currentMonth });\n };\n\n private nextMonth = () => {\n if (this.currentMonth === 11) {\n this.currentMonth = 0;\n this.currentYear++;\n } else {\n this.currentMonth++;\n }\n this.viewDate = new Date(this.currentYear, this.currentMonth, 1);\n this.monthChanged.emit({ year: this.currentYear, month: this.currentMonth });\n };\n\n private selectDate = (day: number) => {\n if (this.readonly) return;\n\n const date = new Date(this.currentYear, this.currentMonth, day);\n const dateString = this.formatDate(date);\n\n if (this.isDateDisabled(date)) return;\n\n this.selectedDate = dateString;\n this.dateSelected.emit(dateString);\n };\n\n private formatDate = (date: Date): string => {\n const year = date.getFullYear();\n const month = String(date.getMonth() + 1).padStart(2, '0');\n const day = String(date.getDate()).padStart(2, '0');\n return `${year}-${month}-${day}`;\n };\n\n private isDateDisabled = (date: Date): boolean => {\n if (this.min) {\n const minDate = new Date(this.min);\n if (date < minDate) return true;\n }\n if (this.max) {\n const maxDate = new Date(this.max);\n if (date > maxDate) return true;\n }\n return false;\n };\n\n private isToday = (day: number): boolean => {\n const today = new Date();\n return (\n day === today.getDate() &&\n this.currentMonth === today.getMonth() &&\n this.currentYear === today.getFullYear()\n );\n };\n\n private isSelected = (day: number): boolean => {\n if (!this.selectedDate) return false;\n const selected = new Date(this.selectedDate);\n return (\n day === selected.getDate() &&\n this.currentMonth === selected.getMonth() &&\n this.currentYear === selected.getFullYear()\n );\n };\n\n private getDaysInMonth = (): number => {\n return new Date(this.currentYear, this.currentMonth + 1, 0).getDate();\n };\n\n private getFirstDayOfMonth = (): number => {\n const firstDay = new Date(this.currentYear, this.currentMonth, 1).getDay();\n return this.startWeekOnSunday ? firstDay : (firstDay === 0 ? 6 : firstDay - 1);\n };\n\n private renderCalendarDays = () => {\n const daysInMonth = this.getDaysInMonth();\n const firstDay = this.getFirstDayOfMonth();\n const days = [];\n\n // Empty cells for days before the first of the month\n for (let i = 0; i < firstDay; i++) {\n days.push(<div class=\"xplor-inline-date-picker__day xplor-inline-date-picker__day--empty\"></div>);\n }\n\n // Days of the month\n for (let day = 1; day <= daysInMonth; day++) {\n const date = new Date(this.currentYear, this.currentMonth, day);\n const isDisabled = this.isDateDisabled(date);\n const isToday = this.isToday(day);\n const isSelected = this.isSelected(day);\n\n days.push(\n <div\n class={{\n 'xplor-inline-date-picker__day': true,\n 'xplor-inline-date-picker__day--today': isToday,\n 'xplor-inline-date-picker__day--selected': isSelected,\n 'xplor-inline-date-picker__day--disabled': isDisabled,\n }}\n onClick={() => !isDisabled && this.selectDate(day)}\n role=\"gridcell\"\n aria-selected={isSelected ? 'true' : 'false'}\n aria-current={isToday ? 'date' : undefined}\n aria-disabled={isDisabled ? 'true' : undefined}\n tabIndex={day === this.focusedDay ? 0 : -1}\n data-day={day}\n >\n {day}\n </div>\n );\n }\n\n return days;\n };\n\n private getSidebarDate = () => {\n const date = this.selectedDate ? new Date(this.selectedDate) : new Date();\n const dayNames = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];\n const monthNames = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];\n\n return {\n year: date.getFullYear(),\n day: dayNames[date.getDay()],\n date: `${monthNames[date.getMonth()]} ${date.getDate()}`,\n };\n };\n\n render() {\n const sidebarDate = this.getSidebarDate();\n const dayHeaders = this.startWeekOnSunday ? this.dayNames : this.dayNamesStartMonday;\n\n return (\n <Host>\n <div class=\"xplor-inline-date-picker\" style={{ '--picker-color': this.color }}>\n <div class=\"xplor-inline-date-picker__sidebar\">\n <div class=\"xplor-inline-date-picker__sidebar-year\">{sidebarDate.year}</div>\n <div class=\"xplor-inline-date-picker__sidebar-day\">{sidebarDate.day},</div>\n <div class=\"xplor-inline-date-picker__sidebar-date\">{sidebarDate.date}</div>\n </div>\n\n <div class=\"xplor-inline-date-picker__calendar\">\n <div class=\"xplor-inline-date-picker__header\">\n <button\n type=\"button\"\n class=\"xplor-inline-date-picker__arrow\"\n onClick={this.previousMonth}\n aria-label=\"Previous month\"\n >\n ‹\n </button>\n <div class=\"xplor-inline-date-picker__title\">\n {this.monthNames[this.currentMonth]} {this.currentYear}\n </div>\n <button\n type=\"button\"\n class=\"xplor-inline-date-picker__arrow\"\n onClick={this.nextMonth}\n aria-label=\"Next month\"\n >\n ›\n </button>\n </div>\n\n <div class=\"xplor-inline-date-picker__weekdays\">\n {dayHeaders.map((day) => (\n <div class=\"xplor-inline-date-picker__weekday\">{day}</div>\n ))}\n </div>\n\n <div class=\"xplor-inline-date-picker__days\" role=\"grid\">{this.renderCalendarDays()}</div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"p-BZQ63ULK.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/xplor-inline-date-picker/xplor-inline-date-picker.scss?tag=xplor-inline-date-picker&encapsulation=scoped","src/components/xplor-inline-date-picker/xplor-inline-date-picker.tsx"],"sourcesContent":[":host {\n display: inline-block;\n}\n\n.xplor-inline-date-picker {\n --picker-color: #008480;\n display: flex;\n border-radius: 1rem;\n background-color: white;\n box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2),\n 0 8px 10px 1px rgba(0, 0, 0, 0.14),\n 0 3px 14px 2px rgba(0, 0, 0, 0.12);\n overflow: hidden;\n\n &__sidebar {\n background-color: var(--picker-color);\n color: white;\n padding: 1rem;\n min-width: 180px;\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n }\n\n &__sidebar-year {\n font-size: 0.875rem;\n font-weight: 700;\n }\n\n &__sidebar-day {\n font-size: 1.75rem;\n font-weight: 700;\n }\n\n &__sidebar-date {\n font-size: 1.75rem;\n font-weight: 700;\n }\n\n &__calendar {\n display: flex;\n flex-direction: column;\n width: 320px;\n padding: 1rem;\n }\n\n &__header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: 1rem;\n padding: 0.5rem 0;\n }\n\n &__title {\n font-size: 1rem;\n font-weight: 700;\n color: rgba(0, 0, 0, 0.87);\n }\n\n &__arrow {\n width: 2rem;\n height: 2rem;\n border: none;\n background: transparent;\n font-size: 1.5rem;\n color: rgba(0, 0, 0, 0.54);\n cursor: pointer;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: background-color 0.2s ease;\n\n &:hover {\n background-color: rgba(0, 0, 0, 0.04);\n }\n\n &:active {\n background-color: rgba(0, 0, 0, 0.08);\n }\n }\n\n &__weekdays {\n display: grid;\n grid-template-columns: repeat(7, 1fr);\n gap: 0.25rem;\n margin-bottom: 0.5rem;\n }\n\n &__weekday {\n text-align: center;\n font-size: 0.75rem;\n font-weight: 700;\n color: rgba(0, 0, 0, 0.6);\n padding: 0.5rem 0;\n }\n\n &__days {\n display: grid;\n grid-template-columns: repeat(7, 1fr);\n gap: 0.25rem;\n }\n\n &__day {\n aspect-ratio: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 0.875rem;\n font-weight: 500;\n border-radius: 50%;\n cursor: pointer;\n transition: background-color 0.2s ease;\n position: relative;\n\n &:not(&--empty):not(&--disabled):hover {\n background-color: rgba(0, 0, 0, 0.04);\n }\n\n &--empty {\n cursor: default;\n }\n\n &--today {\n color: var(--picker-color);\n font-weight: 700;\n\n &::before {\n content: '';\n position: absolute;\n inset: 0;\n border: 2px solid var(--picker-color);\n border-radius: 50%;\n }\n }\n\n &--selected {\n background-color: var(--picker-color);\n color: white;\n font-weight: 700;\n\n &:hover {\n background-color: var(--picker-color);\n opacity: 0.9;\n }\n\n &::before {\n display: none;\n }\n }\n\n &--disabled {\n color: rgba(0, 0, 0, 0.38);\n cursor: not-allowed;\n pointer-events: none;\n }\n }\n}\n\n// Compact variant (no sidebar)\n:host([compact]) {\n .xplor-inline-date-picker {\n &__sidebar {\n display: none;\n }\n\n &__calendar {\n width: 280px;\n }\n }\n}\n","import { Component, Host, h, Prop, Event, EventEmitter, State, Element, Listen } from '@stencil/core';\n\n@Component({\n tag: 'xplor-inline-date-picker',\n styleUrl: 'xplor-inline-date-picker.scss',\n scoped: true,\n})\nexport class XplorInlineDatePicker {\n @Element() el: HTMLElement;\n /*\n Selected date (YYYY-MM-DD format)\n /\n @Prop({ mutable: true }) selectedDate: string = '';\n\n /\n Minimum selectable date (YYYY-MM-DD format)\n /\n @Prop() min: string = '';\n\n /\n Maximum selectable date (YYYY-MM-DD format)\n /\n @Prop() max: string = '';\n\n /\n Whether the date picker is readonly\n /\n @Prop() readonly: boolean = false;\n\n /\n Primary color\n /\n @Prop() color: string = '#008480';\n\n /\n Whether to start week on Sunday (default: true)\n /\n @Prop() startWeekOnSunday: boolean = true;\n\n /\n Date selection event\n /\n @Event() dateSelected: EventEmitter<string>;\n\n /\n Month change event\n */\n @Event() monthChanged: EventEmitter<{ year: number; month: number }>;\n\n @State() currentYear: number;\n @State() currentMonth: number;\n @State() viewDate: Date;\n @State() focusedDay: number = 0;\n\n private monthNames = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];\n private dayNames = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];\n private dayNamesStartMonday = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'];\n\n componentWillLoad() {\n const date = this.selectedDate ? new Date(this.selectedDate) : new Date();\n this.currentYear = date.getFullYear();\n this.currentMonth = date.getMonth();\n this.viewDate = new Date(this.currentYear, this.currentMonth, 1);\n this.focusedDay = date.getDate();\n }\n\n @Listen('keydown')\n handleKeyDown(event: KeyboardEvent) {\n const daysInMonth = this.getDaysInMonth();\n\n switch (event.key) {\n case 'ArrowLeft':\n event.preventDefault();\n if (this.focusedDay > 1) {\n this.focusedDay--;\n } else {\n this.previousMonth();\n this.focusedDay = this.getDaysInMonth();\n }\n break;\n case 'ArrowRight':\n event.preventDefault();\n if (this.focusedDay < daysInMonth) {\n this.focusedDay++;\n } else {\n this.nextMonth();\n this.focusedDay = 1;\n }\n break;\n case 'ArrowUp':\n event.preventDefault();\n if (this.focusedDay > 7) {\n this.focusedDay -= 7;\n } else {\n this.previousMonth();\n this.focusedDay = this.getDaysInMonth() - (7 - this.focusedDay);\n }\n break;\n case 'ArrowDown':\n event.preventDefault();\n if (this.focusedDay + 7 <= daysInMonth) {\n this.focusedDay += 7;\n } else {\n const remainder = this.focusedDay + 7 - daysInMonth;\n this.nextMonth();\n this.focusedDay = remainder;\n }\n break;\n case 'Enter':\n case ' ':\n event.preventDefault();\n if (this.focusedDay >= 1 && this.focusedDay <= daysInMonth) {\n this.selectDate(this.focusedDay);\n }\n break;\n default:\n return;\n }\n\n // Focus the day cell after render\n requestAnimationFrame(() => {\n const dayEl = this.el.querySelector(`[data-day=\"${this.focusedDay}\"]`) as HTMLElement;\n if (dayEl) dayEl.focus();\n });\n }\n\n private previousMonth = () => {\n if (this.currentMonth === 0) {\n this.currentMonth = 11;\n this.currentYear--;\n } else {\n this.currentMonth--;\n }\n this.viewDate = new Date(this.currentYear, this.currentMonth, 1);\n this.monthChanged.emit({ year: this.currentYear, month: this.currentMonth });\n };\n\n private nextMonth = () => {\n if (this.currentMonth === 11) {\n this.currentMonth = 0;\n this.currentYear++;\n } else {\n this.currentMonth++;\n }\n this.viewDate = new Date(this.currentYear, this.currentMonth, 1);\n this.monthChanged.emit({ year: this.currentYear, month: this.currentMonth });\n };\n\n private selectDate = (day: number) => {\n if (this.readonly) return;\n\n const date = new Date(this.currentYear, this.currentMonth, day);\n const dateString = this.formatDate(date);\n\n if (this.isDateDisabled(date)) return;\n\n this.selectedDate = dateString;\n this.dateSelected.emit(dateString);\n };\n\n private formatDate = (date: Date): string => {\n const year = date.getFullYear();\n const month = String(date.getMonth() + 1).padStart(2, '0');\n const day = String(date.getDate()).padStart(2, '0');\n return `${year}-${month}-${day}`;\n };\n\n private isDateDisabled = (date: Date): boolean => {\n if (this.min) {\n const minDate = new Date(this.min);\n if (date < minDate) return true;\n }\n if (this.max) {\n const maxDate = new Date(this.max);\n if (date > maxDate) return true;\n }\n return false;\n };\n\n private isToday = (day: number): boolean => {\n const today = new Date();\n return (\n day === today.getDate() &&\n this.currentMonth === today.getMonth() &&\n this.currentYear === today.getFullYear()\n );\n };\n\n private isSelected = (day: number): boolean => {\n if (!this.selectedDate) return false;\n const selected = new Date(this.selectedDate);\n return (\n day === selected.getDate() &&\n this.currentMonth === selected.getMonth() &&\n this.currentYear === selected.getFullYear()\n );\n };\n\n private getDaysInMonth = (): number => {\n return new Date(this.currentYear, this.currentMonth + 1, 0).getDate();\n };\n\n private getFirstDayOfMonth = (): number => {\n const firstDay = new Date(this.currentYear, this.currentMonth, 1).getDay();\n return this.startWeekOnSunday ? firstDay : (firstDay === 0 ? 6 : firstDay - 1);\n };\n\n private renderCalendarDays = () => {\n const daysInMonth = this.getDaysInMonth();\n const firstDay = this.getFirstDayOfMonth();\n const days = [];\n\n // Empty cells for days before the first of the month\n for (let i = 0; i < firstDay; i++) {\n days.push(<div class=\"xplor-inline-date-picker__day xplor-inline-date-picker__day--empty\"></div>);\n }\n\n // Days of the month\n for (let day = 1; day <= daysInMonth; day++) {\n const date = new Date(this.currentYear, this.currentMonth, day);\n const isDisabled = this.isDateDisabled(date);\n const isToday = this.isToday(day);\n const isSelected = this.isSelected(day);\n\n days.push(\n <div\n class={{\n 'xplor-inline-date-picker__day': true,\n 'xplor-inline-date-picker__day--today': isToday,\n 'xplor-inline-date-picker__day--selected': isSelected,\n 'xplor-inline-date-picker__day--disabled': isDisabled,\n }}\n onClick={() => !isDisabled && this.selectDate(day)}\n role=\"gridcell\"\n aria-selected={isSelected ? 'true' : 'false'}\n aria-current={isToday ? 'date' : undefined}\n aria-disabled={isDisabled ? 'true' : undefined}\n tabIndex={day === this.focusedDay ? 0 : -1}\n data-day={day}\n >\n {day}\n </div>\n );\n }\n\n return days;\n };\n\n private getSidebarDate = () => {\n const date = this.selectedDate ? new Date(this.selectedDate) : new Date();\n const dayNames = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];\n const monthNames = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];\n\n return {\n year: date.getFullYear(),\n day: dayNames[date.getDay()],\n date: `${monthNames[date.getMonth()]} ${date.getDate()}`,\n };\n };\n\n render() {\n const sidebarDate = this.getSidebarDate();\n const dayHeaders = this.startWeekOnSunday ? this.dayNames : this.dayNamesStartMonday;\n\n return (\n <Host>\n <div class=\"xplor-inline-date-picker\" style={{ '--picker-color': this.color }}>\n <div class=\"xplor-inline-date-picker__sidebar\">\n <div class=\"xplor-inline-date-picker__sidebar-year\">{sidebarDate.year}</div>\n <div class=\"xplor-inline-date-picker__sidebar-day\">{sidebarDate.day},</div>\n <div class=\"xplor-inline-date-picker__sidebar-date\">{sidebarDate.date}</div>\n </div>\n\n <div class=\"xplor-inline-date-picker__calendar\">\n <div class=\"xplor-inline-date-picker__header\">\n <button\n type=\"button\"\n class=\"xplor-inline-date-picker__arrow\"\n onClick={this.previousMonth}\n aria-label=\"Previous month\"\n >\n ‹\n </button>\n <div class=\"xplor-inline-date-picker__title\">\n {this.monthNames[this.currentMonth]} {this.currentYear}\n </div>\n <button\n type=\"button\"\n class=\"xplor-inline-date-picker__arrow\"\n onClick={this.nextMonth}\n aria-label=\"Next month\"\n >\n ›\n </button>\n </div>\n\n <div class=\"xplor-inline-date-picker__weekdays\">\n {dayHeaders.map((day) => (\n <div class=\"xplor-inline-date-picker__weekday\">{day}</div>\n ))}\n </div>\n\n <div class=\"xplor-inline-date-picker__days\" role=\"grid\">{this.renderCalendarDays()}</div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/components/{p-BRWe4TXp.js → p-C-gHaxf1.js} RENAMED Viewed

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, c as createEvent, h, a as Host } from './index.js';
-const xplorModalCss = "@tailwind base;\n@tailwind components;\n@tailwind utilities;\n@layer base {\n  \n  :root {\n    --color-primary: #db3b03;\n    --color-primary-50: rgba(255, 152, 0, 1);\n    --color-secondary: rgb(0, 119, 107);\n    --color-secondary-50: rgba(1, 163, 157, 1);\n    --color-tertiary: rgb(128, 104, 186);\n    --color-tertiary: rgb(223, 242, 241);\n    --color-white: white;\n    --color-emphasis: rgb(8, 8, 9);\n    --color-supergiant: rgb(213, 66, 99);\n    --color-orange: rgb(250, 200, 127);\n    --color-buttons: #fbbc05;\n    --color-typography: #ea4335;\n    --background: 20 66% 99%;\n    --foreground: 20 51% 4%;\n    --muted: 20 25% 86%;\n    --muted-foreground: 20 7% 25%;\n    --popover: 20 66% 98%;\n    --popover-foreground: 20 51% 3%;\n    --card: 20 66% 98%;\n    --card-foreground: 20 51% 3%;\n    --border: 20 15% 94%;\n    --input: 20 15% 94%;\n    --primary: 20 48% 72%;\n    --primary-foreground: 20 48% 12%;\n    --secondary: 20 12% 92%;\n    --secondary-foreground: 20 12% 32%;\n    --accent: 20 12% 92%;\n    --accent-foreground: 20 12% 32%;\n    --destructive: 11 80% 22%;\n    --destructive-foreground: 11 80% 82%;\n    --ring: 20 48% 72%;\n    --radius: 0.5rem;\n    --chart-1: 12 76% 61%;\n    --chart-2: 173 58% 39%;\n    --chart-3: 197 37% 24%;\n    --chart-4: 43 74% 66%;\n    --chart-5: 27 87% 67%;\n  }\n  .dark {\n    --background: 253 43% 3%;\n    --foreground: 253 31% 98%;\n    --muted: 253 7% 13%;\n    --muted-foreground: 253 13% 63%;\n    --popover: 253 43% 3%;\n    --popover-foreground: 253 31% 98%;\n    --card: 253 43% 4%;\n    --card-foreground: 253 31% 99%;\n    --border: 215 27.9% 16.9%;\n    --input: 215 27.9% 16.9%;\n    --primary: 253 91% 58%;\n    --primary-foreground: 253 91% 98%;\n    --secondary: 253 7% 9%;\n    --secondary-foreground: 253 7% 69%;\n    --accent: 253 13% 14%;\n    --accent-foreground: 253 13% 74%;\n    --destructive: 339.2 90.36% 51.18%;\n    --destructive-foreground: 0 0% 100%;\n    --ring: 253 91% 58%;\n    --chart-1: 220 70% 50%;\n    --chart-2: 160 60% 45%;\n    --chart-3: 30 80% 55%;\n    --chart-4: 280 65% 60%;\n    --chart-5: 340 75% 55%;\n  }\n}\n@layer base {\n  * {\n    @apply border-border;\n  }\n  body {\n    @apply box-border bg-background text-foreground;\n  }\n}\n@layer utilities {\n  .min-h-screen {\n    min-height: 100vh;\n    \n    min-height: 100dvh;\n  }\n  .h-screen {\n    height: 100vh;\n    \n    height: 100dvh;\n  }\n}\n@tailwind base;\n@tailwind components;\n@tailwind utilities;\n@layer components {\n  .glass {\n    border: none;\n    backdrop-filter: blur(var(--glass-blur, 40px));\n    background-color: transparent;\n    background-image: linear-gradient(135deg, rgb(255, 255, 255, var(--glass-opacity, 30%)), transparent), linear-gradient(var(--glass-reflex-degree, 100deg), rgb(255, 255, 255, var(--glass-reflex-opacity, 10%)) 25%, transparent 0);\n    box-shadow: 0 0 0 1px rgb(255, 255, 255, var(--glass-border-opacity, 10%)) inset, 0 0 0 2px rgba(0, 0, 0, 0.05);\n    text-shadow: 0 1px rgb(0, 0, 0, var(--glass-text-shadow-opacity, 5%));\n  }\n}\n.tox.tox-tinymce.sc-xplor-modal {\n  width: 50% !important;\n  height: 400px !important;\n  display: inline-flex;\n}\n\n\n@media only screen and (min-width: 600px) {\n  .tox.tox-tinymce.sc-xplor-modal {\n    width: 600px !important;\n  }\n}\nh1.sc-xplor-modal {\n  color: var(--color-primary);\n  \n  font-family: Inter;\n  font-size: 48px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 56px; \n}\n\nh2.sc-xplor-modal {\n  color: var(--grey-1100252525, #252525);\n  \n  font-family: Inter;\n  font-size: 32px;\n  font-style: normal;\n  font-weight: 600;\n  line-height: 38px; \n  letter-spacing: 0.25px;\n}\n\nh3.sc-xplor-modal {\n  color: var(--grey-1100252525, #252525);\n  \n  font-family: Inter;\n  font-size: 24px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 32px; \n}\n\n.overline.sc-xplor-modal {\n  color: var(--grey-1100252525, #252525);\n  \n  font-family: Inter;\n  font-size: 12px;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 16px; \n  letter-spacing: 3.2px;\n  text-transform: uppercase;\n}\n\nol.sc-xplor-modal, ul.sc-xplor-modal {\n  list-style: none;\n  margin: 1rem;\n  padding: 0;\n}\nol.sc-xplor-modal li.sc-xplor-modal, ul.sc-xplor-modal li.sc-xplor-modal {\n  margin: 1rem;\n  padding: 0;\n}\nol.mdc-list.sc-xplor-modal, ul.mdc-list.sc-xplor-modal {\n  list-style-type: none;\n  list-style: none;\n}\nol.mdc-list.sc-xplor-modal li.mdc-list-item.sc-xplor-modal, ul.mdc-list.sc-xplor-modal li.mdc-list-item.sc-xplor-modal {\n  list-style-type: none;\n  list-style: none !important;\n}\n\n.orange-label.sc-xplor-modal {\n  color: var(--Orange-900-Primary, #db3b03);\n  \n  font-family: Inter;\n  font-size: 12px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 16px; \n  letter-spacing: 0.4px;\n  margin: 0px 0 -9px 16px;\n  z-index: 1 !important;\n  position: relative;\n  width: fit-content;\n}\n.orange-label.grey-bg.sc-xplor-modal {\n  background-color: #fefcfb;\n}\n\n#spinnerLoader.sc-xplor-modal {\n  position: fixed;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  background-color: #fff;\n  padding: 20px;\n  border-radius: 5px;\n  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 100;\n  pointer-events: none;\n}\n\n#textfield-Title-label.sc-xplor-modal {\n  background-color: white;\n}\n\n.mdc-ripple-upgraded.sc-xplor-modal .mdc-text-field--outlined.sc-xplor-modal .mdc-notched-outline__notch.sc-xplor-modal {\n  border: 0px solid transparent !important;\n  border-bottom: 1px solid #db3b03 !important;\n  padding: 0;\n  height: 0;\n}\n\n.mdc-text-field--focused.sc-xplor-modal .mdc-notched-outline__notch.sc-xplor-modal {\n  border: 0px solid transparent !important;\n  border-bottom: 2px solid #db3b03 !important;\n}\n\n.mdc-text-field--outlined.sc-xplor-modal .mdc-notched-outline.sc-xplor-modal .mdc-notched-outline__notch.sc-xplor-modal {\n  max-width: calc(100% - max(12px, var(--mdc-shape-small, 4px)) * 2);\n  border-top: transparent;\n}\n\n.generate-btn.sc-xplor-modal {\n  display: flex;\n  height: 48px;\n  padding: 12px 24px;\n  justify-content: center;\n  align-items: center;\n  gap: 10px;\n  border-radius: 16px;\n}\n.generate-btn.link.sc-xplor-modal:hover {\n  background-color: var(--Cyan-700-Secondary, #e27046);\n  color: var(--Cyan-700-Secondary-Text, #fff);\n}\n\n.bg-green.sc-xplor-modal {\n  background: var(--Cyan-700-Secondary, #00776b);\n}\n\n.sc-xplor-modal-h {\n  display: contents;\n}\n\n.xplor-modal__backdrop.sc-xplor-modal {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background-color: rgba(0, 0, 0, 0.5);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 2000;\n  padding: 1rem;\n}\n.xplor-modal__card.sc-xplor-modal {\n  position: relative;\n  background-color: white;\n  border-radius: 1rem;\n  padding: 1rem;\n  max-width: 90vw;\n  display: flex;\n  flex-direction: column;\n  box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);\n  animation: xplor-modal-fade-in 0.2s ease-out;\n}\n.xplor-modal__card--scrollable.sc-xplor-modal {\n  overflow: hidden;\n}\n.xplor-modal__close-btn.sc-xplor-modal {\n  position: absolute;\n  top: 1rem;\n  right: 1rem;\n  width: 2.25rem;\n  height: 2.25rem;\n  border: none;\n  background-color: white;\n  color: #008480;\n  font-size: 1rem;\n  cursor: pointer;\n  border-radius: 4px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: background-color 0.2s ease;\n  z-index: 1;\n}\n.xplor-modal__close-btn.sc-xplor-modal:hover {\n  background-color: #E6F7F7;\n}\n.xplor-modal__close-btn.sc-xplor-modal:active {\n  background-color: #D0EBD2;\n}\n.xplor-modal__title.sc-xplor-modal {\n  padding-right: 3rem;\n  margin-bottom: 0.5rem;\n  font-size: 1.5rem;\n  font-weight: 500;\n  color: rgba(0, 0, 0, 0.87);\n  white-space: normal;\n  word-wrap: break-word;\n}\n.xplor-modal__subtitle.sc-xplor-modal {\n  margin: 0.5rem;\n  margin-bottom: 1rem;\n  font-size: 0.875rem;\n  color: rgba(0, 0, 0, 0.6);\n}\n.xplor-modal__body.sc-xplor-modal {\n  flex: 1;\n  overflow-y: auto;\n  margin-bottom: 1rem;\n}\n.xplor-modal__body--no-title.sc-xplor-modal {\n  margin-top: 3.5rem;\n}\n.xplor-modal__actions.sc-xplor-modal {\n  display: flex;\n  gap: 0.5rem;\n  justify-content: flex-end;\n  margin: 1rem 0;\n}\n.xplor-modal__loading.sc-xplor-modal {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 3rem;\n}\n.xplor-modal__spinner.sc-xplor-modal {\n  width: 3rem;\n  height: 3rem;\n  border: 4px solid rgba(0, 0, 0, 0.1);\n  border-top-color: #008480;\n  border-radius: 50%;\n  animation: xplor-spinner-rotate 0.8s linear infinite;\n}\n\n@keyframes xplor-modal-fade-in {\n  from {\n    opacity: 0;\n    transform: scale(0.95);\n  }\n  to {\n    opacity: 1;\n    transform: scale(1);\n  }\n}\n@keyframes xplor-spinner-rotate {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}";
+const xplorModalCss = "@tailwind base;\n@tailwind components;\n@tailwind utilities;\n@layer base {\n  \n  :root {\n    --color-primary: #db3b03;\n    --color-primary-50: rgba(255, 152, 0, 1);\n    --color-secondary: rgb(0, 119, 107);\n    --color-secondary-50: rgba(1, 163, 157, 1);\n    --color-tertiary: rgb(128, 104, 186);\n    --color-tertiary: rgb(223, 242, 241);\n    --color-white: white;\n    --color-emphasis: rgb(8, 8, 9);\n    --color-supergiant: rgb(213, 66, 99);\n    --color-orange: rgb(250, 200, 127);\n    --color-buttons: #fbbc05;\n    --color-typography: #ea4335;\n    --background: 20 66% 99%;\n    --foreground: 20 51% 4%;\n    --muted: 20 25% 86%;\n    --muted-foreground: 20 7% 25%;\n    --popover: 20 66% 98%;\n    --popover-foreground: 20 51% 3%;\n    --card: 20 66% 98%;\n    --card-foreground: 20 51% 3%;\n    --border: 20 15% 94%;\n    --input: 20 15% 94%;\n    --primary: 20 48% 72%;\n    --primary-foreground: 20 48% 12%;\n    --secondary: 20 12% 92%;\n    --secondary-foreground: 20 12% 32%;\n    --accent: 20 12% 92%;\n    --accent-foreground: 20 12% 32%;\n    --destructive: 11 80% 22%;\n    --destructive-foreground: 11 80% 82%;\n    --ring: 20 48% 72%;\n    --radius: 0.5rem;\n    --chart-1: 12 76% 61%;\n    --chart-2: 173 58% 39%;\n    --chart-3: 197 37% 24%;\n    --chart-4: 43 74% 66%;\n    --chart-5: 27 87% 67%;\n  }\n  .dark {\n    --background: 253 43% 3%;\n    --foreground: 253 31% 98%;\n    --muted: 253 7% 13%;\n    --muted-foreground: 253 13% 63%;\n    --popover: 253 43% 3%;\n    --popover-foreground: 253 31% 98%;\n    --card: 253 43% 4%;\n    --card-foreground: 253 31% 99%;\n    --border: 215 27.9% 16.9%;\n    --input: 215 27.9% 16.9%;\n    --primary: 253 91% 58%;\n    --primary-foreground: 253 91% 98%;\n    --secondary: 253 7% 9%;\n    --secondary-foreground: 253 7% 69%;\n    --accent: 253 13% 14%;\n    --accent-foreground: 253 13% 74%;\n    --destructive: 339.2 90.36% 51.18%;\n    --destructive-foreground: 0 0% 100%;\n    --ring: 253 91% 58%;\n    --chart-1: 220 70% 50%;\n    --chart-2: 160 60% 45%;\n    --chart-3: 30 80% 55%;\n    --chart-4: 280 65% 60%;\n    --chart-5: 340 75% 55%;\n  }\n}\n@layer base {\n  * {\n    @apply border-border;\n  }\n  body {\n    @apply box-border bg-background text-foreground;\n  }\n}\n@layer utilities {\n  .min-h-screen {\n    min-height: 100vh;\n    \n    min-height: 100dvh;\n  }\n  .h-screen {\n    height: 100vh;\n    \n    height: 100dvh;\n  }\n}\n@tailwind base;\n@tailwind components;\n@tailwind utilities;\n@layer components {\n  .glass {\n    border: none;\n    backdrop-filter: blur(var(--glass-blur, 40px));\n    background-color: transparent;\n    background-image: linear-gradient(135deg, rgb(255, 255, 255, var(--glass-opacity, 30%)), transparent), linear-gradient(var(--glass-reflex-degree, 100deg), rgb(255, 255, 255, var(--glass-reflex-opacity, 10%)) 25%, transparent 0);\n    box-shadow: 0 0 0 1px rgb(255, 255, 255, var(--glass-border-opacity, 10%)) inset, 0 0 0 2px rgba(0, 0, 0, 0.05);\n    text-shadow: 0 1px rgb(0, 0, 0, var(--glass-text-shadow-opacity, 5%));\n  }\n}\n.tox.tox-tinymce.sc-xplor-modal {\n  width: 50% !important;\n  height: 400px !important;\n  display: inline-flex;\n}\n\n\n@media only screen and (min-width: 600px) {\n  .tox.tox-tinymce.sc-xplor-modal {\n    width: 600px !important;\n  }\n}\nh1.sc-xplor-modal {\n  color: var(--color-primary);\n  \n  font-family: Inter;\n  font-size: 48px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 56px; \n}\n\nh2.sc-xplor-modal {\n  color: var(--grey-1100252525, #252525);\n  \n  font-family: Inter;\n  font-size: 32px;\n  font-style: normal;\n  font-weight: 600;\n  line-height: 38px; \n  letter-spacing: 0.25px;\n}\n\nh3.sc-xplor-modal {\n  color: var(--grey-1100252525, #252525);\n  \n  font-family: Inter;\n  font-size: 24px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 32px; \n}\n\n.overline.sc-xplor-modal {\n  color: var(--grey-1100252525, #252525);\n  \n  font-family: Inter;\n  font-size: 12px;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 16px; \n  letter-spacing: 3.2px;\n  text-transform: uppercase;\n}\n\nol.sc-xplor-modal, ul.sc-xplor-modal {\n  list-style: none;\n  margin: 1rem;\n  padding: 0;\n}\nol.sc-xplor-modal li.sc-xplor-modal, ul.sc-xplor-modal li.sc-xplor-modal {\n  margin: 1rem;\n  padding: 0;\n}\nol.mdc-list.sc-xplor-modal, ul.mdc-list.sc-xplor-modal {\n  list-style-type: none;\n  list-style: none;\n}\nol.mdc-list.sc-xplor-modal li.mdc-list-item.sc-xplor-modal, ul.mdc-list.sc-xplor-modal li.mdc-list-item.sc-xplor-modal {\n  list-style-type: none;\n  list-style: none !important;\n}\n\n.orange-label.sc-xplor-modal {\n  color: var(--Orange-900-Primary, #db3b03);\n  \n  font-family: Inter;\n  font-size: 12px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 16px; \n  letter-spacing: 0.4px;\n  margin: 0px 0 -9px 16px;\n  z-index: 1 !important;\n  position: relative;\n  width: fit-content;\n}\n.orange-label.grey-bg.sc-xplor-modal {\n  background-color: #fefcfb;\n}\n\n#spinnerLoader.sc-xplor-modal {\n  position: fixed;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  background-color: #fff;\n  padding: 20px;\n  border-radius: 5px;\n  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 100;\n  pointer-events: none;\n}\n\n#textfield-Title-label.sc-xplor-modal {\n  background-color: white;\n}\n\n.mdc-ripple-upgraded.sc-xplor-modal .mdc-text-field--outlined.sc-xplor-modal .mdc-notched-outline__notch.sc-xplor-modal {\n  border: 0px solid transparent !important;\n  border-bottom: 1px solid #db3b03 !important;\n  padding: 0;\n  height: 0;\n}\n\n.mdc-text-field--focused.sc-xplor-modal .mdc-notched-outline__notch.sc-xplor-modal {\n  border: 0px solid transparent !important;\n  border-bottom: 2px solid #db3b03 !important;\n}\n\n.mdc-text-field--outlined.sc-xplor-modal .mdc-notched-outline.sc-xplor-modal .mdc-notched-outline__notch.sc-xplor-modal {\n  max-width: calc(100% - max(12px, var(--mdc-shape-small, 4px)) * 2);\n  border-top: transparent;\n}\n\n.generate-btn.sc-xplor-modal {\n  display: flex;\n  height: 48px;\n  padding: 12px 24px;\n  justify-content: center;\n  align-items: center;\n  gap: 10px;\n  border-radius: 16px;\n}\n.generate-btn.link.sc-xplor-modal:hover {\n  background-color: var(--Cyan-700-Secondary, #e27046);\n  color: var(--Cyan-700-Secondary-Text, #fff);\n}\n\n.bg-green.sc-xplor-modal {\n  background: var(--Cyan-700-Secondary, #00776b);\n}\n\n.sc-xplor-modal-h {\n  display: contents;\n}\n\n.xplor-modal__backdrop.sc-xplor-modal {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background-color: rgba(0, 0, 0, 0.5);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 2000;\n  padding: 1rem;\n}\n.xplor-modal__card.sc-xplor-modal {\n  position: relative;\n  background-color: white;\n  border-radius: 1rem;\n  padding: 2rem 2.25rem;\n  max-width: 90vw;\n  display: flex;\n  flex-direction: column;\n  box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);\n  animation: xplor-modal-fade-in 0.2s ease-out;\n}\n.xplor-modal__card--scrollable.sc-xplor-modal {\n  overflow: hidden;\n}\n.xplor-modal__close-btn.sc-xplor-modal {\n  position: absolute;\n  top: 2rem;\n  right: 2.25rem;\n  width: 3rem;\n  height: 3rem;\n  border: none;\n  background-color: #DFF2F1;\n  color: #008480;\n  font-size: 1rem;\n  cursor: pointer;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: background-color 0.2s ease;\n  z-index: 1;\n}\n.xplor-modal__close-btn.sc-xplor-modal:hover {\n  background-color: #C5E8E6;\n}\n.xplor-modal__close-btn.sc-xplor-modal:active {\n  background-color: #B0DFDD;\n}\n.xplor-modal__title.sc-xplor-modal {\n  padding-right: 3.5rem;\n  margin-bottom: 0.5rem;\n  font-size: 1.5rem;\n  font-weight: 500;\n  color: rgba(0, 0, 0, 0.87);\n  white-space: normal;\n  word-wrap: break-word;\n}\n.xplor-modal__subtitle.sc-xplor-modal {\n  margin: 0.5rem;\n  margin-bottom: 1rem;\n  font-size: 0.875rem;\n  color: rgba(0, 0, 0, 0.6);\n}\n.xplor-modal__body.sc-xplor-modal {\n  flex: 1;\n  overflow-y: auto;\n  margin-bottom: 1rem;\n}\n.xplor-modal__body--no-title.sc-xplor-modal {\n  margin-top: 3.5rem;\n}\n.xplor-modal__actions.sc-xplor-modal {\n  display: flex;\n  gap: 0.5rem;\n  justify-content: flex-end;\n  margin: 1rem 0;\n}\n.xplor-modal__loading.sc-xplor-modal {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 3rem;\n}\n.xplor-modal__spinner.sc-xplor-modal {\n  width: 3rem;\n  height: 3rem;\n  border: 4px solid rgba(0, 0, 0, 0.1);\n  border-top-color: #008480;\n  border-radius: 50%;\n  animation: xplor-spinner-rotate 0.8s linear infinite;\n}\n\n@keyframes xplor-modal-fade-in {\n  from {\n    opacity: 0;\n    transform: scale(0.95);\n  }\n  to {\n    opacity: 1;\n    transform: scale(1);\n  }\n}\n@keyframes xplor-spinner-rotate {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}";
 const XplorModal = /*@__PURE__*/ proxyCustomElement(class XplorModal extends H {
     constructor() {
@@ -172,6 +172,6 @@ function defineCustomElement() {
 }
 export { XplorModal as X, defineCustomElement as d };
-//# sourceMappingURL=p-BRWe4TXp.js.map
+//# sourceMappingURL=p-C-gHaxf1.js.map
-//# sourceMappingURL=p-BRWe4TXp.js.map
+//# sourceMappingURL=p-C-gHaxf1.js.map

package/components/p-C-gHaxf1.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"p-C-gHaxf1.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/xplor-modal/xplor-modal.scss?tag=xplor-modal&encapsulation=scoped","src/components/xplor-modal/xplor-modal.tsx"],"sourcesContent":[":host {\n display: contents;\n}\n\n.xplor-modal {\n &__backdrop {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: rgba(0, 0, 0, 0.5);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 2000;\n padding: 1rem;\n }\n\n &__card {\n position: relative;\n background-color: white;\n border-radius: 1rem;\n padding: 2rem 2.25rem;\n max-width: 90vw;\n display: flex;\n flex-direction: column;\n box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2),\n 0px 24px 38px 3px rgba(0, 0, 0, 0.14),\n 0px 9px 46px 8px rgba(0, 0, 0, 0.12);\n animation: xplor-modal-fade-in 0.2s ease-out;\n\n &--scrollable {\n overflow: hidden;\n }\n }\n\n &__close-btn {\n position: absolute;\n top: 2rem;\n right: 2.25rem;\n width: 3rem;\n height: 3rem;\n border: none;\n background-color: #DFF2F1;\n color: #008480;\n font-size: 1rem;\n cursor: pointer;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: background-color 0.2s ease;\n z-index: 1;\n\n &:hover {\n background-color: #C5E8E6;\n }\n\n &:active {\n background-color: #B0DFDD;\n }\n }\n\n &__title {\n padding-right: 3.5rem;\n margin-bottom: 0.5rem;\n font-size: 1.5rem;\n font-weight: 500;\n color: rgba(0, 0, 0, 0.87);\n white-space: normal;\n word-wrap: break-word;\n }\n\n &__subtitle {\n margin: 0.5rem;\n margin-bottom: 1rem;\n font-size: 0.875rem;\n color: rgba(0, 0, 0, 0.6);\n }\n\n &__body {\n flex: 1;\n overflow-y: auto;\n margin-bottom: 1rem;\n\n &--no-title {\n margin-top: 3.5rem;\n }\n }\n\n &__actions {\n display: flex;\n gap: 0.5rem;\n justify-content: flex-end;\n margin: 1rem 0;\n }\n\n &__loading {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 3rem;\n }\n\n &__spinner {\n width: 3rem;\n height: 3rem;\n border: 4px solid rgba(0, 0, 0, 0.1);\n border-top-color: #008480;\n border-radius: 50%;\n animation: xplor-spinner-rotate 0.8s linear infinite;\n }\n}\n\n@keyframes xplor-modal-fade-in {\n from {\n opacity: 0;\n transform: scale(0.95);\n }\n to {\n opacity: 1;\n transform: scale(1);\n }\n}\n\n@keyframes xplor-spinner-rotate {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}\n","import { Component, Host, h, Prop, Event, EventEmitter, Watch, Element, Listen } from '@stencil/core';\n\n@Component({\n tag: 'xplor-modal',\n styleUrl: 'xplor-modal.scss',\n scoped: true,\n})\nexport class XplorModal {\n /**\n * Whether the modal is open\n */\n @Prop({ mutable: true }) open: boolean = false;\n\n /**\n * Modal width\n */\n @Prop() width: string = '600px';\n\n /**\n * Maximum width\n */\n @Prop() maxWidth: string = '90%';\n\n /**\n * Maximum height\n */\n @Prop() maxHeight: string = '90%';\n\n /**\n * Whether the modal content is scrollable\n */\n @Prop() scrollable: boolean = true;\n\n /**\n * Persistent mode - prevents closing on backdrop click\n */\n @Prop() persistent: boolean = false;\n\n /**\n * Loading state\n */\n @Prop() loading: boolean = false;\n\n /**\n * Whether to show the title area (for spacing)\n */\n @Prop() showTitle: boolean = true;\n\n /**\n * Accessible label for the modal (used if no title slot)\n */\n @Prop() ariaLabel: string;\n\n /**\n * Close event\n */\n @Event() xplorClose: EventEmitter<void>;\n\n @Element() el: HTMLElement;\n\n private previouslyFocusedElement: HTMLElement | null = null;\n private dialogEl: HTMLElement;\n\n @Watch('open')\n handleOpenChange(newValue: boolean) {\n if (newValue) {\n document.body.style.overflow = 'hidden';\n this.previouslyFocusedElement = document.activeElement as HTMLElement;\n requestAnimationFrame(() => {\n this.setInitialFocus();\n });\n } else {\n document.body.style.overflow = '';\n if (this.previouslyFocusedElement) {\n this.previouslyFocusedElement.focus();\n this.previouslyFocusedElement = null;\n }\n }\n }\n\n disconnectedCallback() {\n document.body.style.overflow = '';\n }\n\n @Listen('keydown')\n handleKeyDown(event: KeyboardEvent) {\n if (!this.open) return;\n\n if (event.key === 'Escape' && !this.persistent) {\n event.preventDefault();\n this.closeModal();\n return;\n }\n\n if (event.key === 'Tab') {\n this.trapFocus(event);\n }\n }\n\n private getFocusableElements(): HTMLElement[] {\n if (!this.dialogEl) return [];\n const selectors = 'a[href], button:not([disabled]), textarea:not([disabled]), input:not([disabled]), select:not([disabled]), [tabindex]:not([tabindex=\"-1\"])';\n return Array.from(this.dialogEl.querySelectorAll(selectors)) as HTMLElement[];\n }\n\n private trapFocus(event: KeyboardEvent) {\n const focusableElements = this.getFocusableElements();\n if (focusableElements.length === 0) return;\n\n const firstElement = focusableElements[0];\n const lastElement = focusableElements[focusableElements.length - 1];\n\n if (event.shiftKey) {\n if (document.activeElement === firstElement) {\n event.preventDefault();\n lastElement.focus();\n }\n } else {\n if (document.activeElement === lastElement) {\n event.preventDefault();\n firstElement.focus();\n }\n }\n }\n\n private setInitialFocus() {\n const focusableElements = this.getFocusableElements();\n if (focusableElements.length > 0) {\n focusableElements[0].focus();\n } else if (this.dialogEl) {\n this.dialogEl.focus();\n }\n }\n\n private handleBackdropClick = () => {\n if (!this.persistent) {\n this.closeModal();\n }\n };\n\n private handleCardClick = (event: Event) => {\n event.stopPropagation();\n };\n\n private closeModal = () => {\n this.open = false;\n this.xplorClose.emit();\n };\n\n render() {\n if (!this.open) {\n return null;\n }\n\n const cardClasses = {\n 'xplor-modal__card': true,\n 'xplor-modal__card--scrollable': this.scrollable,\n };\n\n const bodyClasses = {\n 'xplor-modal__body': true,\n 'xplor-modal__body--no-title': !this.showTitle,\n };\n\n return (\n <Host>\n <div class=\"xplor-modal__backdrop\" onClick={this.handleBackdropClick}>\n <div\n class={cardClasses}\n style={{\n width: this.width,\n maxWidth: this.maxWidth,\n maxHeight: this.maxHeight,\n }}\n onClick={this.handleCardClick}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby={this.ariaLabel ? undefined : 'xplor-modal-title'}\n aria-label={this.ariaLabel}\n tabindex=\"-1\"\n ref={(el) => (this.dialogEl = el)}\n >\n <button\n type=\"button\"\n class=\"xplor-modal__close-btn\"\n onClick={this.closeModal}\n aria-label=\"Close modal\"\n data-testid=\"common-modal-close-button\"\n >\n ✕\n </button>\n\n <div class=\"xplor-modal__title\" id=\"xplor-modal-title\">\n <slot name=\"title\" />\n </div>\n\n <div class=\"xplor-modal__subtitle\">\n <slot name=\"subtitle\" />\n </div>\n\n <div class={bodyClasses}>\n {this.loading ? (\n <div class=\"xplor-modal__loading\" role=\"status\" aria-label=\"Loading\">\n <div class=\"xplor-modal__spinner\"></div>\n </div>\n ) : ([\n <slot name=\"body\" />,\n <slot />\n ])}\n </div>\n\n <div class=\"xplor-modal__actions\">\n <slot name=\"actions\" />\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/components/{p-Bs_ocvfe.js → p-CyGsSa4H.js} RENAMED Viewed

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, h, a as Host } from './index.js';
-const xplorButtonCss = "@tailwind base;\n@tailwind components;\n@tailwind utilities;\n@layer base {\n  \n  :root {\n    --color-primary: #db3b03;\n    --color-primary-50: rgba(255, 152, 0, 1);\n    --color-secondary: rgb(0, 119, 107);\n    --color-secondary-50: rgba(1, 163, 157, 1);\n    --color-tertiary: rgb(128, 104, 186);\n    --color-tertiary: rgb(223, 242, 241);\n    --color-white: white;\n    --color-emphasis: rgb(8, 8, 9);\n    --color-supergiant: rgb(213, 66, 99);\n    --color-orange: rgb(250, 200, 127);\n    --color-buttons: #fbbc05;\n    --color-typography: #ea4335;\n    --background: 20 66% 99%;\n    --foreground: 20 51% 4%;\n    --muted: 20 25% 86%;\n    --muted-foreground: 20 7% 25%;\n    --popover: 20 66% 98%;\n    --popover-foreground: 20 51% 3%;\n    --card: 20 66% 98%;\n    --card-foreground: 20 51% 3%;\n    --border: 20 15% 94%;\n    --input: 20 15% 94%;\n    --primary: 20 48% 72%;\n    --primary-foreground: 20 48% 12%;\n    --secondary: 20 12% 92%;\n    --secondary-foreground: 20 12% 32%;\n    --accent: 20 12% 92%;\n    --accent-foreground: 20 12% 32%;\n    --destructive: 11 80% 22%;\n    --destructive-foreground: 11 80% 82%;\n    --ring: 20 48% 72%;\n    --radius: 0.5rem;\n    --chart-1: 12 76% 61%;\n    --chart-2: 173 58% 39%;\n    --chart-3: 197 37% 24%;\n    --chart-4: 43 74% 66%;\n    --chart-5: 27 87% 67%;\n  }\n  .dark {\n    --background: 253 43% 3%;\n    --foreground: 253 31% 98%;\n    --muted: 253 7% 13%;\n    --muted-foreground: 253 13% 63%;\n    --popover: 253 43% 3%;\n    --popover-foreground: 253 31% 98%;\n    --card: 253 43% 4%;\n    --card-foreground: 253 31% 99%;\n    --border: 215 27.9% 16.9%;\n    --input: 215 27.9% 16.9%;\n    --primary: 253 91% 58%;\n    --primary-foreground: 253 91% 98%;\n    --secondary: 253 7% 9%;\n    --secondary-foreground: 253 7% 69%;\n    --accent: 253 13% 14%;\n    --accent-foreground: 253 13% 74%;\n    --destructive: 339.2 90.36% 51.18%;\n    --destructive-foreground: 0 0% 100%;\n    --ring: 253 91% 58%;\n    --chart-1: 220 70% 50%;\n    --chart-2: 160 60% 45%;\n    --chart-3: 30 80% 55%;\n    --chart-4: 280 65% 60%;\n    --chart-5: 340 75% 55%;\n  }\n}\n@layer base {\n  * {\n    @apply border-border;\n  }\n  body {\n    @apply box-border bg-background text-foreground;\n  }\n}\n@layer utilities {\n  .min-h-screen {\n    min-height: 100vh;\n    \n    min-height: 100dvh;\n  }\n  .h-screen {\n    height: 100vh;\n    \n    height: 100dvh;\n  }\n}\n@tailwind base;\n@tailwind components;\n@tailwind utilities;\n@layer components {\n  .glass {\n    border: none;\n    backdrop-filter: blur(var(--glass-blur, 40px));\n    background-color: transparent;\n    background-image: linear-gradient(135deg, rgb(255, 255, 255, var(--glass-opacity, 30%)), transparent), linear-gradient(var(--glass-reflex-degree, 100deg), rgb(255, 255, 255, var(--glass-reflex-opacity, 10%)) 25%, transparent 0);\n    box-shadow: 0 0 0 1px rgb(255, 255, 255, var(--glass-border-opacity, 10%)) inset, 0 0 0 2px rgba(0, 0, 0, 0.05);\n    text-shadow: 0 1px rgb(0, 0, 0, var(--glass-text-shadow-opacity, 5%));\n  }\n}\n.tox.tox-tinymce.sc-xplor-button {\n  width: 50% !important;\n  height: 400px !important;\n  display: inline-flex;\n}\n\n\n@media only screen and (min-width: 600px) {\n  .tox.tox-tinymce.sc-xplor-button {\n    width: 600px !important;\n  }\n}\nh1.sc-xplor-button {\n  color: var(--color-primary);\n  \n  font-family: Inter;\n  font-size: 48px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 56px; \n}\n\nh2.sc-xplor-button {\n  color: var(--grey-1100252525, #252525);\n  \n  font-family: Inter;\n  font-size: 32px;\n  font-style: normal;\n  font-weight: 600;\n  line-height: 38px; \n  letter-spacing: 0.25px;\n}\n\nh3.sc-xplor-button {\n  color: var(--grey-1100252525, #252525);\n  \n  font-family: Inter;\n  font-size: 24px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 32px; \n}\n\n.overline.sc-xplor-button {\n  color: var(--grey-1100252525, #252525);\n  \n  font-family: Inter;\n  font-size: 12px;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 16px; \n  letter-spacing: 3.2px;\n  text-transform: uppercase;\n}\n\nol.sc-xplor-button, ul.sc-xplor-button {\n  list-style: none;\n  margin: 1rem;\n  padding: 0;\n}\nol.sc-xplor-button li.sc-xplor-button, ul.sc-xplor-button li.sc-xplor-button {\n  margin: 1rem;\n  padding: 0;\n}\nol.mdc-list.sc-xplor-button, ul.mdc-list.sc-xplor-button {\n  list-style-type: none;\n  list-style: none;\n}\nol.mdc-list.sc-xplor-button li.mdc-list-item.sc-xplor-button, ul.mdc-list.sc-xplor-button li.mdc-list-item.sc-xplor-button {\n  list-style-type: none;\n  list-style: none !important;\n}\n\n.orange-label.sc-xplor-button {\n  color: var(--Orange-900-Primary, #db3b03);\n  \n  font-family: Inter;\n  font-size: 12px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 16px; \n  letter-spacing: 0.4px;\n  margin: 0px 0 -9px 16px;\n  z-index: 1 !important;\n  position: relative;\n  width: fit-content;\n}\n.orange-label.grey-bg.sc-xplor-button {\n  background-color: #fefcfb;\n}\n\n#spinnerLoader.sc-xplor-button {\n  position: fixed;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  background-color: #fff;\n  padding: 20px;\n  border-radius: 5px;\n  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 100;\n  pointer-events: none;\n}\n\n#textfield-Title-label.sc-xplor-button {\n  background-color: white;\n}\n\n.mdc-ripple-upgraded.sc-xplor-button .mdc-text-field--outlined.sc-xplor-button .mdc-notched-outline__notch.sc-xplor-button {\n  border: 0px solid transparent !important;\n  border-bottom: 1px solid #db3b03 !important;\n  padding: 0;\n  height: 0;\n}\n\n.mdc-text-field--focused.sc-xplor-button .mdc-notched-outline__notch.sc-xplor-button {\n  border: 0px solid transparent !important;\n  border-bottom: 2px solid #db3b03 !important;\n}\n\n.mdc-text-field--outlined.sc-xplor-button .mdc-notched-outline.sc-xplor-button .mdc-notched-outline__notch.sc-xplor-button {\n  max-width: calc(100% - max(12px, var(--mdc-shape-small, 4px)) * 2);\n  border-top: transparent;\n}\n\n.generate-btn.sc-xplor-button {\n  display: flex;\n  height: 48px;\n  padding: 12px 24px;\n  justify-content: center;\n  align-items: center;\n  gap: 10px;\n  border-radius: 16px;\n}\n.generate-btn.link.sc-xplor-button:hover {\n  background-color: var(--Cyan-700-Secondary, #e27046);\n  color: var(--Cyan-700-Secondary-Text, #fff);\n}\n\n.bg-green.sc-xplor-button {\n  background: var(--Cyan-700-Secondary, #00776b);\n}\n\n.margin-128.sc-xplor-button {\n  margin: 8rem;\n}\n\n.margin-t-128.sc-xplor-button {\n  margin-top: 8rem;\n}\n\n.margin-r-128.sc-xplor-button {\n  margin-right: 8rem;\n}\n\n.margin-b-128.sc-xplor-button {\n  margin-bottom: 8rem;\n}\n\n.margin-l-128.sc-xplor-button {\n  margin-left: 8rem;\n}\n\n.margin-x-128.sc-xplor-button {\n  margin-left: 8rem;\n  margin-right: 8rem;\n}\n\n.margin-y-128.sc-xplor-button {\n  margin-top: 8rem;\n  margin-bottom: 8rem;\n}\n\n.margin-80.sc-xplor-button {\n  margin: 5rem;\n}\n\n.margin-t-80.sc-xplor-button {\n  margin-top: 5rem;\n}\n\n.margin-r-80.sc-xplor-button {\n  margin-right: 5rem;\n}\n\n.margin-b-80.sc-xplor-button {\n  margin-bottom: 5rem;\n}\n\n.margin-l-80.sc-xplor-button {\n  margin-left: 5rem;\n}\n\n.margin-x-80.sc-xplor-button {\n  margin-left: 5rem;\n  margin-right: 5rem;\n}\n\n.margin-y-80.sc-xplor-button {\n  margin-top: 5rem;\n  margin-bottom: 5rem;\n}\n\n.margin-64.sc-xplor-button {\n  margin: 4rem;\n}\n\n.margin-t-64.sc-xplor-button {\n  margin-top: 4rem;\n}\n\n.margin-r-64.sc-xplor-button {\n  margin-right: 4rem;\n}\n\n.margin-b-64.sc-xplor-button {\n  margin-bottom: 4rem;\n}\n\n.margin-l-64.sc-xplor-button {\n  margin-left: 4rem;\n}\n\n.margin-x-64.sc-xplor-button {\n  margin-left: 4rem;\n  margin-right: 4rem;\n}\n\n.margin-y-64.sc-xplor-button {\n  margin-top: 4rem;\n  margin-bottom: 4rem;\n}\n\n.margin-56.sc-xplor-button {\n  margin: 3.5rem;\n}\n\n.margin-t-56.sc-xplor-button {\n  margin-top: 3.5rem;\n}\n\n.margin-r-56.sc-xplor-button {\n  margin-right: 3.5rem;\n}\n\n.margin-b-56.sc-xplor-button {\n  margin-bottom: 3.5rem;\n}\n\n.margin-l-56.sc-xplor-button {\n  margin-left: 3.5rem;\n}\n\n.margin-x-56.sc-xplor-button {\n  margin-left: 3.5rem;\n  margin-right: 3.5rem;\n}\n\n.margin-y-56.sc-xplor-button {\n  margin-top: 3.5rem;\n  margin-bottom: 3.5rem;\n}\n\n.margin-48.sc-xplor-button {\n  margin: 3rem;\n}\n\n.margin-t-48.sc-xplor-button {\n  margin-top: 3rem;\n}\n\n.margin-r-48.sc-xplor-button {\n  margin-right: 3rem;\n}\n\n.margin-b-48.sc-xplor-button {\n  margin-bottom: 3rem;\n}\n\n.margin-l-48.sc-xplor-button {\n  margin-left: 3rem;\n}\n\n.margin-x-48.sc-xplor-button {\n  margin-left: 3rem;\n  margin-right: 3rem;\n}\n\n.margin-y-48.sc-xplor-button {\n  margin-top: 3rem;\n  margin-bottom: 3rem;\n}\n\n.margin-40.sc-xplor-button {\n  margin: 2.5rem;\n}\n\n.margin-t-40.sc-xplor-button {\n  margin-top: 2.5rem;\n}\n\n.margin-r-40.sc-xplor-button {\n  margin-right: 2.5rem;\n}\n\n.margin-b-40.sc-xplor-button {\n  margin-bottom: 2.5rem;\n}\n\n.margin-l-40.sc-xplor-button {\n  margin-left: 2.5rem;\n}\n\n.margin-x-40.sc-xplor-button {\n  margin-left: 2.5rem;\n  margin-right: 2.5rem;\n}\n\n.margin-y-40.sc-xplor-button {\n  margin-top: 2.5rem;\n  margin-bottom: 2.5rem;\n}\n\n.margin-32.sc-xplor-button {\n  margin: 2rem;\n}\n\n.margin-t-32.sc-xplor-button {\n  margin-top: 2rem;\n}\n\n.margin-r-32.sc-xplor-button {\n  margin-right: 2rem;\n}\n\n.margin-b-32.sc-xplor-button {\n  margin-bottom: 2rem;\n}\n\n.margin-l-32.sc-xplor-button {\n  margin-left: 2rem;\n}\n\n.margin-x-32.sc-xplor-button {\n  margin-left: 2rem;\n  margin-right: 2rem;\n}\n\n.margin-y-32.sc-xplor-button {\n  margin-top: 2rem;\n  margin-bottom: 2rem;\n}\n\n.margin-24.sc-xplor-button {\n  margin: 1.5rem;\n}\n\n.margin-t-24.sc-xplor-button {\n  margin-top: 1.5rem;\n}\n\n.margin-r-24.sc-xplor-button {\n  margin-right: 1.5rem;\n}\n\n.margin-b-24.sc-xplor-button {\n  margin-bottom: 1.5rem;\n}\n\n.margin-l-24.sc-xplor-button {\n  margin-left: 1.5rem;\n}\n\n.margin-x-24.sc-xplor-button {\n  margin-left: 1.5rem;\n  margin-right: 1.5rem;\n}\n\n.margin-y-24.sc-xplor-button {\n  margin-top: 1.5rem;\n  margin-bottom: 1.5rem;\n}\n\n.margin-20.sc-xplor-button {\n  margin: 1.25rem;\n}\n\n.margin-t-20.sc-xplor-button {\n  margin-top: 1.25rem;\n}\n\n.margin-r-20.sc-xplor-button {\n  margin-right: 1.25rem;\n}\n\n.margin-b-20.sc-xplor-button {\n  margin-bottom: 1.25rem;\n}\n\n.margin-l-20.sc-xplor-button {\n  margin-left: 1.25rem;\n}\n\n.margin-x-20.sc-xplor-button {\n  margin-left: 1.25rem;\n  margin-right: 1.25rem;\n}\n\n.margin-y-20.sc-xplor-button {\n  margin-top: 1.25rem;\n  margin-bottom: 1.25rem;\n}\n\n.margin-16.sc-xplor-button {\n  margin: 1rem;\n}\n\n.margin-t-16.sc-xplor-button {\n  margin-top: 1rem;\n}\n\n.margin-r-16.sc-xplor-button {\n  margin-right: 1rem;\n}\n\n.margin-b-16.sc-xplor-button {\n  margin-bottom: 1rem;\n}\n\n.margin-l-16.sc-xplor-button {\n  margin-left: 1rem;\n}\n\n.margin-x-16.sc-xplor-button {\n  margin-left: 1rem;\n  margin-right: 1rem;\n}\n\n.margin-y-16.sc-xplor-button {\n  margin-top: 1rem;\n  margin-bottom: 1rem;\n}\n\n.margin-12.sc-xplor-button {\n  margin: 0.75rem;\n}\n\n.margin-t-12.sc-xplor-button {\n  margin-top: 0.75rem;\n}\n\n.margin-r-12.sc-xplor-button {\n  margin-right: 0.75rem;\n}\n\n.margin-b-12.sc-xplor-button {\n  margin-bottom: 0.75rem;\n}\n\n.margin-l-12.sc-xplor-button {\n  margin-left: 0.75rem;\n}\n\n.margin-x-12.sc-xplor-button {\n  margin-left: 0.75rem;\n  margin-right: 0.75rem;\n}\n\n.margin-y-12.sc-xplor-button {\n  margin-top: 0.75rem;\n  margin-bottom: 0.75rem;\n}\n\n.margin-8.sc-xplor-button {\n  margin: 0.5rem;\n}\n\n.margin-t-8.sc-xplor-button {\n  margin-top: 0.5rem;\n}\n\n.margin-r-8.sc-xplor-button {\n  margin-right: 0.5rem;\n}\n\n.margin-b-8.sc-xplor-button {\n  margin-bottom: 0.5rem;\n}\n\n.margin-l-8.sc-xplor-button {\n  margin-left: 0.5rem;\n}\n\n.margin-x-8.sc-xplor-button {\n  margin-left: 0.5rem;\n  margin-right: 0.5rem;\n}\n\n.margin-y-8.sc-xplor-button {\n  margin-top: 0.5rem;\n  margin-bottom: 0.5rem;\n}\n\n.margin-4.sc-xplor-button {\n  margin: 0.25rem;\n}\n\n.margin-t-4.sc-xplor-button {\n  margin-top: 0.25rem;\n}\n\n.margin-r-4.sc-xplor-button {\n  margin-right: 0.25rem;\n}\n\n.margin-b-4.sc-xplor-button {\n  margin-bottom: 0.25rem;\n}\n\n.margin-l-4.sc-xplor-button {\n  margin-left: 0.25rem;\n}\n\n.margin-x-4.sc-xplor-button {\n  margin-left: 0.25rem;\n  margin-right: 0.25rem;\n}\n\n.margin-y-4.sc-xplor-button {\n  margin-top: 0.25rem;\n  margin-bottom: 0.25rem;\n}\n\n.padding-128.sc-xplor-button {\n  padding: 8rem;\n}\n\n.padding-t-128.sc-xplor-button {\n  padding-top: 8rem;\n}\n\n.padding-r-128.sc-xplor-button {\n  padding-right: 8rem;\n}\n\n.padding-b-128.sc-xplor-button {\n  padding-bottom: 8rem;\n}\n\n.padding-l-128.sc-xplor-button {\n  padding-left: 8rem;\n}\n\n.padding-x-128.sc-xplor-button {\n  padding-left: 8rem;\n  padding-right: 8rem;\n}\n\n.padding-y-128.sc-xplor-button {\n  padding-top: 8rem;\n  padding-bottom: 8rem;\n}\n\n.padding-80.sc-xplor-button {\n  padding: 5rem;\n}\n\n.padding-t-80.sc-xplor-button {\n  padding-top: 5rem;\n}\n\n.padding-r-80.sc-xplor-button {\n  padding-right: 5rem;\n}\n\n.padding-b-80.sc-xplor-button {\n  padding-bottom: 5rem;\n}\n\n.padding-l-80.sc-xplor-button {\n  padding-left: 5rem;\n}\n\n.padding-x-80.sc-xplor-button {\n  padding-left: 5rem;\n  padding-right: 5rem;\n}\n\n.padding-y-80.sc-xplor-button {\n  padding-top: 5rem;\n  padding-bottom: 5rem;\n}\n\n.padding-64.sc-xplor-button {\n  padding: 4rem;\n}\n\n.padding-t-64.sc-xplor-button {\n  padding-top: 4rem;\n}\n\n.padding-r-64.sc-xplor-button {\n  padding-right: 4rem;\n}\n\n.padding-b-64.sc-xplor-button {\n  padding-bottom: 4rem;\n}\n\n.padding-l-64.sc-xplor-button {\n  padding-left: 4rem;\n}\n\n.padding-x-64.sc-xplor-button {\n  padding-left: 4rem;\n  padding-right: 4rem;\n}\n\n.padding-y-64.sc-xplor-button {\n  padding-top: 4rem;\n  padding-bottom: 4rem;\n}\n\n.padding-56.sc-xplor-button {\n  padding: 3.5rem;\n}\n\n.padding-t-56.sc-xplor-button {\n  padding-top: 3.5rem;\n}\n\n.padding-r-56.sc-xplor-button {\n  padding-right: 3.5rem;\n}\n\n.padding-b-56.sc-xplor-button {\n  padding-bottom: 3.5rem;\n}\n\n.padding-l-56.sc-xplor-button {\n  padding-left: 3.5rem;\n}\n\n.padding-x-56.sc-xplor-button {\n  padding-left: 3.5rem;\n  padding-right: 3.5rem;\n}\n\n.padding-y-56.sc-xplor-button {\n  padding-top: 3.5rem;\n  padding-bottom: 3.5rem;\n}\n\n.padding-48.sc-xplor-button {\n  padding: 3rem;\n}\n\n.padding-t-48.sc-xplor-button {\n  padding-top: 3rem;\n}\n\n.padding-r-48.sc-xplor-button {\n  padding-right: 3rem;\n}\n\n.padding-b-48.sc-xplor-button {\n  padding-bottom: 3rem;\n}\n\n.padding-l-48.sc-xplor-button {\n  padding-left: 3rem;\n}\n\n.padding-x-48.sc-xplor-button {\n  padding-left: 3rem;\n  padding-right: 3rem;\n}\n\n.padding-y-48.sc-xplor-button {\n  padding-top: 3rem;\n  padding-bottom: 3rem;\n}\n\n.padding-40.sc-xplor-button {\n  padding: 2.5rem;\n}\n\n.padding-t-40.sc-xplor-button {\n  padding-top: 2.5rem;\n}\n\n.padding-r-40.sc-xplor-button {\n  padding-right: 2.5rem;\n}\n\n.padding-b-40.sc-xplor-button {\n  padding-bottom: 2.5rem;\n}\n\n.padding-l-40.sc-xplor-button {\n  padding-left: 2.5rem;\n}\n\n.padding-x-40.sc-xplor-button {\n  padding-left: 2.5rem;\n  padding-right: 2.5rem;\n}\n\n.padding-y-40.sc-xplor-button {\n  padding-top: 2.5rem;\n  padding-bottom: 2.5rem;\n}\n\n.padding-32.sc-xplor-button {\n  padding: 2rem;\n}\n\n.padding-t-32.sc-xplor-button {\n  padding-top: 2rem;\n}\n\n.padding-r-32.sc-xplor-button {\n  padding-right: 2rem;\n}\n\n.padding-b-32.sc-xplor-button {\n  padding-bottom: 2rem;\n}\n\n.padding-l-32.sc-xplor-button {\n  padding-left: 2rem;\n}\n\n.padding-x-32.sc-xplor-button {\n  padding-left: 2rem;\n  padding-right: 2rem;\n}\n\n.padding-y-32.sc-xplor-button {\n  padding-top: 2rem;\n  padding-bottom: 2rem;\n}\n\n.padding-24.sc-xplor-button {\n  padding: 1.5rem;\n}\n\n.padding-t-24.sc-xplor-button {\n  padding-top: 1.5rem;\n}\n\n.padding-r-24.sc-xplor-button {\n  padding-right: 1.5rem;\n}\n\n.padding-b-24.sc-xplor-button {\n  padding-bottom: 1.5rem;\n}\n\n.padding-l-24.sc-xplor-button {\n  padding-left: 1.5rem;\n}\n\n.padding-x-24.sc-xplor-button {\n  padding-left: 1.5rem;\n  padding-right: 1.5rem;\n}\n\n.padding-y-24.sc-xplor-button {\n  padding-top: 1.5rem;\n  padding-bottom: 1.5rem;\n}\n\n.padding-20.sc-xplor-button {\n  padding: 1.25rem;\n}\n\n.padding-t-20.sc-xplor-button {\n  padding-top: 1.25rem;\n}\n\n.padding-r-20.sc-xplor-button {\n  padding-right: 1.25rem;\n}\n\n.padding-b-20.sc-xplor-button {\n  padding-bottom: 1.25rem;\n}\n\n.padding-l-20.sc-xplor-button {\n  padding-left: 1.25rem;\n}\n\n.padding-x-20.sc-xplor-button {\n  padding-left: 1.25rem;\n  padding-right: 1.25rem;\n}\n\n.padding-y-20.sc-xplor-button {\n  padding-top: 1.25rem;\n  padding-bottom: 1.25rem;\n}\n\n.padding-16.sc-xplor-button {\n  padding: 1rem;\n}\n\n.padding-t-16.sc-xplor-button {\n  padding-top: 1rem;\n}\n\n.padding-r-16.sc-xplor-button {\n  padding-right: 1rem;\n}\n\n.padding-b-16.sc-xplor-button {\n  padding-bottom: 1rem;\n}\n\n.padding-l-16.sc-xplor-button {\n  padding-left: 1rem;\n}\n\n.padding-x-16.sc-xplor-button {\n  padding-left: 1rem;\n  padding-right: 1rem;\n}\n\n.padding-y-16.sc-xplor-button {\n  padding-top: 1rem;\n  padding-bottom: 1rem;\n}\n\n.padding-12.sc-xplor-button {\n  padding: 0.75rem;\n}\n\n.padding-t-12.sc-xplor-button {\n  padding-top: 0.75rem;\n}\n\n.padding-r-12.sc-xplor-button {\n  padding-right: 0.75rem;\n}\n\n.padding-b-12.sc-xplor-button {\n  padding-bottom: 0.75rem;\n}\n\n.padding-l-12.sc-xplor-button {\n  padding-left: 0.75rem;\n}\n\n.padding-x-12.sc-xplor-button {\n  padding-left: 0.75rem;\n  padding-right: 0.75rem;\n}\n\n.padding-y-12.sc-xplor-button {\n  padding-top: 0.75rem;\n  padding-bottom: 0.75rem;\n}\n\n.padding-8.sc-xplor-button {\n  padding: 0.5rem;\n}\n\n.padding-t-8.sc-xplor-button {\n  padding-top: 0.5rem;\n}\n\n.padding-r-8.sc-xplor-button {\n  padding-right: 0.5rem;\n}\n\n.padding-b-8.sc-xplor-button {\n  padding-bottom: 0.5rem;\n}\n\n.padding-l-8.sc-xplor-button {\n  padding-left: 0.5rem;\n}\n\n.padding-x-8.sc-xplor-button {\n  padding-left: 0.5rem;\n  padding-right: 0.5rem;\n}\n\n.padding-y-8.sc-xplor-button {\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n}\n\n.padding-4.sc-xplor-button {\n  padding: 0.25rem;\n}\n\n.padding-t-4.sc-xplor-button {\n  padding-top: 0.25rem;\n}\n\n.padding-r-4.sc-xplor-button {\n  padding-right: 0.25rem;\n}\n\n.padding-b-4.sc-xplor-button {\n  padding-bottom: 0.25rem;\n}\n\n.padding-l-4.sc-xplor-button {\n  padding-left: 0.25rem;\n}\n\n.padding-x-4.sc-xplor-button {\n  padding-left: 0.25rem;\n  padding-right: 0.25rem;\n}\n\n.padding-y-4.sc-xplor-button {\n  padding-top: 0.25rem;\n  padding-bottom: 0.25rem;\n}\n\n.sc-xplor-button-h {\n  display: block;\n}\n\n.x-button.sc-xplor-button {\n  display: -webkit-box;\n  display: -webkit-flex;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-pack: center;\n  -webkit-justify-content: center;\n  -ms-flex-pack: center;\n  justify-content: center;\n  position: relative;\n  -webkit-align-items: center;\n  -webkit-box-align: center;\n  -ms-flex-align: center;\n  align-items: center;\n  border: 1px solid;\n  border-radius: 1rem;\n  cursor: pointer;\n  display: block;\n  -webkit-flex-direction: row;\n  -ms-flex-direction: row;\n  flex-direction: row;\n  font-size: 1rem;\n  font-weight: 500;\n  -webkit-box-pack: center;\n  -webkit-justify-content: center;\n  -ms-flex-pack: center;\n  justify-content: center;\n  -webkit-letter-spacing: 0.75px;\n  -moz-letter-spacing: 0.75px;\n  -ms-letter-spacing: 0.75px;\n  padding: 0.75rem 1.5rem;\n  letter-spacing: 0.75px;\n  overflow: hidden;\n  position: relative;\n  -webkit-transition: background-color 0.2s, border-color 0.2s, color 0.2s;\n  transition: background-color 0.2s, border-color 0.2s, color 0.2s;\n}\n.x-button.x-button--icon-only.sc-xplor-button {\n  width: 48px;\n  height: 48px;\n  padding: 0;\n  border-radius: 50%;\n  min-width: 48px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.x-button.x-button--icon-only.sc-xplor-button .button-icon.sc-xplor-button {\n  font-size: 20px;\n  font-weight: 300;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.x-button.x-button--icon-only.sc-xplor-button .button-icon.button-icon--svg.sc-xplor-button svg.sc-xplor-button {\n  width: 1rem;\n  height: 1rem;\n  display: block;\n}\n.x-button.x-button--with-icon.sc-xplor-button .button-icon.sc-xplor-button {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 18px;\n  line-height: 1;\n}\n.x-button.x-button--with-icon.x-button--icon-start.sc-xplor-button .button-icon--svg.sc-xplor-button {\n  margin-right: 0.5rem;\n}\n.x-button.x-button--with-icon.x-button--icon-end.sc-xplor-button .button-icon--svg.sc-xplor-button {\n  margin-left: 0.5rem;\n}\n.x-button.x-button--with-icon.sc-xplor-button .button-icon--svg.sc-xplor-button svg.sc-xplor-button {\n  display: block;\n  width: 14px;\n  height: 14px;\n}\n.x-button.x-button--with-icon.sc-xplor-button .button-icon--svg.sc-xplor-button svg.sc-xplor-button path.sc-xplor-button {\n  fill: currentColor;\n}\n.x-button.x-button--with-icon.sc-xplor-button .button-text.sc-xplor-button {\n  line-height: 1;\n}\n.x-button.x-button--icon-start.sc-xplor-button {\n  flex-direction: row;\n}\n.x-button.x-button--icon-end.sc-xplor-button {\n  flex-direction: row;\n}\n.x-button.shadow.sc-xplor-button {\n  box-shadow: 0px 2.30969px 4.25707px rgba(20, 20, 21, 0.28), 0px 6.38599px 11.7703px rgba(20, 20, 21, 0.0521271), 0px 15.375px 28.3382px rgba(20, 20, 21, 0.04), 0px 32px 94px rgba(20, 20, 21, 0.0278729);\n}\n.x-button.primary.sc-xplor-button {\n  background-color: var(--color-primary);\n  border-color: var(--color-primary);\n  color: white;\n}\n.x-button.primary.sc-xplor-button:hover {\n  background-color: var(--color-primary-50, #e3f2fd);\n  border-color: var(--color-primary-50, #e3f2fd);\n  color: white;\n}\n.x-button.secondary.sc-xplor-button {\n  background-color: var(--color-secondary);\n  border-color: var(--color-secondary);\n  color: white;\n}\n.x-button.secondary.sc-xplor-button:hover {\n  background-color: var(--color-secondary-50, #f3e5f5);\n  border-color: var(--color-secondary-50, #f3e5f5);\n  color: white;\n}\n.x-button.ghost.sc-xplor-button {\n  background-color: #fff;\n  border-color: var(--color-secondary);\n  color: var(--color-secondary);\n}\n.x-button.ghost.sc-xplor-button:hover {\n  background-color: #DFF2F1;\n  border-color: var(--color-secondary);\n  color: var(--color-secondary);\n}\n.x-button.ghost.sc-xplor-button:active {\n  background-color: #BEE6E4;\n  border-color: var(--color-secondary);\n  color: var(--color-secondary);\n}\n.x-button.minimal.sc-xplor-button {\n  background-color: transparent;\n  border-color: transparent;\n  color: var(--color-primary);\n}\n.x-button.success.sc-xplor-button {\n  background-color: transparent;\n  border-color: var(--color-success, #4caf50);\n  color: var(--color-success, #4caf50);\n}\n.x-button.success.sc-xplor-button:hover {\n  background-color: var(--color-success-50, #e8f5e9);\n  border-color: var(--color-success, #4caf50);\n  color: var(--color-success, #4caf50);\n}\n.x-button.success.sc-xplor-button:active {\n  background-color: var(--color-success-100, #c8e6c9);\n}\n.x-button.text.sc-xplor-button {\n  background-color: transparent;\n  border-color: transparent;\n  color: var(--color-secondary);\n}\n.x-button.text.sc-xplor-button:hover {\n  background-color: var(--color-secondary-50, #f3e5f5);\n}\n.x-button.text.sc-xplor-button:active {\n  background-color: var(--color-secondary-100, #e1bee7);\n}\n.x-button.disabled.sc-xplor-button {\n  background-color: #f6f6f6;\n  border-color: #a0a0a0;\n  color: #a0a0a0;\n}\n\n.icon.sc-xplor-button {\n  background-color: #ffffff;\n  bottom: 0px;\n  left: 0px;\n  opacity: 0;\n  position: absolute;\n  right: 0px;\n  top: 0px;\n  -webkit-transition: opacity 0.2s;\n  transition: opacity 0.2s;\n}\n\n.x-button--icon-only.small.sc-xplor-button {\n  width: 36px;\n  height: 36px;\n  padding: 0.25rem;\n}\n.x-button--icon-only.small.sc-xplor-button .button-icon.sc-xplor-button {\n  font-size: 16px;\n}\n.x-button--icon-only.button-icon--svg.sc-xplor-button {\n  padding: 0.25rem;\n}\n.x-button--icon-only.button-icon--svg.sc-xplor-button svg.sc-xplor-button {\n  width: 16px;\n  height: 16px;\n}\n.x-button--icon-only.large.sc-xplor-button {\n  width: 56px;\n  height: 56px;\n}\n.x-button--icon-only.large.sc-xplor-button .button-icon.sc-xplor-button {\n  font-size: 24px;\n}\n\n.x-button.disabled.x-button--icon-only.sc-xplor-button, .x-button.disabled.x-button--with-icon.sc-xplor-button {\n  cursor: not-allowed;\n  opacity: 0.6;\n}";
+const xplorButtonCss = "@tailwind base;\n@tailwind components;\n@tailwind utilities;\n@layer base {\n  \n  :root {\n    --color-primary: #db3b03;\n    --color-primary-50: rgba(255, 152, 0, 1);\n    --color-secondary: rgb(0, 119, 107);\n    --color-secondary-50: rgba(1, 163, 157, 1);\n    --color-tertiary: rgb(128, 104, 186);\n    --color-tertiary: rgb(223, 242, 241);\n    --color-white: white;\n    --color-emphasis: rgb(8, 8, 9);\n    --color-supergiant: rgb(213, 66, 99);\n    --color-orange: rgb(250, 200, 127);\n    --color-buttons: #fbbc05;\n    --color-typography: #ea4335;\n    --background: 20 66% 99%;\n    --foreground: 20 51% 4%;\n    --muted: 20 25% 86%;\n    --muted-foreground: 20 7% 25%;\n    --popover: 20 66% 98%;\n    --popover-foreground: 20 51% 3%;\n    --card: 20 66% 98%;\n    --card-foreground: 20 51% 3%;\n    --border: 20 15% 94%;\n    --input: 20 15% 94%;\n    --primary: 20 48% 72%;\n    --primary-foreground: 20 48% 12%;\n    --secondary: 20 12% 92%;\n    --secondary-foreground: 20 12% 32%;\n    --accent: 20 12% 92%;\n    --accent-foreground: 20 12% 32%;\n    --destructive: 11 80% 22%;\n    --destructive-foreground: 11 80% 82%;\n    --ring: 20 48% 72%;\n    --radius: 0.5rem;\n    --chart-1: 12 76% 61%;\n    --chart-2: 173 58% 39%;\n    --chart-3: 197 37% 24%;\n    --chart-4: 43 74% 66%;\n    --chart-5: 27 87% 67%;\n  }\n  .dark {\n    --background: 253 43% 3%;\n    --foreground: 253 31% 98%;\n    --muted: 253 7% 13%;\n    --muted-foreground: 253 13% 63%;\n    --popover: 253 43% 3%;\n    --popover-foreground: 253 31% 98%;\n    --card: 253 43% 4%;\n    --card-foreground: 253 31% 99%;\n    --border: 215 27.9% 16.9%;\n    --input: 215 27.9% 16.9%;\n    --primary: 253 91% 58%;\n    --primary-foreground: 253 91% 98%;\n    --secondary: 253 7% 9%;\n    --secondary-foreground: 253 7% 69%;\n    --accent: 253 13% 14%;\n    --accent-foreground: 253 13% 74%;\n    --destructive: 339.2 90.36% 51.18%;\n    --destructive-foreground: 0 0% 100%;\n    --ring: 253 91% 58%;\n    --chart-1: 220 70% 50%;\n    --chart-2: 160 60% 45%;\n    --chart-3: 30 80% 55%;\n    --chart-4: 280 65% 60%;\n    --chart-5: 340 75% 55%;\n  }\n}\n@layer base {\n  * {\n    @apply border-border;\n  }\n  body {\n    @apply box-border bg-background text-foreground;\n  }\n}\n@layer utilities {\n  .min-h-screen {\n    min-height: 100vh;\n    \n    min-height: 100dvh;\n  }\n  .h-screen {\n    height: 100vh;\n    \n    height: 100dvh;\n  }\n}\n@tailwind base;\n@tailwind components;\n@tailwind utilities;\n@layer components {\n  .glass {\n    border: none;\n    backdrop-filter: blur(var(--glass-blur, 40px));\n    background-color: transparent;\n    background-image: linear-gradient(135deg, rgb(255, 255, 255, var(--glass-opacity, 30%)), transparent), linear-gradient(var(--glass-reflex-degree, 100deg), rgb(255, 255, 255, var(--glass-reflex-opacity, 10%)) 25%, transparent 0);\n    box-shadow: 0 0 0 1px rgb(255, 255, 255, var(--glass-border-opacity, 10%)) inset, 0 0 0 2px rgba(0, 0, 0, 0.05);\n    text-shadow: 0 1px rgb(0, 0, 0, var(--glass-text-shadow-opacity, 5%));\n  }\n}\n.tox.tox-tinymce.sc-xplor-button {\n  width: 50% !important;\n  height: 400px !important;\n  display: inline-flex;\n}\n\n\n@media only screen and (min-width: 600px) {\n  .tox.tox-tinymce.sc-xplor-button {\n    width: 600px !important;\n  }\n}\nh1.sc-xplor-button {\n  color: var(--color-primary);\n  \n  font-family: Inter;\n  font-size: 48px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 56px; \n}\n\nh2.sc-xplor-button {\n  color: var(--grey-1100252525, #252525);\n  \n  font-family: Inter;\n  font-size: 32px;\n  font-style: normal;\n  font-weight: 600;\n  line-height: 38px; \n  letter-spacing: 0.25px;\n}\n\nh3.sc-xplor-button {\n  color: var(--grey-1100252525, #252525);\n  \n  font-family: Inter;\n  font-size: 24px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 32px; \n}\n\n.overline.sc-xplor-button {\n  color: var(--grey-1100252525, #252525);\n  \n  font-family: Inter;\n  font-size: 12px;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 16px; \n  letter-spacing: 3.2px;\n  text-transform: uppercase;\n}\n\nol.sc-xplor-button, ul.sc-xplor-button {\n  list-style: none;\n  margin: 1rem;\n  padding: 0;\n}\nol.sc-xplor-button li.sc-xplor-button, ul.sc-xplor-button li.sc-xplor-button {\n  margin: 1rem;\n  padding: 0;\n}\nol.mdc-list.sc-xplor-button, ul.mdc-list.sc-xplor-button {\n  list-style-type: none;\n  list-style: none;\n}\nol.mdc-list.sc-xplor-button li.mdc-list-item.sc-xplor-button, ul.mdc-list.sc-xplor-button li.mdc-list-item.sc-xplor-button {\n  list-style-type: none;\n  list-style: none !important;\n}\n\n.orange-label.sc-xplor-button {\n  color: var(--Orange-900-Primary, #db3b03);\n  \n  font-family: Inter;\n  font-size: 12px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 16px; \n  letter-spacing: 0.4px;\n  margin: 0px 0 -9px 16px;\n  z-index: 1 !important;\n  position: relative;\n  width: fit-content;\n}\n.orange-label.grey-bg.sc-xplor-button {\n  background-color: #fefcfb;\n}\n\n#spinnerLoader.sc-xplor-button {\n  position: fixed;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  background-color: #fff;\n  padding: 20px;\n  border-radius: 5px;\n  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 100;\n  pointer-events: none;\n}\n\n#textfield-Title-label.sc-xplor-button {\n  background-color: white;\n}\n\n.mdc-ripple-upgraded.sc-xplor-button .mdc-text-field--outlined.sc-xplor-button .mdc-notched-outline__notch.sc-xplor-button {\n  border: 0px solid transparent !important;\n  border-bottom: 1px solid #db3b03 !important;\n  padding: 0;\n  height: 0;\n}\n\n.mdc-text-field--focused.sc-xplor-button .mdc-notched-outline__notch.sc-xplor-button {\n  border: 0px solid transparent !important;\n  border-bottom: 2px solid #db3b03 !important;\n}\n\n.mdc-text-field--outlined.sc-xplor-button .mdc-notched-outline.sc-xplor-button .mdc-notched-outline__notch.sc-xplor-button {\n  max-width: calc(100% - max(12px, var(--mdc-shape-small, 4px)) * 2);\n  border-top: transparent;\n}\n\n.generate-btn.sc-xplor-button {\n  display: flex;\n  height: 48px;\n  padding: 12px 24px;\n  justify-content: center;\n  align-items: center;\n  gap: 10px;\n  border-radius: 16px;\n}\n.generate-btn.link.sc-xplor-button:hover {\n  background-color: var(--Cyan-700-Secondary, #e27046);\n  color: var(--Cyan-700-Secondary-Text, #fff);\n}\n\n.bg-green.sc-xplor-button {\n  background: var(--Cyan-700-Secondary, #00776b);\n}\n\n.margin-128.sc-xplor-button {\n  margin: 8rem;\n}\n\n.margin-t-128.sc-xplor-button {\n  margin-top: 8rem;\n}\n\n.margin-r-128.sc-xplor-button {\n  margin-right: 8rem;\n}\n\n.margin-b-128.sc-xplor-button {\n  margin-bottom: 8rem;\n}\n\n.margin-l-128.sc-xplor-button {\n  margin-left: 8rem;\n}\n\n.margin-x-128.sc-xplor-button {\n  margin-left: 8rem;\n  margin-right: 8rem;\n}\n\n.margin-y-128.sc-xplor-button {\n  margin-top: 8rem;\n  margin-bottom: 8rem;\n}\n\n.margin-80.sc-xplor-button {\n  margin: 5rem;\n}\n\n.margin-t-80.sc-xplor-button {\n  margin-top: 5rem;\n}\n\n.margin-r-80.sc-xplor-button {\n  margin-right: 5rem;\n}\n\n.margin-b-80.sc-xplor-button {\n  margin-bottom: 5rem;\n}\n\n.margin-l-80.sc-xplor-button {\n  margin-left: 5rem;\n}\n\n.margin-x-80.sc-xplor-button {\n  margin-left: 5rem;\n  margin-right: 5rem;\n}\n\n.margin-y-80.sc-xplor-button {\n  margin-top: 5rem;\n  margin-bottom: 5rem;\n}\n\n.margin-64.sc-xplor-button {\n  margin: 4rem;\n}\n\n.margin-t-64.sc-xplor-button {\n  margin-top: 4rem;\n}\n\n.margin-r-64.sc-xplor-button {\n  margin-right: 4rem;\n}\n\n.margin-b-64.sc-xplor-button {\n  margin-bottom: 4rem;\n}\n\n.margin-l-64.sc-xplor-button {\n  margin-left: 4rem;\n}\n\n.margin-x-64.sc-xplor-button {\n  margin-left: 4rem;\n  margin-right: 4rem;\n}\n\n.margin-y-64.sc-xplor-button {\n  margin-top: 4rem;\n  margin-bottom: 4rem;\n}\n\n.margin-56.sc-xplor-button {\n  margin: 3.5rem;\n}\n\n.margin-t-56.sc-xplor-button {\n  margin-top: 3.5rem;\n}\n\n.margin-r-56.sc-xplor-button {\n  margin-right: 3.5rem;\n}\n\n.margin-b-56.sc-xplor-button {\n  margin-bottom: 3.5rem;\n}\n\n.margin-l-56.sc-xplor-button {\n  margin-left: 3.5rem;\n}\n\n.margin-x-56.sc-xplor-button {\n  margin-left: 3.5rem;\n  margin-right: 3.5rem;\n}\n\n.margin-y-56.sc-xplor-button {\n  margin-top: 3.5rem;\n  margin-bottom: 3.5rem;\n}\n\n.margin-48.sc-xplor-button {\n  margin: 3rem;\n}\n\n.margin-t-48.sc-xplor-button {\n  margin-top: 3rem;\n}\n\n.margin-r-48.sc-xplor-button {\n  margin-right: 3rem;\n}\n\n.margin-b-48.sc-xplor-button {\n  margin-bottom: 3rem;\n}\n\n.margin-l-48.sc-xplor-button {\n  margin-left: 3rem;\n}\n\n.margin-x-48.sc-xplor-button {\n  margin-left: 3rem;\n  margin-right: 3rem;\n}\n\n.margin-y-48.sc-xplor-button {\n  margin-top: 3rem;\n  margin-bottom: 3rem;\n}\n\n.margin-40.sc-xplor-button {\n  margin: 2.5rem;\n}\n\n.margin-t-40.sc-xplor-button {\n  margin-top: 2.5rem;\n}\n\n.margin-r-40.sc-xplor-button {\n  margin-right: 2.5rem;\n}\n\n.margin-b-40.sc-xplor-button {\n  margin-bottom: 2.5rem;\n}\n\n.margin-l-40.sc-xplor-button {\n  margin-left: 2.5rem;\n}\n\n.margin-x-40.sc-xplor-button {\n  margin-left: 2.5rem;\n  margin-right: 2.5rem;\n}\n\n.margin-y-40.sc-xplor-button {\n  margin-top: 2.5rem;\n  margin-bottom: 2.5rem;\n}\n\n.margin-32.sc-xplor-button {\n  margin: 2rem;\n}\n\n.margin-t-32.sc-xplor-button {\n  margin-top: 2rem;\n}\n\n.margin-r-32.sc-xplor-button {\n  margin-right: 2rem;\n}\n\n.margin-b-32.sc-xplor-button {\n  margin-bottom: 2rem;\n}\n\n.margin-l-32.sc-xplor-button {\n  margin-left: 2rem;\n}\n\n.margin-x-32.sc-xplor-button {\n  margin-left: 2rem;\n  margin-right: 2rem;\n}\n\n.margin-y-32.sc-xplor-button {\n  margin-top: 2rem;\n  margin-bottom: 2rem;\n}\n\n.margin-24.sc-xplor-button {\n  margin: 1.5rem;\n}\n\n.margin-t-24.sc-xplor-button {\n  margin-top: 1.5rem;\n}\n\n.margin-r-24.sc-xplor-button {\n  margin-right: 1.5rem;\n}\n\n.margin-b-24.sc-xplor-button {\n  margin-bottom: 1.5rem;\n}\n\n.margin-l-24.sc-xplor-button {\n  margin-left: 1.5rem;\n}\n\n.margin-x-24.sc-xplor-button {\n  margin-left: 1.5rem;\n  margin-right: 1.5rem;\n}\n\n.margin-y-24.sc-xplor-button {\n  margin-top: 1.5rem;\n  margin-bottom: 1.5rem;\n}\n\n.margin-20.sc-xplor-button {\n  margin: 1.25rem;\n}\n\n.margin-t-20.sc-xplor-button {\n  margin-top: 1.25rem;\n}\n\n.margin-r-20.sc-xplor-button {\n  margin-right: 1.25rem;\n}\n\n.margin-b-20.sc-xplor-button {\n  margin-bottom: 1.25rem;\n}\n\n.margin-l-20.sc-xplor-button {\n  margin-left: 1.25rem;\n}\n\n.margin-x-20.sc-xplor-button {\n  margin-left: 1.25rem;\n  margin-right: 1.25rem;\n}\n\n.margin-y-20.sc-xplor-button {\n  margin-top: 1.25rem;\n  margin-bottom: 1.25rem;\n}\n\n.margin-16.sc-xplor-button {\n  margin: 1rem;\n}\n\n.margin-t-16.sc-xplor-button {\n  margin-top: 1rem;\n}\n\n.margin-r-16.sc-xplor-button {\n  margin-right: 1rem;\n}\n\n.margin-b-16.sc-xplor-button {\n  margin-bottom: 1rem;\n}\n\n.margin-l-16.sc-xplor-button {\n  margin-left: 1rem;\n}\n\n.margin-x-16.sc-xplor-button {\n  margin-left: 1rem;\n  margin-right: 1rem;\n}\n\n.margin-y-16.sc-xplor-button {\n  margin-top: 1rem;\n  margin-bottom: 1rem;\n}\n\n.margin-12.sc-xplor-button {\n  margin: 0.75rem;\n}\n\n.margin-t-12.sc-xplor-button {\n  margin-top: 0.75rem;\n}\n\n.margin-r-12.sc-xplor-button {\n  margin-right: 0.75rem;\n}\n\n.margin-b-12.sc-xplor-button {\n  margin-bottom: 0.75rem;\n}\n\n.margin-l-12.sc-xplor-button {\n  margin-left: 0.75rem;\n}\n\n.margin-x-12.sc-xplor-button {\n  margin-left: 0.75rem;\n  margin-right: 0.75rem;\n}\n\n.margin-y-12.sc-xplor-button {\n  margin-top: 0.75rem;\n  margin-bottom: 0.75rem;\n}\n\n.margin-8.sc-xplor-button {\n  margin: 0.5rem;\n}\n\n.margin-t-8.sc-xplor-button {\n  margin-top: 0.5rem;\n}\n\n.margin-r-8.sc-xplor-button {\n  margin-right: 0.5rem;\n}\n\n.margin-b-8.sc-xplor-button {\n  margin-bottom: 0.5rem;\n}\n\n.margin-l-8.sc-xplor-button {\n  margin-left: 0.5rem;\n}\n\n.margin-x-8.sc-xplor-button {\n  margin-left: 0.5rem;\n  margin-right: 0.5rem;\n}\n\n.margin-y-8.sc-xplor-button {\n  margin-top: 0.5rem;\n  margin-bottom: 0.5rem;\n}\n\n.margin-4.sc-xplor-button {\n  margin: 0.25rem;\n}\n\n.margin-t-4.sc-xplor-button {\n  margin-top: 0.25rem;\n}\n\n.margin-r-4.sc-xplor-button {\n  margin-right: 0.25rem;\n}\n\n.margin-b-4.sc-xplor-button {\n  margin-bottom: 0.25rem;\n}\n\n.margin-l-4.sc-xplor-button {\n  margin-left: 0.25rem;\n}\n\n.margin-x-4.sc-xplor-button {\n  margin-left: 0.25rem;\n  margin-right: 0.25rem;\n}\n\n.margin-y-4.sc-xplor-button {\n  margin-top: 0.25rem;\n  margin-bottom: 0.25rem;\n}\n\n.padding-128.sc-xplor-button {\n  padding: 8rem;\n}\n\n.padding-t-128.sc-xplor-button {\n  padding-top: 8rem;\n}\n\n.padding-r-128.sc-xplor-button {\n  padding-right: 8rem;\n}\n\n.padding-b-128.sc-xplor-button {\n  padding-bottom: 8rem;\n}\n\n.padding-l-128.sc-xplor-button {\n  padding-left: 8rem;\n}\n\n.padding-x-128.sc-xplor-button {\n  padding-left: 8rem;\n  padding-right: 8rem;\n}\n\n.padding-y-128.sc-xplor-button {\n  padding-top: 8rem;\n  padding-bottom: 8rem;\n}\n\n.padding-80.sc-xplor-button {\n  padding: 5rem;\n}\n\n.padding-t-80.sc-xplor-button {\n  padding-top: 5rem;\n}\n\n.padding-r-80.sc-xplor-button {\n  padding-right: 5rem;\n}\n\n.padding-b-80.sc-xplor-button {\n  padding-bottom: 5rem;\n}\n\n.padding-l-80.sc-xplor-button {\n  padding-left: 5rem;\n}\n\n.padding-x-80.sc-xplor-button {\n  padding-left: 5rem;\n  padding-right: 5rem;\n}\n\n.padding-y-80.sc-xplor-button {\n  padding-top: 5rem;\n  padding-bottom: 5rem;\n}\n\n.padding-64.sc-xplor-button {\n  padding: 4rem;\n}\n\n.padding-t-64.sc-xplor-button {\n  padding-top: 4rem;\n}\n\n.padding-r-64.sc-xplor-button {\n  padding-right: 4rem;\n}\n\n.padding-b-64.sc-xplor-button {\n  padding-bottom: 4rem;\n}\n\n.padding-l-64.sc-xplor-button {\n  padding-left: 4rem;\n}\n\n.padding-x-64.sc-xplor-button {\n  padding-left: 4rem;\n  padding-right: 4rem;\n}\n\n.padding-y-64.sc-xplor-button {\n  padding-top: 4rem;\n  padding-bottom: 4rem;\n}\n\n.padding-56.sc-xplor-button {\n  padding: 3.5rem;\n}\n\n.padding-t-56.sc-xplor-button {\n  padding-top: 3.5rem;\n}\n\n.padding-r-56.sc-xplor-button {\n  padding-right: 3.5rem;\n}\n\n.padding-b-56.sc-xplor-button {\n  padding-bottom: 3.5rem;\n}\n\n.padding-l-56.sc-xplor-button {\n  padding-left: 3.5rem;\n}\n\n.padding-x-56.sc-xplor-button {\n  padding-left: 3.5rem;\n  padding-right: 3.5rem;\n}\n\n.padding-y-56.sc-xplor-button {\n  padding-top: 3.5rem;\n  padding-bottom: 3.5rem;\n}\n\n.padding-48.sc-xplor-button {\n  padding: 3rem;\n}\n\n.padding-t-48.sc-xplor-button {\n  padding-top: 3rem;\n}\n\n.padding-r-48.sc-xplor-button {\n  padding-right: 3rem;\n}\n\n.padding-b-48.sc-xplor-button {\n  padding-bottom: 3rem;\n}\n\n.padding-l-48.sc-xplor-button {\n  padding-left: 3rem;\n}\n\n.padding-x-48.sc-xplor-button {\n  padding-left: 3rem;\n  padding-right: 3rem;\n}\n\n.padding-y-48.sc-xplor-button {\n  padding-top: 3rem;\n  padding-bottom: 3rem;\n}\n\n.padding-40.sc-xplor-button {\n  padding: 2.5rem;\n}\n\n.padding-t-40.sc-xplor-button {\n  padding-top: 2.5rem;\n}\n\n.padding-r-40.sc-xplor-button {\n  padding-right: 2.5rem;\n}\n\n.padding-b-40.sc-xplor-button {\n  padding-bottom: 2.5rem;\n}\n\n.padding-l-40.sc-xplor-button {\n  padding-left: 2.5rem;\n}\n\n.padding-x-40.sc-xplor-button {\n  padding-left: 2.5rem;\n  padding-right: 2.5rem;\n}\n\n.padding-y-40.sc-xplor-button {\n  padding-top: 2.5rem;\n  padding-bottom: 2.5rem;\n}\n\n.padding-32.sc-xplor-button {\n  padding: 2rem;\n}\n\n.padding-t-32.sc-xplor-button {\n  padding-top: 2rem;\n}\n\n.padding-r-32.sc-xplor-button {\n  padding-right: 2rem;\n}\n\n.padding-b-32.sc-xplor-button {\n  padding-bottom: 2rem;\n}\n\n.padding-l-32.sc-xplor-button {\n  padding-left: 2rem;\n}\n\n.padding-x-32.sc-xplor-button {\n  padding-left: 2rem;\n  padding-right: 2rem;\n}\n\n.padding-y-32.sc-xplor-button {\n  padding-top: 2rem;\n  padding-bottom: 2rem;\n}\n\n.padding-24.sc-xplor-button {\n  padding: 1.5rem;\n}\n\n.padding-t-24.sc-xplor-button {\n  padding-top: 1.5rem;\n}\n\n.padding-r-24.sc-xplor-button {\n  padding-right: 1.5rem;\n}\n\n.padding-b-24.sc-xplor-button {\n  padding-bottom: 1.5rem;\n}\n\n.padding-l-24.sc-xplor-button {\n  padding-left: 1.5rem;\n}\n\n.padding-x-24.sc-xplor-button {\n  padding-left: 1.5rem;\n  padding-right: 1.5rem;\n}\n\n.padding-y-24.sc-xplor-button {\n  padding-top: 1.5rem;\n  padding-bottom: 1.5rem;\n}\n\n.padding-20.sc-xplor-button {\n  padding: 1.25rem;\n}\n\n.padding-t-20.sc-xplor-button {\n  padding-top: 1.25rem;\n}\n\n.padding-r-20.sc-xplor-button {\n  padding-right: 1.25rem;\n}\n\n.padding-b-20.sc-xplor-button {\n  padding-bottom: 1.25rem;\n}\n\n.padding-l-20.sc-xplor-button {\n  padding-left: 1.25rem;\n}\n\n.padding-x-20.sc-xplor-button {\n  padding-left: 1.25rem;\n  padding-right: 1.25rem;\n}\n\n.padding-y-20.sc-xplor-button {\n  padding-top: 1.25rem;\n  padding-bottom: 1.25rem;\n}\n\n.padding-16.sc-xplor-button {\n  padding: 1rem;\n}\n\n.padding-t-16.sc-xplor-button {\n  padding-top: 1rem;\n}\n\n.padding-r-16.sc-xplor-button {\n  padding-right: 1rem;\n}\n\n.padding-b-16.sc-xplor-button {\n  padding-bottom: 1rem;\n}\n\n.padding-l-16.sc-xplor-button {\n  padding-left: 1rem;\n}\n\n.padding-x-16.sc-xplor-button {\n  padding-left: 1rem;\n  padding-right: 1rem;\n}\n\n.padding-y-16.sc-xplor-button {\n  padding-top: 1rem;\n  padding-bottom: 1rem;\n}\n\n.padding-12.sc-xplor-button {\n  padding: 0.75rem;\n}\n\n.padding-t-12.sc-xplor-button {\n  padding-top: 0.75rem;\n}\n\n.padding-r-12.sc-xplor-button {\n  padding-right: 0.75rem;\n}\n\n.padding-b-12.sc-xplor-button {\n  padding-bottom: 0.75rem;\n}\n\n.padding-l-12.sc-xplor-button {\n  padding-left: 0.75rem;\n}\n\n.padding-x-12.sc-xplor-button {\n  padding-left: 0.75rem;\n  padding-right: 0.75rem;\n}\n\n.padding-y-12.sc-xplor-button {\n  padding-top: 0.75rem;\n  padding-bottom: 0.75rem;\n}\n\n.padding-8.sc-xplor-button {\n  padding: 0.5rem;\n}\n\n.padding-t-8.sc-xplor-button {\n  padding-top: 0.5rem;\n}\n\n.padding-r-8.sc-xplor-button {\n  padding-right: 0.5rem;\n}\n\n.padding-b-8.sc-xplor-button {\n  padding-bottom: 0.5rem;\n}\n\n.padding-l-8.sc-xplor-button {\n  padding-left: 0.5rem;\n}\n\n.padding-x-8.sc-xplor-button {\n  padding-left: 0.5rem;\n  padding-right: 0.5rem;\n}\n\n.padding-y-8.sc-xplor-button {\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n}\n\n.padding-4.sc-xplor-button {\n  padding: 0.25rem;\n}\n\n.padding-t-4.sc-xplor-button {\n  padding-top: 0.25rem;\n}\n\n.padding-r-4.sc-xplor-button {\n  padding-right: 0.25rem;\n}\n\n.padding-b-4.sc-xplor-button {\n  padding-bottom: 0.25rem;\n}\n\n.padding-l-4.sc-xplor-button {\n  padding-left: 0.25rem;\n}\n\n.padding-x-4.sc-xplor-button {\n  padding-left: 0.25rem;\n  padding-right: 0.25rem;\n}\n\n.padding-y-4.sc-xplor-button {\n  padding-top: 0.25rem;\n  padding-bottom: 0.25rem;\n}\n\n.sc-xplor-button-h {\n  display: block;\n}\n\n.x-button--full-width.sc-xplor-button-h {\n  width: 100%;\n}\n\n.x-button--full-width.sc-xplor-button {\n  width: 100%;\n}\n\n.x-button.sc-xplor-button {\n  display: -webkit-box;\n  display: -webkit-flex;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-pack: center;\n  -webkit-justify-content: center;\n  -ms-flex-pack: center;\n  justify-content: center;\n  position: relative;\n  -webkit-align-items: center;\n  -webkit-box-align: center;\n  -ms-flex-align: center;\n  align-items: center;\n  border: 1px solid;\n  border-radius: 1rem;\n  cursor: pointer;\n  display: block;\n  -webkit-flex-direction: row;\n  -ms-flex-direction: row;\n  flex-direction: row;\n  font-size: 1rem;\n  font-weight: 500;\n  -webkit-box-pack: center;\n  -webkit-justify-content: center;\n  -ms-flex-pack: center;\n  justify-content: center;\n  -webkit-letter-spacing: 0.75px;\n  -moz-letter-spacing: 0.75px;\n  -ms-letter-spacing: 0.75px;\n  padding: 0.75rem 1.5rem;\n  letter-spacing: 0.75px;\n  overflow: hidden;\n  position: relative;\n  -webkit-transition: background-color 0.2s, border-color 0.2s, color 0.2s;\n  transition: background-color 0.2s, border-color 0.2s, color 0.2s;\n}\n.x-button.x-button--icon-only.sc-xplor-button {\n  width: 48px;\n  height: 48px;\n  padding: 0;\n  border-radius: 50%;\n  min-width: 48px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.x-button.x-button--icon-only.sc-xplor-button .button-icon.sc-xplor-button {\n  font-size: 20px;\n  font-weight: 300;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.x-button.x-button--icon-only.sc-xplor-button .button-icon.button-icon--svg.sc-xplor-button svg.sc-xplor-button {\n  width: 1rem;\n  height: 1rem;\n  display: block;\n}\n.x-button.x-button--with-icon.sc-xplor-button .button-icon.sc-xplor-button {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 18px;\n  line-height: 1;\n}\n.x-button.x-button--with-icon.x-button--icon-start.sc-xplor-button .button-icon--svg.sc-xplor-button {\n  margin-right: 0.5rem;\n}\n.x-button.x-button--with-icon.x-button--icon-end.sc-xplor-button .button-icon--svg.sc-xplor-button {\n  margin-left: 0.5rem;\n}\n.x-button.x-button--with-icon.sc-xplor-button .button-icon--svg.sc-xplor-button svg.sc-xplor-button {\n  display: block;\n  width: 14px;\n  height: 14px;\n}\n.x-button.x-button--with-icon.sc-xplor-button .button-icon--svg.sc-xplor-button svg.sc-xplor-button path.sc-xplor-button {\n  fill: currentColor;\n}\n.x-button.x-button--with-icon.sc-xplor-button .button-text.sc-xplor-button {\n  line-height: 1;\n}\n.x-button.x-button--icon-start.sc-xplor-button {\n  flex-direction: row;\n}\n.x-button.x-button--icon-end.sc-xplor-button {\n  flex-direction: row;\n}\n.x-button.primary.sc-xplor-button {\n  background-color: var(--color-primary);\n  border-color: var(--color-primary);\n  color: white;\n}\n.x-button.primary.sc-xplor-button:hover {\n  background-color: var(--color-primary-50, #e3f2fd);\n  border-color: var(--color-primary-50, #e3f2fd);\n  color: white;\n}\n.x-button.secondary.sc-xplor-button {\n  background-color: var(--color-secondary);\n  border-color: var(--color-secondary);\n  color: white;\n}\n.x-button.secondary.sc-xplor-button:hover {\n  background-color: var(--color-secondary-50, #f3e5f5);\n  border-color: var(--color-secondary-50, #f3e5f5);\n  color: white;\n}\n.x-button.ghost.sc-xplor-button {\n  background-color: #fff;\n  border-color: var(--color-secondary);\n  color: var(--color-secondary);\n}\n.x-button.ghost.sc-xplor-button:hover {\n  background-color: #DFF2F1;\n  border-color: var(--color-secondary);\n  color: var(--color-secondary);\n}\n.x-button.ghost.sc-xplor-button:active {\n  background-color: #BEE6E4;\n  border-color: var(--color-secondary);\n  color: var(--color-secondary);\n}\n.x-button.minimal.sc-xplor-button {\n  background-color: transparent;\n  border-color: transparent;\n  color: var(--color-primary);\n}\n.x-button.success.sc-xplor-button {\n  background-color: transparent;\n  border-color: var(--color-success, #4caf50);\n  color: var(--color-success, #4caf50);\n}\n.x-button.success.sc-xplor-button:hover {\n  background-color: var(--color-success-50, #e8f5e9);\n  border-color: var(--color-success, #4caf50);\n  color: var(--color-success, #4caf50);\n}\n.x-button.success.sc-xplor-button:active {\n  background-color: var(--color-success-100, #c8e6c9);\n}\n.x-button.text.sc-xplor-button {\n  background-color: transparent;\n  border-color: transparent;\n  color: var(--color-secondary);\n}\n.x-button.text.sc-xplor-button:hover {\n  background-color: var(--color-secondary-50, #f3e5f5);\n}\n.x-button.text.sc-xplor-button:active {\n  background-color: var(--color-secondary-100, #e1bee7);\n}\n.x-button.disabled.sc-xplor-button {\n  background-color: #f6f6f6;\n  border-color: #a0a0a0;\n  color: #a0a0a0;\n}\n\n.icon.sc-xplor-button {\n  background-color: #ffffff;\n  bottom: 0px;\n  left: 0px;\n  opacity: 0;\n  position: absolute;\n  right: 0px;\n  top: 0px;\n  -webkit-transition: opacity 0.2s;\n  transition: opacity 0.2s;\n}\n\n.x-button--icon-only.small.sc-xplor-button {\n  width: 36px;\n  height: 36px;\n  padding: 0.25rem;\n}\n.x-button--icon-only.small.sc-xplor-button .button-icon.sc-xplor-button {\n  font-size: 16px;\n}\n.x-button--icon-only.button-icon--svg.sc-xplor-button {\n  padding: 0.25rem;\n}\n.x-button--icon-only.button-icon--svg.sc-xplor-button svg.sc-xplor-button {\n  width: 16px;\n  height: 16px;\n}\n.x-button--icon-only.large.sc-xplor-button {\n  width: 56px;\n  height: 56px;\n}\n.x-button--icon-only.large.sc-xplor-button .button-icon.sc-xplor-button {\n  font-size: 24px;\n}\n\n.x-button.disabled.x-button--icon-only.sc-xplor-button, .x-button.disabled.x-button--with-icon.sc-xplor-button {\n  cursor: not-allowed;\n  opacity: 0.6;\n}";
 const XplorButton = /*@__PURE__*/ proxyCustomElement(class XplorButton extends H {
     constructor() {
@@ -10,6 +10,8 @@ const XplorButton = /*@__PURE__*/ proxyCustomElement(class XplorButton extends H
         this.mode = 'pg'; // 'dark', 'pg', 'office' (default: 'dark')
         /** Whether the button is disabled */
         this.disabled = false;
+        /** Whether the button stretches to full width of its container */
+        this.fullWidth = false;
         /**
          * Icon to display (defaults to plus sign)
          */
@@ -24,7 +26,7 @@ const XplorButton = /*@__PURE__*/ proxyCustomElement(class XplorButton extends H
     render() {
         const isIconOnly = !this.text && this.iconPosition !== null;
         const hasIcon = this.iconPosition !== null;
-        return (h(Host, { key: '193c8139b43bdbaf108bf09d220b20d746f72cd7' }, h("slot", { key: '61b731d8173a15bcd76fbbf16f0d1d97cbab6e34' }, h("button", { key: '04486cbf547798161e7756a5999898bc46b298b5', role: "button", class: Object.assign({ 'x-button': true, [this.type]: true, 'shadow': this.type !== 'minimal' && this.type !== 'text', 'x-button--icon-only': isIconOnly, 'x-button--with-icon': hasIcon && !isIconOnly, 'x-button--icon-start': this.iconPosition === 'start' && !isIconOnly, 'x-button--icon-end': this.iconPosition === 'end' && !isIconOnly }, (this.styles ? { [this.styles]: true } : {})), onClick: () => this.clickAction && this.clickAction(), "aria-label": this.ariaLabel, "aria-disabled": this.disabled ? 'true' : null, disabled: this.disabled }, hasIcon && this.iconPosition === 'start' && this.renderIcon(), this.text && h("span", { key: '07e204d356d830444e1b26979be6f1f3926ba551', class: "button-text" }, this.text), hasIcon && this.iconPosition === 'end' && this.renderIcon()))));
+        return (h(Host, { key: '1c9b3ba3ef28cd3b721c2937ca76611543a369ea', class: { 'x-button--full-width': this.fullWidth } }, h("slot", { key: '38c8486396e069e779e2e350cbb659dec845b5c8' }, h("button", { key: '851684c2e881bb3b85eb4f6a1a1ba1d0f474afbb', role: "button", class: Object.assign({ 'x-button': true, [this.type]: true, 'x-button--full-width': this.fullWidth, 'x-button--icon-only': isIconOnly, 'x-button--with-icon': hasIcon && !isIconOnly, 'x-button--icon-start': this.iconPosition === 'start' && !isIconOnly, 'x-button--icon-end': this.iconPosition === 'end' && !isIconOnly }, (this.styles ? { [this.styles]: true } : {})), onClick: () => this.clickAction && this.clickAction(), "aria-label": this.ariaLabel, "aria-disabled": this.disabled ? 'true' : null, disabled: this.disabled }, hasIcon && this.iconPosition === 'start' && this.renderIcon(), this.text && h("span", { key: 'c99e5f351e5c3b1cd030bf3a253f648229795827', class: "button-text" }, this.text), hasIcon && this.iconPosition === 'end' && this.renderIcon()))));
     }
     static get style() { return xplorButtonCss; }
 }, [6, "xplor-button", {
@@ -36,6 +38,7 @@ const XplorButton = /*@__PURE__*/ proxyCustomElement(class XplorButton extends H
         "clickAction": [16, "click-action"],
         "ariaLabel": [1, "aria-label"],
         "disabled": [4],
+        "fullWidth": [516, "full-width"],
         "iconPosition": [1, "icon-position"],
         "icon": [1],
         "iconSvg": [1, "icon-svg"]
@@ -55,6 +58,6 @@ function defineCustomElement() {
 }
 export { XplorButton as X, defineCustomElement as d };
-//# sourceMappingURL=p-Bs_ocvfe.js.map
+//# sourceMappingURL=p-CyGsSa4H.js.map
-//# sourceMappingURL=p-Bs_ocvfe.js.map
+//# sourceMappingURL=p-CyGsSa4H.js.map

package/components/p-CyGsSa4H.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"p-CyGsSa4H.js","mappings":";;AAAA,MAAM,cAAc,GAAG,2qwBAA2qwB;;MCerrwB,WAAW,iBAAAA,kBAAA,CAAA,MAAA,WAAA,SAAAC,CAAA,CAAA;AAbxB,IAAA,WAAA,GAAA;;;AAeU,QAAA,IAAI,CAAA,IAAA,GAAoF,WAAW;AACnG,QAAA,IAAA,CAAA,IAAI,GAA8B,IAAI,CAAC;;AASvC,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;;AAGR,QAAA,IAAS,CAAA,SAAA,GAAY,KAAK;AAOnD;;AAEG;AACK,QAAA,IAAI,CAAA,IAAA,GAAW,GAAG;AAgD3B;IA7CS,UAAU,GAAA;QAChB,IAAI,IAAI,CAAC,IAAI,KAAK,KAAK,IAAI,IAAI,CAAC,OAAO,EAAE;AACvC,YAAA,QACE,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,+BAA+B,EAAC,SAAS,EAAE,IAAI,CAAC,OAAO,EAAA,CAAS;;AAGhF,QAAA,QACE,CAAM,CAAA,MAAA,EAAA,EAAA,KAAK,EAAC,aAAa,EACtB,EAAA,IAAI,CAAC,IAAI,CACL;;IAIX,MAAM,GAAA;AACJ,QAAA,MAAM,UAAU,GAAG,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,YAAY,KAAK,IAAI;AAC3D,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,YAAY,KAAK,IAAI;QAE1C,QACE,CAAA,CAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,KAAK,EAAE,EAAE,sBAAsB,EAAE,IAAI,CAAC,SAAS,EAAE,EAAA,EACrD,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACE,CACE,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,QAAQ,EACb,KAAK,kBACH,UAAU,EAAE,IAAI,EAChB,CAAC,IAAI,CAAC,IAAI,GAAG,IAAI,EACjB,sBAAsB,EAAE,IAAI,CAAC,SAAS,EACtC,qBAAqB,EAAE,UAAU,EACjC,qBAAqB,EAAE,OAAO,IAAI,CAAC,UAAU,EAC7C,sBAAsB,EAAE,IAAI,CAAC,YAAY,KAAK,OAAO,IAAI,CAAC,UAAU,EACpE,oBAAoB,EAAE,IAAI,CAAC,YAAY,KAAK,KAAK,IAAI,CAAC,UAAU,KAC5D,IAAI,CAAC,MAAM,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,GAAG,IAAI,EAAE,GAAG,EAAE,EAAC,EAEjD,OAAO,EAAE,MAAM,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,WAAW,EAAE,EACzC,YAAA,EAAA,IAAI,CAAC,SAAS,EACX,eAAA,EAAA,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,IAAI,EAC5C,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAA,EAEtB,OAAO,IAAI,IAAI,CAAC,YAAY,KAAK,OAAO,IAAI,IAAI,CAAC,UAAU,EAAE,EAC7D,IAAI,CAAC,IAAI,IAAI,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,aAAa,EAAE,EAAA,IAAI,CAAC,IAAI,CAAQ,EACzD,OAAO,IAAI,IAAI,CAAC,YAAY,KAAK,KAAK,IAAI,IAAI,CAAC,UAAU,EAAE,CACrD,CACJ,CACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/xplor-button/xplor-button.scss?tag=xplor-button&encapsulation=scoped","src/components/xplor-button/xplor-button.tsx"],"sourcesContent":["@use '../../styles/colours.scss' as colours-pg;\n@use '../../styles/spacing.scss' as spacing;\n\n:host {\n display: block;\n}\n\n:host(.x-button--full-width) {\n width: 100%;\n}\n\n.x-button--full-width {\n width: 100%;\n}\n\n.x-button {\n display: -webkit-box;\n display: -webkit-flex;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-pack: center;\n -webkit-justify-content: center;\n -ms-flex-pack: center;\n justify-content: center;\n position: relative;\n -webkit-align-items: center;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n border: 1px solid;\n border-radius: 1rem;\n cursor: pointer;\n display: block;\n -webkit-flex-direction: row;\n -ms-flex-direction: row;\n flex-direction: row;\n font-size: 1rem;\n font-weight: 500;\n -webkit-box-pack: center;\n -webkit-justify-content: center;\n -ms-flex-pack: center;\n justify-content: center;\n -webkit-letter-spacing: 0.75px;\n -moz-letter-spacing: 0.75px;\n -ms-letter-spacing: 0.75px;\n padding: spacing.$spacing-12 spacing.$spacing-24;\n letter-spacing: 0.75px;\n overflow: hidden;\n position: relative;\n -webkit-transition:\n background-color 0.2s,\n border-color 0.2s,\n color 0.2s;\n transition:\n background-color 0.2s,\n border-color 0.2s,\n color 0.2s;\n\n // Icon Only Button (Circular)\n &.x-button--icon-only {\n width: 48px;\n height: 48px;\n padding: 0;\n border-radius: 50%;\n min-width: 48px;\n display: flex;\n align-items: center;\n justify-content: center;\n\n .button-icon {\n font-size: 20px;\n font-weight: 300;\n display: flex;\n align-items: center;\n justify-content: center;\n\n &.button-icon--svg {\n svg {\n width: spacing.$spacing-16;\n height: spacing.$spacing-16;\n display: block;\n }\n }\n }\n }\n\n // Regular Button with Icon\n &.x-button--with-icon {\n .button-icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-size: 18px;\n line-height: 1;\n }\n\n // SVG icon styles\n &.x-button--icon-start {\n .button-icon--svg {\n margin-right: spacing.$spacing-8 ;\n }\n }\n\n &.x-button--icon-end {\n .button-icon--svg {\n margin-left: spacing.$spacing-8 ;\n }\n }\n\n .button-icon--svg {\n\n\n svg {\n display: block;\n width: 14px;\n height: 14px;\n\n\n path {\n fill: currentColor;\n }\n }\n }\n\n .button-text {\n line-height: 1;\n }\n }\n\n // Icon positioning\n &.x-button--icon-start {\n flex-direction: row;\n }\n\n &.x-button--icon-end {\n flex-direction: row;\n }\n\n &.primary {\n background-color: colours-pg.$primary;\n border-color: colours-pg.$primary;\n color: white;\n\n &:hover {\n background-color: colours-pg.$primary-50;\n border-color: colours-pg.$primary-50;\n color: white;\n }\n }\n\n &.secondary {\n background-color: colours-pg.$secondary;\n border-color: colours-pg.$secondary;\n color: white;\n\n &:hover {\n background-color: colours-pg.$secondary-50;\n border-color: colours-pg.$secondary-50;\n color: white;\n ;\n }\n }\n\n &.ghost {\n background-color: #fff;\n border-color: colours-pg.$secondary;\n color: colours-pg.$secondary;\n\n &:hover {\n background-color: #DFF2F1;\n border-color: colours-pg.$secondary;\n color: colours-pg.$secondary;\n\n }\n\n &:active {\n background-color: #BEE6E4;\n border-color: colours-pg.$secondary;\n color: colours-pg.$secondary;\n\n }\n }\n\n &.minimal {\n background-color: transparent;\n border-color: transparent;\n color: colours-pg.$primary;\n }\n\n &.success {\n background-color: transparent;\n border-color: colours-pg.$success;\n color: colours-pg.$success;\n\n &:hover {\n background-color: colours-pg.$success-50;\n border-color: colours-pg.$success;\n color: colours-pg.$success;\n }\n\n &:active {\n background-color: colours-pg.$success-100;\n }\n }\n\n &.text {\n background-color: transparent;\n border-color: transparent;\n color: colours-pg.$secondary;\n\n &:hover {\n background-color: colours-pg.$secondary-50;\n }\n\n &:active {\n background-color: colours-pg.$secondary-100;\n }\n }\n\n &.disabled {\n background-color: #f6f6f6;\n border-color: #a0a0a0;\n color: #a0a0a0;\n }\n}\n\n.icon {\n background-color: #ffffff;\n bottom: 0px;\n left: 0px;\n opacity: 0;\n position: absolute;\n right: 0px;\n top: 0px;\n -webkit-transition: opacity 0.2s;\n transition: opacity 0.2s;\n}\n\n// Size variations for icon-only buttons\n.x-button--icon-only {\n &.small {\n width: 36px;\n height: 36px;\n padding: spacing.$spacing-4;\n\n .button-icon {\n font-size: 16px;\n }\n }\n\n &.button-icon--svg {\n padding: spacing.$spacing-4;\n\n svg {\n width: 16px;\n height: 16px;\n\n }\n }\n\n &.large {\n width: 56px;\n height: 56px;\n\n .button-icon {\n font-size: 24px;\n }\n }\n}\n\n// Ensure disabled state works with icon buttons\n.x-button.disabled {\n\n &.x-button--icon-only,\n &.x-button--with-icon {\n cursor: not-allowed;\n opacity: 0.6;\n }\n}","import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'xplor-button',\n styleUrl: 'xplor-button.scss',\n // we cant use multiple styleUrls because the mode property is not reactive only in stencilJS and once the component is rendered it wont change the css file\n // so we are using only one styleUrl and changing the styles based on the mode property in the class\n // styleUrls: {\n // default: 'xplor-button.scss',\n // dark: 'xplor-button-pg.scss',\n // pg: 'xplor-button-pg.scss',\n // office: 'xplor-button-office.scss',\n // },\n scoped: true,\n})\nexport class XplorButton {\n @Prop() text: string;\n @Prop() type: 'minimal' | 'primary' | 'secondary' | 'ghost' | 'disabled' | 'success' | 'text' = 'secondary';\n @Prop() mode?: 'dark' | 'pg' | 'office' = 'pg'; // 'dark', 'pg', 'office' (default: 'dark')\n @Prop() size?: string; // 'small', 'medium', 'large' (default:'medium')\n @Prop() styles?: string;\n @Prop() clickAction: () => void;\n\n /** Accessible label for icon-only buttons */\n @Prop() ariaLabel: string;\n\n /** Whether the button is disabled */\n @Prop() disabled: boolean = false;\n\n /** Whether the button stretches to full width of its container */\n @Prop({ reflect: true }) fullWidth: boolean = false;\n\n /**\n * Icon position: 'start' | 'end' | null\n */\n @Prop() iconPosition: 'start' | 'end' | null;\n\n /**\n * Icon to display (defaults to plus sign)\n */\n @Prop() icon: string = '+';\n @Prop() iconSvg?: string;\n\n private renderIcon() {\n if (this.icon === 'svg' && this.iconSvg) {\n return (\n <span class=\"button-icon button-icon--svg \" innerHTML={this.iconSvg}></span>\n );\n }\n return (\n <span class=\"button-icon\">\n {this.icon}\n </span>\n );\n }\n\n render() {\n const isIconOnly = !this.text && this.iconPosition !== null;\n const hasIcon = this.iconPosition !== null;\n\n return (\n <Host class={{ 'x-button--full-width': this.fullWidth }}>\n <slot>\n <button\n role=\"button\"\n class={{\n 'x-button': true,\n [this.type]: true,\n 'x-button--full-width': this.fullWidth,\n 'x-button--icon-only': isIconOnly,\n 'x-button--with-icon': hasIcon && !isIconOnly,\n 'x-button--icon-start': this.iconPosition === 'start' && !isIconOnly,\n 'x-button--icon-end': this.iconPosition === 'end' && !isIconOnly,\n ...(this.styles ? { [this.styles]: true } : {}),\n }}\n onClick={() => this.clickAction && this.clickAction()}\n aria-label={this.ariaLabel}\n aria-disabled={this.disabled ? 'true' : null}\n disabled={this.disabled}\n >\n {hasIcon && this.iconPosition === 'start' && this.renderIcon()}\n {this.text && <span class=\"button-text\">{this.text}</span>}\n {hasIcon && this.iconPosition === 'end' && this.renderIcon()}\n </button>\n </slot>\n </Host>\n );\n }\n}"],"version":3}

package/components/{p-B3zR7peH.js → p-oanCZPh6.js} RENAMED Viewed

@@ -16,8 +16,8 @@ const XplorAvatar = /*@__PURE__*/ proxyCustomElement(class XplorAvatar extends H
             className += ` xpl-avatar--${this.size}`;
         if (this.color)
             className += ` xpl-avatar--${this.color}`;
-        const inner = (h("div", { key: '2e2722f2649108b7fdc3fd51375e17ac47e6f1ff' }, this.src ? (h("img", { alt: this.name, src: this.src })) : (h("div", { class: "xpl-avatar__placeholder" }, h("slot", null))), this.status && h("div", { key: '26fa57a9a697a110ef73434376715eda0e5134a5', class: `xpl-avatar__dot--${this.status}`, "aria-label": `Status: ${this.status}`, role: "img" })));
-        return (h(Host, { key: '9c99cec20679f0d10fbcf9dffc70877c0dc879f9' }, this.href && !this.disabled ? (h("a", { href: this.href, class: className, target: this.target }, inner)) : this.href && this.disabled ? (h("div", { class: className + ' xpl-avatar--disabled' }, inner)) : (h("div", { class: className }, inner))));
+        const inner = (h("div", { key: '525379beeb0274318733a9369cd21e2cbb4c29d5' }, this.src ? (h("img", { alt: this.name, src: this.src })) : (h("div", { class: "xpl-avatar__placeholder" }, h("slot", null))), this.status && h("div", { key: '13a67637105ff7bfc277dea7bf5db54b418e3925', class: `xpl-avatar__dot--${this.status}`, "aria-label": `Status: ${this.status}`, role: "img" })));
+        return (h(Host, { key: '3f9ba8949f576d96bd14c8a1387124af752f63b9' }, this.href && !this.disabled ? (h("a", { href: this.href, class: className, target: this.target }, inner)) : this.href && this.disabled ? (h("div", { class: className + ' xpl-avatar--disabled' }, inner)) : (h("div", { class: className }, inner))));
     }
     static get style() { return xplorAvatarCss; }
 }, [1, "xplor-avatar", {
@@ -45,6 +45,6 @@ function defineCustomElement() {
 }
 export { XplorAvatar as X, defineCustomElement as d };
-//# sourceMappingURL=p-B3zR7peH.js.map
+//# sourceMappingURL=p-oanCZPh6.js.map
-//# sourceMappingURL=p-B3zR7peH.js.map
+//# sourceMappingURL=p-oanCZPh6.js.map