@scania/tegel 0.0.1-beta.9 → 0.0.4

package/dist/collection/components/slider/slider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"slider.js","sourceRoot":"","sources":["../../../src/components/slider/slider.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, Listen, EventEmitter, Event, Method } from '@stencil/core';\n\n@Component({\n  tag: 'sdds-slider',\n  styleUrl: 'slider.scss',\n  shadow: false,\n})\nexport class Slider {\n  /** Text for label */\n  @Prop() label: string = '';\n\n  /** Initial value */\n  @Prop() value: string = '0';\n\n  /** Minimum value */\n  @Prop() min: string = '0';\n\n  /** Maximum value */\n  @Prop() max: string = '100';\n\n  /** Number of tick markers (tick for min- and max-value will be added automatically) */\n  @Prop() ticks: string = '0';\n\n  /** Decide to show numbers above the tick markers or not  */\n  @Prop() showTickNumbers: boolean = false;\n\n  /** Decide to show the tooltip or not */\n  @Prop() tooltip: boolean = null;\n\n  /** Sets the disabled state for the whole component  */\n  @Prop() disabled: boolean = null;\n\n  /** Sets the read only state for the whole component  */\n  @Prop() readOnly: boolean = null;\n\n  /** Decide to show the controls or not */\n  @Prop() controls: boolean = null;\n\n  /** Decide to show the input field or not */\n  @Prop() input: boolean = null;\n\n  /** Defines how much to increment/decrement the value when using controls */\n  @Prop() step: string = '1';\n\n  /** Name property (will be inherited by the native slider component) */\n  @Prop() name: string = '';\n\n  /** Sets the size of the scrubber */\n  @Prop() size: 'sm' | '' = '';\n\n  /** Snap to the ticks grid */\n  @Prop() snap: boolean = null;\n\n  /** Id for the sliders input element, randomly generated if not specified. */\n  @Prop() sliderId: string = crypto.randomUUID();\n\n  wrapperElement: HTMLElement = null;\n\n  scrubberElement: HTMLElement = null;\n\n  scrubberInnerElement: HTMLElement = null;\n\n  dividersElement: HTMLElement = null;\n\n  trackElement: HTMLElement = null;\n\n  trackFillElement: HTMLElement = null;\n\n  minusElement: HTMLElement = null;\n\n  plusElement: HTMLElement = null;\n\n  inputElement: HTMLInputElement = null;\n\n  nativeRangeInputElement: HTMLInputElement = null;\n\n  scrubberGrabPos: object = { x: 0, y: 0 };\n\n  scrubberGrabbed: boolean = false;\n\n  scrubberLeft: number = 0;\n\n  tickValues: Array<number> = [];\n\n  disabledState: boolean = false;\n\n  readonlyState: boolean = false;\n\n  useControls: boolean = false;\n\n  useInput: boolean = false;\n\n  useSmall: boolean = false;\n\n  useSnapping: boolean = false;\n\n  supposedValueSlot: number = -1;\n\n  eventListenersAdded: boolean = false;\n\n  resizeObserverAdded: boolean = false;\n\n  /** Sends unique checkbox identifier and value when the slider has a change in value. */\n  @Event({\n    eventName: 'sddsChange',\n    composed: true,\n    cancelable: true,\n    bubbles: true,\n  })\n  sddsChange: EventEmitter<{\n    value: string;\n  }>;\n\n  /** Public method to re-initialise the slider if some configuration props are changed */\n  @Method() async reset() {\n    // @TODO: maybe refactor to use watch-decorators instead\n    this.componentWillLoad();\n    this.componentDidLoad();\n  }\n\n  @Listen('keydown')\n  handleKeydown(event) {\n    switch (event.key) {\n      case 'ArrowLeft':\n        this.stepLeft();\n        break;\n\n      case 'ArrowRight':\n        this.stepRight();\n        break;\n\n      default:\n        break;\n    }\n  }\n\n  @Listen('mouseup', { target: 'window' })\n  handleMouseUp() {\n    if (!this.scrubberGrabbed) {\n      return;\n    }\n\n    this.scrubberGrabbed = false;\n    this.scrubberInnerElement.classList.remove('pressed');\n    this.updateValue();\n\n    this.trackElement.focus();\n  }\n\n  @Listen('touchend', { target: 'window' })\n  handleTouchEnd() {\n    if (!this.scrubberGrabbed) {\n      return;\n    }\n\n    this.scrubberGrabbed = false;\n    this.scrubberInnerElement.classList.remove('pressed');\n    this.updateValue();\n\n    this.trackElement.focus();\n  }\n\n  @Listen('mousemove', { target: 'window' })\n  handleMouseMove(event) {\n    if (!this.scrubberGrabbed) {\n      return;\n    }\n\n    const numTicks = parseInt(this.ticks);\n    const trackRect = this.trackElement.getBoundingClientRect();\n    let localLeft = event.clientX - trackRect.left;\n    this.supposedValueSlot = -1;\n\n    if (this.useSnapping && numTicks > 0) {\n      const v = Math.round(this.getTrackWidth() / (numTicks + 1));\n      localLeft = Math.round(localLeft / v) * v;\n\n      this.supposedValueSlot = Math.round(localLeft / v);\n    }\n\n    this.scrubberLeft = this.constrainScrubber(localLeft);\n    this.scrubberElement.style.left = `${this.scrubberLeft}px`;\n\n    this.updateValue();\n    this.updateTrack();\n  }\n\n  @Listen('touchmove', { target: 'window' })\n  handleTouchMove(event) {\n    event.preventDefault();\n\n    if (!this.scrubberGrabbed) {\n      return;\n    }\n\n    const numTicks = parseInt(this.ticks);\n    const trackRect = this.trackElement.getBoundingClientRect();\n    let localLeft = event.touches[0].clientX - trackRect.left;\n\n    this.supposedValueSlot = -1;\n\n    if (this.useSnapping && numTicks > 0) {\n      const v = Math.round(this.getTrackWidth() / (numTicks + 1));\n      localLeft = Math.round(localLeft / v) * v;\n\n      this.supposedValueSlot = Math.round(localLeft / v);\n    }\n\n    this.scrubberLeft = this.constrainScrubber(localLeft);\n    this.scrubberElement.style.left = `${this.scrubberLeft}px`;\n\n    this.updateValue();\n    this.updateTrack();\n  }\n\n  updateTrack() {\n    const trackWidth = this.getTrackWidth();\n    const percentageFilled = (this.scrubberLeft / trackWidth) * 100;\n\n    this.trackFillElement.style.width = `${percentageFilled}%`;\n  }\n\n  dispatchChangeEvent() {\n    this.sddsChange.emit({ value: this.value });\n  }\n\n  updateValue() {\n    const trackWidth = this.getTrackWidth();\n\n    /* if snapping (supposedValueSlot > 0) is enabled, make sure we display the supposed value (instead of maybe getting a -1/+1 depending on rounding)  */\n    if (this.supposedValueSlot > 0) {\n      const supposedValue = this.tickValues[this.supposedValueSlot];\n      this.value = `${supposedValue}`;\n    } else {\n      const percentage = this.scrubberLeft / trackWidth;\n      this.value = `${Math.trunc(this.getMin() + percentage * (this.getMax() - this.getMin()))}`;\n    }\n\n    this.dispatchChangeEvent();\n  }\n\n  updateValueForced(value) {\n    this.value = value;\n    this.dispatchChangeEvent();\n  }\n\n  getMin() {\n    return parseFloat(this.min);\n  }\n\n  getMax() {\n    return parseFloat(this.max);\n  }\n\n  constrainScrubber(x) {\n    const width = this.getTrackWidth();\n\n    if (x < 0) {\n      return 0;\n    }\n\n    if (x > width) {\n      return width;\n    }\n\n    return x;\n  }\n\n  getTrackWidth() {\n    const trackRect = this.trackElement.getBoundingClientRect();\n    return trackRect.right - trackRect.left;\n  }\n\n  calculateScrubberLeftFromValue(value) {\n    const initValue = value;\n    const trackWidth = this.getTrackWidth();\n\n    const normalizedValue = initValue - this.getMin();\n    const normalizedMax = this.getMax() - this.getMin();\n\n    const calculatedLeft = (normalizedValue / normalizedMax) * trackWidth;\n\n    this.scrubberLeft = calculatedLeft;\n\n    this.scrubberElement.style.left = `${this.scrubberLeft}px`;\n  }\n\n  componentDidLoad() {\n    if (!this.resizeObserverAdded) {\n      this.resizeObserverAdded = true;\n\n      const resizeObserver = new ResizeObserver((/* entries */) => {\n        this.calculateScrubberLeftFromValue(this.value);\n        this.updateTrack();\n      });\n\n      resizeObserver.observe(this.wrapperElement);\n    }\n\n    if (!this.eventListenersAdded) {\n      this.eventListenersAdded = true;\n\n      this.scrubberElement.addEventListener('mousedown', (event) => {\n        event.preventDefault();\n        this.grabScrubber(event.offsetX, event.offsetY);\n      });\n\n      this.scrubberElement.addEventListener('touchstart', (event) => {\n        const rect = this.scrubberElement.getBoundingClientRect();\n        const x = event.targetTouches[0].pageX - rect.left;\n        const y = event.targetTouches[0].pageY - rect.top;\n        this.grabScrubber(x, y);\n      });\n\n      if (this.useControls) {\n        this.minusElement.addEventListener('click', () => {\n          this.stepLeft();\n        });\n\n        this.plusElement.addEventListener('click', () => {\n          this.stepRight();\n        });\n      }\n\n      if (this.inputElement) {\n        this.inputElement.addEventListener('keydown', (event) => {\n          event.stopPropagation();\n\n          if (event.key === 'Enter') {\n            let newValue = parseInt(this.inputElement.value);\n\n            if (newValue < this.getMin()) {\n              newValue = this.getMin();\n            } else if (newValue > this.getMax()) {\n              newValue = this.getMax();\n            }\n\n            this.calculateScrubberLeftFromValue(newValue);\n            this.updateValueForced(newValue);\n            this.updateTrack();\n\n            this.inputElement.blur();\n            this.wrapperElement.focus();\n          }\n        });\n      }\n    }\n\n    this.calculateScrubberLeftFromValue(this.value);\n    this.updateTrack();\n  }\n\n  grabScrubber(xOffset, yOffset) {\n    if (this.readonlyState) {\n      return;\n    }\n\n    this.scrubberGrabPos = {\n      x: xOffset,\n      y: yOffset,\n    };\n\n    this.scrubberGrabbed = true;\n    this.scrubberInnerElement.classList.add('pressed');\n  }\n\n  calculateInputSizeFromMax() {\n    return this.max.length;\n  }\n\n  controlsStep(delta) {\n    if (this.readonlyState || this.disabled) {\n      return;\n    }\n\n    const trackWidth = this.getTrackWidth();\n    const percentage = this.scrubberLeft / trackWidth;\n    const numTicks = parseInt(this.ticks);\n\n    let currentValue = this.getMin() + percentage * (this.getMax() - this.getMin());\n\n    currentValue += delta;\n\n    if (currentValue < this.getMin()) {\n      currentValue = this.getMin();\n    } else if (currentValue > this.getMax()) {\n      currentValue = this.getMax();\n    }\n\n    this.value = `${currentValue}`;\n\n    /* if snapping is enabled, instead just increment or decrement the current \"fixed\" value from our ticknumber array */\n    if (this.useSnapping && numTicks > 0) {\n      const stepDir = delta > 0 ? 1 : -1;\n      this.supposedValueSlot += stepDir;\n\n      if (this.supposedValueSlot < 0) {\n        this.supposedValueSlot = 0;\n      } else if (this.supposedValueSlot > numTicks + 1) {\n        this.supposedValueSlot = numTicks + 1;\n      }\n    }\n\n    this.calculateScrubberLeftFromValue(currentValue);\n    this.updateTrack();\n    this.updateValue();\n  }\n\n  stepLeft() {\n    this.controlsStep(-parseInt(this.step));\n  }\n\n  stepRight() {\n    this.controlsStep(parseInt(this.step));\n  }\n\n  componentWillLoad() {\n    const numTicks = parseInt(this.ticks);\n\n    if (numTicks > 0) {\n      this.tickValues = [this.getMin()];\n\n      const step = (this.getMax() - this.getMin()) / (numTicks + 1);\n\n      for (let i = 1; i < numTicks + 1; i++) {\n        this.tickValues.push(this.getMin() + Math.round(step * i));\n      }\n\n      this.tickValues.push(this.getMax());\n    }\n\n    if (this.disabled !== null) {\n      this.disabledState = true;\n    } else {\n      this.disabledState = false;\n    }\n\n    if (this.readOnly !== null) {\n      this.readonlyState = true;\n    } else {\n      this.readonlyState = false;\n    }\n\n    this.useInput = false;\n    this.useControls = false;\n\n    if (this.controls !== null) {\n      this.useControls = true;\n    } else if (this.input !== null) {\n      this.useInput = true;\n    }\n\n    this.useSmall = false;\n\n    if (this.size === 'sm') {\n      this.useSmall = true;\n    }\n\n    this.useSnapping = false;\n\n    if (this.snap !== null) {\n      this.useSnapping = true;\n    }\n\n    const min = this.getMin();\n    const max = this.getMax();\n\n    if (min > max) {\n      console.warn(\n        'min-prop must have a higher value than max-prop for the component to work correctly.',\n      );\n      this.disabledState = true;\n    }\n  }\n\n  render() {\n    return (\n      <div class={`sdds-slider-wrapper ${this.readonlyState ? 'read-only' : ''}`}>\n        <input\n          ref={(el) => {\n            this.nativeRangeInputElement = el as HTMLInputElement;\n          }}\n          class=\"sdds-slider-native-element\"\n          type=\"range\"\n          value={this.value}\n          name={this.name}\n          min={this.min}\n          max={this.max}\n          disabled={this.disabled}\n          id={this.sliderId}\n        ></input>\n\n        <div\n          class={`sdds-slider ${this.disabledState ? 'disabled' : ''} ${\n            this.useSmall ? 'sdds-slider-small' : ''\n          }`}\n          ref={(el) => {\n            this.wrapperElement = el as HTMLElement;\n          }}\n        >\n          {this.useInput && (\n            <div class=\"sdds-slider__input-values\">\n              <div\n                ref={(el) => {\n                  this.minusElement = el as HTMLElement;\n                }}\n                class=\"sdds-slider__input-value\"\n              >\n                {this.min}\n              </div>\n            </div>\n          )}\n\n          {this.useControls && (\n            <div class=\"sdds-slider__controls\">\n              <div\n                ref={(el) => (this.minusElement = el as HTMLElement)}\n                class=\"sdds-slider__control sdds-slider__control-minus\"\n              >\n                <sdds-icon name=\"minus\" size=\"16px\"></sdds-icon>\n              </div>\n            </div>\n          )}\n\n          <div class=\"sdds-slider-inner\">\n            <label class={this.tickValues.length > 0 && 'offset'}>{this.label}</label>\n\n            {this.tickValues.length > 0 && (\n              <div class=\"sdds-slider__value-dividers-wrapper\">\n                <div\n                  ref={(el) => {\n                    this.dividersElement = el as HTMLElement;\n                  }}\n                  class=\"sdds-slider__value-dividers\"\n                >\n                  {this.tickValues.map((value) => (\n                    <div class=\"sdds-slider__value-divider\">\n                      {this.showTickNumbers && <span>{value}</span>}\n                    </div>\n                  ))}\n                </div>\n              </div>\n            )}\n\n            <div\n              class=\"sdds-slider__track\"\n              ref={(el) => {\n                this.trackElement = el as HTMLElement;\n              }}\n              tabindex={this.disabled ? '-1' : '0'}\n            >\n              <div\n                class=\"sdds-slider__track-fill\"\n                ref={(el) => {\n                  this.trackFillElement = el as HTMLElement;\n                }}\n              ></div>\n\n              <div\n                class=\"sdds-slider__scrubber\"\n                ref={(el) => {\n                  this.scrubberElement = el as HTMLElement;\n                }}\n              >\n                {this.tooltip !== null && (\n                  <div class=\"sdds-slider__value\">\n                    {this.value}\n                    <svg\n                      width=\"18\"\n                      height=\"14\"\n                      viewBox=\"0 0 18 14\"\n                      fill=\"none\"\n                      xmlns=\"http://www.w3.org/2000/svg\"\n                    >\n                      <path\n                        d=\"M8.15882 12.6915L0.990487 1.54076C0.562658 0.875246 1.0405 0 1.83167 0H16.1683C16.9595 0 17.4373 0.875246 17.0095 1.54076L9.84118 12.6915C9.44754 13.3038 8.55246 13.3038 8.15882 12.6915Z\"\n                        fill=\"#37414F\"\n                      />\n                    </svg>\n                  </div>\n                )}\n\n                <div\n                  class=\"sdds-slider__scrubber-inner\"\n                  ref={(el) => {\n                    this.scrubberInnerElement = el as HTMLElement;\n                  }}\n                ></div>\n              </div>\n            </div>\n          </div>\n\n          {this.useInput && (\n            <div class=\"sdds-slider__input-values\">\n              <div\n                ref={(el) => {\n                  this.minusElement = el as HTMLElement;\n                }}\n                class=\"sdds-slider__input-value\"\n              >\n                {this.max}\n              </div>\n              <div class=\"sdds-slider__input-field-wrapper\">\n                <input\n                  onFocus={(e) => {\n                    if (this.readonlyState) {\n                      e.preventDefault();\n                      this.inputElement.blur();\n                    }\n                  }}\n                  size={this.calculateInputSizeFromMax()}\n                  class=\"sdds-slider__input-field\"\n                  value={this.value}\n                  ref={(el) => {\n                    this.inputElement = el as HTMLInputElement;\n                  }}\n                />\n              </div>\n            </div>\n          )}\n\n          {this.useControls && (\n            <div class=\"sdds-slider__controls\">\n              <div\n                ref={(el) => (this.plusElement = el as HTMLElement)}\n                class=\"sdds-slider__control sdds-slider__control-plus\"\n              >\n                <sdds-icon name=\"plus\" size=\"16px\"></sdds-icon>\n              </div>\n            </div>\n          )}\n        </div>\n      </div>\n    );\n  }\n}\n"]}

