@lukso/web-components 1.85.1 → 1.87.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 (105) hide show
  1. package/dist/components/index.cjs +18 -3
  2. package/dist/components/index.d.ts +3 -0
  3. package/dist/components/index.d.ts.map +1 -1
  4. package/dist/components/index.js +6 -3
  5. package/dist/components/lukso-button/index.cjs +13 -4
  6. package/dist/components/lukso-button/index.d.ts +1 -1
  7. package/dist/components/lukso-button/index.d.ts.map +1 -1
  8. package/dist/components/lukso-button/index.js +13 -4
  9. package/dist/components/lukso-button/lukso-button.stories.d.ts +6 -0
  10. package/dist/components/lukso-button/lukso-button.stories.d.ts.map +1 -1
  11. package/dist/components/lukso-card/index.cjs +3 -3
  12. package/dist/components/lukso-card/index.js +3 -3
  13. package/dist/components/lukso-checkbox/index.cjs +1 -1
  14. package/dist/components/lukso-checkbox/index.js +1 -1
  15. package/dist/components/lukso-dropdown/index.cjs +26 -0
  16. package/dist/components/lukso-dropdown/index.d.ts +28 -0
  17. package/dist/components/lukso-dropdown/index.d.ts.map +1 -0
  18. package/dist/components/lukso-dropdown/index.js +15 -0
  19. package/dist/components/lukso-dropdown/lukso-dropdown.stories.d.ts +9 -0
  20. package/dist/components/lukso-dropdown/lukso-dropdown.stories.d.ts.map +1 -0
  21. package/dist/components/lukso-dropdown-option/index.cjs +110 -0
  22. package/dist/components/lukso-dropdown-option/index.d.ts +19 -0
  23. package/dist/components/lukso-dropdown-option/index.d.ts.map +1 -0
  24. package/dist/components/lukso-dropdown-option/index.js +108 -0
  25. package/dist/components/lukso-dropdown-option/lukso-dropdown-option.stories.d.ts +7 -0
  26. package/dist/components/lukso-dropdown-option/lukso-dropdown-option.stories.d.ts.map +1 -0
  27. package/dist/components/lukso-footer/index.cjs +1 -1
  28. package/dist/components/lukso-footer/index.js +1 -1
  29. package/dist/components/lukso-icon/index.cjs +2 -2
  30. package/dist/components/lukso-icon/index.js +2 -2
  31. package/dist/components/lukso-image/index.cjs +2 -2
  32. package/dist/components/lukso-image/index.js +2 -2
  33. package/dist/components/lukso-input/index.cjs +2 -2
  34. package/dist/components/lukso-input/index.js +2 -2
  35. package/dist/components/lukso-modal/index.cjs +1 -1
  36. package/dist/components/lukso-modal/index.js +1 -1
  37. package/dist/components/lukso-navbar/index.cjs +3 -3
  38. package/dist/components/lukso-navbar/index.js +3 -3
  39. package/dist/components/lukso-pagination/index.cjs +2 -2
  40. package/dist/components/lukso-pagination/index.js +2 -2
  41. package/dist/components/lukso-profile/index.cjs +2 -2
  42. package/dist/components/lukso-profile/index.js +2 -2
  43. package/dist/components/lukso-progress/index.cjs +2 -2
  44. package/dist/components/lukso-progress/index.js +2 -2
  45. package/dist/components/lukso-sanitize/index.cjs +1 -1
  46. package/dist/components/lukso-sanitize/index.js +1 -1
  47. package/dist/components/lukso-search/index.cjs +62 -71
  48. package/dist/components/lukso-search/index.d.ts +1 -3
  49. package/dist/components/lukso-search/index.d.ts.map +1 -1
  50. package/dist/components/lukso-search/index.js +62 -71
  51. package/dist/components/lukso-select/index.cjs +29 -98
  52. package/dist/components/lukso-select/index.d.ts +0 -3
  53. package/dist/components/lukso-select/index.d.ts.map +1 -1
  54. package/dist/components/lukso-select/index.js +28 -97
  55. package/dist/components/lukso-share/index.cjs +1 -1
  56. package/dist/components/lukso-share/index.js +1 -1
  57. package/dist/components/lukso-switch/index.cjs +2 -2
  58. package/dist/components/lukso-switch/index.js +2 -2
  59. package/dist/components/lukso-tag/index.cjs +2 -2
  60. package/dist/components/lukso-tag/index.js +2 -2
  61. package/dist/components/lukso-terms/index.cjs +2 -2
  62. package/dist/components/lukso-terms/index.js +2 -2
  63. package/dist/components/lukso-test/index.cjs +1 -1
  64. package/dist/components/lukso-test/index.js +1 -1
  65. package/dist/components/lukso-textarea/index.cjs +361 -0
  66. package/dist/components/lukso-textarea/index.d.ts +46 -0
  67. package/dist/components/lukso-textarea/index.d.ts.map +1 -0
  68. package/dist/components/lukso-textarea/index.js +359 -0
  69. package/dist/components/lukso-textarea/lukso-textarea.stories.d.ts +23 -0
  70. package/dist/components/lukso-textarea/lukso-textarea.stories.d.ts.map +1 -0
  71. package/dist/components/lukso-tooltip/index.cjs +2 -2
  72. package/dist/components/lukso-tooltip/index.js +2 -2
  73. package/dist/components/lukso-username/index.cjs +2 -2
  74. package/dist/components/lukso-username/index.js +2 -2
  75. package/dist/components/lukso-wizard/index.cjs +1 -1
  76. package/dist/components/lukso-wizard/index.js +1 -1
  77. package/dist/{index-3b498928.cjs → index-0bb73cde.cjs} +1 -1
  78. package/dist/index-0e089618.js +141 -0
  79. package/dist/index-5c4bade5.cjs +143 -0
  80. package/dist/index-6e3f406c.cjs +46 -0
  81. package/dist/index-9d81031f.js +39 -0
  82. package/dist/{index-8043be8a.js → index-c395d033.js} +1 -1
  83. package/dist/index.cjs +18 -3
  84. package/dist/index.js +6 -3
  85. package/dist/shared/tailwind-element/index.cjs +1 -1
  86. package/dist/shared/tailwind-element/index.js +1 -1
  87. package/dist/{style-map-a6d61d04.cjs → style-map-320a365c.cjs} +1 -1
  88. package/dist/{style-map-ad97bcc3.js → style-map-d014149d.js} +1 -1
  89. package/dist/styles/main.css +1 -0
  90. package/dist/styles/main.css.map +1 -1
  91. package/dist/tailwind-config.cjs +1 -1
  92. package/dist/tailwind-config.js +1 -1
  93. package/package.json +16 -1
  94. package/tools/cn.cjs +1 -1
  95. package/tools/cn.js +1 -1
  96. package/tools/index.cjs +1 -1
  97. package/tools/index.js +1 -1
  98. package/tools/sass/colors.scss +1 -0
  99. package/tools/styles/main.css +1 -0
  100. package/tools/{tailwind-config-cece8e4d.cjs → tailwind-config-783c9054.cjs} +1 -1
  101. package/tools/{tailwind-config-effbdecc.js → tailwind-config-e386df1d.js} +1 -1
  102. package/tools/tailwind-config.cjs +1 -1
  103. package/tools/tailwind-config.js +1 -1
  104. package/dist/index-e653a9ff.cjs +0 -46
  105. package/dist/index-f72579d6.js +0 -39
