@spw-ds/spw-stencil-library 1.3.0 → 1.3.2

package/dist/collection/stories/components/spw-file-upload/spw-file-upload.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"spw-file-upload.stories.js","sourceRoot":"","sources":["../../../../src/stories/components/spw-file-upload/spw-file-upload.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,6CAA6C;IACpD,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,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;IAEH,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,IAAI;IACd,IAAI,EAAE,QAAQ;IACd,QAAQ,EAAE,CAAC;IACX,WAAW,EAAE,CAAC;IACd,MAAM,EAAE,oEAAoE;CAC7E,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-file-upload';\n\nconst argTypes = withComponentControls(componentsData, { tag: elementTag });\n\nconst meta: Meta = {\n  title: 'Composants/Envoi de fichiers (input upload)',\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\nSélectionner et télécharger des fichiers depuis vers une application web.\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/934c31-envoi-de-fichiers-upload)\n        `,\n      },\n    },\n  },\n};\n\nexport default meta;\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      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  return element;\n};\n\nexport const Default = Template.bind({});\nDefault.args = {\n  multiple: true,\n  name: 'upload',\n  maxFiles: 3,\n  maxFileSize: 3,\n  accept: 'txt, rtf, pdf, doc, docx, odt, odp, ods, pptx, xls, xlsx, jpg, png',\n};\n"]}
+{"version":3,"file":"spw-file-upload.stories.js","sourceRoot":"","sources":["../../../../src/stories/components/spw-file-upload/spw-file-upload.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,6CAA6C;IACpD,SAAS,EAAE,UAAU;IACrB,QAAQ;IACR,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,SAAS,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;SAyBV;aACF;SACF;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,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;IAEH,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,IAAI;IACd,IAAI,EAAE,QAAQ;IACd,QAAQ,EAAE,CAAC;IACX,WAAW,EAAE,CAAC;IACd,MAAM,EAAE,oEAAoE;CAC7E,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-file-upload';\n\nconst argTypes = withComponentControls(componentsData, { tag: elementTag });\n\nconst meta: Meta = {\n  title: 'Composants/Envoi de fichiers (input upload)',\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\nLe composant File Upload permet aux utilisateurs de sélectionner et télécharger un ou plusieurs fichiers vers l'application. Il intègre validation de type, taille et nombre de fichiers avec feedback visuel.\n\n## Fonctionnalités\n\n- Sélection de fichiers unique ou multiple\n- Drag and drop pour déposer des fichiers\n- Validation des types de fichiers acceptés\n- Limitation de taille par fichier (Mo)\n- Limitation du nombre de fichiers\n- Aperçu des fichiers sélectionnés\n- Suppression individuelle des fichiers\n- Messages d'erreur détaillés\n\n## Cas d'usage\n\n- Upload de documents\n- Envoi de photos ou images\n- Ajout de pièces jointes dans formulaires\n- Import de fichiers de données (CSV, Excel)\n- Téléchargement de fichiers multiples\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/934c31-envoi-de-fichiers-upload)\n        `,\n      },\n    },\n  },\n};\n\nexport default meta;\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      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  return element;\n};\n\nexport const Default = Template.bind({});\nDefault.args = {\n  multiple: true,\n  name: 'upload',\n  maxFiles: 3,\n  maxFileSize: 3,\n  accept: 'txt, rtf, pdf, doc, docx, odt, odp, ods, pptx, xls, xlsx, jpg, png',\n};\n"]}

package/dist/collection/stories/components/spw-icon/spw-icon.stories.js

@@ -20,7 +20,20 @@ const meta = {
                 component: `
 <strong class="mr-2">Statut du composant :</strong> <spw-tag size="small" variant="green">Prêt</spw-tag>
 
-Permet d'afficher une icône de la bibliothèque Font Awesome.
+Le composant Icon permet d'afficher une icône de la bibliothèque Font Awesome. Simple et léger, il s'intègre facilement dans tous les contextes pour enrichir l'interface avec des pictogrammes clairs.
+
+## Fonctionnalités
+
+- Support complet des icônes Font Awesome (solid, regular, brands)
+- Taille configurable via CSS ou propriétés
+- Intégration native dans d'autres composants (button, link, etc.)
+
+## Cas d'usage
+
+- Icônes décoratives dans l'interface
+- Pictogrammes informatifs (statut, type de fichier)
+- Icônes fonctionnelles dans boutons et liens
+- Indicateurs visuels dans formulaires et messages
         `,
             },
         },
@@ -54,4 +67,11 @@ Default.args = {
     icon: 'fa-arrow-right',
     label: '',
 };
+Default.parameters = {
+    docs: {
+        description: {
+            story: `Icône par défaut affichant une flèche. Utilisez la propriété icon pour choisir n'importe quelle icône Font Awesome (ex: fa-home, fa-user, fa-check).`,
+        },
+    },
+};
 //# sourceMappingURL=spw-icon.stories.js.map

package/dist/collection/stories/components/spw-icon/spw-icon.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"spw-icon.stories.js","sourceRoot":"","sources":["../../../../src/stories/components/spw-icon/spw-icon.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,UAAU,CAAC;AAE9B,MAAM,QAAQ,GAAG,qBAAqB,CAAC,cAAc,EAAE,EAAE,GAAG,EAAE,UAAU,EAAE,CAAC,CAAC;AAE5E,MAAM,IAAI,GAAS;IACjB,KAAK,EAAE,kBAAkB;IACzB,SAAS,EAAE,UAAU;IACrB,QAAQ;IACR,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,SAAS,EAAE;;;;SAIV;aACF;SACF;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,SAAS,WAAW,CAAC,IAAI;IACvB,OAAO,UAAU,CAAC,GAAG,IAAI,EAAE,CAAC;AAC9B,CAAC;AAED,MAAM,QAAQ,GAAY,IAAI,CAAC,EAAE;IAC/B,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACnD,MAAM,OAAO,GAAG,IAAI,CAAC;IACrB,MAAM,YAAY,GAAG,OAAO,CAAC;IAE7B,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,EAAE,EAAE;QAC1C,IAAI,GAAG,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC;YACzB,OAAO,CAAC,gBAAgB,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,EAAE,GAAG,CAAC,CAAC;QAChE,CAAC;aAAM,CAAC;YACN,IAAI,GAAG,KAAK,YAAY,EAAE,CAAC;gBACzB,OAAO,CAAC,YAAY,CAAC,WAAW,CAAC,GAAG,CAAC,EAAE,GAAa,CAAC,CAAC;YACxD,CAAC;QACH,CAAC;IACH,CAAC,CAAC,CAAC;IAEH,IAAI,OAAO,EAAE,CAAC;QACZ,OAAO,CAAC,SAAS,GAAG,WAAW,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;IACtD,CAAC;IAED,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,IAAI,EAAE,gBAAgB;IACtB,KAAK,EAAE,EAAE;CACV,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-icon';\n\nconst argTypes = withComponentControls(componentsData, { tag: elementTag });\n\nconst meta: Meta = {\n  title: 'Composants/Icône',\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\nPermet d'afficher une icône de la bibliothèque Font Awesome.\n        `,\n      },\n    },\n  },\n};\n\nexport default meta;\n\nfunction htmlContent(slot) {\n  return /* HTML */ `${slot}`;\n}\n\nconst Template: StoryFn = args => {\n  const element = document.createElement(elementTag);\n  const hasSlot = true;\n  const slottedLabel = 'label';\n\n  Object.entries(args).forEach(([key, val]) => {\n    if (key.startsWith('on')) {\n      element.addEventListener(key.substring(2).toLowerCase(), val);\n    } else {\n      if (key !== slottedLabel) {\n        element.setAttribute(toKebabCase(key), val as string);\n      }\n    }\n  });\n\n  if (hasSlot) {\n    element.innerHTML = htmlContent(args[slottedLabel]);\n  }\n\n  return element;\n};\n\nexport const Default = Template.bind({});\nDefault.args = {\n  icon: 'fa-arrow-right',\n  label: '',\n};\n"]}
+{"version":3,"file":"spw-icon.stories.js","sourceRoot":"","sources":["../../../../src/stories/components/spw-icon/spw-icon.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,UAAU,CAAC;AAE9B,MAAM,QAAQ,GAAG,qBAAqB,CAAC,cAAc,EAAE,EAAE,GAAG,EAAE,UAAU,EAAE,CAAC,CAAC;AAE5E,MAAM,IAAI,GAAS;IACjB,KAAK,EAAE,kBAAkB;IACzB,SAAS,EAAE,UAAU;IACrB,QAAQ;IACR,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,SAAS,EAAE;;;;;;;;;;;;;;;;;SAiBV;aACF;SACF;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,SAAS,WAAW,CAAC,IAAI;IACvB,OAAO,UAAU,CAAC,GAAG,IAAI,EAAE,CAAC;AAC9B,CAAC;AAED,MAAM,QAAQ,GAAY,IAAI,CAAC,EAAE;IAC/B,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACnD,MAAM,OAAO,GAAG,IAAI,CAAC;IACrB,MAAM,YAAY,GAAG,OAAO,CAAC;IAE7B,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,EAAE,EAAE;QAC1C,IAAI,GAAG,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC;YACzB,OAAO,CAAC,gBAAgB,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,EAAE,GAAG,CAAC,CAAC;QAChE,CAAC;aAAM,CAAC;YACN,IAAI,GAAG,KAAK,YAAY,EAAE,CAAC;gBACzB,OAAO,CAAC,YAAY,CAAC,WAAW,CAAC,GAAG,CAAC,EAAE,GAAa,CAAC,CAAC;YACxD,CAAC;QACH,CAAC;IACH,CAAC,CAAC,CAAC;IAEH,IAAI,OAAO,EAAE,CAAC;QACZ,OAAO,CAAC,SAAS,GAAG,WAAW,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;IACtD,CAAC;IAED,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,IAAI,EAAE,gBAAgB;IACtB,KAAK,EAAE,EAAE;CACV,CAAC;AAEF,OAAO,CAAC,UAAU,GAAG;IACnB,IAAI,EAAE;QACJ,WAAW,EAAE;YACX,KAAK,EAAE,sJAAsJ;SAC9J;KACF;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-icon';\n\nconst argTypes = withComponentControls(componentsData, { tag: elementTag });\n\nconst meta: Meta = {\n  title: 'Composants/Icône',\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\nLe composant Icon permet d'afficher une icône de la bibliothèque Font Awesome. Simple et léger, il s'intègre facilement dans tous les contextes pour enrichir l'interface avec des pictogrammes clairs.\n\n## Fonctionnalités\n\n- Support complet des icônes Font Awesome (solid, regular, brands)\n- Taille configurable via CSS ou propriétés\n- Intégration native dans d'autres composants (button, link, etc.)\n\n## Cas d'usage\n\n- Icônes décoratives dans l'interface\n- Pictogrammes informatifs (statut, type de fichier)\n- Icônes fonctionnelles dans boutons et liens\n- Indicateurs visuels dans formulaires et messages\n        `,\n      },\n    },\n  },\n};\n\nexport default meta;\n\nfunction htmlContent(slot) {\n  return /* HTML */ `${slot}`;\n}\n\nconst Template: StoryFn = args => {\n  const element = document.createElement(elementTag);\n  const hasSlot = true;\n  const slottedLabel = 'label';\n\n  Object.entries(args).forEach(([key, val]) => {\n    if (key.startsWith('on')) {\n      element.addEventListener(key.substring(2).toLowerCase(), val);\n    } else {\n      if (key !== slottedLabel) {\n        element.setAttribute(toKebabCase(key), val as string);\n      }\n    }\n  });\n\n  if (hasSlot) {\n    element.innerHTML = htmlContent(args[slottedLabel]);\n  }\n\n  return element;\n};\n\nexport const Default = Template.bind({});\nDefault.args = {\n  icon: 'fa-arrow-right',\n  label: '',\n};\n\nDefault.parameters = {\n  docs: {\n    description: {\n      story: `Icône par défaut affichant une flèche. Utilisez la propriété icon pour choisir n'importe quelle icône Font Awesome (ex: fa-home, fa-user, fa-check).`,\n    },\n  },\n};\n"]}

