@scania/tegel 0.0.2 → 0.0.32

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

@@ -1,59 +1,60 @@
-import { formatHtmlPreview } from '../../utils/utils';
-import readme from './readme.md';
-export default {
-  title: 'Components/Spinner',
-  parameters: {
-    layout: 'centered',
-    notes: readme,
-    design: [
-      {
-        name: 'Figma',
-        type: 'figma',
-        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=10259%3A29263&t=Ne6myqwca5m00de7-1',
-      },
-      {
-        name: 'Link',
-        type: 'link',
-        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=10259%3A29263&t=Ne6myqwca5m00de7-1',
-      },
-    ],
-  },
-  argTypes: {
-    variant: {
-      name: 'Variant',
-      control: {
-        type: 'radio',
-      },
-      options: ['Standard', 'Inverted'],
-      description: 'Variant of the spinner',
-    },
-    size: {
-      name: 'Size',
-      control: {
-        type: 'radio',
-      },
-      options: ['Large', 'Medium', 'Small', 'Extra small'],
-      description: 'Size of the spinner',
-    },
-  },
-  args: {
-    variant: 'Standard',
-    size: 'Large',
-  },
-};
-const Template = ({ size, variant }) => {
-  const sizeLookup = { 'Large': 'lg', 'Medium': 'md', 'Small': 'sm', 'Extra small': 'xs' };
-  const variantLookup = { Standard: 'standard', Inverted: 'inverted' };
+import { formatHtmlPreview } from '../../utils/utils';
+import readme from './readme.md';
+export default {
+  title: 'Components/Spinner',
+  parameters: {
+    layout: 'centered',
+    notes: readme,
+    design: [
+      {
+        name: 'Figma',
+        type: 'figma',
+        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=10259%3A29263&t=Ne6myqwca5m00de7-1',
+      },
+      {
+        name: 'Link',
+        type: 'link',
+        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=10259%3A29263&t=Ne6myqwca5m00de7-1',
+      },
+    ],
+  },
+  argTypes: {
+    variant: {
+      name: 'Variant',
+      control: {
+        type: 'radio',
+      },
+      options: ['Standard', 'Inverted'],
+      description: 'Variant of the spinner',
+    },
+    size: {
+      name: 'Size',
+      control: {
+        type: 'radio',
+      },
+      options: ['Large', 'Medium', 'Small', 'Extra small'],
+      description: 'Size of the spinner',
+    },
+  },
+  args: {
+    variant: 'Standard',
+    size: 'Large',
+  },
+};
+const Template = ({ size, variant }) => {
+  const sizeLookup = { 'Large': 'lg', 'Medium': 'md', 'Small': 'sm', 'Extra small': 'xs' };
+  const variantLookup = { Standard: 'standard', Inverted: 'inverted' };
   return formatHtmlPreview(`
   <sdds-spinner 
     size="${sizeLookup[size]}"  
     variant="${variantLookup[variant]}">
   </sdds-spinner>
-  `);
-};
-export const Default = Template.bind({});
-Default.args = {};
-export const Inverted = Template.bind({});
-Inverted.args = {
-  variant: 'Inverted',
-};
+  `);
+};
+export const Default = Template.bind({});
+Default.args = {};
+export const Inverted = Template.bind({});
+Inverted.args = {
+  variant: 'Inverted',
+};
+//# sourceMappingURL=spinner.stories.js.map

package/dist/collection/components/spinner/spinner.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"spinner.stories.js","sourceRoot":"","sources":["../../../src/components/spinner/spinner.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACtD,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,eAAe;EACb,KAAK,EAAE,oBAAoB;EAC3B,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,OAAO,EAAE;MACP,IAAI,EAAE,SAAS;MACf,OAAO,EAAE;QACP,IAAI,EAAE,OAAO;OACd;MACD,OAAO,EAAE,CAAC,UAAU,EAAE,UAAU,CAAC;MACjC,WAAW,EAAE,wBAAwB;KACtC;IACD,IAAI,EAAE;MACJ,IAAI,EAAE,MAAM;MACZ,OAAO,EAAE;QACP,IAAI,EAAE,OAAO;OACd;MACD,OAAO,EAAE,CAAC,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,aAAa,CAAC;MACpD,WAAW,EAAE,qBAAqB;KACnC;GACF;EACD,IAAI,EAAE;IACJ,OAAO,EAAE,UAAU;IACnB,IAAI,EAAE,OAAO;GACd;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE,EAAE;EACrC,MAAM,UAAU,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC;EACzF,MAAM,aAAa,GAAG,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,CAAC;EAErE,OAAO,iBAAiB,CACtB;;YAEQ,UAAU,CAAC,IAAI,CAAC;eACb,aAAa,CAAC,OAAO,CAAC;;GAElC,CACA,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,OAAO,CAAC,IAAI,GAAG,EAAE,CAAC;AAElB,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC1C,QAAQ,CAAC,IAAI,GAAG;EACd,OAAO,EAAE,UAAU;CACpB,CAAC","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\nimport readme from './readme.md';\n\nexport default {\n  title: 'Components/Spinner',\n  parameters: {\n    layout: 'centered', // Center the component horizontally and vertically in the Canvas\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=10259%3A29263&t=Ne6myqwca5m00de7-1',\n      },\n      {\n        name: 'Link',\n        type: 'link',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=10259%3A29263&t=Ne6myqwca5m00de7-1',\n      },\n    ],\n  },\n  argTypes: {\n    variant: {\n      name: 'Variant',\n      control: {\n        type: 'radio',\n      },\n      options: ['Standard', 'Inverted'],\n      description: 'Variant of the spinner',\n    },\n    size: {\n      name: 'Size',\n      control: {\n        type: 'radio',\n      },\n      options: ['Large', 'Medium', 'Small', 'Extra small'],\n      description: 'Size of the spinner',\n    },\n  },\n  args: {\n    variant: 'Standard',\n    size: 'Large',\n  },\n};\n\nconst Template = ({ size, variant }) => {\n  const sizeLookup = { 'Large': 'lg', 'Medium': 'md', 'Small': 'sm', 'Extra small': 'xs' };\n  const variantLookup = { Standard: 'standard', Inverted: 'inverted' };\n\n  return formatHtmlPreview(\n    `\n  <sdds-spinner \n    size=\"${sizeLookup[size]}\"  \n    variant=\"${variantLookup[variant]}\">\n  </sdds-spinner>\n  `,\n  );\n};\n\nexport const Default = Template.bind({});\nDefault.args = {};\n\nexport const Inverted = Template.bind({});\nInverted.args = {\n  variant: 'Inverted',\n};\n"]}

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