@@ -5,6 +5,8 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
5
5
  const components_luksoButton_index = require('./lukso-button/index.cjs');
6
6
  const components_luksoCard_index = require('./lukso-card/index.cjs');
7
7
  const components_luksoCheckbox_index = require('./lukso-checkbox/index.cjs');
8
+ const components_luksoDropdown_index = require('../index-5c4bade5.cjs');
9
+ const components_luksoDropdownOption_index = require('./lukso-dropdown-option/index.cjs');
8
10
  const components_luksoFooter_index = require('./lukso-footer/index.cjs');
9
11
  const components_luksoIcon_index = require('./lukso-icon/index.cjs');
10
12
  const components_luksoImage_index = require('./lukso-image/index.cjs');
@@ -22,19 +24,20 @@ const components_luksoSwitch_index = require('./lukso-switch/index.cjs');
22
24
  const components_luksoTag_index = require('./lukso-tag/index.cjs');
23
25
  const components_luksoTerms_index = require('./lukso-terms/index.cjs');
24
26
  const components_luksoTest_index = require('./lukso-test/index.cjs');
27
+ const components_luksoTextarea_index = require('./lukso-textarea/index.cjs');
25
28
  const components_luksoTooltip_index = require('./lukso-tooltip/index.cjs');
26
29
  const components_luksoUsername_index = require('./lukso-username/index.cjs');
27
30
  const components_luksoWizard_index = require('./lukso-wizard/index.cjs');
28
- const shared_tailwindElement_index = require('../index-e653a9ff.cjs');
31
+ const shared_tailwindElement_index = require('../index-6e3f406c.cjs');
29
32
  require('../cn-5ceac001.cjs');
30
33
  require('../query-assigned-elements-d5e45650.cjs');
31
34
  require('../state-d9fb972b.cjs');
32
35
  require('../index-1d3f4a5a.cjs');
33
36
  require('../bundle-mjs-d58a83c6.cjs');
34
37
  require('../tailwind-config.cjs');
35
- require('../style-map-a6d61d04.cjs');
38
+ require('../style-map-320a365c.cjs');
36
39
  require('../directive-8278ab14.cjs');
37
- require('../index-3b498928.cjs');
40
+ require('../index-0bb73cde.cjs');
38
41
  require('../index-e9668573.cjs');
39
42
 
40
43
 
@@ -51,6 +54,14 @@ Object.defineProperty(exports, 'LuksoCheckbox', {
51
54
  enumerable: true,
52
55
  get: () => components_luksoCheckbox_index.LuksoCheckbox
53
56
  });
