@sekiui/elements 0.0.52 → 0.0.54

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 (102) hide show
  1. package/dist/cdn/index.js +1 -1
  2. package/dist/cdn/seki-button.js +1 -1
  3. package/dist/cdn/seki-field-description.js +1 -1
  4. package/dist/cdn/seki-field-error.js +1 -1
  5. package/dist/cdn/seki-field-group.js +1 -1
  6. package/dist/cdn/seki-field-label.js +1 -1
  7. package/dist/cdn/seki-field-legend.js +1 -1
  8. package/dist/cdn/seki-field.js +1 -1
  9. package/dist/cdn/seki-fieldset.js +1 -1
  10. package/dist/cdn/seki-input.js +1 -1
  11. package/dist/cdn/seki-select-group.js +1 -1
  12. package/dist/cdn/seki-select-option.js +1 -1
  13. package/dist/cdn/seki-select.js +1 -1
  14. package/dist/cdn/seki-skeleton.js +1 -1
  15. package/dist/cdn/seki-tooltip.d.ts +11 -0
  16. package/dist/cdn/seki-tooltip.js +378 -0
  17. package/dist/cjs/index.cjs.js +1 -1
  18. package/dist/cjs/loader.cjs.js +1 -1
  19. package/dist/cjs/seki-button.cjs.entry.js +1 -1
  20. package/dist/cjs/seki-field-description.cjs.entry.js +1 -1
  21. package/dist/cjs/seki-field-error.cjs.entry.js +1 -1
  22. package/dist/cjs/seki-field-group.cjs.entry.js +1 -1
  23. package/dist/cjs/seki-field-label.cjs.entry.js +1 -1
  24. package/dist/cjs/seki-field-legend.cjs.entry.js +1 -1
  25. package/dist/cjs/seki-field.cjs.entry.js +1 -1
  26. package/dist/cjs/seki-fieldset.cjs.entry.js +1 -1
  27. package/dist/cjs/seki-input.cjs.entry.js +1 -1
  28. package/dist/cjs/seki-select-group.cjs.entry.js +1 -1
  29. package/dist/cjs/seki-select-option.cjs.entry.js +1 -1
  30. package/dist/cjs/seki-select.cjs.entry.js +1 -1
  31. package/dist/cjs/seki-skeleton.cjs.entry.js +1 -1
  32. package/dist/cjs/seki-tooltip.cjs.entry.js +349 -0
  33. package/dist/cjs/sekiui.cjs.js +1 -1
  34. package/dist/collection/collection-manifest.json +1 -0
  35. package/dist/collection/components/button/seki-button.js +1 -1
  36. package/dist/collection/components/field/seki-field.js +1 -1
  37. package/dist/collection/components/field-description/seki-field-description.js +1 -1
  38. package/dist/collection/components/field-error/seki-field-error.js +1 -1
  39. package/dist/collection/components/field-group/seki-field-group.js +1 -1
  40. package/dist/collection/components/field-label/seki-field-label.js +1 -1
  41. package/dist/collection/components/field-legend/seki-field-legend.js +1 -1
  42. package/dist/collection/components/fieldset/seki-fieldset.js +1 -1
  43. package/dist/collection/components/input/seki-input.js +1 -1
  44. package/dist/collection/components/select/seki-select.js +1 -1
  45. package/dist/collection/components/select-group/seki-select-group.js +1 -1
  46. package/dist/collection/components/select-option/seki-select-option.js +1 -1
  47. package/dist/collection/components/skeleton/seki-skeleton.js +1 -1
  48. package/dist/collection/components/switch/seki-switch.js +1 -1
  49. package/dist/collection/components/tooltip/seki-tooltip.css +522 -0
  50. package/dist/collection/components/tooltip/seki-tooltip.js +608 -0
  51. package/dist/components/index.js +1 -1
  52. package/dist/components/seki-button.js +1 -1
  53. package/dist/components/seki-field-description.js +1 -1
  54. package/dist/components/seki-field-error.js +1 -1
  55. package/dist/components/seki-field-group.js +1 -1
  56. package/dist/components/seki-field-label.js +1 -1
  57. package/dist/components/seki-field-legend.js +1 -1
  58. package/dist/components/seki-field.js +1 -1
  59. package/dist/components/seki-fieldset.js +1 -1
  60. package/dist/components/seki-input.js +1 -1
  61. package/dist/components/seki-select-group.js +1 -1
  62. package/dist/components/seki-select-option.js +1 -1
  63. package/dist/components/seki-select.js +1 -1
  64. package/dist/components/seki-skeleton.js +1 -1
  65. package/dist/components/seki-tooltip.d.ts +11 -0
  66. package/dist/components/seki-tooltip.js +378 -0
  67. package/dist/esm/index.js +1 -1
  68. package/dist/esm/loader.js +1 -1
  69. package/dist/esm/seki-button.entry.js +1 -1
  70. package/dist/esm/seki-field-description.entry.js +1 -1
  71. package/dist/esm/seki-field-error.entry.js +1 -1
  72. package/dist/esm/seki-field-group.entry.js +1 -1
  73. package/dist/esm/seki-field-label.entry.js +1 -1
  74. package/dist/esm/seki-field-legend.entry.js +1 -1
  75. package/dist/esm/seki-field.entry.js +1 -1
  76. package/dist/esm/seki-fieldset.entry.js +1 -1
  77. package/dist/esm/seki-input.entry.js +1 -1
  78. package/dist/esm/seki-select-group.entry.js +1 -1
  79. package/dist/esm/seki-select-option.entry.js +1 -1
  80. package/dist/esm/seki-select.entry.js +1 -1
  81. package/dist/esm/seki-skeleton.entry.js +1 -1
  82. package/dist/esm/seki-tooltip.entry.js +347 -0
  83. package/dist/esm/sekiui.js +1 -1
  84. package/dist/sekiui/index.esm.js +1 -1
  85. package/dist/sekiui/{p-23a61342.entry.js → p-0fba4e2d.entry.js} +1 -1
  86. package/dist/sekiui/{p-0f64a7dd.entry.js → p-386c00ac.entry.js} +1 -1
  87. package/dist/sekiui/{p-c878de6d.entry.js → p-431f46a1.entry.js} +1 -1
  88. package/dist/sekiui/{p-eb19f073.entry.js → p-434be19f.entry.js} +1 -1
  89. package/dist/sekiui/{p-62236175.entry.js → p-6bde807e.entry.js} +1 -1
  90. package/dist/sekiui/{p-c93edddc.entry.js → p-6ff91f7f.entry.js} +1 -1
  91. package/dist/sekiui/{p-4eef5a47.entry.js → p-7c2245be.entry.js} +1 -1
  92. package/dist/sekiui/{p-aad78e67.entry.js → p-80a41058.entry.js} +1 -1
  93. package/dist/sekiui/p-81709fc2.entry.js +1 -0
  94. package/dist/sekiui/{p-5852ad8e.entry.js → p-a36f1ac4.entry.js} +1 -1
  95. package/dist/sekiui/{p-d7492f49.entry.js → p-a56602b3.entry.js} +1 -1
  96. package/dist/sekiui/{p-20eb85c9.entry.js → p-bf942ad5.entry.js} +1 -1
  97. package/dist/sekiui/{p-93d70750.entry.js → p-de4735fb.entry.js} +1 -1
  98. package/dist/sekiui/{p-0e89720a.entry.js → p-e679d501.entry.js} +1 -1
  99. package/dist/sekiui/sekiui.esm.js +1 -1
  100. package/dist/types/components/tooltip/seki-tooltip.d.ts +147 -0
  101. package/dist/types/components.d.ts +152 -0
  102. package/package.json +1 -1
@@ -55,7 +55,7 @@ const SekiFieldError = class {
55
55
  }
56
56
  render() {
57
57
  const style = this.visible ? {} : { display: 'none' };
58
- return (index.h("div", { key: 'aa140f9212c3f47d50113f77af0c33cf106177ed', id: this.componentId, class: "error", "aria-live": "polite", style: style }, index.h("slot", { key: '6fcdf53d218e817fa12792fadb3a946229b2dcf3' })));
58
+ return (index.h("div", { key: '23898d8cdf6e79e0710776895ac8a36c06262524', id: this.componentId, class: "error", "aria-live": "polite", style: style }, index.h("slot", { key: '7c40a36d065602eb635180ed0805bca9216c5015' })));
59
59
  }
