@ship-ui/core 0.19.5 → 0.22.2

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 (153) hide show
  1. package/README.md +3 -0
  2. package/assets/mcp/components.json +66 -4243
  3. package/bin/mcp/index.js +6027 -273
  4. package/bin/ship-fg-scanner +0 -0
  5. package/bin/ship-fg.mjs +14 -12
  6. package/bin/src/subset.ts +3 -1
  7. package/fesm2022/ship-ui-core-sh-form-field-experimental.mjs +42 -0
  8. package/fesm2022/ship-ui-core-sh-form-field-experimental.mjs.map +1 -0
  9. package/fesm2022/ship-ui-core-ship-accordion.mjs +127 -0
  10. package/fesm2022/ship-ui-core-ship-accordion.mjs.map +1 -0
  11. package/fesm2022/ship-ui-core-ship-alert.mjs +305 -0
  12. package/fesm2022/ship-ui-core-ship-alert.mjs.map +1 -0
  13. package/fesm2022/ship-ui-core-ship-blueprint.mjs +1156 -0
  14. package/fesm2022/ship-ui-core-ship-blueprint.mjs.map +1 -0
  15. package/fesm2022/ship-ui-core-ship-button-group.mjs +41 -0
  16. package/fesm2022/ship-ui-core-ship-button-group.mjs.map +1 -0
  17. package/fesm2022/ship-ui-core-ship-button.mjs +38 -0
  18. package/fesm2022/ship-ui-core-ship-button.mjs.map +1 -0
  19. package/fesm2022/ship-ui-core-ship-card.mjs +35 -0
  20. package/fesm2022/ship-ui-core-ship-card.mjs.map +1 -0
  21. package/fesm2022/ship-ui-core-ship-checkbox.mjs +113 -0
  22. package/fesm2022/ship-ui-core-ship-checkbox.mjs.map +1 -0
  23. package/fesm2022/ship-ui-core-ship-chip.mjs +44 -0
  24. package/fesm2022/ship-ui-core-ship-chip.mjs.map +1 -0
  25. package/fesm2022/ship-ui-core-ship-color-picker.mjs +947 -0
  26. package/fesm2022/ship-ui-core-ship-color-picker.mjs.map +1 -0
  27. package/fesm2022/ship-ui-core-ship-datepicker.mjs +951 -0
  28. package/fesm2022/ship-ui-core-ship-datepicker.mjs.map +1 -0
  29. package/fesm2022/ship-ui-core-ship-dialog.mjs +263 -0
  30. package/fesm2022/ship-ui-core-ship-dialog.mjs.map +1 -0
  31. package/fesm2022/ship-ui-core-ship-divider.mjs +22 -0
  32. package/fesm2022/ship-ui-core-ship-divider.mjs.map +1 -0
  33. package/fesm2022/ship-ui-core-ship-event-card.mjs +50 -0
  34. package/fesm2022/ship-ui-core-ship-event-card.mjs.map +1 -0
  35. package/fesm2022/ship-ui-core-ship-file-upload.mjs +112 -0
  36. package/fesm2022/ship-ui-core-ship-file-upload.mjs.map +1 -0
  37. package/fesm2022/ship-ui-core-ship-form-field.mjs +310 -0
  38. package/fesm2022/ship-ui-core-ship-form-field.mjs.map +1 -0
  39. package/fesm2022/ship-ui-core-ship-icon.mjs +81 -0
  40. package/fesm2022/ship-ui-core-ship-icon.mjs.map +1 -0
  41. package/fesm2022/ship-ui-core-ship-list.mjs +22 -0
  42. package/fesm2022/ship-ui-core-ship-list.mjs.map +1 -0
  43. package/fesm2022/ship-ui-core-ship-menu.mjs +545 -0
  44. package/fesm2022/ship-ui-core-ship-menu.mjs.map +1 -0
  45. package/fesm2022/ship-ui-core-ship-popover.mjs +286 -0
  46. package/fesm2022/ship-ui-core-ship-popover.mjs.map +1 -0
  47. package/fesm2022/ship-ui-core-ship-progress-bar.mjs +37 -0
  48. package/fesm2022/ship-ui-core-ship-progress-bar.mjs.map +1 -0
  49. package/fesm2022/ship-ui-core-ship-radio.mjs +102 -0
  50. package/fesm2022/ship-ui-core-ship-radio.mjs.map +1 -0
  51. package/fesm2022/ship-ui-core-ship-range-slider.mjs +277 -0
  52. package/fesm2022/ship-ui-core-ship-range-slider.mjs.map +1 -0
  53. package/fesm2022/ship-ui-core-ship-select.mjs +971 -0
  54. package/fesm2022/ship-ui-core-ship-select.mjs.map +1 -0
  55. package/fesm2022/ship-ui-core-ship-sidenav.mjs +248 -0
  56. package/fesm2022/ship-ui-core-ship-sidenav.mjs.map +1 -0
  57. package/fesm2022/ship-ui-core-ship-sortable.mjs +485 -0
  58. package/fesm2022/ship-ui-core-ship-sortable.mjs.map +1 -0
  59. package/fesm2022/ship-ui-core-ship-spinner.mjs +28 -0
  60. package/fesm2022/ship-ui-core-ship-spinner.mjs.map +1 -0
  61. package/fesm2022/ship-ui-core-ship-stepper.mjs +76 -0
  62. package/fesm2022/ship-ui-core-ship-stepper.mjs.map +1 -0
  63. package/fesm2022/ship-ui-core-ship-table-filter-bar.mjs +28 -0
  64. package/fesm2022/ship-ui-core-ship-table-filter-bar.mjs.map +1 -0
  65. package/fesm2022/ship-ui-core-ship-table.mjs +442 -0
  66. package/fesm2022/ship-ui-core-ship-table.mjs.map +1 -0
  67. package/fesm2022/ship-ui-core-ship-tabs.mjs +38 -0
  68. package/fesm2022/ship-ui-core-ship-tabs.mjs.map +1 -0
  69. package/fesm2022/ship-ui-core-ship-theme-toggle.mjs +119 -0
  70. package/fesm2022/ship-ui-core-ship-theme-toggle.mjs.map +1 -0
  71. package/fesm2022/ship-ui-core-ship-toggle-card.mjs +75 -0
  72. package/fesm2022/ship-ui-core-ship-toggle-card.mjs.map +1 -0
  73. package/fesm2022/ship-ui-core-ship-toggle.mjs +105 -0
  74. package/fesm2022/ship-ui-core-ship-toggle.mjs.map +1 -0
  75. package/fesm2022/ship-ui-core-ship-virtual-scroll.mjs +186 -0
  76. package/fesm2022/ship-ui-core-ship-virtual-scroll.mjs.map +1 -0
  77. package/fesm2022/ship-ui-core.mjs +880 -8782
  78. package/fesm2022/ship-ui-core.mjs.map +1 -1
  79. package/package.json +147 -3
  80. package/styles/core.scss +43 -0
  81. package/styles/helpers.scss +2 -0
  82. package/styles/index.scss +12 -123
  83. package/types/ship-ui-core-sh-form-field-experimental.d.ts +11 -0
  84. package/types/ship-ui-core-ship-accordion.d.ts +19 -0
  85. package/types/ship-ui-core-ship-alert.d.ts +68 -0
  86. package/types/ship-ui-core-ship-blueprint.d.ts +112 -0
  87. package/types/ship-ui-core-ship-button-group.d.ts +15 -0
  88. package/types/ship-ui-core-ship-button.d.ts +13 -0
  89. package/types/ship-ui-core-ship-card.d.ts +11 -0
  90. package/types/ship-ui-core-ship-checkbox.d.ts +22 -0
  91. package/types/ship-ui-core-ship-chip.d.ts +15 -0
  92. package/types/ship-ui-core-ship-color-picker.d.ts +105 -0
  93. package/types/ship-ui-core-ship-datepicker.d.ts +96 -0
  94. package/types/ship-ui-core-ship-dialog.d.ts +76 -0
  95. package/types/ship-ui-core-ship-divider.d.ts +8 -0
  96. package/types/ship-ui-core-ship-event-card.d.ts +11 -0
  97. package/types/ship-ui-core-ship-file-upload.d.ts +20 -0
  98. package/types/ship-ui-core-ship-form-field.d.ts +32 -0
  99. package/types/ship-ui-core-ship-icon.d.ts +18 -0
  100. package/types/ship-ui-core-ship-list.d.ts +8 -0
  101. package/types/ship-ui-core-ship-menu.d.ts +49 -0
  102. package/types/ship-ui-core-ship-popover.d.ts +40 -0
  103. package/types/ship-ui-core-ship-progress-bar.d.ts +14 -0
  104. package/types/ship-ui-core-ship-radio.d.ts +22 -0
  105. package/types/ship-ui-core-ship-range-slider.d.ts +31 -0
  106. package/types/ship-ui-core-ship-select.d.ts +81 -0
  107. package/types/ship-ui-core-ship-sidenav.d.ts +36 -0
  108. package/types/ship-ui-core-ship-sortable.d.ts +72 -0
  109. package/types/ship-ui-core-ship-spinner.d.ts +10 -0
  110. package/types/ship-ui-core-ship-stepper.d.ts +13 -0
  111. package/types/ship-ui-core-ship-table-filter-bar.d.ts +8 -0
  112. package/types/ship-ui-core-ship-table.d.ts +69 -0
  113. package/types/ship-ui-core-ship-tabs.d.ts +14 -0
  114. package/types/ship-ui-core-ship-theme-toggle.d.ts +28 -0
  115. package/types/ship-ui-core-ship-toggle-card.d.ts +15 -0
  116. package/types/ship-ui-core-ship-toggle.d.ts +21 -0
  117. package/types/ship-ui-core-ship-virtual-scroll.d.ts +22 -0
  118. package/types/ship-ui-core.d.ts +88 -1070
  119. package/styles/components/ship-accordion.scss +0 -113
  120. package/styles/components/ship-alert-container.scss +0 -49
  121. package/styles/components/ship-alert.scss +0 -177
  122. package/styles/components/ship-blueprint.scss +0 -242
  123. package/styles/components/ship-button-group.scss +0 -165
  124. package/styles/components/ship-button.scss +0 -141
  125. package/styles/components/ship-card.scss +0 -57
  126. package/styles/components/ship-checkbox.scss +0 -116
  127. package/styles/components/ship-chip.scss +0 -104
  128. package/styles/components/ship-color-picker.scss +0 -150
  129. package/styles/components/ship-datepicker.scss +0 -317
  130. package/styles/components/ship-dialog.scss +0 -152
  131. package/styles/components/ship-divider.scss +0 -27
  132. package/styles/components/ship-event-card.scss +0 -51
  133. package/styles/components/ship-file-upload.scss +0 -47
  134. package/styles/components/ship-form-field.scss +0 -408
  135. package/styles/components/ship-icon.scss +0 -54
  136. package/styles/components/ship-list.scss +0 -165
  137. package/styles/components/ship-menu.scss +0 -237
  138. package/styles/components/ship-popover.scss +0 -205
  139. package/styles/components/ship-progress-bar.scss +0 -173
  140. package/styles/components/ship-radio.scss +0 -113
  141. package/styles/components/ship-range-slider.scss +0 -421
  142. package/styles/components/ship-select.scss +0 -153
  143. package/styles/components/ship-sidenav.scss +0 -195
  144. package/styles/components/ship-sortable.scss +0 -45
  145. package/styles/components/ship-spinner.scss +0 -53
  146. package/styles/components/ship-stepper.scss +0 -158
  147. package/styles/components/ship-table.scss +0 -443
  148. package/styles/components/ship-tabs.scss +0 -125
  149. package/styles/components/ship-theme-toggle.scss +0 -41
  150. package/styles/components/ship-toggle-card.scss +0 -69
  151. package/styles/components/ship-toggle.scss +0 -255
  152. package/styles/components/ship-tooltip.scss +0 -151
  153. package/styles/components/ship-virtual-scroll.scss +0 -12
