@scania/tegel 0.0.5 → 0.0.7

package/dist/collection/components/data-table/table-body-cell/table-body-cell.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"table-body-cell.js","sourceRoot":"","sources":["../../../../src/components/data-table/table-body-cell/table-body-cell.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAGjF,MAAM,kBAAkB,GAA2C;EACjE,kBAAkB;EAClB,eAAe;EACf,YAAY;CACb,CAAC;AAMF,MAAM,OAAO,aAAa;;;;0BAQ2B,KAAK;;yBAItB,KAAK;4BAEF,KAAK;yBAER,KAAK;sBAER,KAAK;2BAEA,KAAK;mBAEd,EAAE;;EAO7B,8BAA8B,CAAC,KAA+C;IAC5E,IAAI,IAAI,CAAC,OAAO,KAAK,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE;MACzC,KAAK,CAAC,MAAM,CAAC,OAAO;SACjB,MAAM,CAAC,CAAC,WAAW,EAAE,EAAE,CAAC,kBAAkB,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC;SACjE,OAAO,CAAC,CAAC,WAAW,EAAE,EAAE;QACvB,IAAI,OAAO,IAAI,CAAC,WAAW,CAAC,KAAK,WAAW,EAAE;UAC5C,MAAM,IAAI,KAAK,CAAC,gCAAgC,WAAW,EAAE,CAAC,CAAC;SAChE;QACD,IAAI,CAAC,WAAW,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;MAChD,CAAC,CAAC,CAAC;KACN;EACH,CAAC;EAED,mDAAmD;EAEnD,yBAAyB,CAAC,KAAuB;IAC/C,MAAM,CAAC,UAAU,EAAE,gBAAgB,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC;IAEpD,IAAI,IAAI,CAAC,OAAO,KAAK,UAAU,EAAE;MAC/B,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,OAAO,KAAK,gBAAgB,CAAC;KACxD;EACH,CAAC;EAED,iEAAiE;EAEjE,6BAA6B,CAAC,KAAuB;IACnD,MAAM,CAAC,UAAU,EAAE,WAAW,EAAE,iBAAiB,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC;IAElE,IAAI,IAAI,CAAC,OAAO,KAAK,UAAU,EAAE;MAC/B,IAAI,IAAI,CAAC,OAAO,KAAK,WAAW,EAAE;QAChC,IAAI,CAAC,cAAc,GAAG,iBAAiB,CAAC;OACzC;KACF;EACH,CAAC;EAED,iBAAiB;IACf,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC;IAC/C,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC;EACtC,CAAC;EAED,iBAAiB;IACf,kBAAkB,CAAC,OAAO,CAAC,CAAC,aAAa,EAAE,EAAE;MAC3C,IAAI,CAAC,aAAa,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;IACpD,CAAC,CAAC,CAAC;EACL,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI,IACH,KAAK,EAAE;QACL,uBAAuB,EAAE,IAAI;QAC7B,8BAA8B,EAAE,IAAI,CAAC,aAAa;QAClD,qBAAqB,EAAE,IAAI,CAAC,aAAa;QACzC,qBAAqB,EAAE,IAAI,CAAC,gBAAgB;QAC5C,0BAA0B,EAAE,IAAI,CAAC,UAAU;QAC3C,mCAAmC,EAAE,IAAI,CAAC,cAAc;OACzD,EACD,KAAK,EAAE,EAAE,SAAS,EAAE,IAAI,CAAC,cAAc,EAAE;MAExC,IAAI,CAAC,SAAS;MACf,eAAQ,CACH,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, h, Host, Listen, Prop, State } from '@stencil/core';\nimport { InternalSddsTablePropChange } from '../table/table';\n\nconst relevantTableProps: InternalSddsTablePropChange['changed'] = [\n  'verticalDividers',\n  'compactDesign',\n  'noMinWidth',\n];\n@Component({\n  tag: 'sdds-body-cell',\n  styleUrl: 'table-body-cell.scss',\n  shadow: true,\n})\nexport class TableBodyCell {\n  /** Value that will be presented as text inside a cell */\n  @Prop({ reflect: true }) cellValue: string | number;\n\n  /** Passing same cell key for all body cells which is used in head cell enables features of text align and hovering */\n  @Prop({ reflect: true }) cellKey: any;\n\n  /** Disables internal padding. Useful when passing other components to cell. */\n  @Prop({ reflect: true }) disablePadding: boolean = false;\n\n  @State() textAlignState: string;\n\n  @State() activeSorting: boolean = false;\n\n  @State() verticalDividers: boolean = false;\n\n  @State() compactDesign: boolean = false;\n\n  @State() noMinWidth: boolean = false;\n\n  @State() whiteBackground: boolean = false;\n\n  @State() tableId: string = '';\n\n  @Element() host: HTMLElement;\n\n  tableEl: HTMLSddsTableElement;\n\n  @Listen('internalSddsPropChange', { target: 'body' })\n  internalSddsPropChangeListener(event: CustomEvent<InternalSddsTablePropChange>) {\n    if (this.tableId === event.detail.tableId) {\n      event.detail.changed\n        .filter((changedProp) => relevantTableProps.includes(changedProp))\n        .forEach((changedProp) => {\n          if (typeof this[changedProp] === 'undefined') {\n            throw new Error(`Table prop is not supported: ${changedProp}`);\n          }\n          this[changedProp] = event.detail[changedProp];\n        });\n    }\n  }\n\n  // Listen to headKey from data-table-header-element\n  @Listen('internalSddsHover', { target: 'body' })\n  internalSddsHoverListener(event: CustomEvent<any>) {\n    const [receivedID, receivedKeyValue] = event.detail;\n\n    if (this.tableId === receivedID) {\n      this.activeSorting = this.cellKey === receivedKeyValue;\n    }\n  }\n\n  // Listen to internalSddsTextAlign from data-table-header-element\n  @Listen('internalSddsTextAlign', { target: 'body' })\n  internalSddsTextAlignListener(event: CustomEvent<any>) {\n    const [receivedID, receivedKey, receivedTextAlign] = event.detail;\n\n    if (this.tableId === receivedID) {\n      if (this.cellKey === receivedKey) {\n        this.textAlignState = receivedTextAlign;\n      }\n    }\n  }\n\n  connectedCallback() {\n    this.tableEl = this.host.closest('sdds-table');\n    this.tableId = this.tableEl.tableId;\n  }\n\n  componentWillLoad() {\n    relevantTableProps.forEach((tablePropName) => {\n      this[tablePropName] = this.tableEl[tablePropName];\n    });\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          'sdds-table__body-cell': true,\n          'sdds-table__body-cell--hover': this.activeSorting,\n          'sdds-table__compact': this.compactDesign,\n          'sdds-table--divider': this.verticalDividers,\n          'sdds-table--no-min-width': this.noMinWidth,\n          'sdds-table__body-cell--no-padding': this.disablePadding,\n        }}\n        style={{ textAlign: this.textAlignState }}\n      >\n        {this.cellValue}\n        <slot />\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/data-table/table-body-row/table-body-row.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"table-body-row.js","sourceRoot":"","sources":["../../../../src/components/data-table/table-body-row/table-body-row.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAgB,MAAM,EAAE,MAAM,eAAe,CAAC;AAGhG,MAAM,kBAAkB,GAA2C;EACjE,mBAAmB;EACnB,kBAAkB;EAClB,eAAe;EACf,aAAa;CACd,CAAC;AAOF,MAAM,OAAO,YAAY;;6BACe,KAAK;8BAEJ,KAAK;8BAEL,KAAK;4BAEP,KAAK;yBAER,KAAK;sBAER,KAAK;uBAEY,IAAI;mBAEzB,EAAE;;EAM7B,mBAAmB,CAAC,KAAK;IACvB,MAAM,GAAG,GAAG,IAAI,CAAC,IAAI,CAAC;IACtB,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC,aAAa,CAAC,OAAO,CAAC;IACtD,IAAI,IAAI,CAAC,kBAAkB,KAAK,IAAI,EAAE;MACpC,GAAG,CAAC,SAAS,CAAC,GAAG,CAAC,2BAA2B,CAAC,CAAC;KAChD;SAAM;MACL,GAAG,CAAC,SAAS,CAAC,MAAM,CAAC,2BAA2B,CAAC,CAAC;KACnD;IACD,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;EAC3D,CAAC;EAED,yBAAyB,CAAC,MAAM;IAC9B,IAAI,CAAC,kBAAkB,GAAG,MAAM,CAAC;IACjC,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,kBAAkB,CAAC;IAClD,MAAM,GAAG,GAAG,IAAI,CAAC,IAAI,CAAC;IACtB,IAAI,IAAI,CAAC,kBAAkB,KAAK,IAAI,EAAE;MACpC,GAAG,CAAC,SAAS,CAAC,GAAG,CAAC,2BAA2B,CAAC,CAAC;KAChD;SAAM;MACL,GAAG,CAAC,SAAS,CAAC,MAAM,CAAC,2BAA2B,CAAC,CAAC;KACnD;IACD,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;EAC3D,CAAC;EAGD,8BAA8B,CAAC,KAA+C;IAC5E,IAAI,IAAI,CAAC,OAAO,KAAK,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE;MACzC,KAAK,CAAC,MAAM,CAAC,OAAO;SACjB,MAAM,CAAC,CAAC,WAAW,EAAE,EAAE,CAAC,kBAAkB,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC;SACjE,OAAO,CAAC,CAAC,WAAW,EAAE,EAAE;QACvB,IAAI,OAAO,IAAI,CAAC,WAAW,CAAC,KAAK,WAAW,EAAE;UAC5C,MAAM,IAAI,KAAK,CAAC,gCAAgC,WAAW,EAAE,CAAC,CAAC;SAChE;QACD,IAAI,CAAC,WAAW,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;MAChD,CAAC,CAAC,CAAC;KACN;EACH,CAAC;EAqBD,oBAAoB,CAAC,KAAuB;IAC1C,IAAI,IAAI,CAAC,OAAO,KAAK,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE;MACpC,IAAI,CAAC,yBAAyB,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;KACjD;EACH,CAAC;EAGD,kCAAkC,CAAC,KAAuB;IACxD,MAAM,CAAC,UAAU,EAAE,0BAA0B,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC;IAC9D,IAAI,IAAI,CAAC,OAAO,KAAK,UAAU,EAAE;MAC/B,IAAI,CAAC,yBAAyB,CAAC,0BAA0B,CAAC,CAAC;KAC5D;EACH,CAAC;EAED,iBAAiB;IACf,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC;IAC/C,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC;EACtC,CAAC;EAED,iBAAiB;IACf,kBAAkB,CAAC,OAAO,CAAC,CAAC,aAAa,EAAE,EAAE;MAC3C,IAAI,CAAC,aAAa,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;IACpD,CAAC,CAAC,CAAC;EACL,CAAC;EAED,gBAAgB;IACd,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;EACjD,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI,IACH,KAAK,EAAE;QACL,iBAAiB,EAAE,IAAI;QACvB,qBAAqB,EAAE,IAAI,CAAC,aAAa;QACzC,qBAAqB,EAAE,IAAI,CAAC,gBAAgB;QAC5C,2BAA2B,EAAE,IAAI,CAAC,WAAW,KAAK,SAAS;QAC3D,6BAA6B,EAAE,IAAI,CAAC,WAAW,KAAK,WAAW;OAChE;MAEA,IAAI,CAAC,iBAAiB,IAAI,CACzB,UAAI,KAAK,EAAC,uDAAuD;QAC/D,WAAK,KAAK,EAAC,oBAAoB;UAC7B,aAAO,KAAK,EAAC,6CAA6C;YACxD,aACE,KAAK,EAAC,iBAAiB,EACvB,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,IAAI,CAAC,mBAAmB,CAAC,KAAK,CAAC,EACpD,OAAO,EAAE,IAAI,CAAC,kBAAkB,GAChC,CACI,CACJ,CACH,CACN;MACD,eAAa,CACR,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, h, Host, State, Event, EventEmitter, Listen } from '@stencil/core';\nimport { InternalSddsTablePropChange } from '../table/table';\n\nconst relevantTableProps: InternalSddsTablePropChange['changed'] = [\n  'enableMultiselect',\n  'verticalDividers',\n  'compactDesign',\n  'modeVariant',\n];\n\n@Component({\n  tag: 'sdds-table-body-row',\n  styleUrl: 'table-body-row.scss',\n  shadow: true,\n})\nexport class TableBodyRow {\n  @State() enableMultiselect: boolean = false;\n\n  @State() bodyCheckBoxStatus: boolean = false;\n\n  @State() mainCheckBoxStatus: boolean = false;\n\n  @State() verticalDividers: boolean = false;\n\n  @State() compactDesign: boolean = false;\n\n  @State() noMinWidth: boolean = false;\n\n  @State() modeVariant: 'primary' | 'secondary' = null;\n\n  @State() tableId: string = '';\n\n  @Element() host: HTMLElement;\n\n  tableEl: HTMLSddsTableElement;\n\n  bodyCheckBoxClicked(event) {\n    const row = this.host;\n    this.bodyCheckBoxStatus = event.currentTarget.checked;\n    if (this.bodyCheckBoxStatus === true) {\n      row.classList.add('sdds-table__row--selected');\n    } else {\n      row.classList.remove('sdds-table__row--selected');\n    }\n    this.internalSddsRowChange.emit(this.bodyCheckBoxStatus);\n  }\n\n  bodyCheckBoxStatusUpdater(status) {\n    this.mainCheckBoxStatus = status;\n    this.bodyCheckBoxStatus = this.mainCheckBoxStatus;\n    const row = this.host;\n    if (this.bodyCheckBoxStatus === true) {\n      row.classList.add('sdds-table__row--selected');\n    } else {\n      row.classList.remove('sdds-table__row--selected');\n    }\n    this.internalSddsRowChange.emit(this.bodyCheckBoxStatus);\n  }\n\n  @Listen('internalSddsTablePropChange', { target: 'body' })\n  internalSddsPropChangeListener(event: CustomEvent<InternalSddsTablePropChange>) {\n    if (this.tableId === event.detail.tableId) {\n      event.detail.changed\n        .filter((changedProp) => relevantTableProps.includes(changedProp))\n        .forEach((changedProp) => {\n          if (typeof this[changedProp] === 'undefined') {\n            throw new Error(`Table prop is not supported: ${changedProp}`);\n          }\n          this[changedProp] = event.detail[changedProp];\n        });\n    }\n  }\n\n  /** @internal Send status of single row to the parent, sdds-table component that hold logic for data export and main checkbox control */\n  @Event({\n    eventName: 'internalSddsRowChange',\n    composed: true,\n    cancelable: true,\n    bubbles: true,\n  })\n  internalSddsRowChange: EventEmitter<boolean>;\n\n  /** @internal Event that triggers pagination function. Needed as first rows have to be rendered in order for pagination to run */\n  @Event({\n    eventName: 'internalSddsPagination',\n    composed: true,\n    cancelable: true,\n    bubbles: true,\n  })\n  internalSddsPagination: EventEmitter<string>;\n\n  @Listen('internalSddsMainCheckboxSelect', { target: 'body' })\n  headCheckboxListener(event: CustomEvent<any>) {\n    if (this.tableId === event.detail[0]) {\n      this.bodyCheckBoxStatusUpdater(event.detail[1]);\n    }\n  }\n\n  @Listen('internalSddsCheckboxChange', { target: 'body' })\n  internalSddsCheckboxChangeListener(event: CustomEvent<any>) {\n    const [receivedID, receivedBodyCheckboxStatus] = event.detail;\n    if (this.tableId === receivedID) {\n      this.bodyCheckBoxStatusUpdater(receivedBodyCheckboxStatus);\n    }\n  }\n\n  connectedCallback() {\n    this.tableEl = this.host.closest('sdds-table');\n    this.tableId = this.tableEl.tableId;\n  }\n\n  componentWillLoad() {\n    relevantTableProps.forEach((tablePropName) => {\n      this[tablePropName] = this.tableEl[tablePropName];\n    });\n  }\n\n  componentDidLoad() {\n    this.internalSddsPagination.emit(this.tableId);\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          'sdds-table__row': true,\n          'sdds-table__compact': this.compactDesign,\n          'sdds-table--divider': this.verticalDividers,\n          'sdds-mode-variant-primary': this.modeVariant === 'primary',\n          'sdds-mode-variant-secondary': this.modeVariant === 'secondary',\n        }}\n      >\n        {this.enableMultiselect && (\n          <td class=\"sdds-table__body-cell sdds-table__body-cell--checkbox\">\n            <div class=\"sdds-checkbox-item\">\n              <label class=\"sdds-form-label sdds-form-label--data-table\">\n                <input\n                  class=\"sdds-form-input\"\n                  type=\"checkbox\"\n                  onChange={(event) => this.bodyCheckBoxClicked(event)}\n                  checked={this.bodyCheckBoxStatus}\n                />\n              </label>\n            </div>\n          </td>\n        )}\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/data-table/table-body-row-expandable/table-body-row-expandable.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"table-body-row-expandable.js","sourceRoot":"","sources":["../../../../src/components/data-table/table-body-row-expandable/table-body-row-expandable.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Listen,\n  Prop,\n  State,\n} from '@stencil/core';\nimport { InternalSddsTablePropChange } from '../table/table';\n\nconst relevantTableProps: InternalSddsTablePropChange['changed'] = [\n  'verticalDividers',\n  'compactDesign',\n  'noMinWidth',\n  'modeVariant',\n];\n@Component({\n  tag: 'sdds-table-body-row-expandable',\n  styleUrl: 'table-body-row-expandable.scss',\n  shadow: true,\n})\nexport class TableBodyRowExpandable {\n  /** In case that automatic count of columns does not work, user can manually set this one. Take in mind that expandable control is column too */\n  @Prop() colSpan: number = null;\n\n  @State() isExpanded: boolean = false;\n\n  @State() tableId: string = '';\n\n  @State() columnsNumber: number = null;\n\n  @State() verticalDividers: boolean = false;\n\n  @State() compactDesign: boolean = false;\n\n  @State() noMinWidth: boolean = false;\n\n  @State() modeVariant: 'primary' | 'secondary' = null;\n\n  @Element() host: HTMLElement;\n\n  tableEl: HTMLSddsTableElement;\n\n  /** @internal Sends out expanded status which is used by the table header component */\n  @Event({\n    eventName: 'internalSddsRowExpanded',\n    bubbles: true,\n    cancelable: true,\n    composed: true,\n  })\n  internalSddsRowExpanded: EventEmitter<any>;\n\n  /** @internal Event that triggers pagination function. Needed as first rows have to be rendered in order for pagination to run */\n  @Event({\n    eventName: 'internalSddsPagination',\n    composed: true,\n    cancelable: true,\n    bubbles: true,\n  })\n  internalSddsPagination: EventEmitter<string>;\n\n  @Listen('internalSddsTablePropChange', { target: 'body' })\n  internalSddsPropChangeListener(event: CustomEvent<InternalSddsTablePropChange>) {\n    if (this.tableId === event.detail.tableId) {\n      event.detail.changed\n        .filter((changedProp) => relevantTableProps.includes(changedProp))\n        .forEach((changedProp) => {\n          if (typeof this[changedProp] === 'undefined') {\n            throw new Error(`Table prop is not supported: ${changedProp}`);\n          }\n          this[changedProp] = event.detail[changedProp];\n        });\n    }\n  }\n\n  connectedCallback() {\n    this.tableEl = this.host.closest('sdds-table');\n    this.tableId = this.tableEl.tableId;\n  }\n\n  componentWillLoad() {\n    relevantTableProps.forEach((tablePropName) => {\n      this[tablePropName] = this.tableEl[tablePropName];\n    });\n  }\n\n  componentDidLoad() {\n    this.internalSddsPagination.emit(this.tableId);\n  }\n\n  componentWillRender() {\n    if (this.colSpan !== null) {\n      this.columnsNumber = this.colSpan;\n    } else {\n      this.columnsNumber = this.tableEl.querySelector('sdds-table-header').childElementCount + 1;\n    }\n  }\n\n  sendValue() {\n    this.internalSddsRowExpanded.emit([this.tableId, this.isExpanded]);\n  }\n\n  onChangeHandler(event) {\n    this.isExpanded = event.currentTarget.checked === true;\n    this.sendValue();\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          'sdds-table__row': true,\n          'sdds-table__row-expand--active': this.isExpanded,\n          'sdds-table__compact': this.compactDesign,\n          'sdds-table--divider': this.verticalDividers,\n          'sdds-mode-variant-primary': this.modeVariant === 'primary',\n          'sdds-mode-variant-secondary': this.modeVariant === 'secondary',\n        }}\n      >\n        <tr class=\"sdds-table__row\">\n          <td class=\"sdds-table__cell sdds-table__cell--expand\">\n            <label class=\"sdds-table__expand-control-container\">\n              <input\n                class=\"sdds-table__expand-input\"\n                type=\"checkbox\"\n                onChange={(event) => this.onChangeHandler(event)}\n                checked={this.isExpanded}\n              />\n              <span class=\"sdds-expendable-row-icon\">\n                <svg fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\">\n                  <path\n                    fill-rule=\"evenodd\"\n                    clip-rule=\"evenodd\"\n                    d=\"M4.273 9.783a1 1 0 0 1 1.415 0l9.888 9.888a.6.6 0 0 0 .848 0l9.888-9.888a1 1 0 1 1 1.415 1.414l-9.889 9.889a2.6 2.6 0 0 1-3.677 0l-9.888-9.889a1 1 0 0 1 0-1.414Z\"\n                    fill=\"currentColor\"\n                  />\n                </svg>\n              </span>\n            </label>\n          </td>\n          <slot />\n        </tr>\n\n        <tr class=\"sdds-table__row-expand\">\n          <td class=\"sdds-table__cell-expand\" colSpan={this.columnsNumber}>\n            <slot name=\"expand-row\" />\n          </td>\n        </tr>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/data-table/table-component-basic.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"table-component-basic.stories.js","sourceRoot":"","sources":["../../../src/components/data-table/table-component-basic.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\nimport sddsTable from './table/readme.md';\nimport sddsTableToolbar from './table-toolbar/readme.md';\nimport sddsHeader from './table-header/readme.md';\nimport sddsHeaderCell from './table-header-cell/readme.md';\nimport sddsTableBody from './table-body/readme.md';\nimport sddsBodyRow from './table-body-row/readme.md';\nimport sddsBodyRowExpandable from './table-body-row-expandable/readme.md';\nimport sddsBodyCell from './table-body-cell/readme.md';\nimport sddsTableFooter from './table-footer/readme.md';\n\nexport default {\n  title: 'Components/Data Table/Web Component',\n  parameters: {\n    notes: {\n      'sdds-table': sddsTable,\n      'sdds-table-toolbar': sddsTableToolbar,\n      'sdds-header': sddsHeader,\n      'sdds-header-cell': sddsHeaderCell,\n      'sdds-table-body': sddsTableBody,\n      'sdds-body-row': sddsBodyRow,\n      'sdds-body-row-expandable': sddsBodyRowExpandable,\n      'sdds-body-cell': sddsBodyCell,\n      'sdds-table-footer': sddsTableFooter,\n    },\n  },\n  argTypes: {\n    modeVariant: {\n      name: 'Mode variant',\n      description: 'Mode variant adjusts component colors to have better visibility depending on global mode and background.',\n      control: {\n        type: 'radio',\n      },\n      options: ['Inherit from parent', 'Primary', 'Secondary'],\n      table: {\n        defaultValue: { summary: 'Inherit from parent' },\n      },\n    },\n    compactDesign: {\n      name: 'Compact design',\n      description: 'Enables compact design of the table, rows with less height.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    responsiveDesign: {\n      name: 'Responsive table',\n      description: 'Enables table to take 100% of available width. For column values less than 192px, \"No minimum width\" has to be enabled too.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    disablePadding: {\n      name: 'Disable cell padding',\n      description: 'By default each cell comes with padding. Disabling padding rule can be useful when a users want to insert another HTML element in cell, eg. input.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    verticalDivider: {\n      name: 'Vertical dividers',\n      description: 'Enables vertical dividers between table columns.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    noMinWidth: {\n      name: 'No minimum width',\n      description: 'Resets min-width rule and enables setting column width value to less than 192px which is the default. When enabled, controls for column width will show here.',\n      control: {\n        type: 'boolean',\n      },\n    },\n    column1Width: {\n      name: 'Column 1 width',\n      description:'Value of width for column 1. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column2Width: {\n      name: 'Column 2 width',\n      description: 'Value of width for column 2. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column3Width: {\n      name: 'Column 3 width',\n      description: 'Value of width for column 3. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column4Width: {\n      name: 'Column 4 width',\n      description: 'Value of width for column 4. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n  },\n  args: {\n    modeVariant: 'Inherit from parent',\n    compactDesign: false,\n    responsiveDesign: false,\n    disablePadding: false,\n    verticalDivider: false,\n    noMinWidth: false,\n    column1Width: '',\n    column2Width: '',\n    column3Width: '',\n    column4Width: '',\n  },\n};\n\nconst BasicTemplate = ({\n  modeVariant,\n  compactDesign,\n  responsiveDesign,\n  disablePadding,\n  verticalDivider,\n  noMinWidth,\n  column1Width,\n  column2Width,\n  column3Width,\n  column4Width,\n}) =>\n  formatHtmlPreview(`\n  <sdds-table\n      vertical-dividers=\"${verticalDivider}\"\n      compact-design=\"${compactDesign}\"\n      enable-responsive=\"${responsiveDesign}\"\n      ${noMinWidth ? 'no-min-width' : ''}\n      ${modeVariant !== 'Inherit from parent' ? `mode-variant=\"${modeVariant.toLowerCase()}\"` : ''}>\n      <sdds-table-header>\n          <sdds-header-cell column-key='truck' column-title='Truck type' ${\n            column1Width ? `custom-width=\"${column1Width}\"` : ''\n          }></sdds-header-cell>\n          <sdds-header-cell column-key='driver' column-title='Driver name' ${\n            column2Width ? `custom-width=\"${column2Width}\"` : ''\n          }></sdds-header-cell>\n          <sdds-header-cell column-key='country' column-title='Country' ${\n            column3Width ? `custom-width=\"${column3Width}\"` : ''\n          }></sdds-header-cell>\n          <sdds-header-cell column-key='mileage' column-title='Mileage' text-align='right' ${\n            column4Width ? `custom-width=\"${column4Width}\"` : ''\n          }></sdds-header-cell>\n      </sdds-table-header>\n      <sdds-table-body>\n          <sdds-table-body-row>\n              <sdds-body-cell cell-value=\"Test value 1\" cell-key=\"truck\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 2\" cell-key=\"driver\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 3\" cell-key=\"country\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 4\" cell-key=\"mileage\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n          </sdds-table-body-row>\n          <sdds-table-body-row>\n              <sdds-body-cell cell-value=\"Test value 5\" cell-key=\"truck\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 6\" cell-key=\"driver\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 7\" cell-key=\"country\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 8\" cell-key=\"mileage\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n          </sdds-table-body-row>\n          <sdds-table-body-row>\n              <sdds-body-cell cell-value=\"Test value 1\" cell-key=\"truck\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 2\" cell-key=\"driver\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 3\" cell-key=\"country\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 4\" cell-key=\"mileage\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n          </sdds-table-body-row>\n          <sdds-table-body-row>\n              <sdds-body-cell cell-value=\"Test value 5\" cell-key=\"truck\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 6\" cell-key=\"driver\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 7\" cell-key=\"country\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 8\" cell-key=\"mileage\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n          </sdds-table-body-row>\n          <sdds-table-body-row>\n              <sdds-body-cell cell-value=\"Test value 1\" cell-key=\"truck\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 2\" cell-key=\"driver\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 3\" cell-key=\"country\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 4\" cell-key=\"mileage\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n          </sdds-table-body-row>\n          <sdds-table-body-row>\n              <sdds-body-cell cell-value=\"Test value 5\" cell-key=\"truck\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 6\" cell-key=\"driver\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 7\" cell-key=\"country\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 8\" cell-key=\"mileage\" disable-padding=\"${disablePadding}\"></sdds-body-cell>\n          </sdds-table-body-row>\n      </sdds-table-body>\n  </sdds-table>`);\n\nexport const Default = BasicTemplate.bind({});"]}

package/dist/collection/components/data-table/table-component-batch-actions.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"table-component-batch-actions.stories.js","sourceRoot":"","sources":["../../../src/components/data-table/table-component-batch-actions.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\nimport sddsTable from './table/readme.md';\nimport sddsTableToolbar from './table-toolbar/readme.md';\nimport sddsHeader from './table-header/readme.md';\nimport sddsHeaderCell from './table-header-cell/readme.md';\nimport sddsTableBody from './table-body/readme.md';\nimport sddsBodyRow from './table-body-row/readme.md';\nimport sddsBodyRowExpandable from './table-body-row-expandable/readme.md';\nimport sddsBodyCell from './table-body-cell/readme.md';\nimport sddsTableFooter from './table-footer/readme.md';\n\nexport default {\n  title: 'Components/Data Table/Web Component',\n  parameters: {\n    notes: {\n      'sdds-table': sddsTable,\n      'sdds-table-toolbar': sddsTableToolbar,\n      'sdds-header': sddsHeader,\n      'sdds-header-cell': sddsHeaderCell,\n      'sdds-table-body': sddsTableBody,\n      'sdds-body-row': sddsBodyRow,\n      'sdds-body-row-expandable': sddsBodyRowExpandable,\n      'sdds-body-cell': sddsBodyCell,\n      'sdds-table-footer': sddsTableFooter,\n    },\n  },\n  argTypes: {\n    modeVariant: {\n      name: 'Mode variant',\n      description: 'Mode variant adjusts component colors to have better visibility depending on global mode and background.',\n      control: {\n        type: 'radio',\n      },\n      options: ['Inherit from parent', 'Primary', 'Secondary'],\n      table: {\n        defaultValue: { summary: 'Inherit from parent' },\n      },\n    },\n    compactDesign: {\n      name: 'Compact design',\n      description: 'Enables compact design of the table, rows with less height.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    responsiveDesign: {\n      name: 'Responsive table',\n      description: 'Enables table to take 100% of available width. For column values less than 192px, \"No minimum width\" has to be enabled too.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    batchArea: {\n      name: 'Batch code',\n      description: 'Enables code to be injected into the toolbar area.',\n      control: {\n        type: 'text',\n      },\n    },\n    verticalDivider: {\n      name: 'Vertical dividers',\n      description: 'Enables vertical dividers between table columns.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    noMinWidth: {\n      name: 'No minimum width',\n      description: 'Resets min-width rule and enables setting column width value to less than 192px which is the default. When enabled, controls for column width will show here.',\n      control: {\n        type: 'boolean',\n      },\n    },\n    column1Width: {\n      name: 'Column 1 width',\n      description:'Value of width for column 1. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column2Width: {\n      name: 'Column 2 width',\n      description: 'Value of width for column 2. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column3Width: {\n      name: 'Column 3 width',\n      description: 'Value of width for column 3. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column4Width: {\n      name: 'Column 4 width',\n      description: 'Value of width for column 4. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n  },\n  args: {\n    modeVariant: 'Inherit from parent',\n    compactDesign: false,\n    responsiveDesign: false,\n    batchArea: formatHtmlPreview(\n      '<button slot=\"sdds-table__actionbar\" class=\"sdds-table__actionbar-btn\"><sdds-icon class=\"sdds-table__actionbar-btn-icon\" name=\"settings\" size=\"20px\"></sdds-icon> </button><sdds-button slot=\"sdds-table__actionbar\" type=\"primary\" size=\"sm\" text=\"Download\"></sdds-button>',\n    ),\n    verticalDivider: false,\n    noMinWidth: false,\n    column1Width: '',\n    column2Width: '',\n    column3Width: '',\n    column4Width: '',\n  },\n};\n\nconst BatchActionTemplate = ({\n  modeVariant,\n  compactDesign,\n  responsiveDesign,\n  batchArea,\n  verticalDivider,\n  noMinWidth,\n  column1Width,\n  column2Width,\n  column3Width,\n  column4Width,\n}) =>\n  formatHtmlPreview(`\n   <sdds-table\n        enable-multiselect\n        vertical-dividers=\"${verticalDivider}\"\n        compact-design=\"${compactDesign}\"\n        enable-responsive=\"${responsiveDesign}\"\n        ${noMinWidth ? 'no-min-width' : ''}\n        ${\n          modeVariant !== 'Inherit from parent' ? `mode-variant=\"${modeVariant.toLowerCase()}\"` : ''\n        }\n      >\n          <sdds-table-toolbar table-title=\"Batch action\">\n          ${batchArea}\n        </sdds-table-toolbar>\n          <sdds-table-header>\n              <sdds-header-cell ${column1Width ? `style=\"width: ${column1Width};\"` : ''} column-key='truck' column-title='Truck type'></sdds-header-cell>\n              <sdds-header-cell ${column2Width ? `style=\"width: ${column2Width};\"` : ''} column-key='driver' column-title='Driver name'></sdds-header-cell>\n              <sdds-header-cell ${column3Width ? `style=\"width: ${column3Width};\"` : ''} column-key='country' column-title='Country'></sdds-header-cell>\n              <sdds-header-cell ${column4Width ? `style=\"width: ${column4Width};\"` : ''} column-key='mileage' column-title='Mileage' text-align='right'></sdds-header-cell>\n          </sdds-table-header>\n          <sdds-table-body enable-dummy-data>\n          </sdds-table-body>\n  </sdds-table>`);\n\nexport const BatchAction = BatchActionTemplate.bind({});"]}

package/dist/collection/components/data-table/table-component-bodydata.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"table-component-bodydata.stories.js","sourceRoot":"","sources":["../../../src/components/data-table/table-component-bodydata.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACtD,OAAO,SAAS,MAAM,mBAAmB,CAAC;AAC1C,OAAO,gBAAgB,MAAM,2BAA2B,CAAC;AACzD,OAAO,UAAU,MAAM,0BAA0B,CAAC;AAClD,OAAO,cAAc,MAAM,+BAA+B,CAAC;AAC3D,OAAO,aAAa,MAAM,wBAAwB,CAAC;AACnD,OAAO,WAAW,MAAM,4BAA4B,CAAC;AACrD,OAAO,qBAAqB,MAAM,uCAAuC,CAAC;AAC1E,OAAO,YAAY,MAAM,6BAA6B,CAAC;AACvD,OAAO,eAAe,MAAM,0BAA0B,CAAC;AAEvD,eAAe;EACb,KAAK,EAAE,qCAAqC;EAC5C,UAAU,EAAE;IACV,KAAK,EAAE;MACL,YAAY,EAAE,SAAS;MACvB,oBAAoB,EAAE,gBAAgB;MACtC,aAAa,EAAE,UAAU;MACzB,kBAAkB,EAAE,cAAc;MAClC,iBAAiB,EAAE,aAAa;MAChC,eAAe,EAAE,WAAW;MAC5B,0BAA0B,EAAE,qBAAqB;MACjD,gBAAgB,EAAE,YAAY;MAC9B,mBAAmB,EAAE,eAAe;KACrC;GACF;EACD,QAAQ,EAAE;IACR,QAAQ,EAAE;MACR,IAAI,EAAE,MAAM;MACZ,WAAW,EAAE,8IAA8I;MAC3J,OAAO,EAAE;QACP,IAAI,EAAE,OAAO;OACd;KACF;GACF;EACD,IAAI,EAAE;IACJ,QAAQ,EAAE;MACR,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,EAAE,aAAa,EAAE;MAC5C,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,EAAE,eAAe,EAAE;KAC/C;GACF;CACF,CAAC;AAEF,MAAM,oBAAoB,GAAG,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAC5C,iBAAiB,CAAC;;;;;;;oCAOgB,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC;;gBAE5C,CAAC,CAAC;AAElB,MAAM,CAAC,MAAM,YAAY,GAAG,oBAAoB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\nimport sddsTable from './table/readme.md';\nimport sddsTableToolbar from './table-toolbar/readme.md';\nimport sddsHeader from './table-header/readme.md';\nimport sddsHeaderCell from './table-header-cell/readme.md';\nimport sddsTableBody from './table-body/readme.md';\nimport sddsBodyRow from './table-body-row/readme.md';\nimport sddsBodyRowExpandable from './table-body-row-expandable/readme.md';\nimport sddsBodyCell from './table-body-cell/readme.md';\nimport sddsTableFooter from './table-footer/readme.md';\n\nexport default {\n  title: 'Components/Data Table/Web Component',\n  parameters: {\n    notes: {\n      'sdds-table': sddsTable,\n      'sdds-table-toolbar': sddsTableToolbar,\n      'sdds-header': sddsHeader,\n      'sdds-header-cell': sddsHeaderCell,\n      'sdds-table-body': sddsTableBody,\n      'sdds-body-row': sddsBodyRow,\n      'sdds-body-row-expandable': sddsBodyRowExpandable,\n      'sdds-body-cell': sddsBodyCell,\n      'sdds-table-footer': sddsTableFooter,\n    },\n  },\n  argTypes: {\n    bodyData: {\n      name: 'Data',\n      description: 'An array of objects with keys matching the header cell `column-key` attributes. Can be passed as an array object, or as a stringified array.',\n      control: {\n        type: 'array',\n      },\n    },\n  },\n  args: {\n    bodyData: [\n      { truck: 'L-series', driver: 'Sonya Bruce' },\n      { truck: 'P-series', driver: 'Guerra Bowman' },\n    ],\n  },\n};\n\nconst DataPropertyTemplate = ({ bodyData }) =>\n  formatHtmlPreview(`\n    <sdds-table enable-expandable-rows=\"false\">\n    <sdds-table-toolbar table-title=\"'body-data' property example\"></sdds-table-toolbar>\n      <sdds-table-header>\n          <sdds-header-cell column-key='truck' column-title='Truck type'></sdds-header-cell>\n          <sdds-header-cell column-key='driver' column-title='Driver name'></sdds-header-cell>\n      </sdds-table-header>\n      <sdds-table-body body-data='${JSON.stringify(bodyData)}'>\n      </sdds-table-body>\n  </sdds-table>`);\n\nexport const DataProperty = DataPropertyTemplate.bind({});"]}