60
60
  static get watchers() { return {
61
61
  "visible": ["handleVisibleChange"]
@@ -17,7 +17,7 @@ const SekiFieldGroup = class {
17
17
  const style = {
18
18
  '--seki-field-group-gap': this.gap,
19
19
  };
20
- return (index.h("div", { key: '479c3e657ce82b3ab5243b10ef5cccd26e17478b', class: "field-group", style: style }, index.h("slot", { key: '15d665a73e3d2d2eca773bdb216b4276feaf2071' })));
20
+ return (index.h("div", { key: '32e2881723467de4e83135f38f339bd1334ea19f', class: "field-group", style: style }, index.h("slot", { key: '3909c9108222772376d916718003600d9d84f10f' })));
21
21
  }
22
22
  };
23
23
  SekiFieldGroup.style = sekiFieldGroupCss;
@@ -15,7 +15,7 @@ const SekiFieldLabel = class {
15
15
  }
16
16
  render() {
17
17
  const labelProps = this.htmlFor ? { for: this.htmlFor } : {};
18
- return (index.h("label", Object.assign({ key: 'f9f2b492f80fe46110f4f8766c88a1aec53342be' }, labelProps), index.h("slot", { key: '35564e4ea62df56807c7d2a90a4f9e66a7c09c4c' }), this.required && index.h("span", { key: '8f6f7a454790995b9d968fb1e0078fb9951fcba6', class: "required-indicator" }, " *")));
18
+ return (index.h("label", Object.assign({ key: 'c57011f8722920f073fc05ae3b260e581689c43e' }, labelProps), index.h("slot", { key: '6e807e411376526b20cf66d694766ce11065b734' }), this.required && index.h("span", { key: '53d676c377fa93c6d41c50856b4db598cf3c2c15', class: "required-indicator" }, " *")));
19
19
  }
20
20
  };
21
21
  SekiFieldLabel.style = sekiFieldLabelCss;
@@ -9,7 +9,7 @@ const SekiFieldLegend = class {
9
9
  index.registerInstance(this, hostRef);
10
10
  }
11
11
  render() {
12
- return (index.h("legend", { key: '34aa222c29443bbded4ba43c8592212e5328fb52' }, index.h("slot", { key: '59fddfd2160e0c3a512dc92f38465ed015b860ca' })));
12
+ return (index.h("legend", { key: 'adcc0cb95335522fc66dc791a3cc063d2493c36b' }, index.h("slot", { key: '90a382f1eac9b23133f8daf927a2163491f09c38' })));
13
13
  }
14
14
  };
15
15
  SekiFieldLegend.style = sekiFieldLegendCss;
@@ -38,7 +38,7 @@ const SekiField = class {
38
38
  }
39
39
  render() {
40
40
  const hasMultiple = this.hasMultipleControls();
41
- return (index.h(index.Host, { key: '1583bccc0f87c5c454f73da9d6d8c2729fb4ca0e', "data-orientation": this.orientation, "data-invalid": this.invalid ? '' : undefined, role: hasMultiple ? 'group' : undefined }, index.h("div", { key: 'd463dec6a4858ab4dee8312418d2d9bc0a629bdb', class: "field" }, index.h("div", { key: 'a73cceaea5c25151f3ea42a9bfd6b160d886285c', class: "field-label" }, index.h("slot", { key: 'b2e5596bf6e3d225611646cdeb1bb885244ef486', name: "label" })), index.h("div", { key: '9cb6521cf8fd82302bfb0cab5db861ed94f0540d', class: "field-control" }, index.h("slot", { key: '965694631bb131a558e7d7d62bc91f35c4081adb' })), index.h("div", { key: 'aa247a7d7e6c076f4113cf4c71230addee341bda', class: "field-description" }, index.h("slot", { key: 'eb7ab7001a1070700aa8d3be8eba2d6ccdcc633b', name: "description" })), index.h("div", { key: '9dc8970c328b1b24ee7814e73673188c2165252f', class: "field-error" }, index.h("slot", { key: '243f0b2da99821057a374cb2134c29eb7ed2e3e1', name: "error" })))));
41
+ return (index.h(index.Host, { key: '7d408fdb23512ed73f2e3b824323299259a9f54e', "data-orientation": this.orientation, "data-invalid": this.invalid ? '' : undefined, role: hasMultiple ? 'group' : undefined }, index.h("div", { key: 'ed41345dd9f4a215348ada06e18963b0636ff39b', class: "field" }, index.h("div", { key: '3c47939088ff6daa0b6764e67e041ebfbaae3fe5', class: "field-label" }, index.h("slot", { key: 'ab1f28345bdf3daf232b0336f2e2dad8e86a4e0d', name: "label" })), index.h("div", { key: 'f51416218c47263b93401596de55d4dc97a448a3', class: "field-control" }, index.h("slot", { key: '890e240b0977bea0749f61799d93921404ff1c60' })), index.h("div", { key: '10c7383951a8c011d1c1453c52ed90009774d1cc', class: "field-description" }, index.h("slot", { key: 'b704d490e0299e8c9e5a48b8710024d0940cc63f', name: "description" })), index.h("div", { key: '3e474168ee78566198a27677ddbc489b953cea3e', class: "field-error" }, index.h("slot", { key: '8bd880c75f7c5044d3c27651bca268b54a42f3df', name: "error" })))));
42
42
  }
43
43
  get el() { return index.getElement(this); }
44
44
  };
@@ -14,7 +14,7 @@ const SekiFieldset = class {
14
14
  this.disabled = false;
15
15
  }
16
16
  render() {
17
- return (index.h("fieldset", { key: '8d7a47b3f837d34c11b905f64a35fe167fd9b16f', disabled: this.disabled, class: "fieldset" }, index.h("slot", { key: 'b620fe4fe86449d3cfb9e47db6837dbc5a8ad771', name: "legend" }), index.h("div", { key: 'd122e6eb636e8742cb8ac429c5879cb54bfce392', class: "fieldset-content" }, index.h("slot", { key: 'ea7f4dbea6e07c9b9cf68d7f3be5ea40500ed11f' }))));
17
+ return (index.h("fieldset", { key: '71604f49a136c1bb6c907c8dc3ac669898e663cd', disabled: this.disabled, class: "fieldset" }, index.h("slot", { key: '8f27126458260cc264b230877b8363290bbbdad3', name: "legend" }), index.h("div", { key: '04cc5aa90217a824db0150f2ac9a23c0308f5c71', class: "fieldset-content" }, index.h("slot", { key: 'e6e47348a642909c61fe042ab15e9cb8eb29adee' }))));
18
18
  }
19
19
  };
20
20
  SekiFieldset.style = sekiFieldsetCss;
@@ -92,7 +92,7 @@ const SekiInput = class {
92
92
  }
93
93
  }
94
94
  render() {
95
- return (index.h("input", { key: '064e47b431dd96aeaace5092ff3e7fe3ebf9b6c1', type: this.type, value: this.value, placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, required: this.required, name: this.name, autocomplete: this.autocomplete, min: this.min, max: this.max, step: this.step, pattern: this.pattern, minlength: this.minlength, maxlength: this.maxlength, class: `input input--${this.size}${this.invalid ? ' input--invalid' : ''}`, "aria-label": this.ariaLabel, "aria-describedby": this.ariaDescribedby, "aria-invalid": this.invalid ? 'true' : null, "aria-disabled": this.disabled ? 'true' : null, onInput: this.handleInput, onChange: this.handleChange, onFocus: this.handleFocus, onBlur: this.handleBlur }));
95
+ return (index.h("input", { key: '8eb8533483c82c21b5beeb53564834e3b12818f3', type: this.type, value: this.value, placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, required: this.required, name: this.name, autocomplete: this.autocomplete, min: this.min, max: this.max, step: this.step, pattern: this.pattern, minlength: this.minlength, maxlength: this.maxlength, class: `input input--${this.size}${this.invalid ? ' input--invalid' : ''}`, "aria-label": this.ariaLabel, "aria-describedby": this.ariaDescribedby, "aria-invalid": this.invalid ? 'true' : null, "aria-disabled": this.disabled ? 'true' : null, onInput: this.handleInput, onChange: this.handleChange, onFocus: this.handleFocus, onBlur: this.handleBlur }));
96
96
  }
97
97
  static get formAssociated() { return true; }
98
98
  };