package/dist/collection/stories/components/spw-link/spw-link.stories.js

@@ -20,7 +20,23 @@ const meta = {
                 component: `
 <strong class="mr-2">Statut du composant :</strong> <spw-tag size="small" variant="green">Prêt</spw-tag>
 
-Permet de naviguer vers d'autres pages, sections ou vers des ressources externes.
+Le composant Link permet de créer des liens hypertextes pour naviguer vers d'autres pages, sections de la page courante ou ressources externes. Il offre des options de personnalisation avec icônes et variantes visuelles.
+
+## Fonctionnalités
+
+- Support des icônes FontAwesome (gauche ou droite)
+- Attributs href et target configurables
+- États hover et focus
+- Support des liens externes (_blank)
+- Rendu sémantique avec balise a
+
+## Cas d'usage
+
+- Navigation entre pages du site
+- Liens vers ressources externes
+- Ancres vers sections de la page
+- Liens inline dans du contenu texte
+- Appels à l'action secondaires
 
 [<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/47998e-lien)
         `,
@@ -65,4 +81,18 @@ WithIcon.args = {
     icon: 'fa-arrow-right',
     iconPosition: 'right',
 };
+Primary.parameters = {
+    docs: {
+        description: {
+            story: `Lien standard s'ouvrant dans un nouvel onglet (target="_blank"). Style par défaut avec soulignement au hover. Cas d'usage : liens vers pages internes, navigation principale, références externes.`,
+        },
+    },
+};
+WithIcon.parameters = {
+    docs: {
+        description: {
+            story: `Lien avec icône à droite (fa-arrow-right). L'icône indique visuellement la direction ou le type d'action. Cas d'usage : liens externes, téléchargements, navigation vers sections suivantes, indications visuelles de redirection.`,
+        },
+    },
+};
 //# sourceMappingURL=spw-link.stories.js.map

package/dist/collection/stories/components/spw-link/spw-link.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"spw-link.stories.js","sourceRoot":"","sources":["../../../../src/stories/components/spw-link/spw-link.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,UAAU,CAAC;AAE9B,MAAM,QAAQ,GAAG,qBAAqB,CAAC,cAAc,EAAE,EAAE,GAAG,EAAE,UAAU,EAAE,CAAC,CAAC;AAE5E,MAAM,IAAI,GAAS;IACjB,KAAK,EAAE,iBAAiB;IACxB,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,IAAI;IACvB,OAAO,UAAU,CAAC,GAAG,IAAI,EAAE,CAAC;AAC9B,CAAC;AAED,MAAM,QAAQ,GAAY,IAAI,CAAC,EAAE;IAC/B,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACnD,MAAM,OAAO,GAAG,IAAI,CAAC;IACrB,MAAM,YAAY,GAAG,SAAS,CAAC;IAE/B,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,EAAE,EAAE;QAC1C,IAAI,GAAG,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC;YACzB,OAAO,CAAC,gBAAgB,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,EAAE,GAAG,CAAC,CAAC;QAChE,CAAC;aAAM,CAAC;YACN,IAAI,GAAG,KAAK,YAAY,EAAE,CAAC;gBACzB,OAAO,CAAC,YAAY,CAAC,WAAW,CAAC,GAAG,CAAC,EAAE,GAAa,CAAC,CAAC;YACxD,CAAC;QACH,CAAC;IACH,CAAC,CAAC,CAAC;IAEH,IAAI,OAAO,EAAE,CAAC;QACZ,OAAO,CAAC,SAAS,GAAG,WAAW,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;IACtD,CAAC;IAED,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,OAAO,EAAE,gBAAgB;IACzB,IAAI,EAAE,mBAAmB;IACzB,MAAM,EAAE,QAAQ;CACjB,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC1C,QAAQ,CAAC,IAAI,GAAG;IACd,OAAO,EAAE,2BAA2B;IACpC,IAAI,EAAE,mBAAmB;IACzB,MAAM,EAAE,QAAQ;IAChB,IAAI,EAAE,gBAAgB;IACtB,YAAY,EAAE,OAAO;CACtB,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-link';\n\nconst argTypes = withComponentControls(componentsData, { tag: elementTag });\n\nconst meta: Meta = {\n  title: 'Composants/Lien',\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\nPermet de naviguer vers d'autres pages, sections ou vers des ressources externes.\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/47998e-lien)\n        `,\n      },\n    },\n  },\n};\n\nexport default meta;\n\nfunction htmlContent(slot) {\n  return /* HTML */ `${slot}`;\n}\n\nconst Template: StoryFn = args => {\n  const element = document.createElement(elementTag);\n  const hasSlot = true;\n  const slottedLabel = 'content';\n\n  Object.entries(args).forEach(([key, val]) => {\n    if (key.startsWith('on')) {\n      element.addEventListener(key.substring(2).toLowerCase(), val);\n    } else {\n      if (key !== slottedLabel) {\n        element.setAttribute(toKebabCase(key), val as string);\n      }\n    }\n  });\n\n  if (hasSlot) {\n    element.innerHTML = htmlContent(args[slottedLabel]);\n  }\n\n  return element;\n};\n\nexport const Primary = Template.bind({});\nPrimary.args = {\n  content: 'Mon super lien',\n  href: 'http://google.com',\n  target: '_blank',\n};\n\nexport const WithIcon = Template.bind({});\nWithIcon.args = {\n  content: 'Mon super lien avec icône',\n  href: 'http://google.com',\n  target: '_blank',\n  icon: 'fa-arrow-right',\n  iconPosition: 'right',\n};\n"]}
+{"version":3,"file":"spw-link.stories.js","sourceRoot":"","sources":["../../../../src/stories/components/spw-link/spw-link.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,UAAU,CAAC;AAE9B,MAAM,QAAQ,GAAG,qBAAqB,CAAC,cAAc,EAAE,EAAE,GAAG,EAAE,UAAU,EAAE,CAAC,CAAC;AAE5E,MAAM,IAAI,GAAS;IACjB,KAAK,EAAE,iBAAiB;IACxB,SAAS,EAAE,UAAU;IACrB,QAAQ;IACR,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,SAAS,EAAE;;;;;;;;;;;;;;;;;;;;;;SAsBV;aACF;SACF;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,SAAS,WAAW,CAAC,IAAI;IACvB,OAAO,UAAU,CAAC,GAAG,IAAI,EAAE,CAAC;AAC9B,CAAC;AAED,MAAM,QAAQ,GAAY,IAAI,CAAC,EAAE;IAC/B,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACnD,MAAM,OAAO,GAAG,IAAI,CAAC;IACrB,MAAM,YAAY,GAAG,SAAS,CAAC;IAE/B,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,EAAE,EAAE;QAC1C,IAAI,GAAG,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC;YACzB,OAAO,CAAC,gBAAgB,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,EAAE,GAAG,CAAC,CAAC;QAChE,CAAC;aAAM,CAAC;YACN,IAAI,GAAG,KAAK,YAAY,EAAE,CAAC;gBACzB,OAAO,CAAC,YAAY,CAAC,WAAW,CAAC,GAAG,CAAC,EAAE,GAAa,CAAC,CAAC;YACxD,CAAC;QACH,CAAC;IACH,CAAC,CAAC,CAAC;IAEH,IAAI,OAAO,EAAE,CAAC;QACZ,OAAO,CAAC,SAAS,GAAG,WAAW,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;IACtD,CAAC;IAED,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,OAAO,EAAE,gBAAgB;IACzB,IAAI,EAAE,mBAAmB;IACzB,MAAM,EAAE,QAAQ;CACjB,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC1C,QAAQ,CAAC,IAAI,GAAG;IACd,OAAO,EAAE,2BAA2B;IACpC,IAAI,EAAE,mBAAmB;IACzB,MAAM,EAAE,QAAQ;IAChB,IAAI,EAAE,gBAAgB;IACtB,YAAY,EAAE,OAAO;CACtB,CAAC;AAEF,OAAO,CAAC,UAAU,GAAG;IACnB,IAAI,EAAE;QACJ,WAAW,EAAE;YACX,KAAK,EAAE,oMAAoM;SAC5M;KACF;CACF,CAAC;AAEF,QAAQ,CAAC,UAAU,GAAG;IACpB,IAAI,EAAE;QACJ,WAAW,EAAE;YACX,KAAK,EAAE,oOAAoO;SAC5O;KACF;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-link';\n\nconst argTypes = withComponentControls(componentsData, { tag: elementTag });\n\nconst meta: Meta = {\n  title: 'Composants/Lien',\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\nLe composant Link permet de créer des liens hypertextes pour naviguer vers d'autres pages, sections de la page courante ou ressources externes. Il offre des options de personnalisation avec icônes et variantes visuelles.\n\n## Fonctionnalités\n\n- Support des icônes FontAwesome (gauche ou droite)\n- Attributs href et target configurables\n- États hover et focus\n- Support des liens externes (_blank)\n- Rendu sémantique avec balise a\n\n## Cas d'usage\n\n- Navigation entre pages du site\n- Liens vers ressources externes\n- Ancres vers sections de la page\n- Liens inline dans du contenu texte\n- Appels à l'action secondaires\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/47998e-lien)\n        `,\n      },\n    },\n  },\n};\n\nexport default meta;\n\nfunction htmlContent(slot) {\n  return /* HTML */ `${slot}`;\n}\n\nconst Template: StoryFn = args => {\n  const element = document.createElement(elementTag);\n  const hasSlot = true;\n  const slottedLabel = 'content';\n\n  Object.entries(args).forEach(([key, val]) => {\n    if (key.startsWith('on')) {\n      element.addEventListener(key.substring(2).toLowerCase(), val);\n    } else {\n      if (key !== slottedLabel) {\n        element.setAttribute(toKebabCase(key), val as string);\n      }\n    }\n  });\n\n  if (hasSlot) {\n    element.innerHTML = htmlContent(args[slottedLabel]);\n  }\n\n  return element;\n};\n\nexport const Primary = Template.bind({});\nPrimary.args = {\n  content: 'Mon super lien',\n  href: 'http://google.com',\n  target: '_blank',\n};\n\nexport const WithIcon = Template.bind({});\nWithIcon.args = {\n  content: 'Mon super lien avec icône',\n  href: 'http://google.com',\n  target: '_blank',\n  icon: 'fa-arrow-right',\n  iconPosition: 'right',\n};\n\nPrimary.parameters = {\n  docs: {\n    description: {\n      story: `Lien standard s'ouvrant dans un nouvel onglet (target=\"_blank\"). Style par défaut avec soulignement au hover. Cas d'usage : liens vers pages internes, navigation principale, références externes.`,\n    },\n  },\n};\n\nWithIcon.parameters = {\n  docs: {\n    description: {\n      story: `Lien avec icône à droite (fa-arrow-right). L'icône indique visuellement la direction ou le type d'action. Cas d'usage : liens externes, téléchargements, navigation vers sections suivantes, indications visuelles de redirection.`,\n    },\n  },\n};\n"]}

