@lukso/web-components 1.41.0 → 1.42.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 (80) hide show
  1. package/dist/components/index.cjs +7 -6
  2. package/dist/components/index.js +7 -6
  3. package/dist/components/lukso-button/index.cjs +21 -20
  4. package/dist/components/lukso-button/index.js +5 -4
  5. package/dist/components/lukso-card/index.cjs +15 -14
  6. package/dist/components/lukso-card/index.js +5 -4
  7. package/dist/components/lukso-checkbox/index.cjs +16 -15
  8. package/dist/components/lukso-checkbox/index.js +5 -4
  9. package/dist/components/lukso-footer/index.cjs +39 -27
  10. package/dist/components/lukso-footer/index.d.ts +2 -0
  11. package/dist/components/lukso-footer/index.d.ts.map +1 -1
  12. package/dist/components/lukso-footer/index.js +39 -27
  13. package/dist/components/lukso-footer/lukso-footer.stories.d.ts +2 -0
  14. package/dist/components/lukso-footer/lukso-footer.stories.d.ts.map +1 -1
  15. package/dist/components/lukso-icon/index.cjs +9 -8
  16. package/dist/components/lukso-icon/index.js +4 -3
  17. package/dist/components/lukso-input/index.cjs +26 -25
  18. package/dist/components/lukso-input/index.js +5 -4
  19. package/dist/components/lukso-modal/index.cjs +7 -6
  20. package/dist/components/lukso-modal/index.js +4 -3
  21. package/dist/components/lukso-navbar/index.cjs +15 -14
  22. package/dist/components/lukso-navbar/index.js +6 -5
  23. package/dist/components/lukso-profile/index.cjs +10 -9
  24. package/dist/components/lukso-profile/index.js +5 -4
  25. package/dist/components/lukso-progress/index.cjs +10 -9
  26. package/dist/components/lukso-progress/index.js +5 -4
  27. package/dist/components/lukso-sanitize/index.cjs +7 -6
  28. package/dist/components/lukso-sanitize/index.js +3 -2
  29. package/dist/components/lukso-search/index.cjs +27 -26
  30. package/dist/components/lukso-search/index.js +6 -5
  31. package/dist/components/lukso-share/index.cjs +24 -15
  32. package/dist/components/lukso-share/index.d.ts +8 -2
  33. package/dist/components/lukso-share/index.d.ts.map +1 -1
  34. package/dist/components/lukso-share/index.js +23 -14
  35. package/dist/components/lukso-share/lukso-share.stories.d.ts +5 -1
  36. package/dist/components/lukso-share/lukso-share.stories.d.ts.map +1 -1
  37. package/dist/components/lukso-switch/index.cjs +9 -8
  38. package/dist/components/lukso-switch/index.js +5 -4
  39. package/dist/components/lukso-tag/index.cjs +10 -9
  40. package/dist/components/lukso-tag/index.js +5 -4
  41. package/dist/components/lukso-terms/index.cjs +9 -7
  42. package/dist/components/lukso-terms/index.d.ts.map +1 -1
  43. package/dist/components/lukso-terms/index.js +7 -5
  44. package/dist/components/lukso-test/index.cjs +10 -9
  45. package/dist/components/lukso-test/index.js +4 -3
  46. package/dist/components/lukso-username/index.cjs +16 -15
  47. package/dist/components/lukso-username/index.js +5 -4
  48. package/dist/components/lukso-wizard/index.cjs +10 -9
  49. package/dist/components/lukso-wizard/index.js +5 -4
  50. package/dist/directive-2bb7789e.js +8 -0
  51. package/dist/directive-8278ab14.cjs +12 -0
  52. package/dist/{directive-helpers-e70702eb.cjs → directive-helpers-01f1c3b1.cjs} +1 -1
  53. package/dist/{directive-helpers-1affe406.js → directive-helpers-8f79cbe5.js} +1 -1
  54. package/dist/{index-714323c9.js → index-5e194caf.js} +1 -1
  55. package/dist/{index-e765f94b.cjs → index-930f6cf2.cjs} +1 -1
  56. package/dist/{index-7dc05ee5.cjs → index-e9668573.cjs} +2 -2
  57. package/dist/{index-9dfdafd2.js → index-ed87f41b.js} +1 -1
  58. package/dist/index.cjs +7 -6
  59. package/dist/index.js +7 -6
  60. package/dist/query-assigned-elements-5200f974.cjs +24 -0
  61. package/dist/query-assigned-elements-e36df787.js +21 -0
  62. package/dist/shared/tailwind-element/index.cjs +1 -1
  63. package/dist/shared/tailwind-element/index.js +1 -1
  64. package/dist/{state-7fde94d1.js → state-02a92ffa.js} +1 -1
  65. package/dist/state-51b50a6b.cjs +11 -0
  66. package/dist/style-map-3b9af808.cjs +12 -0
  67. package/dist/{style-map-5173bb70.js → style-map-5daca6c4.js} +2 -2
  68. package/package.json +1 -1
  69. package/tools/assets/images/social-discord.svg +4 -1
  70. package/tools/assets/images/social-github.svg +11 -1
  71. package/tools/assets/images/social-instagram.svg +6 -1
  72. package/tools/assets/images/social-linkedin.svg +4 -1
  73. package/tools/assets/images/social-medium.svg +6 -1
  74. package/tools/assets/images/social-reddit.svg +11 -1
  75. package/tools/assets/images/social-telegram.svg +4 -1
  76. package/tools/assets/images/social-twitter.svg +4 -1
  77. package/dist/directive-9ec64c08.js +0 -28
  78. package/dist/directive-db00f5fb.cjs +0 -34
  79. package/dist/state-a62a7d5d.cjs +0 -11
  80. package/dist/style-map-3a049df9.cjs +0 -12
