@solid-design-system/components 5.10.1 → 5.12.0

package/cdn/custom-elements.json

@@ -2978,7 +2978,7 @@
           "since": "1.0",
           "dependencies": [
             "sd-icon",
-            "sd-spinner"
+            "sd-loader"
           ],
           "tagName": "sd-button",
           "customElement": true
@@ -10024,6 +10024,177 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "components/loader/loader.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "SdLoader",
+          "members": [
+            {
+              "kind": "field",
+              "name": "color",
+              "type": {
+                "text": "'primary' | 'white' | 'currentColor'"
+              },
+              "default": "'currentColor'",
+              "description": "The color of the loader.",
+              "attribute": "color",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "localize",
+              "privacy": "public",
+              "default": "new LocalizeController(this)"
+            },
+            {
+              "kind": "field",
+              "name": "dir",
+              "type": {
+                "text": "'ltr' | 'rtl' | 'auto'"
+              },
+              "description": "The element's directionality.",
+              "attribute": "dir",
+              "inheritedFrom": {
+                "name": "SolidElement",
+                "module": "internal/solid-element.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "lang",
+              "type": {
+                "text": "string"
+              },
+              "description": "The element's language.",
+              "attribute": "lang",
+              "inheritedFrom": {
+                "name": "SolidElement",
+                "module": "internal/solid-element.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "emit",
+              "parameters": [
+                {
+                  "name": "name",
+                  "type": {
+                    "text": "string"
+                  }
+                },
+                {
+                  "name": "options",
+                  "optional": true,
+                  "type": {
+                    "text": "CustomEventInit"
+                  }
+                }
+              ],
+              "description": "Emits a custom event with more convenient defaults.",
+              "inheritedFrom": {
+                "name": "SolidElement",
+                "module": "internal/solid-element.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "token",
+              "return": {
+                "type": {
+                  "text": "T"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "name",
+                  "type": {
+                    "text": "string"
+                  }
+                },
+                {
+                  "name": "fallback",
+                  "type": {
+                    "text": "T"
+                  }
+                }
+              ],
+              "description": "Retrieves the value of a css variable token.",
+              "inheritedFrom": {
+                "name": "SolidElement",
+                "module": "internal/solid-element.js"
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "color",
+              "type": {
+                "text": "'primary' | 'white' | 'currentColor'"
+              },
+              "default": "'currentColor'",
+              "description": "The color of the loader.",
+              "fieldName": "color"
+            },
+            {
+              "name": "dir",
+              "type": {
+                "text": "'ltr' | 'rtl' | 'auto'"
+              },
+              "description": "The element's directionality.",
+              "fieldName": "dir",
+              "inheritedFrom": {
+                "name": "SolidElement",
+                "module": "src/internal/solid-element.ts"
+              }
+            },
+            {
+              "name": "lang",
+              "type": {
+                "text": "string"
+              },
+              "description": "The element's language.",
+              "fieldName": "lang",
+              "inheritedFrom": {
+                "name": "SolidElement",
+                "module": "src/internal/solid-element.ts"
+              }
+            }
+          ],
+          "superclass": {
+            "name": "SolidElement",
+            "module": "/src/internal/solid-element"
+          },
+          "summary": "Loaders are used to show the progress of an indeterminate operation.",
+          "documentation": "https://solid.union-investment.com/[storybook-link]/loader",
+          "status": "stable",
+          "since": "5.12",
+          "tagName": "sd-loader",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "SdLoader",
+            "module": "components/loader/loader.js"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "sd-loader",
+          "declaration": {
+            "name": "SdLoader",
+            "module": "components/loader/loader.js"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "components/map-marker/map-marker.js",
@@ -14120,6 +14291,819 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "components/range/range.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "SdRange",
+          "cssProperties": [
+            {
+              "description": "The point of origin of the active track, starting at the left side of the range.",
+              "name": "--track-active-offset"
+            }
+          ],
+          "cssParts": [
+            {
+              "description": "The form control that wraps the label, input, and help text.",
+              "name": "form-control"
+            },
+            {
+              "description": "The label's wrapper.",
+              "name": "form-control-label"
+            },
+            {
+              "description": "The help text's wrapper.",
+              "name": "form-control-help-text"
+            },
+            {
+              "description": "The component's base wrapper.",
+              "name": "base"
+            },
+            {
+              "description": "The container that wraps the input track and ticks.",
+              "name": "input-wrapper"
+            },
+            {
+              "description": "The wrapper for the track.",
+              "name": "track-wrapper"
+            },
+            {
+              "description": "The inactive track.",
+              "name": "track"
+            },
+            {
+              "description": "The active track.",
+              "name": "active-track"
+            },
+            {
+              "description": "The element that increases the track clickable area.",
+              "name": "track-click-helper"
+            },
+            {
+              "description": "The thumb(s) that the user can drag to change the range.",
+              "name": "thumb"
+            },
+            {
+              "description": "The container that wraps the tick marks.",
+              "name": "scale-ticks"
+            }
+          ],
+          "slots": [
+            {
+              "description": "The default slot.",
+              "name": ""
+            },
+            {
+              "description": "Text that describes how to use the range. Alternatively, you can use the `help-text` attribute.",
+              "name": "help-text"
+            },
+            {
+              "description": "The range's label. Alternatively, you can use the `label` attribute.",
+              "name": "label"
+            },
+            {
+              "description": "Used to display tick marks at specific intervals along the range.",
+              "name": "scale-ticks"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "localize",
+              "privacy": "public",
+              "default": "new LocalizeController(this)"
+            },
+            {
+              "kind": "field",
+              "name": "thumbs",
+              "type": {
+                "text": "NodeListOf<HTMLDivElement>"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "tooltipFormatter",
+              "type": {
+                "text": "(value: number) => string"
+              },
+              "description": "A function used to format the tooltip's value.\nThe value of the thumb is passed as the only argument.\nThe function should return a string to display in the tooltip."
+            },
+            {
+              "kind": "field",
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The name of the range, submitted as a name/value pair with form data.",
+              "attribute": "name",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "label",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The range's label. If you need to display HTML, use the `label` slot instead.",
+              "attribute": "label",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "helpText",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The range's help text. If you need to display HTML, use the help-text slot instead.",
+              "attribute": "help-text",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "min",
+              "type": {
+                "text": "number"
+              },
+              "default": "0",
+              "description": "The minimum acceptable value of the range.",
+              "attribute": "min",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "max",
+              "type": {
+                "text": "number"
+              },
+              "default": "100",
+              "description": "The maximum acceptable value of the range.",
+              "attribute": "max",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "step",
+              "type": {
+                "text": "number"
+              },
+              "default": "1",
+              "description": "The interval at which the range will increase and decrease.",
+              "attribute": "step",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Disables the range.",
+              "attribute": "disabled",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "visuallyDisabled",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Disables the range visually.",
+              "attribute": "visually-disabled",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "noTrackBar",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Disables the active track bar.",
+              "attribute": "no-track-bar",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "noTooltip",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Disables the thumbs tooltip.",
+              "attribute": "no-tooltip",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "defaultValue",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The default value of the form control. Primarily used for resetting the form control."
+            },
+            {
+              "kind": "field",
+              "name": "value",
+              "description": "The current values of the input (in ascending order) as a string of space separated values",
+              "attribute": "value"
+            },
+            {
+              "kind": "field",
+              "name": "valueAsArray",
+              "description": "Gets or sets the current values of the range as an array of numbers"
+            },
+            {
+              "kind": "field",
+              "name": "rtl",
+              "readonly": true
+            },
+            {
+              "kind": "field",
+              "name": "validity",
+              "description": "Gets the validity state object",
+              "readonly": true
+            },
+            {
+              "kind": "method",
+              "name": "checkValidity",
+              "description": "Checks for validity but does not show the browser's validation message."
+            },
+            {
+              "kind": "method",
+              "name": "reportValidity",
+              "description": "Checks for validity and shows the browser's validation message if the control is invalid."
+            },
+            {
+              "kind": "method",
+              "name": "setCustomValidity",
+              "parameters": [
+                {
+                  "name": "message",
+                  "type": {
+                    "text": "string"
+                  }
+                }
+              ],
+              "description": "Sets a custom validation message. Pass an empty string to restore validity."
+            },
+            {
+              "kind": "field",
+              "name": "dir",
+              "type": {
+                "text": "'ltr' | 'rtl' | 'auto'"
+              },
+              "description": "The element's directionality.",
+              "attribute": "dir",
+              "inheritedFrom": {
+                "name": "SolidElement",
+                "module": "internal/solid-element.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "lang",
+              "type": {
+                "text": "string"
+              },
+              "description": "The element's language.",
+              "attribute": "lang",
+              "inheritedFrom": {
+                "name": "SolidElement",
+                "module": "internal/solid-element.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "emit",
+              "parameters": [
+                {
+                  "name": "name",
+                  "type": {
+                    "text": "string"
+                  }
+                },
+                {
+                  "name": "options",
+                  "optional": true,
+                  "type": {
+                    "text": "CustomEventInit"
+                  }
+                }
+              ],
+              "description": "Emits a custom event with more convenient defaults.",
+              "inheritedFrom": {
+                "name": "SolidElement",
+                "module": "internal/solid-element.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "token",
+              "return": {
+                "type": {
+                  "text": "T"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "name",
+                  "type": {
+                    "text": "string"
+                  }
+                },
+                {
+                  "name": "fallback",
+                  "type": {
+                    "text": "T"
+                  }
+                }
+              ],
+              "description": "Retrieves the value of a css variable token.",
+              "inheritedFrom": {
+                "name": "SolidElement",
+                "module": "internal/solid-element.js"
+              }
+            }
+          ],
+          "events": [
+            {
+              "description": "Emitted when the control loses focus.",
+              "name": "sd-blur"
+            },
+            {
+              "description": "Emitted when an alteration to the control's value is committed by the user.",
+              "name": "sd-change"
+            },
+            {
+              "description": "Emitted when the control gains focus.",
+              "name": "sd-focus"
+            },
+            {
+              "description": "Emitted when the control receives input.",
+              "name": "sd-input"
+            },
+            {
+              "description": "Emitted when the user moves a thumb, either via touch or keyboard. Use `Event.preventDefault()` to prevent movement.",
+              "name": "sd-move"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The name of the range, submitted as a name/value pair with form data.",
+              "fieldName": "name"
+            },
+            {
+              "name": "label",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The range's label. If you need to display HTML, use the `label` slot instead.",
+              "fieldName": "label"
+            },
+            {
+              "name": "help-text",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The range's help text. If you need to display HTML, use the help-text slot instead.",
+              "fieldName": "helpText"
+            },
+            {
+              "name": "min",
+              "type": {
+                "text": "number"
+              },
+              "default": "0",
+              "description": "The minimum acceptable value of the range.",
+              "fieldName": "min"
+            },
+            {
+              "name": "max",
+              "type": {
+                "text": "number"
+              },
+              "default": "100",
+              "description": "The maximum acceptable value of the range.",
+              "fieldName": "max"
+            },
+            {
+              "name": "step",
+              "type": {
+                "text": "number"
+              },
+              "default": "1",
+              "description": "The interval at which the range will increase and decrease.",
+              "fieldName": "step"
+            },
+            {
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Disables the range.",
+              "fieldName": "disabled"
+            },
+            {
+              "name": "visually-disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Disables the range visually.",
+              "fieldName": "visuallyDisabled"
+            },
+            {
+              "name": "no-track-bar",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Disables the active track bar.",
+              "fieldName": "noTrackBar"
+            },
+            {
+              "name": "no-tooltip",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Disables the thumbs tooltip.",
+              "fieldName": "noTooltip"
+            },
+            {
+              "name": "value",
+              "description": "The current values of the input (in ascending order) as a string of space separated values",
+              "fieldName": "value"
+            },
+            {
+              "name": "dir",
+              "type": {
+                "text": "'ltr' | 'rtl' | 'auto'"
+              },
+              "description": "The element's directionality.",
+              "fieldName": "dir",
+              "inheritedFrom": {
+                "name": "SolidElement",
+                "module": "src/internal/solid-element.ts"
+              }
+            },
+            {
+              "name": "lang",
+              "type": {
+                "text": "string"
+              },
+              "description": "The element's language.",
+              "fieldName": "lang",
+              "inheritedFrom": {
+                "name": "SolidElement",
+                "module": "src/internal/solid-element.ts"
+              }
+            }
+          ],
+          "superclass": {
+            "name": "SolidElement",
+            "module": "/src/internal/solid-element"
+          },
+          "summary": "Used to allow users to select a single or multiple values within a defined range using a slider.",
+          "status": "experimental",
+          "since": "5.9",
+          "dependencies": [
+            "sd-tooltip"
+          ],
+          "tagName": "sd-range",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "SdRange",
+            "module": "components/range/range.js"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "sd-range",
+          "declaration": {
+            "name": "SdRange",
+            "module": "components/range/range.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/range/utils.js",
+      "declarations": [
+        {
+          "kind": "function",
+          "name": "numericSort",
+          "return": {
+            "type": {
+              "text": "number"
+            }
+          },
+          "parameters": [
+            {
+              "name": "a",
+              "type": {
+                "text": "number"
+              }
+            },
+            {
+              "name": "b",
+              "type": {
+                "text": "number"
+              }
+            }
+          ]
+        },
+        {
+          "kind": "function",
+          "name": "arraysDiffer",
+          "return": {
+            "type": {
+              "text": ""
+            }
+          },
+          "parameters": [
+            {
+              "name": "a",
+              "type": {
+                "text": "readonly number[]"
+              },
+              "description": "The first array"
+            },
+            {
+              "name": "b",
+              "type": {
+                "text": "readonly number[]"
+              },
+              "description": "The second array"
+            }
+          ],
+          "description": "Check if two numeric array differ"
+        },
+        {
+          "kind": "function",
+          "name": "getNormalizedValueFromClientX",
+          "return": {
+            "type": {
+              "text": "number"
+            }
+          },
+          "parameters": [
+            {
+              "name": "baseDiv",
+              "type": {
+                "text": "HTMLElement"
+              }
+            },
+            {
+              "name": "x",
+              "type": {
+                "text": "number"
+              }
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "numericSort",
+          "declaration": {
+            "name": "numericSort",
+            "module": "components/range/utils.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "arraysDiffer",
+          "declaration": {
+            "name": "arraysDiffer",
+            "module": "components/range/utils.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "getNormalizedValueFromClientX",
+          "declaration": {
+            "name": "getNormalizedValueFromClientX",
+            "module": "components/range/utils.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/range-tick/range-tick.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "SdRangeTick",
+          "cssParts": [
+            {
+              "description": "The component's base wrapper.",
+              "name": "base"
+            },
+            {
+              "description": "The component's label.",
+              "name": "label"
+            },
+            {
+              "description": "The component's tick line.",
+              "name": "line"
+            }
+          ],
+          "slots": [
+            {
+              "description": "The tick's label",
+              "name": ""
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "localize",
+              "privacy": "public",
+              "default": "new LocalizeController(this)"
+            },
+            {
+              "kind": "field",
+              "name": "subtick",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Whether the tick should be shown as a subtick.",
+              "attribute": "subtick",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "dir",
+              "type": {
+                "text": "'ltr' | 'rtl' | 'auto'"
+              },
+              "description": "The element's directionality.",
+              "attribute": "dir",
+              "inheritedFrom": {
+                "name": "SolidElement",
+                "module": "internal/solid-element.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "lang",
+              "type": {
+                "text": "string"
+              },
+              "description": "The element's language.",
+              "attribute": "lang",
+              "inheritedFrom": {
+                "name": "SolidElement",
+                "module": "internal/solid-element.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "emit",
+              "parameters": [
+                {
+                  "name": "name",
+                  "type": {
+                    "text": "string"
+                  }
+                },
+                {
+                  "name": "options",
+                  "optional": true,
+                  "type": {
+                    "text": "CustomEventInit"
+                  }
+                }
+              ],
+              "description": "Emits a custom event with more convenient defaults.",
+              "inheritedFrom": {
+                "name": "SolidElement",
+                "module": "internal/solid-element.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "token",
+              "return": {
+                "type": {
+                  "text": "T"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "name",
+                  "type": {
+                    "text": "string"
+                  }
+                },
+                {
+                  "name": "fallback",
+                  "type": {
+                    "text": "T"
+                  }
+                }
+              ],
+              "description": "Retrieves the value of a css variable token.",
+              "inheritedFrom": {
+                "name": "SolidElement",
+                "module": "internal/solid-element.js"
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "subtick",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Whether the tick should be shown as a subtick.",
+              "fieldName": "subtick"
+            },
+            {
+              "name": "dir",
+              "type": {
+                "text": "'ltr' | 'rtl' | 'auto'"
+              },
+              "description": "The element's directionality.",
+              "fieldName": "dir",
+              "inheritedFrom": {
+                "name": "SolidElement",
+                "module": "src/internal/solid-element.ts"
+              }
+            },
+            {
+              "name": "lang",
+              "type": {
+                "text": "string"
+              },
+              "description": "The element's language.",
+              "fieldName": "lang",
+              "inheritedFrom": {
+                "name": "SolidElement",
+                "module": "src/internal/solid-element.ts"
+              }
+            }
+          ],
+          "superclass": {
+            "name": "SolidElement",
+            "module": "/src/internal/solid-element"
+          },
+          "summary": "Ticks visually improve positioning on range sliders.",
+          "status": "experimental",
+          "since": "5.9",
+          "tagName": "sd-range-tick",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "SdRangeTick",
+            "module": "components/range-tick/range-tick.js"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "sd-range-tick",
+          "declaration": {
+            "name": "SdRangeTick",
+            "module": "components/range-tick/range-tick.js"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "components/scrollable/scrollable.js",
@@ -19587,7 +20571,7 @@
   "package": {
     "name": "@solid-design-system/components",
     "description": "Solid Design System: Components",
-    "version": "5.10.1",
+    "version": "5.12.0",
     "author": "Union Investment",
     "homepage": "https://solid-design-system.fe.union-investment.de/docs/",
     "license": "MIT"