@descope/web-components-ui 1.0.417 → 1.0.419
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.cjs.js +13 -2
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.esm.js +13 -0
- package/dist/index.esm.js.map +1 -1
- package/dist/umd/DescopeDev.js +1 -1
- package/dist/umd/descope-alert-index-js.js +1 -1
- package/package.json +1 -1
- package/src/components/descope-alert/AlertClass.js +2 -1
- package/src/theme/components/alert.js +12 -0
@@ -1 +1 @@
|
|
1
|
-
"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[1456,5710],{35479:(e,t,r)=>{r.r(t),r.d(t,{AlertClass:()=>h});var n=r(
|
1
|
+
"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[1456,5710],{35479:(e,t,r)=>{r.r(t),r.d(t,{AlertClass:()=>h}),r(94694);var n=r(94619),o=r(7138),s=r(14944),i=r(70263),l=r(96431);const a=(0,s.xE)("alert");class d extends((0,i.q)({componentName:a,baseSelector:":host > div"})){constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <style>\n :host {\n display: inline-flex;\n }\n :host > div {\n display: flex;\n width: 100%;\n }\n .icon {\n flex-shrink: 0;\n }\n .content {\n display: flex;\n flex-wrap: wrap;\n white-space: normal;\n overflow-wrap: break-word;\n }\n </style>\n <div>\n <div class="icon"></div>\n <div class="content">\n <descope-enriched-text>\n <slot></slot>\n </descope-enriched-text>\n </div>\n </div>\n '}init(){super.init?.(),this.slotEle=this.shadowRoot.querySelector("slot"),this.textComp=this.shadowRoot.querySelector("descope-enriched-text"),this.slotEle.addEventListener("slotchange",this.handleSlotChange.bind(this)),(0,s.EA)(this,this.textComp,["variant","full-width","link-target-blank"])}handleSlotChange(){const e=this.slotEle.assignedNodes({flatten:!0});e.length&&(this.textComp.textContent=e[0]?.textContent||"")}}const{icon:c}={icon:{selector:()=>".icon"}},h=(0,o.Zz)((0,n.RF)({mappings:{hostWidth:{selector:()=>":host",property:"width"},hostDirection:{selector:()=>":host",property:"direction"},textColor:{selector:l.m.componentName,property:l.m.cssVarList.textColor},backgroundColor:{},borderColor:{},borderWidth:{},borderStyle:{},borderRadius:{},fontSize:[{},{selector:l.m.componentName,property:l.m.cssVarList.fontSize}],gap:{},horizontalPadding:[{property:"padding-top"},{property:"padding-bottom"}],verticalPadding:[{property:"padding-right"},{property:"padding-left"}],alignItems:{},justifyContent:{},icon:[{...c,property:"content"},{...c,property:"display",fallback:"none"}],iconSize:[{...c,property:"width"},{...c,property:"height"}]}}),(0,n.RF)({componentNameOverride:(0,s.xE)("enriched-text")}),(0,n.RF)({componentNameOverride:(0,s.xE)("text")}),n.VO,n.tQ)(d);customElements.define(a,h)},96431:(e,t,r)=>{r.d(t,{T:()=>c,m:()=>p});var n=r(61672),o=r(94619),s=r(7138),i=r(14944),l=r(74136),a=r(70263),d=r(62583);const c=(0,i.xE)("enriched-text");class h extends((0,a.q)({componentName:c,baseSelector:":host > div"})){#e;#t;constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <style>\n :host {\n line-height: 1em;\n word-break: break-word;\n }\n :host > slot {\n width: 100%;\n display: inline-block;\n }\n *, *:last-child {\n margin: 0;\n }\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n p {\n margin-bottom: 1em;\n }\n a {\n cursor: pointer;\n }\n blockquote {\n padding: 0 2em;\n }\n u {\n text-decoration: underline\n }\n s {\n color: currentColor;\n }\n </style>\n <div class="content"></div>\n ',this.#r(),(0,i.Ge)(this,this.#n.bind(this))}static get observedAttributes(){return["readonly","link-target-blank"]}attributeChangedCallback(e,t,r){super.attributeChangedCallback?.(e,t,r),r!==t&&("readonly"===e&&this.onReadOnlyChange("true"===r),"link-target-blank"===e&&this.#r())}customUnderlineRenderer(){this.processor.renderer.rules.em_open=(e,t,r,n,o)=>("_"===e[t].markup&&(e[t].tag="u"),this.#t(e,t,r,n,o)),this.processor.renderer.rules.em_close=(e,t,r,n,o)=>("_"===e[t].markup&&(e[t].tag="u"),this.#t(e,t,r,n,o))}#o(){this.linkTargetBlank?this.processor.renderer.rules.link_open=(e,t,r,n,o)=>(e[t].attrSet("target","_blank"),this.#e(e,t,r,n,o)):this.processor.renderer.rules.link_open=this.#e}#s(){this.processor&&this.processor.disable(l.M)}#i(){this.#s()}#l(){this.#e=this.processor.renderer.rules.link_open||((e,t,r,n,o)=>o.renderToken(e,t,r)),this.#t=this.processor.renderer.rules.em_open||((e,t,r,n,o)=>o.renderToken(e,t,r))}#r(){this.processor=new n.A("commonmark",{html:!0}),this.#l(),this.#i(),this.#o(),this.customUnderlineRenderer()}get linkTargetBlank(){return"true"===this.getAttribute("link-target-blank")}get contentNode(){return this.shadowRoot.querySelector(".content")}#n(){if(!this.processor)return;let e=(0,d.G)(this.innerHTML);!e?.trim()&&this.isConnected?this.setAttribute("empty","true"):this.removeAttribute("empty");try{const t=this.processor.parse(e,{references:void 0});e=this.processor.renderer.render(t,{html:!0,breaks:!0})}catch(e){console.warn("Not parsing invalid markdown token")}this.contentNode.innerHTML=e}onReadOnlyChange(e){e?this.contentNode.setAttribute("inert",e):this.contentNode.removeAttribute("inert")}}const p=(0,s.Zz)((0,o.RF)({mappings:{hostWidth:{selector:()=>":host",property:"width"},hostDisplay:{selector:()=>":host",property:"display",fallback:"inline-block"},hostDirection:{selector:()=>":host",property:"direction"},fontSize:{},fontFamily:{},fontWeight:{},fontWeightBold:[{selector:()=>":host strong",property:"font-weight"},{selector:()=>":host b",property:"font-weight"}],textColor:{property:"color"},textLineHeight:{property:"line-height"},textAlign:{},linkColor:{selector:"a",property:"color"},linkTextDecoration:{selector:"a",property:"text-decoration"},linkHoverTextDecoration:{selector:"a:hover",property:"text-decoration"},minHeight:{},minWidth:{}}}),(0,o.RF)({componentNameOverride:(0,i.xE)("link")}),(0,o.RF)({componentNameOverride:(0,i.xE)("text")}),o.VO,o.tQ)(h)},74136:(e,t,r)=>{r.d(t,{M:()=>n});const n=["blockquote","list","image","table","code","hr","backticks","fence","reference","heading","lheading","html_block"]},62583:(e,t,r)=>{r.d(t,{G:()=>n});const n=e=>{const t=document.createElement("textarea");return t.innerHTML=e,t.value}},94694:(e,t,r)=>{r.r(t),r.d(t,{EnrichedTextClass:()=>n.m});var n=r(96431);customElements.define(n.T,n.m)}}]);
|
package/package.json
CHANGED
@@ -2,7 +2,7 @@ import { createStyleMixin, draggableMixin, componentNameValidationMixin } from '
|
|
2
2
|
import { compose } from '../../helpers';
|
3
3
|
import { forwardAttrs, getComponentName } from '../../helpers/componentHelpers';
|
4
4
|
import { createBaseClass } from '../../baseClasses/createBaseClass';
|
5
|
-
import { EnrichedTextClass } from '../descope-enriched-text';
|
5
|
+
import { EnrichedTextClass } from '../descope-enriched-text/EnrichedTextClass';
|
6
6
|
|
7
7
|
export const componentName = getComponentName('alert');
|
8
8
|
|
@@ -87,6 +87,7 @@ export const AlertClass = compose(
|
|
87
87
|
horizontalPadding: [{ property: 'padding-top' }, { property: 'padding-bottom' }],
|
88
88
|
verticalPadding: [{ property: 'padding-right' }, { property: 'padding-left' }],
|
89
89
|
alignItems: {},
|
90
|
+
justifyContent: {},
|
90
91
|
icon: [
|
91
92
|
{ ...icon, property: 'content' },
|
92
93
|
{ ...icon, property: 'display', fallback: 'none' },
|
@@ -59,6 +59,18 @@ const alert = {
|
|
59
59
|
},
|
60
60
|
},
|
61
61
|
|
62
|
+
textAlign: {
|
63
|
+
left: {
|
64
|
+
[vars.justifyContent]: 'left',
|
65
|
+
},
|
66
|
+
center: {
|
67
|
+
[vars.justifyContent]: 'center',
|
68
|
+
},
|
69
|
+
right: {
|
70
|
+
[vars.justifyContent]: 'right',
|
71
|
+
},
|
72
|
+
},
|
73
|
+
|
62
74
|
_bordered: {
|
63
75
|
[vars.borderWidth]: globalRefs.border.xs,
|
64
76
|
[vars.borderColor]: 'transparent',
|