@@ -21,12 +21,13 @@ const components_luksoTerms_index = require('./lukso-terms/index.cjs');
21
21
  const components_luksoTest_index = require('./lukso-test/index.cjs');
22
22
  const components_luksoUsername_index = require('./lukso-username/index.cjs');
23
23
  const components_luksoWizard_index = require('./lukso-wizard/index.cjs');
24
- const shared_tailwindElement_index = require('../index-e765f94b.cjs');
25
- require('../directive-db00f5fb.cjs');
26
- require('../state-a62a7d5d.cjs');
27
- require('../index-7dc05ee5.cjs');
28
- require('../style-map-3a049df9.cjs');
29
- require('../directive-helpers-e70702eb.cjs');
24
+ const shared_tailwindElement_index = require('../index-930f6cf2.cjs');
25
+ require('../query-assigned-elements-5200f974.cjs');
26
+ require('../state-51b50a6b.cjs');
27
+ require('../index-e9668573.cjs');
28
+ require('../directive-8278ab14.cjs');
29
+ require('../style-map-3b9af808.cjs');
30
+ require('../directive-helpers-01f1c3b1.cjs');
30
31
 
31
32
 
32
33
 
@@ -17,9 +17,10 @@ export { LuksoTerms } from './lukso-terms/index.js';
17
17
  export { LuksoTest } from './lukso-test/index.js';
18
18
  export { LuksoUsername } from './lukso-username/index.js';
19
19
  export { LuksoWizard } from './lukso-wizard/index.js';
20
- export { a as TailwindElement, T as TailwindStyledElement } from '../index-9dfdafd2.js';
21
- import '../directive-9ec64c08.js';
22
- import '../state-7fde94d1.js';
23
- import '../index-714323c9.js';
24
- import '../style-map-5173bb70.js';
25
- import '../directive-helpers-1affe406.js';
20
+ export { a as TailwindElement, T as TailwindStyledElement } from '../index-ed87f41b.js';
21
+ import '../query-assigned-elements-e36df787.js';
22
+ import '../state-02a92ffa.js';
23
+ import '../index-5e194caf.js';
24
+ import '../directive-2bb7789e.js';
25
+ import '../style-map-5daca6c4.js';
26
+ import '../directive-helpers-8f79cbe5.js';
@@ -2,10 +2,11 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
 
5
- const shared_tailwindElement_index = require('../../index-e765f94b.cjs');
6
- const directive = require('../../directive-db00f5fb.cjs');
7
- const state = require('../../state-a62a7d5d.cjs');
8
- const index = require('../../index-7dc05ee5.cjs');
5
+ const shared_tailwindElement_index = require('../../index-930f6cf2.cjs');
6
+ const queryAssignedElements = require('../../query-assigned-elements-5200f974.cjs');
7
+ const state = require('../../state-51b50a6b.cjs');
8
+ const index = require('../../index-e9668573.cjs');
9
+ require('../../directive-8278ab14.cjs');
9
10
 