package/dist/collection/components/data-table/table-component-custom-width.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"table-component-custom-width.stories.js","sourceRoot":"","sources":["../../../src/components/data-table/table-component-custom-width.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\nimport sddsTable from './table/readme.md';\nimport sddsTableToolbar from './table-toolbar/readme.md';\nimport sddsHeader from './table-header/readme.md';\nimport sddsHeaderCell from './table-header-cell/readme.md';\nimport sddsTableBody from './table-body/readme.md';\nimport sddsBodyRow from './table-body-row/readme.md';\nimport sddsBodyRowExpandable from './table-body-row-expandable/readme.md';\nimport sddsBodyCell from './table-body-cell/readme.md';\nimport sddsTableFooter from './table-footer/readme.md';\n\nexport default {\n  title: 'Components/Data Table/Web Component',\n  parameters: {\n    notes: {\n      'sdds-table': sddsTable,\n      'sdds-table-toolbar': sddsTableToolbar,\n      'sdds-header': sddsHeader,\n      'sdds-header-cell': sddsHeaderCell,\n      'sdds-table-body': sddsTableBody,\n      'sdds-body-row': sddsBodyRow,\n      'sdds-body-row-expandable': sddsBodyRowExpandable,\n      'sdds-body-cell': sddsBodyCell,\n      'sdds-table-footer': sddsTableFooter,\n    },\n  },\n  argTypes: {\n    modeVariant: {\n      name: 'Mode variant',\n      description: 'Mode variant adjusts component colors to have better visibility depending on global mode and background.',\n      control: {\n        type: 'radio',\n      },\n      options: ['Inherit from parent', 'Primary', 'Secondary'],\n      table: {\n        defaultValue: { summary: 'Inherit from parent' },\n      },\n    },\n    compactDesign: {\n      name: 'Compact design',\n      description: 'Enables compact design of the table, rows with less height.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    responsiveDesign: {\n      name: 'Responsive table',\n      description: 'Enables table to take 100% of available width. For column values less than 192px, \"No minimum width\" has to be enabled too.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    verticalDivider: {\n      name: 'Vertical dividers',\n      description: 'Enables vertical dividers between table columns.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    noMinWidth: {\n      name: 'No minimum width',\n      description: 'Resets min-width rule and enables setting column width value to less than 192px which is the default. When enabled, controls for column width will show here.',\n      control: {\n        type: 'boolean',\n      },\n    },\n    column1Width: {\n      name: 'Column 1 width',\n      description: 'Value of width for column 1. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column2Width: {\n      name: 'Column 2 width',\n      description: 'Value of width for column 2. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column3Width: {\n      name: 'Column 3 width',\n      description: 'Value of width for column 3. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column4Width: {\n      name: 'Column 4 width',\n      description: 'Value of width for column 4. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n  },\n  args: {\n    modeVariant: 'Inherit from parent',\n    compactDesign: false,\n    responsiveDesign: false,\n    verticalDivider: true,\n    noMinWidth: true,\n    column1Width: '321px',\n    column2Width: '400px',\n    column3Width: '150px',\n    column4Width: '110px',\n  },\n};\n\nconst BasicTemplate = ({\n  modeVariant,\n  compactDesign,\n  responsiveDesign,\n  verticalDivider,\n  noMinWidth,\n  column1Width,\n  column2Width,\n  column3Width,\n  column4Width,\n}) =>\n  formatHtmlPreview(`\n  <sdds-table\n      vertical-dividers=\"${verticalDivider}\"\n      compact-design=\"${compactDesign}\"\n      enable-responsive=\"${responsiveDesign}\"\n      ${noMinWidth ? 'no-min-width' : ''}\n      ${modeVariant !== 'Inherit from parent' ? `mode-variant=\"${modeVariant.toLowerCase()}\"` : ''}\n  >\n      <sdds-table-header>\n          <sdds-header-cell column-key='truck' column-title='Truck type' ${\n            column1Width ? `custom-width=\"${column1Width}\"` : ''\n          } ></sdds-header-cell>\n          <sdds-header-cell column-key='driver' column-title='Driver name' ${\n            column2Width ? `custom-width=\"${column2Width}\"` : ''\n          }></sdds-header-cell>\n          <sdds-header-cell column-key='country' column-title='Country' ${\n            column3Width ? `custom-width=\"${column3Width}\"` : ''\n          }></sdds-header-cell>\n          <sdds-header-cell column-key='mileage' column-title='Mileage' ${\n            column4Width ? `custom-width=\"${column4Width}\"` : ''\n          } text-align='right'></sdds-header-cell>\n      </sdds-table-header>\n      <sdds-table-body>\n          <sdds-table-body-row>\n              <sdds-body-cell cell-value=\"Test value 1\" cell-key=\"truck\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 2\" cell-key=\"driver\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 3\" cell-key=\"country\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 4\" cell-key=\"mileage\"></sdds-body-cell>\n          </sdds-table-body-row>\n          <sdds-table-body-row>\n              <sdds-body-cell cell-value=\"Test value 5\" cell-key=\"truck\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 6\" cell-key=\"driver\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 7\" cell-key=\"country\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 8\" cell-key=\"mileage\"></sdds-body-cell>\n          </sdds-table-body-row>\n          <sdds-table-body-row>\n              <sdds-body-cell cell-value=\"Test value 1\" cell-key=\"truck\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 2\" cell-key=\"driver\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 3\" cell-key=\"country\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 4\" cell-key=\"mileage\"></sdds-body-cell>\n          </sdds-table-body-row>\n          <sdds-table-body-row>\n              <sdds-body-cell cell-value=\"Test value 5\" cell-key=\"truck\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 6\" cell-key=\"driver\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 7\" cell-key=\"country\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 8\" cell-key=\"mileage\"></sdds-body-cell>\n          </sdds-table-body-row>\n          <sdds-table-body-row>\n              <sdds-body-cell cell-value=\"Test value 1\" cell-key=\"truck\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 2\" cell-key=\"driver\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 3\" cell-key=\"country\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 4\" cell-key=\"mileage\"></sdds-body-cell>\n          </sdds-table-body-row>\n          <sdds-table-body-row>\n              <sdds-body-cell cell-value=\"Test value 5\" cell-key=\"truck\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 6\" cell-key=\"driver\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 7\" cell-key=\"country\"></sdds-body-cell>\n              <sdds-body-cell cell-value=\"Test value 8\" cell-key=\"mileage\"></sdds-body-cell>\n          </sdds-table-body-row>\n      </sdds-table-body>\n  </sdds-table>`);\n\nexport const CustomWidth = BasicTemplate.bind({});"]}