57
+ Object.defineProperty(exports, 'LuksoDropdown', {
58
+ enumerable: true,
59
+ get: () => components_luksoDropdown_index.LuksoDropdown
60
+ });
61
+ Object.defineProperty(exports, 'LuksoDropdownOption', {
62
+ enumerable: true,
63
+ get: () => components_luksoDropdownOption_index.LuksoDropdownOption
64
+ });
54
65
  Object.defineProperty(exports, 'LuksoFooter', {
55
66
  enumerable: true,
56
67
  get: () => components_luksoFooter_index.LuksoFooter
@@ -119,6 +130,10 @@ Object.defineProperty(exports, 'LuksoTest', {
119
130
  enumerable: true,
120
131
  get: () => components_luksoTest_index.LuksoTest
121
132
  });
133
+ Object.defineProperty(exports, 'LuksoTextarea', {
134
+ enumerable: true,
135
+ get: () => components_luksoTextarea_index.LuksoTextarea
136
+ });
122
137
  Object.defineProperty(exports, 'LuksoTooltip', {
123
138
  enumerable: true,
124
139
  get: () => components_luksoTooltip_index.LuksoTooltip
@@ -1,6 +1,8 @@
1
1
  export * from './lukso-button/index';
2
2
  export * from './lukso-card/index';
3
3
  export * from './lukso-checkbox/index';
4
+ export * from './lukso-dropdown/index';
5
+ export * from './lukso-dropdown-option/index';
4
6
  export * from './lukso-footer/index';
5
7
  export * from './lukso-icon/index';
6
8
  export * from './lukso-image/index';
@@ -18,6 +20,7 @@ export * from './lukso-switch/index';
18
20
  export * from './lukso-tag/index';
19
21
  export * from './lukso-terms/index';
20
22
  export * from './lukso-test/index';
23
+ export * from './lukso-textarea/index';
21
24
  export * from './lukso-tooltip/index';
22
25
  export * from './lukso-username/index';
23
26
  export * from './lukso-wizard/index';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/index.ts"],"names":[],"mappings":"AACA,cAAc,sBAAsB,CAAA;AACpC,cAAc,oBAAoB,CAAA;AAClC,cAAc,wBAAwB,CAAA;AACtC,cAAc,sBAAsB,CAAA;AACpC,cAAc,oBAAoB,CAAA;AAClC,cAAc,qBAAqB,CAAA;AACnC,cAAc,qBAAqB,CAAA;AACnC,cAAc,qBAAqB,CAAA;AACnC,cAAc,sBAAsB,CAAA;AACpC,cAAc,0BAA0B,CAAA;AACxC,cAAc,uBAAuB,CAAA;AACrC,cAAc,wBAAwB,CAAA;AACtC,cAAc,wBAAwB,CAAA;AACtC,cAAc,sBAAsB,CAAA;AACpC,cAAc,sBAAsB,CAAA;AACpC,cAAc,qBAAqB,CAAA;AACnC,cAAc,sBAAsB,CAAA;AACpC,cAAc,mBAAmB,CAAA;AACjC,cAAc,qBAAqB,CAAA;AACnC,cAAc,oBAAoB,CAAA;AAClC,cAAc,uBAAuB,CAAA;AACrC,cAAc,wBAAwB,CAAA;AACtC,cAAc,sBAAsB,CAAA;AACpC,cAAc,8BAA8B,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/index.ts"],"names":[],"mappings":"AACA,cAAc,sBAAsB,CAAA;AACpC,cAAc,oBAAoB,CAAA;AAClC,cAAc,wBAAwB,CAAA;AACtC,cAAc,wBAAwB,CAAA;AACtC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,sBAAsB,CAAA;AACpC,cAAc,oBAAoB,CAAA;AAClC,cAAc,qBAAqB,CAAA;AACnC,cAAc,qBAAqB,CAAA;AACnC,cAAc,qBAAqB,CAAA;AACnC,cAAc,sBAAsB,CAAA;AACpC,cAAc,0BAA0B,CAAA;AACxC,cAAc,uBAAuB,CAAA;AACrC,cAAc,wBAAwB,CAAA;AACtC,cAAc,wBAAwB,CAAA;AACtC,cAAc,sBAAsB,CAAA;AACpC,cAAc,sBAAsB,CAAA;AACpC,cAAc,qBAAqB,CAAA;AACnC,cAAc,sBAAsB,CAAA;AACpC,cAAc,mBAAmB,CAAA;AACjC,cAAc,qBAAqB,CAAA;AACnC,cAAc,oBAAoB,CAAA;AAClC,cAAc,wBAAwB,CAAA;AACtC,cAAc,uBAAuB,CAAA;AACrC,cAAc,wBAAwB,CAAA;AACtC,cAAc,sBAAsB,CAAA;AACpC,cAAc,8BAA8B,CAAA"}
@@ -1,6 +1,8 @@
1
1
  export { LuksoButton } from './lukso-button/index.js';
2
2
  export { LuksoCard } from './lukso-card/index.js';
3
3
  export { LuksoCheckbox } from './lukso-checkbox/index.js';
4
+ export { L as LuksoDropdown } from '../index-0e089618.js';
5
+ export { LuksoDropdownOption } from './lukso-dropdown-option/index.js';
4
6
  export { LuksoFooter } from './lukso-footer/index.js';
5
7
  export { LuksoIcon } from './lukso-icon/index.js';
6
8
  export { LuksoImage } from './lukso-image/index.js';
@@ -18,17 +20,18 @@ export { LuksoSwitch } from './lukso-switch/index.js';
18
20
  export { LuksoTag } from './lukso-tag/index.js';
19
21
  export { LuksoTerms } from './lukso-terms/index.js';
20
22
  export { LuksoTest } from './lukso-test/index.js';
23
+ export { LuksoTextarea } from './lukso-textarea/index.js';
21
24
  export { LuksoTooltip } from './lukso-tooltip/index.js';
22
25
  export { LuksoUsername } from './lukso-username/index.js';
23
26
  export { LuksoWizard } from './lukso-wizard/index.js';
24
- export { a as TailwindElement, T as TailwindStyledElement } from '../index-f72579d6.js';
27
+ export { a as TailwindElement, T as TailwindStyledElement } from '../index-9d81031f.js';
25
28
  import '../cn-b54dcc61.js';
26
29
  import '../query-assigned-elements-1c8c9e90.js';
27
30
  import '../state-b9ca4e74.js';
28
31
  import '../index-ca8e900d.js';
29
32
  import '../bundle-mjs-fbc6e2a8.js';
30
33
  import '../tailwind-config.js';
31
- import '../style-map-ad97bcc3.js';
34
+ import '../style-map-d014149d.js';
32
35
  import '../directive-2bb7789e.js';
33
- import '../index-8043be8a.js';
36
+ import '../index-c395d033.js';
34
37
  import '../index-5e194caf.js';
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
 
5
- const shared_tailwindElement_index = require('../../index-e653a9ff.cjs');
5
+ const shared_tailwindElement_index = require('../../index-6e3f406c.cjs');
6
6
  const queryAssignedElements = require('../../query-assigned-elements-d5e45650.cjs');
7
7
  const state = require('../../state-d9fb972b.cjs');
8
8
  const index = require('../../index-1d3f4a5a.cjs');
@@ -75,7 +75,16 @@ exports.LuksoButton = class LuksoButton extends shared_tailwindElement_index.Tai
75
75
  disabled:text-neutral-90`,
76
76
  link: "bg-transparent border-none active:!scale-100 underline text-purple-51 hover:text-purple-41",
77
77
  "nav-button": "nav-apax-12-medium-uppercase text-purple-41 !text-12",
78
- "nav-text": "bg-transparent border-none nav-apax-12-medium-uppercase text-purple-63 hover:text-purple-41 !text-12 transition"
78
+ "nav-text": "bg-transparent border-none nav-apax-12-medium-uppercase text-purple-63 hover:text-purple-41 !text-12 transition",
79
+ success: `bg-green-54 border-green-54 text-neutral-100
80
+ disabled:hover:!bg-green-54 disabled:hover:!border-green-54
81
+ hover:bg-green-63 hover:border-green-63 before:bg-green-54`,
82
+ danger: `bg-red-55 border-red-55 text-neutral-100
83
+ disabled:hover:!bg-red-55 disabled:hover:!border-red-55
84
+ hover:bg-red-65 hover:border-red-65 before:bg-red-55`,
85
+ warning: `bg-yellow-55 border-yellow-55 text-neutral-100
86
+ disabled:hover:!bg-yellow-55 disabled:hover:!border-yellow-55
87
+ hover:bg-yellow-65 hover:border-yellow-65 before:bg-yellow-55`
79
88
  },
80
89
  size: {
81
90
  medium: "h-[48px] px-6 paragraph-inter-16-semi-bold rounded-12",
@@ -115,7 +124,7 @@ exports.LuksoButton = class LuksoButton extends shared_tailwindElement_index.Tai
115
124
  },
116
125
  {
117
126
  size: ["medium"],
118
- color: ["primary", "landing"],
127
+ color: ["primary", "landing", "success", "danger", "warning"],
119
128
  class: "hover:shadow-button-medium-hover-primary active:shadow-button-medium-press-primary"
120
129
  },
121
130
  {
@@ -125,7 +134,7 @@ exports.LuksoButton = class LuksoButton extends shared_tailwindElement_index.Tai
125
134
  },
126
135
  {
127
136
  size: ["small"],
128
- color: ["primary", "landing"],
137
+ color: ["primary", "landing", "success", "danger", "warning"],
129
138
  class: "hover:shadow-button-small-hover-primary active:shadow-button-small-press-primary"
130
139
  },
131
140
  {
@@ -1,5 +1,5 @@
1
1
  import type { InputSize } from '../../shared/types';
2
- export type ButtonVariant = 'primary' | 'secondary' | 'landing' | 'text' | 'nav-button' | 'nav-text' | 'link';
2
+ export type ButtonVariant = 'primary' | 'secondary' | 'landing' | 'text' | 'nav-button' | 'nav-text' | 'link' | 'success' | 'danger' | 'warning';
3
3
  export type ButtonType = 'submit' | 'reset' | 'button';
4
4
  export type LinkTarget = '_blank' | '_self' | '_parent' | '_top';
5
5
  declare const LuksoButton_base: typeof import("lit").LitElement;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-button/index.ts"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAE/C,MAAM,MAAM,aAAa,GACrB,SAAS,GACT,WAAW,GACX,SAAS,GACT,MAAM,GACN,YAAY,GACZ,UAAU,GACV,MAAM,CAAA;AACV,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAA;AACtD,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,CAAA;;AAIhE,qBACa,WAAY,SAAQ,gBAA4B;IAE3D,OAAO,EAAE,aAAa,CAAY;IAGlC,IAAI,EAAE,SAAS,CAAW;IAG1B,QAAQ,UAAQ;IAGhB,WAAW,UAAQ;IAGnB,WAAW,UAAQ;IAGnB,MAAM,UAAQ;IAGd,SAAS,UAAQ;IAGjB,IAAI,EAAE,UAAU,CAAW;IAG3B,IAAI,SAAK;IAGT,MAAM,EAAE,UAAU,CAAW;IAG7B,GAAG,SAAK;IAGR,WAAW,SAAK;IAGhB,WAAW,SAAK;IAGhB,QAAQ,UAAQ;IAGhB,KAAK,SAAK;IAGV,MAAM,UAAQ;IAGd,OAAO,CAAC,SAAS,CAAQ;IAGzB,OAAO,CAAC,YAAY,CAAQ;IAG5B,OAAO,CAAC,KAAK,CAAI;IAEjB,OAAO,CAAC,aAAa,CAOnB;IAEF,OAAO,CAAC,YAAY,CA+FlB;IAEF,OAAO,CAAC,aAAa,CAenB;IAEF,OAAO,CAAC,eAAe;IA2BvB,OAAO,CAAC,aAAa;IAcrB,eAAe;IAkBf,eAAe;IAQf,cAAc;IA8Bd,YAAY;IAuBZ,MAAM;CAGP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,WAAW,CAAA;KAC5B;CACF"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-button/index.ts"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAE/C,MAAM,MAAM,aAAa,GACrB,SAAS,GACT,WAAW,GACX,SAAS,GACT,MAAM,GACN,YAAY,GACZ,UAAU,GACV,MAAM,GACN,SAAS,GACT,QAAQ,GACR,SAAS,CAAA;AACb,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAA;AACtD,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,CAAA;;AAIhE,qBACa,WAAY,SAAQ,gBAA4B;IAE3D,OAAO,EAAE,aAAa,CAAY;IAGlC,IAAI,EAAE,SAAS,CAAW;IAG1B,QAAQ,UAAQ;IAGhB,WAAW,UAAQ;IAGnB,WAAW,UAAQ;IAGnB,MAAM,UAAQ;IAGd,SAAS,UAAQ;IAGjB,IAAI,EAAE,UAAU,CAAW;IAG3B,IAAI,SAAK;IAGT,MAAM,EAAE,UAAU,CAAW;IAG7B,GAAG,SAAK;IAGR,WAAW,SAAK;IAGhB,WAAW,SAAK;IAGhB,QAAQ,UAAQ;IAGhB,KAAK,SAAK;IAGV,MAAM,UAAQ;IAGd,OAAO,CAAC,SAAS,CAAQ;IAGzB,OAAO,CAAC,YAAY,CAAQ;IAG5B,OAAO,CAAC,KAAK,CAAI;IAEjB,OAAO,CAAC,aAAa,CAOnB;IAEF,OAAO,CAAC,YAAY,CAwGlB;IAEF,OAAO,CAAC,aAAa,CAenB;IAEF,OAAO,CAAC,eAAe;IA2BvB,OAAO,CAAC,aAAa;IAcrB,eAAe;IAkBf,eAAe;IAQf,cAAc;IA8Bd,YAAY;IAuBZ,MAAM;CAGP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,WAAW,CAAA;KAC5B;CACF"}
@@ -1,4 +1,4 @@
1
- import { T as TailwindStyledElement, x, A } from '../../index-f72579d6.js';
1
+ import { T as TailwindStyledElement, x, A } from '../../index-9d81031f.js';
2
2
  import { n, e } from '../../query-assigned-elements-1c8c9e90.js';
3
3
  import { t } from '../../state-b9ca4e74.js';
4
4
  import { c as ce } from '../../index-ca8e900d.js';
@@ -71,7 +71,16 @@ let LuksoButton = class extends TailwindStyledElement(style) {
71
71
  disabled:text-neutral-90`,
72
72
  link: "bg-transparent border-none active:!scale-100 underline text-purple-51 hover:text-purple-41",
73
73
  "nav-button": "nav-apax-12-medium-uppercase text-purple-41 !text-12",
74
- "nav-text": "bg-transparent border-none nav-apax-12-medium-uppercase text-purple-63 hover:text-purple-41 !text-12 transition"
74
+ "nav-text": "bg-transparent border-none nav-apax-12-medium-uppercase text-purple-63 hover:text-purple-41 !text-12 transition",
75
+ success: `bg-green-54 border-green-54 text-neutral-100
76
+ disabled:hover:!bg-green-54 disabled:hover:!border-green-54
77
+ hover:bg-green-63 hover:border-green-63 before:bg-green-54`,
78
+ danger: `bg-red-55 border-red-55 text-neutral-100
79
+ disabled:hover:!bg-red-55 disabled:hover:!border-red-55
80
+ hover:bg-red-65 hover:border-red-65 before:bg-red-55`,
81
+ warning: `bg-yellow-55 border-yellow-55 text-neutral-100
82
+ disabled:hover:!bg-yellow-55 disabled:hover:!border-yellow-55
83
+ hover:bg-yellow-65 hover:border-yellow-65 before:bg-yellow-55`
75
84
  },
76
85
  size: {
77
86
  medium: "h-[48px] px-6 paragraph-inter-16-semi-bold rounded-12",
@@ -111,7 +120,7 @@ let LuksoButton = class extends TailwindStyledElement(style) {
111
120
  },
112
121
  {
113
122
  size: ["medium"],
114
- color: ["primary", "landing"],
123
+ color: ["primary", "landing", "success", "danger", "warning"],
115
124
  class: "hover:shadow-button-medium-hover-primary active:shadow-button-medium-press-primary"
116
125
  },
117
126
  {
@@ -121,7 +130,7 @@ let LuksoButton = class extends TailwindStyledElement(style) {
121
130
  },
122
131
  {
123
132
  size: ["small"],
124
- color: ["primary", "landing"],
133
+ color: ["primary", "landing", "success", "danger", "warning"],
125
134
  class: "hover:shadow-button-small-hover-primary active:shadow-button-small-press-primary"
126
135
  },
127
136
  {
@@ -8,6 +8,12 @@ export declare const Primary: any;
8
8
  export declare const Secondary: any;
9
9
  /** Example of `landing` variant. */
10
10
  export declare const Landing: any;
11
+ /** Example of `success` variant. */
12
+ export declare const Success: any;
13
+ /** Example of `danger` variant. */
14
+ export declare const Danger: any;
15
+ /** Example of `warning` variant. */
16
+ export declare const Warning: any;
11
17
  /** Example of `text` variant. */
12
18
  export declare const Text: any;
13
19
  /** Example of `nav-button` variant. */
@@ -1 +1 @@
1
- {"version":3,"file":"lukso-button.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-button/lukso-button.stories.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAA;AAErD,OAAO,SAAS,CAAA;AAChB,OAAO,eAAe,CAAA;AAEtB,+DAA+D;AAC/D,QAAA,MAAM,IAAI,EAAE,IAiNX,CAAA;AAED,eAAe,IAAI,CAAA;AA2CnB,oDAAoD;AACpD,eAAO,MAAM,OAAO,KAAoB,CAAA;AAexC,sCAAsC;AACtC,eAAO,MAAM,SAAS,KAAoB,CAAA;AAW1C,qCAAqC;AACrC,eAAO,MAAM,OAAO,KAAoB,CAAA;AAWxC,kCAAkC;AAClC,eAAO,MAAM,IAAI,KAAoB,CAAA;AAWrC,wCAAwC;AACxC,eAAO,MAAM,SAAS,KAAoB,CAAA;AAK1C,sCAAsC;AACtC,eAAO,MAAM,OAAO,KAAoB,CAAA;AAKxC,kCAAkC;AAClC,eAAO,MAAM,WAAW,KAAoB,CAAA;AAK5C,uCAAuC;AACvC,eAAO,MAAM,SAAS,KAAoB,CAAA;AAK1C,gGAAgG;AAChG,eAAO,MAAM,SAAS,KAAoB,CAAA;AAW1C,gEAAgE;AAChE,eAAO,MAAM,cAAc,KAAoB,CAAA;AAa/C,6GAA6G;AAC7G,eAAO,MAAM,UAAU,KAAoB,CAAA;AAe3C;;GAEG;AACH,eAAO,MAAM,eAAe,KAAoB,CAAA;AAahD;4FAC4F;AAC5F,eAAO,MAAM,IAAI,KAAoB,CAAA;AAerC;GACG;AACH,eAAO,MAAM,aAAa,KAAoB,CAAA;AAc9C,uEAAuE;AACvE,eAAO,MAAM,iBAAiB,KAAoB,CAAA;AAalD,iDAAiD;AACjD,eAAO,MAAM,aAAa,KAAoB,CAAA"}
1
+ {"version":3,"file":"lukso-button.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-button/lukso-button.stories.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAA;AAErD,OAAO,SAAS,CAAA;AAChB,OAAO,eAAe,CAAA;AAEtB,+DAA+D;AAC/D,QAAA,MAAM,IAAI,EAAE,IAoNX,CAAA;AAED,eAAe,IAAI,CAAA;AA2CnB,oDAAoD;AACpD,eAAO,MAAM,OAAO,KAAoB,CAAA;AAexC,sCAAsC;AACtC,eAAO,MAAM,SAAS,KAAoB,CAAA;AAW1C,qCAAqC;AACrC,eAAO,MAAM,OAAO,KAAoB,CAAA;AAWxC,qCAAqC;AACrC,eAAO,MAAM,OAAO,KAAoB,CAAA;AAKxC,oCAAoC;AACpC,eAAO,MAAM,MAAM,KAAoB,CAAA;AAKvC,qCAAqC;AACrC,eAAO,MAAM,OAAO,KAAoB,CAAA;AAKxC,kCAAkC;AAClC,eAAO,MAAM,IAAI,KAAoB,CAAA;AAWrC,wCAAwC;AACxC,eAAO,MAAM,SAAS,KAAoB,CAAA;AAK1C,sCAAsC;AACtC,eAAO,MAAM,OAAO,KAAoB,CAAA;AAKxC,kCAAkC;AAClC,eAAO,MAAM,WAAW,KAAoB,CAAA;AAK5C,uCAAuC;AACvC,eAAO,MAAM,SAAS,KAAoB,CAAA;AAK1C,gGAAgG;AAChG,eAAO,MAAM,SAAS,KAAoB,CAAA;AAW1C,gEAAgE;AAChE,eAAO,MAAM,cAAc,KAAoB,CAAA;AAa/C,6GAA6G;AAC7G,eAAO,MAAM,UAAU,KAAoB,CAAA;AAe3C;;GAEG;AACH,eAAO,MAAM,eAAe,KAAoB,CAAA;AAahD;4FAC4F;AAC5F,eAAO,MAAM,IAAI,KAAoB,CAAA;AAerC;GACG;AACH,eAAO,MAAM,aAAa,KAAoB,CAAA;AAc9C,uEAAuE;AACvE,eAAO,MAAM,iBAAiB,KAAoB,CAAA;AAalD,iDAAiD;AACjD,eAAO,MAAM,aAAa,KAAoB,CAAA"}
@@ -2,15 +2,15 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
 
5
- const shared_tailwindElement_index = require('../../index-e653a9ff.cjs');
5
+ const shared_tailwindElement_index = require('../../index-6e3f406c.cjs');
6
6
  const queryAssignedElements = require('../../query-assigned-elements-d5e45650.cjs');
7
7
  const state = require('../../state-d9fb972b.cjs');
8
- const styleMap = require('../../style-map-a6d61d04.cjs');
8
+ const styleMap = require('../../style-map-320a365c.cjs');
9
9
  const index = require('../../index-1d3f4a5a.cjs');
10
10
  require('../lukso-profile/index.cjs');
11
11
  require('../../tailwind-config.cjs');
12
12
  const cn = require('../../cn-5ceac001.cjs');
13
- const index$1 = require('../../index-3b498928.cjs');
13
+ const index$1 = require('../../index-0bb73cde.cjs');
14
14
  require('../lukso-image/index.cjs');
15
15
  require('../../directive-8278ab14.cjs');
16
16
  require('../../bundle-mjs-d58a83c6.cjs');
@@ -1,12 +1,12 @@
1
- import { T as TailwindStyledElement, x, A } from '../../index-f72579d6.js';
1
+ import { T as TailwindStyledElement, x, A } from '../../index-9d81031f.js';
2
2
  import { n, l, e } from '../../query-assigned-elements-1c8c9e90.js';
3
3
  import { t } from '../../state-b9ca4e74.js';
4
- import { o } from '../../style-map-ad97bcc3.js';
4
+ import { o } from '../../style-map-d014149d.js';
5
5
  import { c as ce } from '../../index-ca8e900d.js';
6
6
  import '../lukso-profile/index.js';
7
7
  import '../../tailwind-config.js';
8
8
  import { c as cn } from '../../cn-b54dcc61.js';
9
- import { c as customStyleMap } from '../../index-8043be8a.js';
9
+ import { c as customStyleMap } from '../../index-c395d033.js';
10
10
  import '../lukso-image/index.js';
11
11
  import '../../directive-2bb7789e.js';
12
12
  import '../../bundle-mjs-fbc6e2a8.js';
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
 
5
- const shared_tailwindElement_index = require('../../index-e653a9ff.cjs');
5
+ const shared_tailwindElement_index = require('../../index-6e3f406c.cjs');
6
6
  const queryAssignedElements = require('../../query-assigned-elements-d5e45650.cjs');
7
7
  const state = require('../../state-d9fb972b.cjs');
8
8
  const index = require('../../index-e9668573.cjs');
@@ -1,4 +1,4 @@
1
- import { a as TailwindElement, x, A } from '../../index-f72579d6.js';
1
+ import { a as TailwindElement, x, A } from '../../index-9d81031f.js';
2
2
  import { n, e } from '../../query-assigned-elements-1c8c9e90.js';
3
3
  import { t } from '../../state-b9ca4e74.js';
4
4
  import { c as customClassMap } from '../../index-5e194caf.js';
@@ -0,0 +1,26 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
+
5
+ require('../../index-6e3f406c.cjs');
6
+ require('../../query-assigned-elements-d5e45650.cjs');
7
+ require('../../state-d9fb972b.cjs');
8
+ require('../../index-1d3f4a5a.cjs');
9
+ require('../lukso-icon/index.cjs');
10
+ require('../lukso-profile/index.cjs');
11
+ require('../lukso-username/index.cjs');
12
+ const components_luksoDropdown_index = require('../../index-5c4bade5.cjs');
13
+ require('../../bundle-mjs-d58a83c6.cjs');
14
+ require('../../style-map-320a365c.cjs');
15
+ require('../../directive-8278ab14.cjs');
16
+ require('../lukso-image/index.cjs');
17
+ require('../../index-0bb73cde.cjs');
18
+ require('../../tailwind-config.cjs');
19
+ require('../../cn-5ceac001.cjs');
20
+
21
+
22
+
23
+ Object.defineProperty(exports, 'LuksoDropdown', {
24
+ enumerable: true,
25
+ get: () => components_luksoDropdown_index.LuksoDropdown
26
+ });
@@ -0,0 +1,28 @@
1
+ import { nothing, type PropertyValues } from 'lit';
2
+ import type { InputSize } from '../../shared/types';
3
+ declare const LuksoDropdown_base: typeof import("lit").LitElement;
4
+ export declare class LuksoDropdown extends LuksoDropdown_base {
5
+ id: string;
6
+ triggerId: string;
7
+ isOpen: boolean;
8
+ isOpenOnOutsideClick: boolean;
9
+ openTop: boolean;
10
+ isRight: boolean;
11
+ isFullWidth: boolean;
12
+ size: InputSize;
13
+ private _isOpen;
14
+ constructor();
15
+ private styles;
16
+ connectedCallback(): void;
17
+ disconnectedCallback(): void;
18
+ willUpdate(changedProperties: PropertyValues<this>): void;
19
+ private handleClick;
20
+ render(): import("lit-html").TemplateResult<1> | typeof nothing;
21
+ }
22
+ declare global {
23
+ interface HTMLElementTagNameMap {
24
+ 'lukso-dropdown': LuksoDropdown;
25
+ }
26
+ }
27
+ export {};
28
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-dropdown/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAA;AAKxD,OAAO,yBAAyB,CAAA;AAChC,OAAO,4BAA4B,CAAA;AACnC,OAAO,6BAA6B,CAAA;AAIpC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;;AAE/C,qBACa,aAAc,SAAQ,kBAA4B;IAE7D,EAAE,SAAK;IAGP,SAAS,SAAK;IAGd,MAAM,UAAQ;IAGd,oBAAoB,UAAQ;IAG5B,OAAO,UAAQ;IAGf,OAAO,UAAQ;IAGf,WAAW,UAAQ;IAGnB,IAAI,EAAE,SAAS,CAAW;IAG1B,OAAO,CAAC,OAAO,CAAQ;;IAUvB,OAAO,CAAC,MAAM,CA8BZ;IAEF,iBAAiB;IAKjB,oBAAoB;IAKpB,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC;IAMlD,OAAO,CAAC,WAAW;IAgBnB,MAAM;CAcP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,gBAAgB,EAAE,aAAa,CAAA;KAChC;CACF"}
@@ -0,0 +1,15 @@
1
+ import '../../index-9d81031f.js';
2
+ import '../../query-assigned-elements-1c8c9e90.js';
3
+ import '../../state-b9ca4e74.js';
4
+ import '../../index-ca8e900d.js';
5
+ import '../lukso-icon/index.js';
6
+ import '../lukso-profile/index.js';
7
+ import '../lukso-username/index.js';
8
+ export { L as LuksoDropdown } from '../../index-0e089618.js';
9
+ import '../../bundle-mjs-fbc6e2a8.js';
10
+ import '../../style-map-d014149d.js';
11
+ import '../../directive-2bb7789e.js';
12
+ import '../lukso-image/index.js';
13
+ import '../../index-c395d033.js';
14
+ import '../../tailwind-config.js';
15
+ import '../../cn-b54dcc61.js';
@@ -0,0 +1,9 @@
1
+ import type { Meta } from '@storybook/web-components';
2
+ /** Documentation and examples of `lukso-dropdown` component. */
3
+ declare const meta: Meta;
4
+ export default meta;
5
+ /** Example of dropdown. */
6
+ export declare const DefaultDropdown: any;
7
+ /** Example of `small` dropdown. */
8
+ export declare const SmallDropdown: any;
9
+ //# sourceMappingURL=lukso-dropdown.stories.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"lukso-dropdown.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-dropdown/lukso-dropdown.stories.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAA;AAErD,OAAO,uBAAuB,CAAA;AAC9B,OAAO,gCAAgC,CAAA;AACvC,OAAO,SAAS,CAAA;AAEhB,iEAAiE;AACjE,QAAA,MAAM,IAAI,EAAE,IAkHX,CAAA;AAED,eAAe,IAAI,CAAA;AA6DnB,4BAA4B;AAC5B,eAAO,MAAM,eAAe,KAAoB,CAAA;AAMhD,oCAAoC;AACpC,eAAO,MAAM,aAAa,KAAoB,CAAA"}
@@ -0,0 +1,110 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
+
5
+ const shared_tailwindElement_index = require('../../index-6e3f406c.cjs');
6
+ const queryAssignedElements = require('../../query-assigned-elements-d5e45650.cjs');
7
+ const index = require('../../index-1d3f4a5a.cjs');
8
+ require('../../bundle-mjs-d58a83c6.cjs');
9
+
10
+ const style = ":host {\n display: block\n}";
11
+
12
+ var __defProp = Object.defineProperty;
13
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
14
+ var __decorateClass = (decorators, target, key, kind) => {
15
+ var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
16
+ for (var i = decorators.length - 1, decorator; i >= 0; i--)
17
+ if (decorator = decorators[i])
18
+ result = (kind ? decorator(target, key, result) : decorator(result)) || result;
19
+ if (kind && result)
20
+ __defProp(target, key, result);
21
+ return result;
22
+ };
23
+ exports.LuksoDropdownOption = class LuksoDropdownOption extends shared_tailwindElement_index.TailwindStyledElement(style) {
24
+ constructor() {
25
+ super(...arguments);
26
+ this.isReadonly = false;
27
+ this.isDisabled = false;
28
+ this.isSelected = false;
29
+ this.isActive = false;
30
+ this.isGroup = false;
31
+ this.size = "medium";
32
+ this.styles = index.ce({
33
+ base: `text-neutral-20 cursor-pointer select-none
34
+ whitespace-nowrap flex items-center truncate gap-2`,
35
+ variants: {
36
+ isSelected: {
37
+ true: "bg-neutral-95"
38
+ },
39
+ isActive: {
40
+ true: "bg-neutral-98"
41
+ },
42
+ isGroup: {
43
+ true: ""
44
+ },
45
+ size: {
46
+ small: "paragraph-inter-12-regular rounded-4 px-1 min-h-[28px]",
47
+ medium: "paragraph-inter-14-regular rounded-8 px-2 min-h-[38px]"
48
+ },
49
+ isDisabled: {
50
+ true: "opacity-60 cursor-not-allowed"
51
+ },
52
+ isReadonly: {
53
+ true: "cursor-not-allowed",
54
+ false: "hover:bg-neutral-98"
55
+ }
56
+ },
57
+ compoundVariants: [
58
+ {
59
+ isGroup: true,
60
+ size: "small",
61
+ class: "pl-3"
62
+ },
63
+ {
64
+ isGroup: true,
65
+ size: "medium",
66
+ class: "pl-4"
67
+ },
68
+ {
69
+ isReadonly: false,
70
+ isSelected: true,
71
+ class: "hover:bg-neutral-95"
72
+ }
73
+ ]
74
+ });
75
+ }
76
+ render() {
77
+ const styles = this.styles({
78
+ isSelected: this.isSelected,
79
+ isActive: this.isActive,
80
+ size: this.size,
81
+ isGroup: this.isGroup,
82
+ isDisabled: this.isDisabled,
83
+ isReadonly: this.isReadonly
84
+ });
85
+ return shared_tailwindElement_index.x`<div class="${styles}">
86
+ <slot></slot>
87
+ </div>`;
88
+ }
89
+ };
90
+ __decorateClass([
91
+ queryAssignedElements.n({ type: Boolean, attribute: "is-readonly" })
92
+ ], exports.LuksoDropdownOption.prototype, "isReadonly", 2);
93
+ __decorateClass([
94
+ queryAssignedElements.n({ type: Boolean, attribute: "is-disabled" })
95
+ ], exports.LuksoDropdownOption.prototype, "isDisabled", 2);
96
+ __decorateClass([
97
+ queryAssignedElements.n({ type: Boolean, attribute: "is-selected" })
98
+ ], exports.LuksoDropdownOption.prototype, "isSelected", 2);
99
+ __decorateClass([
100
+ queryAssignedElements.n({ type: Boolean, attribute: "is-active" })
101
+ ], exports.LuksoDropdownOption.prototype, "isActive", 2);
102
+ __decorateClass([
103
+ queryAssignedElements.n({ type: Boolean, attribute: "is-group" })
104
+ ], exports.LuksoDropdownOption.prototype, "isGroup", 2);
105
+ __decorateClass([
106
+ queryAssignedElements.n({ type: String })
107
+ ], exports.LuksoDropdownOption.prototype, "size", 2);
108
+ exports.LuksoDropdownOption = __decorateClass([
109
+ queryAssignedElements.e("lukso-dropdown-option")
110
+ ], exports.LuksoDropdownOption);
@@ -0,0 +1,19 @@
1
+ import type { InputSize } from '../../shared/types';
2
+ declare const LuksoDropdownOption_base: typeof import("lit").LitElement;
3
+ export declare class LuksoDropdownOption extends LuksoDropdownOption_base {
4
+ isReadonly: boolean;
5
+ isDisabled: boolean;
6
+ isSelected: boolean;
7
+ isActive: boolean;
8
+ isGroup: boolean;
9
+ size: InputSize;
10
+ private styles;
11
+ render(): import("lit-html").TemplateResult<1>;
12
+ }
13
+ declare global {
14
+ interface HTMLElementTagNameMap {
15
+ 'lukso-dropdown-option': LuksoDropdownOption;
16
+ }
17
+ }
18
+ export {};
19
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-dropdown-option/index.ts"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;;AAE/C,qBACa,mBAAoB,SAAQ,wBAA4B;IAEnE,UAAU,UAAQ;IAGlB,UAAU,UAAQ;IAGlB,UAAU,UAAQ;IAGlB,QAAQ,UAAQ;IAGhB,OAAO,UAAQ;IAGf,IAAI,EAAE,SAAS,CAAW;IAE1B,OAAO,CAAC,MAAM,CA0CZ;IAEF,MAAM;CAcP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,uBAAuB,EAAE,mBAAmB,CAAA;KAC7C;CACF"}
@@ -0,0 +1,108 @@
1
+ import { T as TailwindStyledElement, x } from '../../index-9d81031f.js';
2
+ import { n, e } from '../../query-assigned-elements-1c8c9e90.js';
3
+ import { c as ce } from '../../index-ca8e900d.js';
4
+ import '../../bundle-mjs-fbc6e2a8.js';
5
+
6
+ const style = ":host {\n display: block\n}";
7
+
8
+ var __defProp = Object.defineProperty;
9
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
10
+ var __decorateClass = (decorators, target, key, kind) => {
11
+ var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
12
+ for (var i = decorators.length - 1, decorator; i >= 0; i--)
13
+ if (decorator = decorators[i])
14
+ result = (kind ? decorator(target, key, result) : decorator(result)) || result;
15
+ if (kind && result)
16
+ __defProp(target, key, result);
17
+ return result;
18
+ };
19
+ let LuksoDropdownOption = class extends TailwindStyledElement(style) {
20
+ constructor() {
21
+ super(...arguments);
22
+ this.isReadonly = false;
23
+ this.isDisabled = false;
24
+ this.isSelected = false;
25
+ this.isActive = false;
26
+ this.isGroup = false;
27
+ this.size = "medium";
28
+ this.styles = ce({
29
+ base: `text-neutral-20 cursor-pointer select-none
30
+ whitespace-nowrap flex items-center truncate gap-2`,
31
+ variants: {
32
+ isSelected: {
33
+ true: "bg-neutral-95"
34
+ },
35
+ isActive: {
36
+ true: "bg-neutral-98"
37
+ },
38
+ isGroup: {
39
+ true: ""
40
+ },
41
+ size: {
42
+ small: "paragraph-inter-12-regular rounded-4 px-1 min-h-[28px]",
43
+ medium: "paragraph-inter-14-regular rounded-8 px-2 min-h-[38px]"
44
+ },
45
+ isDisabled: {
46
+ true: "opacity-60 cursor-not-allowed"
47
+ },
48
+ isReadonly: {
49
+ true: "cursor-not-allowed",
50
+ false: "hover:bg-neutral-98"
51
+ }
52
+ },
53
+ compoundVariants: [
54
+ {
55
+ isGroup: true,
56
+ size: "small",
57
+ class: "pl-3"
58
+ },
59
+ {
60
+ isGroup: true,
61
+ size: "medium",
62
+ class: "pl-4"
63
+ },
64
+ {
65
+ isReadonly: false,
66
+ isSelected: true,
67
+ class: "hover:bg-neutral-95"
68
+ }
69
+ ]
70
+ });
71
+ }
72
+ render() {
73
+ const styles = this.styles({
74
+ isSelected: this.isSelected,
75
+ isActive: this.isActive,
76
+ size: this.size,
77
+ isGroup: this.isGroup,
78
+ isDisabled: this.isDisabled,
79
+ isReadonly: this.isReadonly
80
+ });
81
+ return x`<div class="${styles}">
82
+ <slot></slot>
83
+ </div>`;
84
+ }
85
+ };
86
+ __decorateClass([
87
+ n({ type: Boolean, attribute: "is-readonly" })
88
+ ], LuksoDropdownOption.prototype, "isReadonly", 2);
89
+ __decorateClass([
90
+ n({ type: Boolean, attribute: "is-disabled" })
91
+ ], LuksoDropdownOption.prototype, "isDisabled", 2);
92
+ __decorateClass([
93
+ n({ type: Boolean, attribute: "is-selected" })
94
+ ], LuksoDropdownOption.prototype, "isSelected", 2);
95
+ __decorateClass([
96
+ n({ type: Boolean, attribute: "is-active" })
97
+ ], LuksoDropdownOption.prototype, "isActive", 2);
98
+ __decorateClass([
99
+ n({ type: Boolean, attribute: "is-group" })
100
+ ], LuksoDropdownOption.prototype, "isGroup", 2);
101
+ __decorateClass([
102
+ n({ type: String })
103
+ ], LuksoDropdownOption.prototype, "size", 2);
104
+ LuksoDropdownOption = __decorateClass([
105
+ e("lukso-dropdown-option")
106
+ ], LuksoDropdownOption);
107
+
108
+ export { LuksoDropdownOption };
@@ -0,0 +1,7 @@
1
+ import type { Meta } from '@storybook/web-components';
2
+ /** Documentation and examples of `lukso-dropdown-option` component. */
3
+ declare const meta: Meta;
4
+ export default meta;
5
+ /** Example of dropdown option. */
6
+ export declare const DefaultDropdownOption: any;
7
+ //# sourceMappingURL=lukso-dropdown-option.stories.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"lukso-dropdown-option.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-dropdown-option/lukso-dropdown-option.stories.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAA;AAErD,OAAO,uBAAuB,CAAA;AAE9B,OAAO,SAAS,CAAA;AAEhB,wEAAwE;AACxE,QAAA,MAAM,IAAI,EAAE,IAkFX,CAAA;AAED,eAAe,IAAI,CAAA;AAwBnB,mCAAmC;AACnC,eAAO,MAAM,qBAAqB,KAAoB,CAAA"}