@swisspost/design-system-components 1.3.10 → 1.5.0

package/dist/docs.json

@@ -1,11 +1,163 @@
 {
-  "timestamp": "2023-08-14T11:59:52",
+  "timestamp": "2023-10-04T09:51:38",
   "compiler": {
     "name": "@stencil/core",
     "version": "3.4.2",
     "typescriptVersion": "5.0.4"
   },
   "components": [
+    {
+      "filePath": "./src/components/post-alert/post-alert.tsx",
+      "encapsulation": "shadow",
+      "tag": "post-alert",
+      "readme": "# post-alert\n\n\n",
+      "docs": "",
+      "docsTags": [],
+      "usage": {},
+      "props": [
+        {
+          "name": "dismissLabel",
+          "type": "string",
+          "mutable": false,
+          "attr": "dismiss-label",
+          "reflectToAttr": false,
+          "docs": "The label to use for the close button of a dismissible alert.",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
+        {
+          "name": "dismissible",
+          "type": "boolean",
+          "mutable": false,
+          "attr": "dismissible",
+          "reflectToAttr": false,
+          "docs": "If `true`, a close button (×) is displayed and the alert can be dismissed by the user.",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
+        {
+          "name": "fixed",
+          "type": "boolean",
+          "mutable": false,
+          "attr": "fixed",
+          "reflectToAttr": false,
+          "docs": "If `true`, the alert is positioned at the bottom of the window, from edge to edge.",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
+        {
+          "name": "icon",
+          "type": "string",
+          "mutable": false,
+          "attr": "icon",
+          "reflectToAttr": false,
+          "docs": "The icon to display in the alert. By default, the icon depends on the alert type.\n\nIf `none`, no icon is displayed.",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
+        {
+          "name": "type",
+          "type": "\"danger\" | \"gray\" | \"info\" | \"primary\" | \"success\" | \"warning\"",
+          "mutable": false,
+          "attr": "type",
+          "reflectToAttr": false,
+          "docs": "The type of the alert.",
+          "docsTags": [],
+          "default": "'primary'",
+          "values": [
+            {
+              "value": "danger",
+              "type": "string"
+            },
+            {
+              "value": "gray",
+              "type": "string"
+            },
+            {
+              "value": "info",
+              "type": "string"
+            },
+            {
+              "value": "primary",
+              "type": "string"
+            },
+            {
+              "value": "success",
+              "type": "string"
+            },
+            {
+              "value": "warning",
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false
+        }
+      ],
+      "methods": [
+        {
+          "name": "dismiss",
+          "returns": {
+            "type": "Promise<void>",
+            "docs": ""
+          },
+          "signature": "dismiss() => Promise<void>",
+          "parameters": [],
+          "docs": "Triggers alert dismissal programmatically (same as clicking on the close button (×)).",
+          "docsTags": []
+        }
+      ],
+      "events": [
+        {
+          "event": "dismissed",
+          "detail": "void",
+          "bubbles": true,
+          "cancelable": true,
+          "composed": true,
+          "docs": "An event emitted when the alert element is dismissed, after the transition.\nIt has no payload and only relevant for dismissible alerts.",
+          "docsTags": []
+        }
+      ],
+      "listeners": [],
+      "styles": [],
+      "slots": [],
+      "parts": [],
+      "dependents": [],
+      "dependencies": [
+        "post-icon"
+      ],
+      "dependencyGraph": {
+        "post-alert": [
+          "post-icon"
+        ]
+      }
+    },
     {
       "filePath": "./src/components/post-collapsible/post-collapsible.tsx",
       "encapsulation": "shadow",
@@ -232,6 +384,294 @@
       "styles": [],
       "slots": [],
       "parts": [],
+      "dependents": [
+        "post-alert"
+      ],
+      "dependencies": [],
+      "dependencyGraph": {
+        "post-alert": [
+          "post-icon"
+        ]
+      }
+    },
+    {
+      "filePath": "./src/components/post-tab-header/post-tab-header.tsx",
+      "encapsulation": "shadow",
+      "tag": "post-tab-header",
+      "readme": "# post-tab-header\n\n\n",
+      "docs": "",
+      "docsTags": [],
+      "usage": {},
+      "props": [
+        {
+          "name": "panel",
+          "type": "string",
+          "mutable": false,
+          "attr": "panel",
+          "reflectToAttr": false,
+          "docs": "The name of the panel controlled by the tab header.",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false
+        }
+      ],
+      "methods": [],
+      "events": [],
+      "listeners": [],
+      "styles": [],
+      "slots": [],
+      "parts": [],
+      "dependents": [],
+      "dependencies": [],
+      "dependencyGraph": {}
+    },
+    {
+      "filePath": "./src/components/post-tab-panel/post-tab-panel.tsx",
+      "encapsulation": "shadow",
+      "tag": "post-tab-panel",
+      "readme": "# post-tab-panel\n\n\n",
+      "docs": "",
+      "docsTags": [],
+      "usage": {},
+      "props": [
+        {
+          "name": "name",
+          "type": "string",
+          "mutable": false,
+          "attr": "name",
+          "reflectToAttr": false,
+          "docs": "The name of the panel, used to associate it with a tab header.",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false
+        }
+      ],
+      "methods": [],
+      "events": [],
+      "listeners": [],
+      "styles": [],
+      "slots": [],
+      "parts": [],
+      "dependents": [],
+      "dependencies": [],
+      "dependencyGraph": {}
+    },
+    {
+      "filePath": "./src/components/post-tabs/post-tabs.tsx",
+      "encapsulation": "shadow",
+      "tag": "post-tabs",
+      "readme": "# post-tabs\n\n\n",
+      "docs": "",
+      "docsTags": [],
+      "usage": {},
+      "props": [
+        {
+          "name": "activePanel",
+          "type": "string",
+          "mutable": false,
+          "attr": "active-panel",
+          "reflectToAttr": false,
+          "docs": "The name of the panel that is initially shown.\nIf not specified, it defaults to the panel associated with the first tab.\n\n**Changing this value after initialization has no effect.**",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false
+        }
+      ],
+      "methods": [
+        {
+          "name": "show",
+          "returns": {
+            "type": "Promise<void>",
+            "docs": ""
+          },
+          "signature": "show(panelName: string) => Promise<void>",
+          "parameters": [],
+          "docs": "Shows the panel with the given name and selects its associated tab.\nAny other panel that was previously shown becomes hidden and its associated tab is unselected.",
+          "docsTags": []
+        }
+      ],
+      "events": [
+        {
+          "event": "tabChange",
+          "detail": "string",
+          "bubbles": true,
+          "cancelable": true,
+          "composed": true,
+          "docs": "An event emitted after the active tab changes, when the fade in transition of its associated panel is finished.\nThe payload is the name of the newly shown panel.",
+          "docsTags": []
+        }
+      ],
+      "listeners": [],
+      "styles": [],
+      "slots": [],
+      "parts": [],
+      "dependents": [],
+      "dependencies": [],
+      "dependencyGraph": {}
+    },
+    {
+      "filePath": "./src/components/post-tooltip/post-tooltip.tsx",
+      "encapsulation": "shadow",
+      "tag": "post-tooltip",
+      "readme": "# post-tooltip\n\n\n",
+      "docs": "",
+      "docsTags": [],
+      "usage": {},
+      "props": [
+        {
+          "name": "backgroundColor",
+          "type": "\"primary\" | \"yellow\"",
+          "mutable": false,
+          "attr": "background-color",
+          "reflectToAttr": false,
+          "docs": "Defines the background color of the tooltip.\nChoose the one that provides the best contrast in your scenario.",
+          "docsTags": [],
+          "default": "'primary'",
+          "values": [
+            {
+              "value": "primary",
+              "type": "string"
+            },
+            {
+              "value": "yellow",
+              "type": "string"
+            }
+          ],
+          "optional": true,
+          "required": false
+        },
+        {
+          "name": "placement",
+          "type": "\"bottom\" | \"bottom-end\" | \"bottom-start\" | \"left\" | \"left-end\" | \"left-start\" | \"right\" | \"right-end\" | \"right-start\" | \"top\" | \"top-end\" | \"top-start\"",
+          "mutable": false,
+          "attr": "placement",
+          "reflectToAttr": false,
+          "docs": "Defines the placement of the tooltip according to the floating-ui options available at https://floating-ui.com/docs/computePosition#placement.\nTooltips are automatically flipped to the opposite side if there is not enough available space and are shifted\ntowards the viewport if they would overlap edge boundaries.",
+          "docsTags": [],
+          "default": "'top'",
+          "values": [
+            {
+              "value": "bottom",
+              "type": "string"
+            },
+            {
+              "value": "bottom-end",
+              "type": "string"
+            },
+            {
+              "value": "bottom-start",
+              "type": "string"
+            },
+            {
+              "value": "left",
+              "type": "string"
+            },
+            {
+              "value": "left-end",
+              "type": "string"
+            },
+            {
+              "value": "left-start",
+              "type": "string"
+            },
+            {
+              "value": "right",
+              "type": "string"
+            },
+            {
+              "value": "right-end",
+              "type": "string"
+            },
+            {
+              "value": "right-start",
+              "type": "string"
+            },
+            {
+              "value": "top",
+              "type": "string"
+            },
+            {
+              "value": "top-end",
+              "type": "string"
+            },
+            {
+              "value": "top-start",
+              "type": "string"
+            }
+          ],
+          "optional": true,
+          "required": false
+        }
+      ],
+      "methods": [
+        {
+          "name": "hide",
+          "returns": {
+            "type": "Promise<void>",
+            "docs": ""
+          },
+          "signature": "hide() => Promise<void>",
+          "parameters": [],
+          "docs": "Programmatically hide this tooltip",
+          "docsTags": []
+        },
+        {
+          "name": "show",
+          "returns": {
+            "type": "Promise<void>",
+            "docs": ""
+          },
+          "signature": "show(target: HTMLElement) => Promise<void>",
+          "parameters": [],
+          "docs": "Programmatically display the tooltip",
+          "docsTags": [
+            {
+              "name": "param",
+              "text": "target An element with [data-tooltip-target=\"id\"] where the tooltip should be shown"
+            }
+          ]
+        },
+        {
+          "name": "toggle",
+          "returns": {
+            "type": "Promise<void>",
+            "docs": ""
+          },
+          "signature": "toggle(target: HTMLElement, force?: boolean) => Promise<void>",
+          "parameters": [],
+          "docs": "Toggle tooltip display",
+          "docsTags": [
+            {
+              "name": "param",
+              "text": "target An element with [data-tooltip-target=\"id\"] where the tooltip should be shown"
+            },
+            {
+              "name": "param",
+              "text": "force Pass true to always show or false to always hide"
+            }
+          ]
+        }
+      ],
+      "events": [],
+      "listeners": [],
+      "styles": [],
+      "slots": [],
+      "parts": [],
       "dependents": [],
       "dependencies": [],
       "dependencyGraph": {}

package/dist/esm/check-non-empty-554bdf88.js

@@ -0,0 +1,11 @@
+const EMPTY_VALUES = [undefined, null, ''];
+
+function checkNonEmpty(value, error) {
+  if (EMPTY_VALUES.some(v => v === value)) {
+    throw new Error(error);
+  }
+}
+
+export { EMPTY_VALUES as E, checkNonEmpty as c };
+
+//# sourceMappingURL=check-non-empty-554bdf88.js.map

package/dist/esm/check-non-empty-554bdf88.js.map

@@ -0,0 +1 @@
+{"file":"check-non-empty-554bdf88.js","mappings":"MAAa,YAAY,GAAG,CAAC,SAAS,EAAE,IAAI,EAAE,EAAE;;SCEhC,aAAa,CAAC,KAAc,EAAE,KAAa;EACzD,IAAI,YAAY,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,KAAK,KAAK,CAAC,EAAE;IACvC,MAAM,IAAI,KAAK,CAAC,KAAK,CAAC,CAAC;GACxB;AACH;;;;","names":[],"sources":["./src/utils/property-checkers/constants.ts","./src/utils/property-checkers/check-non-empty.ts"],"sourcesContent":["export const EMPTY_VALUES = [undefined, null, ''];\n","import { EMPTY_VALUES } from './constants';\n\nexport function checkNonEmpty(value: unknown, error: string) {\n  if (EMPTY_VALUES.some(v => v === value)) {\n    throw new Error(error);\n  }\n}\n"],"version":3}

package/dist/esm/check-one-of-ded5e15e.js

@@ -0,0 +1,8 @@
+function checkOneOf(value, possibleValues, error) {
+  if (!possibleValues.includes(value))
+    throw new Error(error);
+}
+
+export { checkOneOf as c };
+
+//# sourceMappingURL=check-one-of-ded5e15e.js.map

package/dist/esm/check-one-of-ded5e15e.js.map

@@ -0,0 +1 @@
+{"file":"check-one-of-ded5e15e.js","mappings":"SAAgB,UAAU,CAAI,KAAQ,EAAE,cAA4B,EAAE,KAAa;EACjF,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,KAAK,CAAC;IAAE,MAAM,IAAI,KAAK,CAAC,KAAK,CAAC,CAAC;AAC9D;;;;","names":[],"sources":["./src/utils/property-checkers/check-one-of.ts"],"sourcesContent":["export function checkOneOf<T>(value: T, possibleValues: readonly T[], error: string) {\n  if (!possibleValues.includes(value)) throw new Error(error);\n}\n"],"version":3}

package/dist/esm/check-type-18ebb4e7.js

@@ -0,0 +1,16 @@
+function checkType(value, type, error) {
+  const typeIsArray = type === 'array';
+  const valueIsArray = Array.isArray(value);
+  if (typeIsArray || valueIsArray) {
+    if (valueIsArray !== typeIsArray)
+      throw new Error(error);
+  }
+  else {
+    if (typeof value !== type)
+      throw new Error(error);
+  }
+}
+
+export { checkType as c };
+
+//# sourceMappingURL=check-type-18ebb4e7.js.map

package/dist/esm/check-type-18ebb4e7.js.map

@@ -0,0 +1 @@
+{"file":"check-type-18ebb4e7.js","mappings":"SAQgB,SAAS,CAAC,KAAc,EAAE,IAAkB,EAAE,KAAa;EACzE,MAAM,WAAW,GAAG,IAAI,KAAK,OAAO,CAAC;EACrC,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;EAE1C,IAAI,WAAW,IAAI,YAAY,EAAE;IAC/B,IAAI,YAAY,KAAK,WAAW;MAAE,MAAM,IAAI,KAAK,CAAC,KAAK,CAAC,CAAC;GAC1D;OAAM;IACL,IAAI,OAAO,KAAK,KAAK,IAAI;MAAE,MAAM,IAAI,KAAK,CAAC,KAAK,CAAC,CAAC;GACnD;AACH;;;;","names":[],"sources":["./src/utils/property-checkers/check-type.ts"],"sourcesContent":["export type PropertyType =\n  | 'boolean'\n  | 'number'\n  | 'string'\n  | 'array'\n  | 'object'\n  | 'function';\n\nexport function checkType(value: unknown, type: PropertyType, error: string) {\n  const typeIsArray = type === 'array';\n  const valueIsArray = Array.isArray(value);\n\n  if (typeIsArray || valueIsArray) {\n    if (valueIsArray !== typeIsArray) throw new Error(error);\n  } else {\n    if (typeof value !== type) throw new Error(error);\n  }\n}\n"],"version":3}

package/dist/esm/fade-671f1489.js

@@ -0,0 +1,9 @@
+const fadeDuration = 200;
+const fadedOutKeyFrame = { opacity: '0' };
+const fadedInKeyFrame = { opacity: '1' };
+const fadeIn = (el) => el.animate([fadedOutKeyFrame, fadedInKeyFrame], { duration: fadeDuration });
+const fadeOut = (el) => el.animate([fadedInKeyFrame, fadedOutKeyFrame], { duration: fadeDuration });
+
+export { fadeIn as a, fadeOut as f };
+
+//# sourceMappingURL=fade-671f1489.js.map

package/dist/esm/fade-671f1489.js.map

@@ -0,0 +1 @@
+{"file":"fade-671f1489.js","mappings":"AAAA,MAAM,YAAY,GAAG,GAAG,CAAC;AACzB,MAAM,gBAAgB,GAAG,EAAC,OAAO,EAAE,GAAG,EAAC,CAAC;AACxC,MAAM,eAAe,GAAG,EAAC,OAAO,EAAE,GAAG,EAAC,CAAC;MAE1B,MAAM,GAAG,CAAC,EAAW,KAAgB,EAAE,CAAC,OAAO,CAC1D,CAAE,gBAAgB,EAAE,eAAe,CAAE,EACrC,EAAE,QAAQ,EAAE,YAAY,EAAE,EAC1B;MAEW,OAAO,GAAG,CAAC,EAAW,KAAgB,EAAE,CAAC,OAAO,CAC3D,CAAE,eAAe,EAAE,gBAAgB,CAAE,EACrC,EAAE,QAAQ,EAAE,YAAY,EAAE;;;;","names":[],"sources":["./src/animations/fade.ts"],"sourcesContent":["const fadeDuration = 200;\nconst fadedOutKeyFrame = {opacity: '0'};\nconst fadedInKeyFrame = {opacity: '1'};\n\nexport const fadeIn = (el: Element): Animation => el.animate(\n  [ fadedOutKeyFrame, fadedInKeyFrame ],\n  { duration: fadeDuration }\n);\n\nexport const fadeOut = (el: Element): Animation => el.animate(\n  [ fadedInKeyFrame, fadedOutKeyFrame ],\n  { duration: fadeDuration }\n);\n"],"version":3}