package/dist/collection/components/slider/slider.stories.js

@@ -0,0 +1,209 @@
+import { formatHtmlPreview } from '../../utils/utils';
+import readme from './readme.md';
+export default {
+  title: 'Components/Slider',
+  argTypes: {
+    initialValue: {
+      name: 'Initial value',
+      description: 'Initial value for slider',
+      control: {
+        type: 'text',
+      },
+    },
+    min: {
+      name: 'Min. value',
+      description: 'Minimum value',
+      control: {
+        type: 'text',
+      },
+    },
+    max: {
+      name: 'Max. value',
+      description: 'Maximum value',
+      control: {
+        type: 'text',
+      },
+    },
+    showLabel: {
+      name: 'Show label',
+      description: 'Show or hide label',
+      control: {
+        type: 'boolean',
+      },
+    },
+    labelText: {
+      name: 'Label text',
+      description: 'Text for label',
+      control: {
+        type: 'text',
+      },
+      if: {
+        arg: 'showLabel',
+        truthy: true,
+      },
+    },
+    showTooltip: {
+      name: 'Show tooltip',
+      description: 'Show or hide tooltip',
+      control: {
+        type: 'boolean',
+      },
+    },
+    showTicks: {
+      name: 'Show ticks',
+      description: 'Show or hide ticks',
+      control: {
+        type: 'boolean',
+      },
+    },
+    numTicks: {
+      name: 'Number of ticks',
+      description: 'Set the number of ticks to display',
+      control: {
+        type: 'text',
+      },
+      if: {
+        arg: 'showTicks',
+        truthy: true,
+      },
+    },
+    snapToTicks: {
+      name: 'Snap to ticks',
+      description: 'Snap the scrubber to the closest tick when dragging',
+      control: {
+        type: 'boolean',
+      },
+      if: {
+        arg: 'showTicks',
+        truthy: true,
+      },
+    },
+    showTickNumbers: {
+      name: 'Show tick numbers',
+      description: 'Show or hide tick numbers',
+      control: {
+        type: 'boolean',
+      },
+      if: {
+        arg: 'showTicks',
+        truthy: true,
+      },
+    },
+    showControls: {
+      name: 'Show controls (not compatible with input field)',
+      description: 'Show or hide controls',
+      control: {
+        type: 'boolean',
+      },
+    },
+    step: {
+      name: 'Step value',
+      description: 'Value to increment/decrease when using controls',
+      control: {
+        type: 'text',
+      },
+      if: {
+        arg: 'showControls',
+        truthy: true,
+      },
+    },
+    showInput: {
+      name: 'Show value input field (not compatible with controls)',
+      description: 'Show or hide value input field',
+      control: {
+        type: 'boolean',
+      },
+      if: {
+        arg: 'showControls',
+        truthy: false,
+      },
+    },
+    disabled: {
+      name: 'Disabled',
+      description: 'Put control in disabled state',
+      control: {
+        type: 'boolean',
+      },
+    },
+    readonly: {
+      name: 'Read Only',
+      description: 'Put control in read-only state',
+      control: {
+        type: 'boolean',
+      },
+    },
+    small: {
+      name: 'Small',
+      description: 'Use small variant',
+      control: {
+        type: 'boolean',
+      },
+    },
+  },
+  parameters: {
+    notes: readme,
+    design: [
+      {
+        name: 'Figma',
+        type: 'figma',
+        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=9649%3A20759&t=Ne6myqwca5m00de7-1',
+      },
+      {
+        name: 'Link',
+        type: 'link',
+        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=9649%3A20759&t=Ne6myqwca5m00de7-1',
+      },
+    ],
+  },
+  args: {
+    initialValue: '50',
+    showLabel: false,
+    labelText: 'Label',
+    showTooltip: true,
+    showTicks: false,
+    numTicks: '3',
+    showTickNumbers: false,
+    showControls: false,
+    showInput: false,
+    min: '0',
+    max: '100',
+    step: '1',
+    disabled: false,
+    small: false,
+    snapToTicks: false,
+    readonly: false,
+  },
+};
+const Template = ({ initialValue, min, max, showLabel, labelText, showTooltip, showTicks, numTicks, showTickNumbers, snapToTicks, showControls, step, showInput, disabled, readonly, small, }) => formatHtmlPreview(`
+    <sdds-slider id="sdds-slider"
+      min="${min}" 
+      max="${max}" 
+      ${showControls && step ? `step="${step}"` : ''}
+      value="${initialValue}" 
+      ${showTicks ? `ticks="${numTicks}"` : ''} 
+      ${showTickNumbers ? 'show-tick-numbers' : ''} 
+      ${snapToTicks ? 'snap' : ''} 
+      ${showLabel ? `label="${labelText}"` : ''} 
+      ${showTooltip ? 'tooltip' : ''} 
+      ${showControls ? 'controls' : ''} 
+      ${showInput ? 'input' : ''} 
+      ${disabled ? 'disabled' : ''} 
+      ${small ? 'size="sm"' : ''}
+      ${readonly ? 'read-only' : ''} 
+      >
+
+    </sdds-slider>
+
+    <!-- Script tag for demo purposes -->
+    <script>
+    slider = document.querySelectorAll('sdds-slider')[0]
+
+    slider.removeEventListener('sddsChange', null)
+    slider.addEventListener('sddsChange', (event) => {
+      console.log('Slider changed, value:', event.detail.value);
+    });
+
+    </script>
+  `);
+export const Default = Template.bind({});
+//# sourceMappingURL=slider.stories.js.map