@@ -0,0 +1,76 @@
1
+ import * as i0 from '@angular/core';
2
+ import { input, inject, DestroyRef, effect, ChangeDetectionStrategy, ViewEncapsulation, Component } from '@angular/core';
3
+ import { ShipSelectionGroup, shipComponentClasses } from '@ship-ui/core';
4
+
5
+ class ShipStepper extends ShipSelectionGroup {
6
+ constructor() {
7
+ super('[value], [step], [routerLinkActive], button, a', 'active', { hostRole: 'tablist', itemRole: 'tab' });
8
+ this.color = input(null, /* @ts-ignore */
9
+ ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
10
+ this.hostClasses = shipComponentClasses('stepper', {
11
+ color: this.color,
12
+ });
13
+ const destroyRef = inject(DestroyRef);
14
+ effect(() => {
15
+ this.items().forEach((item) => {
16
+ if (!item.querySelector('.sh-radio')) {
17
+ const shRadio = document.createElement('div');
18
+ shRadio.className = 'sh-radio';
19
+ const shRadioContent = document.createElement('div');
20
+ shRadioContent.className = 'radio sh-sheet';
21
+ shRadio.append(shRadioContent);
22
+ item.prepend(shRadio);
23
+ }
24
+ });
25
+ });
26
+ effect(() => {
27
+ this.items(); // track projected items
28
+ this.updateProgress();
29
+ });
30
+ if (typeof MutationObserver !== 'undefined') {
31
+ const observer = new MutationObserver(() => {
32
+ this.updateProgress();
33
+ });
34
+ observer.observe(this.hostElement, {
35
+ attributes: true,
36
+ subtree: true,
37
+ attributeFilter: ['class'],
38
+ });
39
+ destroyRef.onDestroy(() => {
40
+ observer.disconnect();
41
+ });
42
+ }
43
+ }
44
+ updateProgress() {
45
+ const items = Array.from(this.hostElement.querySelectorAll('[value], [step], [routerLinkActive], button, a'));
46
+ let activeIndex = items.findIndex((item) => item.classList.contains(this.activeClass));
47
+ if (activeIndex === -1) {
48
+ activeIndex = 0;
49
+ }
50
+ const totalItems = items.length;
51
+ let progress = 0;
52
+ if (totalItems > 1) {
53
+ progress = (activeIndex / (totalItems - 1)) * 100;
54
+ }
55
+ this.hostElement.style.setProperty('--stepper-progress', `${progress}%`);
56
+ }
57
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: ShipStepper, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
58
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.0", type: ShipStepper, isStandalone: true, selector: "sh-stepper", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" } }, usesInheritance: true, ngImport: i0, template: `
59
+ <ng-content />
60
+ `, isInline: true, styles: [".sh-radio,sh-radio{--radiod-c: var(--base-8);--radiod-o: 0;--radio-bc: var(--base-4);display:flex;align-items:center;gap:.5rem;cursor:pointer;-webkit-user-select:none;user-select:none;position:relative}.sh-radio:focus-visible>.radio,.sh-radio:has(input:focus-visible)>.radio,sh-radio:focus-visible>.radio,sh-radio:has(input:focus-visible)>.radio{outline:2px solid var(--primary-8);outline-offset:2px}.sh-radio>input,sh-radio>input{appearance:none;position:absolute;inset:0;cursor:pointer}.sh-radio>input:focus,.sh-radio>input:focus-visible,sh-radio>input:focus,sh-radio>input:focus-visible{outline:none}.sh-radio:has(>input:not(.internal-input))>input.internal-input,sh-radio:has(>input:not(.internal-input))>input.internal-input{display:none}.sh-radio:has(input[disabled]),.sh-radio[disabled]:not([disabled=false]),sh-radio:has(input[disabled]),sh-radio[disabled]:not([disabled=false]){opacity:.5;pointer-events:none;-webkit-user-select:none;user-select:none;cursor:initial}.sh-radio:has(input:checked),.sh-radio.active,sh-radio:has(input:checked),sh-radio.active{--radiod-o: 1}.sh-radio .radio,sh-radio .radio{display:flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;cursor:pointer;position:relative;border-radius:50%}.sh-radio .radio:after,sh-radio .radio:after{content:\"\";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border-radius:50%;width:.375rem;height:.375rem;background-color:var(--radiod-c);opacity:var(--radiod-o);transition:opacity 125ms linear}.sh-radio.primary,sh-radio.primary{--radiod-c: var(--primary-8)}.sh-radio.accent,sh-radio.accent{--radiod-c: var(--accent-8)}.sh-radio.warn,sh-radio.warn{--radiod-c: var(--warn-8)}.sh-radio.error,sh-radio.error{--radiod-c: var(--error-8)}.sh-radio.success,sh-radio.success{--radiod-c: var(--success-8)}.sh-radio.flat,.sh-radio.raised,sh-radio.flat,sh-radio.raised{--radiod-c: #fff}.sh-radio.raised:not(:has(input:checked)):not(.active) .radio,.sh-radio.flat:not(:has(input:checked)):not(.active) .radio,sh-radio.raised:not(:has(input:checked)):not(.active) .radio,sh-radio.flat:not(:has(input:checked)):not(.active) .radio{background:transparent;border:var(--border-10);border-color:var(--radio-bc)}sh-stepper{--step-track-bg: var(--base-3);--step-c: var(--base-6);--step-radio-cbg: var(--base-1);--step-radio-c: var(--base-g2);--step-active-c: var(--base-8);display:flex;flex-wrap:nowrap;width:100%;position:relative}sh-stepper.primary{--step-c: var(--primary-6);--step-radio-cbg: var(--primary-1);--step-radio-c: var(--primary-g2);--step-active-c: var(--primary-8)}sh-stepper.accent{--step-c: var(--accent-6);--step-radio-cbg: var(--accent-1);--step-radio-c: var(--accent-g2);--step-active-c: var(--accent-8)}sh-stepper.warn{--step-c: var(--warn-6);--step-radio-cbg: var(--warn-1);--step-radio-c: var(--warn-g2);--step-active-c: var(--warn-8)}sh-stepper.error{--step-c: var(--error-6);--step-radio-cbg: var(--error-1);--step-radio-c: var(--error-g2);--step-active-c: var(--error-8)}sh-stepper.success{--step-c: var(--success-6);--step-radio-cbg: var(--success-1);--step-radio-c: var(--success-g2);--step-active-c: var(--success-8)}sh-stepper button{background:transparent;border:0;padding:0}sh-stepper button,sh-stepper [routerLinkActive],sh-stepper [step],sh-stepper [value]{flex:2 0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:.5rem;position:relative;color:var(--base-8);cursor:pointer;-webkit-user-select:none;user-select:none;outline:none;z-index:1}sh-stepper button:focus-visible .sh-radio,sh-stepper [routerLinkActive]:focus-visible .sh-radio,sh-stepper [step]:focus-visible .sh-radio,sh-stepper [value]:focus-visible .sh-radio{outline:2px solid var(--primary-8);outline-offset:2px;border-radius:50%}sh-stepper button:first-child,sh-stepper [routerLinkActive]:first-child,sh-stepper [step]:first-child,sh-stepper [value]:first-child{align-items:flex-start;flex:1 0}sh-stepper button:last-child,sh-stepper [routerLinkActive]:last-child,sh-stepper [step]:last-child,sh-stepper [value]:last-child{align-items:flex-end;flex:1 0;text-align:end}sh-stepper button:not(.active) .sh-radio,sh-stepper [routerLinkActive]:not(.active) .sh-radio,sh-stepper [step]:not(.active) .sh-radio,sh-stepper [value]:not(.active) .sh-radio{z-index:10}sh-stepper button:has(~button.active) .sh-radio,sh-stepper button:has(~[step].active) .sh-radio,sh-stepper button:has(~[routerLinkActive].active) .sh-radio,sh-stepper button:has(~[value].active) .sh-radio,sh-stepper [routerLinkActive]:has(~button.active) .sh-radio,sh-stepper [routerLinkActive]:has(~[step].active) .sh-radio,sh-stepper [routerLinkActive]:has(~[routerLinkActive].active) .sh-radio,sh-stepper [routerLinkActive]:has(~[value].active) .sh-radio,sh-stepper [step]:has(~button.active) .sh-radio,sh-stepper [step]:has(~[step].active) .sh-radio,sh-stepper [step]:has(~[routerLinkActive].active) .sh-radio,sh-stepper [step]:has(~[value].active) .sh-radio,sh-stepper [value]:has(~button.active) .sh-radio,sh-stepper [value]:has(~[step].active) .sh-radio,sh-stepper [value]:has(~[routerLinkActive].active) .sh-radio,sh-stepper [value]:has(~[value].active) .sh-radio{--radiod-o: 1}sh-stepper button:has(~button.active) .sh-radio .radio,sh-stepper button:has(~[step].active) .sh-radio .radio,sh-stepper button:has(~[routerLinkActive].active) .sh-radio .radio,sh-stepper button:has(~[value].active) .sh-radio .radio,sh-stepper [routerLinkActive]:has(~button.active) .sh-radio .radio,sh-stepper [routerLinkActive]:has(~[step].active) .sh-radio .radio,sh-stepper [routerLinkActive]:has(~[routerLinkActive].active) .sh-radio .radio,sh-stepper [routerLinkActive]:has(~[value].active) .sh-radio .radio,sh-stepper [step]:has(~button.active) .sh-radio .radio,sh-stepper [step]:has(~[step].active) .sh-radio .radio,sh-stepper [step]:has(~[routerLinkActive].active) .sh-radio .radio,sh-stepper [step]:has(~[value].active) .sh-radio .radio,sh-stepper [value]:has(~button.active) .sh-radio .radio,sh-stepper [value]:has(~[step].active) .sh-radio .radio,sh-stepper [value]:has(~[routerLinkActive].active) .sh-radio .radio,sh-stepper [value]:has(~[value].active) .sh-radio .radio{border-width:0;background:var(--step-radio-c)}sh-stepper button .sh-radio .radio,sh-stepper [routerLinkActive] .sh-radio .radio,sh-stepper [step] .sh-radio .radio,sh-stepper [value] .sh-radio .radio{--radiod-c: var(--step-radio-cbg);width:1rem;height:1rem}sh-stepper button.active,sh-stepper [routerLinkActive].active,sh-stepper [step].active,sh-stepper [value].active{color:var(--step-active-c);outline:none}sh-stepper button.active .sh-radio,sh-stepper [routerLinkActive].active .sh-radio,sh-stepper [step].active .sh-radio,sh-stepper [value].active .sh-radio{z-index:0;--radiod-o: 1}sh-stepper button.active .sh-radio .radio,sh-stepper [routerLinkActive].active .sh-radio .radio,sh-stepper [step].active .sh-radio .radio,sh-stepper [value].active .sh-radio .radio{border-width:0;background:var(--step-radio-c)}sh-stepper:before{content:\"\";position:absolute;top:.375rem;left:0;z-index:0;right:0;height:.25rem;background-color:var(--step-track-bg)}sh-stepper:after{content:\"\";position:absolute;top:.375rem;left:0;z-index:0;width:var(--stepper-progress, 0%);height:.25rem;background-color:var(--step-active-c);transition:width .15s ease-out}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
61
+ }
62
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: ShipStepper, decorators: [{
63
+ type: Component,
64
+ args: [{ selector: 'sh-stepper', encapsulation: ViewEncapsulation.None, imports: [], template: `
65
+ <ng-content />
66
+ `, changeDetection: ChangeDetectionStrategy.OnPush, host: {
67
+ '[class]': 'hostClasses()',
68
+ }, styles: [".sh-radio,sh-radio{--radiod-c: var(--base-8);--radiod-o: 0;--radio-bc: var(--base-4);display:flex;align-items:center;gap:.5rem;cursor:pointer;-webkit-user-select:none;user-select:none;position:relative}.sh-radio:focus-visible>.radio,.sh-radio:has(input:focus-visible)>.radio,sh-radio:focus-visible>.radio,sh-radio:has(input:focus-visible)>.radio{outline:2px solid var(--primary-8);outline-offset:2px}.sh-radio>input,sh-radio>input{appearance:none;position:absolute;inset:0;cursor:pointer}.sh-radio>input:focus,.sh-radio>input:focus-visible,sh-radio>input:focus,sh-radio>input:focus-visible{outline:none}.sh-radio:has(>input:not(.internal-input))>input.internal-input,sh-radio:has(>input:not(.internal-input))>input.internal-input{display:none}.sh-radio:has(input[disabled]),.sh-radio[disabled]:not([disabled=false]),sh-radio:has(input[disabled]),sh-radio[disabled]:not([disabled=false]){opacity:.5;pointer-events:none;-webkit-user-select:none;user-select:none;cursor:initial}.sh-radio:has(input:checked),.sh-radio.active,sh-radio:has(input:checked),sh-radio.active{--radiod-o: 1}.sh-radio .radio,sh-radio .radio{display:flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;cursor:pointer;position:relative;border-radius:50%}.sh-radio .radio:after,sh-radio .radio:after{content:\"\";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border-radius:50%;width:.375rem;height:.375rem;background-color:var(--radiod-c);opacity:var(--radiod-o);transition:opacity 125ms linear}.sh-radio.primary,sh-radio.primary{--radiod-c: var(--primary-8)}.sh-radio.accent,sh-radio.accent{--radiod-c: var(--accent-8)}.sh-radio.warn,sh-radio.warn{--radiod-c: var(--warn-8)}.sh-radio.error,sh-radio.error{--radiod-c: var(--error-8)}.sh-radio.success,sh-radio.success{--radiod-c: var(--success-8)}.sh-radio.flat,.sh-radio.raised,sh-radio.flat,sh-radio.raised{--radiod-c: #fff}.sh-radio.raised:not(:has(input:checked)):not(.active) .radio,.sh-radio.flat:not(:has(input:checked)):not(.active) .radio,sh-radio.raised:not(:has(input:checked)):not(.active) .radio,sh-radio.flat:not(:has(input:checked)):not(.active) .radio{background:transparent;border:var(--border-10);border-color:var(--radio-bc)}sh-stepper{--step-track-bg: var(--base-3);--step-c: var(--base-6);--step-radio-cbg: var(--base-1);--step-radio-c: var(--base-g2);--step-active-c: var(--base-8);display:flex;flex-wrap:nowrap;width:100%;position:relative}sh-stepper.primary{--step-c: var(--primary-6);--step-radio-cbg: var(--primary-1);--step-radio-c: var(--primary-g2);--step-active-c: var(--primary-8)}sh-stepper.accent{--step-c: var(--accent-6);--step-radio-cbg: var(--accent-1);--step-radio-c: var(--accent-g2);--step-active-c: var(--accent-8)}sh-stepper.warn{--step-c: var(--warn-6);--step-radio-cbg: var(--warn-1);--step-radio-c: var(--warn-g2);--step-active-c: var(--warn-8)}sh-stepper.error{--step-c: var(--error-6);--step-radio-cbg: var(--error-1);--step-radio-c: var(--error-g2);--step-active-c: var(--error-8)}sh-stepper.success{--step-c: var(--success-6);--step-radio-cbg: var(--success-1);--step-radio-c: var(--success-g2);--step-active-c: var(--success-8)}sh-stepper button{background:transparent;border:0;padding:0}sh-stepper button,sh-stepper [routerLinkActive],sh-stepper [step],sh-stepper [value]{flex:2 0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:.5rem;position:relative;color:var(--base-8);cursor:pointer;-webkit-user-select:none;user-select:none;outline:none;z-index:1}sh-stepper button:focus-visible .sh-radio,sh-stepper [routerLinkActive]:focus-visible .sh-radio,sh-stepper [step]:focus-visible .sh-radio,sh-stepper [value]:focus-visible .sh-radio{outline:2px solid var(--primary-8);outline-offset:2px;border-radius:50%}sh-stepper button:first-child,sh-stepper [routerLinkActive]:first-child,sh-stepper [step]:first-child,sh-stepper [value]:first-child{align-items:flex-start;flex:1 0}sh-stepper button:last-child,sh-stepper [routerLinkActive]:last-child,sh-stepper [step]:last-child,sh-stepper [value]:last-child{align-items:flex-end;flex:1 0;text-align:end}sh-stepper button:not(.active) .sh-radio,sh-stepper [routerLinkActive]:not(.active) .sh-radio,sh-stepper [step]:not(.active) .sh-radio,sh-stepper [value]:not(.active) .sh-radio{z-index:10}sh-stepper button:has(~button.active) .sh-radio,sh-stepper button:has(~[step].active) .sh-radio,sh-stepper button:has(~[routerLinkActive].active) .sh-radio,sh-stepper button:has(~[value].active) .sh-radio,sh-stepper [routerLinkActive]:has(~button.active) .sh-radio,sh-stepper [routerLinkActive]:has(~[step].active) .sh-radio,sh-stepper [routerLinkActive]:has(~[routerLinkActive].active) .sh-radio,sh-stepper [routerLinkActive]:has(~[value].active) .sh-radio,sh-stepper [step]:has(~button.active) .sh-radio,sh-stepper [step]:has(~[step].active) .sh-radio,sh-stepper [step]:has(~[routerLinkActive].active) .sh-radio,sh-stepper [step]:has(~[value].active) .sh-radio,sh-stepper [value]:has(~button.active) .sh-radio,sh-stepper [value]:has(~[step].active) .sh-radio,sh-stepper [value]:has(~[routerLinkActive].active) .sh-radio,sh-stepper [value]:has(~[value].active) .sh-radio{--radiod-o: 1}sh-stepper button:has(~button.active) .sh-radio .radio,sh-stepper button:has(~[step].active) .sh-radio .radio,sh-stepper button:has(~[routerLinkActive].active) .sh-radio .radio,sh-stepper button:has(~[value].active) .sh-radio .radio,sh-stepper [routerLinkActive]:has(~button.active) .sh-radio .radio,sh-stepper [routerLinkActive]:has(~[step].active) .sh-radio .radio,sh-stepper [routerLinkActive]:has(~[routerLinkActive].active) .sh-radio .radio,sh-stepper [routerLinkActive]:has(~[value].active) .sh-radio .radio,sh-stepper [step]:has(~button.active) .sh-radio .radio,sh-stepper [step]:has(~[step].active) .sh-radio .radio,sh-stepper [step]:has(~[routerLinkActive].active) .sh-radio .radio,sh-stepper [step]:has(~[value].active) .sh-radio .radio,sh-stepper [value]:has(~button.active) .sh-radio .radio,sh-stepper [value]:has(~[step].active) .sh-radio .radio,sh-stepper [value]:has(~[routerLinkActive].active) .sh-radio .radio,sh-stepper [value]:has(~[value].active) .sh-radio .radio{border-width:0;background:var(--step-radio-c)}sh-stepper button .sh-radio .radio,sh-stepper [routerLinkActive] .sh-radio .radio,sh-stepper [step] .sh-radio .radio,sh-stepper [value] .sh-radio .radio{--radiod-c: var(--step-radio-cbg);width:1rem;height:1rem}sh-stepper button.active,sh-stepper [routerLinkActive].active,sh-stepper [step].active,sh-stepper [value].active{color:var(--step-active-c);outline:none}sh-stepper button.active .sh-radio,sh-stepper [routerLinkActive].active .sh-radio,sh-stepper [step].active .sh-radio,sh-stepper [value].active .sh-radio{z-index:0;--radiod-o: 1}sh-stepper button.active .sh-radio .radio,sh-stepper [routerLinkActive].active .sh-radio .radio,sh-stepper [step].active .sh-radio .radio,sh-stepper [value].active .sh-radio .radio{border-width:0;background:var(--step-radio-c)}sh-stepper:before{content:\"\";position:absolute;top:.375rem;left:0;z-index:0;right:0;height:.25rem;background-color:var(--step-track-bg)}sh-stepper:after{content:\"\";position:absolute;top:.375rem;left:0;z-index:0;width:var(--stepper-progress, 0%);height:.25rem;background-color:var(--step-active-c);transition:width .15s ease-out}\n"] }]
69
+ }], ctorParameters: () => [], propDecorators: { color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }] } });
70
+
71
+ /**
72
+ * Generated bundle index. Do not edit.
73
+ */
74
+
75
+ export { ShipStepper };
76
+ //# sourceMappingURL=ship-ui-core-ship-stepper.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ship-ui-core-ship-stepper.mjs","sources":["../../../projects/ship-ui/ship-stepper/ship-stepper.ts","../../../projects/ship-ui/ship-stepper/ship-ui-core-ship-stepper.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n DestroyRef,\n effect,\n inject,\n input,\n ViewEncapsulation,\n} from '@angular/core';\nimport { ShipColor, shipComponentClasses, ShipSelectionGroup } from '@ship-ui/core';\n\n@Component({\n selector: 'sh-stepper',\n styleUrl: './ship-stepper.scss',\n encapsulation: ViewEncapsulation.None,\n imports: [],\n template: `\n <ng-content />\n `,\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n '[class]': 'hostClasses()',\n },\n})\nexport class ShipStepper extends ShipSelectionGroup<string> {\n color = input<ShipColor | null>(null);\n\n constructor() {\n super('[value], [step], [routerLinkActive], button, a', 'active', { hostRole: 'tablist', itemRole: 'tab' });\n\n const destroyRef = inject(DestroyRef);\n\n effect(() => {\n this.items().forEach((item) => {\n if (!item.querySelector('.sh-radio')) {\n const shRadio = document.createElement('div');\n shRadio.className = 'sh-radio';\n\n const shRadioContent = document.createElement('div');\n shRadioContent.className = 'radio sh-sheet';\n\n shRadio.append(shRadioContent);\n item.prepend(shRadio);\n }\n });\n });\n\n effect(() => {\n this.items(); // track projected items\n this.updateProgress();\n });\n\n if (typeof MutationObserver !== 'undefined') {\n const observer = new MutationObserver(() => {\n this.updateProgress();\n });\n\n observer.observe(this.hostElement, {\n attributes: true,\n subtree: true,\n attributeFilter: ['class'],\n });\n\n destroyRef.onDestroy(() => {\n observer.disconnect();\n });\n }\n }\n\n updateProgress() {\n const items = Array.from(\n this.hostElement.querySelectorAll('[value], [step], [routerLinkActive], button, a')\n ) as HTMLElement[];\n let activeIndex = items.findIndex((item) => item.classList.contains(this.activeClass));\n\n if (activeIndex === -1) {\n activeIndex = 0;\n }\n\n const totalItems = items.length;\n let progress = 0;\n if (totalItems > 1) {\n progress = (activeIndex / (totalItems - 1)) * 100;\n }\n\n this.hostElement.style.setProperty('--stepper-progress', `${progress}%`);\n }\n\n hostClasses = shipComponentClasses('stepper', {\n color: this.color,\n });\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;AAwBM,MAAO,WAAY,SAAQ,kBAA0B,CAAA;AAGzD,IAAA,WAAA,GAAA;AACE,QAAA,KAAK,CAAC,gDAAgD,EAAE,QAAQ,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC;QAH7G,IAAA,CAAA,KAAK,GAAG,KAAK,CAAmB,IAAI;kFAAC;AA+DrC,QAAA,IAAA,CAAA,WAAW,GAAG,oBAAoB,CAAC,SAAS,EAAE;YAC5C,KAAK,EAAE,IAAI,CAAC,KAAK;AAClB,SAAA,CAAC;AA5DA,QAAA,MAAM,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC;QAErC,MAAM,CAAC,MAAK;YACV,IAAI,CAAC,KAAK,EAAE,CAAC,OAAO,CAAC,CAAC,IAAI,KAAI;gBAC5B,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,WAAW,CAAC,EAAE;oBACpC,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;AAC7C,oBAAA,OAAO,CAAC,SAAS,GAAG,UAAU;oBAE9B,MAAM,cAAc,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;AACpD,oBAAA,cAAc,CAAC,SAAS,GAAG,gBAAgB;AAE3C,oBAAA,OAAO,CAAC,MAAM,CAAC,cAAc,CAAC;AAC9B,oBAAA,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC;gBACvB;AACF,YAAA,CAAC,CAAC;AACJ,QAAA,CAAC,CAAC;QAEF,MAAM,CAAC,MAAK;AACV,YAAA,IAAI,CAAC,KAAK,EAAE,CAAC;YACb,IAAI,CAAC,cAAc,EAAE;AACvB,QAAA,CAAC,CAAC;AAEF,QAAA,IAAI,OAAO,gBAAgB,KAAK,WAAW,EAAE;AAC3C,YAAA,MAAM,QAAQ,GAAG,IAAI,gBAAgB,CAAC,MAAK;gBACzC,IAAI,CAAC,cAAc,EAAE;AACvB,YAAA,CAAC,CAAC;AAEF,YAAA,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,WAAW,EAAE;AACjC,gBAAA,UAAU,EAAE,IAAI;AAChB,gBAAA,OAAO,EAAE,IAAI;gBACb,eAAe,EAAE,CAAC,OAAO,CAAC;AAC3B,aAAA,CAAC;AAEF,YAAA,UAAU,CAAC,SAAS,CAAC,MAAK;gBACxB,QAAQ,CAAC,UAAU,EAAE;AACvB,YAAA,CAAC,CAAC;QACJ;IACF;IAEA,cAAc,GAAA;AACZ,QAAA,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CACtB,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAAC,gDAAgD,CAAC,CACnE;QAClB,IAAI,WAAW,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;AAEtF,QAAA,IAAI,WAAW,KAAK,CAAC,CAAC,EAAE;YACtB,WAAW,GAAG,CAAC;QACjB;AAEA,QAAA,MAAM,UAAU,GAAG,KAAK,CAAC,MAAM;QAC/B,IAAI,QAAQ,GAAG,CAAC;AAChB,QAAA,IAAI,UAAU,GAAG,CAAC,EAAE;AAClB,YAAA,QAAQ,GAAG,CAAC,WAAW,IAAI,UAAU,GAAG,CAAC,CAAC,IAAI,GAAG;QACnD;AAEA,QAAA,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,WAAW,CAAC,oBAAoB,EAAE,CAAA,EAAG,QAAQ,CAAA,CAAA,CAAG,CAAC;IAC1E;8GA9DW,WAAW,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAX,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,WAAW,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,eAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EARZ;;AAET,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,soOAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FAMU,WAAW,EAAA,UAAA,EAAA,CAAA;kBAbvB,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,YAAY,iBAEP,iBAAiB,CAAC,IAAI,EAAA,OAAA,EAC5B,EAAE,EAAA,QAAA,EACD;;GAET,EAAA,eAAA,EACgB,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC;AACJ,wBAAA,SAAS,EAAE,eAAe;AAC3B,qBAAA,EAAA,MAAA,EAAA,CAAA,soOAAA,CAAA,EAAA;;;ACtBH;;AAEG;;;;"}
@@ -0,0 +1,28 @@
1
+ import * as i0 from '@angular/core';
2
+ import { ChangeDetectionStrategy, Component } from '@angular/core';
3
+
4
+ class ShipTableFilterBar {
5
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: ShipTableFilterBar, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
6
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.0", type: ShipTableFilterBar, isStandalone: true, selector: "sh-table-filter-bar", ngImport: i0, template: `
7
+ <ng-content />
8
+ `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
9
+ }
10
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: ShipTableFilterBar, decorators: [{
11
+ type: Component,
12
+ args: [{
13
+ selector: 'sh-table-filter-bar',
14
+ standalone: true,
15
+ imports: [],
16
+ template: `
17
+ <ng-content />
18
+ `,
19
+ changeDetection: ChangeDetectionStrategy.OnPush,
20
+ }]
21
+ }] });
22
+
23
+ /**
24
+ * Generated bundle index. Do not edit.
25
+ */
26
+
27
+ export { ShipTableFilterBar };
28
+ //# sourceMappingURL=ship-ui-core-ship-table-filter-bar.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ship-ui-core-ship-table-filter-bar.mjs","sources":["../../../projects/ship-ui/ship-table-filter-bar/ship-table-filter-bar.ts","../../../projects/ship-ui/ship-table-filter-bar/ship-ui-core-ship-table-filter-bar.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n selector: 'sh-table-filter-bar',\n standalone: true,\n imports: [],\n template: `\n <ng-content />\n `,\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ShipTableFilterBar {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;MAWa,kBAAkB,CAAA;8GAAlB,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAlB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,kBAAkB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EALnB;;AAET,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAGU,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAT9B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,qBAAqB;AAC/B,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,OAAO,EAAE,EAAE;AACX,oBAAA,QAAQ,EAAE;;AAET,EAAA,CAAA;oBACD,eAAe,EAAE,uBAAuB,CAAC,MAAM;AAChD,iBAAA;;;ACVD;;AAEG;;;;"}
@@ -0,0 +1,442 @@
1
+ import * as i0 from '@angular/core';
2
+ import { inject, ElementRef, Renderer2, input, HostListener, Directive, computed, output, model, viewChild, signal, DestroyRef, effect, ChangeDetectionStrategy, ViewEncapsulation, Component } from '@angular/core';
3
+ import { ShipProgressBar } from '@ship-ui/core/ship-progress-bar';
4
+ import { shipComponentClasses, observeChildren } from '@ship-ui/core';
5
+
6
+ class ShipResize {
7
+ constructor() {
8
+ this.#el = inject(ElementRef);
9
+ this.#renderer = inject(Renderer2);
10
+ this.#table = inject(ShipTable);
11
+ this.resizable = input(true, /* @ts-ignore */
12
+ ...(ngDevMode ? [{ debugName: "resizable" }] : /* istanbul ignore next */ []));
13
+ this.minWidth = input(50, /* @ts-ignore */
14
+ ...(ngDevMode ? [{ debugName: "minWidth" }] : /* istanbul ignore next */ []));
15
+ this.maxWidth = input(null, /* @ts-ignore */
16
+ ...(ngDevMode ? [{ debugName: "maxWidth" }] : /* istanbul ignore next */ []));
17
+ this.#resizing = false;
18
+ this.#animationFrameRequest = null; // Store request ID
19
+ }
20
+ #el;
21
+ #renderer;
22
+ #table;
23
+ #startX;
24
+ #startWidth;
25
+ #resizing;
26
+ #animationFrameRequest; // Store request ID
27
+ ngOnInit() {
28
+ if (!this.#table) {
29
+ console.error('shTableResize directive must be used within a sh-table component.');
30
+ return;
31
+ }
32
+ if (this.resizable()) {
33
+ const resizer = this.#renderer.createElement('div');
34
+ this.#renderer.addClass(resizer, 'sh-resizer');
35
+ this.#renderer.appendChild(this.#el.nativeElement, resizer);
36
+ this.#renderer.listen(resizer, 'mousedown', this.#onMouseDown.bind(this));
37
+ }
38
+ }
39
+ onMouseMove(event) {
40
+ if (!this.#resizing)
41
+ return;
42
+ this.#scheduleResize(event);
43
+ }
44
+ onMouseUp(event) {
45
+ if (this.#resizing) {
46
+ this.#resizing = false;
47
+ this.#table.resizing.set(false);
48
+ if (this.#animationFrameRequest !== null) {
49
+ cancelAnimationFrame(this.#animationFrameRequest);
50
+ this.#animationFrameRequest = null;
51
+ }
52
+ }
53
+ }
54
+ onClick(event) {
55
+ if (this.#resizing) {
56
+ event.stopPropagation();
57
+ }
58
+ }
59
+ #onMouseDown(event) {
60
+ event.stopPropagation();
61
+ if (!this.resizable())
62
+ return;
63
+ this.#table.resizing.set(true);
64
+ this.#resizing = true;
65
+ this.#startX = event.pageX;
66
+ this.#startWidth = this.#el.nativeElement.offsetWidth;
67
+ }
68
+ #scheduleResize(event) {
69
+ if (this.#animationFrameRequest !== null) {
70
+ cancelAnimationFrame(this.#animationFrameRequest);
71
+ }
72
+ this.#animationFrameRequest = requestAnimationFrame(() => {
73
+ this.#resizeColumn(event);
74
+ this.#animationFrameRequest = null;
75
+ });
76
+ }
77
+ #resizeColumn(event) {
78
+ const width = this.#startWidth + (event.pageX - this.#startX);
79
+ const constrainedWidth = Math.max(this.minWidth(), this.maxWidth() ? Math.min(width, this.maxWidth() ?? width) : width);
80
+ this.#renderer.setAttribute(this.#el.nativeElement, 'size', `${constrainedWidth}px`);
81
+ this.#table.updateColumnSizes();
82
+ }
83
+ ngOnDestroy() {
84
+ if (this.#animationFrameRequest !== null) {
85
+ cancelAnimationFrame(this.#animationFrameRequest);
86
+ }
87
+ }
88
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: ShipResize, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
89
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.0", type: ShipResize, isStandalone: true, selector: "[shResize]", inputs: { resizable: { classPropertyName: "resizable", publicName: "resizable", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "document:mousemove": "onMouseMove($event)", "document:mouseup": "onMouseUp($event)", "document:click": "onClick($event)" } }, ngImport: i0 }); }
90
+ }
91
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: ShipResize, decorators: [{
92
+ type: Directive,
93
+ args: [{
94
+ selector: '[shResize]',
95
+ standalone: true,
96
+ }]
97
+ }], propDecorators: { resizable: [{ type: i0.Input, args: [{ isSignal: true, alias: "resizable", required: false }] }], minWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "minWidth", required: false }] }], maxWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxWidth", required: false }] }], onMouseMove: [{
98
+ type: HostListener,
99
+ args: ['document:mousemove', ['$event']]
100
+ }], onMouseUp: [{
101
+ type: HostListener,
102
+ args: ['document:mouseup', ['$event']]
103
+ }], onClick: [{
104
+ type: HostListener,
105
+ args: ['document:click', ['$event']]
106
+ }] } });
107
+ class ShipSort {
108
+ constructor() {
109
+ this.#table = inject(ShipTable);
110
+ this.shSort = input(/* @ts-ignore */
111
+ ...(ngDevMode ? [undefined, { debugName: "shSort" }] : /* istanbul ignore next */ []));
112
+ this.sortAsc = computed(() => {
113
+ const currentSort = this.#table.sortByColumn();
114
+ const thisColumn = this.shSort();
115
+ if (!currentSort || !thisColumn)
116
+ return false;
117
+ return currentSort === thisColumn;
118
+ }, /* @ts-ignore */
119
+ ...(ngDevMode ? [{ debugName: "sortAsc" }] : /* istanbul ignore next */ []));
120
+ this.sortDesc = computed(() => {
121
+ const currentSort = this.#table.sortByColumn();
122
+ const thisColumn = this.shSort();
123
+ if (!currentSort || !thisColumn)
124
+ return false;
125
+ return currentSort === `-${thisColumn}`;
126
+ }, /* @ts-ignore */
127
+ ...(ngDevMode ? [{ debugName: "sortDesc" }] : /* istanbul ignore next */ []));
128
+ }
129
+ #table;
130
+ toggleSort() {
131
+ const sortCol = this.shSort();
132
+ if (!sortCol)
133
+ return;
134
+ this.#table.toggleSort(sortCol);
135
+ }
136
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: ShipSort, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
137
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.0", type: ShipSort, isStandalone: true, selector: "[shSort]", inputs: { shSort: { classPropertyName: "shSort", publicName: "shSort", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "mousedown": "toggleSort()" }, properties: { "class.sort-asc": "sortAsc()", "class.sort-desc": "sortDesc()" }, classAttribute: "sortable" }, ngImport: i0 }); }
138
+ }
139
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: ShipSort, decorators: [{
140
+ type: Directive,
141
+ args: [{
142
+ selector: '[shSort]',
143
+ standalone: true,
144
+ host: {
145
+ class: 'sortable',
146
+ '(mousedown)': 'toggleSort()',
147
+ '[class.sort-asc]': 'sortAsc()',
148
+ '[class.sort-desc]': 'sortDesc()',
149
+ },
150
+ }]
151
+ }], propDecorators: { shSort: [{ type: i0.Input, args: [{ isSignal: true, alias: "shSort", required: false }] }] } });
152
+ class ShipStickyColumns {
153
+ constructor() {
154
+ this.#elementRef = inject(ElementRef);
155
+ this.#renderer = inject(Renderer2);
156
+ this.shStickyColumns = input('start', /* @ts-ignore */
157
+ ...(ngDevMode ? [{ debugName: "shStickyColumns" }] : /* istanbul ignore next */ []));
158
+ }
159
+ #elementRef;
160
+ #renderer;
161
+ ngAfterContentInit() {
162
+ this.#applyGridColumnStyle();
163
+ }
164
+ #applyGridColumnStyle() {
165
+ const nativeElement = this.#elementRef.nativeElement;
166
+ const cellChildren = nativeElement.querySelectorAll(':scope > th, :scope > td');
167
+ const columnSpanCount = cellChildren.length;
168
+ if (columnSpanCount > 0) {
169
+ const position = this.shStickyColumns();
170
+ this.#renderer.setStyle(nativeElement, 'grid-column', position === 'end' ? `-${columnSpanCount + 1} / -1` : `1 / ${columnSpanCount + 1}`);
171
+ }
172
+ }
173
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: ShipStickyColumns, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
174
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.0", type: ShipStickyColumns, isStandalone: true, selector: "[shStickyColumns]", inputs: { shStickyColumns: { classPropertyName: "shStickyColumns", publicName: "shStickyColumns", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.sticky": "shStickyColumns() === \"start\"", "class.sticky-end": "shStickyColumns() === \"end\"" } }, ngImport: i0 }); }
175
+ }
176
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: ShipStickyColumns, decorators: [{
177
+ type: Directive,
178
+ args: [{
179
+ selector: '[shStickyColumns]',
180
+ host: {
181
+ '[class.sticky]': 'shStickyColumns() === "start"',
182
+ '[class.sticky-end]': 'shStickyColumns() === "end"',
183
+ },
184
+ }]
185
+ }], propDecorators: { shStickyColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "shStickyColumns", required: false }] }] } });
186
+ const SCROLL_TOLERANCE = 1.5;
187
+ class ShipTable {
188
+ constructor() {
189
+ this.#el = inject(ElementRef);
190
+ this.loading = input(false, /* @ts-ignore */
191
+ ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
192
+ this.data = input([], /* @ts-ignore */
193
+ ...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
194
+ this.dataChange = output();
195
+ this.sortByColumn = model(null, /* @ts-ignore */
196
+ ...(ngDevMode ? [{ debugName: "sortByColumn" }] : /* istanbul ignore next */ []));
197
+ this.color = input(null, /* @ts-ignore */
198
+ ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
199
+ this.variant = input(null, /* @ts-ignore */
200
+ ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
201
+ this.hostClasses = shipComponentClasses('table', {
202
+ color: this.color,
203
+ variant: this.variant,
204
+ });
205
+ this.thead = viewChild('thead', /* @ts-ignore */
206
+ ...(ngDevMode ? [{ debugName: "thead" }] : /* istanbul ignore next */ []));
207
+ this.tbody = viewChild('tbody', /* @ts-ignore */
208
+ ...(ngDevMode ? [{ debugName: "tbody" }] : /* istanbul ignore next */ []));
209
+ this.columns = observeChildren(this.thead, ['tr:first-child th']);
210
+ this.stickyHeaderHeight = signal(0, /* @ts-ignore */
211
+ ...(ngDevMode ? [{ debugName: "stickyHeaderHeight" }] : /* istanbul ignore next */ []));
212
+ this.#destroyRef = inject(DestroyRef);
213
+ this.#resizeObserver = null;
214
+ this.theadEffect = effect(() => {
215
+ const head = this.thead()?.nativeElement;
216
+ if (this.#resizeObserver) {
217
+ this.#resizeObserver.disconnect();
218
+ this.#resizeObserver = null;
219
+ }
220
+ if (head && typeof ResizeObserver !== 'undefined') {
221
+ this.#resizeObserver = new ResizeObserver((entries) => {
222
+ const height = head.clientHeight;
223
+ this.stickyHeaderHeight.set(height);
224
+ });
225
+ this.#resizeObserver.observe(head);
226
+ }
227
+ }, /* @ts-ignore */
228
+ ...(ngDevMode ? [{ debugName: "theadEffect" }] : /* istanbul ignore next */ []));
229
+ this.#cleanup = this.#destroyRef.onDestroy(() => {
230
+ this.#resizeObserver?.disconnect();
231
+ });
232
+ this.bodyEffect = effect(() => {
233
+ const body = this.tbody()?.nativeElement;
234
+ const head = this.thead()?.nativeElement;
235
+ if (!body || !head)
236
+ return;
237
+ const stickyHeaderHeight = this.stickyHeaderHeight();
238
+ queueMicrotask(() => {
239
+ const hasStickyRowHeaderStartElement = head.querySelectorAll('tr.sticky').length > 0;
240
+ const stickyBodyRows = body.querySelectorAll('tr.sticky');
241
+ const hasStickyRowStartElement = stickyBodyRows.length > 0;
242
+ if (hasStickyRowStartElement && hasStickyRowHeaderStartElement) {
243
+ for (let index = 0; index < stickyBodyRows.length; index++) {
244
+ stickyBodyRows[index].style.top = `${stickyHeaderHeight}px`;
245
+ }
246
+ }
247
+ });
248
+ }, /* @ts-ignore */
249
+ ...(ngDevMode ? [{ debugName: "bodyEffect" }] : /* istanbul ignore next */ []));
250
+ this.resizing = signal(false, /* @ts-ignore */
251
+ ...(ngDevMode ? [{ debugName: "resizing" }] : /* istanbul ignore next */ []));
252
+ this.sizeTrigger = signal(true, /* @ts-ignore */
253
+ ...(ngDevMode ? [{ debugName: "sizeTrigger" }] : /* istanbul ignore next */ []));
254
+ this.#initialData = null;
255
+ this.#initialDataSet = signal(false, /* @ts-ignore */
256
+ ...(ngDevMode ? [{ debugName: "#initialDataSet" }] : /* istanbul ignore next */ []));
257
+ this.scrollXState = signal(-1, /* @ts-ignore */
258
+ ...(ngDevMode ? [{ debugName: "scrollXState" }] : /* istanbul ignore next */ []));
259
+ this.scrollYState = signal(-1, /* @ts-ignore */
260
+ ...(ngDevMode ? [{ debugName: "scrollYState" }] : /* istanbul ignore next */ []));
261
+ this.canScrollX = signal(false, /* @ts-ignore */
262
+ ...(ngDevMode ? [{ debugName: "canScrollX" }] : /* istanbul ignore next */ []));
263
+ this.canScrollY = signal(false, /* @ts-ignore */
264
+ ...(ngDevMode ? [{ debugName: "canScrollY" }] : /* istanbul ignore next */ []));
265
+ this.columnSizes = computed(() => {
266
+ this.sizeTrigger();
267
+ const colSignal = this.columns.signal();
268
+ return colSignal.reduce((acc, col, index) => {
269
+ const colEl = col;
270
+ const colSize = colEl.getAttribute('size');
271
+ const last = index === colSignal.length - 1;
272
+ if (colSize) {
273
+ return `${acc} ${colSize}`;
274
+ }
275
+ if (colEl.classList.contains('sticky') || colEl.classList.contains('sticky-end')) {
276
+ return `${acc} min-content`;
277
+ }
278
+ if (last) {
279
+ return `${acc} 1fr`;
280
+ }
281
+ return `${acc} 1fr`;
282
+ }, '');
283
+ }, /* @ts-ignore */
284
+ ...(ngDevMode ? [{ debugName: "columnSizes" }] : /* istanbul ignore next */ []));
285
+ this.e = effect(() => {
286
+ const sortByColumn = this.sortByColumn();
287
+ if (sortByColumn === null) {
288
+ if (!this.#initialDataSet()) {
289
+ this.#initialData = this.data();
290
+ this.#initialDataSet.set(true);
291
+ }
292
+ return this.dataChange.emit(structuredClone(this.#initialData));
293
+ }
294
+ const column = sortByColumn.startsWith('-') ? sortByColumn.slice(1) : sortByColumn;
295
+ const isDescending = sortByColumn.startsWith('-');
296
+ const sortedData = this.data().sort((a, b) => {
297
+ const valueA = a[column];
298
+ const valueB = b[column];
299
+ let comparison = 0;
300
+ if (typeof valueA === 'number' && typeof valueB === 'number') {
301
+ comparison = valueA - valueB;
302
+ }
303
+ if (valueA instanceof Date && valueB instanceof Date) {
304
+ comparison = valueA.getTime() - valueB.getTime();
305
+ }
306
+ if (typeof valueA === 'string' && typeof valueB === 'string') {
307
+ comparison = valueA.localeCompare(valueB, undefined, { sensitivity: 'base' });
308
+ }
309
+ return isDescending ? -comparison : comparison;
310
+ });
311
+ this.dataChange.emit(sortedData);
312
+ }, /* @ts-ignore */
313
+ ...(ngDevMode ? [{ debugName: "e" }] : /* istanbul ignore next */ []));
314
+ }
315
+ #el;
316
+ #destroyRef;
317
+ #resizeObserver;
318
+ #cleanup;
319
+ #initialData;
320
+ #initialDataSet;
321
+ updateColumnSizes() {
322
+ this.sizeTrigger.set(!this.sizeTrigger());
323
+ }
324
+ onScroll() {
325
+ this.#checkScroll();
326
+ }
327
+ onResize(event) {
328
+ this.#checkScroll();
329
+ }
330
+ ngAfterViewInit() {
331
+ queueMicrotask(() => this.#checkScroll());
332
+ }
333
+ toggleSort(column) {
334
+ const currentSort = this.sortByColumn();
335
+ const sortDir = currentSort === column ? `-${column}` : currentSort === `-${column}` ? null : column;
336
+ this.sortByColumn.set(sortDir);
337
+ }
338
+ #checkScroll() {
339
+ const element = this.#el.nativeElement;
340
+ let nextXState = -1;
341
+ let nextYState = -1;
342
+ const canScrollX = element.scrollWidth > element.clientWidth + SCROLL_TOLERANCE;
343
+ if (canScrollX) {
344
+ const isAtStartX = element.scrollLeft <= SCROLL_TOLERANCE;
345
+ const isAtEndX = element.scrollWidth - (element.scrollLeft + element.clientWidth) < SCROLL_TOLERANCE;
346
+ if (isAtEndX) {
347
+ nextXState = 1;
348
+ }
349
+ else if (!isAtStartX) {
350
+ nextXState = 0;
351
+ }
352
+ }
353
+ this.scrollXState.set(nextXState);
354
+ this.canScrollX.set(canScrollX);
355
+ const canScrollY = element.scrollHeight > element.clientHeight + SCROLL_TOLERANCE;
356
+ if (canScrollY) {
357
+ const isAtStartY = element.scrollTop <= SCROLL_TOLERANCE;
358
+ const isAtEndY = element.scrollHeight - (element.scrollTop + element.clientHeight) < SCROLL_TOLERANCE;
359
+ if (isAtEndY) {
360
+ nextYState = 1;
361
+ }
362
+ else if (!isAtStartY) {
363
+ nextYState = 0;
364
+ }
365
+ }
366
+ this.scrollYState.set(nextYState);
367
+ this.canScrollY.set(canScrollY);
368
+ }
369
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: ShipTable, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
370
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.0", type: ShipTable, isStandalone: true, selector: "sh-table", inputs: { loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, sortByColumn: { classPropertyName: "sortByColumn", publicName: "sortByColumn", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dataChange: "dataChange", sortByColumn: "sortByColumnChange" }, host: { listeners: { "scroll": "onScroll()", "window:resize": "onResize($event)" }, properties: { "class": "hostClasses()", "style.grid-template-columns": "columnSizes()", "class.resizing": "resizing()", "class.can-scroll-x": "canScrollX()", "class.can-scroll-y": "canScrollY()", "class.scrolled-x": "scrollXState() >= 0", "class.scrolled-x-end": "scrollXState() === 1", "class.scrolled-y": "scrollYState() >= 0", "class.scrolled-y-end": "scrollYState() === 1" } }, viewQueries: [{ propertyName: "thead", first: true, predicate: ["thead"], descendants: true, isSignal: true }, { propertyName: "tbody", first: true, predicate: ["tbody"], descendants: true, isSignal: true }], ngImport: i0, template: `
371
+ <div class="actionbar">
372
+ <ng-content select="[actionbar]" />
373
+ </div>
374
+
375
+ @if (loading()) {
376
+ <sh-progress-bar class="indeterminate primary" />
377
+ }
378
+
379
+ <thead #thead>
380
+ <ng-content select="th" />
381
+ <ng-content select="[thead]" />
382
+ </thead>
383
+
384
+ <tbody #tbody>
385
+ <ng-content />
386
+ </tbody>
387
+
388
+ @if (!loading()) {
389
+ <div class="no-rows">
390
+ <ng-content select="[table-no-rows]" />
391
+ </div>
392
+ }
393
+ `, isInline: true, styles: ["sh-table{--table-bc: var(--base-4);--table-th-bg: var(--base-1);--table-tr-bg: var(--base-1);--table-td-bg: var(--base-1);--table-th-c: var(--base-8);--table-th-f: var(--paragraph-30);--table-td-c: var(--base-8);--table-td-f: var(--paragraph-30);--table-th-p: 0 1.25rem;--table-td-p: 0 1.25rem;--table-th-mh: 3rem;--table-td-mh: 4.875rem;--table-th-g: .25rem;--table-td-g: .5rem;--table-ws: nowrap;--table-th-bw: 0;--table-td-bw: .0625rem 0 0;--table-columns: 1fr 1fr 1fr max-content;--table-sticky-bw: .0625rem}sh-table.type-a tbody>th,sh-table.type-a tbody>td,sh-table.type-a thead>th,sh-table.type-a thead>td{padding-right:0}sh-table.type-a tbody>th:first-child,sh-table.type-a tbody>td:first-child,sh-table.type-a thead>th:first-child,sh-table.type-a thead>td:first-child{padding:0}sh-table.type-a.scrolled-x.can-scroll-x [shStickyColumns=\"\"],sh-table.type-a.scrolled-x.can-scroll-x th.sticky,sh-table.type-a.scrolled-x.can-scroll-x td.sticky{border-right-width:.0625rem}sh-table.type-a:not(.scrolled-x-end).can-scroll-x [shStickyColumns=end],sh-table.type-a:not(.scrolled-x-end).can-scroll-x th.sticky-end,sh-table.type-a:not(.scrolled-x-end).can-scroll-x td.sticky-end{border-left-width:.0625rem}sh-table.type-b{--table-th-p: 0 .75rem;--table-td-p: 0 .75rem;--table-th-mh: 2.25rem;--table-td-mh: 3.5rem;--table-th-bw: .0625rem 0 .0625rem .0625rem;--table-td-bw: 0 0 .0625rem .0625rem;--table-th-bg: var(--base-2);--table-sticky-bw: .125rem}sh-table.type-b th:first-child{border-left-width:0;padding:var(--table-th-p)}sh-table.type-b td:first-child{border-left-width:0;padding:var(--table-td-p)}sh-table.type-b [shStickyColumns=end]{border-left-width:.125rem}sh-table.type-b.scrolled-x [shStickyColumns=\"\"]{border-right-width:.125rem}sh-table.type-b.scrolled-x-end [shStickyColumns=end]{border-left-width:.0625rem}sh-table.type-b td.sticky,sh-table.type-b th.sticky{border-left-width:0;border-right-width:.0625rem}sh-table.type-b td.sticky+*,sh-table.type-b th.sticky+*{border-left-width:0}sh-table.type-b tr:hover td{background-color:var(--base-2)}sh-table.type-b div[table-header] tr:first-child th{border-bottom:0}sh-table.type-b .actionbar{background-color:var(--base-2);border-width:.0625rem 0 0}sh-table{width:100%;display:grid;overflow:auto;grid-template-columns:var(--table-columns);position:relative}sh-table.resizing{-webkit-user-select:none;user-select:none}sh-table:has([shTableResize]) td{overflow:auto}sh-table.no-resize .sh-resizer{display:none}sh-table.no-resize td{overflow:initial}sh-table .actionbar{display:grid;grid-column:1/-1;align-items:start;gap:.5rem;grid-template-rows:1fr;grid-auto-flow:column;grid-auto-columns:max-content;padding:.5rem;border:var(--border-10);border-width:.0625rem 0;opacity:1;transition:grid-template-rows .3s ease-out,padding .3s ease-out,border-width .3s ease-out,opacity .3s ease-out;overflow:hidden}sh-table .actionbar:empty{grid-template-rows:0fr;padding-top:0;padding-bottom:0;border-width:0;opacity:0;pointer-events:none}sh-table .actionbar>*{min-height:0}sh-table tbody{position:relative}sh-table tbody:has(tr.sticky){position:sticky;top:0;z-index:1}sh-table thead{position:relative}sh-table thead:has(tr.sticky){position:sticky;top:0;z-index:2}sh-table sh-progress-bar{grid-column:1/-1;position:absolute;top:100%;transform:translateY(-50%);z-index:200}sh-table tbody,sh-table thead,sh-table tr{display:grid;grid-column:1/-1;grid-template-columns:subgrid}sh-table tr{background:var(--table-tr-bg);position:relative;z-index:0}sh-table tr.sticky{position:sticky;top:0;z-index:1}sh-table tr.sticky-end{position:sticky;bottom:0;z-index:3}sh-table tr:has(th.sticky-end) th:nth-last-child(2){padding:var(--table-th-p)}sh-table tr:has(td.sticky-end) td:nth-last-child(2){padding:var(--table-td-p)}sh-table th{display:flex;align-items:center;padding:var(--table-th-p);min-height:var(--table-th-mh);font:var(--table-th-f);line-height:1em;white-space:var(--table-ws);color:var(--table-th-c);border:0;border-color:var(--table-bc);border-style:solid;border-width:var(--table-th-bw);background:var(--table-th-bg);gap:var(--table-th-g);z-index:100}sh-table th:has(.sh-resizer){position:relative}sh-table th.sortable{--caret-color: var(--base-10);--caret-size: .375rem;cursor:pointer;-webkit-user-select:none;user-select:none}sh-table th.sortable sh-icon{opacity:.35;transition:opacity 125ms ease-in-out}sh-table th.sortable:hover sh-icon{opacity:.7}sh-table th.sortable.sort-asc sh-icon,sh-table th.sortable.sort-desc sh-icon{opacity:1}sh-table th.sortable:not(:has(sh-icon)):after{content:\"\";border:var(--caret-size) solid transparent;width:0;height:0;opacity:0;transition:opacity 125ms ease-in-out}sh-table th.sortable:not(:has(sh-icon)).sort-desc:after{opacity:1;transform:translateY(-4px);border-bottom-color:var(--caret-color)}sh-table th.sortable:not(:has(sh-icon)).sort-asc:after{opacity:1;transform:translateY(4px);border-top-color:var(--caret-color)}sh-table th .sh-resizer{width:10px;height:100%;position:absolute;top:0;right:0;cursor:col-resize}sh-table th .sh-resizer:before,sh-table th .sh-resizer:after{content:\"\";position:absolute;top:50%;transform:translateY(-50%);height:.75rem;right:.1875rem;width:.0625rem;background-color:var(--base-4)}sh-table th .sh-resizer:hover:before,sh-table th .sh-resizer:hover:after{background-color:var(--primary-8)}sh-table th .sh-resizer:before{left:.1875rem}sh-table td{display:flex;align-items:center;padding:var(--table-td-p);min-height:var(--table-td-mh);gap:var(--table-td-g);color:var(--table-td-c);font:var(--table-td-f);white-space:var(--table-ws);border-color:var(--table-bc);border-style:solid;border-width:var(--table-td-bw);background:var(--table-td-bg)}sh-table td+td.sticky-end:last-child{padding:var(--table-td-p)}sh-table th.sticky,sh-table th.sticky-end,sh-table td.sticky,sh-table td.sticky-end{position:sticky;overflow:hidden;right:auto;left:0;z-index:1;padding:var(--table-td-p)}sh-table th.sticky:first-child,sh-table th.sticky-end:first-child,sh-table td.sticky:first-child,sh-table td.sticky-end:first-child{padding:var(--table-th-p)}sh-table th.sticky-end,sh-table td.sticky-end{right:0;left:auto}sh-table th.sticky,sh-table th.sticky-end{background:var(--table-th-bg);padding:var(--table-th-p);z-index:101}sh-table th.sticky:first-child,sh-table th.sticky-end:first-child{padding:var(--table-th-p)}sh-table [shStickyColumns]{display:grid;grid-template-columns:subgrid;position:sticky;left:0;z-index:1000;border:0;border-color:var(--table-bc);border-style:solid}sh-table [shStickyColumns=end]{left:auto;right:0}sh-table thead>[shStickyColumns]{border-width:var(--table-th-bw)}sh-table tbody>[shStickyColumns]{border-width:var(--table-td-bw)}sh-table .span-all{grid-column:1/-1;white-space:initial;align-items:flex-start;padding:0;border-left-width:0}sh-table .no-rows{display:none;grid-column:1/-1}sh-table tbody:empty+.no-rows{display:block}\n"], dependencies: [{ kind: "component", type: ShipProgressBar, selector: "sh-progress-bar", inputs: ["value", "color", "variant"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
394
+ }
395
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: ShipTable, decorators: [{
396
+ type: Component,
397
+ args: [{ selector: 'sh-table', encapsulation: ViewEncapsulation.None, imports: [ShipProgressBar], template: `
398
+ <div class="actionbar">
399
+ <ng-content select="[actionbar]" />
400
+ </div>
401
+
402
+ @if (loading()) {
403
+ <sh-progress-bar class="indeterminate primary" />
404
+ }
405
+
406
+ <thead #thead>
407
+ <ng-content select="th" />
408
+ <ng-content select="[thead]" />
409
+ </thead>
410
+
411
+ <tbody #tbody>
412
+ <ng-content />
413
+ </tbody>
414
+
415
+ @if (!loading()) {
416
+ <div class="no-rows">
417
+ <ng-content select="[table-no-rows]" />
418
+ </div>
419
+ }
420
+ `, changeDetection: ChangeDetectionStrategy.OnPush, host: {
421
+ '[class]': 'hostClasses()',
422
+ '[style.grid-template-columns]': 'columnSizes()',
423
+ '[class.resizing]': 'resizing()',
424
+ '(scroll)': 'onScroll()',
425
+ '[class.can-scroll-x]': 'canScrollX()',
426
+ '[class.can-scroll-y]': 'canScrollY()',
427
+ '[class.scrolled-x]': 'scrollXState() >= 0',
428
+ '[class.scrolled-x-end]': 'scrollXState() === 1',
429
+ '[class.scrolled-y]': 'scrollYState() >= 0',
430
+ '[class.scrolled-y-end]': 'scrollYState() === 1',
431
+ }, styles: ["sh-table{--table-bc: var(--base-4);--table-th-bg: var(--base-1);--table-tr-bg: var(--base-1);--table-td-bg: var(--base-1);--table-th-c: var(--base-8);--table-th-f: var(--paragraph-30);--table-td-c: var(--base-8);--table-td-f: var(--paragraph-30);--table-th-p: 0 1.25rem;--table-td-p: 0 1.25rem;--table-th-mh: 3rem;--table-td-mh: 4.875rem;--table-th-g: .25rem;--table-td-g: .5rem;--table-ws: nowrap;--table-th-bw: 0;--table-td-bw: .0625rem 0 0;--table-columns: 1fr 1fr 1fr max-content;--table-sticky-bw: .0625rem}sh-table.type-a tbody>th,sh-table.type-a tbody>td,sh-table.type-a thead>th,sh-table.type-a thead>td{padding-right:0}sh-table.type-a tbody>th:first-child,sh-table.type-a tbody>td:first-child,sh-table.type-a thead>th:first-child,sh-table.type-a thead>td:first-child{padding:0}sh-table.type-a.scrolled-x.can-scroll-x [shStickyColumns=\"\"],sh-table.type-a.scrolled-x.can-scroll-x th.sticky,sh-table.type-a.scrolled-x.can-scroll-x td.sticky{border-right-width:.0625rem}sh-table.type-a:not(.scrolled-x-end).can-scroll-x [shStickyColumns=end],sh-table.type-a:not(.scrolled-x-end).can-scroll-x th.sticky-end,sh-table.type-a:not(.scrolled-x-end).can-scroll-x td.sticky-end{border-left-width:.0625rem}sh-table.type-b{--table-th-p: 0 .75rem;--table-td-p: 0 .75rem;--table-th-mh: 2.25rem;--table-td-mh: 3.5rem;--table-th-bw: .0625rem 0 .0625rem .0625rem;--table-td-bw: 0 0 .0625rem .0625rem;--table-th-bg: var(--base-2);--table-sticky-bw: .125rem}sh-table.type-b th:first-child{border-left-width:0;padding:var(--table-th-p)}sh-table.type-b td:first-child{border-left-width:0;padding:var(--table-td-p)}sh-table.type-b [shStickyColumns=end]{border-left-width:.125rem}sh-table.type-b.scrolled-x [shStickyColumns=\"\"]{border-right-width:.125rem}sh-table.type-b.scrolled-x-end [shStickyColumns=end]{border-left-width:.0625rem}sh-table.type-b td.sticky,sh-table.type-b th.sticky{border-left-width:0;border-right-width:.0625rem}sh-table.type-b td.sticky+*,sh-table.type-b th.sticky+*{border-left-width:0}sh-table.type-b tr:hover td{background-color:var(--base-2)}sh-table.type-b div[table-header] tr:first-child th{border-bottom:0}sh-table.type-b .actionbar{background-color:var(--base-2);border-width:.0625rem 0 0}sh-table{width:100%;display:grid;overflow:auto;grid-template-columns:var(--table-columns);position:relative}sh-table.resizing{-webkit-user-select:none;user-select:none}sh-table:has([shTableResize]) td{overflow:auto}sh-table.no-resize .sh-resizer{display:none}sh-table.no-resize td{overflow:initial}sh-table .actionbar{display:grid;grid-column:1/-1;align-items:start;gap:.5rem;grid-template-rows:1fr;grid-auto-flow:column;grid-auto-columns:max-content;padding:.5rem;border:var(--border-10);border-width:.0625rem 0;opacity:1;transition:grid-template-rows .3s ease-out,padding .3s ease-out,border-width .3s ease-out,opacity .3s ease-out;overflow:hidden}sh-table .actionbar:empty{grid-template-rows:0fr;padding-top:0;padding-bottom:0;border-width:0;opacity:0;pointer-events:none}sh-table .actionbar>*{min-height:0}sh-table tbody{position:relative}sh-table tbody:has(tr.sticky){position:sticky;top:0;z-index:1}sh-table thead{position:relative}sh-table thead:has(tr.sticky){position:sticky;top:0;z-index:2}sh-table sh-progress-bar{grid-column:1/-1;position:absolute;top:100%;transform:translateY(-50%);z-index:200}sh-table tbody,sh-table thead,sh-table tr{display:grid;grid-column:1/-1;grid-template-columns:subgrid}sh-table tr{background:var(--table-tr-bg);position:relative;z-index:0}sh-table tr.sticky{position:sticky;top:0;z-index:1}sh-table tr.sticky-end{position:sticky;bottom:0;z-index:3}sh-table tr:has(th.sticky-end) th:nth-last-child(2){padding:var(--table-th-p)}sh-table tr:has(td.sticky-end) td:nth-last-child(2){padding:var(--table-td-p)}sh-table th{display:flex;align-items:center;padding:var(--table-th-p);min-height:var(--table-th-mh);font:var(--table-th-f);line-height:1em;white-space:var(--table-ws);color:var(--table-th-c);border:0;border-color:var(--table-bc);border-style:solid;border-width:var(--table-th-bw);background:var(--table-th-bg);gap:var(--table-th-g);z-index:100}sh-table th:has(.sh-resizer){position:relative}sh-table th.sortable{--caret-color: var(--base-10);--caret-size: .375rem;cursor:pointer;-webkit-user-select:none;user-select:none}sh-table th.sortable sh-icon{opacity:.35;transition:opacity 125ms ease-in-out}sh-table th.sortable:hover sh-icon{opacity:.7}sh-table th.sortable.sort-asc sh-icon,sh-table th.sortable.sort-desc sh-icon{opacity:1}sh-table th.sortable:not(:has(sh-icon)):after{content:\"\";border:var(--caret-size) solid transparent;width:0;height:0;opacity:0;transition:opacity 125ms ease-in-out}sh-table th.sortable:not(:has(sh-icon)).sort-desc:after{opacity:1;transform:translateY(-4px);border-bottom-color:var(--caret-color)}sh-table th.sortable:not(:has(sh-icon)).sort-asc:after{opacity:1;transform:translateY(4px);border-top-color:var(--caret-color)}sh-table th .sh-resizer{width:10px;height:100%;position:absolute;top:0;right:0;cursor:col-resize}sh-table th .sh-resizer:before,sh-table th .sh-resizer:after{content:\"\";position:absolute;top:50%;transform:translateY(-50%);height:.75rem;right:.1875rem;width:.0625rem;background-color:var(--base-4)}sh-table th .sh-resizer:hover:before,sh-table th .sh-resizer:hover:after{background-color:var(--primary-8)}sh-table th .sh-resizer:before{left:.1875rem}sh-table td{display:flex;align-items:center;padding:var(--table-td-p);min-height:var(--table-td-mh);gap:var(--table-td-g);color:var(--table-td-c);font:var(--table-td-f);white-space:var(--table-ws);border-color:var(--table-bc);border-style:solid;border-width:var(--table-td-bw);background:var(--table-td-bg)}sh-table td+td.sticky-end:last-child{padding:var(--table-td-p)}sh-table th.sticky,sh-table th.sticky-end,sh-table td.sticky,sh-table td.sticky-end{position:sticky;overflow:hidden;right:auto;left:0;z-index:1;padding:var(--table-td-p)}sh-table th.sticky:first-child,sh-table th.sticky-end:first-child,sh-table td.sticky:first-child,sh-table td.sticky-end:first-child{padding:var(--table-th-p)}sh-table th.sticky-end,sh-table td.sticky-end{right:0;left:auto}sh-table th.sticky,sh-table th.sticky-end{background:var(--table-th-bg);padding:var(--table-th-p);z-index:101}sh-table th.sticky:first-child,sh-table th.sticky-end:first-child{padding:var(--table-th-p)}sh-table [shStickyColumns]{display:grid;grid-template-columns:subgrid;position:sticky;left:0;z-index:1000;border:0;border-color:var(--table-bc);border-style:solid}sh-table [shStickyColumns=end]{left:auto;right:0}sh-table thead>[shStickyColumns]{border-width:var(--table-th-bw)}sh-table tbody>[shStickyColumns]{border-width:var(--table-td-bw)}sh-table .span-all{grid-column:1/-1;white-space:initial;align-items:flex-start;padding:0;border-left-width:0}sh-table .no-rows{display:none;grid-column:1/-1}sh-table tbody:empty+.no-rows{display:block}\n"] }]
432
+ }], propDecorators: { loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], dataChange: [{ type: i0.Output, args: ["dataChange"] }], sortByColumn: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortByColumn", required: false }] }, { type: i0.Output, args: ["sortByColumnChange"] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], thead: [{ type: i0.ViewChild, args: ['thead', { isSignal: true }] }], tbody: [{ type: i0.ViewChild, args: ['tbody', { isSignal: true }] }], onResize: [{
433
+ type: HostListener,
434
+ args: ['window:resize', ['$event']]
435
+ }] } });
436
+
437
+ /**
438
+ * Generated bundle index. Do not edit.
439
+ */
440
+
441
+ export { ShipResize, ShipSort, ShipStickyColumns, ShipTable };
442
+ //# sourceMappingURL=ship-ui-core-ship-table.mjs.map