@ebrains/react 0.9.1-beta → 0.9.2-beta

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 (179) hide show
  1. package/.babelrc +12 -0
  2. package/package.json +2 -6
  3. package/project.json +10 -0
  4. package/rollup.config.js +43 -0
  5. package/src/components.ts +49 -0
  6. package/src/generated/components.ts +47 -0
  7. package/src/generated/react-component-lib/attachProps.ts +125 -0
  8. package/src/generated/react-component-lib/case.ts +7 -0
  9. package/src/generated/react-component-lib/createComponent.tsx +106 -0
  10. package/src/generated/react-component-lib/createOverlayComponent.tsx +142 -0
  11. package/src/generated/react-component-lib/dev.ts +14 -0
  12. package/src/generated/react-component-lib/index.tsx +50 -0
  13. package/src/generated/react-component-lib/interfaces.ts +34 -0
  14. package/src/generated/react-component-lib/utils/attachProps.ts +125 -0
  15. package/src/generated/react-component-lib/utils/case.ts +7 -0
  16. package/src/generated/react-component-lib/utils/dev.ts +14 -0
  17. package/src/generated/react-component-lib/utils/index.tsx +50 -0
  18. package/src/react-component-lib/attachProps.ts +125 -0
  19. package/src/react-component-lib/case.ts +7 -0
  20. package/src/react-component-lib/createComponent.tsx +106 -0
  21. package/src/react-component-lib/createOverlayComponent.tsx +142 -0
  22. package/src/react-component-lib/dev.ts +14 -0
  23. package/src/react-component-lib/index.tsx +50 -0
  24. package/src/react-component-lib/interfaces.ts +34 -0
  25. package/src/react-component-lib/utils/attachProps.ts +125 -0
  26. package/src/react-component-lib/utils/case.ts +7 -0
  27. package/src/react-component-lib/utils/index.tsx +50 -0
  28. package/tsconfig.json +17 -0
  29. package/tsconfig.lib.json +23 -0
  30. package/analytics-44b1416b.esm.js +0 -55
  31. package/arrow-diagonal-black-8f0494c3.esm.js +0 -3
  32. package/arrow-right-9322ba8a.esm.js +0 -5
  33. package/bluesky-cc5edd2d.esm.js +0 -14
  34. package/bookmark-c200037c.esm.js +0 -16
  35. package/chevron-down-6144c823.esm.js +0 -12
  36. package/chevron-left-ca6c66e1.esm.js +0 -11
  37. package/chevron-right-b88ed2d4.esm.js +0 -5
  38. package/chevron-up-c66bd477.esm.js +0 -12
  39. package/close-87fc0d63.esm.js +0 -5
  40. package/color-2554aad6.esm.js +0 -122
  41. package/color-primary-palette_6.entry.esm.js +0 -778
  42. package/components-section.entry.esm.js +0 -165
  43. package/copy-03b72cb6.esm.js +0 -5
  44. package/correct-use-of-colors.entry.esm.js +0 -243
  45. package/docs-palettes.entry.esm.js +0 -29
  46. package/docs-tokens.entry.esm.js +0 -45
  47. package/eds-accordion.entry.esm.js +0 -132
  48. package/eds-alert.entry.esm.js +0 -112
  49. package/eds-app-root.entry.esm.js +0 -53
  50. package/eds-avatar_26.entry.esm.js +0 -306
  51. package/eds-card-desc_2.entry.esm.js +0 -86
  52. package/eds-card-generic.entry.esm.js +0 -114
  53. package/eds-card-project.entry.esm.js +0 -93
  54. package/eds-card-section.entry.esm.js +0 -56
  55. package/eds-card-tags.entry.esm.js +0 -27
  56. package/eds-card-tool.entry.esm.js +0 -105
  57. package/eds-card-wrapper.entry.esm.js +0 -39
  58. package/eds-code-block.entry.esm.js +0 -2290
  59. package/eds-cookies-preference.entry.esm.js +0 -47
  60. package/eds-feedback.entry.esm.js +0 -82
  61. package/eds-frame.entry.esm.js +0 -112
  62. package/eds-icon-arrow-diagonal.entry.esm.js +0 -21
  63. package/eds-icon-arrow-right.entry.esm.js +0 -21
  64. package/eds-icon-bluesky.entry.esm.js +0 -21
  65. package/eds-icon-bookmark.entry.esm.js +0 -21
  66. package/eds-icon-chevron-down.entry.esm.js +0 -21
  67. package/eds-icon-chevron-left.entry.esm.js +0 -21
  68. package/eds-icon-chevron-right.entry.esm.js +0 -21
  69. package/eds-icon-chevron-up.entry.esm.js +0 -21
  70. package/eds-icon-close.entry.esm.js +0 -21
  71. package/eds-icon-copy.entry.esm.js +0 -21
  72. package/eds-icon-eu.entry.esm.js +0 -21
  73. package/eds-icon-external.entry.esm.js +0 -21
  74. package/eds-icon-facebook.entry.esm.js +0 -21
  75. package/eds-icon-gitlab.entry.esm.js +0 -21
  76. package/eds-icon-linkedin.entry.esm.js +0 -21
  77. package/eds-icon-loader.entry.esm.js +0 -21
  78. package/eds-icon-mastodon.entry.esm.js +0 -21
  79. package/eds-icon-menu.entry.esm.js +0 -21
  80. package/eds-icon-minus.entry.esm.js +0 -21
  81. package/eds-icon-more.entry.esm.js +0 -21
  82. package/eds-icon-paper.entry.esm.js +0 -21
  83. package/eds-icon-plus.entry.esm.js +0 -21
  84. package/eds-icon-portal.entry.esm.js +0 -21
  85. package/eds-icon-private.entry.esm.js +0 -21
  86. package/eds-icon-public.entry.esm.js +0 -21
  87. package/eds-icon-search.entry.esm.js +0 -21
  88. package/eds-icon-star.entry.esm.js +0 -21
  89. package/eds-icon-success.entry.esm.js +0 -21
  90. package/eds-icon-thumbs-down.entry.esm.js +0 -21
  91. package/eds-icon-thumbs-up.entry.esm.js +0 -21
  92. package/eds-icon-tutorial.entry.esm.js +0 -21
  93. package/eds-icon-twitter.entry.esm.js +0 -21
  94. package/eds-icon-unknown.entry.esm.js +0 -21
  95. package/eds-icon-updown.entry.esm.js +0 -21
  96. package/eds-icon-user.entry.esm.js +0 -21
  97. package/eds-icon-youtube.entry.esm.js +0 -21
  98. package/eds-login_2.entry.esm.js +0 -1828
  99. package/eds-matomo-notice.entry.esm.js +0 -162
  100. package/eds-modal.entry.esm.js +0 -142
  101. package/eds-pagination_2.entry.esm.js +0 -493
  102. package/eds-progress-bar.entry.esm.js +0 -41
  103. package/eds-rating.entry.esm.js +0 -79
  104. package/eds-section-core_2.entry.esm.js +0 -69
  105. package/eds-spinner.entry.esm.js +0 -67
  106. package/eds-switch.entry.esm.js +0 -58
  107. package/eds-tabs.entry.esm.js +0 -143
  108. package/eds-timeline.entry.esm.js +0 -117
  109. package/eds-toast-manager.entry.esm.js +0 -62
  110. package/eds-toast.entry.esm.js +0 -92
  111. package/eds-tooltip.entry.esm.js +0 -125
  112. package/eds-trl.entry.esm.js +0 -68
  113. package/eu-9ddde93a.esm.js +0 -30
  114. package/facebook-9cb5c17f.esm.js +0 -14
  115. package/incorrect-use-of-colors.entry.esm.js +0 -71
  116. package/index-39c58238.esm.js +0 -58
  117. package/index.esm.d.ts +0 -1
  118. package/index.esm.js +0 -4
  119. package/index.esm2.js +0 -4836
  120. package/linkedin-e8650abb.esm.js +0 -28
  121. package/loader-c9628637.esm.js +0 -30
  122. package/logo-color-7f1fd803.esm.js +0 -115
  123. package/logo-color-margins-ff8ce71b.esm.js +0 -118
  124. package/logo-space.entry.esm.js +0 -48
  125. package/logo-variations-horizontal_2.entry.esm.js +0 -123
  126. package/logo-variations-tabs.entry.esm.js +0 -29
  127. package/logo-white-no-bg-f382f86f.esm.js +0 -1021
  128. package/logo-wrong-usage.entry.esm.js +0 -101
  129. package/mastodon-3703ec61.esm.js +0 -14
  130. package/menu-340ea948.esm.js +0 -11
  131. package/minus-b30a7c71.esm.js +0 -11
  132. package/mono-53f70232.esm.js +0 -11
  133. package/more-4449d549.esm.js +0 -13
  134. package/paper-8e74ea31.esm.js +0 -15
  135. package/plus-89c07be2.esm.js +0 -12
  136. package/portal-d6c8ce56.esm.js +0 -18
  137. package/private-1c25ff8e.esm.js +0 -25
  138. package/public-d4d8c585.esm.js +0 -16
  139. package/search-fbcd79c2.esm.js +0 -12
  140. package/sharedUtils-a550989c.esm.js +0 -17
  141. package/src/components.d.ts +0 -40
  142. package/src/generated/components.d.ts +0 -38
  143. package/src/generated/react-component-lib/attachProps.d.ts +0 -16
  144. package/src/generated/react-component-lib/case.d.ts +0 -2
  145. package/src/generated/react-component-lib/createComponent.d.ts +0 -10
  146. package/src/generated/react-component-lib/createOverlayComponent.d.ts +0 -21
  147. package/src/generated/react-component-lib/dev.d.ts +0 -2
  148. package/src/generated/react-component-lib/interfaces.d.ts +0 -29
  149. package/src/generated/react-component-lib/utils/attachProps.d.ts +0 -16
  150. package/src/generated/react-component-lib/utils/case.d.ts +0 -2
  151. package/src/generated/react-component-lib/utils/dev.d.ts +0 -2
  152. package/src/generated/react-component-lib/utils/index.d.ts +0 -10
  153. package/src/react-component-lib/attachProps.d.ts +0 -16
  154. package/src/react-component-lib/case.d.ts +0 -2
  155. package/src/react-component-lib/createComponent.d.ts +0 -10
  156. package/src/react-component-lib/createOverlayComponent.d.ts +0 -21
  157. package/src/react-component-lib/dev.d.ts +0 -2
  158. package/src/react-component-lib/interfaces.d.ts +0 -29
  159. package/src/react-component-lib/utils/attachProps.d.ts +0 -16
  160. package/src/react-component-lib/utils/case.d.ts +0 -2
  161. package/src/react-component-lib/utils/index.d.ts +0 -10
  162. package/star-0da9b5e9.esm.js +0 -5
  163. package/success-443809da.esm.js +0 -18
  164. package/svg-repository.entry.esm.js +0 -337
  165. package/thumbs-down-a18fd049.esm.js +0 -5
  166. package/thumbs-up-c19a71bc.esm.js +0 -6
  167. package/toastManager-d9eee791.esm.js +0 -34
  168. package/token-list_3.entry.esm.js +0 -385
  169. package/token-ratios.entry.esm.js +0 -49
  170. package/token-typography.entry.esm.js +0 -267
  171. package/tutotial-150ee1fd.esm.js +0 -27
  172. package/twitter-ac21b505.esm.js +0 -14
  173. package/unknown-ed01a24c.esm.js +0 -22
  174. package/up-and-down-d747abee.esm.js +0 -12
  175. package/user-71ebdc15.esm.js +0 -16
  176. package/youtube-efbfbdc4.esm.js +0 -14
  177. /package/src/generated/react-component-lib/{index.d.ts → index.ts} +0 -0
  178. /package/src/{index.d.ts → index.ts} +0 -0
  179. /package/src/react-component-lib/{index.d.ts → index.ts} +0 -0