package/dist/collection/components/slider/slider.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"slider.stories.js","sourceRoot":"","sources":["../../../src/components/slider/slider.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\nimport readme from './readme.md';\n\nexport default {\n  title: 'Components/Slider',\n  argTypes: {\n    initialValue: {\n      name: 'Initial value',\n      description: 'Initial value for slider',\n      control: {\n        type: 'text',\n      },\n    },\n    min: {\n      name: 'Min. value',\n      description: 'Minimum value',\n      control: {\n        type: 'text',\n      },\n    },\n    max: {\n      name: 'Max. value',\n      description: 'Maximum value',\n      control: {\n        type: 'text',\n      },\n    },\n    showLabel: {\n      name: 'Show label',\n      description: 'Show or hide label',\n      control: {\n        type: 'boolean',\n      },\n    },\n    labelText: {\n      name: 'Label text',\n      description: 'Text for label',\n      control: {\n        type: 'text',\n      },\n      if: {\n        arg: 'showLabel',\n        truthy: true,\n      },\n    },\n    showTooltip: {\n      name: 'Show tooltip',\n      description: 'Show or hide tooltip',\n      control: {\n        type: 'boolean',\n      },\n    },\n    showTicks: {\n      name: 'Show ticks',\n      description: 'Show or hide ticks',\n      control: {\n        type: 'boolean',\n      },\n    },\n    numTicks: {\n      name: 'Number of ticks',\n      description: 'Set the number of ticks to display',\n      control: {\n        type: 'text',\n      },\n      if: {\n        arg: 'showTicks',\n        truthy: true,\n      },\n    },\n    snapToTicks: {\n      name: 'Snap to ticks',\n      description: 'Snap the scrubber to the closest tick when dragging',\n      control: {\n        type: 'boolean',\n      },\n      if: {\n        arg: 'showTicks',\n        truthy: true,\n      },\n    },\n    showTickNumbers: {\n      name: 'Show tick numbers',\n      description: 'Show or hide tick numbers',\n      control: {\n        type: 'boolean',\n      },\n      if: {\n        arg: 'showTicks',\n        truthy: true,\n      },\n    },\n    showControls: {\n      name: 'Show controls (not compatible with input field)',\n      description: 'Show or hide controls',\n      control: {\n        type: 'boolean',\n      },\n    },\n    step: {\n      name: 'Step value',\n      description: 'Value to increment/decrease when using controls',\n      control: {\n        type: 'text',\n      },\n      if: {\n        arg: 'showControls',\n        truthy: true,\n      },\n    },\n    showInput: {\n      name: 'Show value input field (not compatible with controls)',\n      description: 'Show or hide value input field',\n      control: {\n        type: 'boolean',\n      },\n      if: {\n        arg: 'showControls',\n        truthy: false,\n      },\n    },\n    disabled: {\n      name: 'Disabled',\n      description: 'Put control in disabled state',\n      control: {\n        type: 'boolean',\n      },\n    },\n    readonly: {\n      name: 'Read Only',\n      description: 'Put control in read-only state',\n      control: {\n        type: 'boolean',\n      },\n    },\n    small: {\n      name: 'Small',\n      description: 'Use small variant',\n      control: {\n        type: 'boolean',\n      },\n    },\n  },\n  parameters: {\n    notes: readme,\n    design: [\n      {\n        name: 'Figma',\n        type: 'figma',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=9649%3A20759&t=Ne6myqwca5m00de7-1',\n      },\n      {\n        name: 'Link',\n        type: 'link',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=9649%3A20759&t=Ne6myqwca5m00de7-1',\n      },\n    ],\n  },\n  args: {\n    initialValue: '50',\n    showLabel: false,\n    labelText: 'Label',\n    showTooltip: true,\n    showTicks: false,\n    numTicks: '3',\n    showTickNumbers: false,\n    showControls: false,\n    showInput: false,\n    min: '0',\n    max: '100',\n    step: '1',\n    disabled: false,\n    small: false,\n    snapToTicks: false,\n    readonly: false,\n  },\n};\nconst Template = ({\n  initialValue,\n  min,\n  max,\n  showLabel,\n  labelText,\n  showTooltip,\n  showTicks,\n  numTicks,\n  showTickNumbers,\n  snapToTicks,\n  showControls,\n  step,\n  showInput,\n  disabled,\n  readonly,\n  small,\n}) =>\n  formatHtmlPreview(`\n    <sdds-slider id=\"sdds-slider\"\n      min=\"${min}\" \n      max=\"${max}\" \n      ${showControls && step ? `step=\"${step}\"` : ''}\n      value=\"${initialValue}\" \n      ${showTicks ? `ticks=\"${numTicks}\"` : ''} \n      ${showTickNumbers ? 'show-tick-numbers' : ''} \n      ${snapToTicks ? 'snap' : ''} \n      ${showLabel ? `label=\"${labelText}\"` : ''} \n      ${showTooltip ? 'tooltip' : ''} \n      ${showControls ? 'controls' : ''} \n      ${showInput ? 'input' : ''} \n      ${disabled ? 'disabled' : ''} \n      ${small ? 'size=\"sm\"' : ''}\n      ${readonly ? 'read-only' : ''} \n      >\n\n    </sdds-slider>\n\n    <!-- Script tag for demo purposes -->\n    <script>\n    slider = document.querySelectorAll('sdds-slider')[0]\n\n    slider.removeEventListener('sddsChange', null)\n    slider.addEventListener('sddsChange', (event) => {\n      console.log('Slider changed, value:', event.detail.value);\n    });\n\n    </script>\n  `);\n\nexport const Default = Template.bind({});\n"]}

