@spw-ds/spw-stencil-library 0.0.1

package/dist/collection/utils/utils.js

@@ -0,0 +1,224 @@
+export function format(first, middle, last) {
+    return (first || '') + (middle ? ` ${middle}` : '') + (last ? ` ${last}` : '');
+}
+export function toKebabCase(str) {
+    return str.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
+}
+export function formatDate(date) {
+    const parts = date.split('-');
+    return `${parts[2]}.${parts[1]}.${parts[0]}`;
+}
+export function stripHtmlContent(content) {
+    const div = document.createElement('div');
+    div.innerHTML = content;
+    return div.textContent || div.innerText || '';
+}
+const description = (prop) => (prop.docs || '').trim();
+const isText = (prop) => prop.type === 'string';
+const isBoolean = (prop) => prop.type === 'boolean';
+const isEnum = (prop) => prop.type.includes('|');
+const isNumber = (prop) => prop.type === 'number';
+const enumOptions = (prop) => prop.type
+    .split('|')
+    .map(t => t.trim())
+    .map(t => (t === '""' ? 'default' : t))
+    .map(t => t.replace(/^"(.*)"$/, '$1'));
+const generateProp = (prop) => {
+    if (isText(prop)) {
+        return {
+            [prop.name]: {
+                control: 'text',
+                description: description(prop),
+                defaultValue: prop.default,
+                table: {
+                    category: 'properties',
+                    defaultValue: { summary: prop.default },
+                    type: { summary: 'string' },
+                },
+            },
+        };
+    }
+    if (isBoolean(prop)) {
+        return {
+            [prop.name]: {
+                control: 'boolean',
+                description: description(prop),
+                defaultValue: prop.default,
+                table: {
+                    category: 'properties',
+                    defaultValue: { summary: prop.default },
+                    type: { summary: 'boolean' },
+                },
+            },
+        };
+    }
+    if (isNumber(prop)) {
+        return {
+            [prop.name]: {
+                control: 'number',
+                description: description(prop),
+                defaultValue: prop.default,
+                table: {
+                    category: 'properties',
+                    defaultValue: { summary: prop.default },
+                    type: { summary: 'number' },
+                },
+            },
+        };
+    }
+    if (isEnum(prop)) {
+        return {
+            [prop.name]: {
+                control: 'select',
+                defaultValue: prop.default,
+                options: enumOptions(prop),
+                description: description(prop),
+                table: {
+                    category: 'properties',
+                    defaultValue: { summary: prop.default },
+                    type: { summary: 'enum' },
+                },
+            },
+        };
+    }
+    return {};
+};
+const generateProps = (props) => {
+    let args = {};
+    props.forEach(prop => (args = Object.assign(Object.assign({}, args), generateProp(prop))));
+    return args;
+};
+const generateEvent = (event) => {
+    function capitalizeFirstLetter(string) {
+        return string.charAt(0).toUpperCase() + string.slice(1);
+    }
+    return {
+        [`on${capitalizeFirstLetter(event.event)}`]: {
+            action: event.event,
+            description: description(event),
+            table: {
+                defaultValue: { summary: event.event },
+                category: 'events',
+                type: { summary: event.detail },
+            },
+        },
+    };
+};
+const generateEvents = (events) => {
+    let args = {};
+    events.forEach(event => (args = Object.assign(Object.assign({}, args), generateEvent(event))));
+    return args;
+};
+const extractComponentInfoByTag = (componentsData, tag) => {
+    const component = componentsData.components.find(c => c.tag === tag);
+    if (!component) {
+        console.error(`Component with tag ${tag} not found`);
+        return null;
+    }
+    const { props, events } = component;
+    const propInfo = props.map(prop => ({
+        name: prop.name,
+        type: prop.type,
+        docs: prop.docs,
+        default: prop.default || '',
+    }));
+    const eventInfo = events.map(event => ({
+        event: event.event,
+        docs: event.docs,
+        detail: event.detail,
+    }));
+    return {
+        name: tag,
+        props: propInfo,
+        events: eventInfo,
+    };
+};
+const generateHTMLTable = (componentInfo) => {
+    if (!componentInfo) {
+        return `<p>Component not found</p>`;
+    }
+    const { props, events } = componentInfo;
+    const propsRows = props
+        .map(prop => `
+    <tr>
+      <td>${prop.name}</td>
+      <td>${prop.type}</td>
+      <td>${prop.docs}</td>
+      <td>${prop.default}</td>
+    </tr>
+  `)
+        .join('');
+    const eventsRows = events
+        .map(event => `
+    <tr>
+      <td>${event.event}</td>
+      <td>${event.detail}</td>
+      <td>${event.docs}</td>
+    </tr>
+  `)
+        .join('');
+    return `
+    <h3>Propriétés</h3>
+    <table class="w-full">
+      <thead>
+        <tr>
+          <th>Propriété</th>
+          <th>Type</th>
+          <th>Description</th>
+          <th>Valeur par défaut</th>
+        </tr>
+      </thead>
+      <tbody>
+        ${propsRows}
+      </tbody>
+    </table>
+    <h3>Événements</h3>
+    <table class="w-full">
+      <thead>
+        <tr>
+          <th>Événement</th>
+          <th>Détail</th>
+          <th>Description</th>
+        </tr>
+      </thead>
+      <tbody>
+        ${eventsRows}
+      </tbody>
+    </table>
+  `;
+};
+export const generateComponentTable = (componentsData, tag) => {
+    const componentInfo = extractComponentInfoByTag(componentsData, tag);
+    return generateHTMLTable(componentInfo);
+};
+export const withComponentControls = (componentsData, { tag }) => {
+    const component = componentsData.components.find(c => c.tag === tag);
+    if (component) {
+        const props = component.props;
+        const events = component.events;
+        return Object.assign(Object.assign({}, generateProps(props)), generateEvents(events));
+    }
+    return {};
+};
+export function extractArgTypes(componentsData, subComponentTags) {
+    return subComponentTags.reduce((acc, tag) => {
+        const subComponentArgTypes = withComponentControls(componentsData, { tag });
+        return Object.assign(Object.assign({}, acc), subComponentArgTypes);
+    }, {});
+}
+export function formatFileSize(sizeInBytes) {
+    const sizeInMB = sizeInBytes / (1024 * 1024);
+    let formattedSize = sizeInMB.toFixed(2).replace('.', ',');
+    if (sizeInMB > 0 && sizeInMB < 0.01) {
+        formattedSize = '0,01';
+    }
+    else if (sizeInMB === 0) {
+        formattedSize = '0,00';
+    }
+    return `${formattedSize} Mo`;
+}
+export function hasSlotContent(el) {
+    const slot = el.querySelector('slot');
+    return slot && slot.assignedNodes().length > 0;
+}
+//# sourceMappingURL=utils.js.map

