@descope/web-components-ui 1.0.299 → 1.0.301

package/dist/umd/text-components-descope-enriched-text-index-js.js

@@ -1 +0,0 @@
-"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[657],{2663:(e,t,n)=>{n.d(t,{T:()=>i});var s=n(3346);const i=e=>{class t extends((0,s.s)({componentName:e,baseSelector:":host > slot"})){constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n      <style>\n        :host {\n          display: inline-block;\n        }\n        :host > slot {\n          width: 100%;\n          display: inline-block;\n        }\n      </style>\n      <slot part="text-wrapper"></slot>\n      ',this.textSlot=this.shadowRoot.querySelector("slot")}}return t}},1655:(e,t,n)=>{n.r(t),n.d(t,{EnrichedTextClass:()=>g});var s=n(4569),i=n(4978),r=n(2061),o=n(4567),l=n(5753),a=n(2663);const d={a:"descope-link"},h=e=>e.map((e=>{const t=(e=>d[e.tag]||e.tag)(e);return(e=>"image"===e?.children?.[0].type)(e)?(e.children[0].attrs.push(["style","width:100%"]),{...e,tag:t}):e?.children?.length>0?{...e,tag:t,children:h(e.children)}:{...e,tag:t}})),c=e=>{const t=document.getSelection().toString(),n=e.clipboardData||window.clipboardData;n.setData("text/plain",t),n.setData("text/html",t),e.preventDefault()},p=(0,o.iY)("enriched-text"),u=(0,a.T)(p),g=(0,r.qC)((0,i.yk)({mappings:{hostWidth:{selector:()=>":host",property:"width"},hostDirection:{selector:()=>":host",property:"direction"},fontSize:{},fontFamily:{},fontWeight:{},textColor:{property:"color"},textLineHeight:{property:"line-height"},marginReset:{selector:"*",property:"margin"},textAlign:{}}}),i.e4,i.Ae,(e=>class extends e{static get observedAttributes(){return["disabled-rules","line-break","readonly"]}get lineBreak(){return this.getAttribute("line-break")}get disabledRules(){return(this.getAttribute("disabled-rules")||"").split(",").filter(Boolean)}init(){super.init(),this.#e(),this.textSlot.addEventListener("slotchange",this.#t.bind(this))}attributeChangedCallback(e,t,n){super.attributeChangedCallback?.(e,t,n),"disabled-rules"===e&&n!==t&&(this.#e(n),this.#t()),"readonly"===e&&this.onReadOnlyChange(null!==n)}#e(){this.processor=(0,s.Z)({breaks:this.lineBreak}).disable(this.disabledRules)}#t(){const e=this.textSlot.assignedNodes({flatten:!0})?.[0];if(e&&e.nodeType===Node.TEXT_NODE){const t=this.processor.parse(e.textContent,{references:void 0}),n=this.processor.renderer.render(h(t),{breaks:this.lineBreak});if(n!==e.textContent){const t=document.createElement("div");t.classList.add("enriched-text"),t.innerHTML=`\n  <style>\n    .enriched-text > * { margin:0 }\n    .enriched-text > *:not(:only-child):not(:last-child) {\n      margin-bottom: var(${g.cssVarList.textLineHeight})\n    }\n  </style>\n  ${n}`,t.addEventListener("copy",c),e.parentNode.replaceChild(t,e)}}}onReadOnlyChange(e){this.setAttribute("inert",e)}}),l.y)(u);customElements.define(p,g)},5753:(e,t,n)=>{n.d(t,{y:()=>i});var s=n(4567);const i=e=>class extends e{get hideWhenEmpty(){return"true"===this.getAttribute("hide-when-empty")}init(){super.init(),(0,s.P$)(this,(()=>{const e=!!this.childNodes.length;this.style.display=!e&&this.hideWhenEmpty?"none":""}))}}}}]);

package/dist/umd/text-components-descope-text-index-js.js