package/dist/collection/stories/components/spw-loading/spw-loading.stories.js

@@ -20,7 +20,21 @@ const meta = {
                 component: `
 <strong class="mr-2">Statut du composant :</strong> <spw-tag size="small" variant="green">Prêt</spw-tag>
 
-Indique que le contenu ou une action est en cours de chargement.
+Le composant Loading (loader) indique visuellement qu'une action ou un chargement de contenu est en cours. Il fournit un feedback immédiat à l'utilisateur pendant les opérations asynchrones.
+
+## Fonctionnalités
+
+- Animation de chargement circulaire
+- Texte optionnel personnalisable
+- Taille adaptative
+- Utilisable en standalone ou intégré dans d'autres composants
+
+## Cas d'usage
+
+- Chargement de données depuis une API
+- Attente lors de soumission de formulaire
+- États de chargement de page ou section
+- Feedback visuel pendant traitements longs
 
 [<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/957e2a-chargement-loader)
         `,
@@ -57,4 +71,18 @@ Default.args = {};
 WithoutText.args = {
     text: '',
 };
+Default.parameters = {
+    docs: {
+        description: {
+            story: `Loader par défaut avec texte de chargement. Cas d'usage : chargement de contenu, traitement de données, attente de réponse serveur.`,
+        },
+    },
+};
+WithoutText.parameters = {
+    docs: {
+        description: {
+            story: `Loader sans texte, version minimaliste. Cas d'usage : chargement dans des espaces restreints, indicateurs compacts, intégration dans boutons.`,
+        },
+    },
+};
 //# sourceMappingURL=spw-loading.stories.js.map

package/dist/collection/stories/components/spw-loading/spw-loading.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"spw-loading.stories.js","sourceRoot":"","sources":["../../../../src/stories/components/spw-loading/spw-loading.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,aAAa,CAAC;AAEjC,MAAM,QAAQ,GAAG,qBAAqB,CAAC,cAAc,EAAE,EAAE,GAAG,EAAE,UAAU,EAAE,CAAC,CAAC;AAE5E,MAAM,IAAI,GAAS;IACjB,KAAK,EAAE,gCAAgC;IACvC,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,IAAI;IACvB,OAAO,UAAU,CAAC,GAAG,IAAI,EAAE,CAAC;AAC9B,CAAC;AAED,MAAM,QAAQ,GAAY,IAAI,CAAC,EAAE;IAC/B,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACnD,MAAM,OAAO,GAAG,KAAK,CAAC;IACtB,MAAM,YAAY,GAAG,OAAO,CAAC;IAE7B,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,EAAE,EAAE;QAC1C,IAAI,GAAG,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC;YACzB,OAAO,CAAC,gBAAgB,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,EAAE,GAAG,CAAC,CAAC;QAChE,CAAC;aAAM,CAAC;YACN,IAAI,GAAG,KAAK,YAAY,EAAE,CAAC;gBACzB,OAAO,CAAC,YAAY,CAAC,WAAW,CAAC,GAAG,CAAC,EAAE,GAAa,CAAC,CAAC;YACxD,CAAC;QACH,CAAC;IACH,CAAC,CAAC,CAAC;IAEH,IAAI,OAAO,EAAE,CAAC;QACZ,OAAO,CAAC,SAAS,GAAG,WAAW,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;IACtD,CAAC;IAED,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,MAAM,CAAC,MAAM,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC7C,OAAO,CAAC,IAAI,GAAG,EAAE,CAAC;AAClB,WAAW,CAAC,IAAI,GAAG;IACjB,IAAI,EAAE,EAAE;CACT,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-loading';\n\nconst argTypes = withComponentControls(componentsData, { tag: elementTag });\n\nconst meta: Meta = {\n  title: 'Composants/Chargement (loader)',\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\nIndique que le contenu ou une action est en cours de chargement.\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/957e2a-chargement-loader)\n        `,\n      },\n    },\n  },\n};\n\nexport default meta;\n\nfunction htmlContent(slot) {\n  return /* HTML */ `${slot}`;\n}\n\nconst Template: StoryFn = args => {\n  const element = document.createElement(elementTag);\n  const hasSlot = false;\n  const slottedLabel = 'label';\n\n  Object.entries(args).forEach(([key, val]) => {\n    if (key.startsWith('on')) {\n      element.addEventListener(key.substring(2).toLowerCase(), val);\n    } else {\n      if (key !== slottedLabel) {\n        element.setAttribute(toKebabCase(key), val as string);\n      }\n    }\n  });\n\n  if (hasSlot) {\n    element.innerHTML = htmlContent(args[slottedLabel]);\n  }\n\n  return element;\n};\n\nexport const Default = Template.bind({});\nexport const WithoutText = Template.bind({});\nDefault.args = {};\nWithoutText.args = {\n  text: '',\n};\n"]}
+{"version":3,"file":"spw-loading.stories.js","sourceRoot":"","sources":["../../../../src/stories/components/spw-loading/spw-loading.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,aAAa,CAAC;AAEjC,MAAM,QAAQ,GAAG,qBAAqB,CAAC,cAAc,EAAE,EAAE,GAAG,EAAE,UAAU,EAAE,CAAC,CAAC;AAE5E,MAAM,IAAI,GAAS;IACjB,KAAK,EAAE,gCAAgC;IACvC,SAAS,EAAE,UAAU;IACrB,QAAQ;IACR,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,SAAS,EAAE;;;;;;;;;;;;;;;;;;;;SAoBV;aACF;SACF;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,SAAS,WAAW,CAAC,IAAI;IACvB,OAAO,UAAU,CAAC,GAAG,IAAI,EAAE,CAAC;AAC9B,CAAC;AAED,MAAM,QAAQ,GAAY,IAAI,CAAC,EAAE;IAC/B,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACnD,MAAM,OAAO,GAAG,KAAK,CAAC;IACtB,MAAM,YAAY,GAAG,OAAO,CAAC;IAE7B,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,EAAE,EAAE;QAC1C,IAAI,GAAG,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC;YACzB,OAAO,CAAC,gBAAgB,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,EAAE,GAAG,CAAC,CAAC;QAChE,CAAC;aAAM,CAAC;YACN,IAAI,GAAG,KAAK,YAAY,EAAE,CAAC;gBACzB,OAAO,CAAC,YAAY,CAAC,WAAW,CAAC,GAAG,CAAC,EAAE,GAAa,CAAC,CAAC;YACxD,CAAC;QACH,CAAC;IACH,CAAC,CAAC,CAAC;IAEH,IAAI,OAAO,EAAE,CAAC;QACZ,OAAO,CAAC,SAAS,GAAG,WAAW,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;IACtD,CAAC;IAED,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,MAAM,CAAC,MAAM,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC7C,OAAO,CAAC,IAAI,GAAG,EAAE,CAAC;AAClB,WAAW,CAAC,IAAI,GAAG;IACjB,IAAI,EAAE,EAAE;CACT,CAAC;AAEF,OAAO,CAAC,UAAU,GAAG;IACnB,IAAI,EAAE;QACJ,WAAW,EAAE;YACX,KAAK,EAAE,qIAAqI;SAC7I;KACF;CACF,CAAC;AAEF,WAAW,CAAC,UAAU,GAAG;IACvB,IAAI,EAAE;QACJ,WAAW,EAAE;YACX,KAAK,EAAE,+IAA+I;SACvJ;KACF;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-loading';\n\nconst argTypes = withComponentControls(componentsData, { tag: elementTag });\n\nconst meta: Meta = {\n  title: 'Composants/Chargement (loader)',\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\nLe composant Loading (loader) indique visuellement qu'une action ou un chargement de contenu est en cours. Il fournit un feedback immédiat à l'utilisateur pendant les opérations asynchrones.\n\n## Fonctionnalités\n\n- Animation de chargement circulaire\n- Texte optionnel personnalisable\n- Taille adaptative\n- Utilisable en standalone ou intégré dans d'autres composants\n\n## Cas d'usage\n\n- Chargement de données depuis une API\n- Attente lors de soumission de formulaire\n- États de chargement de page ou section\n- Feedback visuel pendant traitements longs\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/957e2a-chargement-loader)\n        `,\n      },\n    },\n  },\n};\n\nexport default meta;\n\nfunction htmlContent(slot) {\n  return /* HTML */ `${slot}`;\n}\n\nconst Template: StoryFn = args => {\n  const element = document.createElement(elementTag);\n  const hasSlot = false;\n  const slottedLabel = 'label';\n\n  Object.entries(args).forEach(([key, val]) => {\n    if (key.startsWith('on')) {\n      element.addEventListener(key.substring(2).toLowerCase(), val);\n    } else {\n      if (key !== slottedLabel) {\n        element.setAttribute(toKebabCase(key), val as string);\n      }\n    }\n  });\n\n  if (hasSlot) {\n    element.innerHTML = htmlContent(args[slottedLabel]);\n  }\n\n  return element;\n};\n\nexport const Default = Template.bind({});\nexport const WithoutText = Template.bind({});\nDefault.args = {};\nWithoutText.args = {\n  text: '',\n};\n\nDefault.parameters = {\n  docs: {\n    description: {\n      story: `Loader par défaut avec texte de chargement. Cas d'usage : chargement de contenu, traitement de données, attente de réponse serveur.`,\n    },\n  },\n};\n\nWithoutText.parameters = {\n  docs: {\n    description: {\n      story: `Loader sans texte, version minimaliste. Cas d'usage : chargement dans des espaces restreints, indicateurs compacts, intégration dans boutons.`,\n    },\n  },\n};\n"]}

