npm - @spw-ds/spw-stencil-library - Versions diffs - 1.2.3 → 1.2.5 - Mend

@spw-ds/spw-stencil-library 1.2.3 → 1.2.5

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 (724) hide show

package/dist/collection/stories/components/spw-date-picker/spw-date-picker.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"spw-date-picker.stories.js","sourceRoot":"","sources":["../../../../src/stories/components/spw-date-picker/spw-date-picker.stories.ts"],"names":[],"mappings":"AAAA,IAAI,cAAmB,CAAC;AAExB,IAAI,CAAC;IACH,cAAc,GAAG,OAAO,CAAC,uCAAuC,CAAC,CAAC;AACpE,CAAC;AAAC,OAAO,KAAK,EAAE,CAAC;IACf,OAAO,CAAC,IAAI,CAAC,qEAAqE,CAAC,CAAC;IACpF,cAAc,GAAG,EAAE,CAAC;AACtB,CAAC;AAGD,OAAO,EAAE,qBAAqB,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAElE,MAAM,UAAU,GAAG,iBAAiB,CAAC;AAErC,MAAM,QAAQ,GAAG,qBAAqB,CAAC,cAAc,EAAE,EAAE,GAAG,EAAE,UAAU,EAAE,CAAC,CAAC;AAE5E,MAAM,IAAI,GAAS;IACjB,KAAK,EAAE,wCAAwC;IAC/C,SAAS,EAAE,UAAU;IACrB,QAAQ;IACR,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,SAAS,EAAE;;;;;;SAMV;aACF;SACF;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,mBAAmB;AACnB,MAAM,QAAQ,GAAY,IAAI,CAAC,EAAE;IAC/B,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACnD,MAAM,QAAQ,GAAG,qBAAqB,CAAC,cAAc,EAAE,EAAE,GAAG,EAAE,UAAU,EAAE,CAAC,IAAI,EAAE,CAAC;IAClF,MAAM,WAAW,GAAG,QAAQ,CAAC,WAAW,IAAI,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IAElE,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,EAAE,EAAE;QAC1C,IAAI,WAAW,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;YAC9B,OAAO,CAAC,YAAY,CAAC,WAAW,CAAC,GAAG,CAAC,EAAE,GAAa,CAAC,CAAC;QACxD,CAAC;aAAM,IAAI,GAAG,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC;YAChC,OAAO,CAAC,gBAAgB,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,EAAE,GAAG,CAAC,CAAC;QAChE,CAAC;IACH,CAAC,CAAC,CAAC;IACH,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC;AAEF,UAAU;AACV,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,OAAO,CAAC,IAAI,GAAG;IACb,KAAK,EAAE,mBAAmB;IAC1B,WAAW,EAAE,YAAY;CAC1B,CAAC;AAEF,YAAY;AACZ,MAAM,CAAC,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC3C,SAAS,CAAC,IAAI,GAAG;IACf,KAAK,EAAE,kBAAkB;IACzB,KAAK,EAAE,YAAY;IACnB,WAAW,EAAE,YAAY;CAC1B,CAAC;AAEF,kBAAkB;AAClB,MAAM,CAAC,MAAM,eAAe,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACjD,eAAe,CAAC,IAAI,GAAG;IACrB,KAAK,EAAE,cAAc;IACrB,WAAW,EAAE,YAAY;IACzB,GAAG,EAAE,YAAY;IACjB,GAAG,EAAE,YAAY;CAClB,CAAC;AAEF,WAAW;AACX,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC1C,QAAQ,CAAC,IAAI,GAAG;IACd,KAAK,EAAE,iBAAiB;IACxB,WAAW,EAAE,gBAAgB;IAC7B,QAAQ,EAAE,IAAI;CACf,CAAC","sourcesContent":["let componentsData: any;\n\ntry {\n componentsData = require('../../../../dist/components_json.json');\n} catch (error) {\n console.warn('components_json.json non trouvé. Utilisation de valeurs par défaut.');\n componentsData = {};\n}\n\nimport { Meta, StoryFn } from '@storybook/web-components';\nimport { withComponentControls, toKebabCase } from '@utils/utils';\n\nconst elementTag = 'spw-date-picker';\n\nconst argTypes = withComponentControls(componentsData, { tag: elementTag });\n\nconst meta: Meta = {\n title: 'Composants/Choix de date (date picker)',\n component: elementTag,\n argTypes,\n tags: ['autodocs'],\n parameters: {\n docs: {\n description: {\n component: `\n<strong class=\"mr-2\">Statut du composant :</strong> <spw-tag size=\"small\" variant=\"green\">Prêt</spw-tag>\n\nComposant de sélection de date avec options simples et avancées, incluant gestion de plages.\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/~~xxx~~/~~yyy~~)\n `,\n },\n },\n },\n};\n\nexport default meta;\n\n// Stories template\nconst Template: StoryFn = args => {\n const element = document.createElement(elementTag);\n const controls = withComponentControls(componentsData, { tag: elementTag }) \|\| {};\n const masterProps = controls.__realProps \|\| Object.keys(controls);\n\n Object.entries(args).forEach(([key, val]) => {\n if (masterProps.includes(key)) {\n element.setAttribute(toKebabCase(key), val as string);\n } else if (key.startsWith('on')) {\n element.addEventListener(key.substring(2).toLowerCase(), val);\n }\n });\n return element;\n};\n\n// Default\nexport const Default = Template.bind({});\nDefault.args = {\n label: 'Date de naissance',\n placeholder: 'JJ/MM/AAAA',\n};\n\n// WithValue\nexport const WithValue = Template.bind({});\nWithValue.args = {\n label: 'Date avec valeur',\n value: '2025-06-30',\n placeholder: 'JJ/MM/AAAA',\n};\n\n// WithConstraints\nexport const WithConstraints = Template.bind({});\nWithConstraints.args = {\n label: 'Date limitée',\n placeholder: 'JJ/MM/AAAA',\n min: '2025-01-01',\n max: '2025-12-31',\n};\n\n// Disabled\nexport const Disabled = Template.bind({});\nDisabled.args = {\n label: 'Date désactivée',\n placeholder: 'Non disponible',\n disabled: true,\n};\n"]}
1	+ {"version":3,"file":"spw-date-picker.stories.js","sourceRoot":"","sources":["../../../../src/stories/components/spw-date-picker/spw-date-picker.stories.ts"],"names":[],"mappings":"AAAA,IAAI,cAAmB,CAAC;AAExB,IAAI,CAAC;IACH,cAAc,GAAG,OAAO,CAAC,uCAAuC,CAAC,CAAC;AACpE,CAAC;AAAC,OAAO,KAAK,EAAE,CAAC;IACf,OAAO,CAAC,IAAI,CAAC,qEAAqE,CAAC,CAAC;IACpF,cAAc,GAAG,EAAE,CAAC;AACtB,CAAC;AAGD,OAAO,EAAE,qBAAqB,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAElE,MAAM,UAAU,GAAG,iBAAiB,CAAC;AAErC,MAAM,QAAQ,GAAG,qBAAqB,CAAC,cAAc,EAAE,EAAE,GAAG,EAAE,UAAU,EAAE,CAAC,CAAC;AAE5E,MAAM,IAAI,GAAS;IACjB,KAAK,EAAE,wCAAwC;IAC/C,SAAS,EAAE,UAAU;IACrB,QAAQ;IACR,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,SAAS,EAAE;;;;;;SAMV;aACF;SACF;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,mBAAmB;AACnB,MAAM,QAAQ,GAAY,IAAI,CAAC,EAAE;IAC/B,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACnD,MAAM,QAAQ,GAAG,qBAAqB,CAAC,cAAc,EAAE,EAAE,GAAG,EAAE,UAAU,EAAE,CAAC,IAAI,EAAE,CAAC;IAClF,MAAM,WAAW,GAAG,QAAQ,CAAC,WAAW,IAAI,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IAElE,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,EAAE,EAAE;QAC1C,IAAI,WAAW,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;YAC9B,OAAO,CAAC,YAAY,CAAC,WAAW,CAAC,GAAG,CAAC,EAAE,GAAa,CAAC,CAAC;QACxD,CAAC;aAAM,IAAI,GAAG,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC;YAChC,OAAO,CAAC,gBAAgB,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,EAAE,GAAG,CAAC,CAAC;QAChE,CAAC;IACH,CAAC,CAAC,CAAC;IACH,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC;AAEF,UAAU;AACV,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,OAAO,CAAC,IAAI,GAAG;IACb,KAAK,EAAE,mBAAmB;IAC1B,WAAW,EAAE,YAAY;CAC1B,CAAC;AAEF,YAAY;AACZ,MAAM,CAAC,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC3C,SAAS,CAAC,IAAI,GAAG;IACf,KAAK,EAAE,kBAAkB;IACzB,KAAK,EAAE,YAAY;IACnB,WAAW,EAAE,YAAY;CAC1B,CAAC;AAEF,kBAAkB;AAClB,MAAM,CAAC,MAAM,eAAe,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACjD,eAAe,CAAC,IAAI,GAAG;IACrB,KAAK,EAAE,cAAc;IACrB,WAAW,EAAE,YAAY;IACzB,GAAG,EAAE,YAAY;IACjB,GAAG,EAAE,YAAY;CAClB,CAAC;AAEF,WAAW;AACX,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC1C,QAAQ,CAAC,IAAI,GAAG;IACd,KAAK,EAAE,iBAAiB;IACxB,WAAW,EAAE,gBAAgB;IAC7B,QAAQ,EAAE,IAAI;CACf,CAAC;AAEF,8CAA8C;AAC9C,MAAM,aAAa,GAAY,IAAI,CAAC,EAAE;IACpC,MAAM,SAAS,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAEhD,+BAA+B;IAC/B,MAAM,WAAW,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACvD,WAAW,CAAC,YAAY,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;IAC1C,WAAW,CAAC,YAAY,CAAC,UAAU,EAAE,IAAI,CAAC,OAAO,IAAI,GAAG,CAAC,CAAC;IAC1D,WAAW,CAAC,YAAY,CAAC,UAAU,EAAE,MAAM,CAAC,CAAC;IAC7C,WAAW,CAAC,YAAY,CAAC,OAAO,EAAE,IAAI,CAAC,UAAU,IAAI,eAAe,CAAC,CAAC;IACtE,WAAW,CAAC,YAAY,CAAC,aAAa,EAAE,IAAI,CAAC,gBAAgB,IAAI,8BAA8B,CAAC,CAAC;IACjG,IAAI,IAAI,CAAC,UAAU;QAAE,WAAW,CAAC,YAAY,CAAC,OAAO,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;IACxE,WAAW,CAAC,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;IAElC,6BAA6B;IAC7B,MAAM,SAAS,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACrD,SAAS,CAAC,YAAY,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;IACxC,SAAS,CAAC,YAAY,CAAC,UAAU,EAAE,IAAI,CAAC,OAAO,IAAI,GAAG,CAAC,CAAC;IACxD,SAAS,CAAC,YAAY,CAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,IAAI,aAAa,CAAC,CAAC;IAChE,SAAS,CAAC,YAAY,CAAC,aAAa,EAAE,IAAI,CAAC,cAAc,IAAI,4BAA4B,CAAC,CAAC;IAC3F,IAAI,IAAI,CAAC,QAAQ;QAAE,SAAS,CAAC,YAAY,CAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;IAElE,SAAS,CAAC,WAAW,CAAC,WAAW,CAAC,CAAC;IACnC,SAAS,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC;IAEjC,OAAO,SAAS,CAAC;AACnB,CAAC,CAAC;AAEF,YAAY;AACZ,MAAM,CAAC,MAAM,SAAS,GAAG,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAChD,SAAS,CAAC,IAAI,GAAG;IACf,OAAO,EAAE,eAAe;IACxB,UAAU,EAAE,eAAe;IAC3B,gBAAgB,EAAE,8BAA8B;IAChD,QAAQ,EAAE,aAAa;IACvB,cAAc,EAAE,4BAA4B;CAC7C,CAAC;AAEF,sBAAsB;AACtB,MAAM,CAAC,MAAM,mBAAmB,GAAG,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC1D,mBAAmB,CAAC,IAAI,GAAG;IACzB,OAAO,EAAE,eAAe;IACxB,UAAU,EAAE,eAAe;IAC3B,gBAAgB,EAAE,8BAA8B;IAChD,UAAU,EAAE,YAAY;IACxB,QAAQ,EAAE,aAAa;IACvB,cAAc,EAAE,4BAA4B;IAC5C,QAAQ,EAAE,YAAY;CACvB,CAAC","sourcesContent":["let componentsData: any;\n\ntry {\n componentsData = require('../../../../dist/components_json.json');\n} catch (error) {\n console.warn('components_json.json non trouvé. Utilisation de valeurs par défaut.');\n componentsData = {};\n}\n\nimport { Meta, StoryFn } from '@storybook/web-components';\nimport { withComponentControls, toKebabCase } from '@utils/utils';\n\nconst elementTag = 'spw-date-picker';\n\nconst argTypes = withComponentControls(componentsData, { tag: elementTag });\n\nconst meta: Meta = {\n title: 'Composants/Choix de date (date picker)',\n component: elementTag,\n argTypes,\n tags: ['autodocs'],\n parameters: {\n docs: {\n description: {\n component: `\n<strong class=\"mr-2\">Statut du composant :</strong> <spw-tag size=\"small\" variant=\"green\">Prêt</spw-tag>\n\nComposant de sélection de date avec options simples et avancées, incluant gestion de plages.\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/314e53-choix-de-date-date-picker)\n `,\n },\n },\n },\n};\n\nexport default meta;\n\n// Stories template\nconst Template: StoryFn = args => {\n const element = document.createElement(elementTag);\n const controls = withComponentControls(componentsData, { tag: elementTag }) \|\| {};\n const masterProps = controls.__realProps \|\| Object.keys(controls);\n\n Object.entries(args).forEach(([key, val]) => {\n if (masterProps.includes(key)) {\n element.setAttribute(toKebabCase(key), val as string);\n } else if (key.startsWith('on')) {\n element.addEventListener(key.substring(2).toLowerCase(), val);\n }\n });\n return element;\n};\n\n// Default\nexport const Default = Template.bind({});\nDefault.args = {\n label: 'Date de naissance',\n placeholder: 'JJ/MM/AAAA',\n};\n\n// WithValue\nexport const WithValue = Template.bind({});\nWithValue.args = {\n label: 'Date avec valeur',\n value: '2025-06-30',\n placeholder: 'JJ/MM/AAAA',\n};\n\n// WithConstraints\nexport const WithConstraints = Template.bind({});\nWithConstraints.args = {\n label: 'Date limitée',\n placeholder: 'JJ/MM/AAAA',\n min: '2025-01-01',\n max: '2025-12-31',\n};\n\n// Disabled\nexport const Disabled = Template.bind({});\nDisabled.args = {\n label: 'Date désactivée',\n placeholder: 'Non disponible',\n disabled: true,\n};\n\n// Range template (nécessite deux datepickers)\nconst RangeTemplate: StoryFn = args => {\n const container = document.createElement('div');\n\n // Créer le datepicker de début\n const startPicker = document.createElement(elementTag);\n startPicker.setAttribute('range', 'true');\n startPicker.setAttribute('range-id', args.rangeId \|\| '1');\n startPicker.setAttribute('is-start', 'true');\n startPicker.setAttribute('label', args.startLabel \|\| 'Date de début');\n startPicker.setAttribute('placeholder', args.startPlaceholder \|\| 'Choisissez une date de début');\n if (args.startValue) startPicker.setAttribute('value', args.startValue);\n startPicker.classList.add('mb-3');\n\n // Créer le datepicker de fin\n const endPicker = document.createElement(elementTag);\n endPicker.setAttribute('range', 'true');\n endPicker.setAttribute('range-id', args.rangeId \|\| '1');\n endPicker.setAttribute('label', args.endLabel \|\| 'Date de fin');\n endPicker.setAttribute('placeholder', args.endPlaceholder \|\| 'Choisissez une date de fin');\n if (args.endValue) endPicker.setAttribute('value', args.endValue);\n\n container.appendChild(startPicker);\n container.appendChild(endPicker);\n\n return container;\n};\n\n// DateRange\nexport const DateRange = RangeTemplate.bind({});\nDateRange.args = {\n rangeId: 'range-story-1',\n startLabel: 'Date de début',\n startPlaceholder: 'Choisissez une date de début',\n endLabel: 'Date de fin',\n endPlaceholder: 'Choisissez une date de fin',\n};\n\n// DateRangeWithValues\nexport const DateRangeWithValues = RangeTemplate.bind({});\nDateRangeWithValues.args = {\n rangeId: 'range-story-2',\n startLabel: 'Date de début',\n startPlaceholder: 'Choisissez une date de début',\n startValue: '2025-06-01',\n endLabel: 'Date de fin',\n endPlaceholder: 'Choisissez une date de fin',\n endValue: '2025-06-15',\n};\n"]}