package/dist/collection/components/data-table/table-component-event-listeners.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"table-component-event-listeners.stories.js","sourceRoot":"","sources":["../../../src/components/data-table/table-component-event-listeners.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\nimport sddsTable from './table/readme.md';\nimport sddsTableToolbar from './table-toolbar/readme.md';\nimport sddsHeader from './table-header/readme.md';\nimport sddsHeaderCell from './table-header-cell/readme.md';\nimport sddsTableBody from './table-body/readme.md';\nimport sddsBodyRow from './table-body-row/readme.md';\nimport sddsBodyRowExpandable from './table-body-row-expandable/readme.md';\nimport sddsBodyCell from './table-body-cell/readme.md';\nimport sddsTableFooter from './table-footer/readme.md';\n\nexport default {\n  title: 'Components/Data Table/Web Component',\n  parameters: {\n    notes: {\n      'sdds-table': sddsTable,\n      'sdds-table-toolbar': sddsTableToolbar,\n      'sdds-header': sddsHeader,\n      'sdds-header-cell': sddsHeaderCell,\n      'sdds-table-body': sddsTableBody,\n      'sdds-body-row': sddsBodyRow,\n      'sdds-body-row-expandable': sddsBodyRowExpandable,\n      'sdds-body-cell': sddsBodyCell,\n      'sdds-table-footer': sddsTableFooter,\n    },\n  },\n  argTypes: {\n    modeVariant: {\n      name: 'Mode variant',\n      description: 'Mode variant adjusts component colors to have better visibility depending on global mode and background.',\n      control: {\n        type: 'radio',\n      },\n      options: ['Inherit from parent', 'Primary', 'Secondary'],\n      table: {\n        defaultValue: { summary: 'Inherit from parent' },\n      },\n    },\n    compactDesign: {\n      name: 'Compact design',\n      description: 'Enables compact design of the table, rows with less height.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    responsiveDesign: {\n      name: 'Responsive table',\n      description: 'Enables table to take 100% of available width. For column values less than 192px, \"No minimum width\" has to be enabled too.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    verticalDivider: {\n      name: 'Vertical dividers',\n      description: 'Enables vertical dividers between table columns.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    noMinWidth: {\n      name: 'No minimum width',\n      description: 'Resets min-width rule and enables setting column width value to less than 192px which is the default. When enabled, controls for column width will show here.',\n      control: {\n        type: 'boolean',\n      },\n    },\n    column1Width: {\n      name: 'Column 1 width',\n      description:'Value of width for column 1. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column2Width: {\n      name: 'Column 2 width',\n      description: 'Value of width for column 2. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column3Width: {\n      name: 'Column 3 width',\n      description: 'Value of width for column 3. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column4Width: {\n      name: 'Column 4 width',\n      description: 'Value of width for column 4. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n  },\n  args: {\n    modeVariant: 'Inherit from parent',\n    compactDesign: false,\n    responsiveDesign: false,\n    verticalDivider: false,\n    noMinWidth: false,\n    column1Width: '',\n    column2Width: '',\n    column3Width: '',\n    column4Width: '',\n  },\n};\n\nconst EventListenersTemplate = ({\n  modeVariant,\n  compactDesign,\n  responsiveDesign,\n  verticalDivider,\n  noMinWidth,\n  column1Width,\n  column2Width,\n  column3Width,\n  column4Width,\n}) =>\n  formatHtmlPreview(`\n    <script>\n      // Note: Script here is only for demo purposes\n      window.addEventListener('sddsFilter', e => {\n        document.getElementById('event-name-textarea').value = 'sddsFilter';\n        document.getElementById('event-value-textarea').value = e.detail;\n      });\n\n      window.addEventListener('sddsSortChange', e => {\n        document.getElementById('event-name-textarea').value = 'sddsSortChange';\n        document.getElementById('event-value-textarea').value = e.detail;\n      });\n\n      window.addEventListener('sddsPageChange', e => {\n        document.getElementById('event-name-textarea').value = 'sddsPageChange';\n        document.getElementById('event-value-textarea').value = e.detail;\n      });\n    </script>\n\n   <sdds-table\n      vertical-dividers=\"${verticalDivider}\"\n      compact-design=\"${compactDesign}\"\n      enable-responsive=\"${responsiveDesign}\"\n      ${noMinWidth ? 'no-min-width' : ''}\n      ${modeVariant !== 'Inherit from parent' ? `mode-variant=\"${modeVariant.toLowerCase()}\"` : ''}\n   >\n          <sdds-table-toolbar table-title=\"Disabled filtering, pagination and sorting - left to the user to listen to events\" enable-filtering></sdds-table-toolbar>\n          <sdds-table-header>\n              <sdds-header-cell column-key='truck' column-title='Truck type' sortable ${\n                column1Width ? `custom-width=\"${column1Width}\"` : ''\n              }></sdds-header-cell>\n              <sdds-header-cell column-key='driver' column-title='Driver name' sortable ${\n                column2Width ? `custom-width=\"${column2Width}\"` : ''\n              }></sdds-header-cell>\n              <sdds-header-cell column-key='country' column-title='Country' sortable ${\n                column3Width ? `custom-width=\"${column3Width}\"` : ''\n              }></sdds-header-cell>\n              <sdds-header-cell column-key='mileage' column-title='Mileage' sortable text-align='right' ${\n                column4Width ? `custom-width=\"${column4Width}\"` : ''\n              }></sdds-header-cell>\n          </sdds-table-header>\n          <sdds-table-body disable-pagination-function disable-filtering-function disable-sorting-function enable-dummy-data>\n              <sdds-table-body-row>\n                  <sdds-body-cell cell-value=\"Test value 5\" cell-key=\"truck\"></sdds-body-cell>\n                  <sdds-body-cell cell-value=\"Test value 6\" cell-key=\"driver\"></sdds-body-cell>\n                  <sdds-body-cell cell-value=\"Test value 7\" cell-key=\"country\"></sdds-body-cell>\n                  <sdds-body-cell cell-value=\"Test value 8\" cell-key=\"mileage\"></sdds-body-cell>\n              </sdds-table-body-row>\n          </sdds-table-body>\n        <sdds-table-footer enable-client-pagination client-max-pages=\"10\"></sdds-table-footer>\n  </sdds-table>\n\n  <!-- Note: Code below is just for demo purposes -->\n  <div class=\"sdds-u-mt1\" style=\"width: 500px; background-color: lightblue; padding: 16px;\">\n  <p class=\"sdds-u-mt0\">Note: This box works only in \"Canvas\" tab.</p>\n    <h5 class=\"sdds-u-mt0 sdds-u-mb0\">Event test box</h5>\n    <h6 class=\"sdds-u-mt1 sdds-u-mb0\">Event name:</h6>\n    <textarea id=\"event-name-textarea\" rows=\"1\" cols=\"50\" readonly></textarea>\n    <h6 class=\"sdds-u-mt0 sdds-u-mb0\">Events value (aka detail)</h6>\n    <small>Event always sent an array of items, where first one is always an ID of tabel where event is emitted from</small>\n    <br>\n    <textarea id=\"event-value-textarea\" rows=\"1\" cols=\"50\" readonly></textarea>\n  </div>`);\n\nexport const EventListeners = EventListenersTemplate.bind({});\n"]}

