@ds-autonomie/web-components 1.7.0 → 1.9.0

package/dist/themes/dsa-wc-theme.styles.js

@@ -100,6 +100,11 @@ export default css`
     --dsa-wc-checkbox-label-color-disabled: var(
       --dsa-color-text-on-base-disabled
     );
+    --dsa-wc-checkbox-border-color-readonly: var(
+      --dsa-color-toggle-item-readonly
+    );
+    --dsa-wc-checkbox-background-color-readonly: var(--dsa-wc-checkbox-color);
+    --dsa-wc-checkbox-icon-color-readonly: var(--dsa-color-toggle-item-default);
     --dsa-wc-checkbox-label-color-error: var(--dsa-color-text-on-base-error);
     --dsa-wc-checkbox-icon-color: var(--dsa-color-background-base);
     --dsa-wc-checkbox-border-width: 1px;
@@ -338,10 +343,16 @@ export default css`
       var(--dsa-spacing-12) var(--dsa-spacing-4);
     --dsa-wc-option-check-icon-horizontal-padding: var(--dsa-spacing-4);
     --dsa-wc-badge-font: var(--dsa-font-x-small-bold);
-    --dsa-wc-badge-dot-font: var(--dsa-font-2x-small-bold);
-    --dsa-wc-badge-dot-padding: 4px 8px;
+    --dsa-wc-badge-small-font: var(--dsa-font-2x-small-bold);
+    --dsa-wc-badge-dot-padding: 8px;
+    --dsa-wc-badge-dot-small-padding: 4px;
+    --dsa-wc-badge-text-padding: 6px 9px;
+    --dsa-wc-badge-text-small-padding: 3px 5px;
+    --dsa-wc-badge-padding: 6px 9px;
+    --dsa-wc-badge-small-padding: 3px 5px;
+    --dsa-wc-badge-text-min-width: 24px;
+    --dsa-wc-badge-text-small-min-width: 16px;
     --dsa-wc-badge-border-radius: 32px;
-    --dsa-wc-badge-dot-size: 24px;
     --dsa-wc-badge-background-color-primary: var(
       --dsa-color-badge-background-primary
     );
@@ -882,6 +893,7 @@ export default css`
     --dsa-wc-progress-bar-small-size: 1rem;
     --dsa-wc-progress-bar-small-gap: 0.5rem;
     --dsa-wc-progress-bar-small-track-width: 3px;
+    --dsa-wc-input-margin-inline: var(--dsa-spacing-8);
     --dsa-wc-input-padding-x: var(--dsa-spacing-12);
     --dsa-wc-input-padding-y: var(--dsa-spacing-8);
     --dsa-wc-input-padding: var(--dsa-wc-input-padding-y)
@@ -1105,6 +1117,10 @@ export default css`
     --dsa-wc-accordion-padding: 1rem;
     --dsa-wc-accordion-background-color: var(--dsa-color-background-base);
     --dsa-wc-accordion-border-radius: var(--dsa-spacing-4);
+    --dsa-wc-select-padding-x: var(--dsa-spacing-12);
+    --dsa-wc-select-padding-y: var(--dsa-spacing-4);
+    --dsa-wc-select-padding: var(--dsa-wc-select-padding-y)
+      var(--dsa-wc-select-padding-x);
     --dsa-wc-select-input-font: var(--dsa-font-medium-normal);
     --dsa-wc-select-input-font-small: var(--dsa-font-small-normal);
     --dsa-wc-select-input-font-large: var(--dsa-font-large-normal);