@@ -1 +0,0 @@
-"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[7433],{2663:(t,e,o)=>{o.d(e,{T:()=>n});var s=o(3346);const n=t=>{class e extends((0,s.s)({componentName:t,baseSelector:":host > slot"})){constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n      <style>\n        :host {\n          display: inline-block;\n        }\n        :host > slot {\n          width: 100%;\n          display: inline-block;\n        }\n      </style>\n      <slot part="text-wrapper"></slot>\n      ',this.textSlot=this.shadowRoot.querySelector("slot")}}return e}},1611:(t,e,o)=>{o.d(e,{f:()=>l,k:()=>c});var s=o(4978),n=o(2061),r=o(4567),i=o(5753),h=o(2663);const l=(0,r.iY)("text"),p=(0,h.T)(l),c=(0,n.qC)((0,s.yk)({mappings:{hostWidth:{selector:()=>":host",property:"width"},hostDirection:{selector:()=>":host",property:"direction"},fontSize:{},textColor:{property:"color"},textLineHeight:{property:"line-height"},textLetterSpacing:{property:"letter-spacing"},textShadow:{},textAlign:{},textTransform:{},fontFamily:{},fontStyle:{},fontWeight:{},borderWidth:{},borderStyle:{},borderColor:{}}}),s.e4,s.Ae,i.y)(p)},4803:(t,e,o)=>{o.r(e),o.d(e,{TextClass:()=>s.k});var s=o(1611);customElements.define(s.f,s.k)},5753:(t,e,o)=>{o.d(e,{y:()=>n});var s=o(4567);const n=t=>class extends t{get hideWhenEmpty(){return"true"===this.getAttribute("hide-when-empty")}init(){super.init(),(0,s.P$)(this,(()=>{const t=!!this.childNodes.length;this.style.display=!t&&this.hideWhenEmpty?"none":""}))}}}}]);

package/src/components/text-components/createBaseTextClass.js

@@ -1,26 +0,0 @@
-import { createBaseClass } from '../../baseClasses/createBaseClass';
-
-export const createBaseTextClass = (componentName) => {
-  class BaseText extends createBaseClass({ componentName, baseSelector: ':host > slot' }) {
-    constructor() {
-      super();
-
-      this.attachShadow({ mode: 'open' }).innerHTML = `
-      <style>
-        :host {
-          display: inline-block;
-        }
-        :host > slot {
-          width: 100%;
-          display: inline-block;
-        }
-      </style>
-      <slot part="text-wrapper"></slot>
-      `;
-
-      this.textSlot = this.shadowRoot.querySelector('slot');
-    }
-  }
-
-  return BaseText;
-};

package/src/components/text-components/descope-enriched-text/EnrichedTextClass.js

@@ -1,106 +0,0 @@
-import markdownit from 'markdown-it';
-import { createStyleMixin, draggableMixin, componentNameValidationMixin } from '../../../mixins';
-import { compose } from '../../../helpers';
-import { getComponentName } from '../../../helpers/componentHelpers';
-import { hideWhenEmptyMixin } from '../hideWhenEmptyMixin';
-import { createBaseTextClass } from '../createBaseTextClass';
-import { enrichTokens, onClipboardCopy } from './helpers';
-
-export const componentName = getComponentName('enriched-text');
-
-const BaseEnrichedTextClass = createBaseTextClass(componentName);
-
-const EnrichedTextMixin = (superclass) =>
-  class EnrichedTextMixinClass extends superclass {
-    static get observedAttributes() {
-      return ['disabled-rules', 'line-break', 'readonly'];
-    }
-
-    get lineBreak() {
-      return this.getAttribute('line-break');
-    }
-
-    get disabledRules() {
-      return (this.getAttribute('disabled-rules') || '').split(',').filter(Boolean);
-    }
-
-    init() {
-      super.init();
-      this.#initProcessor();
-      this.textSlot.addEventListener('slotchange', this.#parseChildren.bind(this));
-    }
-
-    attributeChangedCallback(attrName, oldValue, newValue) {
-      super.attributeChangedCallback?.(attrName, oldValue, newValue);
-
-      if (attrName === 'disabled-rules') {
-        if (newValue !== oldValue) {
-          this.#initProcessor(newValue);
-          this.#parseChildren();
-        }
-      }
-
-      if (attrName === 'readonly') {
-        this.onReadOnlyChange(newValue !== null);
-      }
-    }
-
-    #initProcessor() {
-      this.processor = markdownit({ breaks: this.lineBreak }).disable(this.disabledRules);
-    }
-
-    #parseChildren() {
-      const node = this.textSlot.assignedNodes({ flatten: true })?.[0];
-
-      if (node && node.nodeType === Node.TEXT_NODE) {
-        const tokens = this.processor.parse(node.textContent, { references: undefined });
-        const result = this.processor.renderer.render(enrichTokens(tokens), {
-          breaks: this.lineBreak,
-        });
-
-        if (result !== node.textContent) {
-          const span = document.createElement('div');
-          span.classList.add('enriched-text');
-          // eslint-disable-next-line no-use-before-define
-          span.innerHTML = `${getStyleReset()}${result}`;
-          span.addEventListener('copy', onClipboardCopy);
-          node.parentNode.replaceChild(span, node);
-        }
-      }
-    }
-
-    onReadOnlyChange(val) {
-      this.setAttribute('inert', val);
-    }
-  };
-
-export const EnrichedTextClass = compose(
-  createStyleMixin({
-    mappings: {
-      hostWidth: { selector: () => ':host', property: 'width' },
-      hostDirection: { selector: () => ':host', property: 'direction' },
-      fontSize: {},
-      fontFamily: {},
-      fontWeight: {},
-      textColor: { property: 'color' },
-      textLineHeight: { property: 'line-height' },
-      marginReset: { selector: '*', property: 'margin' },
-      textAlign: {},
-    },
-  }),
-  draggableMixin,
-  componentNameValidationMixin,
-  EnrichedTextMixin,
-  hideWhenEmptyMixin
-)(BaseEnrichedTextClass);
-
-function getStyleReset() {
-  return `
-  <style>
-    .enriched-text > * { margin:0 }
-    .enriched-text > *:not(:only-child):not(:last-child) {
-      margin-bottom: var(${EnrichedTextClass.cssVarList.textLineHeight})
-    }
-  </style>
-  `;
-}