package/dist/collection/components/data-table/table-component-expandable-rows.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"table-component-expandable-rows.stories.js","sourceRoot":"","sources":["../../../src/components/data-table/table-component-expandable-rows.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\nimport sddsTable from './table/readme.md';\nimport sddsTableToolbar from './table-toolbar/readme.md';\nimport sddsHeader from './table-header/readme.md';\nimport sddsHeaderCell from './table-header-cell/readme.md';\nimport sddsTableBody from './table-body/readme.md';\nimport sddsBodyRow from './table-body-row/readme.md';\nimport sddsBodyRowExpandable from './table-body-row-expandable/readme.md';\nimport sddsBodyCell from './table-body-cell/readme.md';\nimport sddsTableFooter from './table-footer/readme.md';\n\nexport default {\n  title: 'Components/Data Table/Web Component',\n  parameters: {\n    notes: {\n      'sdds-table': sddsTable,\n      'sdds-table-toolbar': sddsTableToolbar,\n      'sdds-header': sddsHeader,\n      'sdds-header-cell': sddsHeaderCell,\n      'sdds-table-body': sddsTableBody,\n      'sdds-body-row': sddsBodyRow,\n      'sdds-body-row-expandable': sddsBodyRowExpandable,\n      'sdds-body-cell': sddsBodyCell,\n      'sdds-table-footer': sddsTableFooter,\n    },\n  },\n  argTypes: {\n    modeVariant: {\n      name: 'Mode variant',\n      description: 'Mode variant adjusts component colors to have better visibility depending on global mode and background.',\n      control: {\n        type: 'radio',\n      },\n      options: ['Inherit from parent', 'Primary', 'Secondary'],\n      table: {\n        defaultValue: { summary: 'Inherit from parent' },\n      },\n    },\n    compactDesign: {\n      name: 'Compact design',\n      description: 'Enables compact design of the table, rows with less height.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    responsiveDesign: {\n      name: 'Responsive table',\n      description: 'Enables table to take 100% of available width. For column values less than 192px, \"No minimum width\" has to be enabled too.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    verticalDivider: {\n      name: 'Vertical dividers',\n      description: 'Enables vertical dividers between table columns.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    noMinWidth: {\n      name: 'No minimum width',\n      description: 'Resets min-width rule and enables setting column width value to less than 192px which is the default. When enabled, controls for column width will show here.',\n      control: {\n        type: 'boolean',\n      },\n    },\n    column1Width: {\n      name: 'Column 1 width',\n      description:'Value of width for column 1. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column2Width: {\n      name: 'Column 2 width',\n      description: 'Value of width for column 2. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column3Width: {\n      name: 'Column 3 width',\n      description: 'Value of width for column 3. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column4Width: {\n      name: 'Column 4 width',\n      description: 'Value of width for column 4. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n  },\n  args: {\n    modeVariant: 'Inherit from parent',\n    compactDesign: false,\n    responsiveDesign: false,\n    verticalDivider: false,\n    noMinWidth: false,\n    column1Width: '',\n    column2Width: '',\n    column3Width: '',\n    column4Width: '',\n  },\n};\n\nconst ExpandableRowTemplate = ({\n  modeVariant,\n  compactDesign,\n  responsiveDesign,\n  verticalDivider,\n  noMinWidth,\n  column1Width,\n  column2Width,\n  column3Width,\n  column4Width,\n}) =>\n  formatHtmlPreview(`\n  <sdds-table\n    enable-expandable-rows\n    vertical-dividers=\"${verticalDivider}\"\n    compact-design=\"${compactDesign}\"\n    enable-responsive=\"${responsiveDesign}\"\n    ${noMinWidth ? 'no-min-width' : ''}\n    ${modeVariant !== 'Inherit from parent' ? `mode-variant=\"${modeVariant.toLowerCase()}\"` : ''}\n    >\n      <sdds-table-header>\n          <sdds-header-cell column-key='truck' column-title='Truck type' ${\n            column1Width ? `custom-width=\"${column1Width}\"` : ''\n          }></sdds-header-cell>\n          <sdds-header-cell column-key='driver' column-title='Driver name' ${\n            column2Width ? `custom-width=\"${column2Width}\"` : ''\n          }></sdds-header-cell>\n          <sdds-header-cell column-key='country' column-title='Country' ${\n            column3Width ? `custom-width=\"${column3Width}\"` : ''\n          }></sdds-header-cell>\n          <sdds-header-cell column-key='mileage' column-title='Mileage' text-align='right' ${\n            column4Width ? `custom-width=\"${column4Width}\"` : ''\n          }></sdds-header-cell>\n      </sdds-table-header>\n      <sdds-table-body>\n        <sdds-table-body-row-expandable>\n          <sdds-body-cell cell-value=\"Test value 1\" cell-key=\"truck\"></sdds-body-cell>\n          <sdds-body-cell cell-value=\"Test value 2\" cell-key=\"driver\"></sdds-body-cell>\n          <sdds-body-cell cell-value=\"Test value 3\" cell-key=\"country\"></sdds-body-cell>\n          <sdds-body-cell cell-value=\"Test value 4\" cell-key=\"mileage\"></sdds-body-cell>\n          <div slot=\"expand-row\">Hello world 1</div>\n        </sdds-table-body-row-expandable>\n         <sdds-table-body-row-expandable>\n          <sdds-body-cell cell-value=\"Test value 5\" cell-key=\"truck\"></sdds-body-cell>\n          <sdds-body-cell cell-value=\"Test value 6\" cell-key=\"driver\"></sdds-body-cell>\n          <sdds-body-cell cell-value=\"Test value 7\" cell-key=\"country\"></sdds-body-cell>\n          <sdds-body-cell cell-value=\"Test value 8\" cell-key=\"mileage\"></sdds-body-cell>\n          <div slot=\"expand-row\">Hello to you too</div>\n        </sdds-table-body-row-expandable>\n        <sdds-table-body-row-expandable>\n          <sdds-body-cell cell-value=\"Test value 9\" cell-key=\"truck\"></sdds-body-cell>\n          <sdds-body-cell cell-value=\"Test value 10\" cell-key=\"driver\"></sdds-body-cell>\n          <sdds-body-cell cell-value=\"Test value 11\" cell-key=\"country\"></sdds-body-cell>\n          <sdds-body-cell cell-value=\"Test value 12\" cell-key=\"mileage\"></sdds-body-cell>\n          <div slot=\"expand-row\"><sdds-button type=\"primary\" text=\"Call to action\"></sdds-button></div>\n        </sdds-table-body-row-expandable>\n      </sdds-table-body>\n  </sdds-table>`);\n\nexport const ExpandableRows = ExpandableRowTemplate.bind({});"]}

package/dist/collection/components/data-table/table-component-filtering.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"table-component-filtering.stories.js","sourceRoot":"","sources":["../../../src/components/data-table/table-component-filtering.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\nimport sddsTable from './table/readme.md';\nimport sddsTableToolbar from './table-toolbar/readme.md';\nimport sddsHeader from './table-header/readme.md';\nimport sddsHeaderCell from './table-header-cell/readme.md';\nimport sddsTableBody from './table-body/readme.md';\nimport sddsBodyRow from './table-body-row/readme.md';\nimport sddsBodyRowExpandable from './table-body-row-expandable/readme.md';\nimport sddsBodyCell from './table-body-cell/readme.md';\nimport sddsTableFooter from './table-footer/readme.md';\nimport dummyData from './table-body/dummy-data.json';\n\nexport default {\n  title: 'Components/Data Table/Web Component',\n  parameters: {\n    notes: {\n      'sdds-table': sddsTable,\n      'sdds-table-toolbar': sddsTableToolbar,\n      'sdds-header': sddsHeader,\n      'sdds-header-cell': sddsHeaderCell,\n      'sdds-table-body': sddsTableBody,\n      'sdds-body-row': sddsBodyRow,\n      'sdds-body-row-expandable': sddsBodyRowExpandable,\n      'sdds-body-cell': sddsBodyCell,\n      'sdds-table-footer': sddsTableFooter,\n    },\n  },\n  argTypes: {\n    modeVariant: {\n      name: 'Mode variant',\n      description: 'Mode variant adjusts component colors to have better visibility depending on global mode and background.',\n      control: {\n        type: 'radio',\n      },\n      options: ['Inherit from parent', 'Primary', 'Secondary'],\n      table: {\n        defaultValue: { summary: 'Inherit from parent' },\n      },\n    },\n    compactDesign: {\n      name: 'Compact design',\n      description: 'Enables compact design of the table, rows with less height.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    responsiveDesign: {\n      name: 'Responsive table',\n      description: 'Enables table to take 100% of available width. For column values less than 192px, \"No minimum width\" has to be enabled too.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    useDataProp: {\n      name: 'Use data prop',\n      description: 'Loads table data from property.',\n      control: {\n        type: 'boolean',\n      },\n    },\n    verticalDivider: {\n      name: 'Vertical dividers',\n      description: 'Enables vertical dividers between table columns.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    noMinWidth: {\n      name: 'No minimum width',\n      description: 'Resets min-width rule and enables setting column width value to less than 192px which is the default. When enabled, controls for column width will show here.',\n      control: {\n        type: 'boolean',\n      },\n    },\n    column1Width: {\n      name: 'Column 1 width',\n      description:'Value of width for column 1. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column2Width: {\n      name: 'Column 2 width',\n      description: 'Value of width for column 2. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column3Width: {\n      name: 'Column 3 width',\n      description: 'Value of width for column 3. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column4Width: {\n      name: 'Column 4 width',\n      description: 'Value of width for column 4. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n  },\n  args: {\n    modeVariant: 'Inherit from parent',\n    compactDesign: false,\n    responsiveDesign: true,\n    useDataProp: true,\n    verticalDivider: false,\n    noMinWidth: false,\n    column1Width: '',\n    column2Width: '',\n    column3Width: '',\n    column4Width: '',\n  },\n};\n\nconst FilteringTemplate = ({\n  modeVariant,\n  compactDesign,\n  responsiveDesign,\n  useDataProp,\n  verticalDivider,\n  noMinWidth,\n  column1Width,\n  column2Width,\n  column3Width,\n  column4Width,\n}) =>\n  formatHtmlPreview(`\n   <sdds-table\n      vertical-dividers=\"${verticalDivider}\"\n      compact-design=\"${compactDesign}\"\n      ${responsiveDesign ? 'enable-responsive' : ''}\n      ${noMinWidth ? 'no-min-width' : ''}\n      ${modeVariant !== 'Inherit from parent' ? `mode-variant=\"${modeVariant.toLowerCase()}\"` : ''}\n  >\n          <sdds-table-toolbar table-title=\"Filter\" enable-filtering></sdds-table-toolbar>\n          <sdds-table-header>\n              <sdds-header-cell column-key='truck' column-title='Truck type' ${\n                column1Width ? `custom-width=\"${column1Width}\"` : ''\n              }></sdds-header-cell>\n              <sdds-header-cell column-key='driver' column-title='Driver name' ${\n                column2Width ? `custom-width=\"${column2Width}\"` : ''\n              }></sdds-header-cell>\n              <sdds-header-cell column-key='country' column-title='Country' ${\n                column3Width ? `custom-width=\"${column3Width}\"` : ''\n              }></sdds-header-cell>\n              <sdds-header-cell column-key='mileage' column-title='Mileage' text-align='right' ${\n                column4Width ? `custom-width=\"${column4Width}\"` : ''\n              }></sdds-header-cell>\n          </sdds-table-header>\n          <sdds-table-body ${useDataProp ? `body-data='${JSON.stringify(dummyData)}'` : ''}>\n            ${\n              !useDataProp\n                ? dummyData\n                    .map(\n                      (row) =>\n                        `<sdds-table-body-row>\n                        ${Object.entries(row)\n                          .map(\n                            (cell) =>\n                              `<sdds-body-cell cell-key=\"${cell[0]}\" cell-value=\"${cell[1]}\"></sdds-body-cell>`,\n                          )\n                          .join(' ')}\n                      </sdds-table-body-row>`,\n                    )\n                    .join(' ')\n                : ''\n            }\n          </sdds-table-body>\n  </sdds-table>`);\n\nexport const Filtering = FilteringTemplate.bind({});"]}