10
11
  const style = ":host {\n\n display: inline-flex\n}\n\n:host([is-full-width]) {\n\n display: flex;\n\n width: 100%\n}";
11
12
 
@@ -183,49 +184,49 @@ exports.LuksoButton = class LuksoButton extends shared_tailwindElement_index.Tai
183
184
  }
184
185
  };
185
186
  __decorateClass([
186
- directive.e({ type: String })
187
+ queryAssignedElements.e({ type: String })
187
188
  ], exports.LuksoButton.prototype, "variant", 2);
188
189
  __decorateClass([
189
- directive.e({ type: String })
190
+ queryAssignedElements.e({ type: String })
190
191
  ], exports.LuksoButton.prototype, "size", 2);
191
192
  __decorateClass([
192
- directive.e({ type: Boolean })
193
+ queryAssignedElements.e({ type: Boolean })
193
194
  ], exports.LuksoButton.prototype, "disabled", 2);
194
195
  __decorateClass([
195
- directive.e({ type: Boolean, attribute: "is-full-width" })
196
+ queryAssignedElements.e({ type: Boolean, attribute: "is-full-width" })
196
197
  ], exports.LuksoButton.prototype, "isFullWidth", 2);
197
198
  __decorateClass([
198
- directive.e({ type: Boolean, attribute: "is-long-press" })
199
+ queryAssignedElements.e({ type: Boolean, attribute: "is-long-press" })
199
200
  ], exports.LuksoButton.prototype, "isLongPress", 2);
200
201
  __decorateClass([
201
- directive.e({ type: Boolean, attribute: "is-link" })
202
+ queryAssignedElements.e({ type: Boolean, attribute: "is-link" })
202
203
  ], exports.LuksoButton.prototype, "isLink", 2);
203
204
  __decorateClass([
204
- directive.e({ type: Boolean, attribute: "is-loading" })
205
+ queryAssignedElements.e({ type: Boolean, attribute: "is-loading" })
205
206
  ], exports.LuksoButton.prototype, "isLoading", 2);
206
207
  __decorateClass([
207
- directive.e({ type: String })
208
+ queryAssignedElements.e({ type: String })
208
209
  ], exports.LuksoButton.prototype, "type", 2);
209
210
  __decorateClass([
210
- directive.e({ type: String })
211
+ queryAssignedElements.e({ type: String })
211
212
  ], exports.LuksoButton.prototype, "href", 2);
212
213
  __decorateClass([
213
- directive.e({ type: String })
214
+ queryAssignedElements.e({ type: String })
214
215
  ], exports.LuksoButton.prototype, "target", 2);
215
216
  __decorateClass([
216
- directive.e({ type: String })
217
+ queryAssignedElements.e({ type: String })
217
218
  ], exports.LuksoButton.prototype, "rel", 2);
218
219
  __decorateClass([
219
- directive.e({ type: String, attribute: "loading-text" })
220
+ queryAssignedElements.e({ type: String, attribute: "loading-text" })
220
221
  ], exports.LuksoButton.prototype, "loadingText", 2);
221
222
  __decorateClass([
222
- directive.e({ type: String, attribute: "custom-class" })
223
+ queryAssignedElements.e({ type: String, attribute: "custom-class" })
223
224
  ], exports.LuksoButton.prototype, "customClass", 2);
224
225
  __decorateClass([
225
- directive.e({ type: Boolean, attribute: "is-active" })
226
+ queryAssignedElements.e({ type: Boolean, attribute: "is-active" })
226
227
  ], exports.LuksoButton.prototype, "isActive", 2);
227
228
  __decorateClass([
228
- directive.e({ type: Number })
229
+ queryAssignedElements.e({ type: Number })
229
230
  ], exports.LuksoButton.prototype, "count", 2);