package/dist/collection/stories/organisms/spw-footer/spw-footer.stories.js CHANGED Viewed

@@ -8,7 +8,7 @@ catch (error) {
 }
 import { withComponentControls, extractArgTypes, toKebabCase } from "../../../utils/utils";
 const elementTag = 'spw-footer';
-const subComponentTags = ['spw-footer-bottom', 'spw-footer-content'];
+const subComponentTags = ['spw-footer-bottom', 'spw-footer-content', 'spw-footer-content-col', 'spw-footer-link'];
 const argTypes = Object.assign(Object.assign({}, withComponentControls(componentsData, { tag: elementTag })), extractArgTypes(componentsData, subComponentTags));
 const meta = {
     title: 'Organismes/Pied de page (footer)',

package/dist/collection/stories/organisms/spw-footer/spw-footer.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"spw-footer.stories.js","sourceRoot":"","sources":["../../../../src/stories/organisms/spw-footer/spw-footer.stories.ts"],"names":[],"mappings":"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","sourcesContent":["let componentsData: any;\n\ntry {\n componentsData = require('../../../../dist/components_json.json');\n} catch (error) {\n console.warn('components_json.json non trouvé. Utilisation de valeurs par défaut.');\n componentsData = {};\n}\n\nimport { Meta, StoryFn } from '@storybook/web-components';\nimport { withComponentControls, extractArgTypes, toKebabCase } from '@utils/utils';\n\nconst elementTag = 'spw-footer';\n\nconst subComponentTags = ['spw-footer-bottom', 'spw-footer-content'];\n\nconst argTypes = {\n ...withComponentControls(componentsData, { tag: elementTag }),\n ...extractArgTypes(componentsData, subComponentTags),\n};\n\nconst meta: Meta = {\n title: 'Organismes/Pied de page (footer)',\n component: elementTag,\n argTypes,\n tags: ['autodocs'],\n parameters: {\n docs: {\n description: {\n component: `\n<strong class=\"mr-2\">Statut du composant :</strong> <spw-tag size=\"small\" variant=\"green\">Prêt</spw-tag>\n\nSection inférieure récurrente d'une page utilisée pour afficher des informations de contact, des liens importants et des crédits.\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/91a10d-pied-de-page-footer)\n `,\n },\n },\n },\n};\n\nexport default meta;\n\nfunction htmlContent(slotArgs) {\n return /* HTML / `\n <spw-footer-content>\n <spw-footer-content-col col-title=\"${slotArgs.colTitle1}\">\n <spw-footer-link href=\"https://www.wallonie.be/fr/demarches\">Démarches</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/jobs\">Jobs</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/actualites\">Actualités</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/agenda\">Agenda</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/acteurs-et-institutions\">Acteurs et institutions</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/appels-a-projets\">Appels à projets</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/demarches/se-renseigner-sur-la-charte-graphique-de-la-wallonie\">Charte graphique</spw-footer-link>\n </spw-footer-content-col>\n <spw-footer-content-col col-title=\"${slotArgs.colTitle2}\">\n <spw-footer-link href=\"https://www.wallonie.be/fr/\">Lien 1</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/\">Lien 2</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/\">Lien 3</spw-footer-link>\n </spw-footer-content-col>\n <spw-footer-content-col col-title=\"${slotArgs.colTitle3}\">\n <spw-footer-link href=\"https://spw.wallonie.be/\">Service public de Wallonie</spw-footer-link>\n <spw-footer-link href=\"https://www.parlement-wallonie.be/\">Parlement de Wallonie</spw-footer-link>\n <spw-footer-link href=\"https://geoportail.wallonie.be/\">Géoportail</spw-footer-link>\n <spw-footer-link href=\"http://developpementdurable.wallonie.be/\">Développement durable</spw-footer-link>\n <spw-footer-link href=\"https://wallex.wallonie.be/\">Wallex</spw-footer-link>\n <spw-footer-link href=\"https://marchespublics.wallonie.be/\">Marchés publics wallons</spw-footer-link>\n <spw-footer-link href=\"https://finances.wallonie.be/home/finances-wallonnes/budget-wallon.html\">Budget</spw-footer-link>\n <spw-footer-link href=\"https://cortex.wallonie.be/home.html\">Cortex</spw-footer-link>\n </spw-footer-content-col>\n <spw-footer-content-col col-title=\"${slotArgs.colTitle4}\">\n <spw-footer-link href=\"https://www.wallonie.be/formulaire-de-contact\">Formulaire de contact</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be//les-espaces-wallonie\">Espaces Wallonie</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/presse\">Presse</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/introduire-une-plainte-spw\">Introduire une plainte au SPW</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/signalement-dune-irregularite\">Signalement d'une irrégularité</spw-footer-link>\n </spw-footer-content-col>\n </spw-footer-content>\n <spw-footer-bottom site-title=\"${slotArgs.siteTitle}\">\n <spw-footer-link href=\"https://www.wallonie.be/fr/plan-du-site\">Plan du site</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/mentions-legales\">Mentions légales</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/vie-privee\">Vie privée</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/mediateur\">Médiateur</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/accessibilite\">Accessibilité</spw-footer-link>\n </spw-footer-bottom>\n `;\n}\n\nfunction htmlContentLight(slotArgs) {\n return / HTML */ `\n <spw-footer-bottom site-title=\"${slotArgs.siteTitle}\">\n <spw-footer-link href=\"https://www.wallonie.be/fr/plan-du-site\">Plan du site</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/mentions-legales\">Mentions légales</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/vie-privee\">Vie privée</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/mediateur\">Médiateur</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/accessibilite\">Accessibilité</spw-footer-link>\n </spw-footer-bottom>\n `;\n}\n\nconst Template: StoryFn = args => {\n const element = document.createElement(elementTag);\n\n const controls = withComponentControls(componentsData, { tag: elementTag }) \|\| {};\n const masterProps = controls.__realProps \|\| Object.keys(controls);\n\n Object.entries(args).forEach(([key, val]) => {\n if (masterProps.includes(key)) {\n element.setAttribute(toKebabCase(key), val as string);\n } else if (key.startsWith('on')) {\n element.addEventListener(key.substring(2).toLowerCase(), val);\n }\n });\n\n element.innerHTML = htmlContent(args);\n\n return element;\n};\n\nconst TemplateLight: StoryFn = args => {\n const element = document.createElement(elementTag);\n\n const controls = withComponentControls(componentsData, { tag: elementTag }) \|\| {};\n const masterProps = controls.__realProps \|\| Object.keys(controls);\n\n Object.entries(args).forEach(([key, val]) => {\n if (masterProps.includes(key)) {\n element.setAttribute(key, val);\n } else if (key.startsWith('on')) {\n element.addEventListener(key.substring(2).toLowerCase(), val);\n }\n });\n\n element.innerHTML = htmlContentLight(args);\n\n return element;\n};\n\nexport const Default = Template.bind({});\nDefault.args = {\n colTitle1: 'Accès rapides',\n colTitle2: 'Liens utiles',\n colTitle3: 'Sites généraux de Wallonie',\n colTitle4: 'Nous contacter',\n siteTitle: 'Titre du site',\n colsDesktop: 4,\n colsTablet: 2,\n colsMobile: 1,\n};\n\nexport const Light = TemplateLight.bind({});\nLight.args = {\n siteTitle: 'Titre du site',\n};\n"]}
1	+ {"version":3,"file":"spw-footer.stories.js","sourceRoot":"","sources":["../../../../src/stories/organisms/spw-footer/spw-footer.stories.ts"],"names":[],"mappings":"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","sourcesContent":["let componentsData: any;\n\ntry {\n componentsData = require('../../../../dist/components_json.json');\n} catch (error) {\n console.warn('components_json.json non trouvé. Utilisation de valeurs par défaut.');\n componentsData = {};\n}\n\nimport { Meta, StoryFn } from '@storybook/web-components';\nimport { withComponentControls, extractArgTypes, toKebabCase } from '@utils/utils';\n\nconst elementTag = 'spw-footer';\n\nconst subComponentTags = ['spw-footer-bottom', 'spw-footer-content', 'spw-footer-content-col', 'spw-footer-link'];\n\nconst argTypes = {\n ...withComponentControls(componentsData, { tag: elementTag }),\n ...extractArgTypes(componentsData, subComponentTags),\n};\n\nconst meta: Meta = {\n title: 'Organismes/Pied de page (footer)',\n component: elementTag,\n argTypes,\n tags: ['autodocs'],\n parameters: {\n docs: {\n description: {\n component: `\n<strong class=\"mr-2\">Statut du composant :</strong> <spw-tag size=\"small\" variant=\"green\">Prêt</spw-tag>\n\nSection inférieure récurrente d'une page utilisée pour afficher des informations de contact, des liens importants et des crédits.\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/91a10d-pied-de-page-footer)\n `,\n },\n },\n },\n};\n\nexport default meta;\n\nfunction htmlContent(slotArgs) {\n return /* HTML / `\n <spw-footer-content>\n <spw-footer-content-col col-title=\"${slotArgs.colTitle1}\">\n <spw-footer-link href=\"https://www.wallonie.be/fr/demarches\">Démarches</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/jobs\">Jobs</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/actualites\">Actualités</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/agenda\">Agenda</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/acteurs-et-institutions\">Acteurs et institutions</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/appels-a-projets\">Appels à projets</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/demarches/se-renseigner-sur-la-charte-graphique-de-la-wallonie\">Charte graphique</spw-footer-link>\n </spw-footer-content-col>\n <spw-footer-content-col col-title=\"${slotArgs.colTitle2}\">\n <spw-footer-link href=\"https://www.wallonie.be/fr/\">Lien 1</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/\">Lien 2</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/\">Lien 3</spw-footer-link>\n </spw-footer-content-col>\n <spw-footer-content-col col-title=\"${slotArgs.colTitle3}\">\n <spw-footer-link href=\"https://spw.wallonie.be/\">Service public de Wallonie</spw-footer-link>\n <spw-footer-link href=\"https://www.parlement-wallonie.be/\">Parlement de Wallonie</spw-footer-link>\n <spw-footer-link href=\"https://geoportail.wallonie.be/\">Géoportail</spw-footer-link>\n <spw-footer-link href=\"http://developpementdurable.wallonie.be/\">Développement durable</spw-footer-link>\n <spw-footer-link href=\"https://wallex.wallonie.be/\">Wallex</spw-footer-link>\n <spw-footer-link href=\"https://marchespublics.wallonie.be/\">Marchés publics wallons</spw-footer-link>\n <spw-footer-link href=\"https://finances.wallonie.be/home/finances-wallonnes/budget-wallon.html\">Budget</spw-footer-link>\n <spw-footer-link href=\"https://cortex.wallonie.be/home.html\">Cortex</spw-footer-link>\n </spw-footer-content-col>\n <spw-footer-content-col col-title=\"${slotArgs.colTitle4}\">\n <spw-footer-link href=\"https://www.wallonie.be/formulaire-de-contact\">Formulaire de contact</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be//les-espaces-wallonie\">Espaces Wallonie</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/presse\">Presse</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/introduire-une-plainte-spw\">Introduire une plainte au SPW</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/signalement-dune-irregularite\">Signalement d'une irrégularité</spw-footer-link>\n </spw-footer-content-col>\n </spw-footer-content>\n <spw-footer-bottom site-title=\"${slotArgs.siteTitle}\">\n <spw-footer-link href=\"https://www.wallonie.be/fr/plan-du-site\">Plan du site</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/mentions-legales\">Mentions légales</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/vie-privee\">Vie privée</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/mediateur\">Médiateur</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/accessibilite\">Accessibilité</spw-footer-link>\n </spw-footer-bottom>\n `;\n}\n\nfunction htmlContentLight(slotArgs) {\n return / HTML */ `\n <spw-footer-bottom site-title=\"${slotArgs.siteTitle}\">\n <spw-footer-link href=\"https://www.wallonie.be/fr/plan-du-site\">Plan du site</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/mentions-legales\">Mentions légales</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/vie-privee\">Vie privée</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/mediateur\">Médiateur</spw-footer-link>\n <spw-footer-link href=\"https://www.wallonie.be/fr/accessibilite\">Accessibilité</spw-footer-link>\n </spw-footer-bottom>\n `;\n}\n\nconst Template: StoryFn = args => {\n const element = document.createElement(elementTag);\n\n const controls = withComponentControls(componentsData, { tag: elementTag }) \|\| {};\n const masterProps = controls.__realProps \|\| Object.keys(controls);\n\n Object.entries(args).forEach(([key, val]) => {\n if (masterProps.includes(key)) {\n element.setAttribute(toKebabCase(key), val as string);\n } else if (key.startsWith('on')) {\n element.addEventListener(key.substring(2).toLowerCase(), val);\n }\n });\n\n element.innerHTML = htmlContent(args);\n\n return element;\n};\n\nconst TemplateLight: StoryFn = args => {\n const element = document.createElement(elementTag);\n\n const controls = withComponentControls(componentsData, { tag: elementTag }) \|\| {};\n const masterProps = controls.__realProps \|\| Object.keys(controls);\n\n Object.entries(args).forEach(([key, val]) => {\n if (masterProps.includes(key)) {\n element.setAttribute(key, val);\n } else if (key.startsWith('on')) {\n element.addEventListener(key.substring(2).toLowerCase(), val);\n }\n });\n\n element.innerHTML = htmlContentLight(args);\n\n return element;\n};\n\nexport const Default = Template.bind({});\nDefault.args = {\n colTitle1: 'Accès rapides',\n colTitle2: 'Liens utiles',\n colTitle3: 'Sites généraux de Wallonie',\n colTitle4: 'Nous contacter',\n siteTitle: 'Titre du site',\n colsDesktop: 4,\n colsTablet: 2,\n colsMobile: 1,\n};\n\nexport const Light = TemplateLight.bind({});\nLight.args = {\n siteTitle: 'Titre du site',\n};\n"]}