@@ -1,74 +1,74 @@
-import { formatHtmlPreview } from '../../utils/utils';
-export default {
-  title: 'Components/Stepper',
-  parameters: {
-    layout: 'centered',
-    design: [
-      {
-        name: 'Figma',
-        type: 'figma',
-        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=10508%3A32221&t=Ne6myqwca5m00de7-1',
-      },
-      {
-        name: 'Link',
-        type: 'link',
-        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=10508%3A32221&t=Ne6myqwca5m00de7-1',
-      },
-    ],
-  },
-  argTypes: {
-    size: {
-      name: 'Size',
-      description: 'Size of the stepper',
-      control: {
-        type: 'radio',
-      },
-      options: ['Default', 'Small'],
-    },
-    style: {
-      name: 'Style',
-      description: 'Style of the stepper',
-      control: {
-        type: 'radio',
-      },
-      options: ['Default', 'Text on side', 'Vertical'],
-    },
-    showLabel: {
-      name: 'Show label text',
-      description: 'Show or hide the label text',
-      control: {
-        type: 'boolean',
-      },
-    },
-    iconType: {
-      name: 'Icon type',
-      description: 'Native/Web Component',
-      control: {
-        type: 'radio',
-      },
-      options: ['Native', 'Web Component'],
-    },
-  },
-  args: {
-    size: 'Default',
-    style: 'Default',
-    showLabel: true,
-    iconType: 'Native',
-  },
-};
-const Template = ({ size, style, showLabel, iconType }) => {
-  const sizeClass = size === 'Small' ? 'sdds-stepper-sm' : '';
-  const styleLookup = {
-    'Default': '',
-    'Text on side': 'sdds-stepper--sidetext',
-    'Vertical': 'sdds-stepper--vertical',
-  };
+import { formatHtmlPreview } from '../../utils/utils';
+export default {
+  title: 'Components/Stepper',
+  parameters: {
+    layout: 'centered',
+    design: [
+      {
+        name: 'Figma',
+        type: 'figma',
+        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=10508%3A32221&t=Ne6myqwca5m00de7-1',
+      },
+      {
+        name: 'Link',
+        type: 'link',
+        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=10508%3A32221&t=Ne6myqwca5m00de7-1',
+      },
+    ],
+  },
+  argTypes: {
+    size: {
+      name: 'Size',
+      description: 'Size of the stepper',
+      control: {
+        type: 'radio',
+      },
+      options: ['Default', 'Small'],
+    },
+    style: {
+      name: 'Style',
+      description: 'Style of the stepper',
+      control: {
+        type: 'radio',
+      },
+      options: ['Default', 'Text on side', 'Vertical'],
+    },
+    showLabel: {
+      name: 'Show label text',
+      description: 'Show or hide the label text',
+      control: {
+        type: 'boolean',
+      },
+    },
+    iconType: {
+      name: 'Icon type',
+      description: 'Native/Web Component',
+      control: {
+        type: 'radio',
+      },
+      options: ['Native', 'Web Component'],
+    },
+  },
+  args: {
+    size: 'Default',
+    style: 'Default',
+    showLabel: true,
+    iconType: 'Native',
+  },
+};
+const Template = ({ size, style, showLabel, iconType }) => {
+  const sizeClass = size === 'Small' ? 'sdds-stepper-sm' : '';
+  const styleLookup = {
+    'Default': '',
+    'Text on side': 'sdds-stepper--sidetext',
+    'Vertical': 'sdds-stepper--vertical',
+  };
   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>
-    `
+    `
     : ''}
 
 
@@ -84,9 +84,9 @@ const Template = ({ size, style, showLabel, iconType }) => {
 
       <div class="sdds-stepper__step sdds-stepper__step--warning">
         <div class="sdds-stepper__step-icon">
-        ${iconType === 'Native'
+        ${iconType === 'Native'
     ? `<i class="sdds-icon warning"></i>
-        `
+        `
     : `<sdds-icon name="warning" size="${size === 'Small' ? '16px' : '18px'}"></sdds-icon> `}
         </div>
         ${showLabel ? '<label class="sdds-stepper__step_label">Step warning</label>' : ''}
@@ -101,9 +101,9 @@ const Template = ({ size, style, showLabel, iconType }) => {
 
       <div class="sdds-stepper__step sdds-stepper__step--success">
         <div class="sdds-stepper__step-icon">
-        ${iconType === 'Native'
+        ${iconType === 'Native'
     ? `<i class="sdds-icon tick"></i>
-        `
+        `
     : `<div>
         <sdds-icon name="tick" size="${size === 'Small' ? '16px' : '20px'}"></sdds-icon> 
         </div>`}
@@ -113,27 +113,28 @@ const Template = ({ size, style, showLabel, iconType }) => {
 
     </div>
   </div>
-    `);
-};
-export const Default = Template.bind({});
-Default.args = {};
-export const Small = Template.bind({});
-Small.args = {
-  size: 'Small',
-};
-export const TextOnSide = Template.bind({});
-TextOnSide.args = {
-  size: 'Default',
-  style: 'Text on side',
-};
-export const Vertical = Template.bind({});
-Vertical.args = {
-  size: 'Default',
-  style: 'Vertical',
-};
-export const HideLabel = Template.bind({});
-HideLabel.args = {
-  size: 'Default',
-  style: 'Default',
-  label: 'Hide',
-};
+    `);
+};
+export const Default = Template.bind({});
+Default.args = {};
+export const Small = Template.bind({});
+Small.args = {
+  size: 'Small',
+};
+export const TextOnSide = Template.bind({});
+TextOnSide.args = {
+  size: 'Default',
+  style: 'Text on side',
+};
+export const Vertical = Template.bind({});
+Vertical.args = {
+  size: 'Default',
+  style: 'Vertical',
+};
+export const HideLabel = Template.bind({});
+HideLabel.args = {
+  size: 'Default',
+  style: 'Default',
+  label: 'Hide',
+};
+//# sourceMappingURL=stepper.stories.js.map

package/dist/collection/components/stepper/stepper.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stepper.stories.js","sourceRoot":"","sources":["../../../src/components/stepper/stepper.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAEtD,eAAe;EACb,KAAK,EAAE,oBAAoB;EAC3B,UAAU,EAAE;IACV,MAAM,EAAE,UAAU;IAClB,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,MAAM;MACZ,WAAW,EAAE,qBAAqB;MAClC,OAAO,EAAE;QACP,IAAI,EAAE,OAAO;OACd;MACD,OAAO,EAAE,CAAC,SAAS,EAAE,OAAO,CAAC;KAC9B;IACD,KAAK,EAAE;MACL,IAAI,EAAE,OAAO;MACb,WAAW,EAAE,sBAAsB;MACnC,OAAO,EAAE;QACP,IAAI,EAAE,OAAO;OACd;MACD,OAAO,EAAE,CAAC,SAAS,EAAE,cAAc,EAAE,UAAU,CAAC;KACjD;IACD,SAAS,EAAE;MACT,IAAI,EAAE,iBAAiB;MACvB,WAAW,EAAE,6BAA6B;MAC1C,OAAO,EAAE;QACP,IAAI,EAAE,SAAS;OAChB;KACF;IACD,QAAQ,EAAE;MACR,IAAI,EAAE,WAAW;MACjB,WAAW,EAAE,sBAAsB;MACnC,OAAO,EAAE;QACP,IAAI,EAAE,OAAO;OACd;MACD,OAAO,EAAE,CAAC,QAAQ,EAAE,eAAe,CAAC;KACrC;GACF;EACD,IAAI,EAAE;IACJ,IAAI,EAAE,SAAS;IACf,KAAK,EAAE,SAAS;IAChB,SAAS,EAAE,IAAI;IACf,QAAQ,EAAE,QAAQ;GACnB;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,EAAE;EACxD,MAAM,SAAS,GAAG,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,CAAC;EAE5D,MAAM,WAAW,GAAG;IAClB,SAAS,EAAE,EAAE;IACb,cAAc,EAAE,wBAAwB;IACxC,UAAU,EAAE,wBAAwB;GACrC,CAAC;EACF,OAAO,iBAAiB,CACtB;;MAGE,QAAQ,KAAK,QAAQ;IACnB,CAAC,CAAC;;KAEL;IACG,CAAC,CAAC,EACN;;;;+BAI2B,SAAS,IAAI,WAAW,CAAC,KAAK,CAAC;;;;;;UAMpD,SAAS,CAAC,CAAC,CAAC,4DAA4D,CAAC,CAAC,CAAC,EAAE;;;;;UAM7E,QAAQ,KAAK,QAAQ;IACnB,CAAC,CAAC;SACL;IACG,CAAC,CAAC,mCAAmC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,iBAC3E;;UAEE,SAAS,CAAC,CAAC,CAAC,8DAA8D,CAAC,CAAC,CAAC,EAAE;;;;;;;UAO/E,SAAS,CAAC,CAAC,CAAC,+DAA+D,CAAC,CAAC,CAAC,EAAE;;;;;UAMhF,QAAQ,KAAK,QAAQ;IACnB,CAAC,CAAC;SACL;IACG,CAAC,CAAC;uCACyB,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;eAEjE;;UAEE,SAAS,CAAC,CAAC,CAAC,8DAA8D,CAAC,CAAC,CAAC,EAAE;;;;;KAKpF,CACF,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,OAAO,CAAC,IAAI,GAAG,EAAE,CAAC;AAElB,MAAM,CAAC,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACvC,KAAK,CAAC,IAAI,GAAG;EACX,IAAI,EAAE,OAAO;CACd,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC5C,UAAU,CAAC,IAAI,GAAG;EAChB,IAAI,EAAE,SAAS;EACf,KAAK,EAAE,cAAc;CACtB,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC1C,QAAQ,CAAC,IAAI,GAAG;EACd,IAAI,EAAE,SAAS;EACf,KAAK,EAAE,UAAU;CAClB,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC3C,SAAS,CAAC,IAAI,GAAG;EACf,IAAI,EAAE,SAAS;EACf,KAAK,EAAE,SAAS;EAChB,KAAK,EAAE,MAAM;CACd,CAAC","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\n\nexport default {\n  title: 'Components/Stepper',\n  parameters: {\n    layout: 'centered',\n    design: [\n      {\n        name: 'Figma',\n        type: 'figma',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=10508%3A32221&t=Ne6myqwca5m00de7-1',\n      },\n      {\n        name: 'Link',\n        type: 'link',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=10508%3A32221&t=Ne6myqwca5m00de7-1',\n      },\n    ],\n  },\n  argTypes: {\n    size: {\n      name: 'Size',\n      description: 'Size of the stepper',\n      control: {\n        type: 'radio',\n      },\n      options: ['Default', 'Small'],\n    },\n    style: {\n      name: 'Style',\n      description: 'Style of the stepper',\n      control: {\n        type: 'radio',\n      },\n      options: ['Default', 'Text on side', 'Vertical'],\n    },\n    showLabel: {\n      name: 'Show label text',\n      description: 'Show or hide the label text',\n      control: {\n        type: 'boolean',\n      },\n    },\n    iconType: {\n      name: 'Icon type',\n      description: 'Native/Web Component',\n      control: {\n        type: 'radio',\n      },\n      options: ['Native', 'Web Component'],\n    },\n  },\n  args: {\n    size: 'Default',\n    style: 'Default',\n    showLabel: true,\n    iconType: 'Native',\n  },\n};\n\nconst Template = ({ size, style, showLabel, iconType }) => {\n  const sizeClass = size === 'Small' ? 'sdds-stepper-sm' : '';\n\n  const styleLookup = {\n    'Default': '',\n    'Text on side': 'sdds-stepper--sidetext',\n    'Vertical': 'sdds-stepper--vertical',\n  };\n  return formatHtmlPreview(\n    `\n\n    ${\n      iconType === 'Native'\n        ? ` <style>/* Note: In case using WebFont icons, please make sure to import icons css file in your implementation */\n  @import url('https://cdn.digitaldesign.scania.com/icons/webfont/css/sdds-icons.css');</style>\n    `\n        : ''\n    }\n\n\n    <div class=\"sdds-stepper-demo-container\">\n    <div class=\"sdds-stepper ${sizeClass} ${styleLookup[style]}\">\n\n      <div class=\"sdds-stepper__step sdds-stepper__step--value\">\n        <div class=\"sdds-stepper__step-icon\">\n          <span class=\"sdds-stepper__step-icon-value\">1</span>\n        </div>\n        ${showLabel ? '<label class=\"sdds-stepper__step_label\">Step value</label>' : ''}\n      </div>\n\n      <div class=\"sdds-stepper__step sdds-stepper__step--warning\">\n        <div class=\"sdds-stepper__step-icon\">\n        ${\n          iconType === 'Native'\n            ? `<i class=\"sdds-icon warning\"></i>\n        `\n            : `<sdds-icon name=\"warning\" size=\"${size === 'Small' ? '16px' : '18px'}\"></sdds-icon> `\n        }\n        </div>\n        ${showLabel ? '<label class=\"sdds-stepper__step_label\">Step warning</label>' : ''}\n      </div>\n\n      <div class=\"sdds-stepper__step sdds-stepper__step--inactive\">\n        <div class=\"sdds-stepper__step-icon\">\n          <span class=\"sdds-stepper__step-icon-value\">3</span>\n        </div>\n        ${showLabel ? '<label class=\"sdds-stepper__step_label\">Step inactive</label>' : ''}\n      </div>\n\n      <div class=\"sdds-stepper__step sdds-stepper__step--success\">\n        <div class=\"sdds-stepper__step-icon\">\n        ${\n          iconType === 'Native'\n            ? `<i class=\"sdds-icon tick\"></i>\n        `\n            : `<div>\n        <sdds-icon name=\"tick\" size=\"${size === 'Small' ? '16px' : '20px'}\"></sdds-icon> \n        </div>`\n        }\n        </div>\n        ${showLabel ? '<label class=\"sdds-stepper__step_label\">Step success</label>' : ''}\n      </div>\n\n    </div>\n  </div>\n    `,\n  );\n};\n\nexport const Default = Template.bind({});\nDefault.args = {};\n\nexport const Small = Template.bind({});\nSmall.args = {\n  size: 'Small',\n};\n\nexport const TextOnSide = Template.bind({});\nTextOnSide.args = {\n  size: 'Default',\n  style: 'Text on side',\n};\n\nexport const Vertical = Template.bind({});\nVertical.args = {\n  size: 'Default',\n  style: 'Vertical',\n};\n\nexport const HideLabel = Template.bind({});\nHideLabel.args = {\n  size: 'Default',\n  style: 'Default',\n  label: 'Hide',\n};\n"]}

package/dist/collection/components/tabs/inline-tabs-default/inline-tab/inline-tab.js

@@ -1,80 +1,81 @@
-import { Host, h } from '@stencil/core';
-export class InlineTabsChild {
-  constructor() {
-    this.label = undefined;
-    this.disabled = false;
-    this.default = false;
-  }
-  render() {
-    return (h(Host, null, h("slot", null)));
-  }
-  static get is() { return "sdds-inline-tab"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["inline-tab.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["inline-tab.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "label": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "label",
-        "reflect": false
-      },
-      "disabled": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "disabled",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "default": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "default",
-        "reflect": false,
-        "defaultValue": "false"
-      }
-    };
-  }
-}
+import { Host, h } from '@stencil/core';
+export class InlineTabsChild {
+  constructor() {
+    this.label = undefined;
+    this.disabled = false;
+    this.default = false;
+  }
+  render() {
+    return (h(Host, null, h("slot", null)));
+  }
+  static get is() { return "sdds-inline-tab"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["inline-tab.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["inline-tab.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "label": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "label",
+        "reflect": false
+      },
+      "disabled": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "disabled",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "default": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "default",
+        "reflect": false,
+        "defaultValue": "false"
+      }
+    };
+  }
+}
+//# sourceMappingURL=inline-tab.js.map

package/dist/collection/components/tabs/inline-tabs-default/inline-tab/inline-tab.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"inline-tab.js","sourceRoot":"","sources":["../../../../../src/components/tabs/inline-tabs-default/inline-tab/inline-tab.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,eAAe;;;oBAGE,KAAK;mBAEN,KAAK;;EAEhC,MAAM;IACJ,OAAO,CACL,EAAC,IAAI;MACH,eAAa,CACR,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'sdds-inline-tab',\n  styleUrl: 'inline-tab.scss',\n  shadow: true,\n})\nexport class InlineTabsChild {\n  @Prop() label: string;\n\n  @Prop() disabled: boolean = false;\n\n  @Prop() default: boolean = false;\n\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"]}