package/dist/collection/utils/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../src/utils/utils.ts"],"names":[],"mappings":"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","sourcesContent":["export function format(first: string, middle: string, last: string): string {\n  return (first || '') + (middle ? ` ${middle}` : '') + (last ? ` ${last}` : '');\n}\n\nexport function toKebabCase(str: string) {\n  return str.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();\n}\n\nexport function formatDate(date: string): string {\n  const parts = date.split('-');\n  return `${parts[2]}.${parts[1]}.${parts[0]}`;\n}\n\nexport function stripHtmlContent(content: string): string {\n  const div = document.createElement('div');\n  div.innerHTML = content;\n  return div.textContent || div.innerText || '';\n}\n\ninterface ComponentProp {\n  name: string;\n  type: string;\n  docs: string;\n  default: string;\n}\n\ninterface ComponentEvent {\n  event: string;\n  docs: string;\n  detail: string;\n}\n\ninterface ComponentInfo {\n  name: string;\n  props: ComponentProp[];\n  events: ComponentEvent[];\n}\n\nconst description = (prop: ComponentProp | ComponentEvent) => (prop.docs || '').trim();\n\nconst isText = (prop: ComponentProp) => prop.type === 'string';\nconst isBoolean = (prop: ComponentProp) => prop.type === 'boolean';\nconst isEnum = (prop: ComponentProp) => prop.type.includes('|');\nconst isNumber = (prop: ComponentProp) => prop.type === 'number';\n\nconst enumOptions = (prop: ComponentProp) =>\n  prop.type\n    .split('|')\n    .map(t => t.trim())\n    .map(t => (t === '\"\"' ? 'default' : t))\n    .map(t => t.replace(/^\"(.*)\"$/, '$1'));\n\nconst generateProp = (prop: ComponentProp) => {\n  if (isText(prop)) {\n    return {\n      [prop.name]: {\n        control: 'text',\n        description: description(prop),\n        defaultValue: prop.default,\n        table: {\n          category: 'properties',\n          defaultValue: { summary: prop.default },\n          type: { summary: 'string' },\n        },\n      },\n    };\n  }\n\n  if (isBoolean(prop)) {\n    return {\n      [prop.name]: {\n        control: 'boolean',\n        description: description(prop),\n        defaultValue: prop.default,\n        table: {\n          category: 'properties',\n          defaultValue: { summary: prop.default },\n          type: { summary: 'boolean' },\n        },\n      },\n    };\n  }\n\n  if (isNumber(prop)) {\n    return {\n      [prop.name]: {\n        control: 'number',\n        description: description(prop),\n        defaultValue: prop.default,\n        table: {\n          category: 'properties',\n          defaultValue: { summary: prop.default },\n          type: { summary: 'number' },\n        },\n      },\n    };\n  }\n\n  if (isEnum(prop)) {\n    return {\n      [prop.name]: {\n        control: 'select',\n        defaultValue: prop.default,\n        options: enumOptions(prop),\n        description: description(prop),\n        table: {\n          category: 'properties',\n          defaultValue: { summary: prop.default },\n          type: { summary: 'enum' },\n        },\n      },\n    };\n  }\n\n  return {};\n};\n\nconst generateProps = (props: ComponentProp[]) => {\n  let args = {};\n  props.forEach(prop => (args = { ...args, ...generateProp(prop) }));\n  return args;\n};\n\nconst generateEvent = (event: ComponentEvent) => {\n  function capitalizeFirstLetter(string: string) {\n    return string.charAt(0).toUpperCase() + string.slice(1);\n  }\n\n  return {\n    [`on${capitalizeFirstLetter(event.event)}`]: {\n      action: event.event,\n      description: description(event),\n      table: {\n        defaultValue: { summary: event.event },\n        category: 'events',\n        type: { summary: event.detail },\n      },\n    },\n  };\n};\n\nconst generateEvents = (events: ComponentEvent[]) => {\n  let args = {};\n  events.forEach(event => (args = { ...args, ...generateEvent(event) }));\n  return args;\n};\n\nconst extractComponentInfoByTag = (componentsData: any, tag: string): ComponentInfo | null => {\n  const component = componentsData.components.find(c => c.tag === tag);\n\n  if (!component) {\n    console.error(`Component with tag ${tag} not found`);\n    return null;\n  }\n\n  const { props, events } = component;\n\n  const propInfo = props.map(prop => ({\n    name: prop.name,\n    type: prop.type,\n    docs: prop.docs,\n    default: prop.default || '',\n  }));\n\n  const eventInfo = events.map(event => ({\n    event: event.event,\n    docs: event.docs,\n    detail: event.detail,\n  }));\n\n  return {\n    name: tag,\n    props: propInfo,\n    events: eventInfo,\n  };\n};\n\nconst generateHTMLTable = (componentInfo: ComponentInfo): string => {\n  if (!componentInfo) {\n    return `<p>Component not found</p>`;\n  }\n\n  const { props, events } = componentInfo;\n\n  const propsRows = props\n    .map(\n      prop => `\n    <tr>\n      <td>${prop.name}</td>\n      <td>${prop.type}</td>\n      <td>${prop.docs}</td>\n      <td>${prop.default}</td>\n    </tr>\n  `,\n    )\n    .join('');\n\n  const eventsRows = events\n    .map(\n      event => `\n    <tr>\n      <td>${event.event}</td>\n      <td>${event.detail}</td>\n      <td>${event.docs}</td>\n    </tr>\n  `,\n    )\n    .join('');\n\n  return `\n    <h3>Propriétés</h3>\n    <table class=\"w-full\">\n      <thead>\n        <tr>\n          <th>Propriété</th>\n          <th>Type</th>\n          <th>Description</th>\n          <th>Valeur par défaut</th>\n        </tr>\n      </thead>\n      <tbody>\n        ${propsRows}\n      </tbody>\n    </table>\n    <h3>Événements</h3>\n    <table class=\"w-full\">\n      <thead>\n        <tr>\n          <th>Événement</th>\n          <th>Détail</th>\n          <th>Description</th>\n        </tr>\n      </thead>\n      <tbody>\n        ${eventsRows}\n      </tbody>\n    </table>\n  `;\n};\n\nexport const generateComponentTable = (componentsData: any, tag: string): string => {\n  const componentInfo = extractComponentInfoByTag(componentsData, tag);\n  return generateHTMLTable(componentInfo);\n};\n\nexport const withComponentControls = (componentsData: any, { tag }: { tag: string }): any => {\n  const component = componentsData.components.find(c => c.tag === tag);\n  if (component) {\n    const props = component.props;\n    const events = component.events;\n\n    return {\n      ...generateProps(props as ComponentProp[]),\n      ...generateEvents(events as ComponentEvent[]),\n    };\n  }\n\n  return {};\n};\n\nexport function extractArgTypes(componentsData: any, subComponentTags: string[]) {\n  return subComponentTags.reduce((acc, tag) => {\n    const subComponentArgTypes = withComponentControls(componentsData, { tag });\n    return { ...acc, ...subComponentArgTypes };\n  }, {});\n}\n\nexport function formatFileSize(sizeInBytes) {\n  const sizeInMB = sizeInBytes / (1024 * 1024);\n  let formattedSize = sizeInMB.toFixed(2).replace('.', ',');\n\n  if (sizeInMB > 0 && sizeInMB < 0.01) {\n    formattedSize = '0,01';\n  } else if (sizeInMB === 0) {\n    formattedSize = '0,00';\n  }\n\n  return `${formattedSize} Mo`;\n}\n\nexport function hasSlotContent(el: HTMLElement): boolean {\n  const slot = el.querySelector('slot');\n  return slot && slot.assignedNodes().length > 0;\n}\n"]}

