@limetech/lime-elements 37.57.0 → 37.57.2

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 (40) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/dist/cjs/limel-flatpickr-adapter.cjs.entry.js +1 -2
  3. package/dist/cjs/limel-flatpickr-adapter.cjs.entry.js.map +1 -1
  4. package/dist/cjs/limel-markdown.cjs.entry.js +2 -2
  5. package/dist/cjs/limel-markdown.cjs.entry.js.map +1 -1
  6. package/dist/cjs/limel-prosemirror-adapter.cjs.entry.js +1 -1
  7. package/dist/cjs/limel-snackbar.cjs.entry.js +7 -2
  8. package/dist/cjs/limel-snackbar.cjs.entry.js.map +1 -1
  9. package/dist/cjs/{markdown-parser-292760cb.js → markdown-parser-ae3795b9.js} +3 -5
  10. package/dist/cjs/{markdown-parser-292760cb.js.map → markdown-parser-ae3795b9.js.map} +1 -1
  11. package/dist/collection/components/markdown/markdown-parser.js +1 -4
  12. package/dist/collection/components/markdown/markdown-parser.js.map +1 -1
  13. package/dist/collection/components/markdown/markdown.css +4 -0
  14. package/dist/collection/components/snackbar/snackbar.js +7 -2
  15. package/dist/collection/components/snackbar/snackbar.js.map +1 -1
  16. package/dist/esm/limel-flatpickr-adapter.entry.js +1 -2
  17. package/dist/esm/limel-flatpickr-adapter.entry.js.map +1 -1
  18. package/dist/esm/limel-markdown.entry.js +2 -2
  19. package/dist/esm/limel-markdown.entry.js.map +1 -1
  20. package/dist/esm/limel-prosemirror-adapter.entry.js +1 -1
  21. package/dist/esm/limel-snackbar.entry.js +7 -2
  22. package/dist/esm/limel-snackbar.entry.js.map +1 -1
  23. package/dist/esm/{markdown-parser-42f89d87.js → markdown-parser-453ad769.js} +3 -5
  24. package/dist/esm/{markdown-parser-42f89d87.js.map → markdown-parser-453ad769.js.map} +1 -1
  25. package/dist/lime-elements/lime-elements.esm.js +1 -1
  26. package/dist/lime-elements/{p-bf143783.entry.js → p-19405595.entry.js} +2 -2
  27. package/dist/lime-elements/p-19405595.entry.js.map +1 -0
  28. package/dist/lime-elements/{p-72bd27d5.entry.js → p-25ff5385.entry.js} +2 -2
  29. package/dist/lime-elements/p-25ff5385.entry.js.map +1 -0
  30. package/dist/lime-elements/{p-7c7651b2.entry.js → p-83648c76.entry.js} +2 -2
  31. package/dist/lime-elements/p-83648c76.entry.js.map +1 -0
  32. package/dist/lime-elements/{p-c0e08f94.js → p-ba3d2850.js} +3 -3
  33. package/dist/lime-elements/{p-c0e08f94.js.map → p-ba3d2850.js.map} +1 -1
  34. package/dist/lime-elements/{p-4db1db42.entry.js → p-cf66a132.entry.js} +2 -2
  35. package/dist/types/components/snackbar/snackbar.d.ts +2 -1
  36. package/package.json +7 -7
  37. package/dist/lime-elements/p-72bd27d5.entry.js.map +0 -1
  38. package/dist/lime-elements/p-7c7651b2.entry.js.map +0 -1
  39. package/dist/lime-elements/p-bf143783.entry.js.map +0 -1
  40. /package/dist/lime-elements/{p-4db1db42.entry.js.map → p-cf66a132.entry.js.map} +0 -0
@@ -3,10 +3,10 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-d1052409.js');
6
- const markdownParser = require('./markdown-parser-292760cb.js');
6
+ const markdownParser = require('./markdown-parser-ae3795b9.js');
7
7
  require('./_commonjsHelpers-0c557e26.js');
8
8
 
