@lukso/web-components 1.67.0 → 1.68.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (71) hide show
  1. package/dist/{cn-4ec0bd94.cjs → cn-5a985a94.cjs} +48 -19
  2. package/dist/{cn-616567d4.js → cn-e708e7fa.js} +45 -16
  3. package/dist/components/index.cjs +5 -5
  4. package/dist/components/index.js +5 -5
  5. package/dist/components/lukso-button/index.cjs +5 -5
  6. package/dist/components/lukso-button/index.js +5 -5
  7. package/dist/components/lukso-card/index.cjs +6 -6
  8. package/dist/components/lukso-card/index.js +6 -6
  9. package/dist/components/lukso-checkbox/index.cjs +1 -1
  10. package/dist/components/lukso-checkbox/index.js +1 -1
  11. package/dist/components/lukso-footer/index.cjs +1 -1
  12. package/dist/components/lukso-footer/index.js +1 -1
  13. package/dist/components/lukso-icon/index.cjs +2 -2
  14. package/dist/components/lukso-icon/index.js +2 -2
  15. package/dist/components/lukso-input/index.cjs +1 -1
  16. package/dist/components/lukso-input/index.js +1 -1
  17. package/dist/components/lukso-modal/index.cjs +1 -1
  18. package/dist/components/lukso-modal/index.js +1 -1
  19. package/dist/components/lukso-navbar/index.cjs +5 -5
  20. package/dist/components/lukso-navbar/index.js +5 -5
  21. package/dist/components/lukso-profile/index.cjs +2 -2
  22. package/dist/components/lukso-profile/index.js +2 -2
  23. package/dist/components/lukso-progress/index.cjs +3 -3
  24. package/dist/components/lukso-progress/index.js +3 -3
  25. package/dist/components/lukso-sanitize/index.cjs +1 -1
  26. package/dist/components/lukso-sanitize/index.js +1 -1
  27. package/dist/components/lukso-search/index.cjs +3 -3
  28. package/dist/components/lukso-search/index.js +3 -3
  29. package/dist/components/lukso-select/index.cjs +8 -8
  30. package/dist/components/lukso-select/index.js +8 -8
  31. package/dist/components/lukso-share/index.cjs +1 -1
  32. package/dist/components/lukso-share/index.js +1 -1
  33. package/dist/components/lukso-switch/index.cjs +2 -2
  34. package/dist/components/lukso-switch/index.js +2 -2
  35. package/dist/components/lukso-tag/index.cjs +4 -4
  36. package/dist/components/lukso-tag/index.js +4 -4
  37. package/dist/components/lukso-terms/index.cjs +2 -2
  38. package/dist/components/lukso-terms/index.js +2 -2
  39. package/dist/components/lukso-test/index.cjs +1 -1
  40. package/dist/components/lukso-test/index.js +1 -1
  41. package/dist/components/lukso-tooltip/index.cjs +26 -18
  42. package/dist/components/lukso-tooltip/index.d.ts +1 -0
  43. package/dist/components/lukso-tooltip/index.d.ts.map +1 -1
  44. package/dist/components/lukso-tooltip/index.js +26 -18
  45. package/dist/components/lukso-tooltip/lukso-tooltip.stories.d.ts +1 -1
  46. package/dist/components/lukso-tooltip/lukso-tooltip.stories.d.ts.map +1 -1
  47. package/dist/components/lukso-username/index.cjs +2 -2
  48. package/dist/components/lukso-username/index.js +2 -2
  49. package/dist/components/lukso-wizard/index.cjs +64 -41
  50. package/dist/components/lukso-wizard/index.d.ts +3 -3
  51. package/dist/components/lukso-wizard/index.d.ts.map +1 -1
  52. package/dist/components/lukso-wizard/index.js +63 -40
  53. package/dist/components/lukso-wizard/lukso-wizard.stories.d.ts +0 -2
  54. package/dist/components/lukso-wizard/lukso-wizard.stories.d.ts.map +1 -1
  55. package/dist/{index-21e30dce.cjs → index-0e131d65.cjs} +1 -1
  56. package/dist/index-5cc4a839.cjs +46 -0
  57. package/dist/{index-e8741080.cjs → index-66211c85.cjs} +3 -3
  58. package/dist/index-814bcac2.js +39 -0
  59. package/dist/{index-ccc127cd.js → index-f171e7da.js} +1 -1
  60. package/dist/{index-c55a1069.js → index-faa8c4ae.js} +3 -3
  61. package/dist/index.cjs +5 -5
  62. package/dist/index.js +5 -5
  63. package/dist/shared/tailwind-element/index.cjs +1 -1
  64. package/dist/shared/tailwind-element/index.js +1 -1
  65. package/dist/{style-map-de03e3eb.js → style-map-21f59b89.js} +1 -1
  66. package/dist/{style-map-c75e9a96.cjs → style-map-7d4ddea1.cjs} +1 -1
  67. package/package.json +1 -1
  68. package/tools/cn.cjs +45 -16
  69. package/tools/cn.js +45 -16
  70. package/dist/index-9158df3a.cjs +0 -46
  71. package/dist/index-987980d1.js +0 -39
@@ -2,15 +2,15 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
 
5
- const shared_tailwindElement_index = require('../../index-9158df3a.cjs');
5
+ const shared_tailwindElement_index = require('../../index-5cc4a839.cjs');
6
6
  const queryAssignedElements = require('../../query-assigned-elements-1d5d9d4c.cjs');
7
7
  const state = require('../../state-f73a8b4f.cjs');
8
- const index = require('../../index-e8741080.cjs');
8
+ const index = require('../../index-66211c85.cjs');
9
9
  require('../lukso-icon/index.cjs');