package/dist/components/index.d.ts

@@ -0,0 +1,33 @@
+/**
+ * Get the base path to where the assets can be found. Use "setAssetPath(path)"
+ * if the path needs to be customized.
+ */
+export declare const getAssetPath: (path: string) => string;
+
+/**
+ * Used to manually set the base path where assets can be found.
+ * If the script is used as "module", it's recommended to use "import.meta.url",
+ * such as "setAssetPath(import.meta.url)". Other options include
+ * "setAssetPath(document.currentScript.src)", or using a bundler's replace plugin to
+ * dynamically set the path at build time, such as "setAssetPath(process.env.ASSET_PATH)".
+ * But do note that this configuration depends on how your script is bundled, or lack of
+ * bundling, and where your assets can be loaded from. Additionally custom bundling
+ * will have to ensure the static assets are copied to its build directory.
+ */
+export declare const setAssetPath: (path: string) => void;
+
+/**
+ * Used to specify a nonce value that corresponds with an application's CSP.
+ * When set, the nonce will be added to all dynamically created script and style tags at runtime.
+ * Alternatively, the nonce value can be set on a meta tag in the DOM head
+ * (<meta name="csp-nonce" content="{ nonce value here }" />) which
+ * will result in the same behavior.
+ */
+export declare const setNonce: (nonce: string) => void
+
+export interface SetPlatformOptions {
+  raf?: (c: FrameRequestCallback) => number;
+  ael?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
+  rel?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
+}
+export declare const setPlatformOptions: (opts: SetPlatformOptions) => void;

package/dist/components/index.js

@@ -0,0 +1,3 @@
+export { g as getAssetPath, s as setAssetPath, a as setNonce, b as setPlatformOptions } from './p-3706b88e.js';
+
+//# sourceMappingURL=index.js.map

package/dist/components/index.js.map