9
- const markdownCss = "@charset \"UTF-8\";code{font-family:ui-monospace, \"Cascadia Code\", \"Source Code Pro\", Menlo, Consolas, \"DejaVu Sans Mono\", monospace;font-size:0.8125rem;letter-spacing:-0.0125rem;color:rgb(var(--contrast-1300));-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none;display:inline-block;border-radius:0.25rem;padding:0.03125rem 0.25rem;background-color:rgb(var(--contrast-600))}pre>code{display:block;margin:0.5rem 0;padding:0.5rem 0.75rem;overflow:auto;white-space:pre-wrap}h1{font-size:1.5rem}h2{font-size:1.25rem}h3{font-size:1.125rem}h4{font-size:1rem}h5{font-size:0.875rem}h6{font-size:0.75rem}h1,h2{margin-top:0.5rem;margin-bottom:0.5rem;letter-spacing:-0.03125rem;font-weight:500}h3,h4{margin-top:0.75rem;margin-bottom:0.25rem;font-weight:600}h5,h6{margin-top:0.5rem;margin-bottom:0.125rem;font-weight:600}h1,h2,h3,h4,h5,h6{word-break:break-word;hyphens:auto;-webkit-hyphens:auto}:not([contenteditable=true]) h1,:not([contenteditable=true]) h2,:not([contenteditable=true]) h3,:not([contenteditable=true]) h4,:not([contenteditable=true]) h5,:not([contenteditable=true]) h6{text-wrap:balance}[contenteditable=true] h1,[contenteditable=true] h2,[contenteditable=true] h3,[contenteditable=true] h4,[contenteditable=true] h5,[contenteditable=true] h6{text-wrap:initial}:host(limel-markdown.truncate-paragraphs) p{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}p,li{font-size:0.875rem;word-break:break-word;hyphens:auto;-webkit-hyphens:auto}a{word-break:break-all}p{margin-top:0;margin-bottom:0.5rem}p:only-child{margin-bottom:0}a{transition:color 0.2s ease;color:var(--markdown-hyperlink-color, rgb(var(--color-blue-dark)));text-decoration:none}a:hover{color:var(--markdown-hyperlink-color--hovered, rgb(var(--color-blue-default)))}hr{margin:1.75rem 0 2rem 0;border-width:0;border-top:1px solid rgb(var(--contrast-500))}ul{list-style:none}ul li{position:relative;margin-left:0.75rem}ul li:before{content:\"\";position:absolute;left:-0.5rem;top:0.5rem;width:0.25rem;height:0.25rem;border-radius:50%;background-color:rgb(var(--contrast-700));display:block}ol{margin-top:0.25rem;padding-left:1rem}ul{margin-top:0.25rem;padding-left:0}ul ul,ul ol,ol ol,ol ul{margin-left:0}li{margin-bottom:0.25rem}:host(limel-markdown:not(.no-table-styles)) table{table-layout:auto;min-width:100%;border-collapse:collapse;border-spacing:0;background:transparent;margin:0.75rem 0;border:1px solid rgb(var(--contrast-400))}:host(limel-markdown:not(.no-table-styles)) th,:host(limel-markdown:not(.no-table-styles)) td{text-align:left;vertical-align:top;transition:background-color 0.2s ease;font-size:0.875rem}:host(limel-markdown:not(.no-table-styles)) td{padding:0.5rem 0.375rem 0.75rem 0.375rem}:host(limel-markdown:not(.no-table-styles)) tr th{background-color:rgb(var(--contrast-400));padding:0.25rem 0.375rem;font-weight:normal}:host(limel-markdown:not(.no-table-styles)) tr th:only-child{text-align:center}:host(limel-markdown:not(.no-table-styles)) tbody tr:nth-child(odd) td{background-color:rgb(var(--contrast-200))}:host(limel-markdown:not(.no-table-styles)) tbody tr:hover td{background-color:rgb(var(--contrast-300))}blockquote{position:relative;font-weight:100;font-size:0.875rem;max-width:100%;line-height:1.4;margin:0;padding:0.5rem 1.25rem;border-radius:0.05rem 0.75rem;background-color:rgb(var(--contrast-300))}blockquote:before,blockquote:after{position:absolute;font-size:2.75rem;opacity:0.4}blockquote:before{content:\"“\";left:0;top:-0.75rem}blockquote:after{content:\"”\";right:0;bottom:-2rem}dl{display:grid;grid-template-columns:1fr 2fr;grid-template-rows:1fr;margin-bottom:2rem;border:1px solid rgb(var(--contrast-400));border-radius:0.375rem;background-color:rgb(var(--contrast-200))}dl dt,dl dd{padding:0.375rem 0.5rem;font-size:0.875rem;margin:0}dl dt:nth-of-type(even),dl dd:nth-of-type(even){background-color:rgb(var(--contrast-300))}dl dt:first-child{border-top-left-radius:0.375rem}dl dt:last-child{border-bottom-left-radius:0.375rem}dl dd:first-child{border-top-right-radius:0.375rem}dl dd:last-child{border-bottom-right-radius:0.375rem}hr{border-top:1px solid rgb(var(--contrast-700))}img{max-width:100%}";
9
+ const markdownCss = "@charset \"UTF-8\";code{font-family:ui-monospace, \"Cascadia Code\", \"Source Code Pro\", Menlo, Consolas, \"DejaVu Sans Mono\", monospace;font-size:0.8125rem;letter-spacing:-0.0125rem;color:rgb(var(--contrast-1300));-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none;display:inline-block;border-radius:0.25rem;padding:0.03125rem 0.25rem;background-color:rgb(var(--contrast-600))}pre>code{display:block;margin:0.5rem 0;padding:0.5rem 0.75rem;overflow:auto;white-space:pre-wrap}h1{font-size:1.5rem}h2{font-size:1.25rem}h3{font-size:1.125rem}h4{font-size:1rem}h5{font-size:0.875rem}h6{font-size:0.75rem}h1,h2{margin-top:0.5rem;margin-bottom:0.5rem;letter-spacing:-0.03125rem;font-weight:500}h3,h4{margin-top:0.75rem;margin-bottom:0.25rem;font-weight:600}h5,h6{margin-top:0.5rem;margin-bottom:0.125rem;font-weight:600}h1,h2,h3,h4,h5,h6{word-break:break-word;hyphens:auto;-webkit-hyphens:auto}:not([contenteditable=true]) h1,:not([contenteditable=true]) h2,:not([contenteditable=true]) h3,:not([contenteditable=true]) h4,:not([contenteditable=true]) h5,:not([contenteditable=true]) h6{text-wrap:balance}[contenteditable=true] h1,[contenteditable=true] h2,[contenteditable=true] h3,[contenteditable=true] h4,[contenteditable=true] h5,[contenteditable=true] h6{text-wrap:initial}:host(limel-markdown.truncate-paragraphs) p{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}p,li{font-size:0.875rem;word-break:break-word;hyphens:auto;-webkit-hyphens:auto}a{word-break:break-all}p{margin-top:0;margin-bottom:0.5rem}p:only-child{margin-bottom:0}a{transition:color 0.2s ease;color:var(--markdown-hyperlink-color, rgb(var(--color-blue-dark)));text-decoration:none}a:hover{color:var(--markdown-hyperlink-color--hovered, rgb(var(--color-blue-default)))}hr{margin:1.75rem 0 2rem 0;border-width:0;border-top:1px solid rgb(var(--contrast-500))}ul{list-style:none}ul li{position:relative;margin-left:0.75rem}ul li:before{content:\"\";position:absolute;left:-0.5rem;top:0.5rem;width:0.25rem;height:0.25rem;border-radius:50%;background-color:rgb(var(--contrast-700));display:block}ol{margin-top:0.25rem;padding-left:1rem}ul{margin-top:0.25rem;padding-left:0}ul ul,ul ol,ol ol,ol ul{margin-left:0}li{margin-bottom:0.25rem}:host(limel-markdown:not(.no-table-styles)) table{table-layout:auto;min-width:100%;border-collapse:collapse;border-spacing:0;background:transparent;margin:0.75rem 0;border:1px solid rgb(var(--contrast-400))}:host(limel-markdown:not(.no-table-styles)) th,:host(limel-markdown:not(.no-table-styles)) td{text-align:left;vertical-align:top;transition:background-color 0.2s ease;font-size:0.875rem}:host(limel-markdown:not(.no-table-styles)) td{padding:0.5rem 0.375rem 0.75rem 0.375rem}:host(limel-markdown:not(.no-table-styles)) tr th{background-color:rgb(var(--contrast-400));padding:0.25rem 0.375rem;font-weight:normal}:host(limel-markdown:not(.no-table-styles)) tr th:only-child{text-align:center}:host(limel-markdown:not(.no-table-styles)) tbody tr:nth-child(odd) td{background-color:rgb(var(--contrast-200))}:host(limel-markdown:not(.no-table-styles)) tbody tr:hover td{background-color:rgb(var(--contrast-300))}blockquote{position:relative;font-weight:100;font-size:0.875rem;max-width:100%;line-height:1.4;margin:0;padding:0.5rem 1.25rem;border-radius:0.05rem 0.75rem;background-color:rgb(var(--contrast-300))}blockquote:before,blockquote:after{position:absolute;font-size:2.75rem;opacity:0.4}blockquote:before{content:\"“\";left:0;top:-0.75rem}blockquote:after{content:\"”\";right:0;bottom:-2rem}dl{display:grid;grid-template-columns:1fr 2fr;grid-template-rows:1fr;margin-bottom:2rem;border:1px solid rgb(var(--contrast-400));border-radius:0.375rem;background-color:rgb(var(--contrast-200))}dl dt,dl dd{padding:0.375rem 0.5rem;font-size:0.875rem;margin:0}dl dt:nth-of-type(even),dl dd:nth-of-type(even){background-color:rgb(var(--contrast-300))}dl dt:first-child{border-top-left-radius:0.375rem}dl dt:last-child{border-bottom-left-radius:0.375rem}dl dd:first-child{border-top-right-radius:0.375rem}dl dd:last-child{border-bottom-right-radius:0.375rem}hr{border-top:1px solid rgb(var(--contrast-700))}img{max-width:100%}.MsoNormal{margin:0}";
10
10
 