package/dist/collection/components/data-table/table-component-multiselect.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"table-component-multiselect.stories.js","sourceRoot":"","sources":["../../../src/components/data-table/table-component-multiselect.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\nimport sddsTable from './table/readme.md';\nimport sddsTableToolbar from './table-toolbar/readme.md';\nimport sddsHeader from './table-header/readme.md';\nimport sddsHeaderCell from './table-header-cell/readme.md';\nimport sddsTableBody from './table-body/readme.md';\nimport sddsBodyRow from './table-body-row/readme.md';\nimport sddsBodyRowExpandable from './table-body-row-expandable/readme.md';\nimport sddsBodyCell from './table-body-cell/readme.md';\nimport sddsTableFooter from './table-footer/readme.md';\n\nexport default {\n  title: 'Components/Data Table/Web Component',\n  parameters: {\n    notes: {\n      'sdds-table': sddsTable,\n      'sdds-table-toolbar': sddsTableToolbar,\n      'sdds-header': sddsHeader,\n      'sdds-header-cell': sddsHeaderCell,\n      'sdds-table-body': sddsTableBody,\n      'sdds-body-row': sddsBodyRow,\n      'sdds-body-row-expandable': sddsBodyRowExpandable,\n      'sdds-body-cell': sddsBodyCell,\n      'sdds-table-footer': sddsTableFooter,\n    },\n  },\n  argTypes: {\n    modeVariant: {\n      name: 'Mode variant',\n      description: 'Mode variant adjusts component colors to have better visibility depending on global mode and background.',\n      control: {\n        type: 'radio',\n      },\n      options: ['Inherit from parent', 'Primary', 'Secondary'],\n      table: {\n        defaultValue: { summary: 'Inherit from parent' },\n      },\n    },\n    compactDesign: {\n      name: 'Compact design',\n      description: 'Enables compact design of the table, rows with less height.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    responsiveDesign: {\n      name: 'Responsive table',\n      description: 'Enables table to take 100% of available width. For column values less than 192px, \"No minimum width\" has to be enabled too.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    enableMultiselect: {\n      name: 'Enable multiselect',\n      description: 'Enables row selection.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    verticalDivider: {\n      name: 'Vertical dividers',\n      description: 'Enables vertical dividers between table columns.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    noMinWidth: {\n      name: 'No minimum width',\n      description: 'Resets min-width rule and enables setting column width value to less than 192px which is the default. When enabled, controls for column width will show here.',\n      control: {\n        type: 'boolean',\n      },\n    },\n    column1Width: {\n      name: 'Column 1 width',\n      description:'Value of width for column 1. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column2Width: {\n      name: 'Column 2 width',\n      description: 'Value of width for column 2. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column3Width: {\n      name: 'Column 3 width',\n      description: 'Value of width for column 3. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column4Width: {\n      name: 'Column 4 width',\n      description: 'Value of width for column 4. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n  },\n  args: {\n    modeVariant: 'Inherit from parent',\n    compactDesign: false,\n    responsiveDesign: false,\n    enableMultiselect: true,\n    verticalDivider: false,\n    noMinWidth: false,\n    column1Width: '',\n    column2Width: '',\n    column3Width: '',\n    column4Width: '',\n  },\n};\n\nconst MultiselectTemplate = ({\n  modeVariant,\n  compactDesign,\n  responsiveDesign,\n  enableMultiselect,\n  verticalDivider,\n  noMinWidth,\n  column1Width,\n  column2Width,\n  column3Width,\n  column4Width,\n}) =>\n  formatHtmlPreview(`\n<script>\n// Note: Script here is only for demo purposes\n  function getValue() {\n    const element = document.querySelector('#multiselect-table > sdds-table-body');\n    const textArea = document.getElementById('selected-rows-value-textarea');\n    const observer = new MutationObserver(mutations => {\n      mutations.forEach(mutation => {\n        if (mutation.type === 'attributes') {\n          textArea.value = element.getAttribute('data-selected-rows');\n        }\n      });\n    });\n    observer.observe(element, {\n      attributes: true,\n    });\n  }\n  window.addEventListener('click', () => {\n    getValue();\n  });\n\n</script>\n\n    <sdds-table\n        id=\"multiselect-table\"\n        ${enableMultiselect ? 'enable-multiselect' : ''}\n        vertical-dividers=\"${verticalDivider}\"\n        compact-design=\"${compactDesign}\"\n        enable-responsive=\"${responsiveDesign}\"\n        ${noMinWidth ? 'no-min-width' : ''}\n        ${\n          modeVariant !== 'Inherit from parent' ? `mode-variant=\"${modeVariant.toLowerCase()}\"` : ''\n        }\n    >\n          <sdds-table-header>\n              <sdds-header-cell column-key='truck' column-title='Truck type' ${\n                column1Width ? `custom-width=\"${column1Width}\"` : ''\n              }></sdds-header-cell>\n              <sdds-header-cell column-key='driver' column-title='Driver name' ${\n                column2Width ? `custom-width=\"${column2Width}\"` : ''\n              }></sdds-header-cell>\n              <sdds-header-cell column-key='country' column-title='Country' ${\n                column3Width ? `custom-width=\"${column3Width}\"` : ''\n              }></sdds-header-cell>\n              <sdds-header-cell column-key='mileage' column-title='Mileage' text-align='right' ${\n                column4Width ? `custom-width=\"${column4Width}\"` : ''\n              }></sdds-header-cell>\n          </sdds-table-header>\n          <sdds-table-body enable-dummy-data>\n          </sdds-table-body>\n  </sdds-table>\n\n  <!-- Note: Code below is just for demo purposes -->\n  <div class=\"sdds-u-mt1\" style=\"width: 450px; background-color: lightblue; padding: 16px;\">\n    <p class=\"sdds-u-mt0\">Note: This box works only in \"Canvas\" tab.</p>\n    <h6 class=\"sdds-u-pb0 sdds-u-mb0 sdds-u-mt0\">Selected rows data</h6>\n    <small>Values here are values found in data-selected-rows attribute of sdds-table-body element. They are shown here just for presentation purposes.</small>\n    <textarea id=\"selected-rows-value-textarea\" rows=\"5\" cols=\"50\" readonly></textarea>\n  </div>`);\n\nexport const Multiselect = MultiselectTemplate.bind({});"]}

package/dist/collection/components/data-table/table-component-pagination.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"table-component-pagination.stories.js","sourceRoot":"","sources":["../../../src/components/data-table/table-component-pagination.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\nimport sddsTable from './table/readme.md';\nimport sddsTableToolbar from './table-toolbar/readme.md';\nimport sddsHeader from './table-header/readme.md';\nimport sddsHeaderCell from './table-header-cell/readme.md';\nimport sddsTableBody from './table-body/readme.md';\nimport sddsBodyRow from './table-body-row/readme.md';\nimport sddsBodyRowExpandable from './table-body-row-expandable/readme.md';\nimport sddsBodyCell from './table-body-cell/readme.md';\nimport sddsTableFooter from './table-footer/readme.md';\n\nexport default {\n  title: 'Components/Data Table/Web Component',\n  parameters: {\n    notes: {\n      'sdds-table': sddsTable,\n      'sdds-table-toolbar': sddsTableToolbar,\n      'sdds-header': sddsHeader,\n      'sdds-header-cell': sddsHeaderCell,\n      'sdds-table-body': sddsTableBody,\n      'sdds-body-row': sddsBodyRow,\n      'sdds-body-row-expandable': sddsBodyRowExpandable,\n      'sdds-body-cell': sddsBodyCell,\n      'sdds-table-footer': sddsTableFooter,\n    },\n  },\n  argTypes: {\n    modeVariant: {\n      name: 'Mode variant',\n      description: 'Mode variant adjusts component colors to have better visibility depending on global mode and background.',\n      control: {\n        type: 'radio',\n      },\n      options: ['Inherit from parent', 'Primary', 'Secondary'],\n      table: {\n        defaultValue: { summary: 'Inherit from parent' },\n      },\n    },\n    compactDesign: {\n      name: 'Compact design',\n      description: 'Enables compact design of the table, rows with less height.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    responsiveDesign: {\n      name: 'Responsive table',\n      description: 'Enables table to take 100% of available width. For column values less than 192px, \"No minimum width\" has to be enabled too.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    rowsPerPageControl: {\n      name: 'Rows per page',\n      description: 'Specifies how many rows are shown per page.',\n      control: {\n        type: 'number',\n      },\n      table: {\n        defaultValue: { summary: 5 },\n      },\n    },\n    verticalDivider: {\n      name: 'Vertical dividers',\n      description: 'Enables vertical dividers between table columns.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    noMinWidth: {\n      name: 'No minimum width',\n      description: 'Resets min-width rule and enables setting column width value to less than 192px which is the default. When enabled, controls for column width will show here.',\n      control: {\n        type: 'boolean',\n      },\n    },\n    column1Width: {\n      name: 'Column 1 width',\n      description:'Value of width for column 1. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column2Width: {\n      name: 'Column 2 width',\n      description: 'Value of width for column 2. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column3Width: {\n      name: 'Column 3 width',\n      description: 'Value of width for column 3. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column4Width: {\n      name: 'Column 4 width',\n      description: 'Value of width for column 4. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n  },\n  args: {\n    modeVariant: 'Inherit from parent',\n    compactDesign: false,\n    responsiveDesign: false,\n    rowsPerPageControl: 4,\n    verticalDivider: false,\n    noMinWidth: false,\n    column1Width: '',\n    column2Width: '',\n    column3Width: '',\n    column4Width: '',\n  },\n};\n\nconst PaginationTemplate = ({\n  modeVariant,\n  compactDesign,\n  responsiveDesign,\n  rowsPerPageControl,\n  verticalDivider,\n  noMinWidth,\n  column1Width,\n  column2Width,\n  column3Width,\n  column4Width,\n}) =>\n  formatHtmlPreview(`\n    <sdds-table\n      vertical-dividers=\"${verticalDivider}\"\n      compact-design=\"${compactDesign}\"\n      enable-responsive=\"${responsiveDesign}\"\n      ${noMinWidth ? 'no-min-width' : ''}\n      ${modeVariant !== 'Inherit from parent' ? `mode-variant=\"${modeVariant.toLowerCase()}\"` : ''}\n      >\n          <sdds-table-header>\n              <sdds-header-cell column-key='truck' column-title='Truck type' ${\n                column1Width ? `custom-width=\"${column1Width}\"` : ''\n              }></sdds-header-cell>\n              <sdds-header-cell column-key='driver' column-title='Driver name' ${\n                column2Width ? `custom-width=\"${column2Width}\"` : ''\n              }></sdds-header-cell>\n              <sdds-header-cell column-key='country' column-title='Country' ${\n                column3Width ? `custom-width=\"${column3Width}\"` : ''\n              }></sdds-header-cell>\n              <sdds-header-cell column-key='mileage' column-title='Mileage' text-align='right' ${\n                column4Width ? `custom-width=\"${column4Width}\"` : ''\n              }></sdds-header-cell>\n          </sdds-table-header>\n          <sdds-table-body enable-dummy-data>\n          </sdds-table-body>\n          <sdds-table-footer enable-pagination rows-per-page=\"${rowsPerPageControl}\"></sdds-table-footer>\n  </sdds-table>`);\n\nexport const Pagination = PaginationTemplate.bind({});"]}

package/dist/collection/components/data-table/table-component-sorting.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"table-component-sorting.stories.js","sourceRoot":"","sources":["../../../src/components/data-table/table-component-sorting.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\nimport sddsTable from './table/readme.md';\nimport sddsTableToolbar from './table-toolbar/readme.md';\nimport sddsHeader from './table-header/readme.md';\nimport sddsHeaderCell from './table-header-cell/readme.md';\nimport sddsTableBody from './table-body/readme.md';\nimport sddsBodyRow from './table-body-row/readme.md';\nimport sddsBodyRowExpandable from './table-body-row-expandable/readme.md';\nimport sddsBodyCell from './table-body-cell/readme.md';\nimport sddsTableFooter from './table-footer/readme.md';\n\nexport default {\n  title: 'Components/Data Table/Web Component',\n  parameters: {\n    notes: {\n      'sdds-table': sddsTable,\n      'sdds-table-toolbar': sddsTableToolbar,\n      'sdds-header': sddsHeader,\n      'sdds-header-cell': sddsHeaderCell,\n      'sdds-table-body': sddsTableBody,\n      'sdds-body-row': sddsBodyRow,\n      'sdds-body-row-expandable': sddsBodyRowExpandable,\n      'sdds-body-cell': sddsBodyCell,\n      'sdds-table-footer': sddsTableFooter,\n    },\n  },\n  argTypes: {\n    modeVariant: {\n      name: 'Mode variant',\n      description: 'Mode variant adjusts component colors to have better visibility depending on global mode and background.',\n      control: {\n        type: 'radio',\n      },\n      options: ['Inherit from parent', 'Primary', 'Secondary'],\n      table: {\n        defaultValue: { summary: 'Inherit from parent' },\n      },\n    },\n    compactDesign: {\n      name: 'Compact Design',\n      description: 'Enables compact design of the table, rows with less height.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    responsiveDesign: {\n      name: 'Responsive design',\n      description: 'Enables table to take 100% of available width. For column values less than 192px, \"No minimum width\" has to be enabled too.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    column1sortable: {\n      name: 'Column 1 is sortable',\n      description: 'Enables column 1 to be sorted alphabetically.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    column2sortable: {\n      name: 'Column 2 is sortable',\n      description: 'Enables column 2 to be sorted alphabetically.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    column3sortable: {\n      name: 'Column 3 is sortable',\n      description: 'Enables column 3 to be sorted alphabetically.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    column4sortable: {\n      name: 'Column 4 is sortable',\n      description: 'Enables column 4 to be sorted alphabetically.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    verticalDivider: {\n      name: 'Vertical dividers',\n      description: 'Enables vertical dividers between table columns.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    noMinWidth: {\n      name: 'No minimum width',\n      description: 'Resets min-width rule and enables setting column width value to less than 192px which is the default. When enabled, controls for column width will show here.',\n      control: {\n        type: 'boolean',\n      },\n    },\n    column1Width: {\n      name: 'Column 1 width',\n      description:'Value of width for column 1. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column2Width: {\n      name: 'Column 2 width',\n      description: 'Value of width for column 2. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column3Width: {\n      name: 'Column 3 width',\n      description: 'Value of width for column 3. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n    column4Width: {\n      name: 'Column 4 width',\n      description: 'Value of width for column 4. In order to work correctly \"No minimum width\" has to be enabled too. When editing please provide a unit next to the value, eg. 200px.',\n      control: {\n        type: 'text',\n      },\n      if: { arg: 'noMinWidth', eq: true },\n    },\n  },\n  args: {\n    modeVariant: 'Inherit from parent',\n    compactDesign: false,\n    responsiveDesign: false,\n    column1sortable: true,\n    column2sortable: true,\n    column3sortable: true,\n    column4sortable: true,\n    verticalDivider: false,\n    noMinWidth: false,\n    column1Width: '',\n    column2Width: '',\n    column3Width: '',\n    column4Width: '',\n  },\n};\n\nconst SortingTemplate = ({\n  modeVariant,\n  compactDesign,\n  responsiveDesign,\n  column1sortable,\n  column2sortable,\n  column3sortable,\n  column4sortable,\n  verticalDivider,\n  noMinWidth,\n  column1Width,\n  column2Width,\n  column3Width,\n  column4Width,\n}) =>\n  formatHtmlPreview(`\n    <sdds-table\n      vertical-dividers=\"${verticalDivider}\"\n      compact-design=\"${compactDesign}\"\n      enable-responsive=\"${responsiveDesign}\"\n      ${noMinWidth ? 'no-min-width' : ''}\n      ${modeVariant !== 'Inherit from parent' ? `mode-variant=\"${modeVariant.toLowerCase()}\"` : ''}\n    >\n      <sdds-table-toolbar table-title=\"Sorting\"></sdds-table-toolbar>\n          <sdds-table-header>\n              <sdds-header-cell column-key='truck' column-title='Truck type' sortable=\"${column1sortable}\" ${\n                column1Width ? `custom-width=\"${column1Width}\"` : ''\n              }></sdds-header-cell>\n              <sdds-header-cell column-key='driver' column-title='Driver name' sortable=\"${column2sortable}\" ${\n                column2Width ? `custom-width=\"${column2Width}\"` : ''\n              }></sdds-header-cell>\n              <sdds-header-cell column-key='country' column-title='Country' sortable=\"${column3sortable}\" ${\n                column3Width ? `custom-width=\"${column3Width}\"` : ''\n              }></sdds-header-cell>\n              <sdds-header-cell column-key='mileage' column-title='Mileage' sortable=\"${column4sortable}\" text-align='right' ${\n                column4Width ? `custom-width=\"${column4Width}\"` : ''\n              }></sdds-header-cell>\n          </sdds-table-header>\n          <sdds-table-body enable-dummy-data>\n          </sdds-table-body>\n  </sdds-table>`);\n\nexport const Sorting = SortingTemplate.bind({});"]}