@@ -13,7 +13,7 @@ const SekiSelectGroup = class {
13
13
  // Render
14
14
  // ===========================
15
15
  render() {
16
- return (index.h(index.Host, { key: 'fb93edf7bf779fda68623f4cc129f736fd1f821d' }, index.h("div", { key: '3c17548db569c9034a06ca0faa4d33512a8f9f65', class: "group", role: "group", "aria-labelledby": this.groupLabelId }, index.h("div", { key: '12d0fda08d5c45f28e7d3044ce49389b7bec5fb6', class: "group-separator", "aria-hidden": "true" }), index.h("div", { key: '61ce1d924e05a42f3c11204010669168cff1b986', class: "group-label", id: this.groupLabelId, role: "presentation" }, index.h("slot", { key: '579556c1df24e58f04ee3462a3c04cc386c87f8b', name: "label" }, this.label)), index.h("div", { key: 'c800bf175b2b09803d08a9fd6ec618763f09c80c', class: "group-options" }, index.h("slot", { key: 'bdd19ca2776737cc639272fbbf4faf3324559833' })))));
16
+ return (index.h(index.Host, { key: 'eb653182cb7b5abc3cae421b8d2d1e8ac2986711' }, index.h("div", { key: 'a8d7acb214f068a8e0632a6c351a001f8763c7f4', class: "group", role: "group", "aria-labelledby": this.groupLabelId }, index.h("div", { key: 'b824a62902fdab61643ec531312cb334c503039c', class: "group-separator", "aria-hidden": "true" }), index.h("div", { key: 'dd4cb2c630cc3168871bc8341153ed12286a3568', class: "group-label", id: this.groupLabelId, role: "presentation" }, index.h("slot", { key: '772b976e269f92fd3f4e0bfe3a1e46655fcac9e1', name: "label" }, this.label)), index.h("div", { key: 'c986fad023b5b3678f8a5aa1fd90eea60c6bb41a', class: "group-options" }, index.h("slot", { key: 'ae49a1089f894b3a2efe55814b79115eaeb67d7c' })))));
17
17
  }
18
18
  };
19
19
  SekiSelectGroup.style = sekiSelectGroupCss;
@@ -79,7 +79,7 @@ const SekiSelectOption = class {
79
79
  const selectContext = this.getSelectContext();
80
80
  const isSelected = (selectContext === null || selectContext === void 0 ? void 0 : selectContext.isValueSelected(this.value)) || false;
81
81
  const isFocused = (selectContext === null || selectContext === void 0 ? void 0 : selectContext.focusedOptionValue) === this.value;
82
- return (index.h(index.Host, { key: '7f26f5bab21717ee83ccdac1bacf9f626a54cba4' }, index.h("div", { key: '3f8cf23a3c282ad6835765da02d18d23b8a1eda2', class: "option", role: "option", id: this.optionId, onClick: this.handleOptionClick, onFocus: this.handleOptionFocus, onKeyDown: this.handleOptionKeyDown, "aria-selected": isSelected ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : undefined, "data-selected": isSelected ? 'true' : undefined, "data-focused": isFocused ? 'true' : undefined, "data-disabled": this.disabled ? 'true' : undefined, tabindex: -1 }, index.h("span", { key: '2bbbec64c8ab4c9fd467a2daf98903421c5cb81c', class: "option-label" }, index.h("slot", { key: '802b18248a082e4f4f63cf1cec3d1a3dc64b6c20' })), isSelected && (index.h("span", { key: '946143b7ebaf2bee220cbf02c3a52c415c5fd6d6', class: "option-indicator", "aria-hidden": "true" }, index.h("slot", { key: '963067c64e4a9d8033d5846edada7a4db774052a', name: "selected-indicator" }, index.h("svg", { key: '4072b0cb265160df40151fd62a89fe5d0e925327', width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: '93a47d2ccff5c8393ee3c5788434c41f69971e4d', d: "M10 3L4.5 8.5L2 6", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))))))));
82
+ return (index.h(index.Host, { key: '368d46b8ceba8e1591986e2c5badadeba25d6d63' }, index.h("div", { key: 'a222d31554354b845f976c7fda2baae8b1262afb', class: "option", role: "option", id: this.optionId, onClick: this.handleOptionClick, onFocus: this.handleOptionFocus, onKeyDown: this.handleOptionKeyDown, "aria-selected": isSelected ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : undefined, "data-selected": isSelected ? 'true' : undefined, "data-focused": isFocused ? 'true' : undefined, "data-disabled": this.disabled ? 'true' : undefined, tabindex: -1 }, index.h("span", { key: '6c2b16e8a4de74912a55762fd71d11b960e070c0', class: "option-label" }, index.h("slot", { key: '99a147943a0e965170c7dde7b9fbf4745262c302' })), isSelected && (index.h("span", { key: 'b436d100e94537723b8daa78869b1ff199c0c121', class: "option-indicator", "aria-hidden": "true" }, index.h("slot", { key: '037f26b6213220ef26f88e70895b358cb615cc46', name: "selected-indicator" }, index.h("svg", { key: '54a7fbc3119e83bfd1173cc60b349cb9eb0d745a', width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: '22c392c22a9334bf302c85bf2745deb701dfdf59', d: "M10 3L4.5 8.5L2 6", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))))))));
83
83
  }
84
84
  get el() { return index.getElement(this); }
85
85
  };