10
10
  require('../lukso-tag/index.cjs');
11
- require('../../style-map-c75e9a96.cjs');
11
+ require('../../style-map-7d4ddea1.cjs');
12
12
  require('../../directive-8278ab14.cjs');
13
- require('../../index-21e30dce.cjs');
13
+ require('../../index-0e131d65.cjs');
14
14
 
15
15
  var __defProp = Object.defineProperty;
16
16
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -37,7 +37,7 @@ exports.LuksoNavbar = class LuksoNavbar extends shared_tailwindElement_index.Tai
37
37
  this.mobileBreakpoint = "md";
38
38
  this.isMenuOpen = false;
39
39
  this.defaultLogoUrl = "/assets/images/up-logo.png";
40
- this.navbarStyles = index.se({
40
+ this.navbarStyles = index.ie({
41
41
  slots: {
42
42
  wrapper: `bg-neutral-100 shadow-pink-drop-shadow h-78 grid items-center`,
43
43
  mobileMenuWrapper: `items-center justify-end pr-6 flex gap-2`,
@@ -1,12 +1,12 @@
1
- import { a as TailwindElement, x, A } from '../../index-987980d1.js';
1
+ import { a as TailwindElement, x, A } from '../../index-814bcac2.js';
2
2
  import { n, e } from '../../query-assigned-elements-5d94572f.js';
3
3
  import { t } from '../../state-0a779257.js';
4
- import { s as se } from '../../index-c55a1069.js';
4
+ import { i as ie } from '../../index-faa8c4ae.js';
5
5
  import '../lukso-icon/index.js';
6
6
  import '../lukso-tag/index.js';
7
- import '../../style-map-de03e3eb.js';
7
+ import '../../style-map-21f59b89.js';
8
8
  import '../../directive-2bb7789e.js';
9
- import '../../index-ccc127cd.js';
9
+ import '../../index-f171e7da.js';
10
10
 
11
11
  var __defProp = Object.defineProperty;
12
12
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -33,7 +33,7 @@ let LuksoNavbar = class extends TailwindElement {
33
33
  this.mobileBreakpoint = "md";
34
34
  this.isMenuOpen = false;
35
35
  this.defaultLogoUrl = "/assets/images/up-logo.png";
36
- this.navbarStyles = se({
36
+ this.navbarStyles = ie({
37
37
  slots: {
38
38
  wrapper: `bg-neutral-100 shadow-pink-drop-shadow h-78 grid items-center`,
39
39
  mobileMenuWrapper: `items-center justify-end pr-6 flex gap-2`,
@@ -2,9 +2,9 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
 
5
- const shared_tailwindElement_index = require('../../index-9158df3a.cjs');
5
+ const shared_tailwindElement_index = require('../../index-5cc4a839.cjs');
6
6
  const queryAssignedElements = require('../../query-assigned-elements-1d5d9d4c.cjs');
7
- const styleMap = require('../../style-map-c75e9a96.cjs');
7
+ const styleMap = require('../../style-map-7d4ddea1.cjs');
8
8
  const index = require('../../index-e9668573.cjs');
9
9
  require('../../directive-8278ab14.cjs');
10
10
 
@@ -1,6 +1,6 @@
1
- import { a as TailwindElement, x } from '../../index-987980d1.js';
1
+ import { a as TailwindElement, x } from '../../index-814bcac2.js';
2
2
  import { n, e } from '../../query-assigned-elements-5d94572f.js';
3
- import { o } from '../../style-map-de03e3eb.js';
3
+ import { o } from '../../style-map-21f59b89.js';
4
4
  import { c as customClassMap } from '../../index-5e194caf.js';
5
5
  import '../../directive-2bb7789e.js';
6
6
 
@@ -2,11 +2,11 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
 
5
- const shared_tailwindElement_index = require('../../index-9158df3a.cjs');
5
+ const shared_tailwindElement_index = require('../../index-5cc4a839.cjs');
6
6
  const queryAssignedElements = require('../../query-assigned-elements-1d5d9d4c.cjs');
7
- const styleMap = require('../../style-map-c75e9a96.cjs');
7
+ const styleMap = require('../../style-map-7d4ddea1.cjs');
8
8
  require('../../tailwind-config.cjs');
9
- const cn = require('../../cn-4ec0bd94.cjs');
9
+ const cn = require('../../cn-5a985a94.cjs');
10
10
  require('../../directive-8278ab14.cjs');
11
11
 
12
12
  var __defProp = Object.defineProperty;
@@ -1,8 +1,8 @@
1
- import { a as TailwindElement, x } from '../../index-987980d1.js';
1
+ import { a as TailwindElement, x } from '../../index-814bcac2.js';
2
2
  import { n, e } from '../../query-assigned-elements-5d94572f.js';
3
- import { o } from '../../style-map-de03e3eb.js';
3
+ import { o } from '../../style-map-21f59b89.js';
4
4
  import '../../tailwind-config.js';
5
- import { c as cn } from '../../cn-616567d4.js';
5
+ import { c as cn } from '../../cn-e708e7fa.js';
6
6
  import '../../directive-2bb7789e.js';
7
7
 
8
8
  var __defProp = Object.defineProperty;
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
 
5
- const shared_tailwindElement_index = require('../../index-9158df3a.cjs');
5
+ const shared_tailwindElement_index = require('../../index-5cc4a839.cjs');
6
6
  const queryAssignedElements = require('../../query-assigned-elements-1d5d9d4c.cjs');
7
7
  const directive = require('../../directive-8278ab14.cjs');
8
8
 
@@ -1,4 +1,4 @@
1
- import { A, b as T, a as TailwindElement, x } from '../../index-987980d1.js';
1
+ import { A, b as T, a as TailwindElement, x } from '../../index-814bcac2.js';
2
2
  import { n, e as e$2 } from '../../query-assigned-elements-5d94572f.js';
3
3
  import { i, t, e as e$1 } from '../../directive-2bb7789e.js';
4
4
 
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
 
5
- const shared_tailwindElement_index = require('../../index-9158df3a.cjs');
5
+ const shared_tailwindElement_index = require('../../index-5cc4a839.cjs');
6
6
  const queryAssignedElements = require('../../query-assigned-elements-1d5d9d4c.cjs');
7
7
  const state = require('../../state-f73a8b4f.cjs');
8
8
  const index = require('../../index-e9668573.cjs');
@@ -10,8 +10,8 @@ require('../lukso-icon/index.cjs');
10
10
  require('../lukso-profile/index.cjs');
11
11
  require('../lukso-username/index.cjs');
12
12
  require('../../directive-8278ab14.cjs');
13
- require('../../style-map-c75e9a96.cjs');
14
- require('../../index-21e30dce.cjs');
13
+ require('../../style-map-7d4ddea1.cjs');
14
+ require('../../index-0e131d65.cjs');
15
15
 
16
16
  const style = ":host {\n\n display: inline-flex\n}\n\n:host([is-full-width]) {\n\n display: flex;\n\n width: 100%\n}";
17
17
 
@@ -1,4 +1,4 @@
1
- import { T as TailwindStyledElement, x, A } from '../../index-987980d1.js';
1
+ import { T as TailwindStyledElement, x, A } from '../../index-814bcac2.js';
2
2
  import { n, e } from '../../query-assigned-elements-5d94572f.js';
3
3
  import { t } from '../../state-0a779257.js';
4
4
  import { c as customClassMap } from '../../index-5e194caf.js';
@@ -6,8 +6,8 @@ import '../lukso-icon/index.js';
6
6
  import '../lukso-profile/index.js';
7
7
  import '../lukso-username/index.js';
8
8
  import '../../directive-2bb7789e.js';
9
- import '../../style-map-de03e3eb.js';
10
- import '../../index-ccc127cd.js';
9
+ import '../../style-map-21f59b89.js';
10
+ import '../../index-f171e7da.js';
11
11
 
12
12
  const style = ":host {\n\n display: inline-flex\n}\n\n:host([is-full-width]) {\n\n display: flex;\n\n width: 100%\n}";
13
13
 
@@ -2,17 +2,17 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
 
5
- const shared_tailwindElement_index = require('../../index-9158df3a.cjs');
5
+ const shared_tailwindElement_index = require('../../index-5cc4a839.cjs');
6
6
  const queryAssignedElements = require('../../query-assigned-elements-1d5d9d4c.cjs');
7
7
  const state = require('../../state-f73a8b4f.cjs');
8
- const index = require('../../index-e8741080.cjs');
8
+ const index = require('../../index-66211c85.cjs');
9
9
  require('../lukso-icon/index.cjs');
10
10
  require('../lukso-profile/index.cjs');
11
11
  require('../lukso-username/index.cjs');
12
- require('../../style-map-c75e9a96.cjs');
12
+ require('../../style-map-7d4ddea1.cjs');
13
13
  require('../../directive-8278ab14.cjs');
14
14
  require('../../index-e9668573.cjs');
15
- require('../../index-21e30dce.cjs');
15
+ require('../../index-0e131d65.cjs');
16
16
 
17
17
  const style = ":host {\n\n display: inline-flex\n}\n\n:host([is-full-width]) {\n\n display: flex;\n\n width: 100%\n}";
18
18
 
@@ -47,7 +47,7 @@ exports.LuksoSelect = class LuksoSelect extends shared_tailwindElement_index.Tai
47
47
  this.isLargeIcon = false;
48
48
  this.optionsParsed = [];
49
49
  this.valueParsed = void 0;
50
- this.inputStyles = index.se({
50
+ this.inputStyles = index.ie({
51
51
  base: `bg-neutral-100 paragraph-inter-14-regular px-4 py-3 pr-11
52
52
  border border-solid h-[48px] placeholder:text-neutral-70 select-none whitespace-nowrap
53
53
  outline-none transition transition-all duration-150 appearance-none rounded-12
@@ -68,7 +68,7 @@ exports.LuksoSelect = class LuksoSelect extends shared_tailwindElement_index.Tai
68
68
  }
69
69
  }
70
70
  });
71
- this.dropdownWrapperStyles = index.se({
71
+ this.dropdownWrapperStyles = index.ie({
72
72
  base: `bg-neutral-100 border w-full border-neutral-90 shadow-1xl rounded-12 p-3 z-50
73
73
  flex absolute flex-col gap-1 overflow-y-auto max-h-64 mt-2`,
74
74
  variants: {
@@ -77,7 +77,7 @@ exports.LuksoSelect = class LuksoSelect extends shared_tailwindElement_index.Tai
77
77
  }
78
78
  }
79
79
  });
80
- this.optionsStyles = index.se({
80
+ this.optionsStyles = index.ie({
81
81
  base: `paragraph-inter-14-regular text-neutral-20 cursor-pointer rounded-8 p-2
82
82
  whitespace-nowrap hover:bg-neutral-98 flex items-center`,
83
83
  variants: {
@@ -89,7 +89,7 @@ exports.LuksoSelect = class LuksoSelect extends shared_tailwindElement_index.Tai
89
89
  }
90
90
  }
91
91
  });
92
- this.iconStyles = index.se({
92
+ this.iconStyles = index.ie({
93
93
  base: `absolute right-0 mr-3 transition cursor-pointer`,
94
94
  variants: {
95
95
  isDisabled: {
@@ -1,14 +1,14 @@
1
- import { T as TailwindStyledElement, x, A } from '../../index-987980d1.js';
1
+ import { T as TailwindStyledElement, x, A } from '../../index-814bcac2.js';
2
2
  import { n, e } from '../../query-assigned-elements-5d94572f.js';
3
3
  import { t } from '../../state-0a779257.js';
4
- import { s as se } from '../../index-c55a1069.js';
4
+ import { i as ie } from '../../index-faa8c4ae.js';
5
5
  import '../lukso-icon/index.js';
6
6
  import '../lukso-profile/index.js';
7
7
  import '../lukso-username/index.js';
8
- import '../../style-map-de03e3eb.js';
8
+ import '../../style-map-21f59b89.js';
9
9
  import '../../directive-2bb7789e.js';
10
10
  import '../../index-5e194caf.js';
11
- import '../../index-ccc127cd.js';
11
+ import '../../index-f171e7da.js';
12
12
 
13
13
  const style = ":host {\n\n display: inline-flex\n}\n\n:host([is-full-width]) {\n\n display: flex;\n\n width: 100%\n}";
14
14
 
@@ -43,7 +43,7 @@ let LuksoSelect = class extends TailwindStyledElement(style) {
43
43
  this.isLargeIcon = false;
44
44
  this.optionsParsed = [];
45
45
  this.valueParsed = void 0;
46
- this.inputStyles = se({
46
+ this.inputStyles = ie({
47
47
  base: `bg-neutral-100 paragraph-inter-14-regular px-4 py-3 pr-11
48
48
  border border-solid h-[48px] placeholder:text-neutral-70 select-none whitespace-nowrap
49
49
  outline-none transition transition-all duration-150 appearance-none rounded-12
@@ -64,7 +64,7 @@ let LuksoSelect = class extends TailwindStyledElement(style) {
64
64
  }
65
65
  }
66
66
  });
67
- this.dropdownWrapperStyles = se({
67
+ this.dropdownWrapperStyles = ie({
68
68
  base: `bg-neutral-100 border w-full border-neutral-90 shadow-1xl rounded-12 p-3 z-50
69
69
  flex absolute flex-col gap-1 overflow-y-auto max-h-64 mt-2`,
70
70
  variants: {
@@ -73,7 +73,7 @@ let LuksoSelect = class extends TailwindStyledElement(style) {
73
73
  }
74
74
  }
75
75
  });
76
- this.optionsStyles = se({
76
+ this.optionsStyles = ie({
77
77
  base: `paragraph-inter-14-regular text-neutral-20 cursor-pointer rounded-8 p-2
78
78
  whitespace-nowrap hover:bg-neutral-98 flex items-center`,
79
79
  variants: {
@@ -85,7 +85,7 @@ let LuksoSelect = class extends TailwindStyledElement(style) {
85
85
  }
86
86
  }
87
87
  });
88
- this.iconStyles = se({
88
+ this.iconStyles = ie({
89
89
  base: `absolute right-0 mr-3 transition cursor-pointer`,
90
90
  variants: {
91
91
  isDisabled: {
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
 
5
- const shared_tailwindElement_index = require('../../index-9158df3a.cjs');
5
+ const shared_tailwindElement_index = require('../../index-5cc4a839.cjs');
6
6
  const queryAssignedElements = require('../../query-assigned-elements-1d5d9d4c.cjs');
7
7
 
8
8
  const style = ":host {\n display: inline-flex\n}";
@@ -1,4 +1,4 @@
1
- import { T as TailwindStyledElement, x } from '../../index-987980d1.js';
1
+ import { T as TailwindStyledElement, x } from '../../index-814bcac2.js';
2
2
  import { n, e } from '../../query-assigned-elements-5d94572f.js';
3
3
 
4
4
  const style = ":host {\n display: inline-flex\n}";
@@ -2,9 +2,9 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
 
5
- const shared_tailwindElement_index = require('../../index-9158df3a.cjs');
5
+ const shared_tailwindElement_index = require('../../index-5cc4a839.cjs');
6
6
  const queryAssignedElements = require('../../query-assigned-elements-1d5d9d4c.cjs');
7
- const styleMap = require('../../style-map-c75e9a96.cjs');
7
+ const styleMap = require('../../style-map-7d4ddea1.cjs');
8
8
  const index = require('../../index-e9668573.cjs');
9
9
  require('../../directive-8278ab14.cjs');
10
10
 
@@ -1,6 +1,6 @@
1
- import { a as TailwindElement, x } from '../../index-987980d1.js';
1
+ import { a as TailwindElement, x } from '../../index-814bcac2.js';
2
2
  import { n, e } from '../../query-assigned-elements-5d94572f.js';
3
- import { o } from '../../style-map-de03e3eb.js';
3
+ import { o } from '../../style-map-21f59b89.js';
4
4
  import { c as customClassMap } from '../../index-5e194caf.js';
5
5
  import '../../directive-2bb7789e.js';
6
6
 
@@ -2,10 +2,10 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
 
5
- const shared_tailwindElement_index = require('../../index-9158df3a.cjs');
5
+ const shared_tailwindElement_index = require('../../index-5cc4a839.cjs');
6
6
  const queryAssignedElements = require('../../query-assigned-elements-1d5d9d4c.cjs');
7
- const index = require('../../index-e8741080.cjs');
8
- const index$1 = require('../../index-21e30dce.cjs');
7
+ const index = require('../../index-66211c85.cjs');
8
+ const index$1 = require('../../index-0e131d65.cjs');
9
9
  require('../../directive-8278ab14.cjs');
10
10
 
11
11
  const style = ":host {\n display: inline-flex\n}";
@@ -29,7 +29,7 @@ exports.LuksoTag = class LuksoTag extends shared_tailwindElement_index.TailwindS
29
29
  this.backgroundColor = "";
30
30
  this.borderColor = "";
31
31
  this.textColor = "";
32
- this.tagStyles = index.se({
32
+ this.tagStyles = index.ie({
33
33
  base: "inline-flex items-center justify-center border border-neutral-20 text-neutral-20 px-2",
34
34
  variants: {
35
35
  size: {
@@ -1,7 +1,7 @@
1
- import { T as TailwindStyledElement, x } from '../../index-987980d1.js';
1
+ import { T as TailwindStyledElement, x } from '../../index-814bcac2.js';
2
2
  import { n, e } from '../../query-assigned-elements-5d94572f.js';
3
- import { s as se } from '../../index-c55a1069.js';
4
- import { c as customStyleMap } from '../../index-ccc127cd.js';
3
+ import { i as ie } from '../../index-faa8c4ae.js';
4
+ import { c as customStyleMap } from '../../index-f171e7da.js';
5
5
  import '../../directive-2bb7789e.js';
6
6
 
7
7
  const style = ":host {\n display: inline-flex\n}";
@@ -25,7 +25,7 @@ let LuksoTag = class extends TailwindStyledElement(style) {
25
25
  this.backgroundColor = "";
26
26
  this.borderColor = "";
27
27
  this.textColor = "";
28
- this.tagStyles = se({
28
+ this.tagStyles = ie({
29
29
  base: "inline-flex items-center justify-center border border-neutral-20 text-neutral-20 px-2",
30
30
  variants: {
31
31
  size: {
@@ -2,14 +2,14 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
 
5
- const shared_tailwindElement_index = require('../../index-9158df3a.cjs');
5
+ const shared_tailwindElement_index = require('../../index-5cc4a839.cjs');
6
6
  const queryAssignedElements = require('../../query-assigned-elements-1d5d9d4c.cjs');
7
7
  const state = require('../../state-f73a8b4f.cjs');
8
8
  const index = require('../../index-e9668573.cjs');
9
9
  require('../lukso-icon/index.cjs');
10
10
  require('../lukso-sanitize/index.cjs');
11
11
  require('../../directive-8278ab14.cjs');
12
- require('../../style-map-c75e9a96.cjs');
12
+ require('../../style-map-7d4ddea1.cjs');
13
13
 
14
14
  const style = ":host {\n display: flex;\n height: 100%\n}";
15
15
 
@@ -1,11 +1,11 @@
1
- import { T as TailwindStyledElement, x } from '../../index-987980d1.js';
1
+ import { T as TailwindStyledElement, x } from '../../index-814bcac2.js';
2
2
  import { n, e } from '../../query-assigned-elements-5d94572f.js';
3
3
  import { t } from '../../state-0a779257.js';
4
4
  import { c as customClassMap } from '../../index-5e194caf.js';
5
5
  import '../lukso-icon/index.js';
6
6
  import '../lukso-sanitize/index.js';
7
7
  import '../../directive-2bb7789e.js';
8
- import '../../style-map-de03e3eb.js';
8
+ import '../../style-map-21f59b89.js';
9
9
 
10
10
  const style = ":host {\n display: flex;\n height: 100%\n}";
11
11
 
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
 
5
- const shared_tailwindElement_index = require('../../index-9158df3a.cjs');
5
+ const shared_tailwindElement_index = require('../../index-5cc4a839.cjs');
6
6
  const queryAssignedElements = require('../../query-assigned-elements-1d5d9d4c.cjs');
7
7
  const directive = require('../../directive-8278ab14.cjs');
8
8
 
@@ -1,4 +1,4 @@
1
- import { b as T$1, T as TailwindStyledElement, x as x$1 } from '../../index-987980d1.js';
1
+ import { b as T$1, T as TailwindStyledElement, x as x$1 } from '../../index-814bcac2.js';
2
2
  import { n as n$3, e as e$3 } from '../../query-assigned-elements-5d94572f.js';
3
3
  import { e as e$2, i as i$3, t as t$3 } from '../../directive-2bb7789e.js';
4
4
 
@@ -2,9 +2,12 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
 
5
- const shared_tailwindElement_index = require('../../index-9158df3a.cjs');
5
+ const shared_tailwindElement_index = require('../../index-5cc4a839.cjs');
6
6
  const queryAssignedElements = require('../../query-assigned-elements-1d5d9d4c.cjs');
7
7
  const state = require('../../state-f73a8b4f.cjs');
8
+ const index = require('../../index-66211c85.cjs');
9
+ const styleMap = require('../../style-map-7d4ddea1.cjs');
10
+ require('../../directive-8278ab14.cjs');
8
11
 
9
12
  var top = 'top';
10
13
  var bottom = 'bottom';
@@ -3475,6 +3478,13 @@ exports.LuksoTooltip = class LuksoTooltip extends shared_tailwindElement_index.T
3475
3478
  this.showCopy = false;
3476
3479
  this.optionsParsed = [];
3477
3480
  this.tooltipInstance = void 0;
3481
+ this.tooltipStyles = index.ie({
3482
+ slots: {
3483
+ tooltip: "hidden",
3484
+ trigger: "cursor-pointer flex flex-col items-center",
3485
+ options: "rounded-4 hover:bg-neutral-95"
3486
+ }
3487
+ });
3478
3488
  }
3479
3489
  hideOnClickCheck() {
3480
3490
  if (this.hideOnClick === "toggle") {
@@ -3543,20 +3553,26 @@ exports.LuksoTooltip = class LuksoTooltip extends shared_tailwindElement_index.T
3543
3553
  this.initTooltip();
3544
3554
  }
3545
3555
  optionsTemplate() {
3546
- return shared_tailwindElement_index.x`
3547
- ${Object.entries(this.optionsParsed).map(
3548
- (option) => shared_tailwindElement_index.x`<div
3549
- class="mb-1 rounded-4 px-2 py-1 hover:cursor-pointer hover:bg-neutral-95"
3556
+ const { options } = this.tooltipStyles();
3557
+ return shared_tailwindElement_index.x`<ul>
3558
+ ${Object.entries(this.optionsParsed)?.map(
3559
+ (option) => shared_tailwindElement_index.x`<li
3560
+ class=${options()}
3561
+ style=${styleMap.o({
3562
+ padding: "4px 8px",
3563
+ cursor: "pointer"
3564
+ })}
3550
3565
  onClick="navigator.clipboard.writeText('${option[1].value}')"
3551
3566
  >
3552
3567
  ${option[1].text}
3553
- </div>`
3568
+ </li>`
3554
3569
  )}
3555
- `;
3570
+ </ul>`;
3556
3571
  }
3557
3572
  render() {
3573
+ const { tooltip, trigger } = this.tooltipStyles();
3558
3574
  return shared_tailwindElement_index.x`
3559
- <div id="tooltip" role="tooltip" class="bg-neutral-20 p-4 hidden">
3575
+ <div id="tooltip" role="tooltip" class=${tooltip()}>
3560
3576
  ${this.options ? this.optionsTemplate() : this.text}
3561
3577
  </div>
3562
3578
  ${this.isClipboardCopy ? shared_tailwindElement_index.x`<lukso-tooltip
@@ -3569,18 +3585,10 @@ exports.LuksoTooltip = class LuksoTooltip extends shared_tailwindElement_index.T
3569
3585
  ?show=${this.showCopy ? true : void 0}
3570
3586
  text=${this.copyText}
3571
3587
  >
3572
- <div
3573
- id="trigger"
3574
- class="cursor-pointer flex flex-col items-center"
3575
- @click=${this.handleClick}
3576
- >
3588
+ <div id="trigger" class=${trigger()} @click=${this.handleClick}>
3577
3589
  <slot></slot>
3578
3590
  </div>
3579
- </lukso-tooltip>` : shared_tailwindElement_index.x`<div
3580
- id="trigger"
3581
- class="cursor-pointer flex flex-col items-center"
3582
- @click=${this.handleClick}
3583
- >
3591
+ </lukso-tooltip>` : shared_tailwindElement_index.x`<div id="trigger" class=${trigger()} @click=${this.handleClick}>
3584
3592
  <slot></slot>
3585
3593
  </div>`}
3586
3594
  `;
@@ -26,6 +26,7 @@ export declare class LuksoTooltip extends LuksoTooltip_base {
26
26
  showCopy: boolean;
27
27
  optionsParsed: TooltipOption[];
28
28
  private tooltipInstance;
29
+ private tooltipStyles;
29
30
  private hideOnClickCheck;
30
31
  private initTooltip;
31
32
  private handleClick;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-tooltip/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAQ,MAAM,KAAK,CAAA;AAO/C,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,QAAQ,GAAG,OAAO,CAAA;AAC9E,MAAM,MAAM,WAAW,GAAG,QAAQ,GAAG,OAAO,CAAA;AAC5C,MAAM,MAAM,gBAAgB,GACxB,KAAK,GACL,WAAW,GACX,SAAS,GACT,OAAO,GACP,aAAa,GACb,WAAW,GACX,QAAQ,GACR,cAAc,GACd,YAAY,GACZ,MAAM,GACN,YAAY,GACZ,UAAU,GACV,MAAM,GACN,YAAY,GACZ,UAAU,CAAA;AACd,MAAM,MAAM,cAAc,GAAG,YAAY,GAAG,OAAO,GAAG,QAAQ,CAAA;AAE9D,MAAM,MAAM,aAAa,GAAG;IAC1B,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;CACb,CAAA;;AAED,qBACa,YAAa,SAAQ,iBAA4B;IAE5D,OAAO,EAAE,cAAc,CAAU;IAGjC,IAAI,EAAE,WAAW,CAAW;IAG5B,SAAS,EAAE,gBAAgB,CAAQ;IAGnC,OAAO,EAAE,cAAc,CAAe;IAGtC,IAAI,SAAK;IAGT,QAAQ,SAAM;IAGd,IAAI,UAAQ;IAGZ,WAAW,SAAS;IAGpB,eAAe,UAAQ;IAGvB,QAAQ,SAAK;IAGb,SAAS,SAAK;IAGd,MAAM,SAAK;IAGX,OAAO,SAAK;IAGZ,QAAQ,UAAQ;IAGhB,aAAa,EAAE,aAAa,EAAE,CAAK;IAEnC,OAAO,CAAC,eAAe,CAAY;IAEnC,OAAO,CAAC,gBAAgB;IAcxB,OAAO,CAAC,WAAW;IA8BnB,OAAO,CAAC,WAAW;IAab,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC;IAyBxD,OAAO,CAAC,eAAe;IAcvB,MAAM;CAiCP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,YAAY,CAAA;KAC9B;CACF"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-tooltip/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAQ,MAAM,KAAK,CAAA;AAS/C,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,QAAQ,GAAG,OAAO,CAAA;AAC9E,MAAM,MAAM,WAAW,GAAG,QAAQ,GAAG,OAAO,CAAA;AAC5C,MAAM,MAAM,gBAAgB,GACxB,KAAK,GACL,WAAW,GACX,SAAS,GACT,OAAO,GACP,aAAa,GACb,WAAW,GACX,QAAQ,GACR,cAAc,GACd,YAAY,GACZ,MAAM,GACN,YAAY,GACZ,UAAU,GACV,MAAM,GACN,YAAY,GACZ,UAAU,CAAA;AACd,MAAM,MAAM,cAAc,GAAG,YAAY,GAAG,OAAO,GAAG,QAAQ,CAAA;AAE9D,MAAM,MAAM,aAAa,GAAG;IAC1B,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;CACb,CAAA;;AAED,qBACa,YAAa,SAAQ,iBAA4B;IAE5D,OAAO,EAAE,cAAc,CAAU;IAGjC,IAAI,EAAE,WAAW,CAAW;IAG5B,SAAS,EAAE,gBAAgB,CAAQ;IAGnC,OAAO,EAAE,cAAc,CAAe;IAGtC,IAAI,SAAK;IAGT,QAAQ,SAAM;IAGd,IAAI,UAAQ;IAGZ,WAAW,SAAS;IAGpB,eAAe,UAAQ;IAGvB,QAAQ,SAAK;IAGb,SAAS,SAAK;IAGd,MAAM,SAAK;IAGX,OAAO,SAAK;IAGZ,QAAQ,UAAQ;IAGhB,aAAa,EAAE,aAAa,EAAE,CAAK;IAEnC,OAAO,CAAC,eAAe,CAAY;IAEnC,OAAO,CAAC,aAAa,CAMnB;IAEF,OAAO,CAAC,gBAAgB;IAcxB,OAAO,CAAC,WAAW;IA8BnB,OAAO,CAAC,WAAW;IAab,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC;IAyBxD,OAAO,CAAC,eAAe;IAqBvB,MAAM;CA2BP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,YAAY,CAAA;KAC9B;CACF"}
@@ -1,6 +1,9 @@
1
- import { T as TailwindStyledElement, x } from '../../index-987980d1.js';
1
+ import { T as TailwindStyledElement, x } from '../../index-814bcac2.js';
2
2
  import { n, e } from '../../query-assigned-elements-5d94572f.js';
3
3
  import { t } from '../../state-0a779257.js';
4
+ import { i as ie } from '../../index-faa8c4ae.js';
5
+ import { o } from '../../style-map-21f59b89.js';
6
+ import '../../directive-2bb7789e.js';
4
7
 
5
8
  var top = 'top';
6
9
  var bottom = 'bottom';
@@ -3471,6 +3474,13 @@ let LuksoTooltip = class extends TailwindStyledElement(style) {
3471
3474
  this.showCopy = false;
3472
3475
  this.optionsParsed = [];
3473
3476
  this.tooltipInstance = void 0;
3477
+ this.tooltipStyles = ie({
3478
+ slots: {
3479
+ tooltip: "hidden",
3480
+ trigger: "cursor-pointer flex flex-col items-center",
3481
+ options: "rounded-4 hover:bg-neutral-95"
3482
+ }
3483
+ });
3474
3484
  }
3475
3485
  hideOnClickCheck() {
3476
3486
  if (this.hideOnClick === "toggle") {
@@ -3539,20 +3549,26 @@ let LuksoTooltip = class extends TailwindStyledElement(style) {
3539
3549
  this.initTooltip();
3540
3550
  }
3541
3551
  optionsTemplate() {
3542
- return x`
3543
- ${Object.entries(this.optionsParsed).map(
3544
- (option) => x`<div
3545
- class="mb-1 rounded-4 px-2 py-1 hover:cursor-pointer hover:bg-neutral-95"
3552
+ const { options } = this.tooltipStyles();
3553
+ return x`<ul>
3554
+ ${Object.entries(this.optionsParsed)?.map(
3555
+ (option) => x`<li
3556
+ class=${options()}
3557
+ style=${o({
3558
+ padding: "4px 8px",
3559
+ cursor: "pointer"
3560
+ })}
3546
3561
  onClick="navigator.clipboard.writeText('${option[1].value}')"
3547
3562
  >
3548
3563
  ${option[1].text}
3549
- </div>`
3564
+ </li>`
3550
3565
  )}
3551
- `;
3566
+ </ul>`;
3552
3567
  }
3553
3568
  render() {
3569
+ const { tooltip, trigger } = this.tooltipStyles();
3554
3570
  return x`
3555
- <div id="tooltip" role="tooltip" class="bg-neutral-20 p-4 hidden">
3571
+ <div id="tooltip" role="tooltip" class=${tooltip()}>
3556
3572
  ${this.options ? this.optionsTemplate() : this.text}
3557
3573
  </div>
3558
3574
  ${this.isClipboardCopy ? x`<lukso-tooltip
@@ -3565,18 +3581,10 @@ let LuksoTooltip = class extends TailwindStyledElement(style) {
3565
3581
  ?show=${this.showCopy ? true : void 0}
3566
3582
  text=${this.copyText}
3567
3583
  >
3568
- <div
3569
- id="trigger"
3570
- class="cursor-pointer flex flex-col items-center"
3571
- @click=${this.handleClick}
3572
- >
3584
+ <div id="trigger" class=${trigger()} @click=${this.handleClick}>
3573
3585
  <slot></slot>
3574
3586
  </div>
3575
- </lukso-tooltip>` : x`<div
3576
- id="trigger"
3577
- class="cursor-pointer flex flex-col items-center"
3578
- @click=${this.handleClick}
3579
- >
3587
+ </lukso-tooltip>` : x`<div id="trigger" class=${trigger()} @click=${this.handleClick}>
3580
3588
  <slot></slot>
3581
3589
  </div>`}
3582
3590
  `;
@@ -24,6 +24,6 @@ export declare const PlacementBottom: any;
24
24
  export declare const Offset: any;
25
25
  /** Tooltip can work as clipboard copy component. For that wou need to enable `is-clipboard-copy` and set `copy-text` attribute.. */
26
26
  export declare const ClipboardCopy: any;
27
- /** Tooltip with options (copied to clipboard). */
27
+ /** Tooltip with `options` (copied to clipboard). */
28
28
  export declare const OptionsTooltip: any;
29
29
  //# sourceMappingURL=lukso-tooltip.stories.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"lukso-tooltip.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-tooltip/lukso-tooltip.stories.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAA;AAErD,OAAO,SAAS,CAAA;AAChB,OAAO,uBAAuB,CAAA;AAE9B,gEAAgE;AAChE,QAAA,MAAM,IAAI,EAAE,IAmLX,CAAA;AAED,eAAe,IAAI,CAAA;AAuCnB,8CAA8C;AAC9C,eAAO,MAAM,cAAc,KAA2B,CAAA;AAMtD,4CAA4C;AAC5C,eAAO,MAAM,YAAY,KAA2B,CAAA;AAOpD,sEAAsE;AACtE,eAAO,MAAM,QAAQ,KAA2B,CAAA;AAUhD,gCAAgC;AAChC,eAAO,MAAM,SAAS,KAA2B,CAAA;AASjD,mCAAmC;AACnC,eAAO,MAAM,YAAY,KAA2B,CAAA;AASpD,qCAAqC;AACrC,eAAO,MAAM,cAAc,KAA2B,CAAA;AAStD,oCAAoC;AACpC,eAAO,MAAM,aAAa,KAA2B,CAAA;AASrD,oEAAoE;AACpE,eAAO,MAAM,cAAc,KAA2B,CAAA;AAOtD,eAAO,MAAM,aAAa,KAA2B,CAAA;AAQrD,eAAO,MAAM,eAAe,KAA2B,CAAA;AASvD,8DAA8D;AAC9D,eAAO,MAAM,MAAM,KAA2B,CAAA;AAS9C,qIAAqI;AACrI,eAAO,MAAM,aAAa,KAA2B,CAAA;AAUrD,mDAAmD;AACnD,eAAO,MAAM,cAAc,KAA2B,CAAA"}
1
+ {"version":3,"file":"lukso-tooltip.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-tooltip/lukso-tooltip.stories.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAA;AAErD,OAAO,SAAS,CAAA;AAChB,OAAO,uBAAuB,CAAA;AAE9B,gEAAgE;AAChE,QAAA,MAAM,IAAI,EAAE,IAmLX,CAAA;AAED,eAAe,IAAI,CAAA;AAuCnB,8CAA8C;AAC9C,eAAO,MAAM,cAAc,KAA2B,CAAA;AAMtD,4CAA4C;AAC5C,eAAO,MAAM,YAAY,KAA2B,CAAA;AAOpD,sEAAsE;AACtE,eAAO,MAAM,QAAQ,KAA2B,CAAA;AAUhD,gCAAgC;AAChC,eAAO,MAAM,SAAS,KAA2B,CAAA;AASjD,mCAAmC;AACnC,eAAO,MAAM,YAAY,KAA2B,CAAA;AASpD,qCAAqC;AACrC,eAAO,MAAM,cAAc,KAA2B,CAAA;AAStD,oCAAoC;AACpC,eAAO,MAAM,aAAa,KAA2B,CAAA;AASrD,oEAAoE;AACpE,eAAO,MAAM,cAAc,KAA2B,CAAA;AAOtD,eAAO,MAAM,aAAa,KAA2B,CAAA;AAQrD,eAAO,MAAM,eAAe,KAA2B,CAAA;AASvD,8DAA8D;AAC9D,eAAO,MAAM,MAAM,KAA2B,CAAA;AAS9C,qIAAqI;AACrI,eAAO,MAAM,aAAa,KAA2B,CAAA;AAUrD,qDAAqD;AACrD,eAAO,MAAM,cAAc,KAA2B,CAAA"}
@@ -2,10 +2,10 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
 
5
- const shared_tailwindElement_index = require('../../index-9158df3a.cjs');
5
+ const shared_tailwindElement_index = require('../../index-5cc4a839.cjs');
6
6
  const queryAssignedElements = require('../../query-assigned-elements-1d5d9d4c.cjs');
7
7
  const index = require('../../index-e9668573.cjs');
8
- const index$1 = require('../../index-21e30dce.cjs');
8
+ const index$1 = require('../../index-0e131d65.cjs');
9
9
  require('../../directive-8278ab14.cjs');
10
10
 
11
11
  const sliceAddress = (address, startSliceBy = 6, endSliceBy) => {
@@ -1,7 +1,7 @@
1
- import { T as TailwindStyledElement, x, A } from '../../index-987980d1.js';
1
+ import { T as TailwindStyledElement, x, A } from '../../index-814bcac2.js';
2
2
  import { n, e } from '../../query-assigned-elements-5d94572f.js';
3
3
  import { c as customClassMap } from '../../index-5e194caf.js';
4
- import { c as customStyleMap } from '../../index-ccc127cd.js';
4
+ import { c as customStyleMap } from '../../index-f171e7da.js';
5
5
  import '../../directive-2bb7789e.js';
6
6
 
7
7
  const sliceAddress = (address, startSliceBy = 6, endSliceBy) => {