npm - dap-design-system - Versions diffs - 0.60.2 → 0.61.0 - Mend

dap-design-system 0.60.2 → 0.61.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1943) hide show

package/dist/components/timepicker/timepicker.js ADDED Viewed

@@ -0,0 +1,6 @@
+import e from "./timepicker.component.js";
+e.define();
+export {
+  e as default
+};
+//# sourceMappingURL=timepicker.js.map

package/dist/components/timepicker/timepicker.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"timepicker.js","sources":["../../../src/components/timepicker/timepicker.ts"],"sourcesContent":["import DapDSTimePicker from './timepicker.component'\n\nexport * from './timepicker.component'\nexport default DapDSTimePicker\n\nDapDSTimePicker.define()\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'dap-ds-timepicker': DapDSTimePicker\n }\n}\n"],"names":["DapDSTimePicker"],"mappings":";AAKAA,EAAgB,OAAO;"}

package/dist/components/timepicker/timepicker.scss.js ADDED Viewed

@@ -0,0 +1,5 @@
+const d = '*,*:before,*:after{box-sizing:border-box;outline:none}* :not(dap-ds-table-cell,dap-ds-table-header){margin:0;padding:0}html:focus-within{scroll-behavior:smooth}a:not([class]){text-decoration-skip-ink:auto}img,picture,svg,video,canvas{max-width:100%;height:auto;background-repeat:no-repeat;background-size:cover;font-style:italic;vertical-align:middle}input,button,textarea,select{font:inherit}[hidden]{display:none!important}@media (prefers-reduced-motion: reduce){html:focus-within{scroll-behavior:auto}*,*:before,*:after{transition:none;transition-duration:.01ms!important;transition-delay:1ms!important;animation-duration:1ms!important;animation-delay:-1ms!important;animation-iteration-count:1!important;background-attachment:initial!important;scroll-behavior:auto!important}}body,html{height:100%;scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}input[type=number]{appearance:textfield}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{appearance:none}.input-description{display:block;margin-bottom:var(--dds-spacing-200)}@keyframes dds-spin{to{transform:rotate(360deg)}}@keyframes dds-fade{0%,to{opacity:.3}50%{opacity:1}}:root{--dds-form-label-font-weight: var(--dds-font-weight-bold);--dds-form-label-line-height: var(--dds-font-line-height-xlarge);--dds-form-label-color: var(--dds-text-neutral-base);--dds-form-label-disabled-color: var(--dds-text-neutral-disabled);--dds-form-label-required-color: var(--dds-text-negative-subtle);--dds-form-label-optional-color: var(--dds-text-neutral-subtle);--dds-form-label-margin-bottom: var(--dds-spacing-200)}dap-ds-form-label .dds-label{display:block;margin-bottom:var(--dds-form-label-margin-bottom);color:var(--dds-form-label-color);font-weight:var(--dds-form-label-font-weight);line-height:var(--dds-form-label-line-height)}dap-ds-form-label .dds-label--no-margin{margin-bottom:0}dap-ds-form-label .dds-label--hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);border-width:0;white-space:nowrap}dap-ds-form-label .dds-label--disabled{color:var(--dds-form-label-disabled-color)}dap-ds-form-label .dds-label--xs{font-size:var(--dds-font-sm)}dap-ds-form-label .dds-label--sm{font-size:var(--dds-font-base)}dap-ds-form-label .dds-label--lg{font-size:var(--dds-font-lg)}dap-ds-form-label .dds-label--subtle{font-weight:var(--dds-font-weight-medium)}dap-ds-form-label .dds-label .dds-label__required-indicator{order:2;color:var(--dds-form-label-required-color);font-weight:var(--dds-font-weight-bold);line-height:var(--dds-form-label-line-height)}dap-ds-form-label .dds-label .dds-label__optional-indicator{order:3;color:var(--dds-form-label-optional-color);font-weight:var(--dds-font-weight-medium);line-height:var(--dds-form-label-line-height)}dap-ds-form-label .dds-label .dds-label__optional-indicator--xs{font-size:var(--dds-font-sm)}dap-ds-form-label .dds-label .dds-label__optional-indicator--lg{font-size:var(--dds-font-lg)}.label-container{display:flex;align-items:center;justify-content:space-between}.label--has-description{margin-bottom:var(--dds-spacing-200)}dap-ds-form-label+dap-ds-typography{display:block}.info-button{fill:var(--dds-button-subtle-icon-neutral-enabled);color:var(--dds-button-subtle-icon-neutral-enabled)}:root{--font-family: "Inter", sans-serif}:host{--dds-text-color: var(--dds-text-neutral-base);--dds-text-color-inverted: var(--dds-text-neutral-on-inverted);--dds-text-heading-color: var(--dds-text-neutral-strong);--dds-text-heading-color-inverted: var(--dds-text-neutral-on-inverted);--dds-text-description-color: var(--dds-text-neutral-subtle);--dds-text-description-color-inverted: var(--dds-text-neutral-on-inverted);--dds-text-font-family: var(--font-family);--dds-text-font-weight-medium: var(--dds-font-weight-medium);--dds-text-font-weight-bold: var(--dds-font-weight-bold);--dds-text-font-size-h1: var(--dds-font-7xl);--dds-text-font-size-h2: var(--dds-font-4xl);--dds-text-font-size-h3: var(--dds-font-2xl);--dds-text-font-size-h4: var(--dds-font-xl);--dds-text-font-size-h5: var(--dds-font-lg);--dds-text-font-size-h6: var(--dds-font-base);--dds-text-font-size-body: var(--dds-font-base);--dds-text-font-size-caption: var(--dds-font-xs);--dds-text-font-size-description: var(--dds-font-base);--dds-text-font-size-description-lg: var(--dds-font-base);--dds-text-font-size-description-sm: var(--dds-font-sm);--dds-text-font-size-lg: var(--dds-font-lg);--dds-text-font-size-md: var(--dds-font-base);--dds-text-font-size-sm: var(--dds-font-sm);--dds-text-font-size-xs: var(--dds-font-xs)}:host([variant=h1]),:host([variant=h2]),:host([variant=h3]),:host([variant=h4]),:host([variant=h5]),:host([variant=h6]){color:var(--dds-text-heading-color)}:host([inverted]) :host([variant=h1]),:host([inverted]) :host([variant=h2]),:host([inverted]) :host([variant=h3]),:host([inverted]) :host([variant=h4]),:host([inverted]) :host([variant=h5]),:host([inverted]) :host([variant=h6]){color:var(--dds-text-heading-color-inverted)}:host([variant=description]){color:var(--dds-text-description-color)}:host([inverted]) :host([variant=description]){color:var(--dds-text-description-color-inverted)}:host([variant=body]){color:var(--dds-text-color)}:host([inverted]) :host([variant=body]){color:var(--dds-text-color-inverted)}:host([variant=caption]){color:var(--dds-text-description-color)}:host([inverted]) :host([variant=caption]){color:var(--dds-text-description-color-inverted)}.typography{margin:0;font-family:var(--dds-text-font-family);font-weight:var(--dds-text-font-weight-medium);letter-spacing:0}.heading{font-weight:var(--dds-text-font-weight-bold);line-height:var(--dds-font-line-height-large)}.typography-h1{font-size:var(--dds-text-font-size-h1);letter-spacing:-.72px}@media (width >= 768px){.typography-h1{font-size:var(--dds-text-font-size-h1);letter-spacing:-.8px;line-height:var(--dds-font-line-height-xlarge)}}.typography-h2{font-size:var(--dds-text-font-size-h2);letter-spacing:-.56px}.typography-h3{font-size:var(--dds-text-font-size-h3);letter-spacing:-.48px}.typography-h4{font-size:var(--dds-text-font-size-h4);letter-spacing:-.4px}.typography-h5{font-size:var(--dds-text-font-size-h5)}.typography-h6{font-size:var(--dds-text-font-size-h6)}.typography-body{font-size:var(--dds-text-font-size-body);line-height:var(--dds-font-line-height-xlarge)}.typography-caption{font-size:var(--dds-text-font-size-caption);line-height:var(--dds-font-line-height-xlarge)}.typography-description{font-size:var(--dds-text-font-size-description);line-height:var(--dds-font-line-height-xlarge)}.typography-description-lg{font-size:var(--dds-text-font-size-description-lg);line-height:var(--dds-font-line-height-xlarge)}.typography-description-sm{font-size:var(--dds-text-font-size-description-sm);line-height:var(--dds-font-line-height-xlarge)}.typography-size-lg{font-size:var(--dds-text-font-size-lg);letter-spacing:0;line-height:var(--dds-font-line-height-xlarge)}.typography-size-md{font-size:var(--dds-text-font-size-md);letter-spacing:0;line-height:var(--dds-font-line-height-xlarge)}.typography-size-sm{font-size:var(--dds-text-font-size-sm);letter-spacing:0;line-height:var(--dds-font-line-height-xlarge)}.typography-size-xs{font-size:var(--dds-text-font-size-xs);letter-spacing:0;line-height:var(--dds-font-line-height-xlarge)}.typography-inverted{color:var(--dds-text-color-inverted)}.typography-heading-inverted{color:var(--dds-text-heading-color-inverted)}.typography-description-inverted{color:var(--dds-text-description-color-inverted)}:host{--dds-combobox-background: var(--dds-fields-background-default);--dds-combobox-border-color: var(--dds-border-neutral-base);--dds-combobox-border-width: var(--dds-border-width-base, 1px);--dds-combobox-border-radius: var(--dds-radius-base);--dds-combobox-text-color: var(--dds-text-neutral-base);--dds-combobox-placeholder-color: var(--dds-text-neutral-subtle);--dds-combobox-disabled-background: var(--dds-background-neutral-stronger);--dds-combobox-disabled-text: var(--dds-text-neutral-disabled);--dds-combobox-error-border: var(--dds-border-negative-base);--dds-combobox-success-border: var(--dds-border-positive-base);--dds-combobox-icon-color: var(--dds-text-icon-neutral-base);--dds-combobox-clear-icon-color: var( --dds-button-subtle-icon-neutral-enabled );--dds-combobox-popup-background: var(--dds-background-neutral-subtle);--dds-combobox-popup-shadow: 0 4px 6px -1px rgb(0 0 0 / 8%), 0 2px 4px -1px rgb(0 0 0 / 6%);--dds-combobox-loading-spinner-color: var(--dds-icon-neutral-base);--dds-combobox-padding-xs: var(--dds-spacing-200);--dds-combobox-padding-sm: var(--dds-spacing-200);--dds-combobox-padding-lg: var(--dds-spacing-300);--dds-combobox-padding-horizontal: var(--dds-spacing-300);--dds-combobox-padding-vertical: var(--dds-spacing-200);--dds-combobox-gap: var(--dds-spacing-100);--dds-combobox-icon-gap: var(--dds-spacing-200);--dds-combobox-action-gap: var(--dds-spacing-200);--dds-combobox-action-padding: var(--dds-spacing-300);--dds-combobox-clear-icon-width: var(--dds-spacing-800);--dds-combobox-dropdown-icon-right: var(--dds-spacing-600);--dds-combobox-min-width: 7.5rem;--dds-combobox-icon-opened-transform: rotate(180deg);--dds-combobox-chips-gap: var(--dds-spacing-100);--dds-combobox-chips-padding: var(--dds-spacing-100);--dds-combobox-chips-max-height: 120px;--dds-input-height-xs: var(--dds-spacing-800);--dds-input-height-sm: var(--dds-spacing-1000);--dds-input-height-lg: var(--dds-spacing-1200);--dds-input-padding-xs: 0 var(--dds-spacing-200);--dds-input-padding-sm: 0 var(--dds-spacing-300);--dds-input-padding-lg: 0 var(--dds-spacing-400);--dds-input-font-size-xs: var(--dds-font-sm);--dds-input-font-size-sm: var(--dds-font-base);--dds-input-font-size-lg: var(--dds-font-lg);--dds-input-border: var(--dds-border-width-base) solid var(--dds-border-neutral-base);--dds-input-background: var(--dds-fields-background-default);--dds-input-text-color: var(--dds-text-neutral-base);--dds-input-border-radius: var(--dds-radius-base);--dds-input-disabled-border: 0 solid var(--dds-border-neutral-disabled);--dds-input-disabled-background: var(--dds-fields-background-disabled);--dds-input-disabled-text: var(--dds-text-neutral-disabled);--dds-input-readonly-border: 0 solid var(--dds-border-neutral-subtle);--dds-input-readonly-background: var(--dds-fields-background-read-only);--dds-input-readonly-text: var(--dds-text-neutral-subtle);--dds-input-success-border: var(--dds-border-width-base) solid var(--dds-border-positive-base);--dds-input-error-border: var(--dds-border-width-base) solid var(--dds-border-negative-base);--dds-input-addon-background: var(--dds-fields-background-default);--dds-input-addon-success-background: var(--dds-fields-background-default);--dds-input-addon-error-background: var(--dds-fields-background-default);--dds-input-addon-border-before: var(--dds-border-width-base) solid var(--dds-border-neutral-base);--dds-input-addon-border-after: var(--dds-border-width-base) solid var(--dds-border-neutral-base);--dds-input-addon-border-width-before: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base);--dds-input-addon-border-width-after: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0;--dds-input-addon-success-border: var(--dds-border-width-base) solid var(--dds-border-positive-base);--dds-input-addon-success-border-before: var(--dds-border-width-base) solid var(--dds-border-positive-base);--dds-input-addon-success-border-after: var(--dds-border-width-base) solid var(--dds-border-positive-base);--dds-input-addon-success-border-width-before: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base);--dds-input-addon-success-border-width-after: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0;--dds-input-addon-error-border-before: var(--dds-border-width-base) solid var(--dds-border-negative-base);--dds-input-addon-error-border-after: var(--dds-border-width-base) solid var(--dds-border-negative-base);--dds-input-addon-error-border-width-before: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base);--dds-input-addon-error-border-width-after: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0;--dds-form-label-font-weight: var(--dds-font-weight-bold);--dds-form-label-line-height: var(--dds-font-line-height-xlarge);--dds-form-label-color: var(--dds-text-neutral-base);--dds-form-label-disabled-color: var(--dds-text-neutral-disabled);--dds-form-label-required-color: var(--dds-text-negative-subtle);--dds-form-label-optional-color: var(--dds-text-neutral-subtle);--dds-form-label-margin-bottom: var(--dds-spacing-200)}.select{outline-color:var(--dds-focus-outer-ring);outline-offset:var(--dds-spacing-50);outline-width:var(--dds-border-width-large);transition-property:all;transition-duration:var(--dds-transition-fast);transition-timing-function:var(--dds-easing-ease-in-out);display:flex;flex-direction:row;align-items:center;width:100%;min-width:var(--dds-combobox-min-width);column-gap:var(--dds-combobox-gap);border:var(--dds-combobox-border-width) solid var(--dds-combobox-border-color);border-radius:var(--dds-combobox-border-radius);background-color:var(--dds-combobox-background)}.select:focus-within{outline-style:solid}.select:active{border-color:var(--dds-border-brand-medium)}.select--disabled{border-color:var(--dds-combobox-disabled-background);background-color:var(--dds-combobox-disabled-background);color:var(--dds-combobox-disabled-text);cursor:not-allowed}.select--readonly{border:var(--dds-input-readonly-border);background:var(--dds-input-readonly-background);color:var(--dds-input-readonly-text)}.select--error{border-color:var(--dds-combobox-error-border)}.select--success{border-color:var(--dds-combobox-success-border)}.select--xs{height:var(--dds-spacing-800)}.select--sm{height:var(--dds-spacing-1000)}.select--lg{height:var(--dds-spacing-1200)}.select--lg .icon{position:absolute;right:var(--dds-combobox-dropdown-icon-right);color:var(--dds-text-icon-neutral-subtle);pointer-events:none}.select--multiselect{flex-wrap:wrap;align-items:flex-start;height:auto;min-height:var(--dds-spacing-1000);padding:var(--dds-spacing-100)}.select--multiselect.select--xs{min-height:var(--dds-spacing-800)}.select--multiselect.select--lg{min-height:var(--dds-spacing-1200)}.select--opened:not(.select--no-animation) .indicator-icon{transform:var(--dds-combobox-icon-opened-transform)}.select .indicator-icon{outline-color:var(--dds-focus-outer-ring);outline-offset:var(--dds-spacing-50);outline-width:var(--dds-border-width-large);transition-property:all;transition-duration:var(--dds-transition-fast);transition-timing-function:var(--dds-easing-ease-in-out);display:flex;align-items:center;color:var(--dds-combobox-icon-color)}.select .indicator-icon--loading{animation:dds-spin 1s linear infinite;fill:var(--dds-combobox-loading-spinner-color);color:var(--dds-combobox-loading-spinner-color)}.select .clear-icon{outline-color:var(--dds-focus-outer-ring);outline-offset:var(--dds-spacing-50);outline-width:var(--dds-border-width-large);transition-property:all;transition-duration:var(--dds-transition-fast);transition-timing-function:var(--dds-easing-ease-in-out);display:flex;visibility:visible;align-items:center;justify-content:center;min-width:var(--dds-combobox-clear-icon-width);cursor:pointer}.select:has(input:placeholder-shown) .clear-icon{visibility:hidden}.select .clear-icon--hidden{visibility:hidden}.select .clear-icon dap-ds-icon-button::part(icon-base){fill:var(--dds-button-subtle-icon-neutral-enabled);color:var(--dds-button-subtle-icon-neutral-enabled)}.combobox__chips{display:flex;flex-wrap:wrap;align-items:center;max-height:var(--dds-combobox-chips-max-height);overflow:hidden auto;gap:var(--dds-combobox-chips-gap)}.input{width:100%;border-width:0;border-radius:var(--dds-combobox-border-radius);background-color:transparent;color:var(--dds-combobox-text-color);line-height:1;text-overflow:ellipsis}.input::placeholder{color:var(--dds-combobox-placeholder-color)}.input--xs{padding:var(--dds-combobox-padding-xs);font-size:var(--dds-font-sm)}.input--sm{padding:var(--dds-combobox-padding-sm)}.input--lg{padding:var(--dds-combobox-padding-lg);font-size:var(--dds-font-lg)}.input--disabled{cursor:not-allowed}.input::-webkit-search-cancel-button{display:none}.input--readonly{border:var(--dds-input-readonly-border);background:var(--dds-input-readonly-background);color:var(--dds-input-readonly-text)}.input--multiselect{flex:1;min-width:120px;padding:var(--dds-spacing-100)}.select-action{display:inline-flex;flex-direction:row;align-items:center;justify-content:flex-end;gap:var(--dds-combobox-action-gap);padding:0 var(--dds-combobox-action-padding);color:var(--dds-combobox-icon-color)}.select-action--disabled{color:var(--dds-icon-neutral-disabled);cursor:not-allowed;pointer-events:none}.select-action--xs{min-width:90px}.select-action--sm{min-width:94px}.select-action--lg{min-width:98px}.select-action--multiselect{align-self:center}.select-popup::part(popup){background-color:var(--dds-combobox-popup-background);box-shadow:var(--dds-combobox-popup-shadow)}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);border-width:0;white-space:nowrap}:host{--dds-timepicker-background: var(--dds-fields-background-default);--dds-timepicker-border-color: var(--dds-border-neutral-base);--dds-timepicker-border-width: var(--dds-border-width-base, 1px);--dds-timepicker-border-radius: var(--dds-radius-base);--dds-timepicker-text-color: var(--dds-text-neutral-base);--dds-timepicker-placeholder-color: var(--dds-text-neutral-subtle);--dds-timepicker-disabled-background: var(--dds-background-neutral-stronger);--dds-timepicker-disabled-text: var(--dds-text-neutral-disabled);--dds-timepicker-error-border: var(--dds-border-negative-base);--dds-timepicker-success-border: var(--dds-border-positive-base);--dds-timepicker-icon-color: var(--dds-text-icon-neutral-subtle);--dds-timepicker-clear-icon-color: var( --dds-button-subtle-icon-neutral-enabled );--dds-timepicker-popup-background: var(--dds-background-neutral-subtle);--dds-timepicker-popup-shadow: 0 4px 6px -1px rgb(0 0 0 / 8%), 0 2px 4px -1px rgb(0 0 0 / 6%);--dds-timepicker-padding-xs: var(--dds-spacing-200);--dds-timepicker-padding-sm: var(--dds-spacing-200);--dds-timepicker-padding-lg: var(--dds-spacing-300);--dds-timepicker-padding-horizontal: var(--dds-spacing-300);--dds-timepicker-padding-vertical: var(--dds-spacing-200);--dds-timepicker-gap: var(--dds-spacing-100);--dds-timepicker-icon-gap: var(--dds-spacing-200);--dds-timepicker-action-gap: var(--dds-spacing-200);--dds-timepicker-action-padding: var(--dds-spacing-300);--dds-timepicker-clear-icon-width: var(--dds-spacing-800);--dds-timepicker-dropdown-icon-right: var(--dds-spacing-600);--dds-timepicker-min-width: 7.5rem;--dds-combobox-background: var(--dds-timepicker-background);--dds-combobox-border-color: var(--dds-timepicker-border-color);--dds-combobox-border-width: var(--dds-timepicker-border-width);--dds-combobox-border-radius: var(--dds-timepicker-border-radius);--dds-combobox-text-color: var(--dds-timepicker-text-color);--dds-combobox-placeholder-color: var(--dds-timepicker-placeholder-color);--dds-combobox-disabled-background: var(--dds-timepicker-disabled-background);--dds-combobox-disabled-text: var(--dds-timepicker-disabled-text);--dds-combobox-error-border: var(--dds-timepicker-error-border);--dds-combobox-success-border: var(--dds-timepicker-success-border);--dds-combobox-icon-color: var(--dds-timepicker-icon-color);--dds-combobox-clear-icon-color: var(--dds-timepicker-clear-icon-color);--dds-combobox-popup-background: var(--dds-timepicker-popup-background);--dds-combobox-popup-shadow: var(--dds-timepicker-popup-shadow);--dds-combobox-padding-xs: var(--dds-timepicker-padding-xs);--dds-combobox-padding-sm: var(--dds-timepicker-padding-sm);--dds-combobox-padding-lg: var(--dds-timepicker-padding-lg);--dds-combobox-padding-horizontal: var(--dds-timepicker-padding-horizontal);--dds-combobox-padding-vertical: var(--dds-timepicker-padding-vertical);--dds-combobox-gap: var(--dds-timepicker-gap);--dds-combobox-icon-gap: var(--dds-timepicker-icon-gap);--dds-combobox-action-gap: var(--dds-timepicker-action-gap);--dds-combobox-action-padding: var(--dds-timepicker-action-padding);--dds-combobox-clear-icon-width: var(--dds-timepicker-clear-icon-width);--dds-combobox-dropdown-icon-right: var(--dds-timepicker-dropdown-icon-right);--dds-combobox-min-width: var(--dds-timepicker-min-width)}.time-icon{display:flex;align-items:center;justify-content:center;width:100%;height:100%;cursor:pointer}';
+export {
+  d as default
+};
+//# sourceMappingURL=timepicker.scss.js.map