package/dist/collection/stories/organisms/spw-header/spw-header.stories.js CHANGED Viewed

@@ -19,7 +19,7 @@ const meta = {
         docs: {
             description: {
                 component: `
-<strong class="mr-2">Statut du composant :</strong> <spw-tag size="small" variant="orange">En cours</spw-tag>
+<strong class="mr-2">Statut du composant :</strong> <spw-tag size="small" variant="green">Prêt</spw-tag>
 Section supérieure d'une page, servant de conteneur pour les éléments de navigation et les informations importantes.

package/dist/collection/stories/organisms/spw-header/spw-header.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"spw-header.stories.js","sourceRoot":"","sources":["../../../../src/stories/organisms/spw-header/spw-header.stories.ts"],"names":[],"mappings":"AAAA,IAAI,cAAmB,CAAC;AAExB,IAAI,CAAC;IACH,cAAc,GAAG,OAAO,CAAC,uCAAuC,CAAC,CAAC;AACpE,CAAC;AAAC,OAAO,KAAK,EAAE,CAAC;IACf,OAAO,CAAC,IAAI,CAAC,qEAAqE,CAAC,CAAC;IACpF,cAAc,GAAG,EAAE,CAAC;AACtB,CAAC;AAGD,OAAO,EAAE,qBAAqB,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAEnF,MAAM,UAAU,GAAG,YAAY,CAAC;AAEhC,MAAM,gBAAgB,GAAG,CAAC,uBAAuB,EAAE,4BAA4B,CAAC,CAAC;AAEjF,MAAM,QAAQ,mCACT,qBAAqB,CAAC,cAAc,EAAE,EAAE,GAAG,EAAE,UAAU,EAAE,CAAC,GAC1D,eAAe,CAAC,cAAc,EAAE,gBAAgB,CAAC,CACrD,CAAC;AAEF,MAAM,IAAI,GAAS;IACjB,KAAK,EAAE,qCAAqC;IAC5C,SAAS,EAAE,UAAU;IACrB,QAAQ;IACR,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,SAAS,EAAE;;;;;;SAMV;aACF;SACF;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,SAAS,WAAW,CAAC,QAAQ;IAC3B,OAAO,UAAU,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+CA2C2B,QAAQ,CAAC,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2C7D,CAAC;AACJ,CAAC;AAED,MAAM,QAAQ,GAAY,IAAI,CAAC,EAAE;IAC/B,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IAEnD,MAAM,QAAQ,GAAG,qBAAqB,CAAC,cAAc,EAAE,EAAE,GAAG,EAAE,UAAU,EAAE,CAAC,IAAI,EAAE,CAAC;IAClF,MAAM,WAAW,GAAG,QAAQ,CAAC,WAAW,IAAI,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IAElE,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,EAAE,EAAE;QAC1C,IAAI,WAAW,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;YAC9B,OAAO,CAAC,YAAY,CAAC,WAAW,CAAC,GAAG,CAAC,EAAE,GAAa,CAAC,CAAC;QACxD,CAAC;aAAM,IAAI,GAAG,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC;YAChC,OAAO,CAAC,gBAAgB,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,EAAE,GAAG,CAAC,CAAC;QAChE,CAAC;IACH,CAAC,CAAC,CAAC;IAEH,OAAO,CAAC,SAAS,GAAG,WAAW,CAAC,IAAI,CAAC,CAAC;IAEtC,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,OAAO,CAAC,IAAI,GAAG;IACb,QAAQ,EAAE,KAAK;IACf,SAAS,EAAE,eAAe;IAC1B,WAAW,EAAE,uBAAuB;CACrC,CAAC","sourcesContent":["let componentsData: any;\n\ntry {\n componentsData = require('../../../../dist/components_json.json');\n} catch (error) {\n console.warn('components_json.json non trouvé. Utilisation de valeurs par défaut.');\n componentsData = {};\n}\n\nimport { Meta, StoryFn } from '@storybook/web-components';\nimport { withComponentControls, extractArgTypes, toKebabCase } from '@utils/utils';\n\nconst elementTag = 'spw-header';\n\nconst subComponentTags = ['spw-header-navigation', 'spw-header-navigation-item'];\n\nconst argTypes = {\n ...withComponentControls(componentsData, { tag: elementTag }),\n ...extractArgTypes(componentsData, subComponentTags),\n};\n\nconst meta: Meta = {\n title: 'Organismes/En-tête de site (header)',\n component: elementTag,\n argTypes,\n tags: ['autodocs'],\n parameters: {\n docs: {\n description: {\n component: `\n<strong class=\"mr-2\">Statut du composant :</strong> <spw-tag size=\"small\" variant=\"~~orange~~\">~~En cours~~</spw-tag>\n\nSection supérieure d'une page, servant de conteneur pour les éléments de navigation et les informations importantes.\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/78fef5-en-tete-de-site-header)\n `,\n },\n },\n },\n};\n\nexport default meta;\n\nfunction htmlContent(slotArgs) {\n return /* HTML */ `\n <div slot=\"top-left\">\n <spw-header-persona>\n <option data-link=\"#\" selected value=\"citoyen\">Citoyen</option>\n <option data-link=\"#\" value=\"entreprise\">Entreprise</option>\n <option data-link=\"#\" value=\"pouvoirs-locaux\">Pouvoirs locaux</option>\n <option data-link=\"#\" value=\"non-marchands\">Non-marchands</option>\n </spw-header-persona>\n </div>\n\n <div slot=\"right\">\n <spw-header-lang>\n <option data-link=\"#\" selected value=\"fr\">Fr</option>\n <option data-link=\"#\" value=\"nl\">Nl</option>\n <option data-link=\"#\" value=\"en\">En</option>\n <option data-link=\"#\" value=\"de\">De</option>\n </spw-header-lang>\n </div>\n\n <div slot=\"search\">\n <spw-search-field\n class=\"mb-4\"\n size=\"medium\"\n name=\"search\"\n items='[\n {\"url\": \"http://google.com\", \"label\": \"Banane\"},\n {\"label\": \"Pomme\"},\n {\"label\": \"Poire\"},\n {\"label\": \"Cerise\"},\n {\"label\": \"Raisin\"}\n ]'\n placeholder=\"Exemple : un mot-clé...\"\n ></spw-search-field>\n <h2 class=\"spw-ds-typography-heading-04 mb-4\">Suggestions de pages :</h2>\n <spw-group orientation=\"vertical\">\n <spw-link variant=\"tertiary\">Démarches</spw-link>\n <spw-link variant=\"tertiary\">Réforme primes énergie</spw-link>\n <spw-link variant=\"tertiary\">Jobs</spw-link>\n <spw-link variant=\"tertiary\">Trafiroutes</spw-link>\n </spw-group>\n </div>\n\n <spw-header-navigation>\n <spw-header-navigation-item is-active=\"${slotArgs.isActive}\">\n <a href=\"#\">Rubrique 1</a>\n\n <spw-header-navigation-dropdown>\n <spw-header-navigation-item>\n <a href=\"#\">Sous-rubrique niveau 2</a>\n <spw-header-navigation-dropdown>\n <spw-header-navigation-item>\n <a href=\"#\">Sous-rubrique niveau 3</a>\n </spw-header-navigation-item>\n <spw-header-navigation-item>\n <a href=\"#\">Sous-rubrique niveau 3</a>\n </spw-header-navigation-item>\n </spw-header-navigation-dropdown>\n </spw-header-navigation-item>\n <spw-header-navigation-item>\n <a href=\"#\">Sous-rubrique</a>\n </spw-header-navigation-item>\n <spw-header-navigation-item>\n <a href=\"#\">Sous-rubrique</a>\n </spw-header-navigation-item>\n <spw-header-navigation-item>\n <a href=\"#\">Sous-rubrique</a>\n </spw-header-navigation-item>\n </spw-header-navigation-dropdown>\n </spw-header-navigation-item>\n\n <spw-header-navigation-item>\n <a href=\"#\">Rubrique 2</a>\n </spw-header-navigation-item>\n <spw-header-navigation-item>\n <a href=\"#\">Rubrique 3</a>\n </spw-header-navigation-item>\n <spw-header-navigation-item>\n <a href=\"#\">Rubrique 4</a>\n </spw-header-navigation-item>\n <spw-header-navigation-item>\n <a href=\"#\">Rubrique 5</a>\n </spw-header-navigation-item>\n <spw-header-navigation-item>\n <a href=\"#\">Rubrique 6</a>\n </spw-header-navigation-item>\n </spw-header-navigation>\n `;\n}\n\nconst Template: StoryFn = args => {\n const element = document.createElement(elementTag);\n\n const controls = withComponentControls(componentsData, { tag: elementTag }) \|\| {};\n const masterProps = controls.__realProps \|\| Object.keys(controls);\n\n Object.entries(args).forEach(([key, val]) => {\n if (masterProps.includes(key)) {\n element.setAttribute(toKebabCase(key), val as string);\n } else if (key.startsWith('on')) {\n element.addEventListener(key.substring(2).toLowerCase(), val);\n }\n });\n\n element.innerHTML = htmlContent(args);\n\n return element;\n};\n\nexport const Default = Template.bind({});\nDefault.args = {\n isActive: false,\n siteTitle: 'Titre du site',\n borderColor: 'var(--spw-ds-primary)',\n};\n"]}
1	+ {"version":3,"file":"spw-header.stories.js","sourceRoot":"","sources":["../../../../src/stories/organisms/spw-header/spw-header.stories.ts"],"names":[],"mappings":"AAAA,IAAI,cAAmB,CAAC;AAExB,IAAI,CAAC;IACH,cAAc,GAAG,OAAO,CAAC,uCAAuC,CAAC,CAAC;AACpE,CAAC;AAAC,OAAO,KAAK,EAAE,CAAC;IACf,OAAO,CAAC,IAAI,CAAC,qEAAqE,CAAC,CAAC;IACpF,cAAc,GAAG,EAAE,CAAC;AACtB,CAAC;AAGD,OAAO,EAAE,qBAAqB,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAEnF,MAAM,UAAU,GAAG,YAAY,CAAC;AAEhC,MAAM,gBAAgB,GAAG,CAAC,uBAAuB,EAAE,4BAA4B,CAAC,CAAC;AAEjF,MAAM,QAAQ,mCACT,qBAAqB,CAAC,cAAc,EAAE,EAAE,GAAG,EAAE,UAAU,EAAE,CAAC,GAC1D,eAAe,CAAC,cAAc,EAAE,gBAAgB,CAAC,CACrD,CAAC;AAEF,MAAM,IAAI,GAAS;IACjB,KAAK,EAAE,qCAAqC;IAC5C,SAAS,EAAE,UAAU;IACrB,QAAQ;IACR,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,SAAS,EAAE;;;;;;SAMV;aACF;SACF;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,SAAS,WAAW,CAAC,QAAQ;IAC3B,OAAO,UAAU,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+CA2C2B,QAAQ,CAAC,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2C7D,CAAC;AACJ,CAAC;AAED,MAAM,QAAQ,GAAY,IAAI,CAAC,EAAE;IAC/B,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IAEnD,MAAM,QAAQ,GAAG,qBAAqB,CAAC,cAAc,EAAE,EAAE,GAAG,EAAE,UAAU,EAAE,CAAC,IAAI,EAAE,CAAC;IAClF,MAAM,WAAW,GAAG,QAAQ,CAAC,WAAW,IAAI,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IAElE,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,EAAE,EAAE;QAC1C,IAAI,WAAW,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;YAC9B,OAAO,CAAC,YAAY,CAAC,WAAW,CAAC,GAAG,CAAC,EAAE,GAAa,CAAC,CAAC;QACxD,CAAC;aAAM,IAAI,GAAG,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC;YAChC,OAAO,CAAC,gBAAgB,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,EAAE,GAAG,CAAC,CAAC;QAChE,CAAC;IACH,CAAC,CAAC,CAAC;IAEH,OAAO,CAAC,SAAS,GAAG,WAAW,CAAC,IAAI,CAAC,CAAC;IAEtC,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,OAAO,CAAC,IAAI,GAAG;IACb,QAAQ,EAAE,KAAK;IACf,SAAS,EAAE,eAAe;IAC1B,WAAW,EAAE,uBAAuB;CACrC,CAAC","sourcesContent":["let componentsData: any;\n\ntry {\n componentsData = require('../../../../dist/components_json.json');\n} catch (error) {\n console.warn('components_json.json non trouvé. Utilisation de valeurs par défaut.');\n componentsData = {};\n}\n\nimport { Meta, StoryFn } from '@storybook/web-components';\nimport { withComponentControls, extractArgTypes, toKebabCase } from '@utils/utils';\n\nconst elementTag = 'spw-header';\n\nconst subComponentTags = ['spw-header-navigation', 'spw-header-navigation-item'];\n\nconst argTypes = {\n ...withComponentControls(componentsData, { tag: elementTag }),\n ...extractArgTypes(componentsData, subComponentTags),\n};\n\nconst meta: Meta = {\n title: 'Organismes/En-tête de site (header)',\n component: elementTag,\n argTypes,\n tags: ['autodocs'],\n parameters: {\n docs: {\n description: {\n component: `\n<strong class=\"mr-2\">Statut du composant :</strong> <spw-tag size=\"small\" variant=\"green\">Prêt</spw-tag>\n\nSection supérieure d'une page, servant de conteneur pour les éléments de navigation et les informations importantes.\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/78fef5-en-tete-de-site-header)\n `,\n },\n },\n },\n};\n\nexport default meta;\n\nfunction htmlContent(slotArgs) {\n return /* HTML */ `\n <div slot=\"top-left\">\n <spw-header-persona>\n <option data-link=\"#\" selected value=\"citoyen\">Citoyen</option>\n <option data-link=\"#\" value=\"entreprise\">Entreprise</option>\n <option data-link=\"#\" value=\"pouvoirs-locaux\">Pouvoirs locaux</option>\n <option data-link=\"#\" value=\"non-marchands\">Non-marchands</option>\n </spw-header-persona>\n </div>\n\n <div slot=\"right\">\n <spw-header-lang>\n <option data-link=\"#\" selected value=\"fr\">Fr</option>\n <option data-link=\"#\" value=\"nl\">Nl</option>\n <option data-link=\"#\" value=\"en\">En</option>\n <option data-link=\"#\" value=\"de\">De</option>\n </spw-header-lang>\n </div>\n\n <div slot=\"search\">\n <spw-search-field\n class=\"mb-4\"\n size=\"medium\"\n name=\"search\"\n items='[\n {\"url\": \"http://google.com\", \"label\": \"Banane\"},\n {\"label\": \"Pomme\"},\n {\"label\": \"Poire\"},\n {\"label\": \"Cerise\"},\n {\"label\": \"Raisin\"}\n ]'\n placeholder=\"Exemple : un mot-clé...\"\n ></spw-search-field>\n <h2 class=\"spw-ds-typography-heading-04 mb-4\">Suggestions de pages :</h2>\n <spw-group orientation=\"vertical\">\n <spw-link variant=\"tertiary\">Démarches</spw-link>\n <spw-link variant=\"tertiary\">Réforme primes énergie</spw-link>\n <spw-link variant=\"tertiary\">Jobs</spw-link>\n <spw-link variant=\"tertiary\">Trafiroutes</spw-link>\n </spw-group>\n </div>\n\n <spw-header-navigation>\n <spw-header-navigation-item is-active=\"${slotArgs.isActive}\">\n <a href=\"#\">Rubrique 1</a>\n\n <spw-header-navigation-dropdown>\n <spw-header-navigation-item>\n <a href=\"#\">Sous-rubrique niveau 2</a>\n <spw-header-navigation-dropdown>\n <spw-header-navigation-item>\n <a href=\"#\">Sous-rubrique niveau 3</a>\n </spw-header-navigation-item>\n <spw-header-navigation-item>\n <a href=\"#\">Sous-rubrique niveau 3</a>\n </spw-header-navigation-item>\n </spw-header-navigation-dropdown>\n </spw-header-navigation-item>\n <spw-header-navigation-item>\n <a href=\"#\">Sous-rubrique</a>\n </spw-header-navigation-item>\n <spw-header-navigation-item>\n <a href=\"#\">Sous-rubrique</a>\n </spw-header-navigation-item>\n <spw-header-navigation-item>\n <a href=\"#\">Sous-rubrique</a>\n </spw-header-navigation-item>\n </spw-header-navigation-dropdown>\n </spw-header-navigation-item>\n\n <spw-header-navigation-item>\n <a href=\"#\">Rubrique 2</a>\n </spw-header-navigation-item>\n <spw-header-navigation-item>\n <a href=\"#\">Rubrique 3</a>\n </spw-header-navigation-item>\n <spw-header-navigation-item>\n <a href=\"#\">Rubrique 4</a>\n </spw-header-navigation-item>\n <spw-header-navigation-item>\n <a href=\"#\">Rubrique 5</a>\n </spw-header-navigation-item>\n <spw-header-navigation-item>\n <a href=\"#\">Rubrique 6</a>\n </spw-header-navigation-item>\n </spw-header-navigation>\n `;\n}\n\nconst Template: StoryFn = args => {\n const element = document.createElement(elementTag);\n\n const controls = withComponentControls(componentsData, { tag: elementTag }) \|\| {};\n const masterProps = controls.__realProps \|\| Object.keys(controls);\n\n Object.entries(args).forEach(([key, val]) => {\n if (masterProps.includes(key)) {\n element.setAttribute(toKebabCase(key), val as string);\n } else if (key.startsWith('on')) {\n element.addEventListener(key.substring(2).toLowerCase(), val);\n }\n });\n\n element.innerHTML = htmlContent(args);\n\n return element;\n};\n\nexport const Default = Template.bind({});\nDefault.args = {\n isActive: false,\n siteTitle: 'Titre du site',\n borderColor: 'var(--spw-ds-primary)',\n};\n"]}

package/dist/collection/stories/organisms/spw-table/spw-table.stories.js CHANGED Viewed

@@ -310,4 +310,123 @@ CompactTable.args = {
     </spw-table-body>
   `,
 };
+export const LoadingWithSkeleton = Template.bind({});
+LoadingWithSkeleton.args = {
+    isZebra: true,
+    innerHTML: `
+    <spw-table-head>
+      <spw-table-row>
+        <spw-table-header width="20" scope="col">
+          <spw-checkbox></spw-checkbox>
+        </spw-table-header>
+        <spw-table-header column-id="name" sortable scope="col">Nom</spw-table-header>
+        <spw-table-header column-id="age" sortable scope="col">Âge</spw-table-header>
+        <spw-table-header column-id="status" scope="col">Statut</spw-table-header>
+        <spw-table-header text-align="center" scope="col">Actions</spw-table-header>
+      </spw-table-row>
+    </spw-table-head>
+    <spw-table-body>
+      <spw-table-row>
+        <spw-table-cell width="20">
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+        <spw-table-cell>
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+        <spw-table-cell>
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+        <spw-table-cell width="40">
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+        <spw-table-cell padding="small" width="10">
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+      </spw-table-row>
+      <spw-table-row>
+        <spw-table-cell width="20">
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+        <spw-table-cell>
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+        <spw-table-cell>
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+        <spw-table-cell width="40">
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+        <spw-table-cell padding="small" width="10">
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+      </spw-table-row>
+      <spw-table-row>
+        <spw-table-cell width="20">
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+        <spw-table-cell>
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+        <spw-table-cell>
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+        <spw-table-cell width="40">
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+        <spw-table-cell padding="small" width="10">
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+      </spw-table-row>
+      <spw-table-row>
+        <spw-table-cell width="20">
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+        <spw-table-cell>
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+        <spw-table-cell>
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+        <spw-table-cell width="40">
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+        <spw-table-cell padding="small" width="10">
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+      </spw-table-row>
+      <spw-table-row>
+        <spw-table-cell width="20">
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+        <spw-table-cell>
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+        <spw-table-cell>
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+        <spw-table-cell width="40">
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+        <spw-table-cell padding="small" width="10">
+          <spw-skeleton lines="1"></spw-skeleton>
+        </spw-table-cell>
+      </spw-table-row>
+    </spw-table-body>
+    <spw-table-footer>
+      <div slot="left">Chargement en cours...</div>
+      <div slot="center">
+        <spw-pagination class="spw-pagination" variant="numbers" total-items="30" items-per-page="10"></spw-pagination>
+      </div>
+      <div slot="right">
+        <spw-select placeholder="N°" name="mon-select-natif" size="medium">
+          <option selected value="10">10</option>
+          <option value="20">20</option>
+          <option value="30">30</option>
+          <option value="40">40</option>
+        </spw-select>
+        éléments par page
+      </div>
+    </spw-table-footer>
+  `,
+};
 //# sourceMappingURL=spw-table.stories.js.map

package/dist/collection/stories/organisms/spw-table/spw-table.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"spw-table.stories.js","sourceRoot":"","sources":["../../../../src/stories/organisms/spw-table/spw-table.stories.ts"],"names":[],"mappings":"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","sourcesContent":["import { Meta, StoryFn } from '@storybook/web-components';\nimport { withComponentControls, extractArgTypes } from '@utils/utils';\n\nlet componentsData: any;\n\ntry {\n componentsData = require('../../../../dist/components_json.json');\n} catch (error) {\n console.warn('components_json.json non trouvé. Utilisation de valeurs par défaut.');\n componentsData = {};\n}\n\nconst elementTag = 'spw-table';\n\nconst subComponentTags = ['spw-table-body', 'spw-table-cell', 'spw-table-footer', 'spw-table-header', 'spw-table-head', 'spw-table-row'];\n\nconst argTypes = {\n ...withComponentControls(componentsData, { tag: elementTag }),\n ...extractArgTypes(componentsData, subComponentTags),\n innerHTML: { table: { disable: true } },\n};\n\nconst meta: Meta = {\n title: 'Organismes/Tableau',\n component: elementTag,\n argTypes,\n tags: ['autodocs'],\n parameters: {\n docs: {\n description: {\n component: `\n<strong class=\"mr-2\">Statut du composant :</strong> <spw-tag size=\"small\" variant=\"green\">Prêt</spw-tag>\n\nAffiche toutes les informations d’un ensemble de données.\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/90a77b-tableau)\n `,\n },\n },\n },\n};\n\nexport default meta;\n\nfunction camelToKebab(str: string) {\n return str.replace(/[A-Z]/g, match => `-${match.toLowerCase()}`);\n}\n\nconst Template: StoryFn = args => {\n const element = document.createElement(elementTag);\n const controls = withComponentControls(componentsData, { tag: elementTag }) \|\| {};\n const masterProps = controls.__realProps \|\| Object.keys(controls);\n\n Object.entries(args).forEach(([key, val]) => {\n if (masterProps.includes(key)) {\n const kebabKey = camelToKebab(key);\n element.setAttribute(kebabKey, val);\n } else if (key.startsWith('on')) {\n element.addEventListener(key.substring(2).toLowerCase(), val);\n }\n });\n\n element.innerHTML = args.innerHTML \|\| '';\n return element;\n};\n\nexport const Base: StoryFn = Template.bind({});\nBase.args = {\n innerHTML: `\n <spw-table-head>\n <spw-table-row>\n <spw-table-header scope=\"col\">Header 1</spw-table-header>\n <spw-table-header scope=\"col\">Header 2</spw-table-header>\n <spw-table-header scope=\"col\">Header 3</spw-table-header>\n <spw-table-header scope=\"col\">Header 4</spw-table-header>\n </spw-table-row>\n </spw-table-head>\n <spw-table-body>\n <spw-table-row>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n </spw-table-row>\n </spw-table-body>\n `,\n};\n\nexport const StickyTableWithMaxHeight: StoryFn = Template.bind({});\nStickyTableWithMaxHeight.args = {\n maxHeight: '225',\n minWidth: '800',\n isSticky: true,\n innerHTML: Base.args.innerHTML,\n};\n\nexport const ZebraTableWithSorting: StoryFn = Template.bind({});\nZebraTableWithSorting.args = {\n isZebra: true,\n innerHTML: `\n <spw-table-head>\n <spw-table-row>\n <spw-table-header column-id=\"name\" sortable scope=\"col\">Nom</spw-table-header>\n <spw-table-header column-id=\"age\" sortable scope=\"col\">Âge</spw-table-header>\n <spw-table-header column-id=\"city\" sortable scope=\"col\">Ville</spw-table-header>\n </spw-table-row>\n </spw-table-head>\n <spw-table-body>\n <spw-table-row>\n <spw-table-cell>Zoé</spw-table-cell>\n <spw-table-cell>28</spw-table-cell>\n <spw-table-cell>Charleroi</spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell>Arthur</spw-table-cell>\n <spw-table-cell>35</spw-table-cell>\n <spw-table-cell>Namur</spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell>Micheline</spw-table-cell>\n <spw-table-cell>17</spw-table-cell>\n <spw-table-cell>Liège</spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell>André</spw-table-cell>\n <spw-table-cell>84</spw-table-cell>\n <spw-table-cell>Tournai</spw-table-cell>\n </spw-table-row>\n </spw-table-body>\n `,\n};\n\nexport const TableWithActionsAndTags: StoryFn = Template.bind({});\nTableWithActionsAndTags.args = {\n isZebra: true,\n innerHTML: `\n <spw-table-head>\n <spw-table-row>\n <spw-table-header width=\"20\" scope=\"col\">\n <spw-checkbox></spw-checkbox>\n </spw-table-header>\n <spw-table-header tooltip-title=\"Information\" tooltip-text=\"Ceci est une phrase d'exemple\" column-id=\"name\" sortable scope=\"col\">\n Nom\n <spw-dropdown slot=\"filters\" content-width=\"360\" direction=\"bottom\">\n <spw-icon icon=\"fa-filter\">\n <div slot=\"dropdownContent\">\n <h3 class=\"spw-ds-typography-heading-03\">Filtrer la colonne nom</h3>\n <form>\n <spw-text-field\n required\n size=\"small\"\n max-length=\"100\"\n min-length=\"3\"\n label=\"Champ texte\"\n type=\"text\"\n placeholder=\"Entrez un texte\"\n name=\"firstname\"\n class=\"mb-2\"\n ></spw-text-field>\n <spw-custom-select\n label=\"Mon label\"\n placeholder=\"Sélectionnez une option\"\n name=\"mon-super-select\"\n required=\"true\"\n multiple=\"true\"\n id=\"mon-custom-select-dynamique\"\n is-search=\"true\"\n class=\"mb-3\"\n ></spw-custom-select>\n <spw-group label=\"Des choix horizontaux\" required=\"true\" type=\"radios\" orientation=\"horizontal\">\n <spw-radio name=\"radio1\" value=\"option1\">Un input radio</spw-radio>\n <spw-radio name=\"radio1\" value=\"option2\">Un input radio</spw-radio>\n </spw-group>\n </form>\n <spw-group orientation=\"vertical\" is-full-width>\n <spw-button class=\"mt-3\" is-full-width variant=\"primary\" size=\"small\">Appliquer</spw-button>\n </spw-group>\n </div>\n </spw-icon>\n </spw-dropdown>\n </spw-table-header>\n <spw-table-header column-id=\"age\" sortable scope=\"col\">Âge</spw-table-header>\n <spw-table-header column-id=\"status\" sortable scope=\"col\">Statut</spw-table-header>\n <spw-table-header text-align=\"center\" scope=\"col\">Actions</spw-table-header>\n </spw-table-row>\n </spw-table-head>\n <spw-table-body>\n <spw-table-row>\n <spw-table-cell width=\"20\"><spw-checkbox></spw-checkbox></spw-table-cell>\n <spw-table-cell>Zoé</spw-table-cell>\n <spw-table-cell>28</spw-table-cell>\n <spw-table-cell width=\"40\"><spw-tag size=\"small\" variant=\"green\">Validé</spw-tag></spw-table-cell>\n <spw-table-cell padding=\"small\" width=\"10\">\n <div class=\"d-flex\">\n <spw-button size=\"small\" variant=\"secondary\" icon=\"fa-trash\" is-icon-only=\"true\" class=\"mx-1\"></spw-button>\n <spw-button size=\"small\" variant=\"secondary\" icon=\"fa-edit\" is-icon-only=\"true\" class=\"mx-1\"></spw-button>\n <spw-dropdown direction=\"left\">\n <spw-button icon=\"fa-ellipsis-vertical\" is-icon-only=\"true\" size=\"small\" variant=\"secondary\" class=\"mx-1\">\n <div slot=\"dropdownContent\">\n <spw-group orientation=\"vertical\" is-full-width>\n <spw-button is-full-width variant=\"secondary\" size=\"small\">Modifier</spw-button>\n <spw-button is-full-width variant=\"secondary\" size=\"small\">Supprimer</spw-button>\n </spw-group>\n </div>\n </spw-button>\n </spw-dropdown>\n </div>\n </spw-table-cell>\n </spw-table-row>\n <spw-table-row state=\"disabled\">\n <spw-table-cell width=\"20\"><spw-checkbox disabled=\"true\"></spw-checkbox></spw-table-cell>\n <spw-table-cell>Marie</spw-table-cell>\n <spw-table-cell>22</spw-table-cell>\n <spw-table-cell width=\"40\"><spw-tag size=\"small\" variant=\"green\">Validé</spw-tag></spw-table-cell>\n <spw-table-cell padding=\"small\" width=\"10\">\n <div class=\"d-flex\">\n <spw-button size=\"small\" variant=\"secondary\" icon=\"fa-trash\" is-icon-only=\"true\" class=\"mx-1\"></spw-button>\n <spw-button size=\"small\" variant=\"secondary\" icon=\"fa-edit\" is-icon-only=\"true\" class=\"mx-1\"></spw-button>\n <spw-dropdown direction=\"left\">\n <spw-button icon=\"fa-ellipsis-vertical\" is-icon-only=\"true\" size=\"small\" variant=\"secondary\" class=\"mx-1\">\n <div slot=\"dropdownContent\">\n <spw-group orientation=\"vertical\" is-full-width>\n <spw-button is-full-width variant=\"secondary\" size=\"small\">Modifier</spw-button>\n <spw-button is-full-width variant=\"secondary\" size=\"small\">Supprimer</spw-button>\n </spw-group>\n </div>\n </spw-button>\n </spw-dropdown>\n </div>\n </spw-table-cell>\n </spw-table-row>\n <spw-table-row state=\"selected\">\n <spw-table-cell width=\"20\"><spw-checkbox checked=\"true\"></spw-checkbox></spw-table-cell>\n <spw-table-cell>Thomas</spw-table-cell>\n <spw-table-cell>37</spw-table-cell>\n <spw-table-cell width=\"40\"><spw-tag size=\"small\" variant=\"green\">Validé</spw-tag></spw-table-cell>\n <spw-table-cell padding=\"small\" width=\"10\">\n <div class=\"d-flex\">\n <spw-button size=\"small\" variant=\"secondary\" icon=\"fa-trash\" is-icon-only=\"true\" class=\"mx-1\"></spw-button>\n <spw-button size=\"small\" variant=\"secondary\" icon=\"fa-edit\" is-icon-only=\"true\" class=\"mx-1\"></spw-button>\n <spw-dropdown direction=\"left\">\n <spw-button icon=\"fa-ellipsis-vertical\" is-icon-only=\"true\" size=\"small\" variant=\"secondary\" class=\"mx-1\">\n <div slot=\"dropdownContent\">\n <spw-group orientation=\"vertical\" is-full-width>\n <spw-button is-full-width variant=\"secondary\" size=\"small\">Modifier</spw-button>\n <spw-button is-full-width variant=\"secondary\" size=\"small\">Supprimer</spw-button>\n </spw-group>\n </div>\n </spw-button>\n </spw-dropdown>\n </div>\n </spw-table-cell>\n </spw-table-row>\n </spw-table-body>\n <spw-table-footer>\n <div slot=\"left\">1-10 sur 9999 éléments</div>\n <div slot=\"center\">\n <spw-pagination class=\"spw-pagination\" variant=\"numbers\" total-items=\"30\" items-per-page=\"10\"></spw-pagination>\n </div>\n <div slot=\"right\">\n <spw-select placeholder=\"N°\" name=\"mon-select-natif\" size=\"medium\">\n <option selected value=\"10\">10</option>\n <option value=\"20\">20</option>\n <option value=\"30\">30</option>\n <option value=\"40\">40</option>\n </spw-select>\n éléments par page\n </div>\n </spw-table-footer>\n `,\n};\n\nexport const CompactTable: StoryFn = Template.bind({});\nCompactTable.args = {\n isZebra: true,\n innerHTML: `\n <spw-table-head>\n <spw-table-row>\n <spw-table-header padding=\"small\" column-id=\"name\" sortable scope=\"col\">Nom</spw-table-header>\n <spw-table-header padding=\"small\" column-id=\"age\" sortable scope=\"col\">Âge</spw-table-header>\n <spw-table-header padding=\"small\" column-id=\"city\" sortable scope=\"col\">Ville</spw-table-header>\n </spw-table-row>\n </spw-table-head>\n <spw-table-body>\n <spw-table-row>\n <spw-table-cell padding=\"small\">Zoé</spw-table-cell>\n <spw-table-cell padding=\"small\">28</spw-table-cell>\n <spw-table-cell padding=\"small\">Charleroi</spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell padding=\"small\">Arthur</spw-table-cell>\n <spw-table-cell padding=\"small\">35</spw-table-cell>\n <spw-table-cell padding=\"small\">Namur</spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell padding=\"small\">Micheline</spw-table-cell>\n <spw-table-cell padding=\"small\">17</spw-table-cell>\n <spw-table-cell padding=\"small\">Liège</spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell padding=\"small\">André</spw-table-cell>\n <spw-table-cell padding=\"small\">84</spw-table-cell>\n <spw-table-cell padding=\"small\">Tournai</spw-table-cell>\n </spw-table-row>\n </spw-table-body>\n `,\n};\n"]}
1	+ {"version":3,"file":"spw-table.stories.js","sourceRoot":"","sources":["../../../../src/stories/organisms/spw-table/spw-table.stories.ts"],"names":[],"mappings":"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","sourcesContent":["import { Meta, StoryFn } from '@storybook/web-components';\nimport { withComponentControls, extractArgTypes } from '@utils/utils';\n\nlet componentsData: any;\n\ntry {\n componentsData = require('../../../../dist/components_json.json');\n} catch (error) {\n console.warn('components_json.json non trouvé. Utilisation de valeurs par défaut.');\n componentsData = {};\n}\n\nconst elementTag = 'spw-table';\n\nconst subComponentTags = ['spw-table-body', 'spw-table-cell', 'spw-table-footer', 'spw-table-header', 'spw-table-head', 'spw-table-row'];\n\nconst argTypes = {\n ...withComponentControls(componentsData, { tag: elementTag }),\n ...extractArgTypes(componentsData, subComponentTags),\n innerHTML: { table: { disable: true } },\n};\n\nconst meta: Meta = {\n title: 'Organismes/Tableau',\n component: elementTag,\n argTypes,\n tags: ['autodocs'],\n parameters: {\n docs: {\n description: {\n component: `\n<strong class=\"mr-2\">Statut du composant :</strong> <spw-tag size=\"small\" variant=\"green\">Prêt</spw-tag>\n\nAffiche toutes les informations d’un ensemble de données.\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/90a77b-tableau)\n `,\n },\n },\n },\n};\n\nexport default meta;\n\nfunction camelToKebab(str: string) {\n return str.replace(/[A-Z]/g, match => `-${match.toLowerCase()}`);\n}\n\nconst Template: StoryFn = args => {\n const element = document.createElement(elementTag);\n const controls = withComponentControls(componentsData, { tag: elementTag }) \|\| {};\n const masterProps = controls.__realProps \|\| Object.keys(controls);\n\n Object.entries(args).forEach(([key, val]) => {\n if (masterProps.includes(key)) {\n const kebabKey = camelToKebab(key);\n element.setAttribute(kebabKey, val);\n } else if (key.startsWith('on')) {\n element.addEventListener(key.substring(2).toLowerCase(), val);\n }\n });\n\n element.innerHTML = args.innerHTML \|\| '';\n return element;\n};\n\nexport const Base: StoryFn = Template.bind({});\nBase.args = {\n innerHTML: `\n <spw-table-head>\n <spw-table-row>\n <spw-table-header scope=\"col\">Header 1</spw-table-header>\n <spw-table-header scope=\"col\">Header 2</spw-table-header>\n <spw-table-header scope=\"col\">Header 3</spw-table-header>\n <spw-table-header scope=\"col\">Header 4</spw-table-header>\n </spw-table-row>\n </spw-table-head>\n <spw-table-body>\n <spw-table-row>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n <spw-table-cell>Cellule</spw-table-cell>\n </spw-table-row>\n </spw-table-body>\n `,\n};\n\nexport const StickyTableWithMaxHeight: StoryFn = Template.bind({});\nStickyTableWithMaxHeight.args = {\n maxHeight: '225',\n minWidth: '800',\n isSticky: true,\n innerHTML: Base.args.innerHTML,\n};\n\nexport const ZebraTableWithSorting: StoryFn = Template.bind({});\nZebraTableWithSorting.args = {\n isZebra: true,\n innerHTML: `\n <spw-table-head>\n <spw-table-row>\n <spw-table-header column-id=\"name\" sortable scope=\"col\">Nom</spw-table-header>\n <spw-table-header column-id=\"age\" sortable scope=\"col\">Âge</spw-table-header>\n <spw-table-header column-id=\"city\" sortable scope=\"col\">Ville</spw-table-header>\n </spw-table-row>\n </spw-table-head>\n <spw-table-body>\n <spw-table-row>\n <spw-table-cell>Zoé</spw-table-cell>\n <spw-table-cell>28</spw-table-cell>\n <spw-table-cell>Charleroi</spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell>Arthur</spw-table-cell>\n <spw-table-cell>35</spw-table-cell>\n <spw-table-cell>Namur</spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell>Micheline</spw-table-cell>\n <spw-table-cell>17</spw-table-cell>\n <spw-table-cell>Liège</spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell>André</spw-table-cell>\n <spw-table-cell>84</spw-table-cell>\n <spw-table-cell>Tournai</spw-table-cell>\n </spw-table-row>\n </spw-table-body>\n `,\n};\n\nexport const TableWithActionsAndTags: StoryFn = Template.bind({});\nTableWithActionsAndTags.args = {\n isZebra: true,\n innerHTML: `\n <spw-table-head>\n <spw-table-row>\n <spw-table-header width=\"20\" scope=\"col\">\n <spw-checkbox></spw-checkbox>\n </spw-table-header>\n <spw-table-header tooltip-title=\"Information\" tooltip-text=\"Ceci est une phrase d'exemple\" column-id=\"name\" sortable scope=\"col\">\n Nom\n <spw-dropdown slot=\"filters\" content-width=\"360\" direction=\"bottom\">\n <spw-icon icon=\"fa-filter\">\n <div slot=\"dropdownContent\">\n <h3 class=\"spw-ds-typography-heading-03\">Filtrer la colonne nom</h3>\n <form>\n <spw-text-field\n required\n size=\"small\"\n max-length=\"100\"\n min-length=\"3\"\n label=\"Champ texte\"\n type=\"text\"\n placeholder=\"Entrez un texte\"\n name=\"firstname\"\n class=\"mb-2\"\n ></spw-text-field>\n <spw-custom-select\n label=\"Mon label\"\n placeholder=\"Sélectionnez une option\"\n name=\"mon-super-select\"\n required=\"true\"\n multiple=\"true\"\n id=\"mon-custom-select-dynamique\"\n is-search=\"true\"\n class=\"mb-3\"\n ></spw-custom-select>\n <spw-group label=\"Des choix horizontaux\" required=\"true\" type=\"radios\" orientation=\"horizontal\">\n <spw-radio name=\"radio1\" value=\"option1\">Un input radio</spw-radio>\n <spw-radio name=\"radio1\" value=\"option2\">Un input radio</spw-radio>\n </spw-group>\n </form>\n <spw-group orientation=\"vertical\" is-full-width>\n <spw-button class=\"mt-3\" is-full-width variant=\"primary\" size=\"small\">Appliquer</spw-button>\n </spw-group>\n </div>\n </spw-icon>\n </spw-dropdown>\n </spw-table-header>\n <spw-table-header column-id=\"age\" sortable scope=\"col\">Âge</spw-table-header>\n <spw-table-header column-id=\"status\" sortable scope=\"col\">Statut</spw-table-header>\n <spw-table-header text-align=\"center\" scope=\"col\">Actions</spw-table-header>\n </spw-table-row>\n </spw-table-head>\n <spw-table-body>\n <spw-table-row>\n <spw-table-cell width=\"20\"><spw-checkbox></spw-checkbox></spw-table-cell>\n <spw-table-cell>Zoé</spw-table-cell>\n <spw-table-cell>28</spw-table-cell>\n <spw-table-cell width=\"40\"><spw-tag size=\"small\" variant=\"green\">Validé</spw-tag></spw-table-cell>\n <spw-table-cell padding=\"small\" width=\"10\">\n <div class=\"d-flex\">\n <spw-button size=\"small\" variant=\"secondary\" icon=\"fa-trash\" is-icon-only=\"true\" class=\"mx-1\"></spw-button>\n <spw-button size=\"small\" variant=\"secondary\" icon=\"fa-edit\" is-icon-only=\"true\" class=\"mx-1\"></spw-button>\n <spw-dropdown direction=\"left\">\n <spw-button icon=\"fa-ellipsis-vertical\" is-icon-only=\"true\" size=\"small\" variant=\"secondary\" class=\"mx-1\">\n <div slot=\"dropdownContent\">\n <spw-group orientation=\"vertical\" is-full-width>\n <spw-button is-full-width variant=\"secondary\" size=\"small\">Modifier</spw-button>\n <spw-button is-full-width variant=\"secondary\" size=\"small\">Supprimer</spw-button>\n </spw-group>\n </div>\n </spw-button>\n </spw-dropdown>\n </div>\n </spw-table-cell>\n </spw-table-row>\n <spw-table-row state=\"disabled\">\n <spw-table-cell width=\"20\"><spw-checkbox disabled=\"true\"></spw-checkbox></spw-table-cell>\n <spw-table-cell>Marie</spw-table-cell>\n <spw-table-cell>22</spw-table-cell>\n <spw-table-cell width=\"40\"><spw-tag size=\"small\" variant=\"green\">Validé</spw-tag></spw-table-cell>\n <spw-table-cell padding=\"small\" width=\"10\">\n <div class=\"d-flex\">\n <spw-button size=\"small\" variant=\"secondary\" icon=\"fa-trash\" is-icon-only=\"true\" class=\"mx-1\"></spw-button>\n <spw-button size=\"small\" variant=\"secondary\" icon=\"fa-edit\" is-icon-only=\"true\" class=\"mx-1\"></spw-button>\n <spw-dropdown direction=\"left\">\n <spw-button icon=\"fa-ellipsis-vertical\" is-icon-only=\"true\" size=\"small\" variant=\"secondary\" class=\"mx-1\">\n <div slot=\"dropdownContent\">\n <spw-group orientation=\"vertical\" is-full-width>\n <spw-button is-full-width variant=\"secondary\" size=\"small\">Modifier</spw-button>\n <spw-button is-full-width variant=\"secondary\" size=\"small\">Supprimer</spw-button>\n </spw-group>\n </div>\n </spw-button>\n </spw-dropdown>\n </div>\n </spw-table-cell>\n </spw-table-row>\n <spw-table-row state=\"selected\">\n <spw-table-cell width=\"20\"><spw-checkbox checked=\"true\"></spw-checkbox></spw-table-cell>\n <spw-table-cell>Thomas</spw-table-cell>\n <spw-table-cell>37</spw-table-cell>\n <spw-table-cell width=\"40\"><spw-tag size=\"small\" variant=\"green\">Validé</spw-tag></spw-table-cell>\n <spw-table-cell padding=\"small\" width=\"10\">\n <div class=\"d-flex\">\n <spw-button size=\"small\" variant=\"secondary\" icon=\"fa-trash\" is-icon-only=\"true\" class=\"mx-1\"></spw-button>\n <spw-button size=\"small\" variant=\"secondary\" icon=\"fa-edit\" is-icon-only=\"true\" class=\"mx-1\"></spw-button>\n <spw-dropdown direction=\"left\">\n <spw-button icon=\"fa-ellipsis-vertical\" is-icon-only=\"true\" size=\"small\" variant=\"secondary\" class=\"mx-1\">\n <div slot=\"dropdownContent\">\n <spw-group orientation=\"vertical\" is-full-width>\n <spw-button is-full-width variant=\"secondary\" size=\"small\">Modifier</spw-button>\n <spw-button is-full-width variant=\"secondary\" size=\"small\">Supprimer</spw-button>\n </spw-group>\n </div>\n </spw-button>\n </spw-dropdown>\n </div>\n </spw-table-cell>\n </spw-table-row>\n </spw-table-body>\n <spw-table-footer>\n <div slot=\"left\">1-10 sur 9999 éléments</div>\n <div slot=\"center\">\n <spw-pagination class=\"spw-pagination\" variant=\"numbers\" total-items=\"30\" items-per-page=\"10\"></spw-pagination>\n </div>\n <div slot=\"right\">\n <spw-select placeholder=\"N°\" name=\"mon-select-natif\" size=\"medium\">\n <option selected value=\"10\">10</option>\n <option value=\"20\">20</option>\n <option value=\"30\">30</option>\n <option value=\"40\">40</option>\n </spw-select>\n éléments par page\n </div>\n </spw-table-footer>\n `,\n};\n\nexport const CompactTable: StoryFn = Template.bind({});\nCompactTable.args = {\n isZebra: true,\n innerHTML: `\n <spw-table-head>\n <spw-table-row>\n <spw-table-header padding=\"small\" column-id=\"name\" sortable scope=\"col\">Nom</spw-table-header>\n <spw-table-header padding=\"small\" column-id=\"age\" sortable scope=\"col\">Âge</spw-table-header>\n <spw-table-header padding=\"small\" column-id=\"city\" sortable scope=\"col\">Ville</spw-table-header>\n </spw-table-row>\n </spw-table-head>\n <spw-table-body>\n <spw-table-row>\n <spw-table-cell padding=\"small\">Zoé</spw-table-cell>\n <spw-table-cell padding=\"small\">28</spw-table-cell>\n <spw-table-cell padding=\"small\">Charleroi</spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell padding=\"small\">Arthur</spw-table-cell>\n <spw-table-cell padding=\"small\">35</spw-table-cell>\n <spw-table-cell padding=\"small\">Namur</spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell padding=\"small\">Micheline</spw-table-cell>\n <spw-table-cell padding=\"small\">17</spw-table-cell>\n <spw-table-cell padding=\"small\">Liège</spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell padding=\"small\">André</spw-table-cell>\n <spw-table-cell padding=\"small\">84</spw-table-cell>\n <spw-table-cell padding=\"small\">Tournai</spw-table-cell>\n </spw-table-row>\n </spw-table-body>\n `,\n};\n\nexport const LoadingWithSkeleton: StoryFn = Template.bind({});\nLoadingWithSkeleton.args = {\n isZebra: true,\n innerHTML: `\n <spw-table-head>\n <spw-table-row>\n <spw-table-header width=\"20\" scope=\"col\">\n <spw-checkbox></spw-checkbox>\n </spw-table-header>\n <spw-table-header column-id=\"name\" sortable scope=\"col\">Nom</spw-table-header>\n <spw-table-header column-id=\"age\" sortable scope=\"col\">Âge</spw-table-header>\n <spw-table-header column-id=\"status\" scope=\"col\">Statut</spw-table-header>\n <spw-table-header text-align=\"center\" scope=\"col\">Actions</spw-table-header>\n </spw-table-row>\n </spw-table-head>\n <spw-table-body>\n <spw-table-row>\n <spw-table-cell width=\"20\">\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n <spw-table-cell>\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n <spw-table-cell>\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n <spw-table-cell width=\"40\">\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n <spw-table-cell padding=\"small\" width=\"10\">\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell width=\"20\">\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n <spw-table-cell>\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n <spw-table-cell>\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n <spw-table-cell width=\"40\">\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n <spw-table-cell padding=\"small\" width=\"10\">\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell width=\"20\">\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n <spw-table-cell>\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n <spw-table-cell>\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n <spw-table-cell width=\"40\">\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n <spw-table-cell padding=\"small\" width=\"10\">\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell width=\"20\">\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n <spw-table-cell>\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n <spw-table-cell>\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n <spw-table-cell width=\"40\">\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n <spw-table-cell padding=\"small\" width=\"10\">\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n </spw-table-row>\n <spw-table-row>\n <spw-table-cell width=\"20\">\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n <spw-table-cell>\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n <spw-table-cell>\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n <spw-table-cell width=\"40\">\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n <spw-table-cell padding=\"small\" width=\"10\">\n <spw-skeleton lines=\"1\"></spw-skeleton>\n </spw-table-cell>\n </spw-table-row>\n </spw-table-body>\n <spw-table-footer>\n <div slot=\"left\">Chargement en cours...</div>\n <div slot=\"center\">\n <spw-pagination class=\"spw-pagination\" variant=\"numbers\" total-items=\"30\" items-per-page=\"10\"></spw-pagination>\n </div>\n <div slot=\"right\">\n <spw-select placeholder=\"N°\" name=\"mon-select-natif\" size=\"medium\">\n <option selected value=\"10\">10</option>\n <option value=\"20\">20</option>\n <option value=\"30\">30</option>\n <option value=\"40\">40</option>\n </spw-select>\n éléments par page\n </div>\n </spw-table-footer>\n `,\n};\n"]}

