@scania/tegel 0.0.51 → 0.0.61

package/dist/collection/components/toast/sdds-toast.stories.js

@@ -1,87 +1,87 @@
-import { formatHtmlPreview } from '../../utils/utils';
-import readme from './readme.md';
-export default {
-  title: 'Components/Toast',
-  parameters: {
-    layout: 'centered',
-    notes: readme,
-    design: [
-      {
-        name: 'Figma',
-        type: 'figma',
-        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=5903%3A245536&t=Ne6myqwca5m00de7-1',
-      },
-      {
-        name: 'Link',
-        type: 'link',
-        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=5903%3A245536&t=Ne6myqwca5m00de7-1',
-      },
-    ],
-  },
-  argTypes: {
-    type: {
-      name: 'Message type',
-      description: 'Changes the type of message.',
-      control: {
-        type: 'radio',
-      },
-      options: ['Information', 'Success', 'Warning', 'Error'],
-      table: {
-        defaultValue: {
-          summary: 'information',
-        },
-      },
-    },
-    header: {
-      name: 'Header',
-      description: 'Adds a header text.',
-      control: {
-        type: 'text',
-      },
-    },
-    subheader: {
-      name: 'Subheader',
-      description: 'Adds a subheader text.',
-      control: {
-        type: 'text',
-      },
-    },
-    link: {
-      name: 'Link',
-      description: 'Adds a CTA link.',
-      control: {
-        type: 'boolean',
-      },
-    },
-  },
-  args: {
-    type: 'Information',
-    header: 'Header',
-    subheader: '',
-    link: false,
-  },
-};
+import { formatHtmlPreview } from '../../utils/utils';
+import readme from './readme.md';
+export default {
+  title: 'Components/Toast',
+  parameters: {
+    layout: 'centered',
+    notes: readme,
+    design: [
+      {
+        name: 'Figma',
+        type: 'figma',
+        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=5903%3A245536&t=Ne6myqwca5m00de7-1',
+      },
+      {
+        name: 'Link',
+        type: 'link',
+        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=5903%3A245536&t=Ne6myqwca5m00de7-1',
+      },
+    ],
+  },
+  argTypes: {
+    type: {
+      name: 'Message type',
+      description: 'Changes the type of message.',
+      control: {
+        type: 'radio',
+      },
+      options: ['Information', 'Success', 'Warning', 'Error'],
+      table: {
+        defaultValue: {
+          summary: 'information',
+        },
+      },
+    },
+    header: {
+      name: 'Header',
+      description: 'Adds a header text.',
+      control: {
+        type: 'text',
+      },
+    },
+    subheader: {
+      name: 'Subheader',
+      description: 'Adds a subheader text.',
+      control: {
+        type: 'text',
+      },
+    },
+    link: {
+      name: 'Link',
+      description: 'Adds a CTA link.',
+      control: {
+        type: 'boolean',
+      },
+    },
+  },
+  args: {
+    type: 'Information',
+    header: 'Header',
+    subheader: '',
+    link: false,
+  },
+};
 const Template = ({ type, header, subheader, link }) => formatHtmlPreview(`<sdds-toast
         type="${type.toLowerCase()}"
         header="${header}"
     >
-      ${subheader
+      ${subheader
   ? `
       <div  slot="toast-subheader">
         ${subheader}
       </div>
-      `
+      `
   : ''}