230
231
  __decorateClass([
231
232
  state.t()
@@ -237,5 +238,5 @@ __decorateClass([
237
238
  state.t()
238
239
  ], exports.LuksoButton.prototype, "timer", 2);
239
240
  exports.LuksoButton = __decorateClass([
240
- directive.e$1("lukso-button")
241
+ queryAssignedElements.e$1("lukso-button")
241
242
  ], exports.LuksoButton);
@@ -1,7 +1,8 @@
1
- import { T as TailwindStyledElement, x } from '../../index-9dfdafd2.js';
2
- import { e, a as e$1 } from '../../directive-9ec64c08.js';
3
- import { t } from '../../state-7fde94d1.js';
4
- import { c as customClassMap } from '../../index-714323c9.js';
1
+ import { T as TailwindStyledElement, x } from '../../index-ed87f41b.js';
2
+ import { e, a as e$1 } from '../../query-assigned-elements-e36df787.js';
3
+ import { t } from '../../state-02a92ffa.js';
4
+ import { c as customClassMap } from '../../index-5e194caf.js';
5
+ import '../../directive-2bb7789e.js';
5
6
 
6
7
  const style = ":host {\n\n display: inline-flex\n}\n\n:host([is-full-width]) {\n\n display: flex;\n\n width: 100%\n}";
7
8
 
@@ -2,11 +2,12 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
 
5
- const shared_tailwindElement_index = require('../../index-e765f94b.cjs');
6
- const directive = require('../../directive-db00f5fb.cjs');
7
- const styleMap = require('../../style-map-3a049df9.cjs');
8
- const index = require('../../index-7dc05ee5.cjs');
5
+ const shared_tailwindElement_index = require('../../index-930f6cf2.cjs');
6
+ const queryAssignedElements = require('../../query-assigned-elements-5200f974.cjs');
7
+ const styleMap = require('../../style-map-3b9af808.cjs');
8
+ const index = require('../../index-e9668573.cjs');
9
9
  require('../lukso-profile/index.cjs');
10
+ require('../../directive-8278ab14.cjs');
10
11
 
11
12
  const style = ":host {\n display: flex;\n width: 100%;\n}\n\n:host([is-fixed-width]) {\n width: inherit;\n}";
12
13
 
@@ -279,32 +280,32 @@ exports.LuksoCard = class LuksoCard extends shared_tailwindElement_index.Tailwin
279
280
  }
280
281
  };
281
282
  __decorateClass([
282
- directive.e({ type: String })
283
+ queryAssignedElements.e({ type: String })
283
284
  ], exports.LuksoCard.prototype, "variant", 2);
284
285
  __decorateClass([
285
- directive.e({ type: String, attribute: "background-url" })
286
+ queryAssignedElements.e({ type: String, attribute: "background-url" })
286
287
  ], exports.LuksoCard.prototype, "backgroundUrl", 2);
287
288
  __decorateClass([
288
- directive.e({ type: String, attribute: "profile-url" })
289
+ queryAssignedElements.e({ type: String, attribute: "profile-url" })
289
290
  ], exports.LuksoCard.prototype, "profileUrl", 2);
290
291
  __decorateClass([
291
- directive.e({ type: String, attribute: "profile-address" })
292
+ queryAssignedElements.e({ type: String, attribute: "profile-address" })
292
293
  ], exports.LuksoCard.prototype, "profileAddress", 2);
293
294
  __decorateClass([
294
- directive.e({ type: Boolean, attribute: "is-fixed-width" })
295
+ queryAssignedElements.e({ type: Boolean, attribute: "is-fixed-width" })
295
296
  ], exports.LuksoCard.prototype, "isFixedWidth", 2);
296
297
  __decorateClass([
297
- directive.e({ type: Boolean, attribute: "is-fixed-height" })
298
+ queryAssignedElements.e({ type: Boolean, attribute: "is-fixed-height" })
298
299
  ], exports.LuksoCard.prototype, "isFixedHeight", 2);
299
300
  __decorateClass([
300
- directive.e({ type: String, attribute: "custom-class" })
301
+ queryAssignedElements.e({ type: String, attribute: "custom-class" })
301
302
  ], exports.LuksoCard.prototype, "customClass", 2);
302
303
  __decorateClass([
303
- directive.e({ type: String })
304
+ queryAssignedElements.e({ type: String })
304
305
  ], exports.LuksoCard.prototype, "size", 2);
305
306
  __decorateClass([
306
- directive.e({ type: Boolean, attribute: "is-hoverable" })
307
+ queryAssignedElements.e({ type: Boolean, attribute: "is-hoverable" })
307
308
  ], exports.LuksoCard.prototype, "isHoverable", 2);
308
309
  exports.LuksoCard = __decorateClass([
309
- directive.e$1("lukso-card")
310
+ queryAssignedElements.e$1("lukso-card")
310
311
  ], exports.LuksoCard);