package/src/components/text-components/descope-enriched-text/helpers.js

@@ -1,41 +0,0 @@
-const customEleMap = {
-  a: 'descope-link',
-};
-
-const getTokenTag = (token) => customEleMap[token.tag] || token.tag;
-
-const isImageToken = (token) => token?.children?.[0].type === 'image';
-
-export const enrichTokens = (tokens) =>
-  tokens.map((token) => {
-    const tag = getTokenTag(token);
-
-    if (isImageToken(token)) {
-      token.children[0].attrs.push(['style', 'width:100%']);
-      return {
-        ...token,
-        tag,
-      };
-    }
-
-    if (token?.children?.length > 0) {
-      return {
-        ...token,
-        tag,
-        children: enrichTokens(token.children),
-      };
-    }
-
-    return {
-      ...token,
-      tag,
-    };
-  });
-
-export const onClipboardCopy = (e) => {
-  const selection = document.getSelection().toString();
-  const clipdata = e.clipboardData || window.clipboardData;
-  clipdata.setData('text/plain', selection);
-  clipdata.setData('text/html', selection);
-  e.preventDefault();
-};

package/src/components/text-components/descope-text/TextClass.js

@@ -1,34 +0,0 @@
-import { createStyleMixin, draggableMixin, componentNameValidationMixin } from '../../../mixins';
-import { compose } from '../../../helpers';
-import { getComponentName } from '../../../helpers/componentHelpers';
-import { hideWhenEmptyMixin } from '../hideWhenEmptyMixin';
-import { createBaseTextClass } from '../createBaseTextClass';
-
-export const componentName = getComponentName('text');
-
-const BaseTextClass = createBaseTextClass(componentName);
-
-export const TextClass = compose(
-  createStyleMixin({
-    mappings: {
-      hostWidth: { selector: () => ':host', property: 'width' },
-      hostDirection: { selector: () => ':host', property: 'direction' },
-      fontSize: {},
-      textColor: { property: 'color' },
-      textLineHeight: { property: 'line-height' },
-      textLetterSpacing: { property: 'letter-spacing' },
-      textShadow: {},
-      textAlign: {},
-      textTransform: {},
-      fontFamily: {},
-      fontStyle: {},
-      fontWeight: {},
-      borderWidth: {},
-      borderStyle: {},
-      borderColor: {},
-    },
-  }),
-  draggableMixin,
-  componentNameValidationMixin,
-  hideWhenEmptyMixin
-)(BaseTextClass);

package/src/components/text-components/hideWhenEmptyMixin.js

@@ -1,17 +0,0 @@
-import { observeChildren } from '../../helpers/componentHelpers';
-
-export const hideWhenEmptyMixin = (superclass) =>
-  class HideWhenEmptyMixinClass extends superclass {
-    get hideWhenEmpty() {
-      return this.getAttribute('hide-when-empty') === 'true';
-    }
-
-    init() {
-      super.init();
-
-      observeChildren(this, () => {
-        const hasChildren = !!this.childNodes.length;
-        this.style.display = !hasChildren && this.hideWhenEmpty ? 'none' : '';
-      });
-    }
-  };