package/dist/collection/stories/components/spw-pagination/spw-pagination.stories.js

@@ -20,7 +20,29 @@ const meta = {
                 component: `
 <strong class="mr-2">Statut du composant :</strong> <spw-tag size="small" variant="green">Prêt</spw-tag>
 
-Permet de naviguer entre différentes pages d'un contenu divisé.
+Le composant Pagination permet aux utilisateurs de naviguer entre différentes pages d'un contenu divisé. Il affiche les numéros de pages cliquables avec indicateur de page active.
+
+## Variantes disponibles
+
+- **default** : Pagination avec boutons de numéros de page
+- **input** : Pagination avec champ de saisie directe
+
+## Fonctionnalités
+
+- Navigation par boutons précédent/suivant
+- Numéros de pages cliquables
+- Indicateur de page active
+- Saisie directe du numéro de page
+- Calcul automatique du nombre de pages
+- Événements de changement de page
+- Gestion d'ellipsis pour nombreuses pages
+
+## Cas d'usage
+
+- Navigation dans listes de résultats
+- Pagination de tableaux de données
+- Navigation dans articles ou actualités
+- Résultats de recherche étendus
 
 [<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/0281c1-pagination)
         `,
@@ -72,4 +94,18 @@ Input.args = {
     variant: 'input',
     label: '',
 };
+Default.parameters = {
+    docs: {
+        description: {
+            story: `Pagination par défaut avec boutons de numéros de page. Navigation par clic sur numéros ou flèches précédent/suivant. Cas d'usage : listes de résultats, tableaux de données, navigation standard multi-pages.`,
+        },
+    },
+};
+Input.parameters = {
+    docs: {
+        description: {
+            story: `Pagination avec champ de saisie directe. Permet de saisir directement le numéro de page souhaité pour accès rapide. Cas d'usage : longs résultats avec nombreuses pages, navigation rapide vers page spécifique, tableaux étendus nécessitant accès direct.`,
+        },
+    },
+};
 //# sourceMappingURL=spw-pagination.stories.js.map

package/dist/collection/stories/components/spw-pagination/spw-pagination.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"spw-pagination.stories.js","sourceRoot":"","sources":["../../../../src/stories/components/spw-pagination/spw-pagination.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, toKebabCase } from '@utils/utils';\n\nconst elementTag = 'spw-pagination';\n\nconst argTypes = withComponentControls(componentsData, { tag: elementTag });\n\nconst meta: Meta = {\n  title: 'Composants/Pagination',\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\nPermet de naviguer entre différentes pages d'un contenu divisé.\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/0281c1-pagination)\n        `,\n      },\n    },\n  },\n};\n\nexport default meta;\n\nfunction htmlContent(slot) {\n  return /* HTML */ `${slot}`;\n}\n\nconst Template: StoryFn = args => {\n  const element = document.createElement(elementTag);\n  const hasSlot = true;\n  const slottedLabel = 'label';\n\n  const controls = withComponentControls(componentsData, { tag: elementTag }) || {};\n  const realProps = controls.__realProps || [];\n  const methods = controls.__methods || [];\n  const events = controls.__events || [];\n\n  Object.entries(args).forEach(([key, val]) => {\n    if (methods.includes(key)) {\n      return;\n    }\n\n    if (key.startsWith('on') || events.includes(key)) {\n      const eventName = key.startsWith('on') ? key.substring(2).toLowerCase() : key.replace(/^on/, '').toLowerCase();\n      element.addEventListener(eventName, val);\n    } else if (realProps.includes(key)) {\n      if (key !== slottedLabel) {\n        element.setAttribute(toKebabCase(key), val as string);\n      }\n    }\n  });\n\n  if (hasSlot) {\n    element.innerHTML = htmlContent(args[slottedLabel]);\n  }\n\n  return element;\n};\n\nexport const Default = Template.bind({});\nDefault.args = {\n  totalItems: 90,\n  itemsPerPage: 10,\n  label: '',\n};\nexport const Input = Template.bind({});\nInput.args = {\n  totalItems: 90,\n  itemsPerPage: 10,\n  variant: 'input',\n  label: '',\n};\n"]}
+{"version":3,"file":"spw-pagination.stories.js","sourceRoot":"","sources":["../../../../src/stories/components/spw-pagination/spw-pagination.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, toKebabCase } from '@utils/utils';\n\nconst elementTag = 'spw-pagination';\n\nconst argTypes = withComponentControls(componentsData, { tag: elementTag });\n\nconst meta: Meta = {\n  title: 'Composants/Pagination',\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\nLe composant Pagination permet aux utilisateurs de naviguer entre différentes pages d'un contenu divisé. Il affiche les numéros de pages cliquables avec indicateur de page active.\n\n## Variantes disponibles\n\n- **default** : Pagination avec boutons de numéros de page\n- **input** : Pagination avec champ de saisie directe\n\n## Fonctionnalités\n\n- Navigation par boutons précédent/suivant\n- Numéros de pages cliquables\n- Indicateur de page active\n- Saisie directe du numéro de page\n- Calcul automatique du nombre de pages\n- Événements de changement de page\n- Gestion d'ellipsis pour nombreuses pages\n\n## Cas d'usage\n\n- Navigation dans listes de résultats\n- Pagination de tableaux de données\n- Navigation dans articles ou actualités\n- Résultats de recherche étendus\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/0281c1-pagination)\n        `,\n      },\n    },\n  },\n};\n\nexport default meta;\n\nfunction htmlContent(slot) {\n  return /* HTML */ `${slot}`;\n}\n\nconst Template: StoryFn = args => {\n  const element = document.createElement(elementTag);\n  const hasSlot = true;\n  const slottedLabel = 'label';\n\n  const controls = withComponentControls(componentsData, { tag: elementTag }) || {};\n  const realProps = controls.__realProps || [];\n  const methods = controls.__methods || [];\n  const events = controls.__events || [];\n\n  Object.entries(args).forEach(([key, val]) => {\n    if (methods.includes(key)) {\n      return;\n    }\n\n    if (key.startsWith('on') || events.includes(key)) {\n      const eventName = key.startsWith('on') ? key.substring(2).toLowerCase() : key.replace(/^on/, '').toLowerCase();\n      element.addEventListener(eventName, val);\n    } else if (realProps.includes(key)) {\n      if (key !== slottedLabel) {\n        element.setAttribute(toKebabCase(key), val as string);\n      }\n    }\n  });\n\n  if (hasSlot) {\n    element.innerHTML = htmlContent(args[slottedLabel]);\n  }\n\n  return element;\n};\n\nexport const Default = Template.bind({});\nDefault.args = {\n  totalItems: 90,\n  itemsPerPage: 10,\n  label: '',\n};\nexport const Input = Template.bind({});\nInput.args = {\n  totalItems: 90,\n  itemsPerPage: 10,\n  variant: 'input',\n  label: '',\n};\n\nDefault.parameters = {\n  docs: {\n    description: {\n      story: `Pagination par défaut avec boutons de numéros de page. Navigation par clic sur numéros ou flèches précédent/suivant. Cas d'usage : listes de résultats, tableaux de données, navigation standard multi-pages.`,\n    },\n  },\n};\n\nInput.parameters = {\n  docs: {\n    description: {\n      story: `Pagination avec champ de saisie directe. Permet de saisir directement le numéro de page souhaité pour accès rapide. Cas d'usage : longs résultats avec nombreuses pages, navigation rapide vers page spécifique, tableaux étendus nécessitant accès direct.`,\n    },\n  },\n};\n"]}