@@ -1,8 +1,9 @@
1
- import { T as TailwindStyledElement, x } from '../../index-9dfdafd2.js';
2
- import { e, a as e$1 } from '../../directive-9ec64c08.js';
3
- import { o } from '../../style-map-5173bb70.js';
4
- import { c as customClassMap } from '../../index-714323c9.js';
1
+ import { T as TailwindStyledElement, x } from '../../index-ed87f41b.js';
2
+ import { e, a as e$1 } from '../../query-assigned-elements-e36df787.js';
3
+ import { o } from '../../style-map-5daca6c4.js';
4
+ import { c as customClassMap } from '../../index-5e194caf.js';
5
5
  import '../lukso-profile/index.js';
6
+ import '../../directive-2bb7789e.js';
6
7
 
7
8
  const style = ":host {\n display: flex;\n width: 100%;\n}\n\n:host([is-fixed-width]) {\n width: inherit;\n}";
8
9
 
@@ -2,10 +2,11 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
 
5
- const shared_tailwindElement_index = require('../../index-e765f94b.cjs');
6
- const directive = require('../../directive-db00f5fb.cjs');
7
- const state = require('../../state-a62a7d5d.cjs');
8
- const index = require('../../index-7dc05ee5.cjs');
5
+ const shared_tailwindElement_index = require('../../index-930f6cf2.cjs');
6
+ const queryAssignedElements = require('../../query-assigned-elements-5200f974.cjs');
7
+ const state = require('../../state-51b50a6b.cjs');
8
+ const index = require('../../index-e9668573.cjs');
9
+ require('../../directive-8278ab14.cjs');
9
10
 
10
11
  var __defProp = Object.defineProperty;
11
12
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -177,34 +178,34 @@ exports.LuksoCheckbox = class LuksoCheckbox extends shared_tailwindElement_index
177
178
  }
178
179
  };
179
180
  __decorateClass([
180
- directive.e({ type: String })
181
+ queryAssignedElements.e({ type: String })
181
182
  ], exports.LuksoCheckbox.prototype, "name", 2);
182
183
  __decorateClass([
183
- directive.e({ type: String })
184
+ queryAssignedElements.e({ type: String })
184
185
  ], exports.LuksoCheckbox.prototype, "id", 2);
185
186
  __decorateClass([
186
- directive.e({ type: String })
187
+ queryAssignedElements.e({ type: String })
187
188
  ], exports.LuksoCheckbox.prototype, "ref", 2);
188
189
  __decorateClass([
189
- directive.e({ type: String })
190
+ queryAssignedElements.e({ type: String })
190
191
  ], exports.LuksoCheckbox.prototype, "type", 2);
191
192
  __decorateClass([
192
- directive.e({ type: String })
193
+ queryAssignedElements.e({ type: String })
193
194
  ], exports.LuksoCheckbox.prototype, "size", 2);
194
195
  __decorateClass([
195
- directive.e({ type: String })
196
+ queryAssignedElements.e({ type: String })
196
197
  ], exports.LuksoCheckbox.prototype, "error", 2);
197
198
  __decorateClass([
198
- directive.e({ type: Boolean })
199
+ queryAssignedElements.e({ type: Boolean })
199
200
  ], exports.LuksoCheckbox.prototype, "checked", 2);
200
201
  __decorateClass([
201
- directive.e({ type: String, attribute: "custom-class" })
202
+ queryAssignedElements.e({ type: String, attribute: "custom-class" })
202
203
  ], exports.LuksoCheckbox.prototype, "customClass", 2);
203
204
  __decorateClass([
204
- directive.e({ type: Boolean, attribute: "is-readonly" })
205
+ queryAssignedElements.e({ type: Boolean, attribute: "is-readonly" })
205
206
  ], exports.LuksoCheckbox.prototype, "isReadonly", 2);
206
207
  __decorateClass([
207
- directive.e({ type: Boolean, attribute: "is-disabled" })
208
+ queryAssignedElements.e({ type: Boolean, attribute: "is-disabled" })
208
209
  ], exports.LuksoCheckbox.prototype, "isDisabled", 2);