package/dist/collection/components/spinner/spinner.css

@@ -0,0 +1,79 @@
+:root,
+html {
+  --sdds-spinner-background: var(--sdds-blue-400);
+  --sdds-spinner-background-inverted: var(--sdds-white);
+  --sdds-spinner-speed: 1.8s;
+  --sdds-spinner-speed-lg: 2s;
+  --sdds-spinner-radius-xs: 8px;
+  --sdds-spinner-radius-sm: 12px;
+  --sdds-spinner-radius-md: 26px;
+  --sdds-spinner-radius-lg: 42px;
+  --sdds-spinner-radius: var(--sdds-spinner-radius-lg);
+  --sdds-spinner-stroke-width-xs: 3px;
+  --sdds-spinner-stroke-width-sm: 4px;
+  --sdds-spinner-stroke-width-md: 6px;
+  --sdds-spinner-stroke-width-lg: 8px;
+  --sdds-spinner-stroke-width: var(--sdds-spinner-stroke-width-lg);
+  --PI: 3.14159265358979;
+}
+
+:host {
+  box-sizing: border-box;
+  display: block;
+}
+:host * {
+  box-sizing: border-box;
+}
+
+.sdds-spinner-svg {
+  width: calc(var(--sdds-spinner-radius) * 2);
+  height: calc(var(--sdds-spinner-radius) * 2);
+  transform: scale(-1, 1) rotate(-90deg);
+}
+.sdds-spinner-svg-xs {
+  --sdds-spinner-radius: var(--sdds-spinner-radius-xs);
+  --sdds-spinner-stroke-width: var(--sdds-spinner-stroke-width-xs);
+  --sdds-spinner-animation-speed: var(--sdds-spinner-speed);
+}
+.sdds-spinner-svg-sm {
+  --sdds-spinner-radius: var(--sdds-spinner-radius-sm);
+  --sdds-spinner-stroke-width: var(--sdds-spinner-stroke-width-sm);
+  --sdds-spinner-animation-speed: var(--sdds-spinner-speed);
+}
+.sdds-spinner-svg-md {
+  --sdds-spinner-radius: var(--sdds-spinner-radius-md);
+  --sdds-spinner-stroke-width: var(--sdds-spinner-stroke-width-md);
+  --sdds-spinner-animation-speed: var(--sdds-spinner-speed);
+}
+.sdds-spinner-svg-lg {
+  --sdds-spinner-radius: var(--sdds-spinner-radius-lg);
+  --sdds-spinner-stroke-width: var(--sdds-spinner-stroke-width-lg);
+  --sdds-spinner-animation-speed: var(--sdds-spinner-speed-lg);
+}
+
+.sdds-spinner-circle {
+  cx: var(--sdds-spinner-radius);
+  cy: var(--sdds-spinner-radius);
+  r: calc(var(--sdds-spinner-radius) - var(--sdds-spinner-stroke-width) / 2);
+  stroke-width: var(--sdds-spinner-stroke-width);
+  fill: none;
+  --sdds-spinner-stroke-dash: calc((2 * var(--PI)) * var(--sdds-spinner-radius));
+  stroke-dasharray: var(--sdds-spinner-stroke-dash);
+  stroke-width: var(--sdds-spinner-stroke-width);
+  animation: dash var(--sdds-spinner-animation-speed) cubic-bezier(0.55, 0.15, 0.45, 0.85) infinite;
+}
+.sdds-spinner-circle-standard {
+  stroke: var(--sdds-spinner-background);
+}
+.sdds-spinner-circle-inverted {
+  stroke: var(--sdds-spinner-background-inverted);
+}
+
+@keyframes dash {
+  from {
+    stroke-dashoffset: calc(-1 * var(--sdds-spinner-stroke-dash));
+  }
+  to {
+    stroke-dashoffset: var(--sdds-spinner-stroke-dash);
+  }
+}