package/dist/collection/components/data-table/table-footer/table-footer.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"table-footer.js","sourceRoot":"","sources":["../../../../src/components/data-table/table-footer/table-footer.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  h,\n  Host,\n  Listen,\n  State,\n  Event,\n  EventEmitter,\n  Prop,\n  Element,\n} from '@stencil/core';\nimport { InternalSddsTablePropChange } from '../table/table';\n\nconst relevantTableProps: InternalSddsTablePropChange['changed'] = [\n  'compactDesign',\n  'noMinWidth',\n  'verticalDividers',\n];\n\nfunction removeShakeAnimation(e: AnimationEvent & { target: HTMLElement }) {\n  e.target.classList.remove('sdds-table__page-selector-input--shake');\n}\n\n@Component({\n  tag: 'sdds-table-footer',\n  styleUrl: 'table-footer.scss',\n  shadow: true,\n})\nexport class TableFooter {\n  /** Enable pagination and show pagination controls  */\n  @Prop({ reflect: true }) enablePagination: boolean = false;\n\n  /** Sets how many rows to display when pagination is enabled */\n  @Prop({ reflect: true }) rowsPerPage: number = 5;\n\n  /** Prop to enable client controlled pagination  */\n  @Prop({ reflect: true }) enableClientPagination: boolean = false;\n\n  /** Prop for client to set current page number */\n  @Prop({ reflect: true }) clientPaginationValue: number = 1;\n\n  /** Prop for client to set max number of pages */\n  @Prop({ reflect: true }) clientMaxPages: number = 1;\n\n  /** In case that automatic count of columns does not work, user can manually set this one. Take in mind that expandable control is column too */\n  @Prop() clientSetColumnsNumber: number = null;\n\n  /** Disables inbuilt pagination logic, leaving user an option to create own pagination functionality while listening to events from sdds-table-footer component */\n  @Prop() disablePaginationFunction: boolean = false;\n\n  /** State that memorize number of columns to display colSpan correctly - set from parent level */\n  @State() columnsNumber: number = 0;\n\n  /** Total number of pages, number of the rows divided with number of rows per page */\n  @State() numberOfPages: number = 0;\n\n  /** Initial value for pagination in input element */\n  @State() paginationValue: number = 1;\n\n  /** Temporarily disable pagination - due to search - set from parent level */\n  @State() tempPaginationDisable: boolean = false;\n\n  @State() verticalDividers: boolean = false;\n\n  @State() compactDesign: boolean = false;\n\n  @State() noMinWidth: boolean = false;\n\n  @State() whiteBackground: boolean = false;\n\n  @State() tableId: string = '';\n\n  @Element() host: HTMLElement;\n\n  tableEl: HTMLSddsTableElement;\n\n  /** @internal Event that footer sends out in order to receive other necessary information from other subcomponents */\n  @Event({\n    eventName: 'internalSddsEnablePagination',\n    composed: true,\n    cancelable: true,\n    bubbles: true,\n  })\n  internalSddsEnablePagination: EventEmitter<any>;\n\n  @Listen('internalSddsTablePropChange', { target: 'body' })\n  internalSddsPropChangeListener(event: CustomEvent<InternalSddsTablePropChange>) {\n    if (this.tableId === event.detail.tableId) {\n      event.detail.changed\n        .filter((changedProp) => relevantTableProps.includes(changedProp))\n        .forEach((changedProp) => {\n          if (typeof this[changedProp] === 'undefined') {\n            throw new Error(`Table prop is not supported: ${changedProp}`);\n          }\n          this[changedProp] = event.detail[changedProp];\n        });\n    }\n  }\n\n  connectedCallback() {\n    this.tableEl = this.host.closest('sdds-table');\n    this.tableId = this.tableEl.tableId;\n  }\n\n  componentWillLoad() {\n    relevantTableProps.forEach((tablePropName) => {\n      this[tablePropName] = this.tableEl[tablePropName];\n    });\n\n    const numberOfRows = this.host.parentElement.querySelector('sdds-table-body').childElementCount;\n\n    const numberOfColumns =\n      this.host.parentElement.querySelector('sdds-table-header').childElementCount;\n\n    this.numberOfPages = Math.ceil(numberOfRows / this.rowsPerPage);\n\n    if (this.clientSetColumnsNumber !== null) {\n      this.columnsNumber = this.clientSetColumnsNumber;\n    } else {\n      this.columnsNumber = numberOfColumns;\n    }\n\n    this.internalSddsEnablePagination.emit(this.tableId);\n  }\n\n  paginationPrev = (event) => {\n    event.preventDefault();\n    // Enable lowering until 1st page\n    if (this.paginationValue >= 2) {\n      this.paginationValue--;\n      this.runPagination();\n    }\n  };\n\n  paginationNext = (event) => {\n    event.preventDefault();\n    // Enable increasing until the max number of pages\n    if (this.paginationValue <= this.numberOfPages) {\n      this.paginationValue++;\n      this.runPagination();\n    }\n  };\n\n  paginationInputChange(event) {\n    const insertedValue = event.target.value;\n\n    if (insertedValue > this.numberOfPages || insertedValue < 1) {\n      event.target.classList.add('sdds-table__page-selector-input--shake');\n      this.paginationValue = event.target.max;\n    } else {\n      this.paginationValue = event.target.value;\n    }\n    this.runPagination();\n  }\n\n  @Listen('internalSddsPagination', { target: 'body' })\n  sddsPaginationListener(event: CustomEvent<any>) {\n    if (this.tableId === event.detail) {\n      this.runPagination();\n    }\n  }\n\n  runPagination = () => {\n    if (!this.disablePaginationFunction) {\n      // grab all rows in body\n      const dataRowsPagination = this.host.parentNode\n        .querySelector('sdds-table-body')\n        .querySelectorAll('.sdds-table__row');\n\n      dataRowsPagination.forEach((item, i) => {\n        // for making logic easier 1st result, 2nd result...\n        const index = i + 1;\n\n        if (this.tempPaginationDisable) {\n          this.paginationValue = 1;\n        } else {\n          const lastResult = this.rowsPerPage * this.paginationValue;\n          const firstResult = lastResult - this.rowsPerPage;\n\n          if (index > firstResult && index <= lastResult) {\n            item.classList.remove('sdds-table__row--hidden');\n          } else {\n            item.classList.add('sdds-table__row--hidden');\n          }\n        }\n      });\n    }\n  };\n\n  /* Client based functions below */\n\n  /** Event to send current page value back to sdds-table-body component, can also be listened to in order to implement custom pagination logic. */\n  @Event({\n    eventName: 'sddsPageChange',\n    composed: true,\n    cancelable: true,\n    bubbles: true,\n  })\n  sddsPageChange: EventEmitter<any>;\n\n  sendPaginationValue(value) {\n    this.sddsPageChange.emit([this.tableId, value]);\n  }\n\n  clientPaginationPrev = (event) => {\n    event.preventDefault();\n    // Enable lowering until 1st page\n    if (this.clientPaginationValue >= 2) {\n      this.clientPaginationValue--;\n      this.sendPaginationValue(this.clientPaginationValue);\n    }\n  };\n\n  clientPaginationNext = (event) => {\n    event.preventDefault();\n    // Enable increasing until the max number of pages\n    if (this.clientPaginationValue <= this.clientMaxPages) {\n      this.clientPaginationValue++;\n      this.sendPaginationValue(this.clientPaginationValue);\n    }\n  };\n\n  clientPaginationInputChange(event) {\n    const insertedValue = event.target.value;\n\n    if (insertedValue > this.clientMaxPages || insertedValue < 1) {\n      event.target.classList.add('sdds-table__page-selector-input--shake');\n      this.clientPaginationValue = event.target.max;\n    } else {\n      this.clientPaginationValue = event.target.value;\n    }\n    this.sendPaginationValue(this.clientPaginationValue);\n  }\n\n  render() {\n    return (\n      <Host class={this.compactDesign ? 'sdds-table--compact' : ''}>\n        <tr class=\"sdds-table__footer-row\">\n          <td class=\"sdds-table__footer-cell\" colSpan={this.columnsNumber}>\n            {this.enablePagination && !this.enableClientPagination && (\n              <div class=\"sdds-table__pagination\">\n                <div class=\"sdds-table__row-selector\"></div>\n                <div class=\"sdds-table__page-selector\">\n                  <input\n                    class=\"sdds-table__page-selector-input\"\n                    type=\"number\"\n                    min=\"1\"\n                    max={this.numberOfPages}\n                    value={this.paginationValue}\n                    pattern=\"[0-9]+\"\n                    dir=\"rtl\"\n                    onChange={(event) => this.paginationInputChange(event)}\n                    onFocusout={(event) => this.paginationInputChange(event)}\n                    onAnimationEnd={removeShakeAnimation}\n                    disabled={this.tempPaginationDisable}\n                  />\n                  <p class=\"sdds-table__footer-text\">\n                    of <span>{this.tempPaginationDisable ? 1 : this.numberOfPages}</span> pages\n                  </p>\n                  <button\n                    class=\"sdds-table__footer-btn\"\n                    disabled={this.paginationValue <= 1 || this.tempPaginationDisable}\n                    onClick={(event) => this.paginationPrev(event)}\n                  >\n                    <svg\n                      class=\"sdds-table__footer-btn-svg\"\n                      fill=\"currentColor\"\n                      xmlns=\"http://www.w3.org/2000/svg\"\n                      viewBox=\"0 0 32 32\"\n                    >\n                      <path\n                        fill-rule=\"evenodd\"\n                        clip-rule=\"evenodd\"\n                        d=\"M22.217 4.273a1 1 0 0 1 0 1.415l-9.888 9.888a.6.6 0 0 0 0 .848l9.888 9.888a1 1 0 0 1-1.414 1.415l-9.889-9.889a2.6 2.6 0 0 1 0-3.677l9.889-9.888a1 1 0 0 1 1.414 0Z\"\n                      />\n                    </svg>\n                  </button>\n                  <button\n                    class=\"sdds-table__footer-btn\"\n                    disabled={\n                      this.paginationValue >= this.numberOfPages || this.tempPaginationDisable\n                    }\n                    onClick={(event) => this.paginationNext(event)}\n                  >\n                    <svg\n                      class=\"sdds-table__footer-btn-svg\"\n                      fill=\"currentColor\"\n                      xmlns=\"http://www.w3.org/2000/svg\"\n                      viewBox=\"0 0 32 32\"\n                    >\n                      <path\n                        fill-rule=\"evenodd\"\n                        clip-rule=\"evenodd\"\n                        d=\"M9.783 27.727a1 1 0 0 1 0-1.415l9.888-9.888a.6.6 0 0 0 0-.848L9.783 5.688a1 1 0 0 1 1.414-1.415l9.889 9.889a2.6 2.6 0 0 1 0 3.676l-9.889 9.889a1 1 0 0 1-1.414 0Z\"\n                      />\n                    </svg>\n                  </button>\n                </div>\n              </div>\n            )}\n            {this.enableClientPagination && !this.enablePagination && (\n              <div class=\"sdds-table__pagination\">\n                <div class=\"sdds-table__row-selector\"></div>\n                <div class=\"sdds-table__page-selector\">\n                  <input\n                    class=\"sdds-table__page-selector-input\"\n                    type=\"number\"\n                    min=\"1\"\n                    max={this.clientMaxPages}\n                    value={this.clientPaginationValue}\n                    pattern=\"[0-9]+\"\n                    dir=\"rtl\"\n                    onChange={(event) => this.clientPaginationInputChange(event)}\n                    onFocusout={(event) => this.clientPaginationInputChange(event)}\n                    onAnimationEnd={removeShakeAnimation}\n                  />\n                  <p class=\"sdds-table__footer-text\">\n                    of <span>{this.clientMaxPages}</span> pages\n                  </p>\n                  <button\n                    class=\"sdds-table__footer-btn\"\n                    disabled={this.clientPaginationValue <= 1}\n                    onClick={(event) => this.clientPaginationPrev(event)}\n                  >\n                    <svg\n                      class=\"sdds-table__footer-btn-svg\"\n                      fill=\"currentColor\"\n                      xmlns=\"http://www.w3.org/2000/svg\"\n                      viewBox=\"0 0 32 32\"\n                    >\n                      <path\n                        fill-rule=\"evenodd\"\n                        clip-rule=\"evenodd\"\n                        d=\"M22.217 4.273a1 1 0 0 1 0 1.415l-9.888 9.888a.6.6 0 0 0 0 .848l9.888 9.888a1 1 0 0 1-1.414 1.415l-9.889-9.889a2.6 2.6 0 0 1 0-3.677l9.889-9.888a1 1 0 0 1 1.414 0Z\"\n                      />\n                    </svg>\n                  </button>\n                  <button\n                    class=\"sdds-table__footer-btn\"\n                    disabled={this.clientPaginationValue >= this.clientMaxPages}\n                    onClick={(event) => this.clientPaginationNext(event)}\n                  >\n                    <svg\n                      class=\"sdds-table__footer-btn-svg\"\n                      fill=\"currentColor\"\n                      xmlns=\"http://www.w3.org/2000/svg\"\n                      viewBox=\"0 0 32 32\"\n                    >\n                      <path\n                        fill-rule=\"evenodd\"\n                        clip-rule=\"evenodd\"\n                        d=\"M9.783 27.727a1 1 0 0 1 0-1.415l9.888-9.888a.6.6 0 0 0 0-.848L9.783 5.688a1 1 0 0 1 1.414-1.415l9.889 9.889a2.6 2.6 0 0 1 0 3.676l-9.889 9.889a1 1 0 0 1-1.414 0Z\"\n                      />\n                    </svg>\n                  </button>\n                </div>\n              </div>\n            )}\n          </td>\n        </tr>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/data-table/table-header/table-header.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"table-header.js","sourceRoot":"","sources":["../../../../src/components/data-table/table-header/table-header.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Host, State, Event, EventEmitter, Listen, Element } from '@stencil/core';\nimport { InternalSddsTablePropChange } from '../table/table';\n\nconst relevantTableProps: InternalSddsTablePropChange['changed'] = [\n  'enableMultiselect',\n  'enableExpandableRows',\n  'verticalDividers',\n  'compactDesign',\n  'noMinWidth',\n];\n\n@Component({\n  tag: 'sdds-table-header',\n  styleUrl: 'table-header.scss',\n  shadow: true,\n})\nexport class TableHeaderRow {\n  @State() enableMultiselect: boolean = false;\n\n  @State() enableExpandableRows: boolean = false;\n\n  @State() mainCheckboxSelected: boolean = false;\n\n  @State() mainExpendSelected: boolean = false;\n\n  @State() verticalDividers: boolean = false;\n\n  @State() compactDesign: boolean = false;\n\n  @State() noMinWidth: boolean = false;\n\n  @State() whiteBackground: boolean = false;\n\n  @State() enableToolbarDesign: boolean = false;\n\n  @State() tableId: string = '';\n\n  @Element() host: HTMLElement;\n\n  tableEl: HTMLSddsTableElement;\n\n  /** @internal Send status of main checkbox in header to the parent, sdds-table component */\n  @Event({\n    eventName: 'internalSddsMainCheckboxSelect',\n    composed: true,\n    cancelable: true,\n    bubbles: true,\n  })\n  internalSddsMainCheckboxSelect: EventEmitter<any>;\n\n  @Listen('internalSddsTablePropChange', { target: 'body' })\n  internalSddsPropChangeListener(event: CustomEvent<InternalSddsTablePropChange>) {\n    if (this.tableId === event.detail.tableId) {\n      event.detail.changed\n        .filter((changedProp) => relevantTableProps.includes(changedProp))\n        .forEach((changedProp) => {\n          if (typeof this[changedProp] === 'undefined') {\n            throw new Error(`Table prop is not supported: ${changedProp}`);\n          }\n          this[changedProp] = event.detail[changedProp];\n        });\n    }\n  }\n\n  @Listen('internalSddsMainCheckboxChange', { target: 'body' })\n  internalSddsMainCheckboxChangeListener(event: CustomEvent<any>) {\n    const [receivedID, receivedMainCheckboxStatus] = event.detail;\n    if (this.tableId === receivedID) {\n      this.mainCheckboxSelected = receivedMainCheckboxStatus;\n    }\n  }\n\n  @Listen('internalSddsRowExpanded', { target: 'body' })\n  internalSddsRowExpandedListener(event: CustomEvent<any>) {\n    if (this.tableId === event.detail[0]) {\n      // TODO: Improve this logic. Why we get late repose in DOM?\n      setTimeout(() => {\n        this.bodyExpandClicked();\n      }, 100);\n    }\n  }\n\n  bodyExpandClicked() {\n    const numberOfExtendRowsActive = this.host.parentElement\n      .querySelector('sdds-table-body')\n      .getElementsByClassName('sdds-table__row-extend--active').length;\n    const numberOfExtendRows = this.host.parentElement\n      .querySelector('sdds-table-body')\n      .getElementsByTagName('sdds-table-body-row-expendable').length;\n\n    if (numberOfExtendRows === numberOfExtendRowsActive) {\n      this.mainExpendSelected = true;\n    } else {\n      this.mainExpendSelected = false;\n    }\n  }\n\n  connectedCallback() {\n    this.tableEl = this.host.closest('sdds-table');\n    this.tableId = this.tableEl.tableId;\n  }\n\n  componentWillLoad() {\n    relevantTableProps.forEach((tablePropName) => {\n      this[tablePropName] = this.tableEl[tablePropName];\n    });\n  }\n\n  componentWillRender() {\n    this.enableToolbarDesign =\n      this.host.closest('sdds-table').getElementsByTagName('sdds-table-toolbar').length >= 1;\n  }\n\n  headCheckBoxClicked(event) {\n    this.mainCheckboxSelected = event.currentTarget.checked;\n    this.internalSddsMainCheckboxSelect.emit([this.tableId, this.mainCheckboxSelected]);\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          'sdds-table--compact': this.compactDesign,\n          'sdds-table--divider': this.verticalDividers,\n          'sdds-table--toolbar-available': this.enableToolbarDesign,\n        }}\n      >\n        <tr>\n          {this.enableMultiselect && (\n            <th class=\"sdds-table__header-cell sdds-table__header-cell--checkbox\">\n              <div class=\"sdds-checkbox-item\">\n                <label class=\"sdds-form-label sdds-form-label--data-table\">\n                  <input\n                    class=\"sdds-form-input\"\n                    type=\"checkbox\"\n                    onChange={(e) => this.headCheckBoxClicked(e)}\n                    checked={this.mainCheckboxSelected}\n                  />\n                </label>\n              </div>\n            </th>\n          )}\n          {this.enableExpandableRows && (\n            <th class=\"sdds-table__header-cell sdds-table__header-cell--checkbox\"></th>\n          )}\n          <slot></slot>\n        </tr>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/data-table/table-header-cell/table-header-cell.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"table-header-cell.js","sourceRoot":"","sources":["../../../../src/components/data-table/table-header-cell/table-header-cell.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Prop,\n  h,\n  Host,\n  Event,\n  EventEmitter,\n  State,\n  Listen,\n  Element,\n} from '@stencil/core';\nimport { InternalSddsTablePropChange } from '../table/table';\n\nconst relevantTableProps: InternalSddsTablePropChange['changed'] = [\n  'enableMultiselect',\n  'enableExpandableRows',\n  'compactDesign',\n  'noMinWidth',\n  'verticalDividers',\n];\n\n@Component({\n  tag: 'sdds-header-cell',\n  styleUrl: 'table-header-cell.scss',\n  shadow: true,\n})\nexport class TableHeaderCell {\n  /** Value of column key, usually comes from JSON, needed for sorting */\n  @Prop({ reflect: true }) columnKey: string;\n\n  /** Text that displays in column cell */\n  @Prop({ reflect: true }) columnTitle: string;\n\n  /** In case noMinWidth setting, user has to specify width value for each column, for example \"150px\" */\n  @Prop({ reflect: true }) customWidth: string;\n\n  /** If passed as prop, enables sorting on that column */\n  @Prop() sortable: boolean = false;\n\n  /** Setting for text align, default is left, but user can pass \"right\" as string - useful for numeric values */\n  @Prop({ reflect: true }) textAlign: string;\n\n  @State() textAlignState: string;\n\n  @State() sortingDirection: string = '';\n\n  @State() sortedByMyKey: boolean = false;\n\n  @State() disableSortingBtn: boolean = false;\n\n  @State() verticalDividers: boolean = false;\n\n  @State() compactDesign: boolean = false;\n\n  @State() noMinWidth: boolean = false;\n\n  @State() enableMultiselect: boolean = false;\n\n  @State() enableToolbarDesign: boolean = false;\n\n  @State() tableId: string = '';\n\n  @State() enableExpandableRows: boolean = false;\n\n  @Element() host: HTMLElement;\n\n  tableEl: HTMLSddsTableElement;\n\n  /** Sends unique table identifier,column key and sorting direction to the sdds-table-body component, can also be listened to in order to implement custom sorting logic. */\n  @Event({\n    eventName: 'sddsSortChange',\n    composed: true,\n    cancelable: true,\n    bubbles: true,\n  })\n  sddsSortChange: EventEmitter<any>;\n\n  /** @internal Sends unique table identifier, column key and text align value so the body cells with same key take the same text alignment as header cell */\n  @Event({\n    eventName: 'internalSddsTextAlign',\n    composed: true,\n    cancelable: true,\n    bubbles: true,\n  })\n  internalSddsTextAlign: EventEmitter<any>;\n\n  /** @internal Sends unique table identifier, column key so the body cells with the same key change background when user hovers over header cell */\n  @Event({\n    eventName: 'internalSddsHover',\n    composed: true,\n    cancelable: true,\n    bubbles: true,\n  })\n  internalSddsHover: EventEmitter<any>;\n\n  @Listen('internalSddsPropChange', { target: 'body' })\n  internalSddsPropChangeListener(event: CustomEvent<InternalSddsTablePropChange>) {\n    if (this.tableId === event.detail.tableId) {\n      event.detail.changed\n        .filter((changedProp) => relevantTableProps.includes(changedProp))\n        .forEach((changedProp) => {\n          if (typeof this[changedProp] === 'undefined') {\n            throw new Error(`Table prop is not supported: ${changedProp}`);\n          }\n          this[changedProp] = event.detail[changedProp];\n        });\n    }\n  }\n\n  // Listen to parent data-table if sorting is allowed\n  @Listen('internalSddsSortingChange', { target: 'body' })\n  internalSddsSortingChangeListener(event: CustomEvent<any>) {\n    const [receivedID, receivedSortingStatus] = event.detail;\n    if (this.tableId === receivedID) {\n      this.disableSortingBtn = receivedSortingStatus;\n    }\n  }\n\n  // target is set to body so other instances of same component \"listen\" and react to the change\n  @Listen('sddsSortChange', { target: 'body' })\n  updateOptionsContent(event: CustomEvent<any>) {\n    if (this.tableId === event.detail[0]) {\n      // grab only value at position 1 as it is the \"key\"\n      if (this.columnKey !== event.detail[1]) {\n        this.sortedByMyKey = false;\n        // To sync with CSS transition timing\n        setTimeout(() => {\n          this.sortingDirection = '';\n        }, 200);\n      }\n    }\n  }\n\n  connectedCallback() {\n    this.tableEl = this.host.closest('sdds-table');\n    this.tableId = this.tableEl.tableId;\n  }\n\n  componentWillLoad() {\n    relevantTableProps.forEach((tablePropName) => {\n      this[tablePropName] = this.tableEl[tablePropName];\n    });\n  }\n\n  componentWillRender() {\n    // enable only right or left text align\n    if (this.textAlign === 'right' || this.textAlign === 'end') {\n      this.textAlignState = 'right';\n    } else {\n      this.textAlignState = 'left';\n    }\n    // To enable body cells text align per rules set in head cell\n    this.internalSddsTextAlign.emit([this.tableId, this.columnKey, this.textAlignState]);\n\n    this.enableToolbarDesign =\n      this.host.closest('sdds-table').getElementsByTagName('sdds-table-toolbar').length >= 1;\n  }\n\n  sortButtonClick = (key) => {\n    // Toggling direction of sorting as we only use one button for sorting\n    if (this.sortingDirection !== 'asc') {\n      this.sortingDirection = 'asc';\n    } else {\n      this.sortingDirection = 'desc';\n    }\n    // Setting to true we can set enable CSS class for \"active\" state of column\n    this.sortedByMyKey = true;\n    // Use array to send both key and sorting direction\n    this.sddsSortChange.emit([this.tableId, key, this.sortingDirection]);\n  };\n\n  headerCellContent = () => {\n    if (this.sortable && !this.disableSortingBtn) {\n      return (\n        <button\n          class=\"sdds-table__header-button\"\n          onClick={() => this.sortButtonClick(this.columnKey)}\n        >\n          <span class=\"sdds-table__header-button-text\" style={{ textAlign: this.textAlignState }}>\n            {this.columnTitle}\n          </span>\n\n          {this.sortingDirection === '' && (\n            <svg\n              class=\"sdds-table__header-button-icon\"\n              fill=\"currentColor\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n              viewBox=\"0 0 12 15\"\n            >\n              <path\n                fill-rule=\"evenodd\"\n                clip-rule=\"evenodd\"\n                d=\"M8.45 13.67V4.62a.5.5 0 0 1 1 0v9.05h-1Z\"\n              />\n              <path\n                fill-rule=\"evenodd\"\n                clip-rule=\"evenodd\"\n                d=\"M6.07 10.28a.5.5 0 0 1 .7.08l2.1 2.66a.1.1 0 0 0 .15 0l2.09-2.66a.5.5 0 1 1 .78.62l-2.08 2.66a1.1 1.1 0 0 1-1.73 0l-2.1-2.66a.5.5 0 0 1 .1-.7ZM3.55.4v9.04a.5.5 0 1 1-1 0V.39h1Z\"\n              />\n              <path\n                fill-rule=\"evenodd\"\n                clip-rule=\"evenodd\"\n                d=\"M5.93 3.78a.5.5 0 0 1-.7-.08l-2.1-2.66a.1.1 0 0 0-.15 0L.89 3.7a.5.5 0 0 1-.78-.62L2.19.42a1.1 1.1 0 0 1 1.73 0l2.1 2.66a.5.5 0 0 1-.1.7Z\"\n              />\n            </svg>\n          )}\n          {/* First icon is arrow down as first set direction is ascending, clicking it again rotates the icon as we set descending order */}\n          {this.sortingDirection !== '' && (\n            <svg\n              class={`sdds-table__header-button-icon ${\n                this.sortingDirection === 'desc' ? 'sdds-table__header-button-icon--rotate' : ''\n              }`}\n              fill=\"currentColor\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n              viewBox=\"0 0 32 32\"\n            >\n              <path\n                fill-rule=\"evenodd\"\n                clip-rule=\"evenodd\"\n                d=\"M17 2.974a1 1 0 0 0-2 0v24.3l-9.312-9.312a1 1 0 0 0-1.414 1.414l9.887 9.888a2.6 2.6 0 0 0 3.677 0l9.888-9.888a1 1 0 0 0-1.414-1.414L17 27.274v-24.3Z\"\n              />\n            </svg>\n          )}\n        </button>\n      );\n    }\n    return (\n      <p class=\"sdds-table__header-text\" style={{ textAlign: this.textAlignState }}>\n        {this.columnTitle}\n      </p>\n    );\n  };\n\n  onHeadCellHover = (key) => {\n    this.internalSddsHover.emit([this.tableId, key]);\n  };\n\n  render() {\n    return (\n      <Host\n        class={{\n          'sdds-table__header-cell': true,\n          'sdds-table__header-cell--sortable': this.sortable,\n          'sdds-table__header-cell--is-sorted': this.sortedByMyKey,\n          'sdds-table__header-cell--custom-width': this.customWidth !== '',\n          'sdds-table__header-cell--right-align': this.textAlignState === 'right',\n          'sdds-table--compact': this.compactDesign,\n          'sdds-table--divider': this.verticalDividers,\n          'sdds-table--no-min-width': this.noMinWidth,\n          'sdds-table--extra-column': this.enableMultiselect || this.enableExpandableRows,\n          'sdds-table--toolbar-available': this.enableToolbarDesign,\n        }}\n        style={{ width: this.customWidth }}\n        // Calling actions from here to enable hover functionality for both sortable and un-sortable tables\n        onMouseOver={() => this.onHeadCellHover(this.columnKey)}\n        onMouseLeave={() => this.onHeadCellHover('')}\n      >\n        {this.headerCellContent()}\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/data-table/table-toolbar/table-toolbar.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"table-toolbar.js","sourceRoot":"","sources":["../../../../src/components/data-table/table-toolbar/table-toolbar.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  h,\n  Host,\n  Prop,\n  Event,\n  EventEmitter,\n  Listen,\n  State,\n  Element,\n} from '@stencil/core';\nimport { InternalSddsTablePropChange } from '../table/table';\n\nconst relevantTableProps: InternalSddsTablePropChange['changed'] = [\n  'compactDesign',\n  'noMinWidth',\n  'verticalDividers',\n];\n\n@Component({\n  tag: 'sdds-table-toolbar',\n  styleUrl: 'table-toolbar.scss',\n  shadow: true,\n})\nexport class TableToolbar {\n  /** Adds title to the data-table */\n  @Prop({ reflect: true }) tableTitle: string = '';\n\n  /** Enables preview of searchbar */\n  @Prop({ reflect: true }) enableFiltering: boolean = false;\n\n  @State() verticalDividers: boolean = false;\n\n  @State() compactDesign: boolean = false;\n\n  @State() noMinWidth: boolean = false;\n\n  @State() whiteBackground: boolean = false;\n\n  @State() tableId: string = '';\n\n  @Element() host: HTMLElement;\n\n  tableEl: HTMLSddsTableElement;\n\n  /** Used for sending users input to main parent <sdds-table> component, can also be listened to in order to implement custom sorting logic. */\n  @Event({\n    eventName: 'sddsFilter',\n    composed: true,\n    cancelable: true,\n    bubbles: true,\n  })\n  sddsFilter: EventEmitter<any>;\n\n  @Listen('internalSddsTablePropChange', { target: 'body' })\n  internalSddsPropChangeListener(event: CustomEvent<InternalSddsTablePropChange>) {\n    if (this.tableId === event.detail.tableId) {\n      event.detail.changed\n        .filter((changedProp) => relevantTableProps.includes(changedProp))\n        .forEach((changedProp) => {\n          if (typeof this[changedProp] === 'undefined') {\n            throw new Error(`Table prop is not supported: ${changedProp}`);\n          }\n          this[changedProp] = event.detail[changedProp];\n        });\n    }\n  }\n\n  connectedCallback() {\n    this.tableEl = this.host.closest('sdds-table');\n    this.tableId = this.tableEl.tableId;\n  }\n\n  componentWillLoad() {\n    relevantTableProps.forEach((tablePropName) => {\n      this[tablePropName] = this.tableEl[tablePropName];\n    });\n  }\n\n  searchFunction(event) {\n    const searchTerm = event.currentTarget.value.toLowerCase();\n    const sddsTableSearchBar = event.currentTarget.parentElement;\n\n    this.sddsFilter.emit([this.tableId, searchTerm]);\n\n    if (searchTerm.length > 0) {\n      sddsTableSearchBar.classList.add('sdds-table__searchbar--active');\n    } else {\n      sddsTableSearchBar.classList.remove('sdds-table__searchbar--active');\n    }\n  }\n\n  render() {\n    return (\n      <Host class={this.compactDesign ? 'sdds-table--compact' : ''}>\n        <div class=\"sdds-table__upper-bar-flex\">\n          <caption class=\"sdds-table__title\">{this.tableTitle}</caption>\n          <div class=\"sdds-table__actionbar\">\n            {this.enableFiltering && (\n              <div class=\"sdds-table__searchbar\">\n                <input\n                  class=\"sdds-table__searchbar-input\"\n                  type=\"text\"\n                  onKeyUp={(event) => this.searchFunction(event)}\n                />\n                <span class=\"sdds-table__searchbar-icon\">\n                  <svg fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\">\n                    <path\n                      fill-rule=\"evenodd\"\n                      clip-rule=\"evenodd\"\n                      d=\"M12.942 1.985c-6.051 0-10.957 4.905-10.957 10.957 0 6.051 4.906 10.957 10.957 10.957 2.666 0 5.109-.952 7.008-2.534l8.332 8.331a1 1 0 1 0 1.414-1.414l-8.331-8.331a10.912 10.912 0 0 0 2.534-7.01c0-6.05-4.905-10.956-10.957-10.956ZM3.985 12.942a8.957 8.957 0 1 1 17.914 0 8.957 8.957 0 0 1-17.914 0Z\"\n                      fill=\"currentColor\"\n                    />\n                  </svg>\n                </span>\n              </div>\n            )}\n            <slot name=\"sdds-table__actionbar\" />\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

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

@@ -1 +0,0 @@
-{"version":3,"file":"datetime.js","sourceRoot":"","sources":["../../../src/components/datetime/datetime.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, State, h, Prop, Listen, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n  tag: 'sdds-datetime',\n  styleUrl: 'datetime.scss',\n  shadow: true,\n})\nexport class Datetime {\n  /** Textinput for focus state */\n  textInput?: HTMLInputElement;\n\n  /** Which input type, text, password or similar */\n  @Prop({ reflect: true }) type: 'datetime-local' | 'date' | 'time' = 'datetime-local';\n\n  /** Value of the input text */\n  @Prop({ reflect: true }) value = '';\n\n  /** Default value of the component. Format for time: HH-MM. Format for date: YY-MM-DD. Format for date-time: YY-MM-DDTHH-MM */\n  @Prop() defaultValue: string | 'none' = 'none';\n\n  /** Set input in disabled state */\n  @Prop() disabled: boolean = false;\n\n  /** Size of the input */\n  @Prop() size: 'sm' | 'md' | 'lg' = 'lg';\n\n  /** Resets min width rule */\n  @Prop() noMinWidth: boolean = false;\n\n  /** Set the variant of the datetime component. */\n  @Prop() modeVariant: 'primary' | 'secondary' = null;\n\n  /** Name property */\n  @Prop() name = '';\n\n  /** Error state of input */\n  @Prop() state: string;\n\n  /** Autofocus for input */\n  @Prop() autofocus: boolean = false;\n\n  /** Label text for the component */\n  @Prop() label: string = '';\n\n  /** Helper text for the component */\n  @Prop() helper: string = '';\n\n  /** Listen to the focus state of the input */\n  @State() focusInput: boolean;\n\n  /** Change event for the datetime */\n  @Event({\n    composed: true,\n    bubbles: true,\n    cancelable: true,\n  })\n  sddsChange: EventEmitter;\n\n  /** Blur event for the datetime */\n  @Event({\n    composed: true,\n    bubbles: true,\n    cancelable: false,\n  })\n  sddsBlur: EventEmitter<FocusEvent>;\n\n  /** Focus event for the datetime */\n  @Event({\n    eventName: 'sddsFocus',\n    composed: true,\n    bubbles: true,\n    cancelable: false,\n  })\n  sddsFocus: EventEmitter<FocusEvent>;\n\n  getDefaultValue = () => {\n    const dateTimeObj = {\n      year: this.defaultValue.slice(0, 4),\n      month: this.defaultValue.slice(5, 7),\n      day: this.defaultValue.slice(8, 10),\n      hours: this.defaultValue.slice(11, 13),\n      minutes: this.defaultValue.slice(14, 16),\n    };\n    switch (this.type) {\n      case 'datetime-local':\n        return `${dateTimeObj.year}-${dateTimeObj.month}-${dateTimeObj.day}T${dateTimeObj.hours}:${dateTimeObj.minutes}`;\n      case 'date':\n        return `${dateTimeObj.year}-${dateTimeObj.month}-${dateTimeObj.day}`;\n      case 'time':\n        return `${this.defaultValue.slice(0, 2)}:${this.defaultValue.slice(3, 5)}`;\n      default:\n        throw new Error('Invalid type.');\n    }\n  };\n\n  componentWillLoad() {\n    if (this.defaultValue !== 'none') {\n      this.value = this.getDefaultValue();\n    }\n  }\n\n  // Listener if input enters focus state\n  @Listen('focus')\n  handleFocusIn() {\n    this.focusInput = true;\n  }\n\n  // Listener if input leaves focus state\n  @Listen('focusout')\n  handleFocusOut() {\n    this.focusInput = false;\n  }\n\n  // Data input event in value prop\n  handleInput(e): void {\n    this.value = e.target.value;\n    this.sddsChange.emit(e);\n  }\n\n  // Change event isn't a composed:true by default in for input\n  handleChange(e: Event): void {\n    this.sddsChange.emit(e);\n  }\n\n  /** Set the input as focus when clicking the whole datetime with suffix/prefix */\n  handleFocusClick(e): void {\n    this.textInput.focus();\n    this.sddsFocus.emit(e);\n  }\n\n  /** Set the input as focus when clicking the whole datetime with suffix/prefix */\n  handleBlur(e): void {\n    this.textInput.blur();\n    this.sddsBlur.emit(e);\n  }\n\n  render() {\n    let className = ' sdds-datetime-input';\n    if (this.size === 'md') {\n      className += `${className}-md`;\n    }\n    if (this.size === 'sm') {\n      className += `${className}-sm`;\n    }\n    return (\n      <div\n        class={`\n        ${this.noMinWidth ? 'sdds-form-datetime-nomin' : ''}\n        ${this.focusInput ? 'sdds-form-datetime sdds-datetime-focus' : ' sdds-form-datetime'}\n        ${this.value.length > 0 ? 'sdds-datetime-data' : ''}\n        ${this.disabled ? 'sdds-form-datetime-disabled' : ''}\n        ${this.size === 'md' ? 'sdds-form-datetime-md' : ''}\n        ${this.size === 'sm' ? 'sdds-form-datetime-sm' : ''}\n        ${\n          this.state === 'error' || this.state === 'success'\n            ? `sdds-form-datetime-${this.state}`\n            : ''\n        }\n        ${this.modeVariant !== null ? `sdds-mode-variant-${this.modeVariant}` : ''}\n        `}\n      >\n        {this.label && (\n          <label htmlFor={this.name} class=\"sdds-datetime-label\">\n            {this.label}\n          </label>\n        )}\n        <div\n          onClick={(e) => this.handleFocusClick(e)}\n          class=\"sdds-datetime-container sdds-datetime-container\"\n        >\n          <div class=\"sdds-datetime-input-container\">\n            <input\n              ref={(inputEl) => (this.textInput = inputEl as HTMLInputElement)}\n              class={className}\n              type={this.type}\n              disabled={this.disabled}\n              value={this.value}\n              autofocus={this.autofocus}\n              name={this.name}\n              onInput={(e) => this.handleInput(e)}\n              onBlur={(e) => this.handleBlur(e)}\n              onChange={(e) => this.handleChange(e)}\n            />\n\n            <div class=\"datetime-icon icon-datetime-local\">\n              <svg fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\">\n                <path\n                  fill-rule=\"evenodd\"\n                  clip-rule=\"evenodd\"\n                  d=\"M23.625 2.977a1 1 0 1 0-2 0v2.985l-11.344.01V2.99a1 1 0 1 0-2 0v2.985H6.25a4.2 4.2 0 0 0-4.2 4.2V25.77a4.2 4.2 0 0 0 4.2 4.2h19.54a4.2 4.2 0 0 0 4.2-4.2V10.167a4.2 4.2 0 0 0-4.191-4.2l-2.174-.004V2.977ZM4.05 10.174a2.2 2.2 0 0 1 2.2-2.2l16.376-.013 3.17.006a2.2 2.2 0 0 1 2.195 2.2v1.847H4.05l-.001-1.84Zm0 3.84V25.77a2.2 2.2 0 0 0 2.2 2.2h19.54a2.2 2.2 0 0 0 2.2-2.2V14.014H4.05Z\"\n                  fill=\"currentColor\"\n                />\n              </svg>\n            </div>\n\n            <div class=\"datetime-icon icon-time\">\n              <svg fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\">\n                <path\n                  d=\"M17 7a1 1 0 1 0-2 0v8a2 2 0 0 0 2 2h6a1 1 0 1 0 0-2h-6V7Z\"\n                  fill=\"currentColor\"\n                />\n                <path\n                  fill-rule=\"evenodd\"\n                  clip-rule=\"evenodd\"\n                  d=\"M16 2C8.268 2 2 8.268 2 16s6.268 14 14 14 14-6.268 14-14S23.732 2 16 2ZM4 16C4 9.373 9.373 4 16 4s12 5.373 12 12-5.373 12-12 12S4 22.627 4 16Z\"\n                  fill=\"currentColor\"\n                />\n              </svg>\n            </div>\n          </div>\n          <div class=\"sdds-datetime-bar\"></div>\n        </div>\n\n        <div class=\"sdds-datetime-helper\">\n          {this.helper && (\n            <div class=\"sdds-helper\">\n              {this.state === 'error' && <sdds-icon name=\"error\" size=\"16px\"></sdds-icon>}\n              {this.helper}\n            </div>\n          )}\n        </div>\n      </div>\n    );\n  }\n}\n"]}

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

@@ -1 +0,0 @@
-{"version":3,"file":"datetime.stories.js","sourceRoot":"","sources":["../../../src/components/datetime/datetime.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import readme from './readme.md';\nimport { formatHtmlPreview } from '../../utils/utils';\n\nexport default {\n  title: 'Components/Datetime',\n  parameters: {\n    layout: 'centered',\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=10241%3A40193&t=rVXuTOgTmXPauyHd-1',\n      },\n      {\n        name: 'Link',\n        type: 'link',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=10241%3A40193&t=rVXuTOgTmXPauyHd-1',\n      },\n    ],\n  },\n  argTypes: {\n    modeVariant: {\n      name: 'Mode variant',\n      description: 'Mode variant adjusts component colors to have better visibility depending on global mode and background.',\n      control: {\n        type: 'radio',\n      },\n      options: ['Inherit from parent', 'Primary', 'Secondary'],\n      table: {\n        defaultValue: { summary: 'Inherit from parent' },\n      },\n    },\n    state: {\n      name: 'State',\n      description: 'Switches between success and error state.',\n      control: {\n        type: 'radio',\n      },\n      options: ['None', 'Success', 'Error'],\n    },\n    type: {\n      name: 'Type',\n      description: 'Sets the field to display date, time or both.',\n      control: {\n        type: 'radio',\n      },\n      options: ['Datetime', 'Date', 'Time'],\n      table: {\n        defaultValue: { summary: 'datetime-local' },\n      },\n    },\n    size: {\n      name: 'Size',\n      description: 'Switches between different sizes.',\n      control: {\n        type: 'radio',\n        // todo: make consistent with other sizes, for example 'xs', 'sm', etc\n      },\n      options: ['Large', 'Medium', 'Small'],\n      table: {\n        defaultValue: { summary: 'lg' },\n      },\n    },\n    defaultValue: {\n      name: 'Default value',\n      description: 'Default value of the component. Format for time: HH-MM. Format for date: YY-MM-DD. Format for date-time: YY-MM-DDTHH-MM.',\n      control: {\n        type: 'radio',\n      },\n      options: ['None', 'Custom'],\n      table: {\n        defaultValue: { summary: 'none' },\n      },\n    },\n    noMinWidth: {\n      name: 'No minimum width',\n      description: 'Enables component to shrink below 208px which is the default width.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    label: {\n      name: 'Label text',\n      description: 'Sets the label text.',\n      control: {\n        type: 'text',\n      },\n    },\n    helper: {\n      name: 'Helper text',\n      description: 'Sets the helper text.',\n      control: {\n        type: 'text',\n      },\n    },\n    disabled: {\n      name: 'Disabled',\n      description: 'Disables the component.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n  },\n  args: {\n    modeVariant: 'Inherit from parent',\n    state: 'None',\n    type: 'Datetime',\n    size: 'Large',\n    defaultValue: 'None',\n    noMinWidth: false,\n    label: 'Label text',\n    helper: 'Helper text',\n    disabled: false,\n  },\n};\n\nconst datetimeTemplate = ({\n  modeVariant,\n  state,\n  type,\n  size,\n  defaultValue,\n  noMinWidth,\n  label,\n  helper,\n  disabled,\n}) => {\n  const typeLookup = {\n    Datetime: 'datetime-local',\n    Date: 'date',\n    Time: 'time',\n  };\n  const sizeLookup = {\n    Large: 'lg',\n    Medium: 'md',\n    Small: 'sm',\n  };\n  const stateLookup = {\n    None: 'none',\n    Success: 'success',\n    Error: 'error',\n  };\n\n  const getDefaultValue = (value: string, componentType: string) => {\n    if (value === 'Custom') {\n      switch (componentType) {\n        case 'Datetime':\n          return '1891-01-01T12:30';\n        case 'Date':\n          return '1891-01-01';\n        case 'Time':\n          return '12:30';\n        default:\n          return 'Invalid type';\n      }\n    } else return false;\n  };\n\n  return formatHtmlPreview(\n    `\n    <style>\n        /* Note: Demo classes used here are just for demo purposes in Storybook */\n        .demo-wrapper {\n            width: 180px;\n        }\n    </style>\n\n  <div class=\"demo-wrapper\">\n\n    <sdds-datetime\n      id=\"datetime\"\n      ${defaultValue !== 'None' ? `default-value=\"${getDefaultValue(defaultValue, type)}\"` : ''}\n      ${modeVariant !== 'Inherit from parent' ? `mode-variant=\"${modeVariant.toLowerCase()}\"`: ''}\n      type=\"${typeLookup[type]}\"\n      size=\"${sizeLookup[size]}\"\n      state=\"${stateLookup[state]}\"\n      ${disabled ? 'disabled' : ''}\n      ${noMinWidth ? 'no-min-width' : ''}\n      ${label ? `label=\"${label}\" ` : ''}\n      ${helper ? `helper=\"${helper}\" ` : ''}\n      >\n    </sdds-datetime>\n\n\n    <script>\n    /* DEMO Code: Used only for Storybook demo purposes */\n      datetimeElement = document.getElementById('storybook-datetime');\n      datetimeElement.addEventListener('sddsChange', (event) => {\n        console.log(\"Firing sddsChange: \" + event.target.value);\n      });\n      datetimeElement.addEventListener('sddsFocus', (event) => {\n        console.log(\"Firing sddsFocus: \" + event.target.value);\n      });\n      datetimeElement.addEventListener('sddsBlur', (event) => {\n        console.log(\"Firing sddsBlur: \" + event.target.value);\n      });\n    </script>\n`,\n  );\n};\n\nexport const Default = datetimeTemplate.bind({});\n\nDefault.args = {};\n\nexport const ErrorState = datetimeTemplate.bind({});\n\nErrorState.args = {\n  state: 'Error',\n};\n\nexport const Time = datetimeTemplate.bind({});\n\nTime.args = {\n  type: 'Time',\n};\n\nexport const Date = datetimeTemplate.bind({});\n\nDate.args = {\n  type: 'Date',\n};\n"]}

package/dist/collection/components/divider/divider-webcomponent.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"divider-webcomponent.stories.js","sourceRoot":"","sources":["../../../src/components/divider/divider-webcomponent.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,EAAE,OAAO,EAAE,MAAM,EAAE;IAC1B,MAAM,EAAE;MACN;QACE,IAAI,EAAE,OAAO;QACb,IAAI,EAAE,OAAO;QACb,GAAG,EAAE,6GAA6G;OACnH;MACD;QACE,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,MAAM;QACZ,GAAG,EAAE,6GAA6G;OACnH;KACF;GACF;EACD,QAAQ,EAAE;IACR,WAAW,EAAE;MACX,IAAI,EAAE,aAAa;MACnB,WAAW,EAAE,6BAA6B;MAC1C,OAAO,EAAE;QACP,IAAI,EAAE,OAAO;QACb,OAAO,EAAE,CAAC,YAAY,EAAE,UAAU,CAAC;OACpC;MACD,KAAK,EAAE;QACL,YAAY,EAAE,EAAE,OAAO,EAAE,YAAY,EAAE;OACxC;KACF;IACD,KAAK,EAAE;MACL,IAAI,EAAE,OAAO;MACb,WAAW,EAAE,yBAAyB;MACtC,OAAO,EAAE;QACP,IAAI,EAAE,QAAQ;OACf;MACD,EAAE,EAAE,EAAE,GAAG,EAAE,aAAa,EAAE,EAAE,EAAE,YAAY,EAAE;KAC7C;IACD,MAAM,EAAE;MACN,IAAI,EAAE,QAAQ;MACd,WAAW,EAAE,0BAA0B;MACvC,OAAO,EAAE;QACP,IAAI,EAAE,QAAQ;OACf;MACD,EAAE,EAAE,EAAE,GAAG,EAAE,aAAa,EAAE,EAAE,EAAE,UAAU,EAAE;KAC3C;GACF;EACD,IAAI,EAAE;IACJ,WAAW,EAAE,YAAY;IACzB,KAAK,EAAE,GAAG;IACV,MAAM,EAAE,GAAG;GACZ;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,CAClD,iBAAiB,CAAC;gBACJ,WAAW,KAAK,YAAY,CAAC,CAAC,CAAC,UAAU,KAAK,KAAK,CAAC,CAAC,CAAC,WAAW,MAAM,KAAK;iCAC3D,WAAW,CAAC,WAAW,EAAE;;CAEzD,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,YAAY,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\nimport readme from './readme.md';\n\nexport default {\n  title: 'Components/Divider',\n  parameters: {\n    layout: 'centered',\n    notes: { Divider: readme },\n    design: [\n      {\n        name: 'Figma',\n        type: 'figma',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=993%3A47555&t=8p1W6DsJrzvgWfmp-4',\n      },\n      {\n        name: 'Link',\n        type: 'link',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=993%3A47555&t=8p1W6DsJrzvgWfmp-4',\n      },\n    ],\n  },\n  argTypes: {\n    orientation: {\n      name: 'Orientation',\n      description: 'Choose divider orientation.',\n      control: {\n        type: 'radio',\n        options: ['Horizontal', 'Vertical'],\n      },\n      table: {\n        defaultValue: { summary: 'horizontal' },\n      },\n    },\n    width: {\n      name: 'Width',\n      description: 'Sets the divider width.',\n      control: {\n        type: 'number',\n      },\n      if: { arg: 'orientation', eq: 'Horizontal' },\n    },\n    height: {\n      name: 'Height',\n      description: 'Sets the divider height.',\n      control: {\n        type: 'number',\n      },\n      if: { arg: 'orientation', eq: 'Vertical' },\n    },\n  },\n  args: {\n    orientation: 'Horizontal',\n    width: 150,\n    height: 150,\n  },\n};\n\nconst Template = ({ orientation, width, height }) =>\n  formatHtmlPreview(`\n  <div style=\"${orientation === 'Horizontal' ? `width: ${width}px;` : `height: ${height}px;`}\">\n    <sdds-divider orientation=\"${orientation.toLowerCase()}\"></sdds-divider>\n  </div>\n`);\n\nexport const WebComponent = Template.bind({});\n"]}

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

@@ -1 +0,0 @@
-{"version":3,"file":"divider.js","sourceRoot":"","sources":["../../../src/components/divider/divider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,OAAO;;uBAE+B,YAAY;;EAE7D,MAAM;IACJ,OAAO,CACL,EAAC,IAAI,IACH,IAAI,EAAC,WAAW,sBACE,IAAI,CAAC,WAAW,KAAK,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS;MAE1E,WAAK,KAAK,EAAE,WAAW,IAAI,CAAC,WAAW,EAAE,GAAI,CACxC,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, Host, h } from '@stencil/core';\n\n@Component({\n  tag: 'sdds-divider',\n  styleUrl: 'divider-component.scss',\n  shadow: true,\n})\nexport class Divider {\n  /** Orientation of the Divider, horizontal if not specified. */\n  @Prop() orientation: 'horizontal' | 'vertical' = 'horizontal';\n\n  render() {\n    return (\n      <Host\n        role=\"separator\"\n        aria-orientation={this.orientation === 'vertical' ? 'vertical' : undefined}\n      >\n        <div class={`divider ${this.orientation}`} />\n      </Host>\n    );\n  }\n}\n"]}