package/dist/components/timepicker/timepicker.scss.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"timepicker.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/toc/toc.component.d.ts CHANGED Viewed

@@ -41,6 +41,7 @@ declare const DapDSTOC_base: typeof DdsElement & {
  * @cssproperty --dds-toc-indent-level-5 - Indent level of the TOC items. (default: var(--dds-spacing-2400))
  */
 export default class DapDSTOC extends DapDSTOC_base {
+    static tagName: string;
     /** The root element to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#root) */
     root: string;
     /** The margin around the root element to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#rootmargin) */

package/dist/components/toc/toc.component.js ADDED Viewed

@@ -0,0 +1,232 @@
+var $ = Object.defineProperty, L = Object.defineProperties;
+var H = Object.getOwnPropertyDescriptors;
+var b = Object.getOwnPropertySymbols, C = Object.getPrototypeOf, R = Object.prototype.hasOwnProperty, M = Object.prototype.propertyIsEnumerable, T = Reflect.get;
+var _ = (n, e, t) => e in n ? $(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, w = (n, e) => {
+  for (var t in e || (e = {}))
+    R.call(e, t) && _(n, t, e[t]);
+  if (b)
+    for (var t of b(e))
+      M.call(e, t) && _(n, t, e[t]);
+  return n;
+}, A = (n, e) => L(n, H(e));
+var f = (n, e, t) => T(C(n), t, e);
+var u = (n, e, t) => new Promise((s, i) => {
+  var r = (h) => {
+    try {
+      o(t.next(h));
+    } catch (l) {
+      i(l);
+    }
+  }, a = (h) => {
+    try {
+      o(t.throw(h));
+    } catch (l) {
+      i(l);
+    }
+  }, o = (h) => h.done ? s(h.value) : Promise.resolve(h.value).then(r, a);
+  o((t = t.apply(n, e)).next());
+});
+import { clsx as I } from "../../node_modules/clsx/dist/clsx.js";
+import "../../node_modules/@lit/reactive-element/reactive-element.js";
+import "../../node_modules/lit-html/lit-html.js";
+import "../../node_modules/lit-element/lit-element.js";
+import { property as d } from "../../node_modules/@lit/reactive-element/decorators/property.js";
+import { anchorClass as y } from "../../common/const.js";
+import { DdsElement as k } from "../../internal/dds-hu-element.js";
+import { SizedMixin as E } from "../../internal/mixin/sizedMixin.js";
+import "../../localization/localization.js";
+import S from "./toc.scss.js";
+import { t as x } from "../../node_modules/i18next/dist/esm/i18next.js";
+import { unsafeCSS as j } from "../../node_modules/@lit/reactive-element/css-tag.js";
+var N = Object.defineProperty, p = (n, e, t, s) => {
+  for (var i = void 0, r = n.length - 1, a; r >= 0; r--)
+    (a = n[r]) && (i = a(e, t, i) || i);
+  return i && N(e, t, i), i;
+};
+const m = class m extends E(k) {
+  constructor() {
+    super(), this.root = "", this.rootMargin = "0px 0px -80% 0px", this.lastAnchorRootMargin = "0px 0px -50% 0px", this.threshold = [0, 0.1, 0.25, 0.5, 0.75, 1], this.minHeadingLevel = 2, this.maxHeadingLevel = 3, this.noIndent = !1, this._selectors = [], this._intersectionData = /* @__PURE__ */ new Map(), this._debounceTimer = null, this.onScroll = () => {
+      if (this._anchors && this._anchors.length > 0 && Math.round(window.scrollY + window.innerHeight) === document.body.scrollHeight) {
+        const e = this._anchors[this._anchors.length - 1], t = this.shadowRoot.querySelector(`[href="#${e.id}"`);
+        t && this.setActiveAnchor(t, t);
+      }
+    }, this.getHeaders = () => u(this, null, function* () {
+      const e = [];
+      return yield this._anchors.forEach((t, s) => u(this, null, function* () {
+        var o, h, l;
+        yield t.updateComplete;
+        const i = t.getAttribute("data-text") || ((o = t.innerText) == null ? void 0 : o.trim()) || ((h = t.textContent) == null ? void 0 : h.trim()) || "", r = t.id || ((l = t.innerText) == null ? void 0 : l.toLowerCase().split(" ").join("-")) || i.toLowerCase().split(" ").join("-");
+        if (!t.id && r) {
+          let v = 0;
+          for (this._anchors.some((g) => g.id === r) && v++; this._anchors.some((g) => g.id === `${r}-${v}`); )
+            v++;
+          v === 0 ? t.setAttribute("id", r) : t.setAttribute("id", `${r}-${v}`);
+        }
+        let a = this._selectors.indexOf(
+          `${t.tagName.toLowerCase()}.${y}`
+        );
+        a === -1 && (a = this._selectors.indexOf(
+          `dap-ds-typography[variant=${t.getAttribute("variant")}][anchor]`
+        )), e[s] = {
+          id: r,
+          text: i,
+          level: Math.floor(a / 2)
+        };
+      })), e;
+    }), this._handleIntersect = (e) => {
+      e.forEach((t) => {
+        this._intersectionData.set(t.target, {
+          isIntersecting: t.isIntersecting,
+          intersectionRatio: t.intersectionRatio,
+          boundingRect: t.boundingClientRect
+        });
+      }), this._debounceTimer && clearTimeout(this._debounceTimer), this._debounceTimer = window.setTimeout(() => {
+        this._updateActiveAnchor();
+      }, 50);
+    }, this._updateActiveAnchor = () => {
+      const e = window.innerHeight / 2;
+      let t = null, s = -1 / 0;
+      if (this._intersectionData.forEach((i, r) => {
+        if (!i.isIntersecting) return;
+        const a = Math.abs(
+          i.boundingRect.top + i.boundingRect.height / 2 - e
+        ), h = i.intersectionRatio - a / window.innerHeight * 0.5;
+        h > s && (s = h, t = r);
+      }), t && t.id) {
+        const i = this.shadowRoot.querySelector(
+          `[href="#${t.id}"`
+        );
+        i && i !== this._activeAnchor && this.setActiveAnchor(
+          i,
+          t
+        );
+      }
+    }, this.threshold = [0.1], this.size = "lg";
+  }
+  get activeAnchor() {
+    return this._activeAnchor;
+  }
+  get anchors() {
+    return this._anchors;
+  }
+  get items() {
+    return this._items;
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    const e = {
+      root: this.root ? document.querySelector(this.root) : null,
+      rootMargin: this.rootMargin,
+      threshold: this.threshold
+    };
+    this._observer = new IntersectionObserver(this._handleIntersect, e), this._lastAnchorObserver = new IntersectionObserver(this._handleIntersect, A(w({}, e), {
+      rootMargin: this.lastAnchorRootMargin
+    })), window.addEventListener("scroll", this.onScroll);
+  }
+  firstUpdated(e) {
+    return u(this, null, function* () {
+      f(m.prototype, this, "firstUpdated").call(this, e), yield this.renderTree();
+    });
+  }
+  attributeChangedCallback(e, t, s) {
+    return u(this, null, function* () {
+      f(m.prototype, this, "attributeChangedCallback").call(this, e, t, s), yield this.renderTree();
+    });
+  }
+  updated(e) {
+    return u(this, null, function* () {
+      f(m.prototype, this, "updated").call(this, e), yield this.renderTree();
+    });
+  }
+  disconnectedCallback() {
+    var e, t;
+    super.disconnectedCallback(), this._observer && ((e = this._observer) == null || e.disconnect(), (t = this._lastAnchorObserver) == null || t.disconnect(), window.removeEventListener("scroll", this.onScroll));
+  }
+  renderTree() {
+    return u(this, null, function* () {
+      var i, r;
+      if (this._anchors = this.getAnchors(
+        this.minHeadingLevel ? this.minHeadingLevel : 2,
+        this.maxHeadingLevel ? this.maxHeadingLevel : 3
+      ), this._anchors.length === 0 || !this._anchors)
+        return;
+      this._anchors.forEach((a, o) => {
+        var h, l;
+        o === this._anchors.length - 1 ? (h = this._lastAnchorObserver) == null || h.observe(a) : (l = this._observer) == null || l.observe(a);
+      }), this._items = yield this.getHeaders();
+      const e = this.buildTree(this._items), t = document.createElement("div");
+      t.setAttribute("part", "base"), t.classList.add("toc");
+      const s = `
+        <span class="toc-title toc-title--${this.effectiveSize}">${(i = this.header) != null ? i : x("tocTitle")}</span>
+        <nav aria-label='${(r = this.header) != null ? r : x("tocTitle")}''>${e}</nav>`;
+      t.innerHTML = s, this.shadowRoot && (this.shadowRoot.removeChild(this.shadowRoot.childNodes[0]), this.shadowRoot.appendChild(t));
+    });
+  }
+  getAnchors(e, t) {
+    this._selectors = [];
+    for (let s = e; s <= t; s += 1)
+      this._selectors.push(`h${s}.${y}`), this._selectors.push(`dap-ds-typography[variant=h${s}][anchor]`);
+    return Array.from(document.querySelectorAll(this._selectors.join()));
+  }
+  setActiveAnchor(e, t) {
+    var s;
+    (s = this._activeAnchor) == null || s.removeAttribute("aria-current"), e.setAttribute("aria-current", "true"), this._activeAnchor = e, this.emit("dds-anchor-change", {
+      selectedItem: e,
+      anchorElement: t
+    });
+  }
+  buildTree(e) {
+    const t = [];
+    let s = [], i = -1;
+    if (e.length === 0)
+      return "";
+    const r = () => {
+      s.length > 0 && (t[t.length - 1] += this.buildTree(s));
+    };
+    e.forEach((o) => {
+      if (i !== -1 && i < o.level) {
+        s.push(o);
+        return;
+      }
+      r(), i = o.level, t.push(
+        `<a href="#${o.id}" class="toc-link toc-link--${this.effectiveSize}">${o.text}<span class="toc-link__high-contrast"></span></a>`
+      ), s = [];
+    }), r();
+    const a = t.map(
+      (o) => `<li class="toc-item ${"toc-item-level-" + i}">${o}</li>`
+    ).join("");
+    return `<ul class="${I({
+      "toc--no-indent": this.noIndent
+    })}">${a}</ul>`;
+  }
+};
+m.tagName = "dap-ds-toc", m.styles = j(S);
+let c = m;
+p([
+  d()
+], c.prototype, "root");
+p([
+  d()
+], c.prototype, "rootMargin");
+p([
+  d()
+], c.prototype, "lastAnchorRootMargin");
+p([
+  d({ type: Array })
+], c.prototype, "threshold");
+p([
+  d({ type: Number })
+], c.prototype, "minHeadingLevel");
+p([
+  d({ type: Number })
+], c.prototype, "maxHeadingLevel");
+p([
+  d({ type: Boolean })
+], c.prototype, "noIndent");
+p([
+  d()
+], c.prototype, "header");
+export {
+  c as default
+};
+//# sourceMappingURL=toc.component.js.map

package/dist/components/toc/toc.component.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"toc.component.js","sources":["../../../src/components/toc/toc.component.ts"],"sourcesContent":["import clsx from 'clsx'\nimport { PropertyValueMap, unsafeCSS } from 'lit'\nimport { property } from 'lit/decorators.js'\n\nimport { anchorClass } from '@/common/const'\nimport { DdsElement } from '@/internal/dds-hu-element'\nimport { SizedMixin } from '@/internal/mixin/sizedMixin'\nimport { t } from '@/localization/localization'\n\nimport styles from './toc.scss?inline'\n\ntype Heading = { level: number; id: any; text: any }\n\n/**\n * `dap-ds-toc`\n * @summary A table of contents (TOC) is a list of links that allows users to quickly navigate to sections within a document.\n * @element dap-ds-toc\n * @title - toc\n *\n * @property { 'xs' | 'sm' | 'md' | 'lg' } size - The size of the TOC. Default is `lg.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\").\n *\n * @event {{ selectedItem: HTMLAnchorElement, anchorElement: IntersectionObserverEntry | HTMLElement }} dds-anchor-change - Event that is triggered when the anchor changes.\n *\n * @csspart base - The main container of the toc.\n *\n * @cssproperty --dds-toc-border-width - Width of the TOC border. (default: var(--dds-border-width-base))\n * @cssproperty --dds-toc-border-color - Color of the TOC border. (default: var(--dds-border-neutral-divider))\n * @cssproperty --dds-toc-title-color - Color of the TOC title. (default: var(--dds-text-neutral-strong))\n * @cssproperty --dds-toc-title-font-size - Font size of the TOC title. (default: var(--dds-font-base))\n * @cssproperty --dds-toc-title-font-weight - Font weight of the TOC title. (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-toc-title-line-height - Line height of the TOC title. (default: 1.25)\n * @cssproperty --dds-toc-link-color - Color of the TOC links. (default: var(--dds-button-subtle-text-neutral-enabled))\n * @cssproperty --dds-toc-link-active-color - Color of the active TOC link. (default: var(--dds-button-subtle-text-enabled))\n * @cssproperty --dds-toc-link-border-color - Border color of the active TOC link. (default: var(--dds-border-brand-base))\n * @cssproperty --dds-toc-link-line-height - Line height of the TOC links. (default: 1.2)\n * @cssproperty --dds-toc-link-padding - Padding of the TOC links. (default: var(--dds-spacing-200))\n * @cssproperty --dds-toc-indent-level-0 - Indent level of the TOC items. (default: var(--dds-spacing-400))\n * @cssproperty --dds-toc-indent-level-1 - Indent level of the TOC items. (default: var(--dds-spacing-800))\n * @cssproperty --dds-toc-indent-level-2 - Indent level of the TOC items. (default: var(--dds-spacing-1200))\n * @cssproperty --dds-toc-indent-level-3 - Indent level of the TOC items. (default: var(--dds-spacing-1600))\n * @cssproperty --dds-toc-indent-level-4 - Indent level of the TOC items. (default: var(--dds-spacing-2000))\n * @cssproperty --dds-toc-indent-level-5 - Indent level of the TOC items. (default: var(--dds-spacing-2400))\n */\nexport default class DapDSTOC extends SizedMixin(DdsElement) {\n static tagName = 'dap-ds-toc'\n\n /** The root element to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#root) */\n @property() root: string = ''\n\n /** The margin around the root element to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#rootmargin) */\n @property() rootMargin: string = '0px 0px -80% 0px'\n\n /** The margin around the last anchor to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#rootmargin) */\n @property() lastAnchorRootMargin: string = '0px 0px -50% 0px'\n /** The threshold to trigger [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#threshold) */\n @property({ type: Array }) threshold: number[] = [0, 0.1, 0.25, 0.5, 0.75, 1]\n\n /** The minimum heading level to include in the TOC. The default value is `2`. */\n @property({ type: Number }) minHeadingLevel: number = 2\n\n /** The maximum heading level to include in the TOC. The default value is `3`. */\n @property({ type: Number }) maxHeadingLevel: number = 3\n\n /** Whether to indent the TOC items. */\n @property({ type: Boolean }) noIndent: boolean = false\n\n /** The header of the TOC. */\n @property() header: string\n\n private _observer: IntersectionObserver\n private _lastAnchorObserver: IntersectionObserver\n private _anchors: HTMLElement[]\n private _activeAnchor: HTMLAnchorElement\n private _selectors: string[] = []\n private _items: Heading[]\n private _intersectionData: Map<\n HTMLElement,\n {\n isIntersecting: boolean\n intersectionRatio: number\n boundingRect: DOMRect\n }\n > = new Map()\n private _debounceTimer: number | null = null\n\n static readonly styles = unsafeCSS(styles)\n\n constructor() {\n super()\n // Use multiple thresholds for more precise intersection detection\n this.threshold = [0.1]\n this.size = 'lg'\n }\n\n get activeAnchor() {\n return this._activeAnchor\n }\n\n get anchors() {\n return this._anchors\n }\n\n get items() {\n return this._items\n }\n\n connectedCallback() {\n super.connectedCallback()\n\n const options = {\n root: this.root ? document.querySelector(this.root) : null,\n rootMargin: this.rootMargin,\n threshold: this.threshold,\n }\n\n this._observer = new IntersectionObserver(this._handleIntersect, options)\n\n this._lastAnchorObserver = new IntersectionObserver(this._handleIntersect, {\n ...options,\n rootMargin: this.lastAnchorRootMargin,\n })\n\n window.addEventListener('scroll', this.onScroll)\n }\n\n protected async firstUpdated(\n _changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>,\n ): Promise<void> {\n super.firstUpdated(_changedProperties)\n await this.renderTree()\n }\n\n async attributeChangedCallback(name: string, oldValue: any, newValue: any) {\n super.attributeChangedCallback(name, oldValue, newValue)\n await this.renderTree()\n }\n\n async updated(changedProperties: Map<PropertyKey, unknown>) {\n super.updated(changedProperties)\n await this.renderTree()\n }\n\n disconnectedCallback() {\n super.disconnectedCallback()\n if (this._observer) {\n this._observer?.disconnect()\n this._lastAnchorObserver?.disconnect()\n window.removeEventListener('scroll', this.onScroll)\n }\n }\n\n private readonly onScroll = () => {\n if (\n this._anchors &&\n this._anchors.length > 0 &&\n Math.round(window.scrollY + window.innerHeight) ===\n document.body.scrollHeight\n ) {\n const entry = this._anchors[this._anchors.length - 1]\n const link = this.shadowRoot!.querySelector(`[href=\"#${entry.id}\"`)\n if (link) {\n this.setActiveAnchor(link as HTMLAnchorElement, link as HTMLElement)\n }\n }\n }\n\n async renderTree() {\n this._anchors = this.getAnchors(\n !this.minHeadingLevel ? 2 : this.minHeadingLevel,\n !this.maxHeadingLevel ? 3 : this.maxHeadingLevel,\n )\n\n if (this._anchors.length === 0 || !this._anchors) {\n return\n }\n\n this._anchors.forEach((anchor, index) => {\n if (index === this._anchors.length - 1)\n this._lastAnchorObserver?.observe(anchor)\n else {\n this._observer?.observe(anchor)\n }\n })\n\n this._items = await this.getHeaders()\n const tree = this.buildTree(this._items)\n\n const baseElement = document.createElement('div')\n baseElement.setAttribute('part', 'base')\n baseElement.classList.add('toc')\n\n const base = `\n <span class=\"toc-title toc-title--${this.effectiveSize}\">${this.header ?? t('tocTitle')}</span>\n <nav aria-label='${this.header ?? t('tocTitle')}''>${tree}</nav>`\n\n baseElement.innerHTML = base\n\n if (!this.shadowRoot) return\n\n this.shadowRoot.removeChild(this.shadowRoot.childNodes[0])\n this.shadowRoot.appendChild(baseElement)\n }\n\n getAnchors(minHeadingLevel: number, maxHeadingLevel: number): HTMLElement[] {\n this._selectors = []\n for (let i = minHeadingLevel; i <= maxHeadingLevel; i += 1) {\n this._selectors.push(`h${i}.${anchorClass}`)\n this._selectors.push(`dap-ds-typography[variant=h${i}][anchor]`)\n }\n\n return Array.from(document.querySelectorAll(this._selectors.join()))\n }\n\n setActiveAnchor(\n element: HTMLAnchorElement,\n entry: IntersectionObserverEntry | HTMLElement,\n ) {\n this._activeAnchor?.removeAttribute('aria-current')\n element.setAttribute('aria-current', 'true')\n this._activeAnchor = element\n\n this.emit('dds-anchor-change', {\n selectedItem: element,\n anchorElement: entry,\n })\n }\n\n private readonly getHeaders = async () => {\n const headers: Heading[] = []\n\n await this._anchors.forEach(async (el, index) => {\n await (el as any).updateComplete\n\n const textContent =\n el.getAttribute('data-text') ||\n el.innerText?.trim() ||\n el.textContent?.trim() ||\n ''\n const id =\n el.id ||\n el.innerText?.toLowerCase().split(' ').join('-') ||\n textContent.toLowerCase().split(' ').join('-')\n\n if (!el.id && id) {\n let count = 0\n\n if (this._anchors.some(anchor => anchor.id === id)) {\n count++\n }\n\n while (this._anchors.some(anchor => anchor.id === `${id}-${count}`)) {\n count++\n }\n\n if (count === 0) {\n el.setAttribute('id', id)\n } else {\n el.setAttribute('id', `${id}-${count}`)\n }\n }\n\n let level = this._selectors.indexOf(\n `${el.tagName.toLowerCase()}.${anchorClass}`,\n )\n\n if (level === -1) {\n level = this._selectors.indexOf(\n `dap-ds-typography[variant=${el.getAttribute('variant')}][anchor]`,\n )\n }\n\n headers[index] = {\n id,\n text: textContent,\n level: Math.floor(level / 2),\n }\n })\n\n return headers\n }\n\n buildTree(headers: any[]) {\n const list: string[] = []\n let nextLevelHeaders: any[] = []\n let lastLevel = -1\n\n if (headers.length === 0) {\n return ''\n }\n\n const buildSubTree = () => {\n if (nextLevelHeaders.length > 0) {\n list[list.length - 1] += this.buildTree(nextLevelHeaders)\n }\n }\n\n headers.forEach((h: Heading) => {\n if (lastLevel !== -1 && lastLevel < h.level) {\n nextLevelHeaders.push(h)\n return\n }\n\n buildSubTree()\n\n lastLevel = h.level\n list.push(\n `<a href=\"#${h.id}\" class=\"toc-link toc-link--${this.effectiveSize}\">${h.text}<span class=\"toc-link__high-contrast\"></span></a>`,\n )\n nextLevelHeaders = []\n })\n\n buildSubTree()\n\n const listHTML = list\n .map(\n i => `<li class=\"toc-item ${'toc-item-level-' + lastLevel}\">${i}</li>`,\n )\n .join('')\n\n return `<ul class=\"${clsx({\n 'toc--no-indent': this.noIndent,\n })}\">${listHTML}</ul>`\n }\n\n private readonly _handleIntersect = (\n entries: IntersectionObserverEntry[],\n ) => {\n // Update intersection data for all entries\n entries.forEach(entry => {\n this._intersectionData.set(entry.target as HTMLElement, {\n isIntersecting: entry.isIntersecting,\n intersectionRatio: entry.intersectionRatio,\n boundingRect: entry.boundingClientRect,\n })\n })\n\n // Debounce the active anchor selection to prevent rapid changes\n if (this._debounceTimer) {\n clearTimeout(this._debounceTimer)\n }\n\n this._debounceTimer = window.setTimeout(() => {\n this._updateActiveAnchor()\n }, 50) // 50ms debounce\n }\n\n private readonly _updateActiveAnchor = () => {\n const viewportCenter = window.innerHeight / 2\n let bestAnchor: HTMLElement | null = null\n let bestScore = -Infinity\n\n // Find the best anchor based on intersection ratio and distance from viewport center\n this._intersectionData.forEach((data, anchor) => {\n if (!data.isIntersecting) return\n\n const distanceFromCenter = Math.abs(\n data.boundingRect.top + data.boundingRect.height / 2 - viewportCenter,\n )\n const intersectionScore = data.intersectionRatio\n\n // Calculate a score that prioritizes elements closer to viewport center\n // and with higher intersection ratios\n const score =\n intersectionScore - (distanceFromCenter / window.innerHeight) * 0.5\n\n if (score > bestScore) {\n bestScore = score\n bestAnchor = anchor as HTMLElement\n }\n })\n\n if (bestAnchor && (bestAnchor as HTMLElement).id) {\n const link = this.shadowRoot!.querySelector(\n `[href=\"#${(bestAnchor as HTMLElement).id}\"`,\n )\n if (link && link !== this._activeAnchor) {\n this.setActiveAnchor(\n link as HTMLAnchorElement,\n bestAnchor as HTMLElement,\n )\n }\n }\n }\n}\n"],"names":["_DapDSTOC","SizedMixin","DdsElement","entry","link","__async","headers","el","index","textContent","_a","_b","id","_c","count","anchor","level","anchorClass","entries","viewportCenter","bestAnchor","bestScore","data","distanceFromCenter","score","options","__spreadProps","__spreadValues","_changedProperties","__superGet","name","oldValue","newValue","changedProperties","tree","baseElement","base","t","minHeadingLevel","maxHeadingLevel","i","element","list","nextLevelHeaders","lastLevel","buildSubTree","h","listHTML","clsx","unsafeCSS","styles","DapDSTOC","__decorateClass","property"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4CqB,MAAAA,IAAA,MAAAA,UAAiBC,EAAWC,CAAU,EAAE;AAAA,EA4C3D,cAAc;AACN,UAAA,GAzCmB,KAAA,OAAA,IAGM,KAAA,aAAA,oBAGU,KAAA,uBAAA,oBAEhB,KAAA,YAAsB,CAAC,GAAG,KAAK,MAAM,KAAK,MAAM,CAAC,GAGtB,KAAA,kBAAA,GAGA,KAAA,kBAAA,GAGL,KAAA,WAAA,IASjD,KAAQ,aAAuB,CAAC,GAExB,KAAA,wCAOA,IAAI,GACZ,KAAQ,iBAAgC,MAoExC,KAAiB,WAAW,MAAM;AAChC,UACE,KAAK,YACL,KAAK,SAAS,SAAS,KACvB,KAAK,MAAM,OAAO,UAAU,OAAO,WAAW,MAC5C,SAAS,KAAK,cAChB;AACA,cAAMC,IAAQ,KAAK,SAAS,KAAK,SAAS,SAAS,CAAC,GAC9CC,IAAO,KAAK,WAAY,cAAc,WAAWD,EAAM,EAAE,GAAG;AAClE,QAAIC,KACG,KAAA,gBAAgBA,GAA2BA,CAAmB;AAAA,MACrE;AAAA,IAEJ,GA+DA,KAAiB,aAAa,MAAYC,EAAA;AACxC,YAAMC,IAAqB,CAAC;AAE5B,mBAAM,KAAK,SAAS,QAAQ,CAAOC,GAAIC,MAAUH,EAAA;;AAC/C,cAAOE,EAAW;AAElB,cAAME,IACJF,EAAG,aAAa,WAAW,OAC3BG,IAAAH,EAAG,cAAH,gBAAAG,EAAc,aACdC,IAAAJ,EAAG,gBAAH,gBAAAI,EAAgB,WAChB,IACIC,IACJL,EAAG,QACHM,IAAAN,EAAG,cAAH,gBAAAM,EAAc,cAAc,MAAM,KAAK,KAAK,SAC5CJ,EAAY,YAAY,EAAE,MAAM,GAAG,EAAE,KAAK,GAAG;AAE3C,YAAA,CAACF,EAAG,MAAMK,GAAI;AAChB,cAAIE,IAAQ;AAML,eAJH,KAAK,SAAS,KAAK,OAAUC,EAAO,OAAOH,CAAE,KAC/CE,KAGK,KAAK,SAAS,KAAK,CAAUC,MAAAA,EAAO,OAAO,GAAGH,CAAE,IAAIE,CAAK,EAAE;AAChE,YAAAA;AAGF,UAAIA,MAAU,IACTP,EAAA,aAAa,MAAMK,CAAE,IAExBL,EAAG,aAAa,MAAM,GAAGK,CAAE,IAAIE,CAAK,EAAE;AAAA,QACxC;AAGE,YAAAE,IAAQ,KAAK,WAAW;AAAA,UAC1B,GAAGT,EAAG,QAAQ,YAAY,CAAC,IAAIU,CAAW;AAAA,QAC5C;AAEA,QAAID,MAAU,OACZA,IAAQ,KAAK,WAAW;AAAA,UACtB,6BAA6BT,EAAG,aAAa,SAAS,CAAC;AAAA,QACzD,IAGFD,EAAQE,CAAK,IAAI;AAAA,UACf,IAAAI;AAAA,UACA,MAAMH;AAAA,UACN,OAAO,KAAK,MAAMO,IAAQ,CAAC;AAAA,QAC7B;AAAA,MAAA,EACD,GAEMV;AAAA,IACT,IA6CiB,KAAA,mBAAmB,CAClCY,MACG;AAEH,MAAAA,EAAQ,QAAQ,CAASf,MAAA;AAClB,aAAA,kBAAkB,IAAIA,EAAM,QAAuB;AAAA,UACtD,gBAAgBA,EAAM;AAAA,UACtB,mBAAmBA,EAAM;AAAA,UACzB,cAAcA,EAAM;AAAA,QAAA,CACrB;AAAA,MAAA,CACF,GAGG,KAAK,kBACP,aAAa,KAAK,cAAc,GAG7B,KAAA,iBAAiB,OAAO,WAAW,MAAM;AAC5C,aAAK,oBAAoB;AAAA,SACxB,EAAE;AAAA,IACP,GAEA,KAAiB,sBAAsB,MAAM;AACrC,YAAAgB,IAAiB,OAAO,cAAc;AAC5C,UAAIC,IAAiC,MACjCC,IAAY;AAsBZ,UAnBJ,KAAK,kBAAkB,QAAQ,CAACC,GAAMP,MAAW;AAC3C,YAAA,CAACO,EAAK,eAAgB;AAE1B,cAAMC,IAAqB,KAAK;AAAA,UAC9BD,EAAK,aAAa,MAAMA,EAAK,aAAa,SAAS,IAAIH;AAAA,QACzD,GAKMK,IAJoBF,EAAK,oBAKRC,IAAqB,OAAO,cAAe;AAElE,QAAIC,IAAQH,MACEA,IAAAG,GACCJ,IAAAL;AAAA,MACf,CACD,GAEGK,KAAeA,EAA2B,IAAI;AAC1C,cAAAhB,IAAO,KAAK,WAAY;AAAA,UAC5B,WAAYgB,EAA2B,EAAE;AAAA,QAC3C;AACI,QAAAhB,KAAQA,MAAS,KAAK,iBACnB,KAAA;AAAA,UACHA;AAAA,UACAgB;AAAA,QACF;AAAA,MACF;AAAA,IAEJ,GApSO,KAAA,YAAY,CAAC,GAAG,GACrB,KAAK,OAAO;AAAA,EAAA;AAAA,EAGd,IAAI,eAAe;AACjB,WAAO,KAAK;AAAA,EAAA;AAAA,EAGd,IAAI,UAAU;AACZ,WAAO,KAAK;AAAA,EAAA;AAAA,EAGd,IAAI,QAAQ;AACV,WAAO,KAAK;AAAA,EAAA;AAAA,EAGd,oBAAoB;AAClB,UAAM,kBAAkB;AAExB,UAAMK,IAAU;AAAA,MACd,MAAM,KAAK,OAAO,SAAS,cAAc,KAAK,IAAI,IAAI;AAAA,MACtD,YAAY,KAAK;AAAA,MACjB,WAAW,KAAK;AAAA,IAClB;AAEA,SAAK,YAAY,IAAI,qBAAqB,KAAK,kBAAkBA,CAAO,GAExE,KAAK,sBAAsB,IAAI,qBAAqB,KAAK,kBAAkBC,EAAAC,EAAA,IACtEF,IADsE;AAAA,MAEzE,YAAY,KAAK;AAAA,IAAA,EAClB,GAEM,OAAA,iBAAiB,UAAU,KAAK,QAAQ;AAAA,EAAA;AAAA,EAGjC,aACdG,GACe;AAAA,WAAAvB,EAAA;AACf,MAAAwB,EAAA7B,EAAA,iBAAM,qBAAN,MAAmB4B,CAAkB,GACrC,MAAM,KAAK,WAAW;AAAA,IAAA;AAAA;AAAA,EAGlB,yBAAyBE,GAAcC,GAAeC,GAAe;AAAA,WAAA3B,EAAA;AACnE,MAAAwB,EAAA7B,EAAA,iBAAA,iCAAA,MAAyB8B,GAAMC,GAAUC,CAAQ,GACvD,MAAM,KAAK,WAAW;AAAA,IAAA;AAAA;AAAA,EAGlB,QAAQC,GAA8C;AAAA,WAAA5B,EAAA;AAC1D,MAAAwB,EAAA7B,EAAA,iBAAM,gBAAN,MAAciC,CAAiB,GAC/B,MAAM,KAAK,WAAW;AAAA,IAAA;AAAA;AAAA,EAGxB,uBAAuB;;AACrB,UAAM,qBAAqB,GACvB,KAAK,eACPvB,IAAA,KAAK,cAAL,QAAAA,EAAgB,eAChBC,IAAA,KAAK,wBAAL,QAAAA,EAA0B,cACnB,OAAA,oBAAoB,UAAU,KAAK,QAAQ;AAAA,EACpD;AAAA,EAkBI,aAAa;AAAA,WAAAN,EAAA;;AAMjB,UALA,KAAK,WAAW,KAAK;AAAA,QAClB,KAAK,kBAAsB,KAAK,kBAAT;AAAA,QACvB,KAAK,kBAAsB,KAAK,kBAAT;AAAA,MAC1B,GAEI,KAAK,SAAS,WAAW,KAAK,CAAC,KAAK;AACtC;AAGF,WAAK,SAAS,QAAQ,CAACU,GAAQP,MAAU;;AACnC,QAAAA,MAAU,KAAK,SAAS,SAAS,KAC9BE,IAAA,KAAA,wBAAA,QAAAA,EAAqB,QAAQK,MAE7BJ,IAAA,KAAA,cAAA,QAAAA,EAAW,QAAQI;AAAA,MAC1B,CACD,GAEI,KAAA,SAAS,MAAM,KAAK,WAAW;AACpC,YAAMmB,IAAO,KAAK,UAAU,KAAK,MAAM,GAEjCC,IAAc,SAAS,cAAc,KAAK;AACpC,MAAAA,EAAA,aAAa,QAAQ,MAAM,GAC3BA,EAAA,UAAU,IAAI,KAAK;AAE/B,YAAMC,IAAO;AAAA,4CAC2B,KAAK,aAAa,MAAK1B,IAAA,KAAK,WAAL,OAAAA,IAAe2B,EAAE,UAAU,CAAC;AAAA,4BACpE1B,IAAA,KAAK,WAAL,OAAAA,IAAe0B,EAAE,UAAU,CAAC,MAAMH,CAAI;AAIzD,MAFJC,EAAY,YAAYC,GAEnB,KAAK,eAEV,KAAK,WAAW,YAAY,KAAK,WAAW,WAAW,CAAC,CAAC,GACpD,KAAA,WAAW,YAAYD,CAAW;AAAA,IAAA;AAAA;AAAA,EAGzC,WAAWG,GAAyBC,GAAwC;AAC1E,SAAK,aAAa,CAAC;AACnB,aAASC,IAAIF,GAAiBE,KAAKD,GAAiBC,KAAK;AACvD,WAAK,WAAW,KAAK,IAAIA,CAAC,IAAIvB,CAAW,EAAE,GAC3C,KAAK,WAAW,KAAK,8BAA8BuB,CAAC,WAAW;AAG1D,WAAA,MAAM,KAAK,SAAS,iBAAiB,KAAK,WAAW,KAAA,CAAM,CAAC;AAAA,EAAA;AAAA,EAGrE,gBACEC,GACAtC,GACA;;AACK,KAAAO,IAAA,KAAA,kBAAA,QAAAA,EAAe,gBAAgB,iBAC5B+B,EAAA,aAAa,gBAAgB,MAAM,GAC3C,KAAK,gBAAgBA,GAErB,KAAK,KAAK,qBAAqB;AAAA,MAC7B,cAAcA;AAAA,MACd,eAAetC;AAAA,IAAA,CAChB;AAAA,EAAA;AAAA,EAyDH,UAAUG,GAAgB;AACxB,UAAMoC,IAAiB,CAAC;AACxB,QAAIC,IAA0B,CAAC,GAC3BC,IAAY;AAEZ,QAAAtC,EAAQ,WAAW;AACd,aAAA;AAGT,UAAMuC,IAAe,MAAM;AACrB,MAAAF,EAAiB,SAAS,MAC5BD,EAAKA,EAAK,SAAS,CAAC,KAAK,KAAK,UAAUC,CAAgB;AAAA,IAE5D;AAEQ,IAAArC,EAAA,QAAQ,CAACwC,MAAe;AAC9B,UAAIF,MAAc,MAAMA,IAAYE,EAAE,OAAO;AAC3C,QAAAH,EAAiB,KAAKG,CAAC;AACvB;AAAA,MAAA;AAGW,MAAAD,EAAA,GAEbD,IAAYE,EAAE,OACTJ,EAAA;AAAA,QACH,aAAaI,EAAE,EAAE,+BAA+B,KAAK,aAAa,KAAKA,EAAE,IAAI;AAAA,MAC/E,GACAH,IAAmB,CAAC;AAAA,IAAA,CACrB,GAEYE,EAAA;AAEb,UAAME,IAAWL,EACd;AAAA,MACC,CAAKF,MAAA,uBAAuB,oBAAoBI,CAAS,KAAKJ,CAAC;AAAA,IAAA,EAEhE,KAAK,EAAE;AAEV,WAAO,cAAcQ,EAAK;AAAA,MACxB,kBAAkB,KAAK;AAAA,IAAA,CACxB,CAAC,KAAKD,CAAQ;AAAA,EAAA;AA8DnB;AAnVE/C,EAAO,UAAU,cAyCDA,EAAA,SAASiD,EAAUC,CAAM;AA1CtB,IAAAC,IAAAnD;AAIPoD,EAAA;AAAA,EAAXC,EAAS;AAAA,GAJSF,EAIP,WAAA,MAAA;AAGAC,EAAA;AAAA,EAAXC,EAAS;AAAA,GAPSF,EAOP,WAAA,YAAA;AAGAC,EAAA;AAAA,EAAXC,EAAS;AAAA,GAVSF,EAUP,WAAA,sBAAA;AAEeC,EAAA;AAAA,EAA1BC,EAAS,EAAE,MAAM,MAAO,CAAA;AAAA,GAZNF,EAYQ,WAAA,WAAA;AAGCC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAQ,CAAA;AAAA,GAfPF,EAeS,WAAA,iBAAA;AAGAC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAQ,CAAA;AAAA,GAlBPF,EAkBS,WAAA,iBAAA;AAGCC,EAAA;AAAA,EAA5BC,EAAS,EAAE,MAAM,QAAS,CAAA;AAAA,GArBRF,EAqBU,WAAA,UAAA;AAGjBC,EAAA;AAAA,EAAXC,EAAS;AAAA,GAxBSF,EAwBP,WAAA,QAAA;"}

package/dist/components/toc/toc.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
-import { default as DapDSTOC } from './toc.component.js';
-export * from './toc.component.js';
+import { default as DapDSTOC } from './toc.component';
+export * from './toc.component';
 export default DapDSTOC;
 declare global {
     interface HTMLElementTagNameMap {

package/dist/components/toc/toc.js ADDED Viewed

@@ -0,0 +1,6 @@
+import e from "./toc.component.js";
+e.define();
+export {
+  e as default
+};
+//# sourceMappingURL=toc.js.map

package/dist/components/toc/toc.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"toc.js","sources":["../../../src/components/toc/toc.ts"],"sourcesContent":["import DapDSTOC from './toc.component'\n\nexport * from './toc.component'\nexport default DapDSTOC\n\nDapDSTOC.define()\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'dap-ds-toc': DapDSTOC\n }\n}\n"],"names":["DapDSTOC"],"mappings":";AAKAA,EAAS,OAAO;"}

package/dist/components/toc/toc.scss.js ADDED Viewed

@@ -0,0 +1,5 @@
+const t = "*,*:before,*:after{box-sizing:border-box;outline:none}* :not(dap-ds-table-cell,dap-ds-table-header){margin:0;padding:0}html:focus-within{scroll-behavior:smooth}a:not([class]){text-decoration-skip-ink:auto}img,picture,svg,video,canvas{max-width:100%;height:auto;background-repeat:no-repeat;background-size:cover;font-style:italic;vertical-align:middle}input,button,textarea,select{font:inherit}[hidden]{display:none!important}@media (prefers-reduced-motion: reduce){html:focus-within{scroll-behavior:auto}*,*:before,*:after{transition:none;transition-duration:.01ms!important;transition-delay:1ms!important;animation-duration:1ms!important;animation-delay:-1ms!important;animation-iteration-count:1!important;background-attachment:initial!important;scroll-behavior:auto!important}}body,html{height:100%;scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}input[type=number]{appearance:textfield}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{appearance:none}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);border-width:0;white-space:nowrap}.input-description{display:block;margin-bottom:var(--dds-spacing-200)}@keyframes dds-spin{to{transform:rotate(360deg)}}@keyframes dds-fade{0%,to{opacity:.3}50%{opacity:1}}:host{--dds-toc-border-width: var(--dds-border-width-base);--dds-toc-border-color: var(--dds-border-neutral-divider);--dds-toc-title-color: var(--dds-text-neutral-strong);--dds-toc-title-font-size: var(--dds-font-base);--dds-toc-title-font-weight: var(--dds-font-weight-bold);--dds-toc-title-line-height: 1.25;--dds-toc-link-color: var(--dds-button-subtle-text-neutral-enabled);--dds-toc-link-active-color: var(--dds-button-subtle-text-enabled);--dds-toc-link-border-color: var(--dds-border-brand-base);--dds-toc-link-line-height: 1.2;--dds-toc-link-padding: var(--dds-spacing-200);--dds-toc-indent-level-0: var(--dds-spacing-400);--dds-toc-indent-level-1: var(--dds-spacing-800);--dds-toc-indent-level-2: var(--dds-spacing-1200);--dds-toc-indent-level-3: var(--dds-spacing-1600);--dds-toc-indent-level-4: var(--dds-spacing-2000);--dds-toc-indent-level-5: var(--dds-spacing-2400)}:host ul{padding-left:0}.toc{margin-block:0;padding-inline:0;list-style-type:none;border-inline-start:var(--dds-toc-border-width) solid var(--dds-toc-border-color)}.toc-title{display:block;padding-block:var(--dds-spacing-300);padding-inline:var(--dds-spacing-400);color:var(--dds-toc-title-color);font-size:var(--dds-toc-title-font-size);font-weight:var(--dds-toc-title-font-weight);line-height:var(--dds-toc-title-line-height)}.toc-title--sm{font-size:var(--dds-font-sm)}.toc-title--lg{font-size:var(--dds-font-base)}.toc-link{transition-property:all;transition-duration:var(--dds-transition-fast);transition-timing-function:var(--dds-easing-ease-in-out);outline-color:var(--dds-focus-outer-ring);outline-offset:var(--dds-spacing-50);outline-width:var(--dds-border-width-large);display:block;position:relative;width:100%;margin-left:-1px;padding-block:var(--dds-toc-link-padding);padding-inline:var(--dds-spacing-400);border-left:var(--dds-border-width-large) solid transparent;color:var(--dds-toc-link-color);line-height:var(--dds-toc-link-line-height);text-decoration:none}.toc-link--sm{font-size:var(--dds-font-sm)}.toc-link--lg{font-size:var(--dds-font-base)}.toc-link:focus-visible{outline-style:solid}.toc-item-level-0{padding-inline-start:0}.toc-item-level-0>.toc-link{padding-inline-start:var(--dds-toc-indent-level-0)}.toc-item-level-1>.toc-link{padding-inline-start:var(--dds-toc-indent-level-1)}.toc-item-level-2>.toc-link{padding-inline-start:var(--dds-toc-indent-level-2)}.toc-item-level-3>.toc-link{padding-inline-start:var(--dds-toc-indent-level-3)}.toc-item-level-4>.toc-link{padding-inline-start:var(--dds-toc-indent-level-4)}.toc-item-level-5>.toc-link{padding-inline-start:var(--dds-toc-indent-level-5)}.toc--no-indent .toc-item-level-0>.toc-link,.toc--no-indent .toc-item-level-1>.toc-link,.toc--no-indent .toc-item-level-2>.toc-link,.toc--no-indent .toc-item-level-3>.toc-link,.toc--no-indent .toc-item-level-4>.toc-link,.toc--no-indent .toc-item-level-5>.toc-link{padding-inline-start:var(--dds-toc-indent-level-0)}a[aria-current=true]{height:100%;border-left:var(--dds-border-width-large) solid var(--dds-toc-link-border-color);color:var(--dds-toc-link-active-color)}a[aria-current=true] .toc-link__high-contrast{display:inline-flex;position:absolute;top:0;left:0;box-sizing:border-box;flex:0 0 auto;width:100%;height:100%;border:var(--dds-border-width-large) solid var(--dds-border-neutral-transparent-interactive, #fff500);border-radius:var(--dds-radius-small)}a[aria-current=true] .toc-link__high-contrast:hover{border-width:var(--dds-border-width-large)}a[aria-current=true] .toc-link__high-contrast:active{border-width:var(--dds-border-width-xlarge)}li{position:relative;padding:0;list-style-type:none}";
+export {
+  t as default
+};
+//# sourceMappingURL=toc.scss.js.map

package/dist/components/toc/toc.scss.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"toc.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/toggle-button/_styles/toggle-button.scss.js ADDED Viewed

@@ -0,0 +1,5 @@
+const t = ":host{display:inline-block;--dds-toggle-button-min-width-lg: var(--dds-spacing-2400);--dds-toggle-button-min-width-md: var(--dds-spacing-2000);--dds-toggle-button-min-width-sm: var(--dds-spacing-1200);--dds-toggle-button-min-width-xs: var(--dds-spacing-1200);--dds-toggle-button-height-lg: var(--dds-spacing-1200);--dds-toggle-button-height-md: var(--dds-spacing-1000);--dds-toggle-button-height-sm: var(--dds-spacing-800);--dds-toggle-button-height-xs: var(--dds-spacing-600);--dds-toggle-button-padding-lg: var(--dds-spacing-300) var(--dds-spacing-400);--dds-toggle-button-padding-md: var(--dds-spacing-300);--dds-toggle-button-padding-sm: var(--dds-spacing-200);--dds-toggle-button-padding-xs: var(--dds-spacing-150) var(--dds-spacing-200);--dds-toggle-button-font-size-lg: 1.125rem;--dds-toggle-button-font-size-md: 1rem;--dds-toggle-button-font-size-sm: .875rem;--dds-toggle-button-font-size-xs: var(--dds-font-xs);--dds-toggle-button-border-enabled: var(--dds-button-toggle-border-enabled);--dds-toggle-button-background-enabled: var( --dds-button-toggle-background-enabled );--dds-toggle-button-content-enabled: var(--dds-button-toggle-content-enabled);--dds-toggle-button-border-hover: var(--dds-button-toggle-border-hover);--dds-toggle-button-background-hover: var( --dds-button-toggle-background-hover );--dds-toggle-button-border-pressed: var(--dds-button-toggle-border-pressed);--dds-toggle-button-background-pressed: var( --dds-button-toggle-background-pressed );--dds-toggle-button-background-selected-enabled: var( --dds-button-toggle-background-selected-enabled );--dds-toggle-button-content-selected-enabled: var( --dds-button-toggle-content-selected-enabled );--dds-toggle-button-background-selected-hover: var( --dds-button-toggle-background-selected-hover );--dds-toggle-button-background-selected-pressed: var( --dds-button-toggle-background-selected-pressed );--dds-toggle-button-border-disabled: var(--dds-button-toggle-border-disabled);--dds-toggle-button-background-disabled: var( --dds-button-toggle-background-disabled );--dds-toggle-button-content-disabled: var( --dds-button-toggle-content-disabled );--dds-toggle-button-highcontrast-border: var( --dds-border-neutral-transparent-interactive, #fff500 );--dds-toggle-button-highcontrast-border-hover: var( --dds-border-neutral-transparent-interactive, #fff500 )}.toggle-button{outline-color:var(--dds-focus-outer-ring);outline-offset:var(--dds-spacing-50);outline-width:var(--dds-border-width-large);transition-property:all;transition-duration:var(--dds-transition-fast);transition-timing-function:var(--dds-easing-ease-in-out);display:inline-flex;position:relative;flex-direction:row;align-items:center;justify-content:center;width:auto;column-gap:var(--dds-spacing-100);border:var(--dds-border-width-large) solid var(--dds-toggle-button-border-enabled);border-radius:var(--dds-radius-rounded);background-color:var(--dds-toggle-button-background-enabled);color:var(--dds-toggle-button-content-enabled);font-weight:700;line-height:var(--dds-font-line-height-large);cursor:pointer}.toggle-button:hover{border-color:var(--dds-toggle-button-border-hover);background-color:var(--dds-toggle-button-background-hover)}.toggle-button:active{border-color:var(--dds-toggle-button-border-pressed);background-color:var(--dds-toggle-button-background-pressed)}.toggle-button:focus-visible{outline-style:solid}.toggle-button .button__text{padding:0 var(--dds-spacing-100)}.toggle-button .button__text span{line-height:var(--dds-font-line-height-large)}.toggle-button[aria-pressed=true],.toggle-button--active{background-color:var(--dds-toggle-button-background-selected-enabled);color:var(--dds-toggle-button-content-selected-enabled)}.toggle-button[aria-pressed=true]:hover,.toggle-button--active:hover{background-color:var(--dds-toggle-button-background-selected-hover)}.toggle-button[aria-pressed=true]:active,.toggle-button--active:active{background-color:var(--dds-toggle-button-background-selected-pressed)}.toggle-button[aria-pressed=true]:focus-visible,.toggle-button--active:focus-visible{outline-style:solid}.toggle-button[disabled]{border:var(--dds-border-width-large) solid var(--dds-toggle-button-border-disabled);background-color:var(--dds-toggle-button-background-disabled);color:var(--dds-toggle-button-content-disabled);cursor:not-allowed}.toggle-button[disabled]:focus-visible{outline-style:solid}.toggle-button[disabled]>*{pointer-events:none}.toggle-button--lg{min-width:var(--dds-toggle-button-min-width-lg);height:var(--dds-toggle-button-height-lg);padding:var(--dds-toggle-button-padding-lg);font-size:var(--dds-toggle-button-font-size-lg)}.toggle-button--lg.dds-toggle-button--circle,.toggle-button--lg.toggle-button--circle{width:var(--dds-toggle-button-height-lg);min-width:0;height:var(--dds-toggle-button-height-lg);padding:0}.toggle-button--md{min-width:var(--dds-toggle-button-min-width-md);height:var(--dds-toggle-button-height-md);padding:var(--dds-toggle-button-padding-md);font-size:var(--dds-toggle-button-font-size-md)}.toggle-button--md.dds-toggle-button--circle,.toggle-button--md.toggle-button--circle{width:var(--dds-toggle-button-height-md);min-width:0;max-width:var(--dds-toggle-button-height-md);height:var(--dds-toggle-button-height-md);padding:0}.toggle-button--sm{min-width:var(--dds-toggle-button-min-width-sm);height:var(--dds-toggle-button-height-sm);padding:var(--dds-toggle-button-padding-sm);font-size:var(--dds-toggle-button-font-size-sm)}.toggle-button--sm.dds-toggle-button--circle,.toggle-button--sm.toggle-button--circle{width:var(--dds-toggle-button-height-sm);min-width:0;max-width:var(--dds-toggle-button-height-sm);height:var(--dds-toggle-button-height-sm);padding:3px}.toggle-button--xs{min-width:var(--dds-toggle-button-min-width-xs);height:var(--dds-toggle-button-height-xs);padding:var(--dds-toggle-button-padding-xs);font-size:var(--dds-toggle-button-font-size-xs)}.toggle-button--xs.dds-toggle-button--circle,.toggle-button--xs.toggle-button--circle{width:var(--dds-toggle-button-height-xs);min-width:0;max-width:var(--dds-toggle-button-height-xs);height:var(--dds-toggle-button-height-xs);padding:3px}.toggle-button__highcontrast{position:absolute;width:100%;height:100%;border:var(--dds-border-width-base) solid var(--dds-toggle-button-highcontrast-border);border-radius:var(--dds-radius-rounded)}.toggle-button__highcontrast:hover{border-width:var(--dds-border-width-large);border-color:var(--dds-toggle-button-highcontrast-border-hover)}.toggle-button__highcontrast:active{border-width:var(--dds-border-width-xlarge)}";
+export {
+  t as default
+};
+//# sourceMappingURL=toggle-button.scss.js.map

package/dist/components/toggle-button/_styles/toggle-button.scss.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"toggle-button.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/toggle-button/toggle-button.component.d.ts CHANGED Viewed

@@ -50,6 +50,7 @@ import { ButtonShape } from '../../common/types';
  *
  */
 export default class DapDSToggleButton extends GenericFormElement {
+    static tagName: string;
     constructor();
     /** Whether the button is active. */
     active: boolean;

package/dist/components/toggle-button/toggle-button.component.js ADDED Viewed

@@ -0,0 +1,85 @@
+import { clsx as u } from "../../node_modules/clsx/dist/clsx.js";
+import "../../node_modules/@lit/reactive-element/reactive-element.js";
+import "../../node_modules/lit-html/lit-html.js";
+import "../../node_modules/lit-element/lit-element.js";
+import { property as a } from "../../node_modules/@lit/reactive-element/decorators/property.js";
+import { ifDefined as p } from "../../node_modules/lit-html/directives/if-defined.js";
+import { html as f } from "../../node_modules/lit-html/static.js";
+import { GenericFormElement as c } from "../../internal/mixin/genericFormElement.js";
+import b from "./_styles/toggle-button.scss.js";
+import { unsafeCSS as m } from "../../node_modules/@lit/reactive-element/css-tag.js";
+var g = Object.defineProperty, l = (d, t, i, h) => {
+  for (var e = void 0, o = d.length - 1, n; o >= 0; o--)
+    (n = d[o]) && (e = n(t, i, e) || e);
+  return e && g(t, i, e), e;
+};
+const r = class r extends c {
+  constructor() {
+    super(), this.active = !1, this.shape = "button", this.sizeChildren = "true", this.size = "md";
+  }
+  /** Maps effectiveSize from SizedMixin to toggle button visual size (xxs→xs). */
+  get toggleButtonSize() {
+    return this.effectiveSize === "xxs" ? "xs" : this.effectiveSize;
+  }
+  get focusElement() {
+    var t;
+    return (t = this.shadowRoot) == null ? void 0 : t.querySelector("button");
+  }
+  firstUpdated(t) {
+    super.firstUpdated(t), this._sizeSlottedChildren();
+  }
+  updated(t) {
+    super.updated(t), (t.has("size") || t.has("sizeMap") || t.has("sizeChildren")) && this._sizeSlottedChildren();
+  }
+  _sizeSlottedChildren() {
+    var i;
+    if (this.sizeChildren !== "true") return;
+    const t = (i = this.shadowRoot) == null ? void 0 : i.querySelector("slot");
+    t == null || t.assignedElements().forEach((h) => {
+      h.setAttribute("size", this.toggleButtonSize);
+    });
+  }
+  handleClick() {
+    this.disabled;
+  }
+  render() {
+    return f`
+      <button
+        part="base"
+        .disabled=${this.disabled}
+        aria-disabled=${this.disabled}
+        aria-label=${p(this.ariaLabel) || ""}
+        aria-pressed=${this.active}
+        .autofocus=${this.autofocus}
+        type="button"
+        class=${u(
+      "toggle-button",
+      `toggle-button--${this.toggleButtonSize}`,
+      `toggle-button--${this.shape}`,
+      {
+        "toggle-button--active": this.active,
+        "toggle-button--disabled": this.disabled
+      }
+    )}
+        @click=${this.handleClick}>
+        <div part="high-contrast" class="toggle-button__highcontrast"></div>
+        <slot></slot>
+      </button>
+    `;
+  }
+};
+r.tagName = "dap-ds-toggle-button", r.styles = m(b);
+let s = r;
+l([
+  a({ type: Boolean, reflect: !0 })
+], s.prototype, "active");
+l([
+  a({ reflect: !0 })
+], s.prototype, "shape");
+l([
+  a({ type: String })
+], s.prototype, "sizeChildren");
+export {
+  s as default
+};
+//# sourceMappingURL=toggle-button.component.js.map

package/dist/components/toggle-button/toggle-button.component.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"toggle-button.component.js","sources":["../../../src/components/toggle-button/toggle-button.component.ts"],"sourcesContent":["import clsx from 'clsx'\nimport { PropertyValues, unsafeCSS } from 'lit'\nimport { property } from 'lit/decorators.js'\nimport { ifDefined } from 'lit/directives/if-defined.js'\nimport { html } from 'lit/static-html.js'\n\nimport { GenericFormElement } from '@/internal/mixin/genericFormElement'\n\nimport { ButtonShape } from '../../common/types'\nimport styles from './_styles/toggle-button.scss?inline'\n\n/**\n * `dap-ds-toggle-button` is a custom toggle button component.\n * @element dap-ds-toggle-button\n * @summary A toggle button is a button that can be toggled on (active) or off (inactive).\n * @title - Toggle button\n *\n * @property { 'xs' | 'sm' | 'md' | 'lg' } size - The size of the toggle button. Default is `md`\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\")\n *\n * @slot - The content of the toggle button.\n *\n * @csspart base - The main button container.\n * @csspart high-contrast - The high contrast part of the button.\n *\n * @cssproperty --dds-toggle-button-min-width-lg - Minimum width of the large toggle button (default: var(--dds-spacing-2400))\n * @cssproperty --dds-toggle-button-min-width-md - Minimum width of the medium toggle button (default: var(--dds-spacing-2000))\n * @cssproperty --dds-toggle-button-min-width-sm - Minimum width of the small toggle button (default: var(--dds-spacing-1200))\n * @cssproperty --dds-toggle-button-min-width-xs - Minimum width of the extra small toggle button (default: var(--dds-spacing-1200))\n * @cssproperty --dds-toggle-button-height-lg - Height of the large toggle button (default: var(--dds-spacing-1200))\n * @cssproperty --dds-toggle-button-height-md - Height of the medium toggle button (default: var(--dds-spacing-1000))\n * @cssproperty --dds-toggle-button-height-sm - Height of the small toggle button (default: var(--dds-spacing-800))\n * @cssproperty --dds-toggle-button-height-xs - Height of the extra small toggle button (default: var(--dds-spacing-600))\n * @cssproperty --dds-toggle-button-padding-lg - Padding of the large toggle button (default: var(--dds-spacing-300) var(--dds-spacing-400))\n * @cssproperty --dds-toggle-button-padding-md - Padding of the medium toggle button (default: var(--dds-spacing-300))\n * @cssproperty --dds-toggle-button-padding-sm - Padding of the small toggle button (default: var(--dds-spacing-200))\n * @cssproperty --dds-toggle-button-padding-xs - Padding of the extra small toggle button (default: var(--dds-spacing-150) var(--dds-spacing-200))\n * @cssproperty --dds-toggle-button-font-size-lg - Font size of the large toggle button (default: 1.125rem)\n * @cssproperty --dds-toggle-button-font-size-md - Font size of the medium toggle button (default: 1rem)\n * @cssproperty --dds-toggle-button-font-size-sm - Font size of the small toggle button (default: 0.875rem)\n * @cssproperty --dds-toggle-button-font-size-xs - Font size of the extra small toggle button (default: var(--dds-font-xs))\n * @cssproperty --dds-toggle-button-border-enabled - Border color in enabled state (default: var(--dds-button-toggle-border-enabled))\n * @cssproperty --dds-toggle-button-background-enabled - Background color in enabled state (default: var(--dds-button-toggle-background-enabled))\n * @cssproperty --dds-toggle-button-content-enabled - Content/text color in enabled state (default: var(--dds-button-toggle-content-enabled))\n * @cssproperty --dds-toggle-button-border-hover - Border color in hover state (default: var(--dds-button-toggle-border-hover))\n * @cssproperty --dds-toggle-button-background-hover - Background color in hover state (default: var(--dds-button-toggle-background-hover))\n * @cssproperty --dds-toggle-button-border-pressed - Border color in pressed state (default: var(--dds-button-toggle-border-pressed))\n * @cssproperty --dds-toggle-button-background-pressed - Background color in pressed state (default: var(--dds-button-toggle-background-pressed))\n * @cssproperty --dds-toggle-button-background-selected-enabled - Background color in selected enabled state (default: var(--dds-button-toggle-background-selected-enabled))\n * @cssproperty --dds-toggle-button-content-selected-enabled - Content/text color in selected enabled state (default: var(--dds-button-toggle-content-selected-enabled))\n * @cssproperty --dds-toggle-button-background-selected-hover - Background color in selected hover state (default: var(--dds-button-toggle-background-selected-hover))\n * @cssproperty --dds-toggle-button-background-selected-pressed - Background color in selected pressed state (default: var(--dds-button-toggle-background-selected-pressed))\n * @cssproperty --dds-toggle-button-border-disabled - Border color in disabled state (default: var(--dds-button-toggle-border-disabled))\n * @cssproperty --dds-toggle-button-background-disabled - Background color in disabled state (default: var(--dds-button-toggle-background-disabled))\n * @cssproperty --dds-toggle-button-content-disabled - Content/text color in disabled state (default: var(--dds-button-toggle-content-disabled))\n * @cssproperty --dds-toggle-button-highcontrast-border - High contrast border color (default: var(--dds-button-toggle-highcontrast-border))\n * @cssproperty --dds-toggle-button-highcontrast-border-hover - High contrast border color on hover (default: var(--dds-button-toggle-highcontrast-border-hover))\n *\n */\nexport default class DapDSToggleButton extends GenericFormElement {\n static tagName = 'dap-ds-toggle-button'\n\n constructor() {\n super()\n this.size = 'md'\n }\n\n /** Whether the button is active. */\n @property({ type: Boolean, reflect: true }) active = false\n\n /** The shape of the button\n * @type { 'button' | 'circle' }\n */\n @property({ reflect: true }) shape: ButtonShape = 'button'\n\n @property({ type: String }) sizeChildren = 'true'\n\n static readonly styles = unsafeCSS(styles)\n\n /** Maps effectiveSize from SizedMixin to toggle button visual size (xxs→xs). */\n private get toggleButtonSize(): 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl' {\n return this.effectiveSize === 'xxs' ? 'xs' : this.effectiveSize\n }\n\n get focusElement(): HTMLButtonElement {\n return this.shadowRoot?.querySelector('button') as HTMLButtonElement\n }\n\n protected firstUpdated(_changedProperties: PropertyValues): void {\n super.firstUpdated(_changedProperties)\n this._sizeSlottedChildren()\n }\n\n protected override updated(changedProperties: PropertyValues): void {\n super.updated(changedProperties)\n if (\n changedProperties.has('size') ||\n changedProperties.has('sizeMap') ||\n changedProperties.has('sizeChildren')\n ) {\n this._sizeSlottedChildren()\n }\n }\n\n private _sizeSlottedChildren(): void {\n if (this.sizeChildren !== 'true') return\n const slot = this.shadowRoot?.querySelector('slot')\n slot?.assignedElements().forEach(el => {\n el.setAttribute('size', this.toggleButtonSize)\n })\n }\n\n private handleClick(): void {\n if (this.disabled) {\n return\n }\n }\n\n render() {\n return html`\n <button\n part=\"base\"\n .disabled=${this.disabled}\n aria-disabled=${this.disabled}\n aria-label=${ifDefined(this.ariaLabel) || ''}\n aria-pressed=${this.active}\n .autofocus=${this.autofocus}\n type=\"button\"\n class=${clsx(\n 'toggle-button',\n `toggle-button--${this.toggleButtonSize}`,\n `toggle-button--${this.shape}`,\n {\n 'toggle-button--active': this.active,\n 'toggle-button--disabled': this.disabled,\n },\n )}\n @click=${this.handleClick}>\n <div part=\"high-contrast\" class=\"toggle-button__highcontrast\"></div>\n <slot></slot>\n </button>\n `\n }\n}\n"],"names":["_DapDSToggleButton","GenericFormElement","_a","_changedProperties","changedProperties","slot","el","html","ifDefined","clsx","unsafeCSS","styles","DapDSToggleButton","__decorateClass","property"],"mappings":";;;;;;;;;;;;;;;AA2DA,MAAqBA,IAArB,MAAqBA,UAA0BC,EAAmB;AAAA,EAGhE,cAAc;AACN,UAAA,GAK6C,KAAA,SAAA,IAKH,KAAA,QAAA,UAEP,KAAA,eAAA,QAXzC,KAAK,OAAO;AAAA,EAAA;AAAA;AAAA,EAgBd,IAAY,mBAA6D;AACvE,WAAO,KAAK,kBAAkB,QAAQ,OAAO,KAAK;AAAA,EAAA;AAAA,EAGpD,IAAI,eAAkC;;AAC7B,YAAAC,IAAA,KAAK,eAAL,gBAAAA,EAAiB,cAAc;AAAA,EAAQ;AAAA,EAGtC,aAAaC,GAA0C;AAC/D,UAAM,aAAaA,CAAkB,GACrC,KAAK,qBAAqB;AAAA,EAAA;AAAA,EAGT,QAAQC,GAAyC;AAClE,UAAM,QAAQA,CAAiB,IAE7BA,EAAkB,IAAI,MAAM,KAC5BA,EAAkB,IAAI,SAAS,KAC/BA,EAAkB,IAAI,cAAc,MAEpC,KAAK,qBAAqB;AAAA,EAC5B;AAAA,EAGM,uBAA6B;;AAC/B,QAAA,KAAK,iBAAiB,OAAQ;AAClC,UAAMC,KAAOH,IAAA,KAAK,eAAL,gBAAAA,EAAiB,cAAc;AACtC,IAAAG,KAAA,QAAAA,EAAA,mBAAmB,QAAQ,CAAMC,MAAA;AAClC,MAAAA,EAAA,aAAa,QAAQ,KAAK,gBAAgB;AAAA,IAAA;AAAA,EAC9C;AAAA,EAGK,cAAoB;AAC1B,IAAI,KAAK;AAAA,EAET;AAAA,EAGF,SAAS;AACA,WAAAC;AAAAA;AAAAA;AAAAA,oBAGS,KAAK,QAAQ;AAAA,wBACT,KAAK,QAAQ;AAAA,qBAChBC,EAAU,KAAK,SAAS,KAAK,EAAE;AAAA,uBAC7B,KAAK,MAAM;AAAA,qBACb,KAAK,SAAS;AAAA;AAAA,gBAEnBC;AAAA,MACN;AAAA,MACA,kBAAkB,KAAK,gBAAgB;AAAA,MACvC,kBAAkB,KAAK,KAAK;AAAA,MAC5B;AAAA,QACE,yBAAyB,KAAK;AAAA,QAC9B,2BAA2B,KAAK;AAAA,MAAA;AAAA,IAEnC,CAAA;AAAA,iBACQ,KAAK,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA,EAAA;AAMjC;AAnFET,EAAO,UAAU,wBAiBDA,EAAA,SAASU,EAAUC,CAAM;AAlB3C,IAAqBC,IAArBZ;AAS8Ca,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,GAAM,CAAA;AAAA,GATvBF,EASyB,WAAA,QAAA;AAKfC,EAAA;AAAA,EAA5BC,EAAS,EAAE,SAAS,GAAM,CAAA;AAAA,GAdRF,EAcU,WAAA,OAAA;AAEDC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAQ,CAAA;AAAA,GAhBPF,EAgBS,WAAA,cAAA;"}

package/dist/components/toggle-button/toggle-button.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
-import { default as DapDSToggleButton } from './toggle-button.component.js';
-export * from './toggle-button.component.js';
+import { default as DapDSToggleButton } from './toggle-button.component';
+export * from './toggle-button.component';
 export default DapDSToggleButton;
 declare global {
     interface HTMLElementTagNameMap {

package/dist/components/toggle-button/toggle-button.js ADDED Viewed

@@ -0,0 +1,6 @@
+import e from "./toggle-button.component.js";
+e.define();
+export {
+  e as default
+};
+//# sourceMappingURL=toggle-button.js.map

package/dist/components/toggle-button/toggle-button.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"toggle-button.js","sources":["../../../src/components/toggle-button/toggle-button.ts"],"sourcesContent":["import DapDSToggleButton from './toggle-button.component'\n\nexport * from './toggle-button.component'\nexport default DapDSToggleButton\n\nDapDSToggleButton.define()\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'dap-ds-toggle-button': DapDSToggleButton\n }\n}\n"],"names":["DapDSToggleButton"],"mappings":";AAKAA,EAAkB,OAAO;"}

package/dist/components/tooltip/tooltip.component.d.ts CHANGED Viewed

@@ -1,6 +1,7 @@
 import { PropertyValueMap } from 'lit';
 import { PopupPlacement } from '../../common/types';
 import { DdsElement } from '../../internal/dds-hu-element';
+import { default as DapDSPopup } from '../popup/popup.component';
 export type TooltipMode = 'tooltip' | 'toggle';
 /**
  * `dap-ds-tooltip`
@@ -25,6 +26,10 @@ export type TooltipMode = 'tooltip' | 'toggle';
  * @cssproperty --dds-tooltip-box-shadow - The box shadow of the tooltip (default: 0 8px 12px -2px rgb(0 0 0 / 8%), 0 2px 6px -2px rgb(0 0 0 / 6%))
  */
 export default class DapDSTooltip extends DdsElement {
+    static tagName: string;
+    static dependencies: {
+        'dap-ds-popup': typeof DapDSPopup;
+    };
     static readonly styles: import('lit').CSSResult;
     /** The content of the tooltip, supporting text only. */
     content: string;