package/dist/collection/components/spinner/spinner.js

@@ -0,0 +1,62 @@
+import { h } from '@stencil/core';
+export class Spinner {
+  constructor() {
+    this.size = 'lg';
+    this.variant = 'standard';
+  }
+  render() {
+    return (h("div", { "aria-live": "assertive", role: "status", "aria-label": "loading" }, h("svg", { class: `sdds-spinner-svg sdds-spinner-svg-${this.size}`, "aria-hidden": "true" }, h("circle", { class: `sdds-spinner-circle sdds-spinner-circle-${this.variant}` }))));
+  }
+  static get is() { return "sdds-spinner"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["spinner.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["spinner.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "size": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'xs' | 'sm' | 'md' | 'lg'",
+          "resolved": "\"lg\" | \"md\" | \"sm\" | \"xs\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Size of spinner"
+        },
+        "attribute": "size",
+        "reflect": false,
+        "defaultValue": "'lg'"
+      },
+      "variant": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'standard' | 'inverted'",
+          "resolved": "\"inverted\" | \"standard\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Variant of spinner"
+        },
+        "attribute": "variant",
+        "reflect": false,
+        "defaultValue": "'standard'"
+      }
+    };
+  }
+}
+//# sourceMappingURL=spinner.js.map

package/dist/collection/components/spinner/spinner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"spinner.js","sourceRoot":"","sources":["../../../src/components/spinner/spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOnD,MAAM,OAAO,OAAO;;gBAEwB,IAAI;mBAGH,UAAU;;EAErD,MAAM;IACJ,OAAO,CACL,wBAAe,WAAW,EAAC,IAAI,EAAC,QAAQ,gBAAY,SAAS;MAC3D,WAAK,KAAK,EAAE,qCAAqC,IAAI,CAAC,IAAI,EAAE,iBAAc,MAAM;QAC9E,cAAQ,KAAK,EAAE,2CAA2C,IAAI,CAAC,OAAO,EAAE,GAAI,CACxE,CACF,CACP,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'sdds-spinner',\n  styleUrl: 'spinner.scss',\n  shadow: false,\n})\nexport class Spinner {\n  /** Size of spinner */\n  @Prop() size: 'xs' | 'sm' | 'md' | 'lg' = 'lg';\n\n  /** Variant of spinner */\n  @Prop() variant: 'standard' | 'inverted' = 'standard';\n\n  render() {\n    return (\n      <div aria-live=\"assertive\" role=\"status\" aria-label=\"loading\">\n        <svg class={`sdds-spinner-svg sdds-spinner-svg-${this.size}`} aria-hidden=\"true\">\n          <circle class={`sdds-spinner-circle sdds-spinner-circle-${this.variant}`} />\n        </svg>\n      </div>\n    );\n  }\n}\n"]}