@@ -0,0 +1 @@
+{"file":"index.js","mappings":"","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/p-0e197bb5.js

@@ -0,0 +1,231 @@
+import { p as proxyCustomElement, H, d as createEvent, h, F as Fragment, c as Host } from './p-3706b88e.js';
+import { d as defineCustomElement$4 } from './p-b3b66a09.js';
+import { d as defineCustomElement$3 } from './p-e70f2b83.js';
+import { d as defineCustomElement$2 } from './p-72ca702e.js';
+import { d as defineCustomElement$1 } from './p-cb99b731.js';
+
+const spwPaginationCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{-webkit-text-size-adjust:100%;line-height:1.3}h1,h2,h3,h4,h5,h6,li,p,ul{margin:0;padding:0}ul{list-style:none}:host{-webkit-text-size-adjust:100%;box-sizing:border-box;display:block;font-size:100%;line-height:1.3}:host *,:host :after,:host :before{box-sizing:inherit;font-family:Nunito Sans}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}:root{--spw-ds-container-xl:1220px;--spw-ds-container-lg:1024px;--spw-ds-container-md:768px;--spw-ds-container-sm:640px}.spw-ds-container{width:100%}@media (min-width:460px){.spw-ds-container{max-width:var(--spw-ds-container-sm)}}@media (min-width:768px){.spw-ds-container{max-width:var(--spw-ds-container-md)}}@media (min-width:1024px){.spw-ds-container{max-width:var(--spw-ds-container-lg)}}@media (min-width:1350px){.spw-ds-container{max-width:var(--spw-ds-container-xl)}}.spw-pagination__item button,.spw-pagination__item--dots{border-radius:32px;font-size:14px;font-weight:700;height:32px;line-height:32px;min-width:32px;text-align:center}.spw-pagination__item button:focus-visible,.spw-pagination__item--dots:focus-visible{outline:3px solid var(--spw-ds-focus)}.spw-pagination{align-items:center;display:flex;flex-direction:column}@media (min-width:768px){.spw-pagination{align-items:flex-start}}.spw-pagination ul{align-items:center;display:flex;padding:0}.spw-pagination__item{margin-right:12px}.spw-pagination__item spw-icon{font-size:18px}.spw-pagination__item button{background:none;border:none;color:var(--spw-color-themes-grey-grey-900);cursor:pointer;margin:0;padding:0 6px}.spw-pagination__item:not(.spw-pagination__item--active,.spw-pagination__item--dots,.spw-pagination__item--disabled):hover button{background:var(--spw-color-themes-grey-grey-200)}.spw-pagination__item:not(.spw-pagination__item--active,.spw-pagination__item--dots,.spw-pagination__item--disabled):active button{background:var(--spw-color-themes-grey-grey-300)}.spw-pagination__item--arrow button{align-items:center;display:flex;gap:8px;padding:0 12px;text-decoration:underline}.spw-pagination__item--arrow button:hover{text-decoration:none}.spw-pagination__item--dots{align-items:center;background:none;color:var(--spw-color-themes-grey-grey-400);cursor:default;display:inline-flex;justify-content:center;position:relative;top:3px}.spw-pagination__item--dots spw-icon{font-size:16px}.spw-pagination__item--desktop{display:none}@media (min-width:768px){.spw-pagination__item--desktop{display:inline-block}}.spw-pagination__item--active button{background:var(--spw-ds-primary);color:#fff}.spw-pagination__input spw-text-field{--spw-input-height:32px;--spw-input-padding:0 4px;--spw-input-text-align:center;--spw-input-font-size:14px;width:3ch}.spw-pagination__mobile-arrows{margin-top:12px}@media (min-width:768px){.spw-pagination__mobile-arrows{display:none!important}}.spw-pagination__total-pages{font-size:14px;margin:0 12px 0 6px}.spw-tw-mb-10{margin-bottom:2.5rem}.spw-tw-mb-6{margin-bottom:1.5rem}.spw-tw-ml-2{margin-left:.5rem}.spw-tw-mr-4{margin-right:1rem}.spw-tw-mt-12{margin-top:3rem}.-spw-tw-mt-1{margin-top:-.25rem}.spw-tw-mb-2{margin-bottom:.5rem}";
+const SpwPaginationStyle0 = spwPaginationCss;
+
+const SpwPagination = /*@__PURE__*/ proxyCustomElement(class SpwPagination extends H {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.pageChanged = createEvent(this, "pageChanged", 7);
+        this.updateIsMobile = () => {
+            this.isMobile = window.innerWidth < 800;
+        };
+        this.totalItems = undefined;
+        this.itemsPerPage = undefined;
+        this.isDisabled = false;
+        this.variant = 'numbers';
+        this.currentPage = 1;
+        this.inputPageValue = '';
+        this.isMobile = window.innerWidth < 800;
+    }
+    componentWillLoad() {
+        this.calculateTotalPages();
+        this.inputPageValue = this.currentPage.toString();
+        window.addEventListener('resize', this.updateIsMobile);
+    }
+    disconnectedCallback() {
+        window.removeEventListener('resize', this.updateIsMobile);
+    }
+    calculateTotalPages() {
+        this.totalPages = Math.ceil(this.totalItems / this.itemsPerPage);
+    }
+    goToPage(page) {
+        if (page !== this.currentPage && !this.isDisabled && page >= 1 && page <= this.totalPages) {
+            this.currentPage = page;
+            this.inputPageValue = this.currentPage.toString();
+            this.pageChanged.emit(this.currentPage);
+        }
+    }
+    handleInputChange(event) {
+        const inputValue = event.target.value;
+        this.inputPageValue = inputValue;
+        const page = parseInt(inputValue, 10);
+        if (!isNaN(page) && page >= 1 && page <= this.totalPages) {
+            clearTimeout(this.debounceTimer);
+            this.debounceTimer = setTimeout(() => {
+                this.goToPage(page);
+            }, 500);
+        }
+    }
+    getPaginationClass() {
+        var _a, _b;
+        const pages = this.calculatePageRange();
+        const ellipsisCount = pages.filter(({ page }) => page === '...').length;
+        const hasEllipsisStart = ellipsisCount > 0 && ((_a = pages[1]) === null || _a === void 0 ? void 0 : _a.page) === '...';
+        const hasEllipsisEnd = ellipsisCount > 0 && ((_b = pages[pages.length - 2]) === null || _b === void 0 ? void 0 : _b.page) === '...';
+        let paginationClass = `spw-pagination spw-pagination--${this.currentPage} spw-pagination--total-${this.totalPages}`;
+        if (ellipsisCount === 2) {
+            paginationClass += ' spw-pagination--double-ellipsis';
+        }
+        else if (hasEllipsisStart) {
+            paginationClass += ' spw-pagination--ellipsis-start';
+        }
+        else if (hasEllipsisEnd) {
+            paginationClass += ' spw-pagination--ellipsis-end';
+        }
+        return paginationClass;
+    }
+    handleKeyDown(event) {
+        if (event.key === 'Enter') {
+            const page = parseInt(this.inputPageValue, 10);
+            if (!isNaN(page)) {
+                this.goToPage(page);
+            }
+        }
+    }
+    calculateWidth() {
+        const length = this.inputPageValue.length;
+        if (length <= 1) {
+            return '3ch';
+        }
+        return `${length + 1}ch`;
+    }
+    calculatePageRange() {
+        const pages = [];
+        const { currentPage, totalPages, isMobile } = this;
+        if (isMobile) {
+            // Mode mobile
+            if (totalPages <= 5) {
+                for (let i = 1; i <= totalPages; i++) {
+                    pages.push({ page: i, class: 'spw-pagination__item--small-range' });
+                }
+            }
+            else if (currentPage <= 3) {
+                for (let i = 1; i <= 3; i++) {
+                    pages.push({ page: i, class: 'spw-pagination__item--start-range' });
+                }
+                pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });
+                pages.push({ page: totalPages, class: 'spw-pagination__item--end' });
+            }
+            else if (currentPage >= totalPages - 2) {
+                pages.push({ page: 1, class: 'spw-pagination__item--start' });
+                pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });
+                for (let i = totalPages - 2; i <= totalPages; i++) {
+                    pages.push({ page: i, class: 'spw-pagination__item--end-range' });
+                }
+            }
+            else {
+                pages.push({ page: 1, class: 'spw-pagination__item--start' });
+                pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });
+                for (let i = currentPage - 1; i <= currentPage + 1; i++) {
+                    pages.push({ page: i, class: 'spw-pagination__item--middle-range' });
+                }
+                pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });
+                pages.push({ page: totalPages, class: 'spw-pagination__item--end' });
+            }
+        }
+        else {
+            // Mode desktop
+            if (totalPages <= 7) {
+                for (let i = 1; i <= totalPages; i++) {
+                    pages.push({ page: i, class: 'spw-pagination__item--small-range' });
+                }
+            }
+            else if (currentPage <= 4) {
+                for (let i = 1; i <= 4; i++) {
+                    pages.push({ page: i, class: 'spw-pagination__item--start-range' });
+                }
+                pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });
+                pages.push({ page: totalPages, class: 'spw-pagination__item--end' });
+            }
+            else if (currentPage >= totalPages - 3) {
+                pages.push({ page: 1, class: 'spw-pagination__item--start' });
+                pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });
+                for (let i = totalPages - 3; i <= totalPages; i++) {
+                    pages.push({ page: i, class: 'spw-pagination__item--end-range' });
+                }
+            }
+            else {
+                pages.push({ page: 1, class: 'spw-pagination__item--start' });
+                pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });
+                for (let i = currentPage - 2; i <= currentPage + 2; i++) {
+                    pages.push({ page: i, class: 'spw-pagination__item--middle-range' });
+                }
+                pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });
+                pages.push({ page: totalPages, class: 'spw-pagination__item--end' });
+            }
+        }
+        return pages;
+    }
+    render() {
+        const pages = this.calculatePageRange();
+        const showPrevArrow = this.currentPage > 1;
+        const showNextArrow = this.currentPage < this.totalPages;
+        const prevArrow = showPrevArrow && (h("li", { key: '92ef42761d0175b2c97a9efe65e8645d0f2336a4', class: "spw-pagination__item spw-pagination__item--desktop spw-pagination__item--arrow" }, h("button", { key: '795383fd33cd7d4483f857a130858a8e3140ac32', onClick: () => this.goToPage(this.currentPage - 1) }, h("spw-icon", { key: '083a017a27b2fbc126f602e15a2102d2a5fd24fa', icon: "fa-chevron-left" }), " ", h("span", { key: '5c2d2ac7e3a0eda5dfde49080f3239c97922d663', class: "spw-pagination__item-arrow-text" }, "Pr\u00E9c\u00E9dent"))));
+        const nextArrow = showNextArrow && (h("li", { key: '9217f13b26fdd534353493612a74c9cd80c63e02', class: "spw-pagination__item spw-pagination__item--desktop spw-pagination__item--arrow" }, h("button", { key: 'ad665dfb749a5770ffdf6bd53982f8b79b565efb', onClick: () => this.goToPage(this.currentPage + 1) }, h("span", { key: '1e788ff34cdb5ac89df8ee9d69142048dfc423cf', class: "spw-pagination__item-arrow-text" }, "Suivant"), " ", h("spw-icon", { key: 'e1263d3d81c527d4c8f559c7efbe4a882e44f880', icon: "fa-chevron-right" }))));
+        const prevArrowMobile = this.currentPage > 1 && (h("li", { key: '155ccc9ef12e82ff0ff4053e6e9121f71d3347e9', class: "spw-pagination__item spw-pagination__item--arrow" }, h("button", { key: '4846fba3c684879086a4445ab59d11b9fedbd729', onClick: () => this.goToPage(this.currentPage - 1) }, h("spw-icon", { key: 'fcc99138e3ba55024e89ac7da3acc4d6e4c0a811', icon: "fa-chevron-left" }), " ", h("span", { key: '86a1e9d336d69919ac1deed354d85138e73c8315' }, "Pr\u00E9c\u00E9dent"))));
+        const nextArrowMobile = this.currentPage < this.totalPages && (h("li", { key: '6492294cc5f678aef792ca166c1f276b0e9f97b9', class: "spw-pagination__item spw-pagination__item--arrow" }, h("button", { key: '48db42f6df00985e6e75eeba69afdb4a8de54af5', onClick: () => this.goToPage(this.currentPage + 1), disabled: this.currentPage >= this.totalPages }, h("span", { key: 'c637153995e2e2999c2f4d9c05a5ac5a1eb9daaf' }, "Suivant"), " ", h("spw-icon", { key: '82941730947e3f827215e800efcc3320e4886b2c', icon: "fa-chevron-right" }))));
+        const mobileArrows = (h("ul", { key: '49c47245a12a39a869eb8e6446fbbb18b6c81b72', class: "spw-pagination__mobile-arrows" }, prevArrowMobile, nextArrowMobile));
+        return (h(Host, { key: 'fd390d68353001dcbc9aadb5f54d367ac512b152' }, h("div", { key: '52264d5fb04ce2b901619c9cd8300fe8e982d460', class: this.getPaginationClass() }, this.variant === 'input' && (h(Fragment, { key: '5c8accb96a11eb63350e56df10c927cdaa8cf0d1' }, h("ul", { key: '9fa4233681297a17bc205d8a0433bd8069c27d5c' }, prevArrow, h("li", { key: '68a58a3f690f81a1e57a04e63db1612ada7b745e', class: "spw-pagination__input" }, h("spw-text-field", { key: '8fe43453a3a780d77e4ce6d16805f8b6ae63901f', value: this.inputPageValue, type: "number", onInput: event => this.handleInputChange(event), onKeyDown: event => this.handleKeyDown(event), disabled: this.isDisabled, style: { width: this.calculateWidth() } })), h("li", { key: '38727323566f8d52440dbc75c87befa17394cdb8', class: "spw-pagination__total-pages" }, "sur ", this.totalPages, " pages"), nextArrow), mobileArrows)), this.variant === 'numbers' && (h(Fragment, { key: '54277117ac1b6a806bc7af5b4abf1b3a964d137f' }, h("ul", { key: 'a0c936f6ac0029c7863f30bdfce1bf46224060dc' }, prevArrow, pages.map(({ page, class: pageClass }) => {
+            if (page === '...') {
+                return (h("li", { class: `spw-pagination__item spw-pagination__item--dots ${pageClass}` }, h("spw-icon", { icon: "fa-ellipsis" })));
+            }
+            return (h("li", { class: {
+                    'spw-pagination__item': true,
+                    'spw-pagination__item--active': page === this.currentPage,
+                    [pageClass]: true,
+                } }, h("button", { onClick: () => this.goToPage(page), disabled: page === this.currentPage }, page)));
+        }), nextArrow), mobileArrows)))));
+    }
+    static get watchers() { return {
+        "totalItems": ["calculateTotalPages"],
+        "itemsPerPage": ["calculateTotalPages"],
+        "currentPage": ["calculateTotalPages"]
+    }; }
+    static get style() { return SpwPaginationStyle0; }
+}, [1, "spw-pagination", {
+        "totalItems": [2, "total-items"],
+        "itemsPerPage": [2, "items-per-page"],
+        "isDisabled": [4, "is-disabled"],
+        "variant": [1],
+        "currentPage": [1026, "current-page"],
+        "inputPageValue": [32],
+        "isMobile": [32]
+    }, undefined, {
+        "totalItems": ["calculateTotalPages"],
+        "itemsPerPage": ["calculateTotalPages"],
+        "currentPage": ["calculateTotalPages"]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["spw-pagination", "spw-field-label", "spw-field-message", "spw-icon", "spw-text-field"];
+    components.forEach(tagName => { switch (tagName) {
+        case "spw-pagination":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, SpwPagination);
+            }
+            break;
+        case "spw-field-label":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "spw-field-message":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "spw-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "spw-text-field":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+
+export { SpwPagination as S, defineCustomElement as d };
+
+//# sourceMappingURL=p-0e197bb5.js.map

package/dist/components/p-0e197bb5.js.map

@@ -0,0 +1 @@
+{"file":"p-0e197bb5.js","mappings":"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","names":[],"sources":["src/components/spw-pagination/spw-pagination.scss?tag=spw-pagination&encapsulation=shadow","src/components/spw-pagination/spw-pagination.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n%button {\n  text-align: center;\n  line-height: 32px;\n  font-weight: 700;\n  border-radius: 32px;\n  font-size: 14px;\n  min-width: 32px;\n  height: 32px;\n  &:focus-visible {\n    outline: 3px solid var(--spw-ds-focus);\n  }\n}\n\n.spw-pagination {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  @include breakpoint(md) {\n    align-items: flex-start;\n  }\n\n  ul {\n    display: flex;\n    align-items: center;\n    padding: 0;\n  }\n\n  &__item {\n    margin-right: 12px;\n    spw-icon {\n      font-size: 18px;\n    }\n    button {\n      padding: 0 6px;\n      margin: 0;\n      border: none;\n      cursor: pointer;\n      color: var(--spw-color-themes-grey-grey-900);\n      background: none;\n      @extend %button;\n    }\n\n    &:not(.spw-pagination__item--active, .spw-pagination__item--dots, .spw-pagination__item--disabled):hover {\n      button {\n        background: var(--spw-color-themes-grey-grey-200);\n      }\n    }\n\n    &:not(.spw-pagination__item--active, .spw-pagination__item--dots, .spw-pagination__item--disabled):active {\n      button {\n        background: var(--spw-color-themes-grey-grey-300);\n      }\n    }\n\n    &--arrow {\n      button {\n        padding: 0 12px;\n        display: flex;\n        gap: 8px;\n        align-items: center;\n        text-decoration: underline;\n        &:hover {\n          text-decoration: none;\n        }\n      }\n    }\n\n    &--dots {\n      position: relative;\n      top: 3px;\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      cursor: default;\n      background: none;\n      color: var(--spw-color-themes-grey-grey-400);\n      @extend %button;\n      spw-icon {\n        font-size: 16px;\n      }\n    }\n\n    &--desktop {\n      display: none;\n      @include breakpoint(md) {\n        display: inline-block;\n      }\n    }\n\n    &--active {\n      button {\n        color: white;\n        background: var(--spw-ds-primary);\n      }\n    }\n  }\n\n  &__input {\n    spw-text-field {\n      width: 3ch;\n      --spw-input-height: 32px;\n      --spw-input-padding: 0 4px;\n      --spw-input-text-align: center;\n      --spw-input-font-size: 14px;\n    }\n  }\n\n  &__mobile-arrows {\n    margin-top: 12px;\n    @include breakpoint(md) {\n      display: none !important;\n    }\n  }\n\n  &__total-pages {\n    font-size: 14px;\n    margin: 0 12px 0 6px;\n  }\n}\n","import { Component, Fragment, Prop, Host, h, Event, EventEmitter, Watch, State } from '@stencil/core';\n\n@Component({\n  tag: 'spw-pagination',\n  styleUrl: 'spw-pagination.scss',\n  shadow: true,\n})\nexport class SpwPagination {\n  /** Nombre total d'éléments à paginer */\n  @Prop() totalItems: number;\n  /** Nombre d'éléments à afficher par page */\n  @Prop() itemsPerPage: number;\n  /** Indique si la pagination est désactivée */\n  @Prop() isDisabled: boolean = false;\n  /** Type de variante de la pagination : 'numbers' ou 'input' */\n  @Prop() variant: 'numbers' | 'input' = 'numbers';\n  /** Page actuellement sélectionnée, mutable */\n  @Prop({ mutable: true }) currentPage: number = 1;\n\n  /** Événement émis lorsque la page est changée, renvoie le numéro de la nouvelle page */\n  @Event() pageChanged: EventEmitter<number>;\n\n  private totalPages: number;\n  @State() inputPageValue: string = '';\n  @State() isMobile: boolean = window.innerWidth < 800;\n  private debounceTimer: any;\n\n  componentWillLoad() {\n    this.calculateTotalPages();\n    this.inputPageValue = this.currentPage.toString();\n    window.addEventListener('resize', this.updateIsMobile);\n  }\n\n  disconnectedCallback() {\n    window.removeEventListener('resize', this.updateIsMobile);\n  }\n\n  private updateIsMobile = () => {\n    this.isMobile = window.innerWidth < 800;\n  };\n\n  @Watch('totalItems')\n  @Watch('itemsPerPage')\n  @Watch('currentPage')\n  calculateTotalPages() {\n    this.totalPages = Math.ceil(this.totalItems / this.itemsPerPage);\n  }\n\n  private goToPage(page: number) {\n    if (page !== this.currentPage && !this.isDisabled && page >= 1 && page <= this.totalPages) {\n      this.currentPage = page;\n      this.inputPageValue = this.currentPage.toString();\n      this.pageChanged.emit(this.currentPage);\n    }\n  }\n\n  private handleInputChange(event: Event) {\n    const inputValue = (event.target as HTMLInputElement).value;\n    this.inputPageValue = inputValue;\n    const page = parseInt(inputValue, 10);\n\n    if (!isNaN(page) && page >= 1 && page <= this.totalPages) {\n      clearTimeout(this.debounceTimer);\n      this.debounceTimer = setTimeout(() => {\n        this.goToPage(page);\n      }, 500);\n    }\n  }\n\n  private getPaginationClass() {\n    const pages = this.calculatePageRange();\n    const ellipsisCount = pages.filter(({ page }) => page === '...').length;\n    const hasEllipsisStart = ellipsisCount > 0 && pages[1]?.page === '...';\n    const hasEllipsisEnd = ellipsisCount > 0 && pages[pages.length - 2]?.page === '...';\n\n    let paginationClass = `spw-pagination spw-pagination--${this.currentPage} spw-pagination--total-${this.totalPages}`;\n\n    if (ellipsisCount === 2) {\n      paginationClass += ' spw-pagination--double-ellipsis';\n    } else if (hasEllipsisStart) {\n      paginationClass += ' spw-pagination--ellipsis-start';\n    } else if (hasEllipsisEnd) {\n      paginationClass += ' spw-pagination--ellipsis-end';\n    }\n\n    return paginationClass;\n  }\n\n  private handleKeyDown(event: KeyboardEvent) {\n    if (event.key === 'Enter') {\n      const page = parseInt(this.inputPageValue, 10);\n      if (!isNaN(page)) {\n        this.goToPage(page);\n      }\n    }\n  }\n\n  private calculateWidth(): string {\n    const length = this.inputPageValue.length;\n    if (length <= 1) {\n      return '3ch';\n    }\n    return `${length + 1}ch`;\n  }\n\n  private calculatePageRange() {\n    const pages = [];\n    const { currentPage, totalPages, isMobile } = this;\n\n    if (isMobile) {\n      // Mode mobile\n      if (totalPages <= 5) {\n        for (let i = 1; i <= totalPages; i++) {\n          pages.push({ page: i, class: 'spw-pagination__item--small-range' });\n        }\n      } else if (currentPage <= 3) {\n        for (let i = 1; i <= 3; i++) {\n          pages.push({ page: i, class: 'spw-pagination__item--start-range' });\n        }\n        pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });\n        pages.push({ page: totalPages, class: 'spw-pagination__item--end' });\n      } else if (currentPage >= totalPages - 2) {\n        pages.push({ page: 1, class: 'spw-pagination__item--start' });\n        pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });\n        for (let i = totalPages - 2; i <= totalPages; i++) {\n          pages.push({ page: i, class: 'spw-pagination__item--end-range' });\n        }\n      } else {\n        pages.push({ page: 1, class: 'spw-pagination__item--start' });\n        pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });\n        for (let i = currentPage - 1; i <= currentPage + 1; i++) {\n          pages.push({ page: i, class: 'spw-pagination__item--middle-range' });\n        }\n        pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });\n        pages.push({ page: totalPages, class: 'spw-pagination__item--end' });\n      }\n    } else {\n      // Mode desktop\n      if (totalPages <= 7) {\n        for (let i = 1; i <= totalPages; i++) {\n          pages.push({ page: i, class: 'spw-pagination__item--small-range' });\n        }\n      } else if (currentPage <= 4) {\n        for (let i = 1; i <= 4; i++) {\n          pages.push({ page: i, class: 'spw-pagination__item--start-range' });\n        }\n        pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });\n        pages.push({ page: totalPages, class: 'spw-pagination__item--end' });\n      } else if (currentPage >= totalPages - 3) {\n        pages.push({ page: 1, class: 'spw-pagination__item--start' });\n        pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });\n        for (let i = totalPages - 3; i <= totalPages; i++) {\n          pages.push({ page: i, class: 'spw-pagination__item--end-range' });\n        }\n      } else {\n        pages.push({ page: 1, class: 'spw-pagination__item--start' });\n        pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });\n        for (let i = currentPage - 2; i <= currentPage + 2; i++) {\n          pages.push({ page: i, class: 'spw-pagination__item--middle-range' });\n        }\n        pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });\n        pages.push({ page: totalPages, class: 'spw-pagination__item--end' });\n      }\n    }\n\n    return pages;\n  }\n\n  render() {\n    const pages = this.calculatePageRange();\n    const showPrevArrow = this.currentPage > 1;\n    const showNextArrow = this.currentPage < this.totalPages;\n\n    const prevArrow = showPrevArrow && (\n      <li class=\"spw-pagination__item spw-pagination__item--desktop spw-pagination__item--arrow\">\n        <button onClick={() => this.goToPage(this.currentPage - 1)}>\n          <spw-icon icon=\"fa-chevron-left\"></spw-icon> <span class=\"spw-pagination__item-arrow-text\">Précédent</span>\n        </button>\n      </li>\n    );\n\n    const nextArrow = showNextArrow && (\n      <li class=\"spw-pagination__item spw-pagination__item--desktop spw-pagination__item--arrow\">\n        <button onClick={() => this.goToPage(this.currentPage + 1)}>\n          <span class=\"spw-pagination__item-arrow-text\">Suivant</span> <spw-icon icon=\"fa-chevron-right\"></spw-icon>\n        </button>\n      </li>\n    );\n\n    const prevArrowMobile = this.currentPage > 1 && (\n      <li class=\"spw-pagination__item spw-pagination__item--arrow\">\n        <button onClick={() => this.goToPage(this.currentPage - 1)}>\n          <spw-icon icon=\"fa-chevron-left\"></spw-icon> <span>Précédent</span>\n        </button>\n      </li>\n    );\n\n    const nextArrowMobile = this.currentPage < this.totalPages && (\n      <li class=\"spw-pagination__item spw-pagination__item--arrow\">\n        <button onClick={() => this.goToPage(this.currentPage + 1)} disabled={this.currentPage >= this.totalPages}>\n          <span>Suivant</span> <spw-icon icon=\"fa-chevron-right\"></spw-icon>\n        </button>\n      </li>\n    );\n\n    const mobileArrows = (\n      <ul class=\"spw-pagination__mobile-arrows\">\n        {prevArrowMobile}\n        {nextArrowMobile}\n      </ul>\n    );\n\n    return (\n      <Host>\n        <div class={this.getPaginationClass()}>\n          {this.variant === 'input' && (\n            <Fragment>\n              <ul>\n                {prevArrow}\n                <li class=\"spw-pagination__input\">\n                  <spw-text-field\n                    value={this.inputPageValue}\n                    type=\"number\"\n                    onInput={event => this.handleInputChange(event)}\n                    onKeyDown={event => this.handleKeyDown(event)}\n                    disabled={this.isDisabled}\n                    style={{ width: this.calculateWidth() }}\n                  ></spw-text-field>\n                </li>\n                <li class=\"spw-pagination__total-pages\">sur {this.totalPages} pages</li>\n                {nextArrow}\n              </ul>\n              {mobileArrows}\n            </Fragment>\n          )}\n          {this.variant === 'numbers' && (\n            <Fragment>\n              <ul>\n                {prevArrow}\n\n                {pages.map(({ page, class: pageClass }) => {\n                  if (page === '...') {\n                    return (\n                      <li class={`spw-pagination__item spw-pagination__item--dots ${pageClass}`}>\n                        <spw-icon icon=\"fa-ellipsis\"></spw-icon>\n                      </li>\n                    );\n                  }\n\n                  return (\n                    <li\n                      class={{\n                        'spw-pagination__item': true,\n                        'spw-pagination__item--active': page === this.currentPage,\n                        [pageClass]: true,\n                      }}\n                    >\n                      <button onClick={() => this.goToPage(page as number)} disabled={page === this.currentPage}>\n                        {page}\n                      </button>\n                    </li>\n                  );\n                })}\n\n                {nextArrow}\n              </ul>\n              {mobileArrows}\n            </Fragment>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}