-       ${link
+       ${link
   ? `<a slot="toast-link" href="#">This is a link.</a>
-       `
+       `
   : ''}
     </sdds-toast>
         <script>
         document.addEventListener('sddsClose', (event) => {
-            console.log('Toast with id: ', event.detail.toastId, ' was closed.')
+            console.log(event)
         })
     </script>
-  `);
-export const WebComponent = Template.bind({});
-//# sourceMappingURL=sdds-toast.stories.js.map
+  `);
+export const WebComponent = Template.bind({});
+//# sourceMappingURL=sdds-toast.stories.js.map

package/dist/collection/components/toast/sdds-toast.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"sdds-toast.stories.js","sourceRoot":"","sources":["../../../src/components/toast/sdds-toast.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACtD,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,eAAe;EACb,KAAK,EAAE,kBAAkB;EACzB,UAAU,EAAE;IACV,MAAM,EAAE,UAAU;IAClB,KAAK,EAAE,MAAM;IACb,MAAM,EAAE;MACN;QACE,IAAI,EAAE,OAAO;QACb,IAAI,EAAE,OAAO;QACb,GAAG,EAAE,+GAA+G;OACrH;MACD;QACE,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,MAAM;QACZ,GAAG,EAAE,+GAA+G;OACrH;KACF;GACF;EACD,QAAQ,EAAE;IACR,IAAI,EAAE;MACJ,IAAI,EAAE,cAAc;MACpB,WAAW,EAAE,8BAA8B;MAC3C,OAAO,EAAE;QACP,IAAI,EAAE,OAAO;OACd;MACD,OAAO,EAAE,CAAC,aAAa,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,CAAC;MACvD,KAAK,EAAE;QACL,YAAY,EAAE;UACZ,OAAO,EAAE,aAAa;SACvB;OACF;KACF;IACD,MAAM,EAAE;MACN,IAAI,EAAE,QAAQ;MACd,WAAW,EAAE,qBAAqB;MAClC,OAAO,EAAE;QACP,IAAI,EAAE,MAAM;OACb;KACF;IACD,SAAS,EAAE;MACT,IAAI,EAAE,WAAW;MACjB,WAAW,EAAE,wBAAwB;MACrC,OAAO,EAAE;QACP,IAAI,EAAE,MAAM;OACb;KACF;IACD,IAAI,EAAE;MACJ,IAAI,EAAE,MAAM;MACZ,WAAW,EAAE,kBAAkB;MAC/B,OAAO,EAAE;QACP,IAAI,EAAE,SAAS;OAChB;KACF;GACF;EACD,IAAI,EAAE;IACJ,IAAI,EAAE,aAAa;IACnB,MAAM,EAAE,QAAQ;IAChB,SAAS,EAAE,EAAE;IACb,IAAI,EAAE,KAAK;GACZ;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,IAAI,EAAE,EAAE,EAAE,CACrD,iBAAiB,CACf;gBACY,IAAI,CAAC,WAAW,EAAE;kBAChB,MAAM;;QAGhB,SAAS;EACP,CAAC,CAAC;;UAEF,SAAS;;OAEZ;EACG,CAAC,CAAC,EACN;SAEG,IAAI;EACF,CAAC,CAAC;QACL;EACG,CAAC,CAAC,EACN;;;;;;;GAOJ,CACA,CAAC;AACJ,MAAM,CAAC,MAAM,YAAY,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\nimport readme from './readme.md';\n\nexport default {\n  title: 'Components/Toast',\n  parameters: {\n    layout: 'centered',\n    notes: readme,\n    design: [\n      {\n        name: 'Figma',\n        type: 'figma',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=5903%3A245536&t=Ne6myqwca5m00de7-1',\n      },\n      {\n        name: 'Link',\n        type: 'link',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=5903%3A245536&t=Ne6myqwca5m00de7-1',\n      },\n    ],\n  },\n  argTypes: {\n    type: {\n      name: 'Message type',\n      description: 'Changes the type of message.',\n      control: {\n        type: 'radio',\n      },\n      options: ['Information', 'Success', 'Warning', 'Error'],\n      table: {\n        defaultValue: {\n          summary: 'information',\n        },\n      },\n    },\n    header: {\n      name: 'Header',\n      description: 'Adds a header text.',\n      control: {\n        type: 'text',\n      },\n    },\n    subheader: {\n      name: 'Subheader',\n      description: 'Adds a subheader text.',\n      control: {\n        type: 'text',\n      },\n    },\n    link: {\n      name: 'Link',\n      description: 'Adds a CTA link.',\n      control: {\n        type: 'boolean',\n      },\n    },\n  },\n  args: {\n    type: 'Information',\n    header: 'Header',\n    subheader: '',\n    link: false,\n  },\n};\n\nconst Template = ({ type, header, subheader, link }) =>\n  formatHtmlPreview(\n    `<sdds-toast\n        type=\"${type.toLowerCase()}\"\n        header=\"${header}\"\n    >\n      ${\n        subheader\n          ? `\n      <div  slot=\"toast-subheader\">\n        ${subheader}\n      </div>\n      `\n          : ''\n      }\n       ${\n         link\n           ? `<a slot=\"toast-link\" href=\"#\">This is a link.</a>\n       `\n           : ''\n       }\n    </sdds-toast>\n        <script>\n        document.addEventListener('sddsClose', (event) => {\n            console.log('Toast with id: ', event.detail.toastId, ' was closed.')\n        })\n    </script>\n  `,\n  );\nexport const WebComponent = Template.bind({});\n"]}
+{"version":3,"file":"sdds-toast.stories.js","sourceRoot":"","sources":["../../../src/components/toast/sdds-toast.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACtD,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,eAAe;EACb,KAAK,EAAE,kBAAkB;EACzB,UAAU,EAAE;IACV,MAAM,EAAE,UAAU;IAClB,KAAK,EAAE,MAAM;IACb,MAAM,EAAE;MACN;QACE,IAAI,EAAE,OAAO;QACb,IAAI,EAAE,OAAO;QACb,GAAG,EAAE,+GAA+G;OACrH;MACD;QACE,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,MAAM;QACZ,GAAG,EAAE,+GAA+G;OACrH;KACF;GACF;EACD,QAAQ,EAAE;IACR,IAAI,EAAE;MACJ,IAAI,EAAE,cAAc;MACpB,WAAW,EAAE,8BAA8B;MAC3C,OAAO,EAAE;QACP,IAAI,EAAE,OAAO;OACd;MACD,OAAO,EAAE,CAAC,aAAa,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,CAAC;MACvD,KAAK,EAAE;QACL,YAAY,EAAE;UACZ,OAAO,EAAE,aAAa;SACvB;OACF;KACF;IACD,MAAM,EAAE;MACN,IAAI,EAAE,QAAQ;MACd,WAAW,EAAE,qBAAqB;MAClC,OAAO,EAAE;QACP,IAAI,EAAE,MAAM;OACb;KACF;IACD,SAAS,EAAE;MACT,IAAI,EAAE,WAAW;MACjB,WAAW,EAAE,wBAAwB;MACrC,OAAO,EAAE;QACP,IAAI,EAAE,MAAM;OACb;KACF;IACD,IAAI,EAAE;MACJ,IAAI,EAAE,MAAM;MACZ,WAAW,EAAE,kBAAkB;MAC/B,OAAO,EAAE;QACP,IAAI,EAAE,SAAS;OAChB;KACF;GACF;EACD,IAAI,EAAE;IACJ,IAAI,EAAE,aAAa;IACnB,MAAM,EAAE,QAAQ;IAChB,SAAS,EAAE,EAAE;IACb,IAAI,EAAE,KAAK;GACZ;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,IAAI,EAAE,EAAE,EAAE,CACrD,iBAAiB,CACf;gBACY,IAAI,CAAC,WAAW,EAAE;kBAChB,MAAM;;QAGhB,SAAS;EACP,CAAC,CAAC;;UAEF,SAAS;;OAEZ;EACG,CAAC,CAAC,EACN;SAEG,IAAI;EACF,CAAC,CAAC;QACL;EACG,CAAC,CAAC,EACN;;;;;;;GAOJ,CACA,CAAC;AACJ,MAAM,CAAC,MAAM,YAAY,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\nimport readme from './readme.md';\n\nexport default {\n  title: 'Components/Toast',\n  parameters: {\n    layout: 'centered',\n    notes: readme,\n    design: [\n      {\n        name: 'Figma',\n        type: 'figma',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=5903%3A245536&t=Ne6myqwca5m00de7-1',\n      },\n      {\n        name: 'Link',\n        type: 'link',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=5903%3A245536&t=Ne6myqwca5m00de7-1',\n      },\n    ],\n  },\n  argTypes: {\n    type: {\n      name: 'Message type',\n      description: 'Changes the type of message.',\n      control: {\n        type: 'radio',\n      },\n      options: ['Information', 'Success', 'Warning', 'Error'],\n      table: {\n        defaultValue: {\n          summary: 'information',\n        },\n      },\n    },\n    header: {\n      name: 'Header',\n      description: 'Adds a header text.',\n      control: {\n        type: 'text',\n      },\n    },\n    subheader: {\n      name: 'Subheader',\n      description: 'Adds a subheader text.',\n      control: {\n        type: 'text',\n      },\n    },\n    link: {\n      name: 'Link',\n      description: 'Adds a CTA link.',\n      control: {\n        type: 'boolean',\n      },\n    },\n  },\n  args: {\n    type: 'Information',\n    header: 'Header',\n    subheader: '',\n    link: false,\n  },\n};\n\nconst Template = ({ type, header, subheader, link }) =>\n  formatHtmlPreview(\n    `<sdds-toast\n        type=\"${type.toLowerCase()}\"\n        header=\"${header}\"\n    >\n      ${\n        subheader\n          ? `\n      <div  slot=\"toast-subheader\">\n        ${subheader}\n      </div>\n      `\n          : ''\n      }\n       ${\n         link\n           ? `<a slot=\"toast-link\" href=\"#\">This is a link.</a>\n       `\n           : ''\n       }\n    </sdds-toast>\n        <script>\n        document.addEventListener('sddsClose', (event) => {\n            console.log(event)\n        })\n    </script>\n  `,\n  );\nexport const WebComponent = Template.bind({});\n"]}