package/dist/collection/components/spinner/spinner.stories.js

@@ -0,0 +1,60 @@
+import { formatHtmlPreview } from '../../utils/utils';
+import readme from './readme.md';
+export default {
+  title: 'Components/Spinner',
+  parameters: {
+    layout: 'centered',
+    notes: readme,
+    design: [
+      {
+        name: 'Figma',
+        type: 'figma',
+        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=10259%3A29263&t=Ne6myqwca5m00de7-1',
+      },
+      {
+        name: 'Link',
+        type: 'link',
+        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=10259%3A29263&t=Ne6myqwca5m00de7-1',
+      },
+    ],
+  },
+  argTypes: {
+    variant: {
+      name: 'Variant',
+      control: {
+        type: 'radio',
+      },
+      options: ['Standard', 'Inverted'],
+      description: 'Variant of the spinner',
+    },
+    size: {
+      name: 'Size',
+      control: {
+        type: 'radio',
+      },
+      options: ['Large', 'Medium', 'Small', 'Extra small'],
+      description: 'Size of the spinner',
+    },
+  },
+  args: {
+    variant: 'Standard',
+    size: 'Large',
+  },
+};
+const Template = ({ size, variant }) => {
+  const sizeLookup = { 'Large': 'lg', 'Medium': 'md', 'Small': 'sm', 'Extra small': 'xs' };
+  const variantLookup = { Standard: 'standard', Inverted: 'inverted' };
+  return formatHtmlPreview(`
+  <sdds-spinner 
+    size="${sizeLookup[size]}"  
+    variant="${variantLookup[variant]}">
+  </sdds-spinner>
+  `);
+};
+export const Default = Template.bind({});
+Default.args = {};
+export const Inverted = Template.bind({});
+Inverted.args = {
+  variant: 'Inverted',
+};
+//# sourceMappingURL=spinner.stories.js.map