209
210
  __decorateClass([
210
211
  state.t()
@@ -213,5 +214,5 @@ __decorateClass([
213
214
  state.t()
214
215
  ], exports.LuksoCheckbox.prototype, "hasHighlight", 2);
215
216
  exports.LuksoCheckbox = __decorateClass([
216
- directive.e$1("lukso-checkbox")
217
+ queryAssignedElements.e$1("lukso-checkbox")
217
218
  ], exports.LuksoCheckbox);
@@ -1,7 +1,8 @@
1
- import { a as TailwindElement, x, A } from '../../index-9dfdafd2.js';
2
- import { e, a as e$1 } from '../../directive-9ec64c08.js';
3
- import { t } from '../../state-7fde94d1.js';
4
- import { c as customClassMap } from '../../index-714323c9.js';
1
+ import { a as TailwindElement, x, A } from '../../index-ed87f41b.js';
2
+ import { e, a as e$1 } from '../../query-assigned-elements-e36df787.js';
3
+ import { t } from '../../state-02a92ffa.js';
4
+ import { c as customClassMap } from '../../index-5e194caf.js';
5
+ import '../../directive-2bb7789e.js';
5
6
 
6
7
  var __defProp = Object.defineProperty;
7
8
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -2,10 +2,9 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
 
5
- const shared_tailwindElement_index = require('../../index-e765f94b.cjs');
6
- const directive = require('../../directive-db00f5fb.cjs');
5
+ const shared_tailwindElement_index = require('../../index-930f6cf2.cjs');
6
+ const queryAssignedElements = require('../../query-assigned-elements-5200f974.cjs');
7
7
  require('../lukso-share/index.cjs');
8
- require('../../index-7dc05ee5.cjs');
9
8
 
10
9
  var __defProp = Object.defineProperty;
11
10
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -19,40 +18,53 @@ var __decorateClass = (decorators, target, key, kind) => {
19
18
  return result;
20
19
  };
21
20
  exports.LuksoFooter = class LuksoFooter extends shared_tailwindElement_index.TailwindElement {
21
+ constructor() {
22
+ super(...arguments);
23
+ this.providers = [
24
+ "twitter",
25
+ "instagram",
26
+ "linkedin",
27
+ "telegram",
28
+ "discord",
29
+ "reddit",
30
+ "medium",
31
+ "github"
32
+ ];
33
+ }
22
34
  render() {
23
35
  return shared_tailwindElement_index.x`
24
36
  <footer class="bg-neutral-100">
25
37
  <div
26
- class="p-10 grid gap-12 items-center lg:grid-cols-[auto,max-content]"
27
- >
28
- <slot name="top"></slot>
29
- <div className="flex lg:justify-end">
30
- <lukso-share></lukso-share>
31
- </div>
32
- </div>
33
- <div
34
- class="grid sm:grid-cols-[max-content,auto] px-10 py-6 bg-neutral-95 gap-8"
38
+ class="p-10 grid gap-8 items-center lg:grid-cols-[auto,max-content]"
35
39
  >
36
- <slot name="bottom"></slot>
37
- <div class="flex sm:justify-end">
38
- <a
39
- href="https://lukso.network/"
40
- target="_blank"
41
- class="sm:text-right opacity-50 text-neutral-30"
42
- >
43
- <span class="paragraph-inter-10-semi-bold">Powered by</span>
44
- <img
45
- src="/assets/images/lukso-logo.svg"
46
- alt="LUKSO"
47
- class="h-4"
48
- />
49
- </a>
40
+ <slot name="links"></slot>
41
+ <div class="flex sm:justify-between gap-4 flex-col sm:flex-row">
42
+ <lukso-share
43
+ providers=${JSON.stringify(this.providers)}
44
+ ></lukso-share>
45
+ <div class="flex sm:ml-8 sm:justify-end">
46
+ <a
47
+ href="https://lukso.network/"
48
+ target="_blank"
49
+ class="flex flex-col opacity-50 text-neutral-30 transition-opacity hover:opacity-80 sm:text-right"
50
+ >
51
+ <span class="paragraph-inter-10-semi-bold">Powered by</span>
52
+ <img
53
+ src="/assets/images/lukso-logo.svg"
54
+ alt="LUKSO"
55
+ class="h-4"
56
+ />
57
+ </a>
58
+ </div>
50
59
  </div>
51
60
  </div>
52
61
  </footer>
53
62
  `;
54
63
  }
55
64
  };
65
+ __decorateClass([
66
+ queryAssignedElements.e({ type: Array })
67
+ ], exports.LuksoFooter.prototype, "providers", 2);
56
68
  exports.LuksoFooter = __decorateClass([
57
- directive.e$1("lukso-footer")
69
+ queryAssignedElements.e$1("lukso-footer")
58
70
  ], exports.LuksoFooter);
@@ -1,5 +1,7 @@
1
1
  import { TailwindElement } from '../../shared/tailwind-element';
2
+ import { Provider } from '../../components/lukso-share';
2
3
  export declare class LuksoFooter extends TailwindElement {
4
+ providers: Provider[];
3
5
  render(): import("lit").TemplateResult<1>;
4
6
  }
5
7
  declare global {
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-footer/index.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAA;AAC3D,OAAO,0BAA0B,CAAA;AAEjC,qBACa,WAAY,SAAQ,eAAe;IAC9C,MAAM;CAiCP;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-footer/index.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAA;AAC3D,OAAO,0BAA0B,CAAA;AACjC,OAAO,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAA;AAEnD,qBACa,WAAY,SAAQ,eAAe;IAE9C,SAAS,EAAE,QAAQ,EAAE,CASpB;IAED,MAAM;CA8BP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,WAAW,CAAA;KAC5B;CACF"}
@@ -1,7 +1,6 @@
1
- import { a as TailwindElement, x } from '../../index-9dfdafd2.js';
2
- import { a as e } from '../../directive-9ec64c08.js';
1
+ import { a as TailwindElement, x } from '../../index-ed87f41b.js';
2
+ import { e, a as e$1 } from '../../query-assigned-elements-e36df787.js';
3
3
  import '../lukso-share/index.js';
4
- import '../../index-714323c9.js';
5
4
 
6
5
  var __defProp = Object.defineProperty;
7
6
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -15,42 +14,55 @@ var __decorateClass = (decorators, target, key, kind) => {
15
14
  return result;
16
15
  };
17
16
  let LuksoFooter = class extends TailwindElement {
17
+ constructor() {
18
+ super(...arguments);
19
+ this.providers = [
20
+ "twitter",
21
+ "instagram",
22
+ "linkedin",
23
+ "telegram",
24
+ "discord",
25
+ "reddit",
26
+ "medium",
27
+ "github"
28
+ ];
29
+ }
18
30
  render() {
19
31
  return x`
20
32
  <footer class="bg-neutral-100">
21
33
  <div
22
- class="p-10 grid gap-12 items-center lg:grid-cols-[auto,max-content]"
23
- >
24
- <slot name="top"></slot>
25
- <div className="flex lg:justify-end">
26
- <lukso-share></lukso-share>
27
- </div>
28
- </div>
29
- <div
30
- class="grid sm:grid-cols-[max-content,auto] px-10 py-6 bg-neutral-95 gap-8"
34
+ class="p-10 grid gap-8 items-center lg:grid-cols-[auto,max-content]"
31
35
  >
32
- <slot name="bottom"></slot>
33
- <div class="flex sm:justify-end">
34
- <a
35
- href="https://lukso.network/"
36
- target="_blank"
37
- class="sm:text-right opacity-50 text-neutral-30"
38
- >
39
- <span class="paragraph-inter-10-semi-bold">Powered by</span>
40
- <img
41
- src="/assets/images/lukso-logo.svg"
42
- alt="LUKSO"
43
- class="h-4"
44
- />
45
- </a>
36
+ <slot name="links"></slot>
37
+ <div class="flex sm:justify-between gap-4 flex-col sm:flex-row">
38
+ <lukso-share
39
+ providers=${JSON.stringify(this.providers)}
40
+ ></lukso-share>
41
+ <div class="flex sm:ml-8 sm:justify-end">
42
+ <a
43
+ href="https://lukso.network/"
44
+ target="_blank"
45
+ class="flex flex-col opacity-50 text-neutral-30 transition-opacity hover:opacity-80 sm:text-right"
46
+ >
47
+ <span class="paragraph-inter-10-semi-bold">Powered by</span>
48
+ <img
49
+ src="/assets/images/lukso-logo.svg"
50
+ alt="LUKSO"
51
+ class="h-4"
52
+ />
53
+ </a>
54
+ </div>
46
55
  </div>
47
56
  </div>
48
57
  </footer>
49
58
  `;
50
59
  }
51
60
  };
61
+ __decorateClass([
62
+ e({ type: Array })
63
+ ], LuksoFooter.prototype, "providers", 2);
52
64
  LuksoFooter = __decorateClass([
53
- e("lukso-footer")
65
+ e$1("lukso-footer")
54
66
  ], LuksoFooter);
55
67
 
56
68
  export { LuksoFooter };
@@ -4,4 +4,6 @@ declare const meta: Meta;
4
4
  export default meta;
5
5
  /** Example of default footer. */
6
6
  export declare const DefaultFooter: any;
7
+ /** With `providers` attribute pick only providers that you want, you can also control order this way. Use `JSON.stringify` to encode `array`. */
8
+ export declare const LimitProviders: any;
7
9
  //# sourceMappingURL=lukso-footer.stories.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"lukso-footer.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-footer/lukso-footer.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAA;AAEhD,OAAO,SAAS,CAAA;AAEhB,8HAA8H;AAC9H,QAAA,MAAM,IAAI,EAAE,IAcX,CAAA;AAED,eAAe,IAAI,CAAA;AAiCnB,kCAAkC;AAClC,eAAO,MAAM,aAAa,KAAoB,CAAA"}
1
+ {"version":3,"file":"lukso-footer.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-footer/lukso-footer.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAA;AAEhD,OAAO,SAAS,CAAA;AAEhB,8HAA8H;AAC9H,QAAA,MAAM,IAAI,EAAE,IAyBX,CAAA;AAED,eAAe,IAAI,CAAA;AAiDnB,kCAAkC;AAClC,eAAO,MAAM,aAAa,KAAoB,CAAA;AAE9C,iJAAiJ;AACjJ,eAAO,MAAM,cAAc,KAAoB,CAAA"}
@@ -2,9 +2,10 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
 
5
- const shared_tailwindElement_index = require('../../index-e765f94b.cjs');
6
- const directive = require('../../directive-db00f5fb.cjs');
7
- const styleMap = require('../../style-map-3a049df9.cjs');
5
+ const shared_tailwindElement_index = require('../../index-930f6cf2.cjs');
6
+ const queryAssignedElements = require('../../query-assigned-elements-5200f974.cjs');
7
+ const styleMap = require('../../style-map-3b9af808.cjs');
8
+ require('../../directive-8278ab14.cjs');
8
9
 
9
10
  const style = ":host {\n display: inline-flex\n}";
10
11
 
@@ -4802,17 +4803,17 @@ exports.LuksoIcon = class LuksoIcon extends shared_tailwindElement_index.Tailwin
4802
4803
  }
4803
4804
  };
4804
4805
  __decorateClass([
4805
- directive.e({ type: String })
4806
+ queryAssignedElements.e({ type: String })
4806
4807
  ], exports.LuksoIcon.prototype, "name", 2);
4807
4808
  __decorateClass([
4808
- directive.e({ type: String })
4809
+ queryAssignedElements.e({ type: String })
4809
4810
  ], exports.LuksoIcon.prototype, "size", 2);
4810
4811
  __decorateClass([
4811
- directive.e({ type: String })
4812
+ queryAssignedElements.e({ type: String })
4812
4813
  ], exports.LuksoIcon.prototype, "color", 2);
4813
4814
  __decorateClass([
4814
- directive.e({ type: String, attribute: "secondary-color" })
4815
+ queryAssignedElements.e({ type: String, attribute: "secondary-color" })
4815
4816
  ], exports.LuksoIcon.prototype, "secondaryColor", 2);
4816
4817
  exports.LuksoIcon = __decorateClass([
4817
- directive.e$1("lukso-icon")
4818
+ queryAssignedElements.e$1("lukso-icon")
4818
4819
  ], exports.LuksoIcon);
@@ -1,6 +1,7 @@
1
- import { x, T as TailwindStyledElement } from '../../index-9dfdafd2.js';
2
- import { e, a as e$1 } from '../../directive-9ec64c08.js';
3
- import { o } from '../../style-map-5173bb70.js';
1
+ import { x, T as TailwindStyledElement } from '../../index-ed87f41b.js';
2
+ import { e, a as e$1 } from '../../query-assigned-elements-e36df787.js';
3
+ import { o } from '../../style-map-5daca6c4.js';
4
+ import '../../directive-2bb7789e.js';
4
5
 
5
6
  const style = ":host {\n display: inline-flex\n}";
6
7