xv-webcomponents 0.1.17 → 0.1.19

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 (131) hide show
  1. package/LICENSE +21 -21
  2. package/README.md +129 -129
  3. package/dist/types/components/xv-checkbox/xv-checkbox.d.ts +66 -2
  4. package/dist/types/components/xv-table/defs.d.ts +16 -0
  5. package/dist/types/components/xv-table/xv-table-col/xv-table-col.d.ts +3 -0
  6. package/dist/types/components/xv-table/xv-table-header-row/xv-table-header-row.d.ts +25 -0
  7. package/dist/types/components/xv-table/xv-table-row/xv-table-row.d.ts +59 -0
  8. package/dist/types/components/xv-table/xv-table.d.ts +40 -0
  9. package/dist/types/components.d.ts +342 -0
  10. package/dist/types/types/enum.d.ts +7 -0
  11. package/dist/types/utils/utils.d.ts +7 -0
  12. package/dist/xv-webcomponents/index-90b82796.js +3971 -0
  13. package/dist/xv-webcomponents/index-90b82796.js.map +1 -0
  14. package/dist/xv-webcomponents/index.esm.js +12 -1
  15. package/dist/xv-webcomponents/index.esm.js.map +1 -1
  16. package/dist/xv-webcomponents/utils-e6dc0550.js +17 -0
  17. package/dist/xv-webcomponents/utils-e6dc0550.js.map +1 -0
  18. package/dist/xv-webcomponents/xv-accordion-v2-item.entry.js +35 -0
  19. package/dist/xv-webcomponents/xv-accordion-v2-item.entry.js.map +1 -0
  20. package/dist/xv-webcomponents/xv-accordion-v2.entry.js +40 -0
  21. package/dist/xv-webcomponents/xv-accordion-v2.entry.js.map +1 -0
  22. package/dist/xv-webcomponents/xv-breadcrumbs-v2.entry.js +17 -0
  23. package/dist/xv-webcomponents/xv-breadcrumbs-v2.entry.js.map +1 -0
  24. package/dist/xv-webcomponents/xv-button-v2.entry.js +33 -0
  25. package/dist/xv-webcomponents/xv-button-v2.entry.js.map +1 -0
  26. package/dist/xv-webcomponents/xv-card-v2.entry.js +18 -0
  27. package/dist/xv-webcomponents/xv-card-v2.entry.js.map +1 -0
  28. package/dist/xv-webcomponents/xv-checkbox-v2.entry.js +99 -0
  29. package/dist/xv-webcomponents/xv-checkbox-v2.entry.js.map +1 -0
  30. package/dist/xv-webcomponents/xv-link-v2.entry.js +26 -0
  31. package/dist/xv-webcomponents/xv-link-v2.entry.js.map +1 -0
  32. package/dist/xv-webcomponents/xv-progress-indicator-v2-item.entry.js +19 -0
  33. package/dist/xv-webcomponents/xv-progress-indicator-v2-item.entry.js.map +1 -0
  34. package/dist/xv-webcomponents/xv-progress-indicator-v2.entry.js +39 -0
  35. package/dist/xv-webcomponents/xv-progress-indicator-v2.entry.js.map +1 -0
  36. package/dist/xv-webcomponents/xv-table-v2-col.entry.js +17 -0
  37. package/dist/xv-webcomponents/xv-table-v2-col.entry.js.map +1 -0
  38. package/dist/xv-webcomponents/xv-table-v2-header-row.entry.js +34 -0
  39. package/dist/xv-webcomponents/xv-table-v2-header-row.entry.js.map +1 -0
  40. package/dist/xv-webcomponents/xv-table-v2-row.entry.js +112 -0
  41. package/dist/xv-webcomponents/xv-table-v2-row.entry.js.map +1 -0
  42. package/dist/xv-webcomponents/xv-table-v2.entry.js +114 -0
  43. package/dist/xv-webcomponents/xv-table-v2.entry.js.map +1 -0
  44. package/dist/xv-webcomponents/xv-tag-v2.entry.js +28 -0
  45. package/dist/xv-webcomponents/xv-tag-v2.entry.js.map +1 -0
  46. package/dist/xv-webcomponents/xv-tooltip-v2.entry.js +23 -0
  47. package/dist/xv-webcomponents/xv-tooltip-v2.entry.js.map +1 -0
  48. package/dist/xv-webcomponents/xv-webcomponents.esm.js +48 -1
  49. package/dist/xv-webcomponents/xv-webcomponents.esm.js.map +1 -1
  50. package/package.json +51 -51
  51. package/dist/cjs/app-globals-3a1e7e63.js +0 -7
  52. package/dist/cjs/app-globals-3a1e7e63.js.map +0 -1
  53. package/dist/cjs/index-4d938647.js +0 -1483
  54. package/dist/cjs/index-4d938647.js.map +0 -1
  55. package/dist/cjs/index.cjs.js +0 -11
  56. package/dist/cjs/index.cjs.js.map +0 -1
  57. package/dist/cjs/loader.cjs.js +0 -17
  58. package/dist/cjs/loader.cjs.js.map +0 -1
  59. package/dist/cjs/utils-c7652b74.js +0 -13
  60. package/dist/cjs/utils-c7652b74.js.map +0 -1
  61. package/dist/cjs/xv-accordion-v2_10.cjs.entry.js +0 -265
  62. package/dist/cjs/xv-accordion-v2_10.cjs.entry.js.map +0 -1
  63. package/dist/cjs/xv-breadcrumbs-v2.cjs.entry.js +0 -22
  64. package/dist/cjs/xv-breadcrumbs-v2.cjs.entry.js.map +0 -1
  65. package/dist/cjs/xv-webcomponents.cjs.js +0 -27
  66. package/dist/cjs/xv-webcomponents.cjs.js.map +0 -1
  67. package/dist/collection/collection-manifest.json +0 -22
  68. package/dist/collection/components/xv-accordion/xv-accordion.css +0 -3
  69. package/dist/collection/components/xv-accordion/xv-accordion.js +0 -163
  70. package/dist/collection/components/xv-accordion/xv-accordion.js.map +0 -1
  71. package/dist/collection/components/xv-accordion-item/xv-accordion-item.css +0 -68
  72. package/dist/collection/components/xv-accordion-item/xv-accordion-item.js +0 -132
  73. package/dist/collection/components/xv-accordion-item/xv-accordion-item.js.map +0 -1
  74. package/dist/collection/components/xv-breadcrumbs/xv-breadcrumbs.css +0 -3
  75. package/dist/collection/components/xv-breadcrumbs/xv-breadcrumbs.js +0 -19
  76. package/dist/collection/components/xv-breadcrumbs/xv-breadcrumbs.js.map +0 -1
  77. package/dist/collection/components/xv-button/xv-button-v2.css +0 -153
  78. package/dist/collection/components/xv-button/xv-button.js +0 -138
  79. package/dist/collection/components/xv-button/xv-button.js.map +0 -1
  80. package/dist/collection/components/xv-card/xv-card.css +0 -63
  81. package/dist/collection/components/xv-card/xv-card.js +0 -122
  82. package/dist/collection/components/xv-card/xv-card.js.map +0 -1
  83. package/dist/collection/components/xv-checkbox/xv-checkbox.js +0 -22
  84. package/dist/collection/components/xv-checkbox/xv-checkbox.js.map +0 -1
  85. package/dist/collection/components/xv-link/xv-link.css +0 -60
  86. package/dist/collection/components/xv-link/xv-link.js +0 -132
  87. package/dist/collection/components/xv-link/xv-link.js.map +0 -1
  88. package/dist/collection/components/xv-progress-indicator/xv-progress-indicator.css +0 -7
  89. package/dist/collection/components/xv-progress-indicator/xv-progress-indicator.js +0 -70
  90. package/dist/collection/components/xv-progress-indicator/xv-progress-indicator.js.map +0 -1
  91. package/dist/collection/components/xv-progress-indicator-item/xv-progress-indicator-item.css +0 -66
  92. package/dist/collection/components/xv-progress-indicator-item/xv-progress-indicator-item.js +0 -47
  93. package/dist/collection/components/xv-progress-indicator-item/xv-progress-indicator-item.js.map +0 -1
  94. package/dist/collection/components/xv-tag/xv-tag.css +0 -97
  95. package/dist/collection/components/xv-tag/xv-tag.js +0 -158
  96. package/dist/collection/components/xv-tag/xv-tag.js.map +0 -1
  97. package/dist/collection/components/xv-tooltip/xv-tooltip.css +0 -154
  98. package/dist/collection/components/xv-tooltip/xv-tooltip.js +0 -70
  99. package/dist/collection/components/xv-tooltip/xv-tooltip.js.map +0 -1
  100. package/dist/collection/index.js +0 -11
  101. package/dist/collection/index.js.map +0 -1
  102. package/dist/collection/utils/utils.js +0 -7
  103. package/dist/collection/utils/utils.js.map +0 -1
  104. package/dist/esm/index-60f5a964.js +0 -1454
  105. package/dist/esm/index-60f5a964.js.map +0 -1
  106. package/dist/esm/index.js +0 -3
  107. package/dist/esm/index.js.map +0 -1
  108. package/dist/esm/loader.js +0 -13
  109. package/dist/esm/loader.js.map +0 -1
  110. package/dist/esm/utils-9bb6333b.js +0 -10
  111. package/dist/esm/utils-9bb6333b.js.map +0 -1
  112. package/dist/esm/xv-accordion-v2_10.entry.js +0 -252
  113. package/dist/esm/xv-accordion-v2_10.entry.js.map +0 -1
  114. package/dist/esm/xv-breadcrumbs-v2.entry.js +0 -18
  115. package/dist/esm/xv-breadcrumbs-v2.entry.js.map +0 -1
  116. package/dist/esm/xv-webcomponents.js +0 -22
  117. package/dist/esm/xv-webcomponents.js.map +0 -1
  118. package/dist/index.cjs.js +0 -1
  119. package/dist/index.js +0 -1
  120. package/dist/xv-webcomponents/p-08297c60.entry.js +0 -2
  121. package/dist/xv-webcomponents/p-08297c60.entry.js.map +0 -1
  122. package/dist/xv-webcomponents/p-543fe755.js +0 -3
  123. package/dist/xv-webcomponents/p-543fe755.js.map +0 -1
  124. package/dist/xv-webcomponents/p-6fe85516.entry.js +0 -2
  125. package/dist/xv-webcomponents/p-6fe85516.entry.js.map +0 -1
  126. package/dist/xv-webcomponents/p-a0b74d3c.js +0 -2
  127. package/dist/xv-webcomponents/p-a0b74d3c.js.map +0 -1
  128. package/dist/xv-webcomponents/p-e1255160.js +0 -2
  129. package/dist/xv-webcomponents/p-e1255160.js.map +0 -1
  130. /package/dist/{esm → xv-webcomponents}/app-globals-0f993ce5.js +0 -0
  131. /package/dist/{esm → xv-webcomponents}/app-globals-0f993ce5.js.map +0 -0