package/dist/collection/components/spinner/spinner.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"spinner.stories.js","sourceRoot":"","sources":["../../../src/components/spinner/spinner.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACtD,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,eAAe;EACb,KAAK,EAAE,oBAAoB;EAC3B,UAAU,EAAE;IACV,MAAM,EAAE,UAAU;IAClB,KAAK,EAAE,MAAM;IACb,MAAM,EAAE;MACN;QACE,IAAI,EAAE,OAAO;QACb,IAAI,EAAE,OAAO;QACb,GAAG,EAAE,+GAA+G;OACrH;MACD;QACE,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,MAAM;QACZ,GAAG,EAAE,+GAA+G;OACrH;KACF;GACF;EACD,QAAQ,EAAE;IACR,OAAO,EAAE;MACP,IAAI,EAAE,SAAS;MACf,OAAO,EAAE;QACP,IAAI,EAAE,OAAO;OACd;MACD,OAAO,EAAE,CAAC,UAAU,EAAE,UAAU,CAAC;MACjC,WAAW,EAAE,wBAAwB;KACtC;IACD,IAAI,EAAE;MACJ,IAAI,EAAE,MAAM;MACZ,OAAO,EAAE;QACP,IAAI,EAAE,OAAO;OACd;MACD,OAAO,EAAE,CAAC,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,aAAa,CAAC;MACpD,WAAW,EAAE,qBAAqB;KACnC;GACF;EACD,IAAI,EAAE;IACJ,OAAO,EAAE,UAAU;IACnB,IAAI,EAAE,OAAO;GACd;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE,EAAE;EACrC,MAAM,UAAU,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC;EACzF,MAAM,aAAa,GAAG,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,CAAC;EAErE,OAAO,iBAAiB,CACtB;;YAEQ,UAAU,CAAC,IAAI,CAAC;eACb,aAAa,CAAC,OAAO,CAAC;;GAElC,CACA,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,OAAO,CAAC,IAAI,GAAG,EAAE,CAAC;AAElB,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC1C,QAAQ,CAAC,IAAI,GAAG;EACd,OAAO,EAAE,UAAU;CACpB,CAAC","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\nimport readme from './readme.md';\n\nexport default {\n  title: 'Components/Spinner',\n  parameters: {\n    layout: 'centered', // Center the component horizontally and vertically in the Canvas\n    notes: readme,\n    design: [\n      {\n        name: 'Figma',\n        type: 'figma',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=10259%3A29263&t=Ne6myqwca5m00de7-1',\n      },\n      {\n        name: 'Link',\n        type: 'link',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=10259%3A29263&t=Ne6myqwca5m00de7-1',\n      },\n    ],\n  },\n  argTypes: {\n    variant: {\n      name: 'Variant',\n      control: {\n        type: 'radio',\n      },\n      options: ['Standard', 'Inverted'],\n      description: 'Variant of the spinner',\n    },\n    size: {\n      name: 'Size',\n      control: {\n        type: 'radio',\n      },\n      options: ['Large', 'Medium', 'Small', 'Extra small'],\n      description: 'Size of the spinner',\n    },\n  },\n  args: {\n    variant: 'Standard',\n    size: 'Large',\n  },\n};\n\nconst Template = ({ size, variant }) => {\n  const sizeLookup = { 'Large': 'lg', 'Medium': 'md', 'Small': 'sm', 'Extra small': 'xs' };\n  const variantLookup = { Standard: 'standard', Inverted: 'inverted' };\n\n  return formatHtmlPreview(\n    `\n  <sdds-spinner \n    size=\"${sizeLookup[size]}\"  \n    variant=\"${variantLookup[variant]}\">\n  </sdds-spinner>\n  `,\n  );\n};\n\nexport const Default = Template.bind({});\nDefault.args = {};\n\nexport const Inverted = Template.bind({});\nInverted.args = {\n  variant: 'Inverted',\n};\n"]}