11
11
  const Markdown = class {
12
12
  constructor(hostRef) {
@@ -1 +1 @@
1
- {"file":"limel-markdown.entry.cjs.js","mappings":";;;;;;;;AAAA,MAAM,WAAW,GAAG,gmIAAgmI;;MCyBvmI,QAAQ;;;;;EAUV,MAAM,WAAW;IACpB,IAAI;MACA,MAAM,IAAI,GAAG,MAAMA,6BAAc,CAAC,IAAI,CAAC,KAAK,EAAE;QAC1C,mBAAmB,EAAE,IAAI;OAC5B,CAAC,CAAC;MACH,IAAI,CAAC,WAAW,CAAC,SAAS,GAAG,IAAI,CAAC;KACrC;IAAC,OAAO,KAAK,EAAE;;MAEZ,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;KACxB;GACJ;EAEM,MAAM,gBAAgB;IACzB,IAAI,CAAC,WAAW,EAAE,CAAC;GACtB;EAIM,MAAM;IACT,OAAO;MACHC,iBACI,EAAE,EAAC,UAAU,EACb,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,WAAW,GAAG,EAAoB,CAAC,GACxD;KACL,CAAC;GACL;;;;;;;;;","names":["markdownToHTML","h"],"sources":["./src/components/markdown/markdown.scss?tag=limel-markdown&encapsulation=shadow","./src/components/markdown/markdown.tsx"],"sourcesContent":["/**\n* @prop --markdown-hyperlink-color: color of text for hyperlinks. Defaults to `--color-blue-dark`;\n* @prop --markdown-hyperlink-color--hovered: color of text for hyperlinks when hovered. Defaults to `--color-blue-default`;\n*/\n\n@import './partial-styles/pre-code.scss';\n@import './partial-styles/headings.scss';\n@import './partial-styles/body-text.scss';\n@import './partial-styles/lists.scss';\n@import './partial-styles/tables.scss';\n@import './partial-styles/blockquotes.scss';\n@import './partial-styles/definition-lists.scss';\n\n// body-text\nhr {\n border-top: 1px solid rgb(var(--contrast-700));\n}\n\nimg {\n max-width: 100%;\n}\n","import { Component, h, Prop, Watch } from '@stencil/core';\nimport { markdownToHTML } from './markdown-parser';\n\n/**\n * The Markdown component receives markdown syntax\n * and renders it as HTML.\n *\n * @exampleComponent limel-example-markdown-headings\n * @exampleComponent limel-example-markdown-emphasis\n * @exampleComponent limel-example-markdown-lists\n * @exampleComponent limel-example-markdown-links\n * @exampleComponent limel-example-markdown-images\n * @exampleComponent limel-example-markdown-code\n * @exampleComponent limel-example-markdown-footnotes\n * @exampleComponent limel-example-markdown-tables\n * @exampleComponent limel-example-markdown-html\n * @exampleComponent limel-example-markdown-blockquotes\n * @exampleComponent limel-example-markdown-horizontal-rule\n * @exampleComponent limel-example-markdown-composite\n */\n@Component({\n tag: 'limel-markdown',\n styleUrl: 'markdown.scss',\n shadow: true,\n})\nexport class Markdown {\n /**\n * The input text. Treated as GitHub Flavored Markdown, with the addition\n * that any included HTML will be parsed and rendered as HTML, rather than\n * as text.\n */\n @Prop()\n public value: string;\n\n @Watch('value')\n public async textChanged() {\n try {\n const html = await markdownToHTML(this.value, {\n forceHardLineBreaks: true,\n });\n this.rootElement.innerHTML = html;\n } catch (error) {\n // eslint-disable-next-line no-console\n console.error(error);\n }\n }\n\n public async componentDidLoad() {\n this.textChanged();\n }\n\n private rootElement: HTMLDivElement;\n\n public render() {\n return [\n <div\n id=\"markdown\"\n ref={(el) => (this.rootElement = el as HTMLDivElement)}\n />,\n ];\n }\n}\n"],"version":3}
1
+ {"file":"limel-markdown.entry.cjs.js","mappings":";;;;;;;;AAAA,MAAM,WAAW,GAAG,onIAAonI;;MCyB3nI,QAAQ;;;;;EAUV,MAAM,WAAW;IACpB,IAAI;MACA,MAAM,IAAI,GAAG,MAAMA,6BAAc,CAAC,IAAI,CAAC,KAAK,EAAE;QAC1C,mBAAmB,EAAE,IAAI;OAC5B,CAAC,CAAC;MACH,IAAI,CAAC,WAAW,CAAC,SAAS,GAAG,IAAI,CAAC;KACrC;IAAC,OAAO,KAAK,EAAE;;MAEZ,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;KACxB;GACJ;EAEM,MAAM,gBAAgB;IACzB,IAAI,CAAC,WAAW,EAAE,CAAC;GACtB;EAIM,MAAM;IACT,OAAO;MACHC,iBACI,EAAE,EAAC,UAAU,EACb,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,WAAW,GAAG,EAAoB,CAAC,GACxD;KACL,CAAC;GACL;;;;;;;;;","names":["markdownToHTML","h"],"sources":["./src/components/markdown/markdown.scss?tag=limel-markdown&encapsulation=shadow","./src/components/markdown/markdown.tsx"],"sourcesContent":["/**\n* @prop --markdown-hyperlink-color: color of text for hyperlinks. Defaults to `--color-blue-dark`;\n* @prop --markdown-hyperlink-color--hovered: color of text for hyperlinks when hovered. Defaults to `--color-blue-default`;\n*/\n\n@import './partial-styles/pre-code.scss';\n@import './partial-styles/headings.scss';\n@import './partial-styles/body-text.scss';\n@import './partial-styles/lists.scss';\n@import './partial-styles/tables.scss';\n@import './partial-styles/blockquotes.scss';\n@import './partial-styles/definition-lists.scss';\n\n// body-text\nhr {\n border-top: 1px solid rgb(var(--contrast-700));\n}\n\nimg {\n max-width: 100%;\n}\n\n.MsoNormal {\n margin: 0;\n}\n","import { Component, h, Prop, Watch } from '@stencil/core';\nimport { markdownToHTML } from './markdown-parser';\n\n/**\n * The Markdown component receives markdown syntax\n * and renders it as HTML.\n *\n * @exampleComponent limel-example-markdown-headings\n * @exampleComponent limel-example-markdown-emphasis\n * @exampleComponent limel-example-markdown-lists\n * @exampleComponent limel-example-markdown-links\n * @exampleComponent limel-example-markdown-images\n * @exampleComponent limel-example-markdown-code\n * @exampleComponent limel-example-markdown-footnotes\n * @exampleComponent limel-example-markdown-tables\n * @exampleComponent limel-example-markdown-html\n * @exampleComponent limel-example-markdown-blockquotes\n * @exampleComponent limel-example-markdown-horizontal-rule\n * @exampleComponent limel-example-markdown-composite\n */\n@Component({\n tag: 'limel-markdown',\n styleUrl: 'markdown.scss',\n shadow: true,\n})\nexport class Markdown {\n /**\n * The input text. Treated as GitHub Flavored Markdown, with the addition\n * that any included HTML will be parsed and rendered as HTML, rather than\n * as text.\n */\n @Prop()\n public value: string;\n\n @Watch('value')\n public async textChanged() {\n try {\n const html = await markdownToHTML(this.value, {\n forceHardLineBreaks: true,\n });\n this.rootElement.innerHTML = html;\n } catch (error) {\n // eslint-disable-next-line no-console\n console.error(error);\n }\n }\n\n public async componentDidLoad() {\n this.textChanged();\n }\n\n private rootElement: HTMLDivElement;\n\n public render() {\n return [\n <div\n id=\"markdown\"\n ref={(el) => (this.rootElement = el as HTMLDivElement)}\n />,\n ];\n }\n}\n"],"version":3}
@@ -9,7 +9,7 @@ const _getAllKeysIn = require('./_getAllKeysIn-bcf08d3b.js');
9
9
  const isObject$1 = require('./isObject-e28b7997.js');
10
10
  const isArray = require('./isArray-d188a04f.js');
11
11
  const isObjectLike = require('./isObjectLike-3e3f0cba.js');
12
- const markdownParser = require('./markdown-parser-292760cb.js');
12
+ const markdownParser = require('./markdown-parser-ae3795b9.js');
13
13
  const translations = require('./translations-6d759b59.js');
14
14
  const randomString = require('./random-string-c8445652.js');
15
15
  const isItem = require('./isItem-3f8ad629.js');
@@ -65,6 +65,7 @@ const Snackbar = class {
65
65
  index.registerInstance(this, hostRef);
66
66
  this.action = index.createEvent(this, "action", 7);
67
67
  this.hide = index.createEvent(this, "hide", 7);
68
+ this.firstRender = true;
68
69
  this.handleOpen = () => {
69
70
  if (this.isOpen) {
70
71
  return;
@@ -106,8 +107,12 @@ const Snackbar = class {
106
107
  this.closing = true;
107
108
  this.snackbarId = randomString.createRandomString();
108
109
  }
109
- componentWillLoad() {
110
- this.isOpen = this.open;
110
+ componentDidRender() {
111
+ if (!this.firstRender) {
112
+ return;
113
+ }
114
+ this.firstRender = false;
115
+ requestAnimationFrame(() => this.watchOpen());
111
116
  }
112
117
  onChangeIndex(event) {
113
118
  event.stopPropagation();
@@ -1 +1 @@
1
- {"file":"limel-snackbar.entry.cjs.js","mappings":"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","names":["createRandomString","h","translate"],"sources":["./src/components/snackbar/container.ts","./src/components/snackbar/snackbar.scss?tag=limel-snackbar&encapsulation=shadow","./src/components/snackbar/snackbar.tsx"],"sourcesContent":["/**\n * Container to keep track of all snackbar elements that gets added to the page.\n * When an element gets added or removed, the container will emit a\n * `changeOffset` event on all elements in the container, letting them know\n * the new offset to where they should position themselves.\n */\nexport class SnackbarContainer {\n private snackbarElements: HTMLLimelSnackbarElement[] = [];\n\n /**\n * Add a new element to the container\n *\n * @param snackbar - element to add\n */\n public add(snackbar: HTMLLimelSnackbarElement) {\n const popover = this.getPopover(snackbar);\n\n // Stencil does not seem to recognise the existance of showPopover\n // @ts-ignore\n popover?.showPopover();\n\n this.snackbarElements = [snackbar, ...this.snackbarElements];\n this.emitOffsets();\n }\n\n /**\n * Remove an element from the container\n *\n * @param snackbar - element to remove\n */\n public remove(snackbar: HTMLLimelSnackbarElement): void {\n const popover = this.getPopover(snackbar);\n\n // Stencil does not seem to recognise the existance of hidePopover\n // @ts-ignore\n popover?.hidePopover();\n\n this.snackbarElements = this.snackbarElements.filter(\n (item) => item !== snackbar,\n );\n this.emitOffsets();\n }\n\n private emitOffsets() {\n let offset = 0;\n this.snackbarElements.forEach((snackbar) => {\n snackbar.dispatchEvent(\n new CustomEvent('changeOffset', {\n detail: offset,\n }),\n );\n offset += this.getPopover(snackbar).getBoundingClientRect().height;\n });\n }\n\n private getPopover(snackbar: HTMLLimelSnackbarElement) {\n return snackbar.shadowRoot.querySelector('[popover]');\n }\n}\n","* {\n box-sizing: border-box;\n}\n\naside {\n background: none;\n border: none;\n inset: unset;\n overflow: visible;\n padding: 0.5rem 0.5rem 0 0.5rem;\n right: 0;\n\n width: var(--limel-snackbar-width, 21rem);\n top: calc(\n var(--snackbar-distance-to-top-edge) + env(safe-area-inset-top, 0)\n );\n\n transition:\n opacity var(--limel-snackbar-opacity-transition-speed, 0.2s) ease,\n top var(--limel-snackbar-top-transition-speed, 0.46s)\n cubic-bezier(1, 0.09, 0, 0.89),\n transform var(--limel-snackbar-top-transition-speed, 0.46s) ease;\n transform: translate3d(0, 0, 0);\n opacity: 1;\n\n &.is-closing {\n transform: translate3d(2rem, 0, 0);\n opacity: 0;\n --limel-snackbar-top-transition-speed: 0.2s;\n --limel-snackbar-opacity-transition-speed: 0.2s;\n }\n}\n\n.surface {\n overflow: hidden;\n\n padding: 0.5rem;\n display: flex;\n align-items: center;\n justify-content: flex-start;\n gap: 0.25rem;\n\n min-height: 3.25rem;\n border-radius: 0.75rem;\n\n background-color: rgb(var(--contrast-1400));\n box-shadow: var(--shadow-depth-8), var(--shadow-depth-16);\n}\n\n.label {\n color: rgb(var(--contrast-100));\n\n -webkit-font-smoothing: antialiased;\n font-size: 0.8125rem;\n font-weight: 400;\n padding: 0 0.25rem;\n\n width: 100%;\n flex-grow: 1;\n}\n\n.actions {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n box-sizing: border-box;\n gap: 0.5rem;\n}\n\n.dismiss,\n.actions {\n --lime-elevated-surface-background-color: rgb(\n var(--contrast-1300)\n ); // background color of the buttons\n}\n\n.dismiss {\n --mdc-theme-on-surface: rgb(var(--contrast-100)); // color of the X icon\n --icon-background-color: var(--lime-elevated-surface-background-color);\n --fill-color: var(--mdc-theme-primary);\n --track-color: rgb(var(--contrast-800), 0.2);\n transition:\n opacity 0.1s ease,\n transform 0.1s ease;\n position: absolute;\n top: -0.375rem;\n left: -0.375rem;\n transform: scale(0.7);\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n svg {\n position: absolute;\n transform: rotate(90deg);\n fill: transparent;\n stroke-dasharray: 100;\n stroke-linecap: round;\n\n aside:popover-open & {\n animation: timeout var(--snackbar-timeout) linear forwards;\n }\n }\n\n .is-closing {\n transform: scale(0.5);\n opacity: 0;\n }\n}\n\n.dismiss-button {\n transform: scale(0.8);\n margin: 0;\n padding: 0;\n}\n\n@keyframes timeout {\n 0% {\n stroke-width: 4;\n stroke-dashoffset: 0;\n opacity: 1;\n }\n 100% {\n stroke-width: 1;\n stroke-dashoffset: -100;\n opacity: 0.7;\n }\n}\n","import { Languages } from '../date-picker/date.types';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Listen,\n Method,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport translate from '../../global/translations';\nimport { SnackbarContainer } from './container';\nimport { createRandomString } from 'src/util/random-string';\n\nconst container = new SnackbarContainer();\nconst hideAnimationDuration = 300;\n\n/**\n * A Snackbar –also known as \"Toast\"– is used to inform the end user\n * about an action or a process in the system.\n * The information could vary from announcing that a process has just started,\n * is taking place now, has ended, or has been interrupted or canceled.\n *\n * The information that you provide using a snackbar should be:\n * - temporary\n * - contextual\n * - short\n * - and most importantly, ignorable.\n *\n * It means if the user misses the information, it shouldn't be a big deal.\n *\n * :::note\n * If the information you want to display has a higher importance or priority,\n * and you need to make sure that the user takes an action to dismiss it,\n * consider using the [Banner](/#/component/limel-banner/) component instead.\n * For more complex interactions and for delivering more detailed information,\n * [Dialog](/#/component/limel-dialog/) is a better choice.\n * :::\n *\n * @exampleComponent limel-example-snackbar\n * @exampleComponent limel-example-snackbar-with-action\n * @exampleComponent limel-example-snackbar-with-changing-messages\n * @exampleComponent limel-example-snackbar-dismissible\n * @exampleComponent limel-example-snackbar-persistent\n * @exampleComponent limel-example-snackbar-persistent-non-dismissible\n */\n@Component({\n tag: 'limel-snackbar',\n shadow: true,\n styleUrl: 'snackbar.scss',\n})\nexport class Snackbar {\n /**\n * `true` if the snackbar is open, `false` otherwise.\n */\n @Prop({ reflect: true })\n public open: boolean = false;\n\n /**\n * The text message to display.\n */\n @Prop()\n public message: string;\n\n /**\n * The amount of time in milliseconds to show the snackbar.\n * If set to `null`, the snackbar will be persistent.\n * This means:\n * - either the end user will need to close is manually,\n * which requires the `dismissible` property to be set to `true`.\n * - or the snackbar needs to be closed programmatically.\n */\n @Prop({ reflect: true })\n // eslint-disable-next-line no-magic-numbers\n public timeout?: number = 5000;\n\n /**\n * The text to display for the action button.\n */\n @Prop()\n public actionText: string;\n\n /**\n * When `true` displays a dismiss button on the snackbar,\n * allowing users to close it.\n */\n @Prop()\n public dismissible: boolean = true;\n\n /**\n * Whether to show the snackbar with space for multiple lines of text\n * @deprecated Setting this property no longer has any effect. The property will be removed in a future major version.\n */\n @Prop()\n public multiline: boolean;\n\n /**\n * Defines the language for translations.\n */\n @Prop()\n public language: Languages = 'en';\n\n @Element()\n private host: HTMLLimelSnackbarElement;\n\n /**\n * Emitted when the action button is pressed\n */\n @Event()\n private action: EventEmitter<void>;\n\n /**\n * Emitted when the snackbar hides itself\n */\n @Event()\n private hide: EventEmitter<void>;\n\n @State()\n private offset: number = 0;\n\n @State()\n private isOpen: boolean = false;\n\n @State()\n private closing: boolean = true;\n\n private snackbarId: string;\n private timeoutId?: number;\n\n public constructor() {\n this.snackbarId = createRandomString();\n }\n\n public componentWillLoad() {\n this.isOpen = this.open;\n }\n\n @Listen('changeOffset')\n protected onChangeIndex(event: CustomEvent<number>) {\n event.stopPropagation();\n this.offset = event.detail;\n }\n\n @Watch('open')\n protected watchOpen() {\n if (this.open) {\n this.handleOpen();\n } else {\n this.handleClose();\n }\n\n this.isOpen = this.open;\n }\n\n /**\n * Show the snackbar\n * @deprecated Use the `open` property instead.\n */\n @Method()\n public async show() {\n // eslint-disable-next-line no-console\n console.warn(\n 'The `show` method in `limel-snackbar` is deprecated. Please use the `open` property instead.',\n );\n if (!this.open) {\n this.handleOpen();\n this.isOpen = true;\n }\n }\n\n public handleOpen = () => {\n if (this.isOpen) {\n return;\n }\n\n this.closing = false;\n container.add(this.host);\n\n if (this.timeout) {\n this.timeoutId = window.setTimeout(\n this.handleClose,\n Math.max(this.timeout - hideAnimationDuration, 0),\n );\n }\n };\n\n private handleClose = () => {\n if (!this.isOpen) {\n return;\n }\n\n this.closing = true;\n\n if (this.timeoutId) {\n clearTimeout(this.timeoutId);\n this.timeoutId = undefined;\n }\n\n setTimeout(() => {\n this.isOpen = false;\n container.remove(this.host);\n this.hide.emit();\n this.offset = 0;\n }, hideAnimationDuration);\n };\n\n public render() {\n return (\n <aside\n popover=\"manual\"\n style={{\n '--snackbar-timeout': `${this.timeout}ms`,\n '--snackbar-distance-to-top-edge': `${this.offset}px`,\n }}\n class={{\n open: this.open,\n 'is-closing': this.closing,\n }}\n id={this.snackbarId}\n role={this.setAriaRoles()}\n aria-relevant={this.open ? 'additions' : undefined}\n >\n <div class=\"surface\" aria-atomic=\"false\">\n <div class=\"label\">{this.message}</div>\n {this.renderActions(this.actionText)}\n {this.renderDismissButton(this.dismissible)}\n </div>\n </aside>\n );\n }\n\n private setAriaRoles() {\n if (!this.open) {\n return undefined;\n }\n\n if (!this.timeout) {\n return 'alertdialog';\n }\n\n return 'status';\n }\n\n private handleClickAction = () => {\n this.action.emit();\n };\n\n private renderActions(actionText: string) {\n if (!actionText) {\n return;\n }\n\n return (\n <div class=\"actions\" aria-atomic=\"true\">\n {this.renderActionButton(actionText)}\n </div>\n );\n }\n\n private renderActionButton(actionText: string) {\n if (!actionText) {\n return;\n }\n\n return (\n <limel-button label={actionText} onClick={this.handleClickAction} />\n );\n }\n\n private renderDismissButton(dismissible: boolean) {\n if (!dismissible) {\n return;\n }\n\n const label = translate.get('snackbar.dismiss', this.language);\n\n return (\n <div class=\"dismiss\">\n {this.renderTimeoutVisualization()}\n <limel-icon-button\n class=\"dismiss-button\"\n icon=\"multiply\"\n label={label}\n onClick={this.handleClose}\n aria-controls={this.snackbarId}\n />\n </div>\n );\n }\n\n private renderTimeoutVisualization() {\n if (!this.timeout) {\n return;\n }\n\n return (\n <svg width=\"36\" height=\"36\" viewBox=\"0 0 36 36\">\n <circle r=\"18\" cx=\"18\" cy=\"18\" fill=\"var(--track-color)\" />\n <path\n class=\"track\"\n d=\"M 18,18 m -16,0 a 16,16 0 1,0 32,0 a 16,16 0 1,0 -32,0\"\n stroke=\"var(--fill-color)\"\n />\n </svg>\n );\n }\n}\n"],"version":3}
1
+ {"file":"limel-snackbar.entry.cjs.js","mappings":"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","names":["createRandomString","h","translate"],"sources":["./src/components/snackbar/container.ts","./src/components/snackbar/snackbar.scss?tag=limel-snackbar&encapsulation=shadow","./src/components/snackbar/snackbar.tsx"],"sourcesContent":["/**\n * Container to keep track of all snackbar elements that gets added to the page.\n * When an element gets added or removed, the container will emit a\n * `changeOffset` event on all elements in the container, letting them know\n * the new offset to where they should position themselves.\n */\nexport class SnackbarContainer {\n private snackbarElements: HTMLLimelSnackbarElement[] = [];\n\n /**\n * Add a new element to the container\n *\n * @param snackbar - element to add\n */\n public add(snackbar: HTMLLimelSnackbarElement) {\n const popover = this.getPopover(snackbar);\n\n // Stencil does not seem to recognise the existance of showPopover\n // @ts-ignore\n popover?.showPopover();\n\n this.snackbarElements = [snackbar, ...this.snackbarElements];\n this.emitOffsets();\n }\n\n /**\n * Remove an element from the container\n *\n * @param snackbar - element to remove\n */\n public remove(snackbar: HTMLLimelSnackbarElement): void {\n const popover = this.getPopover(snackbar);\n\n // Stencil does not seem to recognise the existance of hidePopover\n // @ts-ignore\n popover?.hidePopover();\n\n this.snackbarElements = this.snackbarElements.filter(\n (item) => item !== snackbar,\n );\n this.emitOffsets();\n }\n\n private emitOffsets() {\n let offset = 0;\n this.snackbarElements.forEach((snackbar) => {\n snackbar.dispatchEvent(\n new CustomEvent('changeOffset', {\n detail: offset,\n }),\n );\n offset += this.getPopover(snackbar).getBoundingClientRect().height;\n });\n }\n\n private getPopover(snackbar: HTMLLimelSnackbarElement) {\n return snackbar.shadowRoot.querySelector('[popover]');\n }\n}\n","* {\n box-sizing: border-box;\n}\n\naside {\n background: none;\n border: none;\n inset: unset;\n overflow: visible;\n padding: 0.5rem 0.5rem 0 0.5rem;\n right: 0;\n\n width: var(--limel-snackbar-width, 21rem);\n top: calc(\n var(--snackbar-distance-to-top-edge) + env(safe-area-inset-top, 0)\n );\n\n transition:\n opacity var(--limel-snackbar-opacity-transition-speed, 0.2s) ease,\n top var(--limel-snackbar-top-transition-speed, 0.46s)\n cubic-bezier(1, 0.09, 0, 0.89),\n transform var(--limel-snackbar-top-transition-speed, 0.46s) ease;\n transform: translate3d(0, 0, 0);\n opacity: 1;\n\n &.is-closing {\n transform: translate3d(2rem, 0, 0);\n opacity: 0;\n --limel-snackbar-top-transition-speed: 0.2s;\n --limel-snackbar-opacity-transition-speed: 0.2s;\n }\n}\n\n.surface {\n overflow: hidden;\n\n padding: 0.5rem;\n display: flex;\n align-items: center;\n justify-content: flex-start;\n gap: 0.25rem;\n\n min-height: 3.25rem;\n border-radius: 0.75rem;\n\n background-color: rgb(var(--contrast-1400));\n box-shadow: var(--shadow-depth-8), var(--shadow-depth-16);\n}\n\n.label {\n color: rgb(var(--contrast-100));\n\n -webkit-font-smoothing: antialiased;\n font-size: 0.8125rem;\n font-weight: 400;\n padding: 0 0.25rem;\n\n width: 100%;\n flex-grow: 1;\n}\n\n.actions {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n box-sizing: border-box;\n gap: 0.5rem;\n}\n\n.dismiss,\n.actions {\n --lime-elevated-surface-background-color: rgb(\n var(--contrast-1300)\n ); // background color of the buttons\n}\n\n.dismiss {\n --mdc-theme-on-surface: rgb(var(--contrast-100)); // color of the X icon\n --icon-background-color: var(--lime-elevated-surface-background-color);\n --fill-color: var(--mdc-theme-primary);\n --track-color: rgb(var(--contrast-800), 0.2);\n transition:\n opacity 0.1s ease,\n transform 0.1s ease;\n position: absolute;\n top: -0.375rem;\n left: -0.375rem;\n transform: scale(0.7);\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n svg {\n position: absolute;\n transform: rotate(90deg);\n fill: transparent;\n stroke-dasharray: 100;\n stroke-linecap: round;\n\n aside:popover-open & {\n animation: timeout var(--snackbar-timeout) linear forwards;\n }\n }\n\n .is-closing {\n transform: scale(0.5);\n opacity: 0;\n }\n}\n\n.dismiss-button {\n transform: scale(0.8);\n margin: 0;\n padding: 0;\n}\n\n@keyframes timeout {\n 0% {\n stroke-width: 4;\n stroke-dashoffset: 0;\n opacity: 1;\n }\n 100% {\n stroke-width: 1;\n stroke-dashoffset: -100;\n opacity: 0.7;\n }\n}\n","import { Languages } from '../date-picker/date.types';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Listen,\n Method,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport translate from '../../global/translations';\nimport { SnackbarContainer } from './container';\nimport { createRandomString } from 'src/util/random-string';\n\nconst container = new SnackbarContainer();\nconst hideAnimationDuration = 300;\n\n/**\n * A Snackbar –also known as \"Toast\"– is used to inform the end user\n * about an action or a process in the system.\n * The information could vary from announcing that a process has just started,\n * is taking place now, has ended, or has been interrupted or canceled.\n *\n * The information that you provide using a snackbar should be:\n * - temporary\n * - contextual\n * - short\n * - and most importantly, ignorable.\n *\n * It means if the user misses the information, it shouldn't be a big deal.\n *\n * :::note\n * If the information you want to display has a higher importance or priority,\n * and you need to make sure that the user takes an action to dismiss it,\n * consider using the [Banner](/#/component/limel-banner/) component instead.\n * For more complex interactions and for delivering more detailed information,\n * [Dialog](/#/component/limel-dialog/) is a better choice.\n * :::\n *\n * @exampleComponent limel-example-snackbar\n * @exampleComponent limel-example-snackbar-with-action\n * @exampleComponent limel-example-snackbar-with-changing-messages\n * @exampleComponent limel-example-snackbar-dismissible\n * @exampleComponent limel-example-snackbar-persistent\n * @exampleComponent limel-example-snackbar-persistent-non-dismissible\n */\n@Component({\n tag: 'limel-snackbar',\n shadow: true,\n styleUrl: 'snackbar.scss',\n})\nexport class Snackbar {\n /**\n * `true` if the snackbar is open, `false` otherwise.\n */\n @Prop({ reflect: true })\n public open: boolean = false;\n\n /**\n * The text message to display.\n */\n @Prop()\n public message: string;\n\n /**\n * The amount of time in milliseconds to show the snackbar.\n * If set to `null`, the snackbar will be persistent.\n * This means:\n * - either the end user will need to close is manually,\n * which requires the `dismissible` property to be set to `true`.\n * - or the snackbar needs to be closed programmatically.\n */\n @Prop({ reflect: true })\n // eslint-disable-next-line no-magic-numbers\n public timeout?: number = 5000;\n\n /**\n * The text to display for the action button.\n */\n @Prop()\n public actionText: string;\n\n /**\n * When `true` displays a dismiss button on the snackbar,\n * allowing users to close it.\n */\n @Prop()\n public dismissible: boolean = true;\n\n /**\n * Whether to show the snackbar with space for multiple lines of text\n * @deprecated Setting this property no longer has any effect. The property will be removed in a future major version.\n */\n @Prop()\n public multiline: boolean;\n\n /**\n * Defines the language for translations.\n */\n @Prop()\n public language: Languages = 'en';\n\n @Element()\n private host: HTMLLimelSnackbarElement;\n\n /**\n * Emitted when the action button is pressed\n */\n @Event()\n private action: EventEmitter<void>;\n\n /**\n * Emitted when the snackbar hides itself\n */\n @Event()\n private hide: EventEmitter<void>;\n\n @State()\n private offset: number = 0;\n\n @State()\n private isOpen: boolean = false;\n\n @State()\n private closing: boolean = true;\n\n private snackbarId: string;\n private timeoutId?: number;\n private firstRender = true;\n\n public constructor() {\n this.snackbarId = createRandomString();\n }\n\n public componentDidRender() {\n if (!this.firstRender) {\n return;\n }\n\n this.firstRender = false;\n\n requestAnimationFrame(() => this.watchOpen());\n }\n\n @Listen('changeOffset')\n protected onChangeIndex(event: CustomEvent<number>) {\n event.stopPropagation();\n this.offset = event.detail;\n }\n\n @Watch('open')\n protected watchOpen() {\n if (this.open) {\n this.handleOpen();\n } else {\n this.handleClose();\n }\n\n this.isOpen = this.open;\n }\n\n /**\n * Show the snackbar\n * @deprecated Use the `open` property instead.\n */\n @Method()\n public async show() {\n // eslint-disable-next-line no-console\n console.warn(\n 'The `show` method in `limel-snackbar` is deprecated. Please use the `open` property instead.',\n );\n if (!this.open) {\n this.handleOpen();\n this.isOpen = true;\n }\n }\n\n public handleOpen = () => {\n if (this.isOpen) {\n return;\n }\n\n this.closing = false;\n container.add(this.host);\n\n if (this.timeout) {\n this.timeoutId = window.setTimeout(\n this.handleClose,\n Math.max(this.timeout - hideAnimationDuration, 0),\n );\n }\n };\n\n private handleClose = () => {\n if (!this.isOpen) {\n return;\n }\n\n this.closing = true;\n\n if (this.timeoutId) {\n clearTimeout(this.timeoutId);\n this.timeoutId = undefined;\n }\n\n setTimeout(() => {\n this.isOpen = false;\n container.remove(this.host);\n this.hide.emit();\n this.offset = 0;\n }, hideAnimationDuration);\n };\n\n public render() {\n return (\n <aside\n popover=\"manual\"\n style={{\n '--snackbar-timeout': `${this.timeout}ms`,\n '--snackbar-distance-to-top-edge': `${this.offset}px`,\n }}\n class={{\n open: this.open,\n 'is-closing': this.closing,\n }}\n id={this.snackbarId}\n role={this.setAriaRoles()}\n aria-relevant={this.open ? 'additions' : undefined}\n >\n <div class=\"surface\" aria-atomic=\"false\">\n <div class=\"label\">{this.message}</div>\n {this.renderActions(this.actionText)}\n {this.renderDismissButton(this.dismissible)}\n </div>\n </aside>\n );\n }\n\n private setAriaRoles() {\n if (!this.open) {\n return undefined;\n }\n\n if (!this.timeout) {\n return 'alertdialog';\n }\n\n return 'status';\n }\n\n private handleClickAction = () => {\n this.action.emit();\n };\n\n private renderActions(actionText: string) {\n if (!actionText) {\n return;\n }\n\n return (\n <div class=\"actions\" aria-atomic=\"true\">\n {this.renderActionButton(actionText)}\n </div>\n );\n }\n\n private renderActionButton(actionText: string) {\n if (!actionText) {\n return;\n }\n\n return (\n <limel-button label={actionText} onClick={this.handleClickAction} />\n );\n }\n\n private renderDismissButton(dismissible: boolean) {\n if (!dismissible) {\n return;\n }\n\n const label = translate.get('snackbar.dismiss', this.language);\n\n return (\n <div class=\"dismiss\">\n {this.renderTimeoutVisualization()}\n <limel-icon-button\n class=\"dismiss-button\"\n icon=\"multiply\"\n label={label}\n onClick={this.handleClose}\n aria-controls={this.snackbarId}\n />\n </div>\n );\n }\n\n private renderTimeoutVisualization() {\n if (!this.timeout) {\n return;\n }\n\n return (\n <svg width=\"36\" height=\"36\" viewBox=\"0 0 36 36\">\n <circle r=\"18\" cx=\"18\" cy=\"18\" fill=\"var(--track-color)\" />\n <path\n class=\"track\"\n d=\"M 18,18 m -16,0 a 16,16 0 1,0 32,0 a 16,16 0 1,0 -32,0\"\n stroke=\"var(--fill-color)\"\n />\n </svg>\n );\n }\n}\n"],"version":3}
@@ -43636,6 +43636,7 @@ var __importDefault = (_commonjsHelpers.commonjsGlobal && _commonjsHelpers.commo
43636
43636
  return (mod && mod.__esModule) ? mod : { "default": mod };
43637
43637
  };
43638
43638
  Object.defineProperty(exports, "__esModule", { value: true });
43639
+ exports.default = StyleToObject;
43639
43640
  var inline_style_parser_1 = __importDefault(inlineStyleParser);
43640
43641
  /**
43641
43642
  * Parses inline style to object.
@@ -43673,7 +43674,6 @@ function StyleToObject(style, iterator) {
43673
43674
  });
43674
43675
  return styleObject;
43675
43676
  }
43676
- exports.default = StyleToObject;
43677
43677
  //# sourceMappingURL=index.js.map
43678
43678
  });
43679
43679
 
@@ -44142,9 +44142,7 @@ async function markdownToHTML(text, options) {
44142
44142
  .use(remarkRehype, { allowDangerousHtml: true })
44143
44143
  .use(rehypeExternalLinks, { target: '_blank' })
44144
44144
  .use(rehypeRaw)
44145
- .use(rehypeSanitize, Object.assign(Object.assign({}, defaultSchema), {
44146
- // Allow the `style` attribute on all elements
44147
- attributes: Object.assign(Object.assign({}, defaultSchema.attributes), { '*': ['style', 'width'] }) }))
44145
+ .use(rehypeSanitize, Object.assign(Object.assign({}, defaultSchema), { attributes: Object.assign(Object.assign({}, defaultSchema.attributes), { p: [['className', 'MsoNormal']], '*': ['style', 'width'] }) }))
44148
44146
  .use(() => {
44149
44147
  return (tree) => {
44150
44148
  // Run the sanitizeStyle function on all elements, to sanitize
@@ -44160,4 +44158,4 @@ async function markdownToHTML(text, options) {
44160
44158
  exports.decodeHTML = decodeHTML;
44161
44159
  exports.markdownToHTML = markdownToHTML;
44162
44160
 
44163
- //# sourceMappingURL=markdown-parser-292760cb.js.map
44161
+ //# sourceMappingURL=markdown-parser-ae3795b9.js.map