@@ -1,86 +0,0 @@
1
- import { r as registerInstance, h } from './index.esm2.js';
2
- import 'react';
3
- import 'react/jsx-runtime';
4
- import 'react-dom';
5
-
6
- const edsCardDescCss = ".f-ui-02-light{font-family:var(--f-ui-02-light-fontFamily);font-weight:var(--f-ui-02-light-fontWeight);font-size:var(--f-ui-02-light-fontSize);line-height:var(--f-ui-02-light-lineHeight);letter-spacing:var(--f-ui-02-light-letterSpacing)}.f-ui-03-light{font-family:var(--f-ui-03-light-fontFamily);font-weight:var(--f-ui-03-light-fontWeight);font-size:var(--f-ui-03-light-fontSize);line-height:var(--f-ui-03-light-lineHeight);letter-spacing:var(--f-ui-03-light-letterSpacing)}.text-light{color:var(--grey-700)}.line-clamp-1{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.line-clamp-3{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3}.line-clamp-4{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4}";
7
- const EdsCardDescStyle0 = edsCardDescCss;
8
- const EdsCardDesc = class {
9
- constructor(hostRef) {
10
- registerInstance(this, hostRef);
11
- this.description = undefined;
12
- this.descClass = 'f-ui-03-light';
13
- this.truncate = true;
14
- this.truncateLines = '3';
15
- }
16
- getTruncateClass() {
17
- return this.truncate && this.truncateLines ? `line-clamp-${this.truncateLines}` : '';
18
- }
19
- render() {
20
- return h("p", {
21
- key: '96ba520be4ef9acf871a6e992d5ea74aaf17c962',
22
- class: `text-light ${this.descClass}`
23
- }, h("span", {
24
- key: '951358bd0c992426175e3c1b3c580f2f9be4027f',
25
- class: this.getTruncateClass()
26
- }, this.description));
27
- }
28
- };
29
- EdsCardDesc.style = EdsCardDescStyle0;
30
- const edsCardTitleCss = "a{all:unset;display:inline;color:inherit;text-decoration:none;cursor:pointer}h1,h2,h3,h4,h5,h6{margin:0}.f-heading-01{font-family:var(--f-heading-01-fontFamily);font-weight:var(--f-heading-01-fontWeight);font-size:var(--f-heading-01-fontSize);line-height:var(--f-heading-01-lineHeight);letter-spacing:var(--f-heading-01-letterSpacing)}.f-heading-02{font-family:var(--f-heading-02-fontFamily);font-weight:var(--f-heading-02-fontWeight);font-size:var(--f-heading-02-fontSize);line-height:var(--f-heading-02-lineHeight);letter-spacing:var(--f-heading-02-letterSpacing)}.f-heading-03{font-family:var(--f-heading-03-fontFamily);font-weight:var(--f-heading-03-fontWeight);font-size:var(--f-heading-03-fontSize);line-height:var(--f-heading-03-lineHeight);letter-spacing:var(--f-heading-03-letterSpacing)}.f-heading-04{font-family:var(--f-heading-04-fontFamily);font-weight:var(--f-heading-04-fontWeight);font-size:var(--f-heading-04-fontSize);line-height:var(--f-heading-04-lineHeight);letter-spacing:var(--f-heading-04-letterSpacing)}.f-heading-05{font-family:var(--f-heading-05-fontFamily);font-weight:var(--f-heading-05-fontWeight);font-size:var(--f-heading-05-fontSize);line-height:var(--f-heading-05-lineHeight);letter-spacing:var(--f-heading-05-letterSpacing)}.f-heading-06{font-family:var(--f-heading-06-fontFamily);font-weight:var(--f-heading-06-fontWeight);font-size:var(--f-heading-06-fontSize);line-height:var(--f-heading-06-lineHeight);letter-spacing:var(--f-heading-06-letterSpacing)}.break-words{overflow-wrap:break-word}.after\\:absolute::after{position:absolute}.after\\:inset-0::after{inset:0rem}.after\\:z-10::after{z-index:10}.after\\:content-\\[\\'\\'\\]::after{--tw-content:'';content:var(--tw-content)}.focus\\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}";
31
- const EdsCardTitleStyle0 = edsCardTitleCss;
32
- const EdsCardTitle = class {
33
- constructor(hostRef) {
34
- registerInstance(this, hostRef);
35
- this.url = undefined;
36
- this.titleClass = undefined;
37
- this.headingLevel = 'h3';
38
- this.externalLink = false;
39
- this.cardTitle = undefined;
40
- this.hierarchy = true;
41
- }
42
- /**
43
- * Dynamically generate the title class based on the heading level.
44
- */
45
- getTitleClass() {
46
- const levelMap = this.hierarchy ? {
47
- h1: '05',
48
- h2: '05',
49
- h3: '05',
50
- h4: '05',
51
- h5: '05',
52
- h6: '06'
53
- } : {
54
- h1: '01',
55
- h2: '02',
56
- h3: '03',
57
- h4: '04',
58
- h5: '05',
59
- h6: '06'
60
- };
61
- return `f-heading-${levelMap[this.headingLevel]}`;
62
- }
63
- /*private getTag() {
64
- if (this.url) {
65
- return 'a';
66
- }
67
- return 'span';
68
- }*/
69
- render() {
70
- //const Tag = this.getTag();
71
- const Heading = this.headingLevel;
72
- return h(Heading, {
73
- key: '57ce97f35ee52623d32fac0b6b1a576ca8b5aa70',
74
- class: this.getTitleClass()
75
- }, h("a", {
76
- key: '60fb313d2b8753974658f73aaddd359a63548a79',
77
- class: "break-words after:absolute after:inset-0 after:z-10 after:content-[''] focus:outline-none",
78
- href: this.url,
79
- target: this.externalLink ? '_blank' : undefined,
80
- rel: this.externalLink ? 'noopener noreferrer' : undefined
81
- }, this.cardTitle));
82
- }
83
- };
84
- EdsCardTitle.style = EdsCardTitleStyle0;
85
-
86
- export { EdsCardDesc as eds_card_desc, EdsCardTitle as eds_card_title };
@@ -1,114 +0,0 @@
1
- import { r as registerInstance, h, g as getElement } from './index.esm2.js';
2
- import { p as parseData } from './sharedUtils-a550989c.esm.js';
3
- import { s as sendAnalytics } from './analytics-44b1416b.esm.js';
4
- import 'react';
5
- import 'react/jsx-runtime';
6
- import 'react-dom';
7
-
8
- const edsCardGenericCss = ".h-auto{height:auto}.h-full{height:100%}.\\!min-h-20{min-height:1.25rem !important}.min-h-120{min-height:120px}.min-h-156{min-height:156px}.bg-default{background-color:var(--grey-200)}.bg-inverse{background-color:var(--white)}.effect-shadow{transition-property:box-shadow;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:300ms;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}.hover\\:shadow-hover:hover{--tw-shadow:0px 0px 16px rgba(0, 0, 0, 0.2);--tw-shadow-colored:0px 0px 16px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.cursor-pointer{cursor:pointer}.border-soft{border-color:rgba(0, 0, 0, .15)}.border-softer{border:2px solid rgba(0, 0, 0, .1)}.effect-focus-within{outline-width:3px;outline-offset:2px;outline-color:var(--green-500)}.effect-focus-within:focus-within{outline-style:solid}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.grow{flex-grow:1}.flex-col{flex-direction:column}.rounded-lg{border-radius:16px}.border-2{border-width:2px}.p-12{padding:0.75rem}.p-16{padding:1rem}.mt-6{margin-top:0.375rem}.mt-8{margin-top:0.5rem}.gap-x-1{-moz-column-gap:0.0625rem;column-gap:0.0625rem}.gap-y-4{row-gap:0.25rem}.order-first{order:-9999}.mb-10{margin-bottom:0.625rem}.mb-12{margin-bottom:0.75rem}";
9
- const EdsCardGenericStyle0 = edsCardGenericCss;
10
- const EdsCardGeneric = class {
11
- constructor(hostRef) {
12
- registerInstance(this, hostRef);
13
- this.parentContext = null; // Accepts the entire event detail or null
14
- this.cardTitle = undefined;
15
- this.url = undefined;
16
- this.description = undefined;
17
- this.image = undefined;
18
- this.avatar = undefined;
19
- this.shortAbbreviation = undefined;
20
- this.headingLevel = 'h3';
21
- this.tags = [];
22
- this.tiny = false;
23
- this.bg = true;
24
- this.withHover = true;
25
- this.hierarchy = true;
26
- this.parsedImage = null;
27
- }
28
- componentWillLoad() {
29
- if (this.image) {
30
- try {
31
- if (typeof this.image === 'object') {
32
- // If image is already an object, assign it directly
33
- this.parsedImage = this.image;
34
- } else if (typeof this.image === 'string') {
35
- // If image is a string, try to parse it
36
- this.parsedImage = JSON.parse(this.image);
37
- }
38
- } catch (error) {
39
- // eslint-disable-next-line
40
- console.error('Error parsing image prop:', error);
41
- this.parsedImage = {}; // Assign a fallback empty object in case of an error
42
- }
43
- }
44
- }
45
- handleParentContext(event) {
46
- if (event.target !== this.el) {
47
- // Ignore the event if it's not targeted at this specific instance
48
- return;
49
- }
50
- //console.log(event.detail);
51
- this.parentContext = event.detail;
52
- event.stopPropagation();
53
- }
54
- /**
55
- * Parses the `tags` prop into an array of link objects.
56
- * Returns an empty array if parsing fails or if `tags` is not a valid JSON string or object.
57
- *
58
- * @returns {any[]} Array of parsed link objects
59
- */
60
- get parsedTags() {
61
- return parseData(this.tags);
62
- }
63
- articleClasses() {
64
- return [this.description ? this.tiny ? 'min-h-120' : 'min-h-156' : 'h-auto', this.bg ? 'bg-inverse' : 'bg-default', this.withHover ? 'effect-shadow hover:shadow-hover cursor-pointer' : '', 'border-softer effect-focus-within relative flex grow flex-col rounded-lg border-2 p-16'].join(' ');
65
- }
66
- handleClick() {
67
- var _a;
68
- sendAnalytics({
69
- category: 'ui-component',
70
- parentContext: this.parentContext,
71
- tag: this.el.tagName.toLowerCase(),
72
- name: ((_a = this.cardTitle) === null || _a === void 0 ? void 0 : _a.toLowerCase()) || '',
73
- action: 'click'
74
- });
75
- }
76
- render() {
77
- return h("article", {
78
- key: '440a448c841370838c0c66610bd1266b46f66541',
79
- class: this.articleClasses(),
80
- onClick: () => this.handleClick()
81
- }, h("eds-card-title", {
82
- key: '292d93a9a993c6dcbfd276097a21d3984b1794c4',
83
- "heading-level": this.headingLevel,
84
- titleClass: this.image ? 'f-ui-01' : undefined,
85
- "card-title": this.cardTitle,
86
- url: this.url,
87
- hierarchy: this.hierarchy
88
- }), this.description && h("eds-card-desc", {
89
- key: '4b304cc3c65a42b3b1bcbebd9968c45e79cdabf7',
90
- class: "mt-8",
91
- "truncate-lines": "3",
92
- description: this.description
93
- }), this.parsedImage ? h("eds-img", Object.assign({
94
- class: "mt-8"
95
- }, this.parsedImage)) : this.avatar || this.shortAbbreviation ? h("eds-avatar", {
96
- class: "order-first mb-12",
97
- picture: this.avatar,
98
- initials: this.shortAbbreviation
99
- }) : null, h("div", {
100
- key: '8bdcbbe2982a450843e9ada727e3f6eb62872ae1',
101
- class: "flex flex-wrap gap-y-4 gap-x-1"
102
- }, this.parsedTags.map((tag, index) => h("eds-tag", {
103
- key: index,
104
- intent: tag.style,
105
- label: tag.label
106
- }))), ' ');
107
- }
108
- get el() {
109
- return getElement(this);
110
- }
111
- };
112
- EdsCardGeneric.style = EdsCardGenericStyle0;
113
-
114
- export { EdsCardGeneric as eds_card_generic };
@@ -1,93 +0,0 @@
1
- import { r as registerInstance, h, g as getElement } from './index.esm2.js';
2
- import { s as sendAnalytics } from './analytics-44b1416b.esm.js';
3
- import { g as gradientBGColorVariants } from './color-2554aad6.esm.js';
4
- import 'react';
5
- import 'react/jsx-runtime';
6
- import 'react-dom';
7
- import './index-39c58238.esm.js';
8
-
9
- const EdsCardProject = class {
10
- constructor(hostRef) {
11
- registerInstance(this, hostRef);
12
- this.image = undefined;
13
- this.editorialTitle = undefined;
14
- this.headingLevel = 'h3';
15
- this.categoryTitle = undefined;
16
- this.color = undefined;
17
- this.bgOnHover = false;
18
- this.vertical = false;
19
- this.titleProject = undefined;
20
- this.url = undefined;
21
- this.parsedImage = null;
22
- }
23
- componentWillLoad() {
24
- // Parse the image prop if it's provided
25
- if (this.image) {
26
- try {
27
- this.parsedImage = JSON.parse(this.image);
28
- //console.log(this.parsedImage);
29
- } catch (error) {
30
- //console.error('Error parsing image prop:', error);
31
- }
32
- }
33
- }
34
- handleClick(event) {
35
- var _a;
36
- event.preventDefault();
37
- sendAnalytics({
38
- category: 'ui-component',
39
- tag: this.el.tagName.toLowerCase(),
40
- name: ((_a = this.titleProject) === null || _a === void 0 ? void 0 : _a.toLowerCase()) || '',
41
- action: 'click'
42
- });
43
- }
44
- render() {
45
- var _a;
46
- const cardClasses = ['min-h-156 border-inside after:border-softest @container overflow-hidden border-0 after:rounded-lg', this.color ? gradientBGColorVariants({
47
- color: this.color,
48
- hover: this.bgOnHover,
49
- class: 'before:border-2 before:rounded-lg before:border-softest'
50
- }) : 'bg-default', this.bgOnHover && this.color ? 'effect-background bg-default focus-within:bg-transparent hover:bg-transparent' : 'effect-background hover:bg-default', this.vertical ? 'flex-col gap-y-16' : 'flex-col gap-x-16 gap-y-12 lg:flex-row'].join(' ');
51
- const imageClasses = this.vertical ? '' : 'max-w-120 @md:max-w-192 order-first w-full lg:order-last';
52
- return h("article", {
53
- key: '067a30c2b0860d71dc13d1d3d875a7e288de842b',
54
- class: cardClasses,
55
- onClick: event => this.handleClick(event)
56
- }, h("div", {
57
- key: '3e2e62ecc9ad5973c359b7bbceefd8c2ac682d0b',
58
- class: `flex grow flex-col ${this.vertical ? 'min-h-156' : ''}`
59
- }, h("div", {
60
- key: 'e07a666f80d6955b5cf16c18a999a756dcfe10f0',
61
- class: "lg:max-w-[720px]"
62
- }, h("eds-card-title", {
63
- key: 'b1ef62c888e9d69f1146fc218a7012015ddc78e1',
64
- "heading-level": this.headingLevel,
65
- titleClass: this.image ? 'f-ui-01' : undefined,
66
- "card-title": this.titleProject,
67
- url: this.url
68
- }), this.editorialTitle && h("span", {
69
- key: '79cf1af876a0a358a9f65036a1ff1c4944604435',
70
- class: `block ${this.vertical ? 'f-ui-02' : 'mt-4 f-heading-06'}`
71
- }, this.editorialTitle)), this.categoryTitle && h("div", {
72
- key: 'ce7e525b0bdbbc94d3e2ec8055c692be9d521042',
73
- class: "mt-auto flex items-center gap-x-12 pt-12"
74
- }, ((_a = this.categoryTitle) === null || _a === void 0 ? void 0 : _a.length) && h("eds-tag", {
75
- key: '23e3527a3772970642dcb07a4abc381415132155',
76
- label: this.categoryTitle
77
- }))), this.parsedImage && h("div", {
78
- key: '178ef2273b2506070c045c3f2e7a287d4b175414',
79
- class: imageClasses
80
- }, h("div", {
81
- key: 'f77fb56cd2ed1bdcafd07db9adcf0f7b6a44cdb7',
82
- class: "aspect-1x1 w-full"
83
- }, h("eds-img", Object.assign({
84
- key: 'b9734f48ab685280b801cfb75cc96f5aa109ca6f',
85
- sizes: this.vertical ? this.parsedImage.sizes || '' : '192px'
86
- }, this.parsedImage)))));
87
- }
88
- get el() {
89
- return getElement(this);
90
- }
91
- };
92
-
93
- export { EdsCardProject as eds_card_project };
@@ -1,56 +0,0 @@
1
- import { r as registerInstance, h } from './index.esm2.js';
2
- import { p as parseData } from './sharedUtils-a550989c.esm.js';
3
- import 'react';
4
- import 'react/jsx-runtime';
5
- import 'react-dom';
6
-
7
- const edsCardSectionCss = "ol,ul,menu{list-style:none;margin:0;padding:0}.w-full{width:100%}.grid-layout{display:grid;grid-template-columns:repeat(var(--container-grid-columns, var(--grid-columns)), 1fr);grid-gap:var(--inner-gutter)}.grid-cols-4{grid-template-columns:repeat(4, minmax(0, 1fr))}.grid-cols-4[class*=\"grid-line-x\"][class*=\"grid-line-x\"]>*:nth-child(n)::before{border-bottom-width:1px}.grid-cols-4[class*=\"grid-line-xfull\"]>*:nth-child(n)::before{inset-inline-start:calc(var(--inner-gutter) / -2);inset-inline-end:calc(var(--inner-gutter) / -2)}.grid-cols-4[class*=\"grid-line-x\"]>*:nth-child(4n+1)::before{inset-inline-start:0}.grid-cols-4[class*=\"grid-line-x\"]>*:nth-child(4n+4)::before{inset-inline-end:0}.grid-cols-4[class*=\"grid-line-x\"]>*:nth-child(4n+1):nth-last-child(-n+4)::before{border-bottom-width:0}.grid-cols-4[class*=\"grid-line-x\"]>*:nth-child(4n+1):nth-last-child(-n+4)~*::before{border-bottom-width:0}.grid-cols-4[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(n)::after{border-inline-end-width:1px}.grid-cols-4[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(4n+4)::after{border-inline-end-width:0}.grid-cols-4[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(-n+4)::after{top:0}.grid-cols-4[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(4n+1):nth-last-child(-n+4)::after{bottom:0}.grid-cols-4[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(4n+1):nth-last-child(-n+4)~li::after{bottom:0}.grid-col-span-4{--container-grid-columns:4;grid-column:span 4 / span 4}.gap-y-4{row-gap:0.25rem}.gap-y-8{row-gap:0.5rem}.flex-row{flex-direction:row}.flex-row-reverse{flex-direction:row-reverse}.flex-col{flex-direction:column}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}@media (min-width: 750px){.md\\:flex{display:flex}.md\\:hidden{display:none}.md\\:gap-y-12{row-gap:0.75rem}.md\\:pt-28{padding-top:1.75rem}}@media (min-width: 750px){.md\\:grid-col-span-1{--container-grid-columns:1;grid-column:span 1 / span 1}.md\\:grid-col-span-2{--container-grid-columns:2;grid-column:span 2 / span 2}.md\\:grid-col-span-3{--container-grid-columns:3;grid-column:span 3 / span 3}.md\\:grid-col-span-4{--container-grid-columns:4;grid-column:span 4 / span 4}.md\\:w-10-cols{width:calc(((10 / var(--container-grid-columns, var(--grid-columns))) * 100%) - (var(--inner-gutter) - (10 / var(--container-grid-columns, var(--grid-columns)) * var(--inner-gutter))))}.cols-container>.md\\:w-10-cols{width:calc(((10 / var(--container-grid-columns, var(--grid-columns))) * (100% - var(--inner-gutter))) - (var(--inner-gutter) - (10 / var(--container-grid-columns, var(--grid-columns)) * var(--inner-gutter))))}.md\\:w-10-cols>*{--container-grid-columns:10}}@media (min-width: 900px){.lg\\:grid-col-span-5{--container-grid-columns:5;grid-column:span 5 / span 5}.lg\\:grid-col-span-6{--container-grid-columns:6;grid-column:span 6 / span 6}.lg\\:grid-col-start-7{grid-column-start:7}.lg\\:w-8-cols{width:calc(((8 / var(--container-grid-columns, var(--grid-columns))) * 100%) - (var(--inner-gutter) - (8 / var(--container-grid-columns, var(--grid-columns)) * var(--inner-gutter))))}.cols-container>.lg\\:w-8-cols{width:calc(((8 / var(--container-grid-columns, var(--grid-columns))) * (100% - var(--inner-gutter))) - (var(--inner-gutter) - (8 / var(--container-grid-columns, var(--grid-columns)) * var(--inner-gutter))))}.lg\\:w-8-cols>*{--container-grid-columns:8}.lg\\:w-10-cols{width:calc(((10 / var(--container-grid-columns, var(--grid-columns))) * 100%) - (var(--inner-gutter) - (10 / var(--container-grid-columns, var(--grid-columns)) * var(--inner-gutter))))}.cols-container>.lg\\:w-10-cols{width:calc(((10 / var(--container-grid-columns, var(--grid-columns))) * (100% - var(--inner-gutter))) - (var(--inner-gutter) - (10 / var(--container-grid-columns, var(--grid-columns)) * var(--inner-gutter))))}.lg\\:w-10-cols>*{--container-grid-columns:10}}@media (min-width: 900px){.lg\\:order-last{order:9999}.lg\\:order-none{order:0}.lg\\:mt-0{margin-top:0rem}.lg\\:block{display:block}.lg\\:flex{display:flex}.lg\\:hidden{display:none}.lg\\:w-\\[150px\\]{width:150px}.lg\\:w-auto{width:auto}.lg\\:max-w-\\[720px\\]{max-width:720px}.lg\\:flex-row{flex-direction:row}.lg\\:flex-nowrap{flex-wrap:nowrap}.lg\\:gap-y-16{row-gap:1rem}.lg\\:px-28{padding-left:1.75rem;padding-right:1.75rem}.lg\\:\\!pl-12{padding-left:0.75rem !important}.lg\\:\\!pr-12{padding-right:0.75rem !important}}";
8
- const EdsCardSectionStyle0 = edsCardSectionCss;
9
- const EdsCardSection = class {
10
- constructor(hostRef) {
11
- registerInstance(this, hostRef);
12
- this.cards = [];
13
- this.occupyCols = 1;
14
- }
15
- /**
16
- * Parses the `cards` JSON string prop into an array of card objects.
17
- * If parsing fails, returns an empty array.
18
- *
19
- * @returns {any[]} An array of parsed card objects.
20
- */
21
- get parsedCards() {
22
- return parseData(this.cards);
23
- }
24
- /**
25
- * Renders the card section as a grid layout.
26
- * Each parsed card object is mapped to an `<eds-card-generic>` component,
27
- * displaying card details such as title, description, avatar, etc.
28
- *
29
- * @returns {JSX.Element} The rendered section containing a list of cards.
30
- */
31
- render() {
32
- return h("section", {
33
- key: 'eb64be830a5a1b752fadd0a8a76be9240b70cfe8',
34
- class: "w-full"
35
- }, h("ul", {
36
- key: 'd4eb8d8492a67f7491535953e0e37172fc9e09ff',
37
- class: "grid-layout grid-cols-4 gap-y-8 md:gap-y-12 lg:gap-y-16"
38
- }, this.parsedCards.map(card => h("li", {
39
- class: `grid-col-span-4 md:grid-col-span-${this.occupyCols} flex flex-col`
40
- }, h("eds-card-generic", {
41
- cardTitle: card.title,
42
- description: card.description,
43
- avatar: card.avatar,
44
- headingLevel: card.headingLevel,
45
- tags: card.tags,
46
- url: card.url,
47
- bg: card.bg,
48
- tiny: card.tiny,
49
- image: card.image,
50
- withHover: card.withHover
51
- })))));
52
- }
53
- };
54
- EdsCardSection.style = EdsCardSectionStyle0;
55
-
56
- export { EdsCardSection as eds_card_section };
@@ -1,27 +0,0 @@
1
- import { r as registerInstance, h } from './index.esm2.js';
2
- import 'react';
3
- import 'react/jsx-runtime';
4
- import 'react-dom';
5
-
6
- const edsCardTagsCss = ".flex{display:flex}.flex-wrap{flex-wrap:wrap}.gap-y-4{row-gap:0.25rem}";
7
- const EdsCardTagsStyle0 = edsCardTagsCss;
8
- const EdsCardTags = class {
9
- constructor(hostRef) {
10
- registerInstance(this, hostRef);
11
- this.accent = false;
12
- this.tags = [];
13
- }
14
- render() {
15
- return h("div", {
16
- key: 'df8937e32907eb978f27565d04f7ca56f2485c87',
17
- class: "flex flex-wrap gap-y-4"
18
- }, this.tags.map((tag, index) => h("eds-tag", {
19
- key: index,
20
- intent: this.accent ? 'accent' : 'default',
21
- label: tag
22
- })));
23
- }
24
- };
25
- EdsCardTags.style = EdsCardTagsStyle0;
26
-
27
- export { EdsCardTags as eds_card_tags };
@@ -1,105 +0,0 @@
1
- import { r as registerInstance, h, g as getElement } from './index.esm2.js';
2
- import { s as sendAnalytics } from './analytics-44b1416b.esm.js';
3
- import 'react';
4
- import 'react/jsx-runtime';
5
- import 'react-dom';
6
-
7
- const edsCardToolCss = ".h-auto{height:auto}.h-full{height:100%}.\\!min-h-20{min-height:1.25rem !important}.min-h-120{min-height:120px}.min-h-156{min-height:156px}.bg-default{background-color:var(--grey-200)}.bg-inverse{background-color:var(--white)}.effect-shadow{transition-property:box-shadow;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:300ms;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}.hover\\:shadow-hover:hover{--tw-shadow:0px 0px 16px rgba(0, 0, 0, 0.2);--tw-shadow-colored:0px 0px 16px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.cursor-pointer{cursor:pointer}.border-soft{border-color:rgba(0, 0, 0, .15 )}.border-softer{border:2px solid rgba(0, 0, 0, .1 )}.effect-focus-within{outline-width:3px;outline-offset:2px;outline-color:var(--green-500)}.effect-focus-within:focus-within{outline-style:solid}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.grow{flex-grow:1}.flex-col{flex-direction:column}.rounded-lg{border-radius:16px}.border-2{border-width:2px}.p-12{padding:0.75rem}.p-16{padding:1rem}.mt-6{margin-top:0.375rem}.mt-8{margin-top:0.5rem}.gap-y-4{row-gap:0.25rem}.order-first{order:-9999}.mb-10{margin-bottom:0.625rem}.mb-12{margin-bottom:0.75rem}";
8
- const EdsCardToolStyle0 = edsCardToolCss;
9
- const EdsCardTool = class {
10
- constructor(hostRef) {
11
- registerInstance(this, hostRef);
12
- this.cardTitle = undefined;
13
- this.url = undefined;
14
- this.description = undefined;
15
- this.image = undefined;
16
- this.avatar = undefined;
17
- this.shortAbbreviation = undefined;
18
- this.headingLevel = 'h5';
19
- this.tags = '';
20
- this.tiny = false;
21
- this.bg = true;
22
- this.withHover = true;
23
- this.external = false;
24
- this.hierarchy = true;
25
- }
26
- /**
27
- * Parses the `tags` prop into an array of link objects.
28
- * Returns an empty array if parsing fails or if `tags` is not a valid JSON string or object.
29
- *
30
- * @returns {any[]} Array of parsed link objects
31
- */
32
- get parsedTags() {
33
- if (typeof this.tags === 'object') {
34
- return this.tags;
35
- } else if (typeof this.tags === 'string') {
36
- try {
37
- return JSON.parse(this.tags);
38
- } catch (e) {
39
- // eslint-disable-next-line
40
- console.error('Error parsing links prop:', e);
41
- return [];
42
- }
43
- }
44
- return [];
45
- }
46
- componentWillLoad() {}
47
- parseTags() {
48
- return this.tags.split(',');
49
- }
50
- articleClasses() {
51
- return [this.tiny ? 'min-h-120' : 'min-h-156', this.bg ? 'bg-inverse' : 'bg-default', this.withHover ? 'effect-shadow hover:shadow-hover cursor-pointer' : '', 'border-softer effect-focus-within relative flex grow flex-col rounded-lg border-2 p-16'].join(' ');
52
- }
53
- handleClick() {
54
- var _a;
55
- //event.preventDefault();
56
- sendAnalytics({
57
- category: 'ui-component',
58
- tag: this.el.tagName.toLowerCase(),
59
- name: ((_a = this.cardTitle) === null || _a === void 0 ? void 0 : _a.toLowerCase()) || '',
60
- action: 'click'
61
- });
62
- }
63
- render() {
64
- return h("article", {
65
- key: '5ecce6667d066e78586f795ab260bed569434c4f',
66
- class: `${this.el.tagName.toLowerCase()} ${this.articleClasses()}`,
67
- onClick: () => this.handleClick()
68
- }, h("eds-card-title", {
69
- key: 'a6ff863ade669db7494c763d563809dbfddb3f2c',
70
- "heading-level": this.headingLevel,
71
- titleClass: this.image ? 'f-ui-01' : undefined,
72
- "card-title": this.cardTitle,
73
- url: this.url,
74
- "external-link": this.external,
75
- hierarchy: this.hierarchy
76
- }), this.description && h("eds-card-desc", {
77
- key: '6f5328fba79a564e6e0d737b2d64a31e50ea6434',
78
- class: "mt-8",
79
- "truncate-lines": "3",
80
- description: this.description
81
- }), this.image ? h("eds-img", {
82
- src: this.image,
83
- alt: "Sample Image",
84
- width: 200,
85
- height: 150
86
- }) : this.avatar || this.shortAbbreviation ? h("eds-avatar", {
87
- class: "order-first mb-12",
88
- picture: this.avatar,
89
- initials: this.shortAbbreviation
90
- }) : null, h("div", {
91
- key: 'b1a42a1db9274ebf1098143d56e1ad8a08825c4c',
92
- class: "flex flex-wrap gap-y-4"
93
- }, this.parsedTags.map((tag, index) => h("eds-tag", {
94
- key: index,
95
- intent: tag.style,
96
- label: tag.label
97
- }))));
98
- }
99
- get el() {
100
- return getElement(this);
101
- }
102
- };
103
- EdsCardTool.style = EdsCardToolStyle0;
104
-
105
- export { EdsCardTool as eds_card_tool };
@@ -1,39 +0,0 @@
1
- import { r as registerInstance, h, g as getElement } from './index.esm2.js';
2
- import 'react';
3
- import 'react/jsx-runtime';
4
- import 'react-dom';
5
-
6
- const EdsCardWrapper = class {
7
- constructor(hostRef) {
8
- registerInstance(this, hostRef);
9
- this.tiny = false;
10
- this.withBg = true;
11
- this.withHover = true;
12
- }
13
- hasSlot(name) {
14
- if (name) {
15
- return !!this.el.querySelector(`[slot="${name}"]`);
16
- }
17
- return !!this.el.querySelector(':not([slot])');
18
- }
19
- render() {
20
- const articleClasses = [this.tiny ? 'min-h-120' : 'min-h-156', this.withBg ? 'bg-inverse' : 'bg-default', this.withHover ? 'effect-shadow hover:shadow-hover cursor-pointer' : '', 'border-softer effect-focus-within relative flex grow flex-col rounded-lg border-2 p-16'].join(' ');
21
- return h("article", {
22
- key: 'b860e65a1a943216793a5ce2f5a08d01249fc671',
23
- class: articleClasses
24
- }, h("slot", {
25
- key: '3ea351da205f375ed746695762efc1f28d1fc3f0'
26
- }), this.hasSlot('footer') && h("div", {
27
- key: '84d24bd248033d4855dd63dfa5042585ae61d64d',
28
- class: "mt-auto"
29
- }, h("slot", {
30
- key: 'c7a2530d70a93705097b9ac3b8be1a21551dd1fb',
31
- name: "footer"
32
- })));
33
- }
34
- get el() {
35
- return getElement(this);
36
- }
37
- };
38
-
39
- export { EdsCardWrapper as eds_card_wrapper };