@@ -340,7 +340,7 @@ const SekiSelect = class {
340
340
  // Render
341
341
  // ===========================
342
342
  render() {
343
- return (index.h(index.Host, { key: '7b85ab6beecb3d69f522a2362e47905afb4c2cfa' }, index.h("slot", { key: 'dd239306507d718a70dd508c00e871914eecacec' }), this.name && this.renderHiddenNativeElement()));
343
+ return (index.h(index.Host, { key: '78edc08bd62bc19a1752ec58b966e57e5ef3afc8' }, index.h("slot", { key: 'adcf89b43702e2f62a60d73e693d9b5d362e3169' }), this.name && this.renderHiddenNativeElement()));
344
344
  }
345
345
  renderHiddenNativeElement() {
346
346
  if (this.multiple) {
@@ -17,7 +17,7 @@ const SekiSkeleton = class {
17
17
  }
18
18
  }
19
19
  render() {
20
- return (index.h("div", { key: '4908bccb6a551042c9bac657c07f656aa89e0fd0', class: "skeleton", part: "skeleton", role: "status", "aria-busy": "true", "aria-label": this.ariaLabel || undefined }));
20
+ return (index.h("div", { key: '11473c8f2d21d98f1836419fe0c628fbaf5e1e7d', class: "skeleton", part: "skeleton", role: "status", "aria-busy": "true", "aria-label": this.ariaLabel || undefined }));
21
21
  }
22
22
  };
23
23
  SekiSkeleton.style = sekiSkeletonCss;
@@ -0,0 +1,349 @@
1
+ 'use strict';
2
+
3
+ var index = require('./index-Dd6_-KaR.js');
4
+
5
+ const sekiTooltipCss = ":host{--seki-neutral-50:hsl(0, 0%, 98%);--seki-neutral-100:hsl(0, 0%, 96.1%);--seki-neutral-200:hsl(0, 0%, 89.8%);--seki-neutral-300:hsl(0, 0%, 83.1%);--seki-neutral-400:hsl(0, 0%, 63.9%);--seki-neutral-500:hsl(0, 0%, 45.1%);--seki-neutral-600:hsl(0, 0%, 32.2%);--seki-neutral-700:hsl(0, 0%, 25.1%);--seki-neutral-800:hsl(0, 0%, 14.9%);--seki-neutral-900:hsl(0, 0%, 9%);--seki-neutral-950:hsl(0, 0%, 3.9%);--seki-primary-50:hsl(210, 100%, 97%);--seki-primary-100:hsl(210, 95%, 93%);--seki-primary-200:hsl(210, 95%, 85%);--seki-primary-300:hsl(210, 90%, 73%);--seki-primary-400:hsl(210, 85%, 58%);--seki-primary-500:hsl(210, 80%, 48%);--seki-primary-600:hsl(210, 75%, 40%);--seki-primary-700:hsl(210, 70%, 32%);--seki-primary-800:hsl(210, 65%, 25%);--seki-primary-900:hsl(210, 60%, 18%);--seki-primary-950:hsl(210, 55%, 10%);--seki-success-500:hsl(142, 71%, 45%);--seki-success-600:hsl(142, 71%, 35%);--seki-warning-500:hsl(38, 92%, 50%);--seki-warning-600:hsl(38, 92%, 40%);--seki-destructive-500:hsl(0, 84.2%, 60.2%);--seki-destructive-600:hsl(0, 72%, 41%)}:host{--seki-background:hsl(0, 0%, 100%);--seki-foreground:hsl(0, 0%, 3.9%);--seki-muted:hsl(0, 0%, 96.1%);--seki-muted-foreground:hsl(0, 0%, 45.1%);--seki-card:hsl(0, 0%, 100%);--seki-card-foreground:hsl(0, 0%, 3.9%);--seki-popover:hsl(0, 0%, 100%);--seki-popover-foreground:hsl(0, 0%, 3.9%);--seki-border:hsl(0, 0%, 89.8%);--seki-input:hsl(0, 0%, 89.8%);--seki-primary:hsl(0, 0%, 9%);--seki-primary-foreground:hsl(0, 0%, 98%);--seki-secondary:hsl(0, 0%, 96.1%);--seki-secondary-foreground:hsl(0, 0%, 9%);--seki-accent:hsl(0, 0%, 96.1%);--seki-accent-foreground:hsl(0, 0%, 9%);--seki-destructive:hsl(0, 84.2%, 60.2%);--seki-destructive-foreground:hsl(0, 0%, 98%);--seki-ring:hsl(0, 0%, 3.9%);--seki-bg-primary:var(--seki-background);--seki-bg-secondary:var(--seki-muted);--seki-bg-tertiary:var(--seki-accent);--seki-text-primary:var(--seki-foreground);--seki-text-secondary:var(--seki-muted-foreground);--seki-text-tertiary:var(--seki-neutral-400);--seki-border-default:var(--seki-border);--seki-border-emphasis:var(--seki-neutral-300)}:host([data-theme='dark']){--seki-background:hsl(0, 0%, 3.9%);--seki-foreground:hsl(0, 0%, 98%);--seki-muted:hsl(0, 0%, 14.9%);--seki-muted-foreground:hsl(0, 0%, 63.9%);--seki-card:hsl(0, 0%, 3.9%);--seki-card-foreground:hsl(0, 0%, 98%);--seki-popover:hsl(0, 0%, 3.9%);--seki-popover-foreground:hsl(0, 0%, 98%);--seki-border:hsl(0, 0%, 14.9%);--seki-input:hsl(0, 0%, 14.9%);--seki-primary:hsl(0, 0%, 98%);--seki-primary-foreground:hsl(0, 0%, 9%);--seki-secondary:hsl(0, 0%, 14.9%);--seki-secondary-foreground:hsl(0, 0%, 98%);--seki-accent:hsl(0, 0%, 14.9%);--seki-accent-foreground:hsl(0, 0%, 98%);--seki-destructive:hsl(0, 62.8%, 30.6%);--seki-destructive-foreground:hsl(0, 0%, 98%);--seki-ring:hsl(0, 0%, 83.1%);--seki-bg-primary:var(--seki-background);--seki-bg-secondary:var(--seki-muted);--seki-bg-tertiary:var(--seki-accent);--seki-text-primary:var(--seki-foreground);--seki-text-secondary:var(--seki-muted-foreground);--seki-text-tertiary:var(--seki-neutral-600);--seki-border-default:var(--seki-border);--seki-border-emphasis:var(--seki-neutral-700);--seki-button-primary-hover-bg:hsl(0, 0%, 98%, 0.9);--seki-button-secondary-hover-bg:hsl(0, 0%, 14.9%, 0.8)}:host{--seki-button-primary-bg:var(--seki-primary);--seki-button-primary-text:var(--seki-primary-foreground);--seki-button-primary-border:transparent;--seki-button-primary-hover-bg:hsl(0, 0%, 9%, 0.9);--seki-button-primary-hover-text:var(--seki-primary-foreground);--seki-button-primary-hover-border:transparent;--seki-button-secondary-bg:var(--seki-secondary);--seki-button-secondary-text:var(--seki-secondary-foreground);--seki-button-secondary-border:transparent;--seki-button-secondary-hover-bg:hsl(0, 0%, 96.1%, 0.8);--seki-button-secondary-hover-text:var(--seki-secondary-foreground);--seki-button-secondary-hover-border:transparent;--seki-button-outline-bg:transparent;--seki-button-outline-text:var(--seki-foreground);--seki-button-outline-border:var(--seki-input);--seki-button-outline-hover-bg:var(--seki-accent);--seki-button-outline-hover-text:var(--seki-accent-foreground);--seki-button-outline-hover-border:var(--seki-input);--seki-button-ghost-bg:transparent;--seki-button-ghost-text:var(--seki-foreground);--seki-button-ghost-border:transparent;--seki-button-ghost-hover-bg:var(--seki-accent);--seki-button-ghost-hover-text:var(--seki-accent-foreground);--seki-button-ghost-hover-border:transparent;--seki-button-destructive-bg:var(--seki-destructive);--seki-button-destructive-text:var(--seki-destructive-foreground);--seki-button-destructive-border:transparent;--seki-button-destructive-hover-bg:hsl(0, 84.2%, 60.2%, 0.9);--seki-button-destructive-hover-border:transparent;--seki-button-sm-padding-x:var(--seki-spacing-3, 0.75rem);--seki-button-sm-padding-y:0.375rem;--seki-button-sm-font-size:var(--seki-text-sm, 0.875rem);--seki-button-sm-height:2.25rem;--seki-button-md-padding-x:var(--seki-spacing-4, 1rem);--seki-button-md-padding-y:var(--seki-spacing-2, 0.5rem);--seki-button-md-font-size:var(--seki-text-base, 1rem);--seki-button-md-height:2.5rem;--seki-button-lg-padding-x:2rem;--seki-button-lg-padding-y:0.5rem;--seki-button-lg-font-size:1rem;--seki-button-lg-height:2.75rem;--seki-button-icon-sm-size:2rem;--seki-button-icon-size:2.5rem;--seki-button-icon-lg-size:3rem;--seki-button-icon-gap:0.5rem;--seki-button-link-bg:transparent;--seki-button-link-text:var(--seki-primary);--seki-button-link-border:transparent;--seki-button-link-hover-bg:transparent;--seki-button-link-hover-text:var(--seki-primary);--seki-button-link-hover-border:transparent;--seki-button-radius:var(--seki-radius-md, 0.375rem);--seki-button-font-weight:var(--seki-font-medium, 500);--seki-button-transition-duration:150ms;--seki-button-transition-timing:ease-in-out;--seki-button-shadow:var(--seki-shadow-sm, 0 1px 2px 0 rgb(0 0 0 / 0.05));--seki-button-shadow-hover:var(--seki-shadow-md, 0 4px 6px -1px rgb(0 0 0 / 0.1));--seki-button-disabled-opacity:0.5;--seki-input-bg:var(--seki-background);--seki-input-border:var(--seki-border);--seki-input-text:var(--seki-foreground);--seki-input-placeholder:var(--seki-muted-foreground);--seki-input-ring:var(--seki-ring);--seki-input-invalid-border:var(--seki-destructive);--seki-input-invalid-ring:var(--seki-destructive);--seki-input-disabled-opacity:0.5;--seki-input-radius:var(--seki-radius-md);--seki-input-ring-offset:2px;--seki-select-trigger-bg:var(--seki-background);--seki-select-trigger-border:1px solid var(--seki-border);--seki-select-trigger-bg-hover:var(--seki-muted);--seki-select-trigger-radius:var(--seki-radius-md);--seki-select-trigger-min-height:2.5rem;--seki-select-trigger-padding:0.5rem 0.75rem;--seki-select-trigger-gap:0.5rem;--seki-select-content-bg:var(--seki-popover);--seki-select-content-border:1px solid var(--seki-border);--seki-select-content-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1);--seki-select-content-radius:var(--seki-radius-md);--seki-select-content-padding:0.5rem 0;--seki-select-option-padding:0.5rem 0.75rem;--seki-select-option-gap:0.5rem;--seki-select-option-radius:var(--seki-radius-sm);--seki-select-option-bg-hover:var(--seki-muted);--seki-select-option-bg-selected:var(--seki-muted);--seki-select-group-label-padding:0.5rem 0.75rem;--seki-select-group-label-font-size:var(--seki-font-size-xs);--seki-select-group-label-font-weight:var(--seki-font-semibold);--seki-select-group-label-color:var(--seki-muted-foreground);--seki-select-group-separator:1px solid var(--seki-border)}:host{--seki-spacing-0:0;--seki-spacing-0-5:0.125rem;--seki-spacing-1:0.25rem;--seki-spacing-1-5:0.375rem;--seki-spacing-2:0.5rem;--seki-spacing-2-5:0.625rem;--seki-spacing-3:0.75rem;--seki-spacing-3-5:0.875rem;--seki-spacing-4:1rem;--seki-spacing-5:1.25rem;--seki-spacing-6:1.5rem;--seki-spacing-8:2rem;--seki-spacing-10:2.5rem;--seki-spacing-12:3rem;--seki-spacing-16:4rem;--seki-spacing-20:5rem;--seki-spacing-24:6rem;--seki-input-height-sm:2rem;--seki-input-height-md:2.5rem;--seki-input-height-lg:3rem;--seki-input-padding-x:0.75rem;--seki-input-padding-y:0.5rem;--seki-input-font-size:0.875rem;--seki-input-ring-offset:2px}:host{--seki-shadow-sm:0 1px 2px 0 rgb(0 0 0 / 0.05);--seki-shadow-md:0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);--seki-shadow-lg:0 10px 15px -3px rgb(0 0 0 / 0.15), 0 4px 6px -4px rgb(0 0 0 / 0.1)}:host{--seki-font-sans:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue',\n Arial, sans-serif;--seki-font-mono:ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;--seki-text-xs:0.75rem;--seki-text-sm:0.875rem;--seki-text-base:1rem;--seki-text-lg:1.125rem;--seki-text-xl:1.25rem;--seki-text-2xl:1.5rem;--seki-text-3xl:1.875rem;--seki-text-4xl:2.25rem;--seki-font-normal:400;--seki-font-medium:500;--seki-font-semibold:600;--seki-font-bold:700;--seki-leading-tight:1.25;--seki-leading-normal:1.5;--seki-leading-relaxed:1.75}:host{--seki-radius-sm:0.25rem;--seki-radius-md:0.375rem;--seki-radius-lg:0.5rem;--seki-radius-xl:1rem;}:host{display:contents;--tooltip-bg:var(--seki-color-background);--tooltip-text:var(--seki-color-foreground);--tooltip-padding:var(--seki-spacing-2) var(--seki-spacing-3);--tooltip-radius:var(--seki-radius-md);--tooltip-shadow:var(--seki-shadow-md);--tooltip-font-size:var(--seki-font-size-body-sm);--tooltip-arrow-size:8px;--tooltip-transition-duration:200ms}@media (prefers-color-scheme: dark){:host{--tooltip-bg:var(--seki-color-background-dark, #1a1a1a);--tooltip-text:var(--seki-color-foreground-dark, #ffffff)}}:host([data-theme='dark']){--tooltip-bg:var(--seki-color-background-dark, #1a1a1a);--tooltip-text:var(--seki-color-foreground-dark, #ffffff)}.tooltip{position:fixed;box-sizing:border-box;background-color:var(--tooltip-bg);color:var(--tooltip-text);padding:var(--tooltip-padding);border-radius:var(--tooltip-radius);box-shadow:var(--tooltip-shadow);font-family:var(--seki-font-sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif);font-size:var(--tooltip-font-size);line-height:1.5;max-width:280px;word-wrap:break-word;z-index:1000;pointer-events:auto;opacity:0;transform:scale(0.95) translateY(-4px);transition:opacity var(--tooltip-transition-duration) ease-out,\n transform var(--tooltip-transition-duration) ease-out;visibility:hidden}.tooltip--visible{opacity:1;transform:scale(1) translateY(0);visibility:visible}.tooltip-arrow{position:absolute;width:var(--tooltip-arrow-size);height:var(--tooltip-arrow-size);background-color:var(--tooltip-bg);transform:rotate(45deg);pointer-events:none}.tooltip[data-side='top']{margin-bottom:calc(var(--tooltip-arrow-size) / 2 + 4px)}.tooltip[data-side='top'] .tooltip-arrow{bottom:calc(var(--tooltip-arrow-size) / -2);left:50%;transform:translateX(-50%) rotate(45deg)}.tooltip[data-side='bottom']{margin-top:calc(var(--tooltip-arrow-size) / 2 + 4px)}.tooltip[data-side='bottom'] .tooltip-arrow{top:calc(var(--tooltip-arrow-size) / -2);left:50%;transform:translateX(-50%) rotate(45deg)}.tooltip[data-side='left']{margin-right:calc(var(--tooltip-arrow-size) / 2 + 4px)}.tooltip[data-side='left'] .tooltip-arrow{right:calc(var(--tooltip-arrow-size) / -2);top:50%;transform:translateY(-50%) rotate(45deg)}.tooltip[data-side='right']{margin-left:calc(var(--tooltip-arrow-size) / 2 + 4px)}.tooltip[data-side='right'] .tooltip-arrow{left:calc(var(--tooltip-arrow-size) / -2);top:50%;transform:translateY(-50%) rotate(45deg)}.tooltip:focus-visible{outline:2px solid var(--seki-accent);outline-offset:2px}@media (prefers-reduced-motion: reduce){.tooltip{transition:opacity 0s, transform 0s}}::slotted([slot='content']){margin:0;line-height:inherit;font-size:inherit}::slotted([slot='trigger']){cursor:help}";
6
+
7
+ const SekiTooltip = class {
8
+ constructor(hostRef) {
9
+ index.registerInstance(this, hostRef);
10
+ this.showTooltip = index.createEvent(this, "showTooltip");
11
+ this.hideTooltip = index.createEvent(this, "hideTooltip");
12
+ this.positioned = index.createEvent(this, "positioned");
13
+ /**
14
+ * Milliseconds to delay before showing tooltip on hover
15
+ * @default 0
16
+ * @min 0
17
+ * @max 2000
18
+ */
19
+ this.delay = 0;
20
+ /**
21
+ * Preferred positioning side for tooltip
22
+ * 'auto' uses intelligent repositioning based on viewport space
23
+ * @default 'auto'
24
+ */
25
+ this.side = 'auto';
26
+ /**
27
+ * Disable tooltip interactions and visibility
28
+ * @default false
29
+ */
30
+ this.disabled = false;
31
+ /**
32
+ * Pixels between tooltip and trigger element
33
+ * @default 8
34
+ * @min 0
35
+ */
36
+ this.offset = 8;
37
+ /**
38
+ * Internal state: whether tooltip is currently visible
39
+ */
40
+ this.isVisible = false;
41
+ /**
42
+ * Internal state: current calculated position
43
+ */
44
+ this.currentPosition = 'top';
45
+ // Internal state tracking
46
+ this.showTimer = null;
47
+ this.hideTimer = null;
48
+ this.triggerEl = null;
49
+ this.longPressTimer = null;
50
+ this.touchStartX = 0;
51
+ this.touchStartY = 0;
52
+ /**
53
+ * Handle mouse enter on trigger
54
+ */
55
+ this.onTriggerMouseEnter = () => {
56
+ if (this.disabled)
57
+ return;
58
+ // Clear hide timer if exists
59
+ if (this.hideTimer) {
60
+ clearTimeout(this.hideTimer);
61
+ this.hideTimer = null;
62
+ }
63
+ // Set show timer with delay
64
+ if (this.showTimer) {
65
+ clearTimeout(this.showTimer);
66
+ }
67
+ this.showTimer = window.setTimeout(() => {
68
+ this.show();
69
+ }, this.delay);
70
+ };
71
+ /**
72
+ * Handle mouse leave from trigger
73
+ */
74
+ this.onTriggerMouseLeave = () => {
75
+ // Clear show timer
76
+ if (this.showTimer) {
77
+ clearTimeout(this.showTimer);
78
+ this.showTimer = null;
79
+ }
80
+ // Debounce hide to allow moving back over trigger
81
+ if (this.hideTimer) {
82
+ clearTimeout(this.hideTimer);
83
+ }
84
+ this.hideTimer = window.setTimeout(() => {
85
+ this.hide();
86
+ }, 100);
87
+ };
88
+ /**
89
+ * Handle focus on trigger (accessibility)
90
+ */
91
+ this.onTriggerFocus = () => {
92
+ if (this.disabled)
93
+ return;
94
+ // Clear timers
95
+ if (this.showTimer)
96
+ clearTimeout(this.showTimer);
97
+ if (this.hideTimer)
98
+ clearTimeout(this.hideTimer);
99
+ this.showTimer = null;
100
+ this.hideTimer = null;
101
+ // Show immediately on focus (no delay)
102
+ this.show();
103
+ };
104
+ /**
105
+ * Handle blur from trigger
106
+ */
107
+ this.onTriggerBlur = () => {
108
+ // Clear timers
109
+ if (this.showTimer)
110
+ clearTimeout(this.showTimer);
111
+ if (this.hideTimer)
112
+ clearTimeout(this.hideTimer);
113
+ this.showTimer = null;
114
+ this.hideTimer = null;
115
+ // Hide immediately on blur
116
+ this.hide();
117
+ };
118
+ /**
119
+ * Handle touch start (long-press detection)
120
+ */
121
+ this.onTriggerTouchStart = (e) => {
122
+ if (this.disabled || !e.touches[0])
123
+ return;
124
+ this.touchStartX = e.touches[0].clientX;
125
+ this.touchStartY = e.touches[0].clientY;
126
+ // Start long-press timer (500ms)
127
+ if (this.longPressTimer)
128
+ clearTimeout(this.longPressTimer);
129
+ this.longPressTimer = window.setTimeout(() => {
130
+ this.show();
131
+ }, 500);
132
+ };
133
+ /**
134
+ * Handle touch move (cancel long-press if movement > 10px)
135
+ */
136
+ this.onTriggerTouchMove = (e) => {
137
+ if (!e.touches[0] || !this.longPressTimer)
138
+ return;
139
+ const dx = Math.abs(e.touches[0].clientX - this.touchStartX);
140
+ const dy = Math.abs(e.touches[0].clientY - this.touchStartY);
141
+ if (dx > 10 || dy > 10) {
142
+ // Movement too large, cancel long-press
143
+ clearTimeout(this.longPressTimer);
144
+ this.longPressTimer = null;
145
+ }
146
+ };
147
+ /**
148
+ * Handle touch end (cancel long-press if not yet fired)
149
+ */
150
+ this.onTriggerTouchEnd = () => {
151
+ if (this.longPressTimer) {
152
+ clearTimeout(this.longPressTimer);
153
+ this.longPressTimer = null;
154
+ }
155
+ };
156
+ /**
157
+ * Handle Escape key to dismiss tooltip
158
+ */
159
+ this.onEscapeKey = (event) => {
160
+ if (event.key === 'Escape' && this.isVisible) {
161
+ event.preventDefault();
162
+ this.hide();
163
+ // Keep focus on trigger
164
+ const trigger = this.el.querySelector('[slot="trigger"]');
165
+ if (trigger) {
166
+ trigger.focus();
167
+ }
168
+ }
169
+ };
170
+ }
171
+ /**
172
+ * Show tooltip programmatically
173
+ * @returns Promise resolves when tooltip is visible
174
+ */
175
+ async show() {
176
+ if (this.disabled)
177
+ return;
178
+ // Clear any pending hide timer
179
+ if (this.hideTimer) {
180
+ clearTimeout(this.hideTimer);
181
+ this.hideTimer = null;
182
+ }
183
+ // Set visible state
184
+ this.isVisible = true;
185
+ // Calculate position
186
+ this.calculatePosition();
187
+ // Emit show event
188
+ this.showTooltip.emit({ triggerEl: this.triggerEl || this.el });
189
+ }
190
+ /**
191
+ * Hide tooltip programmatically
192
+ * @returns Promise resolves when tooltip is hidden
193
+ */
194
+ async hide() {
195
+ // Clear any pending show timer
196
+ if (this.showTimer) {
197
+ clearTimeout(this.showTimer);
198
+ this.showTimer = null;
199
+ }
200
+ // Set hidden state
201
+ this.isVisible = false;
202
+ // Emit hide event
203
+ this.hideTooltip.emit({ reason: 'blur' });
204
+ }
205
+ /**
206
+ * Recalculate tooltip position
207
+ * Call after trigger element moves or window resizes
208
+ */
209
+ async updatePosition() {
210
+ if (this.isVisible) {
211
+ this.calculatePosition();
212
+ }
213
+ }
214
+ /**
215
+ * Calculate tooltip position based on viewport
216
+ */
217
+ calculatePosition() {
218
+ var _a;
219
+ // Get trigger element
220
+ const trigger = this.el.querySelector('[slot="trigger"]');
221
+ if (!trigger)
222
+ return;
223
+ this.triggerEl = trigger;
224
+ // Get tooltip element from shadow DOM
225
+ const tooltip = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.tooltip');
226
+ if (!tooltip)
227
+ return;
228
+ // Get trigger bounds
229
+ const triggerRect = trigger.getBoundingClientRect();
230
+ const tooltipRect = tooltip.getBoundingClientRect();
231
+ const viewport = {
232
+ width: window.innerWidth,
233
+ height: window.innerHeight,
234
+ };
235
+ // Calculate positions
236
+ const positions = {
237
+ top: {
238
+ x: triggerRect.left + triggerRect.width / 2 - tooltipRect.width / 2,
239
+ y: triggerRect.top - tooltipRect.height - this.offset,
240
+ },
241
+ bottom: {
242
+ x: triggerRect.left + triggerRect.width / 2 - tooltipRect.width / 2,
243
+ y: triggerRect.top + triggerRect.height + this.offset,
244
+ },
245
+ left: {
246
+ x: triggerRect.left - tooltipRect.width - this.offset,
247
+ y: triggerRect.top + triggerRect.height / 2 - tooltipRect.height / 2,
248
+ },
249
+ right: {
250
+ x: triggerRect.left + triggerRect.width + this.offset,
251
+ y: triggerRect.top + triggerRect.height / 2 - tooltipRect.height / 2,
252
+ },
253
+ };
254
+ // Check each position for viewport fit (8px margin minimum)
255
+ const margin = 8;
256
+ for (const [sideKey, pos] of Object.entries(positions)) {
257
+ const fits = pos.x >= margin &&
258
+ pos.x + tooltipRect.width <= viewport.width - margin &&
259
+ pos.y >= margin &&
260
+ pos.y + tooltipRect.height <= viewport.height - margin;
261
+ if (fits) {
262
+ this.currentPosition = sideKey;
263
+ this.applyPosition(tooltip, pos);
264
+ this.positioned.emit({ side: this.currentPosition, offset: this.offset });
265
+ return;
266
+ }
267
+ }
268
+ // Fallback: use preferred side, clamp to viewport
269
+ const preferredSide = this.side === 'auto' ? 'top' : this.side;
270
+ const pos = positions[preferredSide] || positions.top;
271
+ this.currentPosition = preferredSide;
272
+ // Clamp to viewport
273
+ pos.x = Math.max(margin, Math.min(pos.x, viewport.width - tooltipRect.width - margin));
274
+ pos.y = Math.max(margin, Math.min(pos.y, viewport.height - tooltipRect.height - margin));
275
+ this.applyPosition(tooltip, pos);
276
+ this.positioned.emit({ side: this.currentPosition, offset: this.offset });
277
+ }
278
+ /**
279
+ * Apply calculated position to tooltip element
280
+ */
281
+ applyPosition(tooltip, pos) {
282
+ tooltip.style.position = 'fixed';
283
+ tooltip.style.left = `${pos.x}px`;
284
+ tooltip.style.top = `${pos.y}px`;
285
+ tooltip.style.zIndex = '1000';
286
+ }
287
+ /**
288
+ * Attach event listeners to trigger
289
+ */
290
+ attachTriggerListeners() {
291
+ const trigger = this.el.querySelector('[slot="trigger"]');
292
+ if (!trigger)
293
+ return;
294
+ // Mouse events
295
+ trigger.addEventListener('mouseenter', this.onTriggerMouseEnter);
296
+ trigger.addEventListener('mouseleave', this.onTriggerMouseLeave);
297
+ // Keyboard events (focus/blur)
298
+ trigger.addEventListener('focus', this.onTriggerFocus);
299
+ trigger.addEventListener('blur', this.onTriggerBlur);
300
+ // Touch events (long-press)
301
+ trigger.addEventListener('touchstart', this.onTriggerTouchStart);
302
+ trigger.addEventListener('touchmove', this.onTriggerTouchMove);
303
+ trigger.addEventListener('touchend', this.onTriggerTouchEnd);
304
+ // Escape key on document
305
+ document.addEventListener('keydown', this.onEscapeKey);
306
+ // Apply aria-describedby to trigger
307
+ const contentSlot = this.el.querySelector('[slot="content"]');
308
+ if (contentSlot) {
309
+ const contentId = `tooltip-${Math.random().toString(36).substr(2, 9)}`;
310
+ contentSlot.id = contentId;
311
+ trigger.setAttribute('aria-describedby', contentId);
312
+ }
313
+ }
314
+ /**
315
+ * Remove event listeners from trigger
316
+ */
317
+ detachTriggerListeners() {
318
+ const trigger = this.el.querySelector('[slot="trigger"]');
319
+ if (!trigger)
320
+ return;
321
+ trigger.removeEventListener('mouseenter', this.onTriggerMouseEnter);
322
+ trigger.removeEventListener('mouseleave', this.onTriggerMouseLeave);
323
+ trigger.removeEventListener('focus', this.onTriggerFocus);
324
+ trigger.removeEventListener('blur', this.onTriggerBlur);
325
+ trigger.removeEventListener('touchstart', this.onTriggerTouchStart);
326
+ trigger.removeEventListener('touchmove', this.onTriggerTouchMove);
327
+ trigger.removeEventListener('touchend', this.onTriggerTouchEnd);
328
+ }
329
+ componentDidLoad() {
330
+ this.attachTriggerListeners();
331
+ }
332
+ disconnectedCallback() {
333
+ this.detachTriggerListeners();
334
+ // Clean up timers
335
+ if (this.showTimer)
336
+ clearTimeout(this.showTimer);
337
+ if (this.hideTimer)
338
+ clearTimeout(this.hideTimer);
339
+ if (this.longPressTimer)
340
+ clearTimeout(this.longPressTimer);
341
+ }
342
+ render() {
343
+ return (index.h("div", { key: '26ad92440881dc154c9fd364dd59d621eb949ba1', class: `tooltip ${this.isVisible ? 'tooltip--visible' : ''}`, role: "tooltip" }, index.h("slot", { key: 'f08dda70ba8fb3dc936e62c3fee51ddf60cd7585', name: "content" }), index.h("div", { key: '14daf9b8dcd099f01c6d4fb704c9dd4bc5081dc7', class: "tooltip-arrow" })));
344
+ }
345
+ get el() { return index.getElement(this); }
346
+ };
347
+ SekiTooltip.style = sekiTooltipCss;
348
+
349
+ exports.seki_tooltip = SekiTooltip;
@@ -18,7 +18,7 @@ var patchBrowser = () => {
18
18
 
19
19
  patchBrowser().then(async (options) => {
20
20
  await index.globalScripts();
21
- return index.bootstrapLazy([["seki-button.cjs",[[257,"seki-button",{"variant":[1],"size":[1],"disabled":[4],"type":[1],"ariaLabel":[1,"aria-label"]}]]],["seki-field.cjs",[[257,"seki-field",{"orientation":[1],"invalid":[4]}]]],["seki-field-description.cjs",[[257,"seki-field-description",{"descriptorId":[1,"descriptor-id"],"componentId":[32],"getId":[64]}]]],["seki-field-error.cjs",[[257,"seki-field-error",{"errorId":[1,"error-id"],"visible":[4],"componentId":[32],"previousVisible":[32],"getId":[64],"setVisible":[64]},null,{"visible":["handleVisibleChange"]}]]],["seki-field-group.cjs",[[257,"seki-field-group",{"gap":[1]}]]],["seki-field-label.cjs",[[257,"seki-field-label",{"htmlFor":[1,"html-for"],"required":[4]}]]],["seki-field-legend.cjs",[[257,"seki-field-legend"]]],["seki-fieldset.cjs",[[257,"seki-fieldset",{"disabled":[4]}]]],["seki-input.cjs",[[321,"seki-input",{"type":[1],"value":[1537],"placeholder":[1],"disabled":[4],"readonly":[4],"required":[4],"name":[1],"autocomplete":[1],"min":[8],"max":[8],"step":[8],"pattern":[1],"minlength":[2],"maxlength":[2],"size":[1],"invalid":[4],"ariaLabel":[1,"aria-label"],"ariaDescribedby":[1,"aria-describedby"]}]]],["seki-select.cjs",[[257,"seki-select",{"value":[1032],"defaultValue":[8,"default-value"],"multiple":[4],"placeholder":[1],"disabled":[4],"required":[4],"open":[1028],"defaultOpen":[4,"default-open"],"name":[1],"maxVisiblePills":[2,"max-visible-pills"],"ariaLabel":[1,"aria-label"],"ariaLabelledby":[1,"aria-labelledby"],"ariaDescribedby":[1,"aria-describedby"],"placement":[1],"maxHeight":[1,"max-height"],"internalValue":[32],"isOpen":[32],"focusedOptionValue":[32],"registeredOptions":[32],"hasBeenActivated":[32],"searchBuffer":[32],"searchActive":[32],"openDropdown":[64],"closeDropdown":[64],"focusTrigger":[64],"clearSelection":[64],"handleKeyboard":[64]},null,{"value":["handleValuePropChange"],"open":["handleOpenPropChange"],"isOpen":["handleIsOpenChange"],"internalValue":["handleInternalValueChange"]}]]],["seki-select-content.cjs",[[257,"seki-select-content",{"forceUpdate":[32],"scrollToOption":[64]}]]],["seki-select-group.cjs",[[257,"seki-select-group",{"label":[1]}]]],["seki-select-option.cjs",[[257,"seki-select-option",{"value":[8],"label":[1],"disabled":[4]}]]],["seki-select-trigger.cjs",[[257,"seki-select-trigger",{"forceUpdate":[32]}]]],["seki-skeleton.cjs",[[257,"seki-skeleton",{"ariaLabel":[1,"aria-label"]}]]],["seki-switch.cjs",[[257,"seki-switch",{"checked":[4],"defaultChecked":[4,"default-checked"],"disabled":[4],"required":[4],"name":[1],"value":[1],"ariaLabel":[1,"aria-label"],"internalChecked":[32]},[[0,"keydown","handleKeyDown"]]]]]], options);
21
+ return index.bootstrapLazy([["seki-button.cjs",[[257,"seki-button",{"variant":[1],"size":[1],"disabled":[4],"type":[1],"ariaLabel":[1,"aria-label"]}]]],["seki-field.cjs",[[257,"seki-field",{"orientation":[1],"invalid":[4]}]]],["seki-field-description.cjs",[[257,"seki-field-description",{"descriptorId":[1,"descriptor-id"],"componentId":[32],"getId":[64]}]]],["seki-field-error.cjs",[[257,"seki-field-error",{"errorId":[1,"error-id"],"visible":[4],"componentId":[32],"previousVisible":[32],"getId":[64],"setVisible":[64]},null,{"visible":["handleVisibleChange"]}]]],["seki-field-group.cjs",[[257,"seki-field-group",{"gap":[1]}]]],["seki-field-label.cjs",[[257,"seki-field-label",{"htmlFor":[1,"html-for"],"required":[4]}]]],["seki-field-legend.cjs",[[257,"seki-field-legend"]]],["seki-fieldset.cjs",[[257,"seki-fieldset",{"disabled":[4]}]]],["seki-input.cjs",[[321,"seki-input",{"type":[1],"value":[1537],"placeholder":[1],"disabled":[4],"readonly":[4],"required":[4],"name":[1],"autocomplete":[1],"min":[8],"max":[8],"step":[8],"pattern":[1],"minlength":[2],"maxlength":[2],"size":[1],"invalid":[4],"ariaLabel":[1,"aria-label"],"ariaDescribedby":[1,"aria-describedby"]}]]],["seki-select.cjs",[[257,"seki-select",{"value":[1032],"defaultValue":[8,"default-value"],"multiple":[4],"placeholder":[1],"disabled":[4],"required":[4],"open":[1028],"defaultOpen":[4,"default-open"],"name":[1],"maxVisiblePills":[2,"max-visible-pills"],"ariaLabel":[1,"aria-label"],"ariaLabelledby":[1,"aria-labelledby"],"ariaDescribedby":[1,"aria-describedby"],"placement":[1],"maxHeight":[1,"max-height"],"internalValue":[32],"isOpen":[32],"focusedOptionValue":[32],"registeredOptions":[32],"hasBeenActivated":[32],"searchBuffer":[32],"searchActive":[32],"openDropdown":[64],"closeDropdown":[64],"focusTrigger":[64],"clearSelection":[64],"handleKeyboard":[64]},null,{"value":["handleValuePropChange"],"open":["handleOpenPropChange"],"isOpen":["handleIsOpenChange"],"internalValue":["handleInternalValueChange"]}]]],["seki-select-content.cjs",[[257,"seki-select-content",{"forceUpdate":[32],"scrollToOption":[64]}]]],["seki-select-group.cjs",[[257,"seki-select-group",{"label":[1]}]]],["seki-select-option.cjs",[[257,"seki-select-option",{"value":[8],"label":[1],"disabled":[4]}]]],["seki-select-trigger.cjs",[[257,"seki-select-trigger",{"forceUpdate":[32]}]]],["seki-skeleton.cjs",[[257,"seki-skeleton",{"ariaLabel":[1,"aria-label"]}]]],["seki-switch.cjs",[[257,"seki-switch",{"checked":[4],"defaultChecked":[4,"default-checked"],"disabled":[4],"required":[4],"name":[1],"value":[1],"ariaLabel":[1,"aria-label"],"internalChecked":[32]},[[0,"keydown","handleKeyDown"]]]]],["seki-tooltip.cjs",[[257,"seki-tooltip",{"delay":[2],"side":[1],"disabled":[4],"offset":[2],"isVisible":[32],"currentPosition":[32],"show":[64],"hide":[64],"updatePosition":[64]}]]]], options);
22
22
  });
23
23
 
24
24
  exports.setNonce = index.setNonce;
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "entries": [
3
+ "components/tooltip/seki-tooltip.js",
3
4
  "components/switch/seki-switch.js",
4
5
  "components/button/seki-button.js",
5
6
  "components/field/seki-field.js",
@@ -27,7 +27,7 @@ export class SekiButton {
27
27
  }
28
28
  }
29
29
  render() {
30
- return (h("button", { key: '3cc4cf0af6075fbe012388fa5adb953b64a2b1ca', class: `button button--${this.variant} button--${this.size}`, type: this.type, disabled: this.disabled, "aria-disabled": this.disabled ? 'true' : null, "aria-label": this.ariaLabel }, h("slot", { key: '7c90c49539e6721b6580a07c3f97e20148734b05' })));
30
+ return (h("button", { key: '17841111481259910cd72cdcb861872918c86452', class: `button button--${this.variant} button--${this.size}`, type: this.type, disabled: this.disabled, "aria-disabled": this.disabled ? 'true' : null, "aria-label": this.ariaLabel }, h("slot", { key: '1a4dfb3cb9eb88af7065cd765c0056a93c94ecc1' })));
31
31
  }
32
32
  static get is() { return "seki-button"; }
33
33
  static get encapsulation() { return "shadow"; }
@@ -32,7 +32,7 @@ export class SekiField {
32
32
  }
33
33
  render() {
34
34
  const hasMultiple = this.hasMultipleControls();
35
- return (h(Host, { key: '1583bccc0f87c5c454f73da9d6d8c2729fb4ca0e', "data-orientation": this.orientation, "data-invalid": this.invalid ? '' : undefined, role: hasMultiple ? 'group' : undefined }, h("div", { key: 'd463dec6a4858ab4dee8312418d2d9bc0a629bdb', class: "field" }, h("div", { key: 'a73cceaea5c25151f3ea42a9bfd6b160d886285c', class: "field-label" }, h("slot", { key: 'b2e5596bf6e3d225611646cdeb1bb885244ef486', name: "label" })), h("div", { key: '9cb6521cf8fd82302bfb0cab5db861ed94f0540d', class: "field-control" }, h("slot", { key: '965694631bb131a558e7d7d62bc91f35c4081adb' })), h("div", { key: 'aa247a7d7e6c076f4113cf4c71230addee341bda', class: "field-description" }, h("slot", { key: 'eb7ab7001a1070700aa8d3be8eba2d6ccdcc633b', name: "description" })), h("div", { key: '9dc8970c328b1b24ee7814e73673188c2165252f', class: "field-error" }, h("slot", { key: '243f0b2da99821057a374cb2134c29eb7ed2e3e1', name: "error" })))));
35
+ return (h(Host, { key: '7d408fdb23512ed73f2e3b824323299259a9f54e', "data-orientation": this.orientation, "data-invalid": this.invalid ? '' : undefined, role: hasMultiple ? 'group' : undefined }, h("div", { key: 'ed41345dd9f4a215348ada06e18963b0636ff39b', class: "field" }, h("div", { key: '3c47939088ff6daa0b6764e67e041ebfbaae3fe5', class: "field-label" }, h("slot", { key: 'ab1f28345bdf3daf232b0336f2e2dad8e86a4e0d', name: "label" })), h("div", { key: 'f51416218c47263b93401596de55d4dc97a448a3', class: "field-control" }, h("slot", { key: '890e240b0977bea0749f61799d93921404ff1c60' })), h("div", { key: '10c7383951a8c011d1c1453c52ed90009774d1cc', class: "field-description" }, h("slot", { key: 'b704d490e0299e8c9e5a48b8710024d0940cc63f', name: "description" })), h("div", { key: '3e474168ee78566198a27677ddbc489b953cea3e', class: "field-error" }, h("slot", { key: '8bd880c75f7c5044d3c27651bca268b54a42f3df', name: "error" })))));
36
36
  }
37
37
  static get is() { return "seki-field"; }
38
38
  static get encapsulation() { return "shadow"; }
@@ -29,7 +29,7 @@ export class SekiFieldDescription {
29
29
  return this.componentId;
30
30
  }
31
31
  render() {
32
- return (h("div", { key: '8dd37eb65e7c8c7608b070762681bb8586c53c9e', id: this.componentId, class: "description" }, h("slot", { key: '508d77bad3bf08741dc4c4e6e0f6167d7bf11688' })));
32
+ return (h("div", { key: '944a6268efe02b6b69725daf7503a9bcf8482f94', id: this.componentId, class: "description" }, h("slot", { key: '900d5afcf9662fe2e8f32acf55b21823389dbb59' })));
33
33
  }
34
34
  static get is() { return "seki-field-description"; }
35
35
  static get encapsulation() { return "shadow"; }
@@ -49,7 +49,7 @@ export class SekiFieldError {
49
49
  }
50
50
  render() {
51
51
  const style = this.visible ? {} : { display: 'none' };
52
- return (h("div", { key: 'aa140f9212c3f47d50113f77af0c33cf106177ed', id: this.componentId, class: "error", "aria-live": "polite", style: style }, h("slot", { key: '6fcdf53d218e817fa12792fadb3a946229b2dcf3' })));
52
+ return (h("div", { key: '23898d8cdf6e79e0710776895ac8a36c06262524', id: this.componentId, class: "error", "aria-live": "polite", style: style }, h("slot", { key: '7c40a36d065602eb635180ed0805bca9216c5015' })));
53
53
  }
54
54
  static get is() { return "seki-field-error"; }
55
55
  static get encapsulation() { return "shadow"; }
@@ -11,7 +11,7 @@ export class SekiFieldGroup {
11
11
  const style = {
12
12
  '--seki-field-group-gap': this.gap,
13
13
  };
14
- return (h("div", { key: '479c3e657ce82b3ab5243b10ef5cccd26e17478b', class: "field-group", style: style }, h("slot", { key: '15d665a73e3d2d2eca773bdb216b4276feaf2071' })));
14
+ return (h("div", { key: '32e2881723467de4e83135f38f339bd1334ea19f', class: "field-group", style: style }, h("slot", { key: '3909c9108222772376d916718003600d9d84f10f' })));
15
15
  }
16
16
  static get is() { return "seki-field-group"; }
17
17
  static get encapsulation() { return "shadow"; }
@@ -9,7 +9,7 @@ export class SekiFieldLabel {
9
9
  }
10
10
  render() {
11
11
  const labelProps = this.htmlFor ? { for: this.htmlFor } : {};
12
- return (h("label", Object.assign({ key: 'f9f2b492f80fe46110f4f8766c88a1aec53342be' }, labelProps), h("slot", { key: '35564e4ea62df56807c7d2a90a4f9e66a7c09c4c' }), this.required && h("span", { key: '8f6f7a454790995b9d968fb1e0078fb9951fcba6', class: "required-indicator" }, " *")));
12
+ return (h("label", Object.assign({ key: 'c57011f8722920f073fc05ae3b260e581689c43e' }, labelProps), h("slot", { key: '6e807e411376526b20cf66d694766ce11065b734' }), this.required && h("span", { key: '53d676c377fa93c6d41c50856b4db598cf3c2c15', class: "required-indicator" }, " *")));
13
13
  }
14
14
  static get is() { return "seki-field-label"; }
15
15
  static get encapsulation() { return "shadow"; }
@@ -1,7 +1,7 @@
1
1
  import { h } from "@stencil/core";
2
2
  export class SekiFieldLegend {
3
3
  render() {
4
- return (h("legend", { key: '34aa222c29443bbded4ba43c8592212e5328fb52' }, h("slot", { key: '59fddfd2160e0c3a512dc92f38465ed015b860ca' })));
4
+ return (h("legend", { key: 'adcc0cb95335522fc66dc791a3cc063d2493c36b' }, h("slot", { key: '90a382f1eac9b23133f8daf927a2163491f09c38' })));
5
5
  }
6
6
  static get is() { return "seki-field-legend"; }
7
7
  static get encapsulation() { return "shadow"; }
@@ -8,7 +8,7 @@ export class SekiFieldset {
8
8
  this.disabled = false;
9
9
  }
10
10
  render() {
11
- return (h("fieldset", { key: '8d7a47b3f837d34c11b905f64a35fe167fd9b16f', disabled: this.disabled, class: "fieldset" }, h("slot", { key: 'b620fe4fe86449d3cfb9e47db6837dbc5a8ad771', name: "legend" }), h("div", { key: 'd122e6eb636e8742cb8ac429c5879cb54bfce392', class: "fieldset-content" }, h("slot", { key: 'ea7f4dbea6e07c9b9cf68d7f3be5ea40500ed11f' }))));
11
+ return (h("fieldset", { key: '71604f49a136c1bb6c907c8dc3ac669898e663cd', disabled: this.disabled, class: "fieldset" }, h("slot", { key: '8f27126458260cc264b230877b8363290bbbdad3', name: "legend" }), h("div", { key: '04cc5aa90217a824db0150f2ac9a23c0308f5c71', class: "fieldset-content" }, h("slot", { key: 'e6e47348a642909c61fe042ab15e9cb8eb29adee' }))));
12
12
  }
13
13
  static get is() { return "seki-fieldset"; }
14
14
  static get encapsulation() { return "shadow"; }