package/dist/collection/stories/components/spw-radio/spw-radio.stories.js

@@ -21,7 +21,23 @@ const meta = {
                 component: `
 <strong class="mr-2">Statut du composant :</strong> <spw-tag size="small" variant="green">Prêt</spw-tag>
 
-Les boutons radio permettent à l’utilisateur de sélectionner une seule option dans une liste.
+Le composant Radio permet aux utilisateurs de sélectionner une seule option parmi plusieurs choix mutuellement exclusifs. Contrairement aux checkboxes, un seul bouton radio peut être sélectionné à la fois dans un groupe.
+
+## Fonctionnalités
+
+- Sélection unique dans un groupe
+- Label associé cliquable
+- Groupement avec spw-group
+- États sélectionné et non sélectionné
+- États disabled et error
+- Support du clavier et accessibilité ARIA
+- Navigation au clavier entre options
+
+## Cas d'usage
+
+- Options mutuellement exclusives
+- Paramètres de configuration uniques
+- Questions à choix unique dans formulaires
 
 [<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/03147d-bouton-radio)
         `,

package/dist/collection/stories/components/spw-radio/spw-radio.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"spw-radio.stories.js","sourceRoot":"","sources":["../../../../src/stories/components/spw-radio/spw-radio.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,WAAW,CAAC;AAE/B,MAAM,gBAAgB,GAAG,CAAC,WAAW,CAAC,CAAC;AAEvC,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,uCAAuC;IAC9C,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;IAClB,OAAO,UAAU,CAAC;;;GAGjB,CAAC;AACJ,CAAC;AAED,MAAM,QAAQ,GAAY,IAAI,CAAC,EAAE;IAC/B,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACnD,MAAM,OAAO,GAAG,IAAI,CAAC;IAErB,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,IAAI,OAAO,EAAE,CAAC;QACZ,OAAO,CAAC,SAAS,GAAG,WAAW,EAAE,CAAC;IACpC,CAAC;IAED,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,KAAK,EAAE,WAAW;IAClB,IAAI,EAAE,YAAY;IAClB,IAAI,EAAE,OAAO;CACd,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-group';\n\nconst subComponentTags = ['spw-radio'];\n\nconst argTypes = {\n  ...withComponentControls(componentsData, { tag: elementTag }),\n  ...extractArgTypes(componentsData, subComponentTags),\n};\n\nconst meta: Meta = {\n  title: 'Composants/Bouton radio (input radio)',\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\nLes boutons radio permettent à l’utilisateur de sélectionner une seule option dans une liste.\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/03147d-bouton-radio)\n        `,\n      },\n    },\n  },\n};\n\nexport default meta;\n\nfunction htmlContent() {\n  return /* HTML */ `\n    <spw-radio name=\"radio\" value=\"1\">Radio 1</spw-radio>\n    <spw-radio name=\"radio\" value=\"2\">Radio 2</spw-radio>\n  `;\n}\n\nconst Template: StoryFn = args => {\n  const element = document.createElement(elementTag);\n  const hasSlot = true;\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  if (hasSlot) {\n    element.innerHTML = htmlContent();\n  }\n\n  return element;\n};\n\nexport const Default = Template.bind({});\nDefault.args = {\n  label: 'Mon label',\n  type: 'checkboxes',\n  name: 'radio',\n};\n"]}
+{"version":3,"file":"spw-radio.stories.js","sourceRoot":"","sources":["../../../../src/stories/components/spw-radio/spw-radio.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,WAAW,CAAC;AAE/B,MAAM,gBAAgB,GAAG,CAAC,WAAW,CAAC,CAAC;AAEvC,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,uCAAuC;IAC9C,SAAS,EAAE,UAAU;IACrB,QAAQ;IACR,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,SAAS,EAAE;;;;;;;;;;;;;;;;;;;;;;SAsBV;aACF;SACF;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,SAAS,WAAW;IAClB,OAAO,UAAU,CAAC;;;GAGjB,CAAC;AACJ,CAAC;AAED,MAAM,QAAQ,GAAY,IAAI,CAAC,EAAE;IAC/B,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACnD,MAAM,OAAO,GAAG,IAAI,CAAC;IAErB,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,IAAI,OAAO,EAAE,CAAC;QACZ,OAAO,CAAC,SAAS,GAAG,WAAW,EAAE,CAAC;IACpC,CAAC;IAED,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,KAAK,EAAE,WAAW;IAClB,IAAI,EAAE,YAAY;IAClB,IAAI,EAAE,OAAO;CACd,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-group';\n\nconst subComponentTags = ['spw-radio'];\n\nconst argTypes = {\n  ...withComponentControls(componentsData, { tag: elementTag }),\n  ...extractArgTypes(componentsData, subComponentTags),\n};\n\nconst meta: Meta = {\n  title: 'Composants/Bouton radio (input radio)',\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\nLe composant Radio permet aux utilisateurs de sélectionner une seule option parmi plusieurs choix mutuellement exclusifs. Contrairement aux checkboxes, un seul bouton radio peut être sélectionné à la fois dans un groupe.\n\n## Fonctionnalités\n\n- Sélection unique dans un groupe\n- Label associé cliquable\n- Groupement avec spw-group\n- États sélectionné et non sélectionné\n- États disabled et error\n- Support du clavier et accessibilité ARIA\n- Navigation au clavier entre options\n\n## Cas d'usage\n\n- Options mutuellement exclusives\n- Paramètres de configuration uniques\n- Questions à choix unique dans formulaires\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/03147d-bouton-radio)\n        `,\n      },\n    },\n  },\n};\n\nexport default meta;\n\nfunction htmlContent() {\n  return /* HTML */ `\n    <spw-radio name=\"radio\" value=\"1\">Radio 1</spw-radio>\n    <spw-radio name=\"radio\" value=\"2\">Radio 2</spw-radio>\n  `;\n}\n\nconst Template: StoryFn = args => {\n  const element = document.createElement(elementTag);\n  const hasSlot = true;\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  if (hasSlot) {\n    element.innerHTML = htmlContent();\n  }\n\n  return element;\n};\n\nexport const Default = Template.bind({});\nDefault.args = {\n  label: 'Mon label',\n  type: 'checkboxes',\n  name: 'radio',\n};\n"]}

package/dist/collection/stories/components/spw-search-field/spw-search-field.stories.js