@@ -1395,6 +1411,108 @@ export default css`
     );
     --dsa-wc-footer-sitemap-list-font: var(--dsa-font-small-normal);
     --dsa-wc-footer-sitemap-label-margin: 0px;
+    --dsa-wc-header-background: var(--dsa-color-background-base);
+    --dsa-wc-header-box-shadow: 0px 1.378px 5.512px 0px
+      rgba(113, 113, 122, 0.12);
+    --dsa-wc-header-padding-x: var(--dsa-spacing-16);
+    --dsa-wc-header-medium-padding-x: var(--dsa-spacing-24);
+    --dsa-wc-header-x-large-padding-x: 200px;
+    --dsa-wc-header-external-links-padding-y: var(--dsa-spacing-8);
+    --dsa-wc-header-main-padding-y: var(--dsa-spacing-8);
+    --dsa-wc-header-main-medium-padding-y: var(--dsa-spacing-16);
+    --dsa-wc-header-logo-width-mobile: 84px;
+    --dsa-wc-header-logo-width-desktop: 108px;
+    --dsa-wc-header-logo-height-mobile: 40px;
+    --dsa-wc-header-logo-height-desktop: 50px;
+    --dsa-wc-header-sitename-color: var(--dsa-color-primitives-purple-500);
+    --dsa-wc-header-sitename-font-mobile: var(--dsa-font-small-bold);
+    --dsa-wc-header-sitename-font-desktop: var(--dsa-font-medium-bold);
+    --dsa-wc-header-baseline-color: var(--dsa-color-text-on-base-primary);
+    --dsa-wc-header-baseline-font-mobile: var(--dsa-font-x-small-normal);
+    --dsa-wc-header-baseline-font-desktop: var(--dsa-font-small-normal);
+    --dsa-wc-header-search-input-color: var(--dsa-color-primitives-neutral-900);
+    --dsa-wc-header-search-input-font: var(--dsa-font-medium-normal);
+    --dsa-wc-table-header-cell-padding-y: var(--dsa-spacing-4);
+    --dsa-wc-table-header-cell-padding-x: var(--dsa-spacing-8);
+    --dsa-wc-table-header-cell-skeleton-padding-inline-end: var(
+      --dsa-spacing-40
+    );
+    --dsa-wc-table-header-cell-background-hover: var(
+      --dsa-color-primitives-neutral-400
+    );
+    --dsa-wc-table-header-cell-background-active: var(
+      --dsa-color-primitives-neutral-500
+    );
+    --dsa-wc-table-header-cell-sort-icon-size: 1rem;
+    --dsa-wc-table-header-cell-sort-button-outline-offset: -3px;
+    --dsa-wc-table-header-cell-skeleton-color: var(
+      --dsa-color-primitives-neutral-400
+    );
+    --dsa-wc-table-header-cell-skeleton-sheen-color: var(
+      --dsa-color-primitives-neutral-500
+    );
+    --dsa-wc-table-header-row-font: var(--dsa-font-small-bold);
+    --dsa-wc-table-header-row-background: var(--dsa-color-background-layer);
+    --dsa-wc-table-header-row-color: var(--dsa-color-text-on-base-primary);
+    --dsa-wc-table-header-row-height: 2.5rem;
+    --dsa-wc-table-cell-padding-y: var(--dsa-spacing-4);
+    --dsa-wc-table-cell-padding-x: var(--dsa-spacing-8);
+    --dsa-wc-table-cell-border-color: var(--dsa-color-background-divider);
+    --dsa-wc-table-cell-border-size: 1px;
+    --dsa-wc-table-row-background: var(--dsa-color-background-base);
+    --dsa-wc-table-row-font: var(--dsa-font-small-normal);
+    --dsa-wc-table-row-color: var(--dsa-color-text-on-base-primary);
+    --dsa-wc-table-row-hover-background: var(--dsa-color-primitives-purple-100);
+    --dsa-wc-table-row-selected-background: var(
+      --dsa-color-primitives-purple-200
+    );
+    --dsa-wc-table-row-error-background: var(--dsa-color-background-base);
+    --dsa-wc-table-row-hover-error-background: var(
+      --dsa-color-primitives-system-error-200
+    );
+    --dsa-wc-table-row-hover-selected-error-background: var(
+      --dsa-color-primitives-system-error-300
+    );
+    --dsa-wc-table-row-error-border-color: var(
+      --dsa-color-primitives-system-error-500
+    );
+    --dsa-wc-table-row-small-height: 2rem;
+    --dsa-wc-table-row-medium-height: 3.5rem;
+    --dsa-wc-table-row-large-height: 5rem;
+    --dsa-wc-table-row-selectable-cell-width: 40px;
+    --dsa-wc-table-row-expandable-cell-width: 40px;
+    --dsa-wc-table-expanded-row-background: var(
+      --dsa-color-primitives-neutral-300
+    );
+    --dsa-wc-table-expanded-row-transition: all var(--dsa-wc-transition-fast)
+      cubic-bezier(0.2, 0, 0.38, 0.9) 0s;
+    --dsa-wc-table-expanded-row-height: 3rem;
+    --dsa-wc-table-expanded-row-padding-y: var(--dsa-spacing-16);
+    --dsa-wc-table-expanded-row-padding-x: var(--dsa-spacing-24);
+    --dsa-wc-table-expanded-row-top-shadow: inset 0px 11px 8px -8px hsla(0, 0%, 60%, 0.25);
+    --dsa-wc-table-expanded-row-bottom-shadow: inset 0px -11px 10px -12px
+      hsla(0, 0%, 60%, 0.25);
+    --dsa-wc-pagination-font: var(--dsa-font-small-normal);
+    --dsa-wc-pagination-height-desktop: 56px;
+    --dsa-wc-pagination-color: var(--dsa-color-text-on-base-primary);
+    --dsa-wc-pagination-button-border: solid 1px
+      var(--dsa-color-background-border);
+    --dsa-wc-pagination-button-size: 2rem;
+    --dsa-wc-pagination-button-padding: 8px;
+    --dsa-wc-pagination-button-background-color: var(
+      --dsa-color-primitives-neutral-100
+    );
+    --dsa-wc-pagination-button-hover-background-color: var(
+      --dsa-color-background-base-hover
+    );
+    --dsa-wc-pagination-button-selected-background-color: hsla(
+      265,
+      69%,
+      94%,
+      1
+    );
+    --dsa-wc-pagination-button-selected-color: hsla(265, 90%, 39%, 1);
+    --dsa-wc-pagination-button-disabled-color: hsla(0, 0%, 40%, 1);
     --dsa-wc-z-index-drawer: 700;
     --dsa-wc-z-index-dialog: 800;
     --dsa-wc-z-index-dropdown: 900;
@@ -1447,6 +1565,7 @@ export default css`
     display: flex;
     flex-direction: row;
     align-items: center;