package/dist/collection/stories/organisms/spw-wizard/spw-wizard.stories.js ADDED Viewed

@@ -0,0 +1,208 @@
+let componentsData;
+try {
+    componentsData = require('../../../../dist/components_json.json');
+}
+catch (error) {
+    console.warn('components_json.json non trouvé. Utilisation de valeurs par défaut.');
+    componentsData = {};
+}
+import { withComponentControls, extractArgTypes, toKebabCase } from "../../../utils/utils";
+const elementTag = 'spw-wizard';
+const subComponentTags = ['spw-wizard-item'];
+const argTypes = Object.assign(Object.assign({}, withComponentControls(componentsData, { tag: elementTag })), extractArgTypes(componentsData, subComponentTags));
+const meta = {
+    title: 'Organismes/Wizard',
+    component: elementTag,
+    argTypes,
+    tags: ['autodocs'],
+    parameters: {
+        docs: {
+            description: {
+                component: `
+<strong class="mr-2">Statut du composant :</strong> <spw-tag size="small" variant="green">Prêt</spw-tag>
+Le wizard (ou assistant) permet de guider l'utilisateur à travers un processus en plusieurs étapes. Il affiche la progression et permet de naviguer entre les étapes.
+[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/85cf28-barre-de-progression-stepper)
+        `,
+            },
+        },
+    },
+};
+export default meta;
+function htmlContentHorizontal() {
+    return /* HTML */ `
+    <spw-wizard-item label="Étape 1" description="Informations personnelles"></spw-wizard-item>
+    <spw-wizard-item label="Étape 2" description="Adresse"></spw-wizard-item>
+    <spw-wizard-item label="Étape 3" description="Vérification"></spw-wizard-item>
+    <spw-wizard-item label="Étape 4" description="Confirmation"></spw-wizard-item>
+  `;
+}
+function htmlContentVertical() {
+    return /* HTML */ `
+    <spw-wizard-item label="Étape 1" description="Informations personnelles"></spw-wizard-item>
+    <spw-wizard-item label="Étape 2" description="Adresse"></spw-wizard-item>
+    <spw-wizard-item label="Étape 3" description="Vérification"></spw-wizard-item>
+    <spw-wizard-item label="Étape 4" description="Confirmation"></spw-wizard-item>
+  `;
+}
+function htmlContentWithIcons() {
+    return /* HTML */ `
+    <spw-wizard-item icon="fa-user" label="Profil" description="Informations personnelles"></spw-wizard-item>
+    <spw-wizard-item icon="fa-map-marker-alt" label="Localisation" description="Adresse et coordonnées"></spw-wizard-item>
+    <spw-wizard-item icon="fa-check-circle" label="Validation" description="Vérification des données"></spw-wizard-item>
+    <spw-wizard-item icon="fa-flag-checkered" label="Terminé" description="Confirmation finale"></spw-wizard-item>
+  `;
+}
+function htmlContentWithStates() {
+    return /* HTML */ `
+    <spw-wizard-item label="Étape 1" description="Complétée avec succès"></spw-wizard-item>
+    <spw-wizard-item label="Étape 2" description="Complétée avec succès"></spw-wizard-item>
+    <spw-wizard-item status="error" label="Étape 3" description="Erreur de validation" additional-info="Veuillez corriger les champs en erreur"></spw-wizard-item>
+    <spw-wizard-item label="Étape 4" description="Non encore accessible"></spw-wizard-item>
+  `;
+}
+function htmlContentWithWarning() {
+    return /* HTML */ `
+    <spw-wizard-item label="Étape 1" description="Informations de base"></spw-wizard-item>
+    <spw-wizard-item status="warning" label="Étape 2" description="Attention requise" additional-info="Certaines informations sont manquantes"></spw-wizard-item>
+    <spw-wizard-item label="Étape 3" description="Récapitulatif"></spw-wizard-item>
+    <spw-wizard-item label="Étape 4" description="Validation finale"></spw-wizard-item>
+  `;
+}
+const TemplateHorizontal = args => {
+    const element = document.createElement(elementTag);
+    const controls = withComponentControls(componentsData, { tag: elementTag }) || {};
+    const masterProps = controls.__realProps || Object.keys(controls);
+    Object.entries(args).forEach(([key, val]) => {
+        if (masterProps.includes(key)) {
+            element.setAttribute(toKebabCase(key), val);
+        }
+        else if (key.startsWith('on')) {
+            element.addEventListener(key.substring(2).toLowerCase(), val);
+        }
+    });
+    element.innerHTML = htmlContentHorizontal();
+    return element;
+};
+const TemplateVertical = args => {
+    const element = document.createElement(elementTag);
+    const controls = withComponentControls(componentsData, { tag: elementTag }) || {};
+    const masterProps = controls.__realProps || Object.keys(controls);
+    Object.entries(args).forEach(([key, val]) => {
+        if (masterProps.includes(key)) {
+            element.setAttribute(toKebabCase(key), val);
+        }
+        else if (key.startsWith('on')) {
+            element.addEventListener(key.substring(2).toLowerCase(), val);
+        }
+    });
+    element.innerHTML = htmlContentVertical();
+    return element;
+};
+const TemplateWithIcons = args => {
+    const element = document.createElement(elementTag);
+    const controls = withComponentControls(componentsData, { tag: elementTag }) || {};
+    const masterProps = controls.__realProps || Object.keys(controls);
+    Object.entries(args).forEach(([key, val]) => {
+        if (masterProps.includes(key)) {
+            element.setAttribute(toKebabCase(key), val);
+        }
+        else if (key.startsWith('on')) {
+            element.addEventListener(key.substring(2).toLowerCase(), val);
+        }
+    });
+    element.innerHTML = htmlContentWithIcons();
+    return element;
+};
+const TemplateWithStates = args => {
+    const element = document.createElement(elementTag);
+    const controls = withComponentControls(componentsData, { tag: elementTag }) || {};
+    const masterProps = controls.__realProps || Object.keys(controls);
+    Object.entries(args).forEach(([key, val]) => {
+        if (masterProps.includes(key)) {
+            element.setAttribute(toKebabCase(key), val);
+        }
+        else if (key.startsWith('on')) {
+            element.addEventListener(key.substring(2).toLowerCase(), val);
+        }
+    });
+    element.innerHTML = htmlContentWithStates();
+    return element;
+};
+const TemplateWithWarning = args => {
+    const element = document.createElement(elementTag);
+    const controls = withComponentControls(componentsData, { tag: elementTag }) || {};
+    const masterProps = controls.__realProps || Object.keys(controls);
+    Object.entries(args).forEach(([key, val]) => {
+        if (masterProps.includes(key)) {
+            element.setAttribute(toKebabCase(key), val);
+        }
+        else if (key.startsWith('on')) {
+            element.addEventListener(key.substring(2).toLowerCase(), val);
+        }
+    });
+    element.innerHTML = htmlContentWithWarning();
+    return element;
+};
+export const Horizontal = TemplateHorizontal.bind({});
+Horizontal.args = {
+    currentStep: 2,
+    variant: 'horizontal',
+};
+Horizontal.parameters = {
+    docs: {
+        description: {
+            story: 'Wizard avec orientation horizontale (par défaut). Les étapes sont affichées en ligne.',
+        },
+    },
+};
+export const Vertical = TemplateVertical.bind({});
+Vertical.args = {
+    currentStep: 2,
+    variant: 'vertical',
+};
+Vertical.parameters = {
+    docs: {
+        description: {
+            story: 'Wizard avec orientation verticale. Les étapes sont empilées verticalement.',
+        },
+    },
+};
+export const WithIcons = TemplateWithIcons.bind({});
+WithIcons.args = {
+    currentStep: 3,
+    variant: 'horizontal',
+};
+WithIcons.parameters = {
+    docs: {
+        description: {
+            story: 'Wizard avec icônes personnalisées pour chaque étape. Les icônes remplacent les numéros par défaut.',
+        },
+    },
+};
+export const WithError = TemplateWithStates.bind({});
+WithError.args = {
+    currentStep: 3,
+    variant: 'horizontal',
+};
+WithError.parameters = {
+    docs: {
+        description: {
+            story: "Wizard avec une étape en erreur. L'attribut status='error' permet d'indiquer une erreur de validation à l'utilisateur.",
+        },
+    },
+};
+export const WithWarning = TemplateWithWarning.bind({});
+WithWarning.args = {
+    currentStep: 2,
+    variant: 'horizontal',
+};
+WithWarning.parameters = {
+    docs: {
+        description: {
+            story: "Wizard avec une étape en warning. L'attribut status='warning' attire l'attention sur des informations manquantes ou à vérifier.",
+        },
+    },
+};
+//# sourceMappingURL=spw-wizard.stories.js.map