@@ -20,7 +20,32 @@ const meta = {
                 component: `
 <strong class="mr-2">Statut du composant :</strong> <spw-tag size="small" variant="green">Prêt</spw-tag>
 
-Permet d'entrer un mot-clé ou une expression et d'obtenir des informations pertinentes.
+Le composant Search Field permet aux utilisateurs d'effectuer des recherches avec autocomplétion et suggestions. Il propose des résultats en temps réel pendant la saisie et peut inclure un bouton de soumission.
+
+## Variantes disponibles
+
+- **default** : Champ standard avec suggestions
+- **rounded** : Version arrondie pour hero banners
+
+## Fonctionnalités
+
+- Autocomplétion avec suggestions dynamiques
+- Bouton de soumission optionnel
+- Lien vers tous les résultats
+- Tailles configurables (small, medium, large)
+- État désactivé
+- Label et texte d'assistance
+- Catégorisation des résultats
+- Champ requis
+
+## Cas d'usage
+
+- Recherche globale dans applications
+- Barre de recherche dans hero banners
+- Recherche avec suggestions dans formulaires
+- Filtrage avec autocomplétion
+- Recherche de contenu ou produits
+- Moteur de recherche interne
 
 [<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/9384eb-champ-de-recherche-search-input)
         `,
@@ -66,6 +91,13 @@ Default.args = {
     placeholder: 'Rechercher...',
     items: defaultItems,
 };
+Default.parameters = {
+    docs: {
+        description: {
+            story: `Champ de recherche par défaut avec suggestions. Affiche les résultats correspondants pendant la saisie. Cas d'usage : recherche simple dans applications, filtrage avec autocomplétion, recherche de contenu.`,
+        },
+    },
+};
 export const ViewMore = Template.bind({});
 ViewMore.args = {
     size: 'medium',

package/dist/collection/stories/components/spw-search-field/spw-search-field.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"spw-search-field.stories.js","sourceRoot":"","sources":["../../../../src/stories/components/spw-search-field/spw-search-field.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, toKebabCase } from '@utils/utils';\n\nconst elementTag = 'spw-search-field';\n\nconst argTypes = withComponentControls(componentsData, { tag: elementTag });\n\nconst meta: Meta = {\n  title: 'Composants/Champ de recherche (input search)',\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\nPermet d'entrer un mot-clé ou une expression et d'obtenir des informations pertinentes.\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/9384eb-champ-de-recherche-search-input)\n        `,\n      },\n    },\n  },\n};\n\nexport default meta;\n\nfunction htmlContent(slot) {\n  return /* HTML */ `${slot}`;\n}\n\nconst Template: StoryFn = args => {\n  const element = document.createElement(elementTag);\n  const hasSlot = false;\n  const slottedLabel = 'content';\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  if (hasSlot) {\n    element.innerHTML = htmlContent(args[slottedLabel]);\n  }\n\n  return element;\n};\n\nconst defaultItems = JSON.stringify([\n  { label: 'Primes habitation' },\n  { label: 'Primes énergie' },\n  { label: 'Aides au logement' },\n  { label: 'Rénovation' },\n  { label: 'Isolation' },\n  { label: 'Panneaux solaires' },\n]);\n\nexport const Default = Template.bind({});\nDefault.args = {\n  size: 'medium',\n  name: 'search-basic',\n  placeholder: 'Rechercher...',\n  items: defaultItems,\n};\n\nexport const ViewMore = Template.bind({});\nViewMore.args = {\n  size: 'medium',\n  name: 'search-with-links',\n  placeholder: 'Rechercher une page...',\n  viewAllResults: 'Voir tous les résultats',\n  viewAllResultsLink: '/search',\n  items: defaultItems,\n};\nViewMore.parameters = {\n  docs: {\n    description: {\n      story: 'Champ de recherche avec des éléments cliquables et un lien vers tous les résultats.',\n    },\n  },\n};\n\nexport const FormSubmission = Template.bind({});\nFormSubmission.args = {\n  size: 'medium',\n  name: 'q',\n  placeholder: 'Exemple : primes habitation...',\n  hasSubmitButton: true,\n  items: defaultItems,\n};\nFormSubmission.parameters = {\n  docs: {\n    description: {\n      story: 'Formulaire avec champ de recherche incluant un bouton de soumission (loupe). La valeur est récupérée via FormData.',\n    },\n  },\n};\n\nexport const HeroRounded = Template.bind({});\nHeroRounded.args = {\n  size: 'large',\n  name: 'search-hero',\n  placeholder: 'Que cherchez-vous ?',\n  hasSubmitButton: true,\n  isRounded: true,\n  viewAllResults: 'Voir plus de résultats',\n  viewAllResultsLink: '/search',\n  items: JSON.stringify([\n    { label: 'Primes et aides', category: 'Services' },\n    { label: 'Emploi et formation', category: 'Travail' },\n    { label: 'Mobilité', category: 'Transport' },\n    { label: 'Environnement', category: 'Nature' },\n    { label: 'Santé', category: 'Bien-être' },\n    { label: 'Culture', category: 'Loisirs' },\n  ]),\n};\nHeroRounded.parameters = {\n  docs: {\n    description: {\n      story: 'Version grande taille avec coins arrondis, idéale pour les hero banners.',\n    },\n  },\n};\n\nexport const WithLabelAndHelp = Template.bind({});\nWithLabelAndHelp.args = {\n  size: 'medium',\n  name: 'search-required',\n  label: 'Recherche obligatoire',\n  placeholder: 'Saisissez votre recherche...',\n  required: true,\n  assistiveText: 'Veuillez saisir au moins 3 caractères pour lancer la recherche.',\n  items: JSON.stringify([{ label: 'Option 1' }, { label: 'Option 2' }, { label: 'Option 3' }]),\n};\nWithLabelAndHelp.parameters = {\n  docs: {\n    description: {\n      story: \"Champ de recherche requis avec un texte d'aide affiché sous le champ.\",\n    },\n  },\n};\n\nexport const Disabled = Template.bind({});\nDisabled.args = {\n  size: 'medium',\n  name: 'search-disabled',\n  placeholder: 'Champ désactivé...',\n  disabled: true,\n  items: JSON.stringify([{ label: 'Non disponible' }]),\n};\nDisabled.parameters = {\n  docs: {\n    description: {\n      story: 'État désactivé du composant.',\n    },\n  },\n};\n"]}
+{"version":3,"file":"spw-search-field.stories.js","sourceRoot":"","sources":["../../../../src/stories/components/spw-search-field/spw-search-field.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, toKebabCase } from '@utils/utils';\n\nconst elementTag = 'spw-search-field';\n\nconst argTypes = withComponentControls(componentsData, { tag: elementTag });\n\nconst meta: Meta = {\n  title: 'Composants/Champ de recherche (input search)',\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\nLe composant Search Field permet aux utilisateurs d'effectuer des recherches avec autocomplétion et suggestions. Il propose des résultats en temps réel pendant la saisie et peut inclure un bouton de soumission.\n\n## Variantes disponibles\n\n- **default** : Champ standard avec suggestions\n- **rounded** : Version arrondie pour hero banners\n\n## Fonctionnalités\n\n- Autocomplétion avec suggestions dynamiques\n- Bouton de soumission optionnel\n- Lien vers tous les résultats\n- Tailles configurables (small, medium, large)\n- État désactivé\n- Label et texte d'assistance\n- Catégorisation des résultats\n- Champ requis\n\n## Cas d'usage\n\n- Recherche globale dans applications\n- Barre de recherche dans hero banners\n- Recherche avec suggestions dans formulaires\n- Filtrage avec autocomplétion\n- Recherche de contenu ou produits\n- Moteur de recherche interne\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/9384eb-champ-de-recherche-search-input)\n        `,\n      },\n    },\n  },\n};\n\nexport default meta;\n\nfunction htmlContent(slot) {\n  return /* HTML */ `${slot}`;\n}\n\nconst Template: StoryFn = args => {\n  const element = document.createElement(elementTag);\n  const hasSlot = false;\n  const slottedLabel = 'content';\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  if (hasSlot) {\n    element.innerHTML = htmlContent(args[slottedLabel]);\n  }\n\n  return element;\n};\n\nconst defaultItems = JSON.stringify([\n  { label: 'Primes habitation' },\n  { label: 'Primes énergie' },\n  { label: 'Aides au logement' },\n  { label: 'Rénovation' },\n  { label: 'Isolation' },\n  { label: 'Panneaux solaires' },\n]);\n\nexport const Default = Template.bind({});\nDefault.args = {\n  size: 'medium',\n  name: 'search-basic',\n  placeholder: 'Rechercher...',\n  items: defaultItems,\n};\n\nDefault.parameters = {\n  docs: {\n    description: {\n      story: `Champ de recherche par défaut avec suggestions. Affiche les résultats correspondants pendant la saisie. Cas d'usage : recherche simple dans applications, filtrage avec autocomplétion, recherche de contenu.`,\n    },\n  },\n};\n\nexport const ViewMore = Template.bind({});\nViewMore.args = {\n  size: 'medium',\n  name: 'search-with-links',\n  placeholder: 'Rechercher une page...',\n  viewAllResults: 'Voir tous les résultats',\n  viewAllResultsLink: '/search',\n  items: defaultItems,\n};\nViewMore.parameters = {\n  docs: {\n    description: {\n      story: 'Champ de recherche avec des éléments cliquables et un lien vers tous les résultats.',\n    },\n  },\n};\n\nexport const FormSubmission = Template.bind({});\nFormSubmission.args = {\n  size: 'medium',\n  name: 'q',\n  placeholder: 'Exemple : primes habitation...',\n  hasSubmitButton: true,\n  items: defaultItems,\n};\nFormSubmission.parameters = {\n  docs: {\n    description: {\n      story: 'Formulaire avec champ de recherche incluant un bouton de soumission (loupe). La valeur est récupérée via FormData.',\n    },\n  },\n};\n\nexport const HeroRounded = Template.bind({});\nHeroRounded.args = {\n  size: 'large',\n  name: 'search-hero',\n  placeholder: 'Que cherchez-vous ?',\n  hasSubmitButton: true,\n  isRounded: true,\n  viewAllResults: 'Voir plus de résultats',\n  viewAllResultsLink: '/search',\n  items: JSON.stringify([\n    { label: 'Primes et aides', category: 'Services' },\n    { label: 'Emploi et formation', category: 'Travail' },\n    { label: 'Mobilité', category: 'Transport' },\n    { label: 'Environnement', category: 'Nature' },\n    { label: 'Santé', category: 'Bien-être' },\n    { label: 'Culture', category: 'Loisirs' },\n  ]),\n};\nHeroRounded.parameters = {\n  docs: {\n    description: {\n      story: 'Version grande taille avec coins arrondis, idéale pour les hero banners.',\n    },\n  },\n};\n\nexport const WithLabelAndHelp = Template.bind({});\nWithLabelAndHelp.args = {\n  size: 'medium',\n  name: 'search-required',\n  label: 'Recherche obligatoire',\n  placeholder: 'Saisissez votre recherche...',\n  required: true,\n  assistiveText: 'Veuillez saisir au moins 3 caractères pour lancer la recherche.',\n  items: JSON.stringify([{ label: 'Option 1' }, { label: 'Option 2' }, { label: 'Option 3' }]),\n};\nWithLabelAndHelp.parameters = {\n  docs: {\n    description: {\n      story: \"Champ de recherche requis avec un texte d'aide affiché sous le champ.\",\n    },\n  },\n};\n\nexport const Disabled = Template.bind({});\nDisabled.args = {\n  size: 'medium',\n  name: 'search-disabled',\n  placeholder: 'Champ désactivé...',\n  disabled: true,\n  items: JSON.stringify([{ label: 'Non disponible' }]),\n};\nDisabled.parameters = {\n  docs: {\n    description: {\n      story: 'État désactivé du composant.',\n    },\n  },\n};\n"]}

package/dist/collection/stories/components/spw-select/spw-select.stories.js

@@ -20,7 +20,25 @@ const meta = {
                 component: `
 <strong class="mr-2">Statut du composant :</strong> <spw-tag size="small" variant="green">Prêt</spw-tag>
 
-Autorise les utilisateurs à choisir une option dans une liste de plusieurs options.
+Le composant Select permet aux utilisateurs de choisir une option dans une liste déroulante. Version native HTML stylisée, il offre une expérience familière et accessible pour la sélection simple.
+
+## Fonctionnalités
+
+- Liste déroulante native HTML
+- Label et placeholder configurables
+- Texte d'assistance avec icône optionnelle
+- États de validation (erreur, succès)
+- Champ requis avec indicateur
+- Support des options groupées (optgroup)
+- Navigation au clavier native
+
+## Cas d'usage
+
+- Choix de catégorie ou type
+- Filtres avec options prédéfinies
+- Formulaires avec listes de valeurs
+- Paramètres de configuration simples
+- Sélection dans listes courtes
 
 [<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/7029dd-champ-de-selection-select)
         `,

package/dist/collection/stories/components/spw-select/spw-select.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"spw-select.stories.js","sourceRoot":"","sources":["../../../../src/stories/components/spw-select/spw-select.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,YAAY,CAAC;AAEhC,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,SAAS,WAAW;IAClB,OAAO,UAAU,CAAC;;;;GAIjB,CAAC;AACJ,CAAC;AAED,MAAM,QAAQ,GAAY,IAAI,CAAC,EAAE;IAC/B,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACnD,MAAM,OAAO,GAAG,IAAI,CAAC;IAErB,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,IAAI,OAAO,EAAE,CAAC;QACZ,OAAO,CAAC,SAAS,GAAG,WAAW,EAAE,CAAC;IACpC,CAAC;IAED,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,WAAW,EAAE,iBAAiB;IAC9B,KAAK,EAAE,WAAW;IAClB,IAAI,EAAE,QAAQ;IACd,IAAI,EAAE,wBAAwB;IAC9B,QAAQ,EAAE,IAAI;IACd,YAAY,EAAE,KAAK;CACpB,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-select';\n\nconst argTypes = withComponentControls(componentsData, { tag: elementTag });\n\nconst meta: Meta = {\n  title: 'Composants/Champ de sélection (select)',\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\nAutorise les utilisateurs à choisir une option dans une liste de plusieurs options.\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/7029dd-champ-de-selection-select)\n        `,\n      },\n    },\n  },\n};\n\nexport default meta;\n\nfunction htmlContent() {\n  return /* HTML */ `\n    <option>Option 1</option>\n    <option>Option 2</option>\n    <option>Option 3</option>\n  `;\n}\n\nconst Template: StoryFn = args => {\n  const element = document.createElement(elementTag);\n  const hasSlot = true;\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  if (hasSlot) {\n    element.innerHTML = htmlContent();\n  }\n\n  return element;\n};\n\nexport const Default = Template.bind({});\nDefault.args = {\n  placeholder: 'Mon placeholder',\n  label: 'Mon label',\n  name: 'select',\n  hint: \"Mon texte d'assistance\",\n  required: true,\n  showHintIcon: false,\n};\n"]}
+{"version":3,"file":"spw-select.stories.js","sourceRoot":"","sources":["../../../../src/stories/components/spw-select/spw-select.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,YAAY,CAAC;AAEhC,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;;;;;;;;;;;;;;;;;;;;;;;;SAwBV;aACF;SACF;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,SAAS,WAAW;IAClB,OAAO,UAAU,CAAC;;;;GAIjB,CAAC;AACJ,CAAC;AAED,MAAM,QAAQ,GAAY,IAAI,CAAC,EAAE;IAC/B,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACnD,MAAM,OAAO,GAAG,IAAI,CAAC;IAErB,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,IAAI,OAAO,EAAE,CAAC;QACZ,OAAO,CAAC,SAAS,GAAG,WAAW,EAAE,CAAC;IACpC,CAAC;IAED,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,WAAW,EAAE,iBAAiB;IAC9B,KAAK,EAAE,WAAW;IAClB,IAAI,EAAE,QAAQ;IACd,IAAI,EAAE,wBAAwB;IAC9B,QAAQ,EAAE,IAAI;IACd,YAAY,EAAE,KAAK;CACpB,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-select';\n\nconst argTypes = withComponentControls(componentsData, { tag: elementTag });\n\nconst meta: Meta = {\n  title: 'Composants/Champ de sélection (select)',\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\nLe composant Select permet aux utilisateurs de choisir une option dans une liste déroulante. Version native HTML stylisée, il offre une expérience familière et accessible pour la sélection simple.\n\n## Fonctionnalités\n\n- Liste déroulante native HTML\n- Label et placeholder configurables\n- Texte d'assistance avec icône optionnelle\n- États de validation (erreur, succès)\n- Champ requis avec indicateur\n- Support des options groupées (optgroup)\n- Navigation au clavier native\n\n## Cas d'usage\n\n- Choix de catégorie ou type\n- Filtres avec options prédéfinies\n- Formulaires avec listes de valeurs\n- Paramètres de configuration simples\n- Sélection dans listes courtes\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/7029dd-champ-de-selection-select)\n        `,\n      },\n    },\n  },\n};\n\nexport default meta;\n\nfunction htmlContent() {\n  return /* HTML */ `\n    <option>Option 1</option>\n    <option>Option 2</option>\n    <option>Option 3</option>\n  `;\n}\n\nconst Template: StoryFn = args => {\n  const element = document.createElement(elementTag);\n  const hasSlot = true;\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  if (hasSlot) {\n    element.innerHTML = htmlContent();\n  }\n\n  return element;\n};\n\nexport const Default = Template.bind({});\nDefault.args = {\n  placeholder: 'Mon placeholder',\n  label: 'Mon label',\n  name: 'select',\n  hint: \"Mon texte d'assistance\",\n  required: true,\n  showHintIcon: false,\n};\n"]}

package/dist/collection/stories/components/spw-separator/spw-separator.stories.js

@@ -20,7 +20,25 @@ const meta = {
                 component: `
 <strong class="mr-2">Statut du composant :</strong> <spw-tag size="small" variant="green">Prêt</spw-tag>
 
-Sert à séparer visuellement le contenu d’une page.
+Le composant Separator (divider) permet de créer des séparations visuelles entre différentes sections de contenu. Il améliore la lisibilité et structure l'information de manière claire.
+
+## Variantes disponibles
+
+- **horizontal** : Séparation horizontale (par défaut)
+- **vertical** : Séparation verticale pour layouts en ligne
+
+## Fonctionnalités
+
+- Direction configurable (horizontal ou vertical)
+- Épaisseur personnalisable
+- Hauteur ajustable pour séparateurs verticaux
+
+## Cas d'usage
+
+- Séparation de sections dans une page
+- Délimitation de zones de contenu
+- Division d'éléments dans une toolbar
+- Séparation visuelle dans des listes ou cartes
 
 [<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/381355-separateur)
         `,
@@ -62,4 +80,18 @@ Vertical.args = {
     thickness: '1',
     height: '50',
 };
+Horizontal.parameters = {
+    docs: {
+        description: {
+            story: `Séparateur horizontal pour diviser verticalement le contenu. Cas d'usage : séparation de sections, espacement entre blocs de contenu.`,
+        },
+    },
+};
+Vertical.parameters = {
+    docs: {
+        description: {
+            story: `Séparateur vertical pour diviser horizontalement le contenu. Cas d'usage : séparation d'éléments dans une toolbar, division de colonnes, espacement latéral.`,
+        },
+    },
+};
 //# sourceMappingURL=spw-separator.stories.js.map

package/dist/collection/stories/components/spw-separator/spw-separator.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"spw-separator.stories.js","sourceRoot":"","sources":["../../../../src/stories/components/spw-separator/spw-separator.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,eAAe,CAAC;AAEnC,MAAM,QAAQ,GAAG,qBAAqB,CAAC,cAAc,EAAE,EAAE,GAAG,EAAE,UAAU,EAAE,CAAC,CAAC;AAE5E,MAAM,IAAI,GAAS;IACjB,KAAK,EAAE,iCAAiC;IACxC,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,IAAI;IACvB,OAAO,UAAU,CAAC,GAAG,IAAI,EAAE,CAAC;AAC9B,CAAC;AAED,MAAM,QAAQ,GAAY,IAAI,CAAC,EAAE;IAC/B,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACnD,MAAM,OAAO,GAAG,KAAK,CAAC;IACtB,MAAM,YAAY,GAAG,OAAO,CAAC;IAE7B,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,EAAE,EAAE;QAC1C,IAAI,GAAG,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC;YACzB,OAAO,CAAC,gBAAgB,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,EAAE,GAAG,CAAC,CAAC;QAChE,CAAC;aAAM,CAAC;YACN,IAAI,GAAG,KAAK,YAAY,EAAE,CAAC;gBACzB,OAAO,CAAC,YAAY,CAAC,WAAW,CAAC,GAAG,CAAC,EAAE,GAAa,CAAC,CAAC;YACxD,CAAC;QACH,CAAC;IACH,CAAC,CAAC,CAAC;IAEH,IAAI,OAAO,EAAE,CAAC;QACZ,OAAO,CAAC,SAAS,GAAG,WAAW,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;IACtD,CAAC;IAED,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC5C,UAAU,CAAC,IAAI,GAAG;IAChB,SAAS,EAAE,YAAY;IACvB,SAAS,EAAE,GAAG;CACf,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC1C,QAAQ,CAAC,IAAI,GAAG;IACd,SAAS,EAAE,UAAU;IACrB,SAAS,EAAE,GAAG;IACd,MAAM,EAAE,IAAI;CACb,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-separator';\n\nconst argTypes = withComponentControls(componentsData, { tag: elementTag });\n\nconst meta: Meta = {\n  title: 'Composants/Séparateur (divider)',\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\nSert à séparer visuellement le contenu d’une page.\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/381355-separateur)\n        `,\n      },\n    },\n  },\n};\n\nexport default meta;\n\nfunction htmlContent(slot) {\n  return /* HTML */ `${slot}`;\n}\n\nconst Template: StoryFn = args => {\n  const element = document.createElement(elementTag);\n  const hasSlot = false;\n  const slottedLabel = 'label';\n\n  Object.entries(args).forEach(([key, val]) => {\n    if (key.startsWith('on')) {\n      element.addEventListener(key.substring(2).toLowerCase(), val);\n    } else {\n      if (key !== slottedLabel) {\n        element.setAttribute(toKebabCase(key), val as string);\n      }\n    }\n  });\n\n  if (hasSlot) {\n    element.innerHTML = htmlContent(args[slottedLabel]);\n  }\n\n  return element;\n};\n\nexport const Horizontal = Template.bind({});\nHorizontal.args = {\n  direction: 'horizontal',\n  thickness: '1',\n};\n\nexport const Vertical = Template.bind({});\nVertical.args = {\n  direction: 'vertical',\n  thickness: '1',\n  height: '50',\n};\n"]}
+{"version":3,"file":"spw-separator.stories.js","sourceRoot":"","sources":["../../../../src/stories/components/spw-separator/spw-separator.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,eAAe,CAAC;AAEnC,MAAM,QAAQ,GAAG,qBAAqB,CAAC,cAAc,EAAE,EAAE,GAAG,EAAE,UAAU,EAAE,CAAC,CAAC;AAE5E,MAAM,IAAI,GAAS;IACjB,KAAK,EAAE,iCAAiC;IACxC,SAAS,EAAE,UAAU;IACrB,QAAQ;IACR,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,SAAS,EAAE;;;;;;;;;;;;;;;;;;;;;;;;SAwBV;aACF;SACF;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,SAAS,WAAW,CAAC,IAAI;IACvB,OAAO,UAAU,CAAC,GAAG,IAAI,EAAE,CAAC;AAC9B,CAAC;AAED,MAAM,QAAQ,GAAY,IAAI,CAAC,EAAE;IAC/B,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACnD,MAAM,OAAO,GAAG,KAAK,CAAC;IACtB,MAAM,YAAY,GAAG,OAAO,CAAC;IAE7B,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,EAAE,EAAE;QAC1C,IAAI,GAAG,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC;YACzB,OAAO,CAAC,gBAAgB,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,EAAE,GAAG,CAAC,CAAC;QAChE,CAAC;aAAM,CAAC;YACN,IAAI,GAAG,KAAK,YAAY,EAAE,CAAC;gBACzB,OAAO,CAAC,YAAY,CAAC,WAAW,CAAC,GAAG,CAAC,EAAE,GAAa,CAAC,CAAC;YACxD,CAAC;QACH,CAAC;IACH,CAAC,CAAC,CAAC;IAEH,IAAI,OAAO,EAAE,CAAC;QACZ,OAAO,CAAC,SAAS,GAAG,WAAW,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;IACtD,CAAC;IAED,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC5C,UAAU,CAAC,IAAI,GAAG;IAChB,SAAS,EAAE,YAAY;IACvB,SAAS,EAAE,GAAG;CACf,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC1C,QAAQ,CAAC,IAAI,GAAG;IACd,SAAS,EAAE,UAAU;IACrB,SAAS,EAAE,GAAG;IACd,MAAM,EAAE,IAAI;CACb,CAAC;AAEF,UAAU,CAAC,UAAU,GAAG;IACtB,IAAI,EAAE;QACJ,WAAW,EAAE;YACX,KAAK,EAAE,uIAAuI;SAC/I;KACF;CACF,CAAC;AAEF,QAAQ,CAAC,UAAU,GAAG;IACpB,IAAI,EAAE;QACJ,WAAW,EAAE;YACX,KAAK,EAAE,8JAA8J;SACtK;KACF;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-separator';\n\nconst argTypes = withComponentControls(componentsData, { tag: elementTag });\n\nconst meta: Meta = {\n  title: 'Composants/Séparateur (divider)',\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\nLe composant Separator (divider) permet de créer des séparations visuelles entre différentes sections de contenu. Il améliore la lisibilité et structure l'information de manière claire.\n\n## Variantes disponibles\n\n- **horizontal** : Séparation horizontale (par défaut)\n- **vertical** : Séparation verticale pour layouts en ligne\n\n## Fonctionnalités\n\n- Direction configurable (horizontal ou vertical)\n- Épaisseur personnalisable\n- Hauteur ajustable pour séparateurs verticaux\n\n## Cas d'usage\n\n- Séparation de sections dans une page\n- Délimitation de zones de contenu\n- Division d'éléments dans une toolbar\n- Séparation visuelle dans des listes ou cartes\n\n[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/381355-separateur)\n        `,\n      },\n    },\n  },\n};\n\nexport default meta;\n\nfunction htmlContent(slot) {\n  return /* HTML */ `${slot}`;\n}\n\nconst Template: StoryFn = args => {\n  const element = document.createElement(elementTag);\n  const hasSlot = false;\n  const slottedLabel = 'label';\n\n  Object.entries(args).forEach(([key, val]) => {\n    if (key.startsWith('on')) {\n      element.addEventListener(key.substring(2).toLowerCase(), val);\n    } else {\n      if (key !== slottedLabel) {\n        element.setAttribute(toKebabCase(key), val as string);\n      }\n    }\n  });\n\n  if (hasSlot) {\n    element.innerHTML = htmlContent(args[slottedLabel]);\n  }\n\n  return element;\n};\n\nexport const Horizontal = Template.bind({});\nHorizontal.args = {\n  direction: 'horizontal',\n  thickness: '1',\n};\n\nexport const Vertical = Template.bind({});\nVertical.args = {\n  direction: 'vertical',\n  thickness: '1',\n  height: '50',\n};\n\nHorizontal.parameters = {\n  docs: {\n    description: {\n      story: `Séparateur horizontal pour diviser verticalement le contenu. Cas d'usage : séparation de sections, espacement entre blocs de contenu.`,\n    },\n  },\n};\n\nVertical.parameters = {\n  docs: {\n    description: {\n      story: `Séparateur vertical pour diviser horizontalement le contenu. Cas d'usage : séparation d'éléments dans une toolbar, division de colonnes, espacement latéral.`,\n    },\n  },\n};\n"]}