@@ -1 +0,0 @@
1
- {"version":3,"file":"xv-accordion.js","sourceRoot":"","sources":["../../../src/components/xv-accordion/xv-accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAgB,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAC7F,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAOjD,MAAM,OAAO,WAAW;IALxB;QAMU,aAAQ,GAAY,KAAK,CAAC;QAC1B,SAAI,GAAW,YAAY,EAAE,CAAC;QAE7B,WAAM,GAAgB,IAAI,GAAG,EAAE,CAAC;KA+B1C;IA3BC,KAAK,CAAC,UAAU,CAAC,KAAa;QAC5B,IAAI,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC;YAC3B,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC5B,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,IAAI,CAAC,QAAQ;gBAAE,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC;YACxC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;YACnB,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC9B,CAAC;QAED,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,EAAE,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;QAElE,OAAO,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,EAAE,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC;IAChD,CAAC;IAED,iBAAiB;QACf,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACf,OAAO,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QACrC,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAC,cAAc,aAAU,IAAI,CAAC,IAAI;YAC3C,8DAAQ,CACH,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Event, EventEmitter, Method, State, Prop } from '@stencil/core';\nimport { uidGenerator } from '../../utils/utils';\n\n@Component({\n tag: 'xv-accordion-v2',\n styleUrl: 'xv-accordion.scss',\n shadow: true,\n})\nexport class XvAccordion {\n @Prop() multiple: boolean = false;\n @Prop() xvId: string = uidGenerator();\n @Prop({ mutable: true }) value: string;\n @State() opened: Set<string> = new Set();\n @Event() accordionChange: EventEmitter<{ opened: Set<string>, id: string }>;\n\n @Method()\n async toggleItem(value: string) {\n if (this.opened.has(value)) {\n this.opened.delete(value);\n } else {\n if (!this.multiple) this.opened.clear();\n this.value = value;\n this.opened.add(this.value);\n }\n\n this.accordionChange.emit({ opened: this.opened, id: this.xvId });\n\n return { opened: this.opened, id: this.xvId };\n }\n\n componentWillLoad() {\n if (this.value) {\n return this.toggleItem(this.value);\n }\n }\n\n render() {\n return (\n <Host class=\"xv-accordion\" data-id={this.xvId}>\n <slot />\n </Host>\n );\n }\n}\n"]}
@@ -1,68 +0,0 @@
1
- :host {
2
- border-top: 1px solid var(--border-subtle-01);
3
- display: flex;
4
- flex-direction: column;
5
- font-family: var(--ff-body, inherit);
6
- }
7
-
8
- :host(.disabled) .label {
9
- color: var(--text-disabled);
10
- }
11
- :host(.disabled) .label:hover {
12
- cursor: initial;
13
- background-color: transparent;
14
- }
15
-
16
- .label {
17
- padding: 14px 16px;
18
- display: inline-flex;
19
- align-items: center;
20
- column-gap: 20px;
21
- justify-content: space-between;
22
- text-align: left;
23
- color: var(--text-primary);
24
- font-size: 14px;
25
- font-style: normal;
26
- font-weight: 400;
27
- line-height: 20px;
28
- letter-spacing: 0.16px;
29
- background-color: transparent;
30
- transition: background-color 200ms ease-in-out;
31
- }
32
- .label > span {
33
- overflow: hidden;
34
- text-overflow: ellipsis;
35
- display: -webkit-box;
36
- -webkit-line-clamp: 1;
37
- -webkit-box-orient: vertical;
38
- }
39
- .label:hover {
40
- cursor: pointer;
41
- background-color: var(--layer-hover-01);
42
- }
43
- .label:after {
44
- content: "";
45
- border: solid black;
46
- border-width: 0 2px 2px 0;
47
- display: inline-block;
48
- padding: 4.66px;
49
- transition: transform 100ms ease-in-out;
50
- transform: rotate(45deg);
51
- }
52
- .label.opened:after {
53
- transform: rotate(-135deg);
54
- }
55
-
56
- .content {
57
- padding: 0 16px;
58
- text-align: left;
59
- color: var(--text-primary);
60
- font-size: 14px;
61
- overflow: hidden;
62
- max-height: 0;
63
- transition: max-height 300ms ease-in-out, padding 250ms ease 50ms;
64
- }
65
- .content.opened {
66
- padding: 14px 16px;
67
- max-height: 500px;
68
- }
@@ -1,132 +0,0 @@
1
- import { Host, h } from "@stencil/core";
2
- export class XvAccordionItem {
3
- constructor() {
4
- this.disabled = false;
5
- this.isOpen = false;
6
- }
7
- handleAccordionChange(event) {
8
- var _a;
9
- const parentAccordionId = (_a = this.el.closest('[data-id]')) === null || _a === void 0 ? void 0 : _a.getAttribute('data-id');
10
- if (event.detail.id !== parentAccordionId)
11
- return;
12
- this.isOpen = event.detail.opened.has(this.value);
13
- }
14
- toggle() {
15
- var _a, _b;
16
- if (this.disabled)
17
- return;
18
- this.isOpen = !this.isOpen;
19
- (_b = (_a = this.el.closest('xv-accordion-v2')) === null || _a === void 0 ? void 0 : _a.toggleItem) === null || _b === void 0 ? void 0 : _b.call(_a, this.value);
20
- }
21
- render() {
22
- return (h(Host, { key: '7d536c27a29b4f1e5a54ffb38c485102a4b22301', class: `${this.disabled ? 'disabled' : ''}` }, h("label", { key: 'bd35f139baa3fa9449e4391acb26ceffbeee61c4', class: `label ${this.isOpen ? 'opened' : 'closed'}`, onClick: this.toggle.bind(this) }, h("span", { key: '4b2a948ec962246557b480308e1a7df9712806a1' }, this.label)), h("div", { key: 'b88b7c9c9c724b6d6468c59df391c7ec41c99e97', class: `content ${this.isOpen ? 'opened' : 'closed'}` }, h("slot", { key: '61cb22aabcf159a31bab0a6cca01dc5478a580f1' }))));
23
- }
24
- static get is() { return "xv-accordion-v2-item"; }
25
- static get encapsulation() { return "shadow"; }
26
- static get originalStyleUrls() {
27
- return {
28
- "$": ["xv-accordion-item.scss"]
29
- };
30
- }
31
- static get styleUrls() {
32
- return {
33
- "$": ["xv-accordion-item.css"]
34
- };
35
- }
36
- static get properties() {
37
- return {
38
- "disabled": {
39
- "type": "boolean",
40
- "mutable": false,
41
- "complexType": {
42
- "original": "boolean",
43
- "resolved": "boolean",
44
- "references": {}
45
- },
46
- "required": false,
47
- "optional": false,
48
- "docs": {
49
- "tags": [],
50
- "text": ""
51
- },
52
- "getter": false,
53
- "setter": false,
54
- "attribute": "disabled",
55
- "reflect": false,
56
- "defaultValue": "false"
57
- },
58
- "label": {
59
- "type": "string",
60
- "mutable": false,
61
- "complexType": {
62
- "original": "string",
63
- "resolved": "string",
64
- "references": {}
65
- },
66
- "required": false,
67
- "optional": false,
68
- "docs": {
69
- "tags": [],
70
- "text": ""
71
- },
72
- "getter": false,
73
- "setter": false,
74
- "attribute": "label",
75
- "reflect": false
76
- },
77
- "value": {
78
- "type": "string",
79
- "mutable": false,
80
- "complexType": {
81
- "original": "string",
82
- "resolved": "string",
83
- "references": {}
84
- },
85
- "required": false,
86
- "optional": false,
87
- "docs": {
88
- "tags": [],
89
- "text": ""
90
- },
91
- "getter": false,
92
- "setter": false,
93
- "attribute": "value",
94
- "reflect": false
95
- }
96
- };
97
- }
98
- static get states() {
99
- return {
100
- "isOpen": {}
101
- };
102
- }
103
- static get events() {
104
- return [{
105
- "method": "itemToggle",
106
- "name": "itemToggle",
107
- "bubbles": true,
108
- "cancelable": true,
109
- "composed": true,
110
- "docs": {
111
- "tags": [],
112
- "text": ""
113
- },
114
- "complexType": {
115
- "original": "any",
116
- "resolved": "any",
117
- "references": {}
118
- }
119
- }];
120
- }
121
- static get elementRef() { return "el"; }
122
- static get listeners() {
123
- return [{
124
- "name": "accordionChange",
125
- "method": "handleAccordionChange",
126
- "target": "body",
127
- "capture": false,
128
- "passive": false
129
- }];
130
- }
131
- }
132
- //# sourceMappingURL=xv-accordion-item.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"xv-accordion-item.js","sourceRoot":"","sources":["../../../src/components/xv-accordion-item/xv-accordion-item.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAgB,MAAM,eAAe,CAAC;AAOtG,MAAM,OAAO,eAAe;IAL5B;QAOU,aAAQ,GAAY,KAAK,CAAC;QAGzB,WAAM,GAAY,KAAK,CAAC;KA4BlC;IAxBC,qBAAqB,CAAC,KAAuD;;QAC3E,MAAM,iBAAiB,GAAG,MAAA,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,WAAW,CAAC,0CAAE,YAAY,CAAC,SAAS,CAAC,CAAC;QAChF,IAAI,KAAK,CAAC,MAAM,CAAC,EAAE,KAAK,iBAAiB;YAAE,OAAO;QAClD,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IACpD,CAAC;IAED,MAAM;;QACJ,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO;QAC1B,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC;QAC3B,MAAA,MAAA,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,iBAAiB,CAAC,0CAAE,UAAU,mDAAG,IAAI,CAAC,KAAK,CAAC,CAAC;IAC/D,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAE,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE;YAC/C,8DAAO,KAAK,EAAE,SAAS,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;gBACzF,+DAAO,IAAI,CAAC,KAAK,CAAQ,CACnB;YACR,4DAAK,KAAK,EAAE,WAAW,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,EAAE;gBACxD,8DAAQ,CACJ,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Element, Prop, State, Listen, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n tag: 'xv-accordion-v2-item',\n styleUrl: 'xv-accordion-item.scss',\n shadow: true,\n})\nexport class XvAccordionItem {\n @Element() el: HTMLElement;\n @Prop() disabled: boolean = false;\n @Prop() label: string;\n @Prop() value: string;\n @State() isOpen: boolean = false;\n @Event() itemToggle: EventEmitter;\n\n @Listen('accordionChange', { target: 'body' })\n handleAccordionChange(event: CustomEvent<{ opened: Set<string>, id: string }>) {\n const parentAccordionId = this.el.closest('[data-id]')?.getAttribute('data-id');\n if (event.detail.id !== parentAccordionId) return;\n this.isOpen = event.detail.opened.has(this.value);\n }\n\n toggle() {\n if (this.disabled) return;\n this.isOpen = !this.isOpen;\n this.el.closest('xv-accordion-v2')?.toggleItem?.(this.value);\n }\n\n render() {\n return (\n <Host class={`${this.disabled ? 'disabled' : ''}`}>\n <label class={`label ${this.isOpen ? 'opened' : 'closed'}`} onClick={this.toggle.bind(this)}>\n <span>{this.label}</span>\n </label>\n <div class={`content ${this.isOpen ? 'opened' : 'closed'}`}>\n <slot />\n </div>\n </Host>\n );\n }\n}\n"]}
@@ -1,3 +0,0 @@
1
- :host {
2
- display: block;
3
- }
@@ -1,19 +0,0 @@
1
- import { Host, h } from "@stencil/core";
2
- export class XvBreadcrumbs {
3
- render() {
4
- return (h(Host, { key: '5af11f456cfed9e3a853fa3ccdcf12d2d5d5e49f' }, h("slot", { key: 'ecef5ef84a97ceefda5cbcb54e23056e2adbdf99' })));
5
- }
6
- static get is() { return "xv-breadcrumbs-v2"; }
7
- static get encapsulation() { return "shadow"; }
8
- static get originalStyleUrls() {
9
- return {
10
- "$": ["xv-breadcrumbs.scss"]
11
- };
12
- }
13
- static get styleUrls() {
14
- return {
15
- "$": ["xv-breadcrumbs.css"]
16
- };
17
- }
18
- }
19
- //# sourceMappingURL=xv-breadcrumbs.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"xv-breadcrumbs.js","sourceRoot":"","sources":["../../../src/components/xv-breadcrumbs/xv-breadcrumbs.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAOnD,MAAM,OAAO,aAAa;IACxB,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,8DAAa,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h } from '@stencil/core';\n\n@Component({\n tag: 'xv-breadcrumbs-v2',\n styleUrl: 'xv-breadcrumbs.scss',\n shadow: true,\n})\nexport class XvBreadcrumbs {\n render() {\n return (\n <Host>\n <slot></slot>\n </Host>\n );\n }\n}\n"]}
@@ -1,153 +0,0 @@
1
- @charset "UTF-8";
2
- :host {
3
- --focus-border-width: 2px;
4
- --focus-border-style: solid;
5
- --button-ghost: tarnsparent;
6
- --text-disabled-opacity: 0.25;
7
- --button-border-radius: 3px;
8
- --button-border-width: 1px;
9
- --button-border-style: solid;
10
- --button-border-color-accent: #97BF0D;
11
- --button-border-color-primary: #273435;
12
- --button-border-color-secondary: #D1D1D1;
13
- --button-border-color-ghost: tarnsparent;
14
- --button-ghost-hover: tarnsparent;
15
- --button-ghost-active: rgba(139, 139, 139, 0.5);
16
- --button-accent-disabled: #D1D1D1;
17
- --button-primary-disabled: #D1D1D1;
18
- --button-secondary-disabled: #D1D1D1;
19
- --button-tertiary-disabled: tarnsparent;
20
- --button-ghost-disabled: tarnsparent;
21
- }
22
- :host button {
23
- font-family: inherit;
24
- font-size: 16px;
25
- font-weight: 700;
26
- padding: 0 20px;
27
- min-height: 40px;
28
- line-height: 40px;
29
- cursor: pointer;
30
- box-sizing: border-box;
31
- transition: background-color 0.2s ease-in-out, filter 0.2s ease-in-out, transform 0.1s ease-in-out, border-color 0.2s ease-in-out, border-width 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
32
- }
33
- :host button.xv-button-block {
34
- width: 100%;
35
- }
36
-
37
- .xv-button {
38
- /* ✅ Accent Button */
39
- /* ✅ Primary Button */
40
- /* ✅ Secondary Button */
41
- /* ✅ Tertiary Button */
42
- /* ✅ Ghost Button */
43
- }
44
- .xv-button.accent {
45
- background-color: var(--button-accent);
46
- color: var(--text-on-color);
47
- border: var(--button-border-width) var(--button-border-style) var(--button-border-color-accent);
48
- border-radius: var(--button-border-radius);
49
- }
50
- .xv-button.accent:hover {
51
- background-color: var(--button-accent-hover);
52
- }
53
- .xv-button.accent:active {
54
- background-color: var(--button-accent-active);
55
- color: var(--text-on-color);
56
- }
57
- .xv-button.accent:focus {
58
- outline: none;
59
- border: var(--focus-border-width) var(--focus-border-style) var(--focus);
60
- transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
61
- }
62
- .xv-button.accent:disabled {
63
- background-color: var(--button-accent-disabled);
64
- color: var(--text-on-color-disabled);
65
- border: var(--button-border-width) var(--button-border-style) var(--button-accent-disabled);
66
- }
67
- .xv-button.primary {
68
- background-color: var(--button-primary);
69
- color: var(--text-on-color);
70
- border: var(--button-border-width) var(--button-border-style) var(--button-border-color-primary);
71
- border-radius: var(--button-border-radius);
72
- }
73
- .xv-button.primary:hover {
74
- background-color: var(--button-primary-hover);
75
- }
76
- .xv-button.primary:active {
77
- background-color: var(--button-primary-active);
78
- }
79
- .xv-button.primary:focus {
80
- outline: none;
81
- border: var(--focus-border-width) var(--focus-border-style) var(--focus);
82
- transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
83
- }
84
- .xv-button.primary:disabled {
85
- background-color: var(--button-primary-disabled);
86
- color: var(--text-on-color-disabled);
87
- border: var(--button-border-width) var(--button-border-style) var(--button-primary-disabled);
88
- }
89
- .xv-button.secondary {
90
- background-color: var(--button-secondary);
91
- color: var(--text-primary);
92
- border: var(--button-border-width) var(--button-border-style) var(--button-border-color-secondary);
93
- border-radius: var(--button-border-radius);
94
- }
95
- .xv-button.secondary:hover {
96
- background-color: var(--button-secondary-hover);
97
- }
98
- .xv-button.secondary:active {
99
- background-color: var(--button-secondary-active);
100
- }
101
- .xv-button.secondary:focus {
102
- outline: none;
103
- border: var(--focus-border-width) var(--focus-border-style) var(--focus);
104
- transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
105
- }
106
- .xv-button.secondary:disabled {
107
- background-color: var(--button-secondary-disabled);
108
- color: var(--text-on-color-disabled);
109
- }
110
- .xv-button.tertiary {
111
- background-color: var(--button-ghost);
112
- color: var(--text-primary);
113
- border: var(--button-border-width) var(--button-border-style) var(--button-tertiary);
114
- border-radius: var(--button-border-radius);
115
- }
116
- .xv-button.tertiary:hover {
117
- background-color: var(--button-tertiary-hover);
118
- }
119
- .xv-button.tertiary:active {
120
- background-color: var(--button-tertiary-active);
121
- }
122
- .xv-button.tertiary:focus {
123
- outline: none;
124
- border: var(--focus-border-width) var(--focus-border-style) var(--focus);
125
- transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
126
- }
127
- .xv-button.tertiary:disabled {
128
- background-color: var(--button-tertiary-disabled);
129
- color: var(--text-disabled);
130
- opacity: var(--text-disabled-opacity);
131
- }
132
- .xv-button.ghost {
133
- background-color: var(--button-ghost);
134
- color: var(--text-primary);
135
- border: var(--button-border-width) var(--button-border-style) var(--button-border-color-ghost);
136
- border-radius: var(--button-border-radius);
137
- }
138
- .xv-button.ghost:hover {
139
- background-color: var(--button-ghost-hover);
140
- }
141
- .xv-button.ghost:active {
142
- background-color: var(--button-ghost-active);
143
- }
144
- .xv-button.ghost:focus {
145
- outline: none;
146
- border: var(--focus-border-width) var(--focus-border-style) var(--focus);
147
- transition: border-color 0.2s ease-in-out;
148
- }
149
- .xv-button.ghost:disabled {
150
- background-color: var(--button-ghost-disabled);
151
- color: var(--text-disabled);
152
- opacity: var(--text-disabled-opacity);
153
- }
@@ -1,138 +0,0 @@
1
- import { h } from "@stencil/core";
2
- export class XvButton {
3
- constructor() {
4
- /** Button label */
5
- this.label = '';
6
- /** Container width Button */
7
- this.block = false;
8
- /** Variant */
9
- this.variant = 'primary';
10
- /** Disabled state */
11
- this.disabled = false;
12
- /** Handle click only if not disabled */
13
- this.handleClick = () => {
14
- if (this.disabled) {
15
- return;
16
- }
17
- this.buttonClick.emit();
18
- };
19
- }
20
- render() {
21
- return (h("button", { key: '4b6d2d71bd297a7b1e2a00ba36c8e4380395e696', class: `xv-button ${this.variant} ${this.block ? 'xv-button-block' : ''}`, disabled: this.disabled, onClick: this.handleClick }, h("slot", { key: '2934a04fa4aae539014f0a283444903dc9807888', name: "icon-left" }), h("slot", { key: '7139fa048b1f6e10f45853f7d1ff3b8cef1b9db6' }, this.label), h("slot", { key: 'ff326b3d02d3c4102f85132b890a595fcfec08d4', name: "icon-right" })));
22
- }
23
- static get is() { return "xv-button-v2"; }
24
- static get encapsulation() { return "shadow"; }
25
- static get originalStyleUrls() {
26
- return {
27
- "$": ["xv-button-v2.scss"]
28
- };
29
- }
30
- static get styleUrls() {
31
- return {
32
- "$": ["xv-button-v2.css"]
33
- };
34
- }
35
- static get properties() {
36
- return {
37
- "label": {
38
- "type": "string",
39
- "mutable": false,
40
- "complexType": {
41
- "original": "string",
42
- "resolved": "string",
43
- "references": {}
44
- },
45
- "required": false,
46
- "optional": false,
47
- "docs": {
48
- "tags": [],
49
- "text": "Button label"
50
- },
51
- "getter": false,
52
- "setter": false,
53
- "attribute": "label",
54
- "reflect": false,
55
- "defaultValue": "''"
56
- },
57
- "block": {
58
- "type": "boolean",
59
- "mutable": false,
60
- "complexType": {
61
- "original": "boolean",
62
- "resolved": "boolean",
63
- "references": {}
64
- },
65
- "required": false,
66
- "optional": false,
67
- "docs": {
68
- "tags": [],
69
- "text": "Container width Button"
70
- },
71
- "getter": false,
72
- "setter": false,
73
- "attribute": "block",
74
- "reflect": false,
75
- "defaultValue": "false"
76
- },
77
- "variant": {
78
- "type": "string",
79
- "mutable": false,
80
- "complexType": {
81
- "original": "'accent' | 'primary' | 'secondary' | 'tertiary' | 'ghost'",
82
- "resolved": "\"accent\" | \"ghost\" | \"primary\" | \"secondary\" | \"tertiary\"",
83
- "references": {}
84
- },
85
- "required": false,
86
- "optional": false,
87
- "docs": {
88
- "tags": [],
89
- "text": "Variant"
90
- },
91
- "getter": false,
92
- "setter": false,
93
- "attribute": "variant",
94
- "reflect": false,
95
- "defaultValue": "'primary'"
96
- },
97
- "disabled": {
98
- "type": "boolean",
99
- "mutable": false,
100
- "complexType": {
101
- "original": "boolean",
102
- "resolved": "boolean",
103
- "references": {}
104
- },
105
- "required": false,
106
- "optional": false,
107
- "docs": {
108
- "tags": [],
109
- "text": "Disabled state"
110
- },
111
- "getter": false,
112
- "setter": false,
113
- "attribute": "disabled",
114
- "reflect": false,
115
- "defaultValue": "false"
116
- }
117
- };
118
- }
119
- static get events() {
120
- return [{
121
- "method": "buttonClick",
122
- "name": "buttonClick",
123
- "bubbles": true,
124
- "cancelable": true,
125
- "composed": true,
126
- "docs": {
127
- "tags": [],
128
- "text": "Emits when the button is clicked"
129
- },
130
- "complexType": {
131
- "original": "void",
132
- "resolved": "void",
133
- "references": {}
134
- }
135
- }];
136
- }
137
- }
138
- //# sourceMappingURL=xv-button.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"xv-button.js","sourceRoot":"","sources":["../../../src/components/xv-button/xv-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAgB,CAAC,EAAE,MAAM,eAAe,CAAC;AAQxE,MAAM,OAAO,QAAQ;IALrB;QAME,mBAAmB;QACX,UAAK,GAAW,EAAE,CAAC;QAE3B,6BAA6B;QACrB,UAAK,GAAY,KAAK,CAAC;QAE/B,cAAc;QACN,YAAO,GAA8D,SAAS,CAAC;QAEvF,qBAAqB;QACb,aAAQ,GAAY,KAAK,CAAC;QAKlC,wCAAwC;QAChC,gBAAW,GAAG,GAAG,EAAE;YACzB,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;gBAClB,OAAO;YACT,CAAC;YACD,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC;QAC1B,CAAC,CAAC;KAmBH;IAjBC,MAAM;QACJ,OAAO,CACL,+DACE,KAAK,EAAE,aAAa,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,EAAE,EACzE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,IAAI,CAAC,WAAW;YAEzB,6DAAM,IAAI,EAAC,WAAW,GAAQ;YAE9B,+DACG,IAAI,CAAC,KAAK,CACN;YAEP,6DAAM,IAAI,EAAC,YAAY,GAAQ,CACxB,CACV,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, Event, EventEmitter, h } from '@stencil/core';\r\n\r\n\r\n@Component({\r\n tag: 'xv-button-v2',\r\n styleUrl: 'xv-button-v2.scss',\r\n shadow: true,\r\n})\r\nexport class XvButton {\r\n /** Button label */\r\n @Prop() label: string = '';\r\n\r\n /** Container width Button */\r\n @Prop() block: boolean = false;\r\n\r\n /** Variant */\r\n @Prop() variant: 'accent' | 'primary' | 'secondary' | 'tertiary' | 'ghost' = 'primary';\r\n\r\n /** Disabled state */\r\n @Prop() disabled: boolean = false;\r\n\r\n /** Emits when the button is clicked */\r\n @Event() buttonClick!: EventEmitter<void>;\r\n\r\n /** Handle click only if not disabled */\r\n private handleClick = () => {\r\n if (this.disabled) {\r\n return;\r\n }\r\n this.buttonClick.emit();\r\n };\r\n\r\n render() {\r\n return (\r\n <button\r\n class={`xv-button ${this.variant} ${this.block ? 'xv-button-block' : ''}`}\r\n disabled={this.disabled}\r\n onClick={this.handleClick}\r\n >\r\n <slot name=\"icon-left\"></slot>\r\n\r\n <slot>\r\n {this.label}\r\n </slot>\r\n\r\n <slot name=\"icon-right\"></slot>\r\n </button>\r\n );\r\n }\r\n}\r\n"]}
@@ -1,63 +0,0 @@
1
- :host {
2
- display: flex;
3
- flex-direction: column;
4
- border-radius: 8px;
5
- border: 1px solid var(--border-subtle-00);
6
- background: var(--layer-layer-02);
7
- box-shadow: 0 1px 3px 1px rgba(39, 52, 53, 0.15), 0 1px 2px 0 rgba(39, 52, 53, 0.3);
8
- font-family: var(--ff-body, inherit);
9
- overflow: visible !important;
10
- }
11
-
12
- :host(.xv-card_vertical) {
13
- width: 100% !important;
14
- }
15
-
16
- :host(.xv-card_horizontal) {
17
- flex-direction: row;
18
- display: flex;
19
- width: max-content;
20
- }
21
- :host(.xv-card_horizontal) .xv-card_media__content, :host(.xv-card_horizontal) .xv-card_media ::slotted([slot=media]) {
22
- min-height: 100%;
23
- max-height: 100%;
24
- max-width: 160px;
25
- min-width: 160px;
26
- }
27
-
28
- .xv-card_content {
29
- padding: 16px;
30
- display: flex;
31
- flex-direction: column;
32
- flex: 1;
33
- text-align: left;
34
- }
35
- .xv-card_media__content, .xv-card_media ::slotted([slot=media]) {
36
- max-width: 100%;
37
- min-width: 100%;
38
- min-height: 199px;
39
- max-height: 199px;
40
- object-fit: cover;
41
- object-position: center;
42
- }
43
- .xv-card_header__content, .xv-card_header ::slotted([slot=header]) {
44
- margin: 0 0 8px;
45
- color: var(--text-primary);
46
- font-size: 16px;
47
- font-style: normal;
48
- font-weight: 700;
49
- line-height: 24px;
50
- letter-spacing: -0.6px;
51
- }
52
- .xv-card_body {
53
- flex: 1;
54
- }
55
- .xv-card_body__content, .xv-card_body ::slotted([slot=body]) {
56
- margin: 0 0 8px;
57
- color: var(--text-secondary);
58
- font-size: 14px;
59
- font-style: normal;
60
- font-weight: 400;
61
- line-height: 20px;
62
- letter-spacing: -0.1px;
63
- }