package/dist/collection/components/stepper/sdds-stepper.css

@@ -0,0 +1,13 @@
+:host [role=list] {
+  display: flex;
+  justify-content: space-evenly;
+}
+:host [role=list].vertical {
+  height: 100%;
+  flex-direction: column;
+  justify-content: unset;
+  gap: 48px;
+}
+:host [role=list].vertical.sm {
+  gap: 36px;
+}

package/dist/collection/components/stepper/sdds-stepper.js

@@ -0,0 +1,126 @@
+import { Host, h } from '@stencil/core';
+export class SddsStepper {
+  constructor() {
+    this.direction = 'horizontal';
+    this.labelPosition = 'below';
+    this.size = 'lg';
+    this.hideLabels = false;
+    this.width = 0;
+  }
+  componentWillLoad() {
+    this.host.children[0].classList.add('first');
+    this.host.children[this.host.children.length - 1].classList.add('last');
+    if (this.direction === 'vertical') {
+      this.labelPosition = 'aside';
+    }
+  }
+  componentDidLoad() {
+    if (this.labelPosition === 'below') {
+      this.children = Array.from(this.host.children);
+      this.children.forEach((item) => {
+        if (item.offsetWidth > this.width) {
+          this.width = item.offsetWidth;
+        }
+      });
+      this.children.forEach((item) => item.setWidth(this.width));
+    }
+  }
+  render() {
+    return (h(Host, null, h("ol", { role: "list", class: `${this.direction} sdds-stepper-text-position-${this.labelPosition} ${this.size}` }, h("slot", null))));
+  }
+  static get is() { return "sdds-stepper"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["sdds-stepper.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["sdds-stepper.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "direction": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'horizontal' | 'vertical'",
+          "resolved": "\"horizontal\" | \"vertical\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The direction the children are layed out."
+        },
+        "attribute": "direction",
+        "reflect": false,
+        "defaultValue": "'horizontal'"
+      },
+      "labelPosition": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'aside' | 'below'",
+          "resolved": "\"aside\" | \"below\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Text position, only available on direction:horizontal"
+        },
+        "attribute": "label-position",
+        "reflect": false,
+        "defaultValue": "'below'"
+      },
+      "size": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'sm' | 'lg'",
+          "resolved": "\"lg\" | \"sm\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Size of the component and it's children."
+        },
+        "attribute": "size",
+        "reflect": false,
+        "defaultValue": "'lg'"
+      },
+      "hideLabels": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Hides the label for the child components if true."
+        },
+        "attribute": "hide-labels",
+        "reflect": false,
+        "defaultValue": "false"
+      }
+    };
+  }
+  static get states() {
+    return {
+      "width": {}
+    };
+  }
+  static get elementRef() { return "host"; }
+}
+//# sourceMappingURL=sdds-stepper.js.map