package/dist/collection/components/toast/toast.stories.js

@@ -1,109 +1,109 @@
-import { formatHtmlPreview } from '../../utils/utils';
-import { iconsNames } from '../icon/iconsArray';
-export default {
-  title: 'Components/Toast',
-  parameters: {
-    layout: 'centered',
-    design: [
-      {
-        name: 'Figma',
-        type: 'figma',
-        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=5903%3A245536&t=Ne6myqwca5m00de7-1',
-      },
-      {
-        name: 'Link',
-        type: 'link',
-        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=5903%3A245536&t=Ne6myqwca5m00de7-1',
-      },
-    ],
-  },
-  argTypes: {
-    type: {
-      name: 'Message type',
-      description: 'Changes the type of message.',
-      control: {
-        type: 'radio',
-      },
-      options: ['Information', 'Success', 'Warning', 'Error'],
-    },
-    header: {
-      name: 'Header',
-      description: 'Adds a header text.',
-      control: {
-        type: 'text',
-      },
-    },
-    subheader: {
-      name: 'Subheader',
-      description: 'Adds a subheader text.',
-      control: {
-        type: 'text',
-      },
-    },
-    link: {
-      name: 'Link',
-      description: 'Adds a CTA link.',
-      control: {
-        type: 'boolean',
-      },
-    },
-    icon: {
-      name: 'Icon',
-      description: 'Icon to display on the button. Choose "none" to exclude the icon, or choose "recommended" to pick the icon that is recommended for the type of toast.',
-      control: {
-        type: 'select',
-      },
-      options: ['none', 'recommended', ...iconsNames],
-    },
-    iconType: {
-      name: 'Icon type',
-      description: 'Switch between showing a native or a web component icon.',
-      control: {
-        type: 'radio',
-      },
-      options: ['Native', 'Web Component'],
-    },
-  },
-  args: {
-    type: 'Information',
-    header: 'Header',
-    subheader: '',
-    link: false,
-    icon: 'recommended',
-    iconType: 'Web Component',
-  },
-};
-const typeLookup = {
-  Success: 'success',
-  Information: 'info',
-  Warning: 'warning',
-  Error: 'error',
-};
-const iconLookup = {
-  Success: 'tick',
-  Information: 'info',
-  Warning: 'warning',
-  Error: 'error',
-};
-const Template = ({ type, header, subheader, link, iconType, icon }) => {
-  const iconValue = icon === 'recommended' ? iconLookup[type] : icon;
+import { formatHtmlPreview } from '../../utils/utils';
+import { iconsNames } from '../icon/iconsArray';
+export default {
+  title: 'Components/Toast',
+  parameters: {
+    layout: 'centered',
+    design: [
+      {
+        name: 'Figma',
+        type: 'figma',
+        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=5903%3A245536&t=Ne6myqwca5m00de7-1',
+      },
+      {
+        name: 'Link',
+        type: 'link',
+        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=5903%3A245536&t=Ne6myqwca5m00de7-1',
+      },
+    ],
+  },
+  argTypes: {
+    type: {
+      name: 'Message type',
+      description: 'Changes the type of message.',
+      control: {
+        type: 'radio',
+      },
+      options: ['Information', 'Success', 'Warning', 'Error'],
+    },
+    header: {
+      name: 'Header',
+      description: 'Adds a header text.',
+      control: {
+        type: 'text',
+      },
+    },
+    subheader: {
+      name: 'Subheader',
+      description: 'Adds a subheader text.',
+      control: {
+        type: 'text',
+      },
+    },
+    link: {
+      name: 'Link',
+      description: 'Adds a CTA link.',
+      control: {
+        type: 'boolean',
+      },
+    },
+    icon: {
+      name: 'Icon',
+      description: 'Icon to display on the button. Choose "none" to exclude the icon, or choose "recommended" to pick the icon that is recommended for the type of toast.',
+      control: {
+        type: 'select',
+      },
+      options: ['none', 'recommended', ...iconsNames],
+    },
+    iconType: {
+      name: 'Icon type',
+      description: 'Switch between showing a native or a web component icon.',
+      control: {
+        type: 'radio',
+      },
+      options: ['Native', 'Web Component'],
+    },
+  },
+  args: {
+    type: 'Information',
+    header: 'Header',
+    subheader: '',
+    link: false,
+    icon: 'recommended',
+    iconType: 'Web Component',
+  },
+};
+const typeLookup = {
+  Success: 'success',
+  Information: 'info',
+  Warning: 'warning',
+  Error: 'error',
+};
+const iconLookup = {
+  Success: 'tick',
+  Information: 'info',
+  Warning: 'warning',
+  Error: 'error',
+};
+const Template = ({ type, header, subheader, link, iconType, icon }) => {
+  const iconValue = icon === 'recommended' ? iconLookup[type] : icon;
   return formatHtmlPreview(`
-      ${iconType === 'Native'
+      ${iconType === 'Native'
     ? `
     <style>
     /* Note: In case using WebFont icons, please make sure to import icons css file in your implementation */
     @import url('https://cdn.digitaldesign.scania.com/icons/webfont/css/sdds-icons.css');
 
     </style>
-      `
+      `
     : ''}
   <div class="sdds-toast sdds-toast-${typeLookup[type]}">
-  ${icon === 'none'
-    ? ''
+  ${icon === 'none'
+    ? ''
     : `
     <div class="sdds-toast-icon">
-      ${iconType === 'Native'
-      ? `<i class="sdds-icon ${iconValue}"></i>`
+      ${iconType === 'Native'
+      ? `<i class="sdds-icon ${iconValue}"></i>`
       : `<sdds-icon name="${iconValue}" size="20px"></sdds-icon>
       `}
     </div>
@@ -112,21 +112,21 @@ const Template = ({ type, header, subheader, link, iconType, icon }) => {
       <div class="sdds-toast-header">
         <span class="sdds-toast-headline">${header}</span>
         <button type="button" aria-label="close" class="sdds-toast-close">
-          ${iconType === 'Native'
-    ? `<i class="sdds-icon cross"></i>`
+          ${iconType === 'Native'
+    ? `<i class="sdds-icon cross"></i>`
     : `<sdds-icon name="cross" size="20px"></sdds-icon>
           `}
         </button>
       </div>
-      ${subheader || link
+      ${subheader || link
     ? `\n<div class="sdds-toast-body">\
           ${subheader ? `\n<span class="sdds-toast-subheadline">${subheader}</span>` : ''}\
           ${link ? '\n<a class="sdds-toast-link" href="#">Link example</a>' : ''}
-          </div> `
+          </div> `
     : ''}
     </div>
   </div>
-  `);
-};
-export const Native = Template.bind({});
-//# sourceMappingURL=toast.stories.js.map
+  `);
+};
+export const Native = Template.bind({});
+//# sourceMappingURL=toast.stories.js.map