+    gap: var(--dsa-spacing-8);
     border-bottom-style: solid;
     border-bottom-color: transparent;
     transition: none;
@@ -1493,6 +1612,7 @@ export default css`
   }
   .dsa-link:visited {
     color: var(--dsa-wc-link-visited-on-base-color);
+    border-bottom-color: var(--dsa-wc-link-visited-on-base-color);
   }
   .dsa-link--with-prefix:visited {
     color: var(--dsa-wc-link-visited-on-base-color);
@@ -1511,6 +1631,7 @@ export default css`
   }
   .dsa-link:active {
     color: var(--dsa-wc-link-active-on-base-color);
+    border-bottom-color: var(--dsa-wc-link-active-on-base-color);
   }
   .dsa-link--with-prefix:active {
     color: var(--dsa-wc-link-active-on-base-color);

package/dist/translations/en-gb.js

@@ -1,7 +1,8 @@
 import {
   en_default,
   registerTranslation
-} from "../chunks/chunk.Y5M7ZKHX.js";
+} from "../chunks/chunk.27JQOQHL.js";
+import "../chunks/chunk.HB7A2UQ7.js";
 import {
   __spreadProps,
   __spreadValues

package/dist/translations/en.js

@@ -1,6 +1,7 @@
 import {
   en_default
-} from "../chunks/chunk.Y5M7ZKHX.js";
+} from "../chunks/chunk.27JQOQHL.js";
+import "../chunks/chunk.HB7A2UQ7.js";
 import "../chunks/chunk.6M63UXML.js";
 export {
   en_default as default

package/dist/translations/fr.js

@@ -1,6 +1,7 @@
 import {
   fr_default
-} from "../chunks/chunk.Y5M7ZKHX.js";
+} from "../chunks/chunk.27JQOQHL.js";
+import "../chunks/chunk.HB7A2UQ7.js";
 import "../chunks/chunk.6M63UXML.js";
 export {
   fr_default as default

package/dist/utilities/localize.d.ts

@@ -1,5 +1,6 @@
 import { LocalizeController as DefaultLocalizationController } from '@shoelace-style/localize';
 import type { Translation as DefaultTranslation } from '@shoelace-style/localize';
+import type { TABLE_SORT_DIRECTION } from '../components/table/defs';
 import '../translations/en';
 import '../translations/fr';
 export declare class LocalizeController extends DefaultLocalizationController<Translation> {
@@ -44,9 +45,28 @@ export interface Translation extends DefaultTranslation {
     fileSelect: (multiple: boolean) => string;
     clearFile: string;
     uploadFileProgressBar: string;
+    pagination: string;
+    paginationResults: (from: number, to: number, total: number) => string;
+    paginationResultsAriaLabel: (from: number, to: number, total: number) => string;
+    linesPerPage: string;
+    page: string;
+    ofTotal: (total: number) => string;
+    previousPage: string;
+    nextPage: string;
+    nextSortDirection: (direction: TABLE_SORT_DIRECTION, label: string) => string;
+    results: string;
+    goToHomepage: string;
+    search: string;
+    cancel: string;
+    showExpandedTableRow: string;
+    hideExpandedTableRow: string;
     fr_FR: string;
     fr_GP: string;
     fr_GF: string;
     fr_MQ: string;
+    fr_NC: string;
+    fr_PF: string;
+    fr_PM: string;
     fr_RE: string;
+    fr_WF: string;
 }

package/dist/utilities/localize.js

@@ -1,7 +1,8 @@
 import {
   LocalizeController,
   registerTranslation
-} from "../chunks/chunk.Y5M7ZKHX.js";
+} from "../chunks/chunk.27JQOQHL.js";
+import "../chunks/chunk.HB7A2UQ7.js";
 import "../chunks/chunk.6M63UXML.js";
 export {
   LocalizeController,

package/dist/utilities/storybook.d.ts

@@ -46,3 +46,4 @@ export declare const withOnLayerOnBaseDecorator: Decorator;
 export declare const withOnFloatingMenuOnBaseDecorator: Decorator;
 export declare const withBackgroundDecorator: Decorator;
 export declare const extractArgsByPrefix: (args: Args, prefix: string) => Args;
+export declare const excludeArgsByPrefix: (args: Args, prefix: string) => Args;

package/dist/utilities/storybook.js

@@ -78,9 +78,21 @@ var extractArgsByPrefix = (args, prefix) => {
     }, [])
   );
 };
+var excludeArgsByPrefix = (args, prefix) => {
+  return Object.fromEntries(
+    Object.entries(args).reduce((filtered, entry) => {
+      if (!entry[0].startsWith(prefix)) {
+        return [...filtered, [entry[0], entry[1]]];
+      } else {
+        return filtered;
+      }
+    }, [])
+  );
+};
 export {
   errorArgTypes,
   errorMessageArgTypes,
+  excludeArgsByPrefix,
   extractArgsByPrefix,
   updateCompleteArgTypes,
   withBackgroundDecorator,