@descope/web-components-ui 1.0.297 → 1.0.298
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/cjs/index.cjs.js +23 -23
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.esm.js +24 -24
- package/dist/index.esm.js.map +1 -1
- package/dist/umd/DescopeDev.js +1 -1
- package/dist/umd/index.js +1 -1
- package/dist/umd/text-components-descope-enriched-text-index-js.js +1 -0
- package/package.json +1 -1
- package/src/components/text-components/{descope-markdown-content/MarkdownContentClass.js → descope-enriched-text/EnrichedTextClass.js} +17 -17
- package/src/components/text-components/descope-enriched-text/index.js +5 -0
- package/src/index.cjs.js +1 -1
- package/src/index.d.ts +1 -1
- package/src/index.js +1 -1
- package/src/theme/components/{markdownContent.js → enrichedText.js} +4 -4
- package/src/theme/components/index.js +2 -2
- package/dist/umd/text-components-descope-markdown-content-index-js.js +0 -1
- package/src/components/text-components/descope-markdown-content/index.js +0 -5
- /package/src/components/text-components/{descope-markdown-content → descope-enriched-text}/helpers.js +0 -0
package/dist/index.d.ts
CHANGED
@@ -25,7 +25,7 @@ export { NumberFieldClass } from './components/descope-number-field';
|
|
25
25
|
export { PasscodeClass } from './components/descope-passcode';
|
26
26
|
export { PasswordClass } from './components/descope-password';
|
27
27
|
export { TextClass } from './components/text-components/descope-text';
|
28
|
-
export {
|
28
|
+
export { EnrichedTextClass } from './components/text-components/descope-enriched-text';
|
29
29
|
export { TextAreaClass } from './components/descope-text-area';
|
30
30
|
export { TextFieldClass } from './components/descope-text-field';
|
31
31
|
export { ImageClass } from './components/descope-image';
|
package/dist/index.esm.js
CHANGED
@@ -3385,12 +3385,12 @@ const onClipboardCopy = (e) => {
|
|
3385
3385
|
e.preventDefault();
|
3386
3386
|
};
|
3387
3387
|
|
3388
|
-
const componentName$z = getComponentName('
|
3388
|
+
const componentName$z = getComponentName('enriched-text');
|
3389
3389
|
|
3390
|
-
const
|
3390
|
+
const BaseEnrichedTextClass = createBaseTextClass(componentName$z);
|
3391
3391
|
|
3392
|
-
const
|
3393
|
-
class
|
3392
|
+
const EnrichedTextMixin = (superclass) =>
|
3393
|
+
class EnrichedTextMixinClass extends superclass {
|
3394
3394
|
static get observedAttributes() {
|
3395
3395
|
return ['disabled-rules', 'line-break'];
|
3396
3396
|
}
|
@@ -3405,7 +3405,7 @@ const markdownContentMixin = (superclass) =>
|
|
3405
3405
|
|
3406
3406
|
init() {
|
3407
3407
|
super.init();
|
3408
|
-
this.#
|
3408
|
+
this.#initProcessor();
|
3409
3409
|
this.textSlot.addEventListener('slotchange', this.#parseChildren.bind(this));
|
3410
3410
|
}
|
3411
3411
|
|
@@ -3414,28 +3414,28 @@ const markdownContentMixin = (superclass) =>
|
|
3414
3414
|
|
3415
3415
|
if (attrName === 'disabled-rules') {
|
3416
3416
|
if (newValue !== oldValue) {
|
3417
|
-
this.#
|
3417
|
+
this.#initProcessor(newValue);
|
3418
3418
|
this.#parseChildren();
|
3419
3419
|
}
|
3420
3420
|
}
|
3421
3421
|
}
|
3422
3422
|
|
3423
|
-
#
|
3424
|
-
this.
|
3423
|
+
#initProcessor() {
|
3424
|
+
this.processor = markdownit({ breaks: this.lineBreak }).disable(this.disabledRules);
|
3425
3425
|
}
|
3426
3426
|
|
3427
3427
|
#parseChildren() {
|
3428
3428
|
const node = this.textSlot.assignedNodes({ flatten: true })?.[0];
|
3429
3429
|
|
3430
3430
|
if (node && node.nodeType === Node.TEXT_NODE) {
|
3431
|
-
const tokens = this.
|
3432
|
-
const result = this.
|
3431
|
+
const tokens = this.processor.parse(node.textContent, { references: undefined });
|
3432
|
+
const result = this.processor.renderer.render(enrichTokens(tokens), {
|
3433
3433
|
breaks: this.lineBreak,
|
3434
3434
|
});
|
3435
3435
|
|
3436
3436
|
if (result !== node.textContent) {
|
3437
3437
|
const span = document.createElement('div');
|
3438
|
-
span.classList.add('
|
3438
|
+
span.classList.add('enriched-text');
|
3439
3439
|
// eslint-disable-next-line no-use-before-define
|
3440
3440
|
span.innerHTML = `${getStyleReset()}${result}`;
|
3441
3441
|
span.addEventListener('copy', onClipboardCopy);
|
@@ -3445,7 +3445,7 @@ const markdownContentMixin = (superclass) =>
|
|
3445
3445
|
}
|
3446
3446
|
};
|
3447
3447
|
|
3448
|
-
const
|
3448
|
+
const EnrichedTextClass = compose(
|
3449
3449
|
createStyleMixin({
|
3450
3450
|
mappings: {
|
3451
3451
|
hostWidth: { selector: () => ':host', property: 'width' },
|
@@ -3461,22 +3461,22 @@ const MarkdownContentClass = compose(
|
|
3461
3461
|
}),
|
3462
3462
|
draggableMixin,
|
3463
3463
|
componentNameValidationMixin,
|
3464
|
-
|
3464
|
+
EnrichedTextMixin,
|
3465
3465
|
hideWhenEmptyMixin
|
3466
|
-
)(
|
3466
|
+
)(BaseEnrichedTextClass);
|
3467
3467
|
|
3468
3468
|
function getStyleReset() {
|
3469
3469
|
return `
|
3470
3470
|
<style>
|
3471
|
-
.
|
3472
|
-
.
|
3473
|
-
margin-bottom: var(${
|
3471
|
+
.enriched-text > * { margin:0 }
|
3472
|
+
.enriched-text > *:not(:only-child):not(:last-child) {
|
3473
|
+
margin-bottom: var(${EnrichedTextClass.cssVarList.textLineHeight})
|
3474
3474
|
}
|
3475
3475
|
</style>
|
3476
3476
|
`;
|
3477
3477
|
}
|
3478
3478
|
|
3479
|
-
customElements.define(componentName$z,
|
3479
|
+
customElements.define(componentName$z, EnrichedTextClass);
|
3480
3480
|
|
3481
3481
|
const componentName$y = getComponentName('text-area');
|
3482
3482
|
|
@@ -11537,9 +11537,9 @@ var text$1 = /*#__PURE__*/Object.freeze({
|
|
11537
11537
|
});
|
11538
11538
|
|
11539
11539
|
const globalRefs$i = getThemeRefs(globals);
|
11540
|
-
const vars$q =
|
11540
|
+
const vars$q = EnrichedTextClass.cssVarList;
|
11541
11541
|
|
11542
|
-
const
|
11542
|
+
const EnrichedText = {
|
11543
11543
|
[vars$q.hostDirection]: globalRefs$i.direction,
|
11544
11544
|
|
11545
11545
|
[vars$q.fontSize]: globalRefs$i.typography.body1.size,
|
@@ -11614,9 +11614,9 @@ const markdownContent = {
|
|
11614
11614
|
},
|
11615
11615
|
};
|
11616
11616
|
|
11617
|
-
var
|
11617
|
+
var EnrichedText$1 = /*#__PURE__*/Object.freeze({
|
11618
11618
|
__proto__: null,
|
11619
|
-
default:
|
11619
|
+
default: EnrichedText,
|
11620
11620
|
vars: vars$q
|
11621
11621
|
});
|
11622
11622
|
|
@@ -12567,7 +12567,7 @@ const components = {
|
|
12567
12567
|
totpImage,
|
12568
12568
|
notpImage,
|
12569
12569
|
text: text$1,
|
12570
|
-
|
12570
|
+
EnrichedText: EnrichedText$1,
|
12571
12571
|
link: link$1,
|
12572
12572
|
divider: divider$1,
|
12573
12573
|
passcode: passcode$1,
|
@@ -12652,5 +12652,5 @@ const darkTheme = merge({}, defaultTheme, {
|
|
12652
12652
|
},
|
12653
12653
|
});
|
12654
12654
|
|
12655
|
-
export { AvatarClass, BadgeClass, ButtonClass, ButtonMultiSelectionGroupClass, ButtonSelectionGroupClass, CheckboxClass, ComboBoxClass, ContainerClass, DividerClass, EmailFieldClass, GridClass, ImageClass, LinkClass, LoaderLinearClass, LoaderRadialClass, LogoClass, MappingsFieldClass,
|
12655
|
+
export { AvatarClass, BadgeClass, ButtonClass, ButtonMultiSelectionGroupClass, ButtonSelectionGroupClass, CheckboxClass, ComboBoxClass, ContainerClass, DividerClass, EmailFieldClass, EnrichedTextClass, GridClass, ImageClass, LinkClass, LoaderLinearClass, LoaderRadialClass, LogoClass, MappingsFieldClass, ModalClass, MultiSelectComboBoxClass, NewPasswordClass, NotificationClass, NotpImageClass, NumberFieldClass, PasscodeClass, PasswordClass, PhoneFieldClass, PhoneFieldInputBoxClass, PolicyValidationClass, RecaptchaClass, SamlGroupMappingsClass, SwitchToggleClass, TextAreaClass, TextClass, TextFieldClass, TotpImageClass, UploadFileClass, UserAttributeClass, UserAuthMethodClass, componentsThemeManager, createComponentsTheme, darkTheme, defaultTheme, genColor, globalsThemeToStyle, themeToStyle, themeVars };
|
12656
12656
|
//# sourceMappingURL=index.esm.js.map
|