npm - voa-ds-core - Versions diffs - 1.0.36 → 1.0.38 - Mend

voa-ds-core 1.0.36 → 1.0.38

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 (90) hide show

package/dist/custom-elements/voa-pagination.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"voa-pagination.js","mappings":";;;AAAA,MAAM,gBAAgB,GAAG,4KAA4K;;MCOxLA,eAAa,iBAAAC,kBAAA,CAAA,MAAA,aAAA,SAAAC,CAAA,CAAA;AAL1B,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;;AAMU,QAAA,IAAW,CAAA,WAAA,GAAW,CAAC;AACvB,QAAA,IAAU,CAAA,UAAA,GAAW,CAAC;AAE9B;;;AAGG;AACK,QAAA,IAAY,CAAA,YAAA,GAAW,CAAC;AAIvB,QAAA,IAAY,CAAA,YAAA,GAAW,CAAC;AAgHlC;AA7GC,IAAA,gBAAgB,CAAC,GAAW,EAAA;AAC1B,QAAA,IAAI,CAAC,YAAY,GAAG,GAAG;;IAGzB,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,WAAW;;AAG9B,IAAA,WAAW,CAAC,IAAY,EAAA;AAC9B,QAAA,IAAI,IAAI,GAAG,CAAC,IAAI,IAAI,GAAG,IAAI,CAAC,UAAU,IAAI,IAAI,KAAK,IAAI,CAAC,YAAY;YAAE;AACtE,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI;QACxB,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC;;AAG5C;;;AAGG;IACK,kBAAkB,GAAA;QACxB,MAAM,gBAAgB,GAAG,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC;;AAG/C,QAAA,IAAI,gBAAgB,IAAI,IAAI,CAAC,UAAU,EAAE;YACvC,OAAO,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;;AAGjE,QAAA,MAAM,gBAAgB,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC,CAAC;AAC3E,QAAA,MAAM,iBAAiB,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC,UAAU,CAAC;AAE1F,QAAA,MAAM,kBAAkB,GAAG,gBAAgB,GAAG,CAAC;QAC/C,MAAM,mBAAmB,GAAG,iBAAiB,GAAG,IAAI,CAAC,UAAU,GAAG,CAAC;QAEnE,MAAM,cAAc,GAAG,CAAC;AACxB,QAAA,MAAM,aAAa,GAAG,IAAI,CAAC,UAAU;;AAGrC,QAAA,IAAI,CAAC,kBAAkB,IAAI,mBAAmB,EAAE;YAC9C,IAAI,aAAa,GAAG,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,YAAY;YAC7C,IAAI,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,aAAa,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;YACtE,OAAO,CAAC,GAAG,SAAS,EAAE,KAAK,EAAE,aAAa,CAAC;;;AAI7C,QAAA,IAAI,kBAAkB,IAAI,CAAC,mBAAmB,EAAE;YAC9C,IAAI,cAAc,GAAG,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,YAAY;YAC9C,IAAI,UAAU,GAAG,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,cAAc,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,aAAa,GAAG,cAAc,GAAG,CAAC,GAAG,CAAC,CAAC;YACzG,OAAO,CAAC,cAAc,EAAE,KAAK,EAAE,GAAG,UAAU,CAAC;;;AAI/C,QAAA,IAAI,kBAAkB,IAAI,mBAAmB,EAAE;YAC7C,IAAI,WAAW,GAAG,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,iBAAiB,GAAG,gBAAgB,GAAG,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,gBAAgB,GAAG,CAAC,CAAC;AAClH,YAAA,OAAO,CAAC,cAAc,EAAE,KAAK,EAAE,GAAG,WAAW,EAAE,KAAK,EAAE,aAAa,CAAC;;;IAIxE,MAAM,GAAA;AACJ,QAAA,MAAM,eAAe,GAAG,IAAI,CAAC,kBAAkB,EAAE;QAEjD,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,IAAI,EAAC,YAAY,EAAA,YAAA,EAAY,YAAY,EAAA,EAC5C,CAAI,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,iBAAiB,EAAA,EAGzB,CAAA,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACE,CAAA,CAAA,qBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAC,MAAM,EACX,QAAQ,EAAE,IAAI,CAAC,YAAY,KAAK,CAAC,EACjC,WAAW,EAAE,MAAM,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,EAAA,CAC1D,CACC,EAGJ,eAAe,CAAC,GAAG,CAAC,CAAC,UAAU,EAAE,KAAK,KAAI;AACzC,YAAA,IAAI,UAAU,KAAK,KAAK,EAAE;gBACxB,QACE,CAAI,CAAA,IAAA,EAAA,EAAA,GAAG,EAAE,CAAQ,KAAA,EAAA,KAAK,CAAE,CAAA,EAAA,EACtB,CAAA,CAAA,qBAAA,EAAA,EAAqB,IAAI,EAAC,UAAU,EAAG,CAAA,CACpC;;AAIT,YAAA,QACE,CAAA,CAAA,IAAA,EAAA,EAAI,GAAG,EAAE,UAAU,EAAA,EACjB,CACE,CAAA,qBAAA,EAAA,EAAA,MAAM,EAAE,UAAU,KAAK,IAAI,CAAC,YAAY,EACxC,WAAW,EAAE,MAAM,IAAI,CAAC,WAAW,CAAC,UAAoB,CAAC,IAExD,UAAU,CACS,CACnB;SAER,CAAC,EAGF,CAAA,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACE,CAAA,CAAA,qBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAC,MAAM,EACX,QAAQ,EAAE,IAAI,CAAC,YAAY,KAAK,IAAI,CAAC,UAAU,EAC/C,WAAW,EAAE,MAAM,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,GAC1D,CACC,CAEF,CACD,CACD~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~","names":["VoaPagination","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-pagination/voa-pagination.css?tag=voa-pagination&encapsulation=shadow","src/components/voa-pagination/voa-pagination.tsx"],"sourcesContent":[":host {\r\n display: block;\r\n box-sizing: border-box;\r\n}\r\n\r\n.pagination-list {\r\n display: flex;\r\n align-items: center;\r\n list-style: none;\r\n padding: 0;\r\n margin: 0;\r\n gap: 4px;\r\n /* Default gap, can be overridden externally /\r\n}\r\n\r\nli {\r\n display: flex;\r\n margin: 0;\r\n padding: 0;\r\n}","import { Component, Prop, h, Event, EventEmitter, Host, State, Watch } from \"@stencil/core\";\r\n\r\n@Component({\r\n tag: \"voa-pagination\",\r\n styleUrl: \"voa-pagination.css\",\r\n shadow: true,\r\n})\r\nexport class VoaPagination {\r\n @Prop() currentPage: number = 1;\r\n @Prop() totalPages: number = 1;\r\n\r\n /\r\n How many siblings to show around the current page.\r\n * E.g., siblingCount=1 means: ... 4 [5] 6 ...\r\n /\r\n @Prop() siblingCount: number = 1;\r\n\r\n @Event() voaPageChange: EventEmitter<number>;\r\n\r\n @State() internalPage: number = 1;\r\n\r\n @Watch('currentPage')\r\n handlePageChange(val: number) {\r\n this.internalPage = val;\r\n }\r\n\r\n componentWillLoad() {\r\n this.internalPage = this.currentPage;\r\n }\r\n\r\n private onPageClick(page: number) {\r\n if (page < 1 \|\| page > this.totalPages \|\| page === this.internalPage) return;\r\n this.internalPage = page;\r\n this.voaPageChange.emit(this.internalPage);\r\n }\r\n\r\n /\r\n THE ALGORITHM:\r\n * Generates the range of numbers to display.\r\n /\r\n private getPaginationRange() {\r\n const totalPageNumbers = this.siblingCount + 5; // sibling + first + last + current + 2dots\r\n\r\n // Case 1: Total pages is small, show everything\r\n if (totalPageNumbers >= this.totalPages) {\r\n return Array.from({ length: this.totalPages }, (_, i) => i + 1);\r\n }\r\n\r\n const leftSiblingIndex = Math.max(this.internalPage - this.siblingCount, 1);\r\n const rightSiblingIndex = Math.min(this.internalPage + this.siblingCount, this.totalPages);\r\n\r\n const shouldShowLeftDots = leftSiblingIndex > 2;\r\n const shouldShowRightDots = rightSiblingIndex < this.totalPages - 2;\r\n\r\n const firstPageIndex = 1;\r\n const lastPageIndex = this.totalPages;\r\n\r\n // Case 2: No left dots, but right dots shown\r\n if (!shouldShowLeftDots && shouldShowRightDots) {\r\n let leftItemCount = 3 + 2 * this.siblingCount;\r\n let leftRange = Array.from({ length: leftItemCount }, (_, i) => i + 1);\r\n return [...leftRange, '...', lastPageIndex];\r\n }\r\n\r\n // Case 3: No right dots, but left dots shown\r\n if (shouldShowLeftDots && !shouldShowRightDots) {\r\n let rightItemCount = 3 + 2 * this.siblingCount;\r\n let rightRange = Array.from({ length: rightItemCount }, (_, i) => lastPageIndex - rightItemCount + i + 1);\r\n return [firstPageIndex, '...', ...rightRange];\r\n }\r\n\r\n // Case 4: Both dots shown\r\n if (shouldShowLeftDots && shouldShowRightDots) {\r\n let middleRange = Array.from({ length: rightSiblingIndex - leftSiblingIndex + 1 }, (_, i) => leftSiblingIndex + i);\r\n return [firstPageIndex, '...', ...middleRange, '...', lastPageIndex];\r\n }\r\n }\r\n\r\n render() {\r\n const paginationRange = this.getPaginationRange();\r\n\r\n return (\r\n <Host>\r\n <nav role=\"navigation\" aria-label=\"Pagination\">\r\n <ul class=\"pagination-list\">\r\n\r\n {/* Previous Button /}\r\n <li>\r\n <voa-pagination-item\r\n type=\"prev\"\r\n disabled={this.internalPage === 1}\r\n onItemClick={() => this.onPageClick(this.internalPage - 1)}\r\n />\r\n </li>\r\n\r\n {/ Page Numbers /}\r\n {paginationRange.map((pageNumber, index) => {\r\n if (pageNumber === '...') {\r\n return (\r\n <li key={`dots-${index}`}>\r\n <voa-pagination-item type=\"ellipsis\" />\r\n </li>\r\n );\r\n }\r\n\r\n return (\r\n <li key={pageNumber}>\r\n <voa-pagination-item\r\n active={pageNumber === this.internalPage}\r\n onItemClick={() => this.onPageClick(pageNumber as number)}\r\n >\r\n {pageNumber}\r\n </voa-pagination-item>\r\n </li>\r\n );\r\n })}\r\n\r\n {/ Next Button */}\r\n <li>\r\n <voa-pagination-item\r\n type=\"next\"\r\n disabled={this.internalPage === this.totalPages}\r\n onItemClick={() => this.onPageClick(this.internalPage + 1)}\r\n />\r\n </li>\r\n\r\n </ul>\r\n </nav>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"voa-pagination.js","mappings":"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","names":["VoaPagination","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-pagination/voa-pagination.css?tag=voa-pagination&encapsulation=shadow","src/components/voa-pagination/voa-pagination.tsx"],"sourcesContent":[":host {\r\n display: block;\r\n box-sizing: border-box;\r\n}\r\n\r\n.pagination-list {\r\n display: flex;\r\n align-items: center;\r\n list-style: none;\r\n padding: 0;\r\n margin: 0;\r\n gap: 4px;\r\n /* Default gap, can be overridden externally /\r\n}\r\n\r\nli {\r\n display: flex;\r\n margin: 0;\r\n padding: 0;\r\n}","import { Component, Prop, h, Event, EventEmitter, Host, State, Watch } from \"@stencil/core\";\r\n\r\n@Component({\r\n tag: \"voa-pagination\",\r\n styleUrl: \"voa-pagination.css\",\r\n shadow: true,\r\n})\r\nexport class VoaPagination {\r\n @Prop() currentPage: number = 1;\r\n @Prop() totalPages: number = 1;\r\n\r\n /\r\n How many siblings to show around the current page.\r\n * E.g., siblingCount=1 means: ... 4 [5] 6 ...\r\n /\r\n @Prop() siblingCount: number = 1;\r\n\r\n @Event() voaPageChange: EventEmitter<number>;\r\n\r\n @State() internalPage: number = 1;\r\n\r\n @Watch('currentPage')\r\n handlePageChange(val: number) {\r\n this.internalPage = val;\r\n }\r\n\r\n componentWillLoad() {\r\n this.internalPage = this.currentPage;\r\n }\r\n\r\n private onPageClick(page: number) {\r\n if (page < 1 \|\| page > this.totalPages \|\| page === this.internalPage) return;\r\n this.internalPage = page;\r\n this.voaPageChange.emit(this.internalPage);\r\n }\r\n\r\n /\r\n THE ALGORITHM:\r\n * Generates the range of numbers to display.\r\n /\r\n private getPaginationRange() {\r\n const totalPageNumbers = this.siblingCount + 5; // sibling + first + last + current + 2dots\r\n\r\n // Case 1: Total pages is small, show everything\r\n if (totalPageNumbers >= this.totalPages) {\r\n return Array.from({ length: this.totalPages }, (_, i) => i + 1);\r\n }\r\n\r\n const leftSiblingIndex = Math.max(this.internalPage - this.siblingCount, 1);\r\n const rightSiblingIndex = Math.min(this.internalPage + this.siblingCount, this.totalPages);\r\n\r\n const shouldShowLeftDots = leftSiblingIndex > 2;\r\n const shouldShowRightDots = rightSiblingIndex < this.totalPages - 2;\r\n\r\n const firstPageIndex = 1;\r\n const lastPageIndex = this.totalPages;\r\n\r\n // Case 2: No left dots, but right dots shown\r\n if (!shouldShowLeftDots && shouldShowRightDots) {\r\n let leftItemCount = 3 + 2 * this.siblingCount;\r\n let leftRange = Array.from({ length: leftItemCount }, (_, i) => i + 1);\r\n return [...leftRange, '...', lastPageIndex];\r\n }\r\n\r\n // Case 3: No right dots, but left dots shown\r\n if (shouldShowLeftDots && !shouldShowRightDots) {\r\n let rightItemCount = 3 + 2 * this.siblingCount;\r\n let rightRange = Array.from({ length: rightItemCount }, (_, i) => lastPageIndex - rightItemCount + i + 1);\r\n return [firstPageIndex, '...', ...rightRange];\r\n }\r\n\r\n // Case 4: Both dots shown\r\n if (shouldShowLeftDots && shouldShowRightDots) {\r\n let middleRange = Array.from({ length: rightSiblingIndex - leftSiblingIndex + 1 }, (_, i) => leftSiblingIndex + i);\r\n return [firstPageIndex, '...', ...middleRange, '...', lastPageIndex];\r\n }\r\n }\r\n\r\n render() {\r\n const paginationRange = this.getPaginationRange();\r\n\r\n return (\r\n <Host>\r\n <nav role=\"navigation\" aria-label=\"Pagination\">\r\n <ul class=\"pagination-list\">\r\n\r\n {/* Previous Button /}\r\n <li>\r\n <voa-pagination-item\r\n type=\"prev\"\r\n disabled={this.internalPage === 1}\r\n onItemClick={() => this.onPageClick(this.internalPage - 1)}\r\n />\r\n </li>\r\n\r\n {/ Page Numbers /}\r\n {paginationRange.map((pageNumber, index) => {\r\n if (pageNumber === '...') {\r\n return (\r\n <li key={`dots-${index}`}>\r\n <voa-pagination-item type=\"ellipsis\" />\r\n </li>\r\n );\r\n }\r\n\r\n return (\r\n <li key={pageNumber}>\r\n <voa-pagination-item\r\n active={pageNumber === this.internalPage}\r\n onItemClick={() => this.onPageClick(pageNumber as number)}\r\n >\r\n {pageNumber}\r\n </voa-pagination-item>\r\n </li>\r\n );\r\n })}\r\n\r\n {/ Next Button */}\r\n <li>\r\n <voa-pagination-item\r\n type=\"next\"\r\n disabled={this.internalPage === this.totalPages}\r\n onItemClick={() => this.onPageClick(this.internalPage + 1)}\r\n />\r\n </li>\r\n\r\n </ul>\r\n </nav>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/custom-elements/voa-progress.js CHANGED Viewed

@@ -31,7 +31,6 @@ function defineCustomElement$1() {
             break;
     } });
 }
-defineCustomElement$1();
 const VoaProgress = Progress;
 const defineCustomElement = defineCustomElement$1;

package/dist/custom-elements/voa-progress.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"voa-progress.js","mappings":";;AAAA,MAAM,WAAW,GAAG,+IAA+I;;MCOtJ,QAAQ,iBAAAA,kBAAA,CAAA,MAAA,QAAA,SAAAC,CAAA,CAAA;AALrB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;AAMU,QAAA,IAAK,CAAA,KAAA,GAAW,CAAC;AAS1B;IAPC,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,UAAU,EAAA,EACnB,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,KAAK,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,KAAK,CAAG,CAAA,CAAA,EAAE,EAAQ,CAAA,CACvD~~;;;;;;;;;;;;;;;;;;;;;;;;;;~~","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-progress/progress.css?tag=voa-progress&encapsulation=shadow","src/components/voa-progress/progress.tsx"],"sourcesContent":[".progress {\r\n width: 100%;\r\n background-color: #eee;\r\n border-radius: 4px;\r\n overflow: hidden;\r\n}\r\n\r\n.bar {\r\n height: 20px;\r\n background-color: #007bff;\r\n transition: width 0.2s;\r\n}\r\n","import { Component, Prop, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n tag: \"voa-progress\",\r\n styleUrl: \"progress.css\",\r\n shadow: true,\r\n})\r\nexport class Progress {\r\n @Prop() value: number = 0;\r\n\r\n render() {\r\n return (\r\n <div class=\"progress\">\r\n <div class=\"bar\" style={{ width: `${this.value}%` }}></div>\r\n </div>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"voa-progress.js","mappings":";;AAAA,MAAM,WAAW,GAAG,+IAA+I;;MCOtJ,QAAQ,iBAAAA,kBAAA,CAAA,MAAA,QAAA,SAAAC,CAAA,CAAA;AALrB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;AAMU,QAAA,IAAK,CAAA,KAAA,GAAW,CAAC;AAS1B;IAPC,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,UAAU,EAAA,EACnB,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,KAAK,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,KAAK,CAAG,CAAA,CAAA,EAAE,EAAQ,CAAA,CACvD;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-progress/progress.css?tag=voa-progress&encapsulation=shadow","src/components/voa-progress/progress.tsx"],"sourcesContent":[".progress {\r\n width: 100%;\r\n background-color: #eee;\r\n border-radius: 4px;\r\n overflow: hidden;\r\n}\r\n\r\n.bar {\r\n height: 20px;\r\n background-color: #007bff;\r\n transition: width 0.2s;\r\n}\r\n","import { Component, Prop, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n tag: \"voa-progress\",\r\n styleUrl: \"progress.css\",\r\n shadow: true,\r\n})\r\nexport class Progress {\r\n @Prop() value: number = 0;\r\n\r\n render() {\r\n return (\r\n <div class=\"progress\">\r\n <div class=\"bar\" style={{ width: `${this.value}%` }}></div>\r\n </div>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/custom-elements/voa-radio.js CHANGED Viewed

@@ -77,7 +77,6 @@ function defineCustomElement$1() {
             break;
     } });
 }
-defineCustomElement$1();
 const VoaRadio = VoaRadio$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/custom-elements/voa-radio.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"voa-radio.js","mappings":";;AAAA,MAAM,WAAW,GAAG,g0BAAg0B;;MCmBv0BA,UAAQ,iBAAAC,kBAAA,CAAA,MAAA,QAAA,SAAAC,CAAA,CAAA;AANrB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;;;;AAQE;;AAEG;AACsB,QAAA,IAAO,CAAA,OAAA,GAAY,KAAK;AAEjD;;AAEG;AACsB,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AA2B1C,QAAA,IAAA,CAAA,YAAY,GAAG,CAAC,KAAY,KAAI;AACtC,YAAA,MAAM,KAAK,GAAG,KAAK,CAAC,MAA0B;AAC9C,YAAA,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC,OAAO;AAE5B,YAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC;gBACpB,OAAO,EAAE,IAAI,CAAC,OAAO;gBACrB,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,IAAI,EAAE,IAAI,CAAC;AACZ,aAAA,CAAC;AACJ,SAAC;AAEO,QAAA,IAAW,CAAA,WAAA,GAAG,MAAK;AACzB,YAAA,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE;AACxB,SAAC;AAEO,QAAA,IAAU,CAAA,UAAA,GAAG,MAAK;AACxB,YAAA,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE;AACvB,SAAC;AA+CF;AA7CC;;;AAGG;AAEH,IAAA,MAAM,QAAQ,GAAA;;AACZ,QAAA,MAAM,KAAK,GAAG,CAAA,EAAA,GAAA,IAAI,CAAC,IAAI,CAAC,UAAU,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,aAAa,CAAC,qBAAqB,CAAqB;QAC5F,IAAI,KAAK,EAAE;YACT,KAAK,CAAC,KAAK,EAAE;;;IAIjB,MAAM,GAAA;AACJ,QAAA,MAAM,gBAAgB,GAAG;AACvB,YAAA,WAAW,EAAE,IAAI;YACjB,oBAAoB,EAAE,IAAI,CAAC,OAAO;YAClC,qBAAqB,EAAE,IAAI,CAAC;SAC7B;AAED,QAAA,QACE,CACE,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,gBAAgB,EAAA,eAAA,EACR,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,SAAS,EACjD,IAAI,EAAC,OAAO,kBACE,IAAI,CAAC,OAAO,GAAG,MAAM,GAAG,OAAO,EAAA,EAE7C,CACE,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,kBAAkB,EACxB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,IAAI,CAAC,YAAY,EAC3B,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,MAAM,EAAE,IAAI,CAAC,UAAU,EACvB,CAAA,EACF,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,sBAAsB,EAAC,IAAI,EAAC,WAAW,EAAA,EACjD,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,gBAAgB,EAAC,IAAI,EAAC,KAAK,EAAQ,CAAA,CAC1C,CACD~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~","names":["VoaRadio","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-radio/voa-radio.css?tag=voa-radio&encapsulation=shadow","src/components/voa-radio/voa-radio.tsx"],"sourcesContent":["/* \r\n * UNSTYLED PATTERN: This file contains ONLY structural CSS (layout, positioning).\r\n * All visual styles (colors, backgrounds, fonts, spacing) must be applied externally\r\n * via CSS Parts API (::part() selectors) using design tokens.\r\n /\r\n\r\n:host {\r\n display: inline-block;\r\n}\r\n\r\n.voa-radio {\r\n / Structural styles only /\r\n display: inline-flex;\r\n align-items: center;\r\n position: relative;\r\n user-select: none;\r\n cursor: pointer;\r\n box-sizing: border-box;\r\n}\r\n\r\n.voa-radio--disabled {\r\n cursor: not-allowed;\r\n pointer-events: none;\r\n}\r\n\r\n.voa-radio__input {\r\n / Structural styles only - visually hidden but accessible /\r\n position: absolute;\r\n opacity: 0;\r\n width: 0;\r\n height: 0;\r\n margin: 0;\r\n padding: 0;\r\n pointer-events: none;\r\n}\r\n\r\n.voa-radio__indicator {\r\n / Structural styles only - Tamanho fixo 20px conforme Figma /\r\n position: relative;\r\n display: grid;\r\n place-content: center;\r\n flex-shrink: 0;\r\n box-sizing: border-box;\r\n width: 20px;\r\n height: 20px;\r\n border-radius: 50%;\r\n}\r\n\r\n.voa-radio__dot {\r\n / Structural styles only - Tamanho fixo 8px conforme Figma /\r\n position: absolute;\r\n / Centralizar perfeitamente independente de borders /\r\n left: 50%;\r\n top: 50%;\r\n / Usar margin negativo para centralizar baseado no tamanho do dot (8px / 2 = 4px) /\r\n margin-left: -4px;\r\n margin-top: -4px;\r\n width: 8px;\r\n height: 8px;\r\n border-radius: 50%;\r\n transform: scale(0);\r\n box-sizing: border-box;\r\n opacity: 0;\r\n}\r\n\r\n.voa-radio--checked .voa-radio__dot {\r\n transform: scale(1);\r\n opacity: 1;\r\n}\r\n\r\n/ Acessibilidade /\r\n:host(:focus-within) {\r\n outline: none;\r\n}\r\n\r\n/ Respeitar preferências de movimento reduzido /\r\n@media (prefers-reduced-motion: reduce) {\r\n .voa-radio__indicator,\r\n .voa-radio__dot {\r\n transition: none;\r\n }\r\n} ","import { Component, Prop, Event, EventEmitter, Method, Element, h } from '@stencil/core';\r\n\r\n/\r\n Componente Radio Button do Voa Design System, baseado no design do Figma.\r\n * Permite seleção única dentro de um grupo de opções.\r\n * Este é o componente base do radio (apenas o indicador visual).\r\n * Para opções com label, use o componente voa-option.\r\n * \r\n * @part base - The root label element\r\n * @part input - The native radio input element\r\n * @part indicator - The visual radio indicator circle (20px)\r\n * @part dot - The inner dot when checked (8px)\r\n /\r\n@Component({\r\n tag: 'voa-radio',\r\n styleUrl: 'voa-radio.css',\r\n shadow: true,\r\n scoped: false // Permite herdar variáveis CSS do contexto pai\r\n})\r\nexport class VoaRadio {\r\n @Element() host: HTMLVoaRadioElement;\r\n /\r\n Se verdadeiro, o radio button estará selecionado.\r\n /\r\n @Prop({ reflect: true }) checked: boolean = false;\r\n\r\n /\r\n Se verdadeiro, o radio button estará desabilitado.\r\n /\r\n @Prop({ reflect: true }) disabled: boolean = false;\r\n\r\n /\r\n Nome do grupo de radio buttons (usado para agrupamento).\r\n /\r\n @Prop() name: string;\r\n\r\n /\r\n Valor do radio button quando selecionado.\r\n /\r\n @Prop() value: string;\r\n\r\n /\r\n Evento emitido quando o estado do radio button muda.\r\n /\r\n @Event() radioChange: EventEmitter<{ checked: boolean; value: string; name: string }>;\r\n\r\n /\r\n Evento emitido quando o radio button recebe foco.\r\n /\r\n @Event() radioFocus: EventEmitter<void>;\r\n\r\n /\r\n Evento emitido quando o radio button perde foco.\r\n /\r\n @Event() radioBlur: EventEmitter<void>;\r\n\r\n private handleChange = (event: Event) => {\r\n const input = event.target as HTMLInputElement;\r\n this.checked = input.checked;\r\n \r\n this.radioChange.emit({\r\n checked: this.checked,\r\n value: this.value,\r\n name: this.name\r\n });\r\n };\r\n\r\n private handleFocus = () => {\r\n this.radioFocus.emit();\r\n };\r\n\r\n private handleBlur = () => {\r\n this.radioBlur.emit();\r\n };\r\n\r\n /\r\n Método para delegar foco ao elemento interno do radio.\r\n * Requerido para acessibilidade WCAG 2.2 AA.\r\n */\r\n @Method()\r\n async setFocus(): Promise<void> {\r\n const input = this.host.shadowRoot?.querySelector('input[type=\"radio\"]') as HTMLInputElement;\r\n if (input) {\r\n input.focus();\r\n }\r\n }\r\n\r\n render() {\r\n const containerClasses = {\r\n 'voa-radio': true,\r\n 'voa-radio--checked': this.checked,\r\n 'voa-radio--disabled': this.disabled\r\n };\r\n\r\n return (\r\n <label \r\n part=\"base\"\r\n class={containerClasses}\r\n aria-disabled={this.disabled ? 'true' : undefined}\r\n role=\"radio\"\r\n aria-checked={this.checked ? 'true' : 'false'}\r\n >\r\n <input\r\n type=\"radio\"\r\n part=\"input\"\r\n class=\"voa-radio__input\"\r\n checked={this.checked}\r\n disabled={this.disabled}\r\n name={this.name}\r\n value={this.value}\r\n onChange={this.handleChange}\r\n onFocus={this.handleFocus}\r\n onBlur={this.handleBlur}\r\n />\r\n <span class=\"voa-radio__indicator\" part=\"indicator\">\r\n <span class=\"voa-radio__dot\" part=\"dot\"></span>\r\n </span>\r\n </label>\r\n );\r\n }\r\n} "],"version":3}
1	+ {"file":"voa-radio.js","mappings":";;AAAA,MAAM,WAAW,GAAG,g0BAAg0B;;MCmBv0BA,UAAQ,iBAAAC,kBAAA,CAAA,MAAA,QAAA,SAAAC,CAAA,CAAA;AANrB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;;;;AAQE;;AAEG;AACsB,QAAA,IAAO,CAAA,OAAA,GAAY,KAAK;AAEjD;;AAEG;AACsB,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AA2B1C,QAAA,IAAA,CAAA,YAAY,GAAG,CAAC,KAAY,KAAI;AACtC,YAAA,MAAM,KAAK,GAAG,KAAK,CAAC,MAA0B;AAC9C,YAAA,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC,OAAO;AAE5B,YAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC;gBACpB,OAAO,EAAE,IAAI,CAAC,OAAO;gBACrB,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,IAAI,EAAE,IAAI,CAAC;AACZ,aAAA,CAAC;AACJ,SAAC;AAEO,QAAA,IAAW,CAAA,WAAA,GAAG,MAAK;AACzB,YAAA,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE;AACxB,SAAC;AAEO,QAAA,IAAU,CAAA,UAAA,GAAG,MAAK;AACxB,YAAA,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE;AACvB,SAAC;AA+CF;AA7CC;;;AAGG;AAEH,IAAA,MAAM,QAAQ,GAAA;;AACZ,QAAA,MAAM,KAAK,GAAG,CAAA,EAAA,GAAA,IAAI,CAAC,IAAI,CAAC,UAAU,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,aAAa,CAAC,qBAAqB,CAAqB;QAC5F,IAAI,KAAK,EAAE;YACT,KAAK,CAAC,KAAK,EAAE;;;IAIjB,MAAM,GAAA;AACJ,QAAA,MAAM,gBAAgB,GAAG;AACvB,YAAA,WAAW,EAAE,IAAI;YACjB,oBAAoB,EAAE,IAAI,CAAC,OAAO;YAClC,qBAAqB,EAAE,IAAI,CAAC;SAC7B;AAED,QAAA,QACE,CACE,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,gBAAgB,EAAA,eAAA,EACR,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,SAAS,EACjD,IAAI,EAAC,OAAO,kBACE,IAAI,CAAC,OAAO,GAAG,MAAM,GAAG,OAAO,EAAA,EAE7C,CACE,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,kBAAkB,EACxB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,IAAI,CAAC,YAAY,EAC3B,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,MAAM,EAAE,IAAI,CAAC,UAAU,EACvB,CAAA,EACF,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,sBAAsB,EAAC,IAAI,EAAC,WAAW,EAAA,EACjD,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,gBAAgB,EAAC,IAAI,EAAC,KAAK,EAAQ,CAAA,CAC1C,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["VoaRadio","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-radio/voa-radio.css?tag=voa-radio&encapsulation=shadow","src/components/voa-radio/voa-radio.tsx"],"sourcesContent":["/* \r\n * UNSTYLED PATTERN: This file contains ONLY structural CSS (layout, positioning).\r\n * All visual styles (colors, backgrounds, fonts, spacing) must be applied externally\r\n * via CSS Parts API (::part() selectors) using design tokens.\r\n /\r\n\r\n:host {\r\n display: inline-block;\r\n}\r\n\r\n.voa-radio {\r\n / Structural styles only /\r\n display: inline-flex;\r\n align-items: center;\r\n position: relative;\r\n user-select: none;\r\n cursor: pointer;\r\n box-sizing: border-box;\r\n}\r\n\r\n.voa-radio--disabled {\r\n cursor: not-allowed;\r\n pointer-events: none;\r\n}\r\n\r\n.voa-radio__input {\r\n / Structural styles only - visually hidden but accessible /\r\n position: absolute;\r\n opacity: 0;\r\n width: 0;\r\n height: 0;\r\n margin: 0;\r\n padding: 0;\r\n pointer-events: none;\r\n}\r\n\r\n.voa-radio__indicator {\r\n / Structural styles only - Tamanho fixo 20px conforme Figma /\r\n position: relative;\r\n display: grid;\r\n place-content: center;\r\n flex-shrink: 0;\r\n box-sizing: border-box;\r\n width: 20px;\r\n height: 20px;\r\n border-radius: 50%;\r\n}\r\n\r\n.voa-radio__dot {\r\n / Structural styles only - Tamanho fixo 8px conforme Figma /\r\n position: absolute;\r\n / Centralizar perfeitamente independente de borders /\r\n left: 50%;\r\n top: 50%;\r\n / Usar margin negativo para centralizar baseado no tamanho do dot (8px / 2 = 4px) /\r\n margin-left: -4px;\r\n margin-top: -4px;\r\n width: 8px;\r\n height: 8px;\r\n border-radius: 50%;\r\n transform: scale(0);\r\n box-sizing: border-box;\r\n opacity: 0;\r\n}\r\n\r\n.voa-radio--checked .voa-radio__dot {\r\n transform: scale(1);\r\n opacity: 1;\r\n}\r\n\r\n/ Acessibilidade /\r\n:host(:focus-within) {\r\n outline: none;\r\n}\r\n\r\n/ Respeitar preferências de movimento reduzido /\r\n@media (prefers-reduced-motion: reduce) {\r\n .voa-radio__indicator,\r\n .voa-radio__dot {\r\n transition: none;\r\n }\r\n} ","import { Component, Prop, Event, EventEmitter, Method, Element, h } from '@stencil/core';\r\n\r\n/\r\n Componente Radio Button do Voa Design System, baseado no design do Figma.\r\n * Permite seleção única dentro de um grupo de opções.\r\n * Este é o componente base do radio (apenas o indicador visual).\r\n * Para opções com label, use o componente voa-option.\r\n * \r\n * @part base - The root label element\r\n * @part input - The native radio input element\r\n * @part indicator - The visual radio indicator circle (20px)\r\n * @part dot - The inner dot when checked (8px)\r\n /\r\n@Component({\r\n tag: 'voa-radio',\r\n styleUrl: 'voa-radio.css',\r\n shadow: true,\r\n scoped: false // Permite herdar variáveis CSS do contexto pai\r\n})\r\nexport class VoaRadio {\r\n @Element() host: HTMLVoaRadioElement;\r\n /\r\n Se verdadeiro, o radio button estará selecionado.\r\n /\r\n @Prop({ reflect: true }) checked: boolean = false;\r\n\r\n /\r\n Se verdadeiro, o radio button estará desabilitado.\r\n /\r\n @Prop({ reflect: true }) disabled: boolean = false;\r\n\r\n /\r\n Nome do grupo de radio buttons (usado para agrupamento).\r\n /\r\n @Prop() name: string;\r\n\r\n /\r\n Valor do radio button quando selecionado.\r\n /\r\n @Prop() value: string;\r\n\r\n /\r\n Evento emitido quando o estado do radio button muda.\r\n /\r\n @Event() radioChange: EventEmitter<{ checked: boolean; value: string; name: string }>;\r\n\r\n /\r\n Evento emitido quando o radio button recebe foco.\r\n /\r\n @Event() radioFocus: EventEmitter<void>;\r\n\r\n /\r\n Evento emitido quando o radio button perde foco.\r\n /\r\n @Event() radioBlur: EventEmitter<void>;\r\n\r\n private handleChange = (event: Event) => {\r\n const input = event.target as HTMLInputElement;\r\n this.checked = input.checked;\r\n \r\n this.radioChange.emit({\r\n checked: this.checked,\r\n value: this.value,\r\n name: this.name\r\n });\r\n };\r\n\r\n private handleFocus = () => {\r\n this.radioFocus.emit();\r\n };\r\n\r\n private handleBlur = () => {\r\n this.radioBlur.emit();\r\n };\r\n\r\n /\r\n Método para delegar foco ao elemento interno do radio.\r\n * Requerido para acessibilidade WCAG 2.2 AA.\r\n */\r\n @Method()\r\n async setFocus(): Promise<void> {\r\n const input = this.host.shadowRoot?.querySelector('input[type=\"radio\"]') as HTMLInputElement;\r\n if (input) {\r\n input.focus();\r\n }\r\n }\r\n\r\n render() {\r\n const containerClasses = {\r\n 'voa-radio': true,\r\n 'voa-radio--checked': this.checked,\r\n 'voa-radio--disabled': this.disabled\r\n };\r\n\r\n return (\r\n <label \r\n part=\"base\"\r\n class={containerClasses}\r\n aria-disabled={this.disabled ? 'true' : undefined}\r\n role=\"radio\"\r\n aria-checked={this.checked ? 'true' : 'false'}\r\n >\r\n <input\r\n type=\"radio\"\r\n part=\"input\"\r\n class=\"voa-radio__input\"\r\n checked={this.checked}\r\n disabled={this.disabled}\r\n name={this.name}\r\n value={this.value}\r\n onChange={this.handleChange}\r\n onFocus={this.handleFocus}\r\n onBlur={this.handleBlur}\r\n />\r\n <span class=\"voa-radio__indicator\" part=\"indicator\">\r\n <span class=\"voa-radio__dot\" part=\"dot\"></span>\r\n </span>\r\n </label>\r\n );\r\n }\r\n} "],"version":3}

package/dist/custom-elements/voa-select-base.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { V as VoaSelectBase$1, d as defineCustomElement$1 } from './p-DKnM_Ozb.js';
+import { V as VoaSelectBase$1, d as defineCustomElement$1 } from './p-Rm77U17w.js';
 const VoaSelectBase = VoaSelectBase$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/custom-elements/voa-select.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, c as createEvent, h, a as Host } from './index.js';
-import { d as defineCustomElement$2 } from './p-DKnM_Ozb.js';
+import { d as defineCustomElement$2 } from './p-Rm77U17w.js';
 const voaSelectCss = ":host{display:block;width:100%;position:relative;box-sizing:border-box}.voa-select{display:flex;flex-direction:column;position:relative;width:100%;box-sizing:border-box;overflow:visible}.voa-select__header{display:flex;align-items:center;justify-content:space-between;width:100%;box-sizing:border-box}.voa-select__label{flex:1 0 0;box-sizing:border-box}.voa-select__info{display:flex;align-items:center;gap:4px;box-sizing:border-box}.voa-select__info-message{box-sizing:border-box;white-space:nowrap}.voa-select__icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;box-sizing:border-box}.voa-select__input{display:flex;position:relative;width:100%;box-sizing:border-box;overflow:visible}.voa-select__input-wrapper{display:flex;align-items:center;gap:8px;width:100%;height:100%;box-sizing:border-box;position:relative}.voa-select__content{flex:1 0 0;min-width:0;height:100%;box-sizing:border-box;position:relative;overflow:visible}.voa-select__error{display:block;width:100%;box-sizing:border-box}.voa-select__input--disabled{pointer-events:none;cursor:not-allowed}";
@@ -178,7 +178,6 @@ function defineCustomElement$1() {
             break;
     } });
 }
-defineCustomElement$1();
 const VoaSelect = VoaSelect$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/custom-elements/voa-select.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"voa-select.js","mappings":"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","names":["VoaSelect","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-select/voa-select.css?tag=voa-select&encapsulation=shadow","src/components/voa-select/voa-select.tsx"],"sourcesContent":["/* \r\n * UNSTYLED PATTERN: This file contains ONLY structural CSS (layout, positioning).\r\n * All visual styles (colors, backgrounds, fonts, spacing) must be applied externally\r\n * via CSS Parts API (::part() selectors) using design tokens.\r\n /\r\n\r\n:host {\r\n display: block;\r\n width: 100%;\r\n position: relative;\r\n box-sizing: border-box;\r\n}\r\n\r\n.voa-select {\r\n / Structural styles only /\r\n display: flex;\r\n flex-direction: column;\r\n position: relative;\r\n width: 100%;\r\n box-sizing: border-box;\r\n / Garantir que dropdowns filhos possam aparecer acima /\r\n overflow: visible;\r\n}\r\n\r\n/ Header /\r\n.voa-select__header {\r\n / Structural styles only /\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n width: 100%;\r\n box-sizing: border-box;\r\n}\r\n\r\n.voa-select__label {\r\n / Structural styles only /\r\n flex: 1 0 0;\r\n box-sizing: border-box;\r\n}\r\n\r\n.voa-select__info {\r\n / Structural styles only /\r\n display: flex;\r\n align-items: center;\r\n gap: 4px;\r\n box-sizing: border-box;\r\n}\r\n\r\n.voa-select__info-message {\r\n / Structural styles only /\r\n box-sizing: border-box;\r\n white-space: nowrap;\r\n}\r\n\r\n.voa-select__icon {\r\n / Structural styles only /\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n box-sizing: border-box;\r\n}\r\n\r\n/ Input Container /\r\n.voa-select__input {\r\n / Structural styles only /\r\n display: flex;\r\n position: relative;\r\n width: 100%;\r\n box-sizing: border-box;\r\n / Garantir que o dropdown possa ser posicionado relativamente a este container /\r\n overflow: visible;\r\n}\r\n\r\n.voa-select__input-wrapper {\r\n / Structural styles only /\r\n display: flex;\r\n align-items: center;\r\n gap: 8px;\r\n width: 100%;\r\n height: 100%;\r\n box-sizing: border-box;\r\n position: relative;\r\n}\r\n\r\n.voa-select__content {\r\n / Structural styles only /\r\n flex: 1 0 0;\r\n min-width: 0;\r\n height: 100%;\r\n box-sizing: border-box;\r\n / Garantir que o dropdown dentro do voa-select-base possa ser posicionado /\r\n position: relative;\r\n overflow: visible;\r\n}\r\n\r\n/ Error Message /\r\n.voa-select__error {\r\n / Structural styles only /\r\n display: block;\r\n width: 100%;\r\n box-sizing: border-box;\r\n}\r\n\r\n/ Estados estruturais /\r\n.voa-select__input--disabled {\r\n pointer-events: none;\r\n cursor: not-allowed;\r\n}","import { Component, Host, h, Prop, State, Event, EventEmitter, Element, Method, Watch, Listen } from '@stencil/core';\r\n\r\n/\r\n Componente Select principal do Voa Design System, baseado no design do Figma.\r\n * \r\n * Este componente orquestra os subcomponentes voa-select-base e voa-container-multi-select,\r\n * adicionando funcionalidades de label, info, ícone e mensagem de erro.\r\n * \r\n * @part base - O elemento raiz do componente\r\n * @part header - Container do header (label + info)\r\n * @part label - Texto do label\r\n * @part info - Container de informação\r\n * @part input-wrapper - Wrapper do input field\r\n * @part input - Container do input (com borda)\r\n * @part error-message - Mensagem de erro\r\n /\r\n@Component({\r\n tag: 'voa-select',\r\n styleUrl: 'voa-select.css',\r\n shadow: true,\r\n scoped: false // Permite herdar variáveis CSS do contexto pai\r\n})\r\nexport class VoaSelect {\r\n @Element() host: HTMLVoaSelectElement;\r\n\r\n /\r\n Tipo de seleção: 'simple' para seleção única\r\n * NOTA: 'multi' está temporariamente desabilitado até implementação correta\r\n /\r\n @Prop({ reflect: true }) type: 'simple' = 'simple';\r\n\r\n /\r\n Texto do label exibido acima do input\r\n /\r\n @Prop() label?: string;\r\n\r\n /\r\n Se verdadeiro, o label será exibido\r\n /\r\n @Prop() showLabel: boolean = true;\r\n\r\n /\r\n Se verdadeiro, a informação adicional será exibida\r\n /\r\n @Prop() info: boolean = false;\r\n\r\n /\r\n Mensagem de informação adicional\r\n /\r\n @Prop() infoMessage?: string;\r\n\r\n /\r\n Se verdadeiro, o select terá estado de erro\r\n /\r\n @Prop() error: boolean = false;\r\n\r\n /\r\n Mensagem de erro exibida abaixo do input\r\n /\r\n @Prop() errorMessage?: string;\r\n\r\n /\r\n Texto de placeholder\r\n /\r\n @Prop() placeholder: string = 'Placeholder';\r\n\r\n /\r\n THE TRUTH. Read-only from parent.\r\n /\r\n @Prop() value?: string;\r\n\r\n /\r\n Internal Reality.\r\n /\r\n @State() innerValue?: string;\r\n\r\n /\r\n Lista de opções para seleção\r\n /\r\n @Prop() options: Array<{value: string, label: string, disabled?: boolean}> = [];\r\n\r\n /\r\n Se verdadeiro, o select estará desabilitado\r\n /\r\n @Prop() disabled: boolean = false;\r\n\r\n /\r\n Estado interno para controlar o foco\r\n /\r\n @State() isFocused: boolean = false;\r\n\r\n /\r\n Estado interno calculado (default, selected, focused, filled, disabled)\r\n /\r\n @State() private currentState: 'default' \| 'selected' \| 'focused' \| 'filled' \| 'disabled' = 'default';\r\n\r\n /\r\n Evento emitido quando o valor é alterado\r\n /\r\n @Event() voaSelectChange: EventEmitter<string>;\r\n\r\n componentWillLoad() {\r\n this.innerValue = this.value;\r\n this.updateState();\r\n }\r\n\r\n @Watch('value')\r\n syncValue(val: string) {\r\n this.innerValue = val;\r\n this.updateState();\r\n }\r\n\r\n /\r\n Atualiza o estado interno baseado nas props\r\n /\r\n @Watch('disabled')\r\n @Watch('isFocused')\r\n updateState() {\r\n if (this.disabled) {\r\n this.currentState = 'disabled';\r\n } else if (this.isFocused) {\r\n this.currentState = 'focused';\r\n } else if (this.hasValue()) {\r\n // Se há valor selecionado, é \"filled\" ou \"selected\"\r\n this.currentState = 'filled';\r\n if (this.hasSelectedValue()) {\r\n this.currentState = 'selected';\r\n }\r\n } else {\r\n this.currentState = 'default';\r\n }\r\n }\r\n\r\n /\r\n Verifica se há valor selecionado\r\n /\r\n private hasValue(): boolean {\r\n return !!this.innerValue && this.innerValue !== '';\r\n }\r\n\r\n /\r\n Verifica se há valor selecionado (para estado selected)\r\n /\r\n private hasSelectedValue(): boolean {\r\n return this.hasValue();\r\n }\r\n\r\n /\r\n Manipula mudança de valor no select-base\r\n /\r\n private handleChange = (event: CustomEvent<string>) => {\r\n this.innerValue = event.detail;\r\n this.voaSelectChange.emit(event.detail);\r\n };\r\n\r\n /\r\n Listen to focus event on the internal button\r\n /\r\n @Listen('focus', { capture: true })\r\n handleFocus() {\r\n this.isFocused = true;\r\n this.updateState();\r\n }\r\n\r\n /\r\n Listen to blur event on the internal button\r\n /\r\n @Listen('blur', { capture: true })\r\n handleBlur() {\r\n this.isFocused = false;\r\n this.updateState();\r\n }\r\n\r\n /\r\n Método para delegar foco ao elemento interno do select.\r\n * Requerido para acessibilidade WCAG 2.2 AA.\r\n /\r\n @Method()\r\n async setFocus(): Promise<void> {\r\n const selectBase = this.host.shadowRoot?.querySelector('voa-select-base') as any;\r\n if (selectBase && typeof selectBase.setFocus === 'function') {\r\n await selectBase.setFocus();\r\n }\r\n }\r\n\r\n render() {\r\n // Verificar se há slot de ícone (apenas para renderização condicional)\r\n const iconSlot = this.host.querySelector('[slot=\"icon\"]') \|\| this.host.querySelector('[slot=\"prefix\"]');\r\n\r\n return (\r\n <Host\r\n role=\"group\"\r\n aria-disabled={this.disabled ? 'true' : undefined}\r\n data-state={this.currentState}\r\n >\r\n <div part=\"base\" class=\"voa-select\">\r\n {/ Header /}\r\n {this.showLabel && (\r\n <div part=\"header\" class=\"voa-select__header\">\r\n {this.label && (\r\n <label part=\"label\" class=\"voa-select__label\">\r\n {this.label}\r\n </label>\r\n )}\r\n {this.info && (\r\n <div part=\"info\" class=\"voa-select__info\">\r\n {this.infoMessage && (\r\n <span class=\"voa-select__info-message\">{this.infoMessage}</span>\r\n )}\r\n <slot name=\"info-icon\">\r\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M8 12V8M8 4H8.01\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </slot>\r\n </div>\r\n )}\r\n </div>\r\n )}\r\n\r\n {/ Input Wrapper /}\r\n <div \r\n part=\"input\" \r\n class={{\r\n 'voa-select__input': true,\r\n [`voa-select__input--${this.currentState}`]: true,\r\n 'voa-select__input--error': this.error,\r\n 'voa-select__input--disabled': this.disabled\r\n }}\r\n >\r\n <div part=\"input-wrapper\" class=\"voa-select__input-wrapper\">\r\n {/ Icon Slot /}\r\n {iconSlot && (\r\n <div part=\"icon\" class=\"voa-select__icon\">\r\n <slot name=\"icon\"></slot>\r\n <slot name=\"prefix\"></slot>\r\n </div>\r\n )}\r\n\r\n {/ Select Base /}\r\n <div part=\"select-content\" class=\"voa-select__content\">\r\n <voa-select-base\r\n options={this.options}\r\n value={this.innerValue}\r\n placeholder={this.placeholder}\r\n disabled={this.disabled}\r\n error={this.error}\r\n on-voa-change={this.handleChange}\r\n />\r\n </div>\r\n </div>\r\n </div>\r\n\r\n {/ Error Message */}\r\n {this.error && this.errorMessage && (\r\n <div part=\"error-message\" class=\"voa-select__error\">\r\n {this.errorMessage}\r\n </div>\r\n )}\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n\r\n"],"version":3}
1	+ {"file":"voa-select.js","mappings":"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","names":["VoaSelect","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-select/voa-select.css?tag=voa-select&encapsulation=shadow","src/components/voa-select/voa-select.tsx"],"sourcesContent":["/* \r\n * UNSTYLED PATTERN: This file contains ONLY structural CSS (layout, positioning).\r\n * All visual styles (colors, backgrounds, fonts, spacing) must be applied externally\r\n * via CSS Parts API (::part() selectors) using design tokens.\r\n /\r\n\r\n:host {\r\n display: block;\r\n width: 100%;\r\n position: relative;\r\n box-sizing: border-box;\r\n}\r\n\r\n.voa-select {\r\n / Structural styles only /\r\n display: flex;\r\n flex-direction: column;\r\n position: relative;\r\n width: 100%;\r\n box-sizing: border-box;\r\n / Garantir que dropdowns filhos possam aparecer acima /\r\n overflow: visible;\r\n}\r\n\r\n/ Header /\r\n.voa-select__header {\r\n / Structural styles only /\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n width: 100%;\r\n box-sizing: border-box;\r\n}\r\n\r\n.voa-select__label {\r\n / Structural styles only /\r\n flex: 1 0 0;\r\n box-sizing: border-box;\r\n}\r\n\r\n.voa-select__info {\r\n / Structural styles only /\r\n display: flex;\r\n align-items: center;\r\n gap: 4px;\r\n box-sizing: border-box;\r\n}\r\n\r\n.voa-select__info-message {\r\n / Structural styles only /\r\n box-sizing: border-box;\r\n white-space: nowrap;\r\n}\r\n\r\n.voa-select__icon {\r\n / Structural styles only /\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n box-sizing: border-box;\r\n}\r\n\r\n/ Input Container /\r\n.voa-select__input {\r\n / Structural styles only /\r\n display: flex;\r\n position: relative;\r\n width: 100%;\r\n box-sizing: border-box;\r\n / Garantir que o dropdown possa ser posicionado relativamente a este container /\r\n overflow: visible;\r\n}\r\n\r\n.voa-select__input-wrapper {\r\n / Structural styles only /\r\n display: flex;\r\n align-items: center;\r\n gap: 8px;\r\n width: 100%;\r\n height: 100%;\r\n box-sizing: border-box;\r\n position: relative;\r\n}\r\n\r\n.voa-select__content {\r\n / Structural styles only /\r\n flex: 1 0 0;\r\n min-width: 0;\r\n height: 100%;\r\n box-sizing: border-box;\r\n / Garantir que o dropdown dentro do voa-select-base possa ser posicionado /\r\n position: relative;\r\n overflow: visible;\r\n}\r\n\r\n/ Error Message /\r\n.voa-select__error {\r\n / Structural styles only /\r\n display: block;\r\n width: 100%;\r\n box-sizing: border-box;\r\n}\r\n\r\n/ Estados estruturais /\r\n.voa-select__input--disabled {\r\n pointer-events: none;\r\n cursor: not-allowed;\r\n}","import { Component, Host, h, Prop, State, Event, EventEmitter, Element, Method, Watch, Listen } from '@stencil/core';\r\n\r\n/\r\n Componente Select principal do Voa Design System, baseado no design do Figma.\r\n * \r\n * Este componente orquestra os subcomponentes voa-select-base e voa-container-multi-select,\r\n * adicionando funcionalidades de label, info, ícone e mensagem de erro.\r\n * \r\n * @part base - O elemento raiz do componente\r\n * @part header - Container do header (label + info)\r\n * @part label - Texto do label\r\n * @part info - Container de informação\r\n * @part input-wrapper - Wrapper do input field\r\n * @part input - Container do input (com borda)\r\n * @part error-message - Mensagem de erro\r\n /\r\n@Component({\r\n tag: 'voa-select',\r\n styleUrl: 'voa-select.css',\r\n shadow: true,\r\n scoped: false // Permite herdar variáveis CSS do contexto pai\r\n})\r\nexport class VoaSelect {\r\n @Element() host: HTMLVoaSelectElement;\r\n\r\n /\r\n Tipo de seleção: 'simple' para seleção única\r\n * NOTA: 'multi' está temporariamente desabilitado até implementação correta\r\n /\r\n @Prop({ reflect: true }) type: 'simple' = 'simple';\r\n\r\n /\r\n Texto do label exibido acima do input\r\n /\r\n @Prop() label?: string;\r\n\r\n /\r\n Se verdadeiro, o label será exibido\r\n /\r\n @Prop() showLabel: boolean = true;\r\n\r\n /\r\n Se verdadeiro, a informação adicional será exibida\r\n /\r\n @Prop() info: boolean = false;\r\n\r\n /\r\n Mensagem de informação adicional\r\n /\r\n @Prop() infoMessage?: string;\r\n\r\n /\r\n Se verdadeiro, o select terá estado de erro\r\n /\r\n @Prop() error: boolean = false;\r\n\r\n /\r\n Mensagem de erro exibida abaixo do input\r\n /\r\n @Prop() errorMessage?: string;\r\n\r\n /\r\n Texto de placeholder\r\n /\r\n @Prop() placeholder: string = 'Placeholder';\r\n\r\n /\r\n THE TRUTH. Read-only from parent.\r\n /\r\n @Prop() value?: string;\r\n\r\n /\r\n Internal Reality.\r\n /\r\n @State() innerValue?: string;\r\n\r\n /\r\n Lista de opções para seleção\r\n /\r\n @Prop() options: Array<{value: string, label: string, disabled?: boolean}> = [];\r\n\r\n /\r\n Se verdadeiro, o select estará desabilitado\r\n /\r\n @Prop() disabled: boolean = false;\r\n\r\n /\r\n Estado interno para controlar o foco\r\n /\r\n @State() isFocused: boolean = false;\r\n\r\n /\r\n Estado interno calculado (default, selected, focused, filled, disabled)\r\n /\r\n @State() private currentState: 'default' \| 'selected' \| 'focused' \| 'filled' \| 'disabled' = 'default';\r\n\r\n /\r\n Evento emitido quando o valor é alterado\r\n /\r\n @Event() voaSelectChange: EventEmitter<string>;\r\n\r\n componentWillLoad() {\r\n this.innerValue = this.value;\r\n this.updateState();\r\n }\r\n\r\n @Watch('value')\r\n syncValue(val: string) {\r\n this.innerValue = val;\r\n this.updateState();\r\n }\r\n\r\n /\r\n Atualiza o estado interno baseado nas props\r\n /\r\n @Watch('disabled')\r\n @Watch('isFocused')\r\n updateState() {\r\n if (this.disabled) {\r\n this.currentState = 'disabled';\r\n } else if (this.isFocused) {\r\n this.currentState = 'focused';\r\n } else if (this.hasValue()) {\r\n // Se há valor selecionado, é \"filled\" ou \"selected\"\r\n this.currentState = 'filled';\r\n if (this.hasSelectedValue()) {\r\n this.currentState = 'selected';\r\n }\r\n } else {\r\n this.currentState = 'default';\r\n }\r\n }\r\n\r\n /\r\n Verifica se há valor selecionado\r\n /\r\n private hasValue(): boolean {\r\n return !!this.innerValue && this.innerValue !== '';\r\n }\r\n\r\n /\r\n Verifica se há valor selecionado (para estado selected)\r\n /\r\n private hasSelectedValue(): boolean {\r\n return this.hasValue();\r\n }\r\n\r\n /\r\n Manipula mudança de valor no select-base\r\n /\r\n private handleChange = (event: CustomEvent<string>) => {\r\n this.innerValue = event.detail;\r\n this.voaSelectChange.emit(event.detail);\r\n };\r\n\r\n /\r\n Listen to focus event on the internal button\r\n /\r\n @Listen('focus', { capture: true })\r\n handleFocus() {\r\n this.isFocused = true;\r\n this.updateState();\r\n }\r\n\r\n /\r\n Listen to blur event on the internal button\r\n /\r\n @Listen('blur', { capture: true })\r\n handleBlur() {\r\n this.isFocused = false;\r\n this.updateState();\r\n }\r\n\r\n /\r\n Método para delegar foco ao elemento interno do select.\r\n * Requerido para acessibilidade WCAG 2.2 AA.\r\n /\r\n @Method()\r\n async setFocus(): Promise<void> {\r\n const selectBase = this.host.shadowRoot?.querySelector('voa-select-base') as any;\r\n if (selectBase && typeof selectBase.setFocus === 'function') {\r\n await selectBase.setFocus();\r\n }\r\n }\r\n\r\n render() {\r\n // Verificar se há slot de ícone (apenas para renderização condicional)\r\n const iconSlot = this.host.querySelector('[slot=\"icon\"]') \|\| this.host.querySelector('[slot=\"prefix\"]');\r\n\r\n return (\r\n <Host\r\n role=\"group\"\r\n aria-disabled={this.disabled ? 'true' : undefined}\r\n data-state={this.currentState}\r\n >\r\n <div part=\"base\" class=\"voa-select\">\r\n {/ Header /}\r\n {this.showLabel && (\r\n <div part=\"header\" class=\"voa-select__header\">\r\n {this.label && (\r\n <label part=\"label\" class=\"voa-select__label\">\r\n {this.label}\r\n </label>\r\n )}\r\n {this.info && (\r\n <div part=\"info\" class=\"voa-select__info\">\r\n {this.infoMessage && (\r\n <span class=\"voa-select__info-message\">{this.infoMessage}</span>\r\n )}\r\n <slot name=\"info-icon\">\r\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M8 12V8M8 4H8.01\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </slot>\r\n </div>\r\n )}\r\n </div>\r\n )}\r\n\r\n {/ Input Wrapper /}\r\n <div \r\n part=\"input\" \r\n class={{\r\n 'voa-select__input': true,\r\n [`voa-select__input--${this.currentState}`]: true,\r\n 'voa-select__input--error': this.error,\r\n 'voa-select__input--disabled': this.disabled\r\n }}\r\n >\r\n <div part=\"input-wrapper\" class=\"voa-select__input-wrapper\">\r\n {/ Icon Slot /}\r\n {iconSlot && (\r\n <div part=\"icon\" class=\"voa-select__icon\">\r\n <slot name=\"icon\"></slot>\r\n <slot name=\"prefix\"></slot>\r\n </div>\r\n )}\r\n\r\n {/ Select Base /}\r\n <div part=\"select-content\" class=\"voa-select__content\">\r\n <voa-select-base\r\n options={this.options}\r\n value={this.innerValue}\r\n placeholder={this.placeholder}\r\n disabled={this.disabled}\r\n error={this.error}\r\n on-voa-change={this.handleChange}\r\n />\r\n </div>\r\n </div>\r\n </div>\r\n\r\n {/ Error Message */}\r\n {this.error && this.errorMessage && (\r\n <div part=\"error-message\" class=\"voa-select__error\">\r\n {this.errorMessage}\r\n </div>\r\n )}\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n\r\n"],"version":3}

package/dist/custom-elements/voa-skeleton.js CHANGED Viewed

@@ -37,7 +37,6 @@ function defineCustomElement$1() {
             break;
     } });
 }
-defineCustomElement$1();
 const VoaSkeleton = Skeleton;
 const defineCustomElement = defineCustomElement$1;

package/dist/custom-elements/voa-skeleton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"voa-skeleton.js","mappings":";;AAAA,MAAM,WAAW,GAAG,ucAAuc;;MCO9c,QAAQ,iBAAAA,kBAAA,CAAA,MAAA,QAAA,SAAAC,CAAA,CAAA;AALrB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;AAMY,QAAA,IAAK,CAAA,KAAA,GAAW,OAAO;AACvB,QAAA,IAAM,CAAA,MAAA,GAAW,OAAO;AAanC;IAVG,WAAW,GAAA;AACP,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,OAAO,KAAK,QAAQ;QAC1C,OAAO,CAAA,SAAA,EAAY,QAAQ,GAAG,kBAAkB,GAAG,EAAE,CAAA,CAAE;;IAG3D,MAAM,GAAA;AACF,QAAA,OAAO,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAE,IAAI,CAAC,WAAW,EAAE,EACtC,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAC,EAAA,CACxC~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-skeleton/skeleton.css?tag=voa-skeleton","src/components/voa-skeleton/skeleton.tsx"],"sourcesContent":[".skeleton{\r\n border-radius: 2px;\r\n display: inline-block;\r\n line-height: 100%;\r\n width: 100%;\r\n background-color: #fff;\r\n background-size: 1000px 1000px;\r\n background-image: linear-gradient(\r\n 100deg,\r\n #e8e8e8 20%,\r\n #fafafa 50%,\r\n #e8e8e8 60%\r\n );\r\n animation: placeholderShimmer 1.5s linear infinite forwards;\r\n}\r\n\r\n.skeleton--circle{\r\n border-radius: 50%;\r\n}\r\n\r\n@keyframes placeholderShimmer{\r\n 0%{\r\n background-position: -500px 0;\r\n }\r\n \r\n 100%{\r\n background-position: 500px 0;\r\n }\r\n\r\n}","import { Component, Prop, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n tag: \"voa-skeleton\",\r\n styleUrl: \"skeleton.css\",\r\n shadow: false,\r\n})\r\nexport class Skeleton {\r\n @Prop() width: string = \"200px\";\r\n @Prop() height: string = \"100px\";\r\n @Prop() variant: \"text\" \| \"circle\" ;\r\n\r\n handleClass() {\r\n const isCircle = this.variant === 'circle';\r\n return `skeleton ${isCircle ? 'skeleton--circle' : ''}`;;\r\n }\r\n\r\n render() {\r\n return <span class={this.handleClass()} \r\n style={{ width: this.width, height: this.height}}\r\n ></span>\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"voa-skeleton.js","mappings":";;AAAA,MAAM,WAAW,GAAG,ucAAuc;;MCO9c,QAAQ,iBAAAA,kBAAA,CAAA,MAAA,QAAA,SAAAC,CAAA,CAAA;AALrB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;AAMY,QAAA,IAAK,CAAA,KAAA,GAAW,OAAO;AACvB,QAAA,IAAM,CAAA,MAAA,GAAW,OAAO;AAanC;IAVG,WAAW,GAAA;AACP,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,OAAO,KAAK,QAAQ;QAC1C,OAAO,CAAA,SAAA,EAAY,QAAQ,GAAG,kBAAkB,GAAG,EAAE,CAAA,CAAE;;IAG3D,MAAM,GAAA;AACF,QAAA,OAAO,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAE,IAAI,CAAC,WAAW,EAAE,EACtC,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAC,EAAA,CACxC;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-skeleton/skeleton.css?tag=voa-skeleton","src/components/voa-skeleton/skeleton.tsx"],"sourcesContent":[".skeleton{\r\n border-radius: 2px;\r\n display: inline-block;\r\n line-height: 100%;\r\n width: 100%;\r\n background-color: #fff;\r\n background-size: 1000px 1000px;\r\n background-image: linear-gradient(\r\n 100deg,\r\n #e8e8e8 20%,\r\n #fafafa 50%,\r\n #e8e8e8 60%\r\n );\r\n animation: placeholderShimmer 1.5s linear infinite forwards;\r\n}\r\n\r\n.skeleton--circle{\r\n border-radius: 50%;\r\n}\r\n\r\n@keyframes placeholderShimmer{\r\n 0%{\r\n background-position: -500px 0;\r\n }\r\n \r\n 100%{\r\n background-position: 500px 0;\r\n }\r\n\r\n}","import { Component, Prop, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n tag: \"voa-skeleton\",\r\n styleUrl: \"skeleton.css\",\r\n shadow: false,\r\n})\r\nexport class Skeleton {\r\n @Prop() width: string = \"200px\";\r\n @Prop() height: string = \"100px\";\r\n @Prop() variant: \"text\" \| \"circle\" ;\r\n\r\n handleClass() {\r\n const isCircle = this.variant === 'circle';\r\n return `skeleton ${isCircle ? 'skeleton--circle' : ''}`;;\r\n }\r\n\r\n render() {\r\n return <span class={this.handleClass()} \r\n style={{ width: this.width, height: this.height}}\r\n ></span>\r\n }\r\n}\r\n"],"version":3}

package/dist/custom-elements/voa-stepper.js CHANGED Viewed

@@ -40,7 +40,6 @@ function defineCustomElement$1() {
             break;
     } });
 }
-defineCustomElement$1();
 const VoaStepper = Stepper;
 const defineCustomElement = defineCustomElement$1;

package/dist/custom-elements/voa-stepper.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"voa-stepper.js","mappings":";;AAAA,MAAM,UAAU,GAAG,0RAA0R;;MCOhS,OAAO,iBAAAA,kBAAA,CAAA,MAAA,OAAA,SAAAC,CAAA,CAAA;AALpB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;;AAMU,QAAA,IAAK,CAAA,KAAA,GAAa,EAAE;AACpB,QAAA,IAAW,CAAA,WAAA,GAAW,CAAC;AACtB,QAAA,IAAA,CAAA,UAAU,GAAW,IAAI,CAAC,WAAW;AAsB/C;AAnBC,IAAA,QAAQ,CAAC,IAAY,EAAA;AACnB,QAAA,IAAI,CAAC,UAAU,GAAG,IAAI;QACtB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC;;IAGxC,MAAM,GAAA;AACJ,QAAA,QACE,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EACjB,EAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,MAC1B,CACE,CAAA,KAAA,EAAA,EAAA,KAAK,EAAE,CAAA,KAAA,EAAQ,IAAI,CAAC,UAAU,KAAK,KAAK,GAAG,QAAQ,GAAG,EAAE,CAAA,CAAE,EAC1D,OAAO,EAAE,MAAM,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAA,EAElC,IAAI,CACD,CACP,CAAC,CACE~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-stepper/stepper.css?tag=voa-stepper&encapsulation=shadow","src/components/voa-stepper/stepper.tsx"],"sourcesContent":[".stepper {\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.step {\r\n padding: 10px 20px;\r\n border: 1px solid #ccc;\r\n border-radius: 4px;\r\n background-color: #f9f9f9;\r\n cursor: pointer;\r\n transition: background-color 0.2s;\r\n margin-right: 10px;\r\n}\r\n\r\n.step.active {\r\n background-color: #007bff;\r\n color: white;\r\n}\r\n\r\n.step:hover {\r\n background-color: #eee;\r\n}\r\n","import { Component, Prop, h, State, Event, EventEmitter } from \"@stencil/core\";\r\n\r\n@Component({\r\n tag: \"voa-stepper\",\r\n styleUrl: \"stepper.css\",\r\n shadow: true,\r\n})\r\nexport class Stepper {\r\n @Prop() steps: string[] = [];\r\n @Prop() currentStep: number = 0;\r\n @State() activeStep: number = this.currentStep;\r\n @Event() stepChanged: EventEmitter<number>;\r\n\r\n goToStep(step: number) {\r\n this.activeStep = step;\r\n this.stepChanged.emit(this.activeStep);\r\n }\r\n\r\n render() {\r\n return (\r\n <div class=\"stepper\">\r\n {this.steps.map((step, index) => (\r\n <div\r\n class={`step ${this.activeStep === index ? \"active\" : \"\"}`}\r\n onClick={() => this.goToStep(index)}\r\n >\r\n {step}\r\n </div>\r\n ))}\r\n </div>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"voa-stepper.js","mappings":";;AAAA,MAAM,UAAU,GAAG,0RAA0R;;MCOhS,OAAO,iBAAAA,kBAAA,CAAA,MAAA,OAAA,SAAAC,CAAA,CAAA;AALpB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;;AAMU,QAAA,IAAK,CAAA,KAAA,GAAa,EAAE;AACpB,QAAA,IAAW,CAAA,WAAA,GAAW,CAAC;AACtB,QAAA,IAAA,CAAA,UAAU,GAAW,IAAI,CAAC,WAAW;AAsB/C;AAnBC,IAAA,QAAQ,CAAC,IAAY,EAAA;AACnB,QAAA,IAAI,CAAC,UAAU,GAAG,IAAI;QACtB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC;;IAGxC,MAAM,GAAA;AACJ,QAAA,QACE,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EACjB,EAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,MAC1B,CACE,CAAA,KAAA,EAAA,EAAA,KAAK,EAAE,CAAA,KAAA,EAAQ,IAAI,CAAC,UAAU,KAAK,KAAK,GAAG,QAAQ,GAAG,EAAE,CAAA,CAAE,EAC1D,OAAO,EAAE,MAAM,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAA,EAElC,IAAI,CACD,CACP,CAAC,CACE;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-stepper/stepper.css?tag=voa-stepper&encapsulation=shadow","src/components/voa-stepper/stepper.tsx"],"sourcesContent":[".stepper {\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.step {\r\n padding: 10px 20px;\r\n border: 1px solid #ccc;\r\n border-radius: 4px;\r\n background-color: #f9f9f9;\r\n cursor: pointer;\r\n transition: background-color 0.2s;\r\n margin-right: 10px;\r\n}\r\n\r\n.step.active {\r\n background-color: #007bff;\r\n color: white;\r\n}\r\n\r\n.step:hover {\r\n background-color: #eee;\r\n}\r\n","import { Component, Prop, h, State, Event, EventEmitter } from \"@stencil/core\";\r\n\r\n@Component({\r\n tag: \"voa-stepper\",\r\n styleUrl: \"stepper.css\",\r\n shadow: true,\r\n})\r\nexport class Stepper {\r\n @Prop() steps: string[] = [];\r\n @Prop() currentStep: number = 0;\r\n @State() activeStep: number = this.currentStep;\r\n @Event() stepChanged: EventEmitter<number>;\r\n\r\n goToStep(step: number) {\r\n this.activeStep = step;\r\n this.stepChanged.emit(this.activeStep);\r\n }\r\n\r\n render() {\r\n return (\r\n <div class=\"stepper\">\r\n {this.steps.map((step, index) => (\r\n <div\r\n class={`step ${this.activeStep === index ? \"active\" : \"\"}`}\r\n onClick={() => this.goToStep(index)}\r\n >\r\n {step}\r\n </div>\r\n ))}\r\n </div>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/custom-elements/voa-switch.js CHANGED Viewed

@@ -120,7 +120,6 @@ function defineCustomElement$1() {
             break;
     } });
 }
-defineCustomElement$1();
 const VoaSwitch = VoaSwitch$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/custom-elements/voa-switch.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"voa-switch.js","mappings":"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~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~","names":["VoaSwitch","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-switch/voa-switch.css?tag=voa-switch&encapsulation=shadow","src/components/voa-switch/voa-switch.tsx"],"sourcesContent":["/* * UNSTYLED PATTERN: This file contains ONLY structural CSS (layout, positioning).\r\n * All visual styles (colors, backgrounds, fonts, spacing) must be applied externally\r\n * via CSS Parts API (::part() selectors) using design tokens.\r\n /\r\n\r\n:host {\r\n display: inline-block;\r\n box-sizing: border-box;\r\n / Ensures the host has a tangible size if not defined externally /\r\n contain: content;\r\n}\r\n\r\n.switch-container {\r\n / APENAS estilos estruturais /\r\n display: inline-flex;\r\n align-items: center;\r\n position: relative;\r\n box-sizing: border-box;\r\n user-select: none;\r\n border: none;\r\n background: none;\r\n padding: 0;\r\n margin: 0;\r\n gap: 0;\r\n / Gap defaults to 0, overridden by external CSS if needed /\r\n}\r\n\r\n.switch-container:disabled,\r\n.switch-container.switch-disabled {\r\n cursor: not-allowed;\r\n pointer-events: none;\r\n}\r\n\r\n.switch-container.switch-no-label {\r\n gap: 0;\r\n}\r\n\r\n.switch-track {\r\n / APENAS estilos estruturais /\r\n display: flex;\r\n align-items: center;\r\n position: relative;\r\n box-sizing: border-box;\r\n flex-shrink: 0;\r\n / CRITICAL: Prevents track from squashing in flex layouts /\r\n\r\n / Tamanhos estruturais conforme Figma: 40px x 20px /\r\n width: 40px;\r\n height: 20px;\r\n\r\n overflow: hidden;\r\n / Padding interno para posicionar o thumb /\r\n padding: 2px;\r\n}\r\n\r\n.switch-thumb {\r\n / APENAS estilos estruturais /\r\n display: block;\r\n position: relative;\r\n box-sizing: border-box;\r\n flex-shrink: 0;\r\n\r\n / RESTORED DIMENSIONS - CRITICAL FOR VISIBILITY /\r\n width: 16px;\r\n height: 16px;\r\n}\r\n\r\n.switch-shadow {\r\n / APENAS estilos estruturais /\r\n position: absolute;\r\n inset: 0;\r\n pointer-events: none;\r\n / Shadow será aplicada externamente via CSS custom property /\r\n}\r\n\r\n.switch-label {\r\n / APENAS estilos estruturais /\r\n display: inline-block;\r\n user-select: none;\r\n box-sizing: border-box;\r\n}","import { Component, Host, h, Prop, Event, EventEmitter, Element, AttachInternals, State, Watch } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'voa-switch',\r\n styleUrl: 'voa-switch.css',\r\n shadow: {\r\n delegatesFocus: true // CRITICAL: Passes focus from Host to the internal button automatically\r\n },\r\n formAssociated: true // CRITICAL: Makes this work in <form> tags\r\n})\r\nexport class VoaSwitch {\r\n @Element() host: HTMLVoaSwitchElement;\r\n @AttachInternals() internals: ElementInternals;\r\n\r\n /\r\n Internal state to handle \"uncontrolled\" usage while keeping props immutable\r\n /\r\n @State() internalChecked: boolean = false;\r\n\r\n @Prop() checked: boolean = false;\r\n @Prop() disabled: boolean = false;\r\n @Prop() showLabel: boolean = false;\r\n @Prop() name: string;\r\n @Prop() value: string = 'on'; // Default value for forms\r\n\r\n @Event() dsChange: EventEmitter<boolean>;\r\n\r\n componentWillLoad() {\r\n this.internalChecked = this.checked;\r\n this.updateFormValue();\r\n this.reflectStateToHost();\r\n }\r\n\r\n @Watch('checked')\r\n checkedChanged(newValue: boolean) {\r\n this.internalChecked = newValue;\r\n this.updateFormValue();\r\n this.reflectStateToHost();\r\n }\r\n\r\n /\r\n Reflects the current state to the Host element for CSS attribute selectors\r\n /\r\n private reflectStateToHost() {\r\n if (this.internalChecked) {\r\n this.host.setAttribute('checked', '');\r\n } else {\r\n this.host.removeAttribute('checked');\r\n }\r\n }\r\n\r\n /\r\n Syncs with the native Form API\r\n */\r\n private updateFormValue() {\r\n try {\r\n // ElementInternals is only available in real browsers\r\n // Skip in test environment where it's not supported\r\n if (this.internals && typeof (this.internals as any).setFormValue === 'function') {\r\n (this.internals as any).setFormValue(this.internalChecked ? this.value : null);\r\n \r\n // Accessibility internals (replaces aria attributes on Host)\r\n (this.internals as any).ariaChecked = this.internalChecked ? 'true' : 'false';\r\n (this.internals as any).ariaDisabled = this.disabled ? 'true' : 'false';\r\n }\r\n } catch (e) {\r\n // ElementInternals may not be available in test environment\r\n }\r\n }\r\n\r\n private handleClick = (ev: Event) => {\r\n ev.preventDefault();\r\n if (this.disabled) return;\r\n\r\n // Optimistic UI update for uncontrolled scenarios\r\n this.internalChecked = !this.internalChecked;\r\n this.checked = this.internalChecked;\r\n this.dsChange.emit(this.internalChecked);\r\n this.updateFormValue();\r\n this.reflectStateToHost();\r\n };\r\n\r\n private handleKeyDown = (event: KeyboardEvent) => {\r\n if (this.disabled) return;\r\n if (event.key === 'Enter' \|\| event.key === ' ') {\r\n event.preventDefault();\r\n this.handleClick(event);\r\n }\r\n };\r\n\r\n render() {\r\n // NOTE: Host no longer has aria-roles, ElementInternals handles that on the custom element itself.\r\n // The internal button is purely for visual structure and click capturing.\r\n return (\r\n <Host>\r\n <button\r\n part=\"base\"\r\n class={{\r\n 'switch-container': true,\r\n 'switch-disabled': this.disabled,\r\n 'switch-checked': this.internalChecked,\r\n 'switch-no-label': !this.showLabel\r\n }}\r\n type=\"button\"\r\n disabled={this.disabled}\r\n onClick={this.handleClick}\r\n onKeyDown={this.handleKeyDown}\r\n // We remove aria-checked here to avoid \"double talk\" with the Host/Internals\r\n tabIndex={-1} // handled by delegatesFocus on Host\r\n >\r\n <div part=\"track\" class=\"switch-track\">\r\n <div part=\"thumb\" class=\"switch-thumb\" />\r\n <div part=\"shadow\" class=\"switch-shadow\" />\r\n </div>\r\n\r\n {this.showLabel && (\r\n <span class=\"switch-label\" part=\"label\">\r\n <slot />\r\n </span>\r\n )}\r\n </button>\r\n </Host>\r\n );\r\n }\r\n}\r\n\r\n"],"version":3}
1	+ {"file":"voa-switch.js","mappings":"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","names":["VoaSwitch","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-switch/voa-switch.css?tag=voa-switch&encapsulation=shadow","src/components/voa-switch/voa-switch.tsx"],"sourcesContent":["/* * UNSTYLED PATTERN: This file contains ONLY structural CSS (layout, positioning).\r\n * All visual styles (colors, backgrounds, fonts, spacing) must be applied externally\r\n * via CSS Parts API (::part() selectors) using design tokens.\r\n /\r\n\r\n:host {\r\n display: inline-block;\r\n box-sizing: border-box;\r\n / Ensures the host has a tangible size if not defined externally /\r\n contain: content;\r\n}\r\n\r\n.switch-container {\r\n / APENAS estilos estruturais /\r\n display: inline-flex;\r\n align-items: center;\r\n position: relative;\r\n box-sizing: border-box;\r\n user-select: none;\r\n border: none;\r\n background: none;\r\n padding: 0;\r\n margin: 0;\r\n gap: 0;\r\n / Gap defaults to 0, overridden by external CSS if needed /\r\n}\r\n\r\n.switch-container:disabled,\r\n.switch-container.switch-disabled {\r\n cursor: not-allowed;\r\n pointer-events: none;\r\n}\r\n\r\n.switch-container.switch-no-label {\r\n gap: 0;\r\n}\r\n\r\n.switch-track {\r\n / APENAS estilos estruturais /\r\n display: flex;\r\n align-items: center;\r\n position: relative;\r\n box-sizing: border-box;\r\n flex-shrink: 0;\r\n / CRITICAL: Prevents track from squashing in flex layouts /\r\n\r\n / Tamanhos estruturais conforme Figma: 40px x 20px /\r\n width: 40px;\r\n height: 20px;\r\n\r\n overflow: hidden;\r\n / Padding interno para posicionar o thumb /\r\n padding: 2px;\r\n}\r\n\r\n.switch-thumb {\r\n / APENAS estilos estruturais /\r\n display: block;\r\n position: relative;\r\n box-sizing: border-box;\r\n flex-shrink: 0;\r\n\r\n / RESTORED DIMENSIONS - CRITICAL FOR VISIBILITY /\r\n width: 16px;\r\n height: 16px;\r\n}\r\n\r\n.switch-shadow {\r\n / APENAS estilos estruturais /\r\n position: absolute;\r\n inset: 0;\r\n pointer-events: none;\r\n / Shadow será aplicada externamente via CSS custom property /\r\n}\r\n\r\n.switch-label {\r\n / APENAS estilos estruturais /\r\n display: inline-block;\r\n user-select: none;\r\n box-sizing: border-box;\r\n}","import { Component, Host, h, Prop, Event, EventEmitter, Element, AttachInternals, State, Watch } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'voa-switch',\r\n styleUrl: 'voa-switch.css',\r\n shadow: {\r\n delegatesFocus: true // CRITICAL: Passes focus from Host to the internal button automatically\r\n },\r\n formAssociated: true // CRITICAL: Makes this work in <form> tags\r\n})\r\nexport class VoaSwitch {\r\n @Element() host: HTMLVoaSwitchElement;\r\n @AttachInternals() internals: ElementInternals;\r\n\r\n /\r\n Internal state to handle \"uncontrolled\" usage while keeping props immutable\r\n /\r\n @State() internalChecked: boolean = false;\r\n\r\n @Prop() checked: boolean = false;\r\n @Prop() disabled: boolean = false;\r\n @Prop() showLabel: boolean = false;\r\n @Prop() name: string;\r\n @Prop() value: string = 'on'; // Default value for forms\r\n\r\n @Event() dsChange: EventEmitter<boolean>;\r\n\r\n componentWillLoad() {\r\n this.internalChecked = this.checked;\r\n this.updateFormValue();\r\n this.reflectStateToHost();\r\n }\r\n\r\n @Watch('checked')\r\n checkedChanged(newValue: boolean) {\r\n this.internalChecked = newValue;\r\n this.updateFormValue();\r\n this.reflectStateToHost();\r\n }\r\n\r\n /\r\n Reflects the current state to the Host element for CSS attribute selectors\r\n /\r\n private reflectStateToHost() {\r\n if (this.internalChecked) {\r\n this.host.setAttribute('checked', '');\r\n } else {\r\n this.host.removeAttribute('checked');\r\n }\r\n }\r\n\r\n /\r\n Syncs with the native Form API\r\n */\r\n private updateFormValue() {\r\n try {\r\n // ElementInternals is only available in real browsers\r\n // Skip in test environment where it's not supported\r\n if (this.internals && typeof (this.internals as any).setFormValue === 'function') {\r\n (this.internals as any).setFormValue(this.internalChecked ? this.value : null);\r\n \r\n // Accessibility internals (replaces aria attributes on Host)\r\n (this.internals as any).ariaChecked = this.internalChecked ? 'true' : 'false';\r\n (this.internals as any).ariaDisabled = this.disabled ? 'true' : 'false';\r\n }\r\n } catch (e) {\r\n // ElementInternals may not be available in test environment\r\n }\r\n }\r\n\r\n private handleClick = (ev: Event) => {\r\n ev.preventDefault();\r\n if (this.disabled) return;\r\n\r\n // Optimistic UI update for uncontrolled scenarios\r\n this.internalChecked = !this.internalChecked;\r\n this.checked = this.internalChecked;\r\n this.dsChange.emit(this.internalChecked);\r\n this.updateFormValue();\r\n this.reflectStateToHost();\r\n };\r\n\r\n private handleKeyDown = (event: KeyboardEvent) => {\r\n if (this.disabled) return;\r\n if (event.key === 'Enter' \|\| event.key === ' ') {\r\n event.preventDefault();\r\n this.handleClick(event);\r\n }\r\n };\r\n\r\n render() {\r\n // NOTE: Host no longer has aria-roles, ElementInternals handles that on the custom element itself.\r\n // The internal button is purely for visual structure and click capturing.\r\n return (\r\n <Host>\r\n <button\r\n part=\"base\"\r\n class={{\r\n 'switch-container': true,\r\n 'switch-disabled': this.disabled,\r\n 'switch-checked': this.internalChecked,\r\n 'switch-no-label': !this.showLabel\r\n }}\r\n type=\"button\"\r\n disabled={this.disabled}\r\n onClick={this.handleClick}\r\n onKeyDown={this.handleKeyDown}\r\n // We remove aria-checked here to avoid \"double talk\" with the Host/Internals\r\n tabIndex={-1} // handled by delegatesFocus on Host\r\n >\r\n <div part=\"track\" class=\"switch-track\">\r\n <div part=\"thumb\" class=\"switch-thumb\" />\r\n <div part=\"shadow\" class=\"switch-shadow\" />\r\n </div>\r\n\r\n {this.showLabel && (\r\n <span class=\"switch-label\" part=\"label\">\r\n <slot />\r\n </span>\r\n )}\r\n </button>\r\n </Host>\r\n );\r\n }\r\n}\r\n\r\n"],"version":3}

package/dist/custom-elements/voa-tab-item.js CHANGED Viewed

@@ -103,7 +103,6 @@ function defineCustomElement$1() {
             break;
     } });
 }
-defineCustomElement$1();
 const VoaTabItem = VoaTabItem$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/custom-elements/voa-tab-item.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"voa-tab-item.js","mappings":"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~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~","names":["VoaTabItem","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-tab-item/voa-tab-item.css?tag=voa-tab-item&encapsulation=shadow","src/components/voa-tab-item/voa-tab-item.tsx"],"sourcesContent":["/* * UNSTYLED PATTERN: This file contains ONLY structural CSS (layout, positioning).\r\n * All visual styles (colors, backgrounds, fonts, spacing) must be applied externally\r\n * via CSS Parts API (::part() selectors) using design tokens.\r\n * * IMPORTANT: NÃO incluir cores, fontes, espaçamentos ou valores hardcoded.\r\n * Apenas estrutura: display, position, flexbox, grid, box-sizing, cursor, etc.\r\n /\r\n\r\n:host {\r\n display: inline-block;\r\n box-sizing: border-box;\r\n}\r\n\r\n.voa-tab-item {\r\n / APENAS estilos estruturais /\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n position: relative;\r\n box-sizing: border-box;\r\n cursor: pointer;\r\n user-select: none;\r\n / Gap estrutural para espaçamento entre label e badge /\r\n gap: 0;\r\n / Layout flex para garantir alinhamento correto /\r\n flex-direction: row;\r\n flex-wrap: nowrap;\r\n}\r\n\r\n.voa-tab-item--disabled {\r\n cursor: not-allowed;\r\n pointer-events: none;\r\n}\r\n\r\n.voa-tab-item__label {\r\n display: inline-block;\r\n flex-shrink: 0;\r\n}\r\n\r\n.voa-tab-item__badge {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n position: relative;\r\n box-sizing: border-box;\r\n}\r\n\r\n.voa-tab-item__badge-text {\r\n display: inline-block;\r\n text-align: center;\r\n white-space: nowrap;\r\n}","import { Component, Host, h, Prop, Element, Method, Event, EventEmitter } from '@stencil/core';\r\n\r\n/\r\n Item individual de tab do Voa Design System.\r\n * * Baseado no design do Figma: https://www.figma.com/design/wDStUEuqpl7Tu1oHpiAml6/Voa-Design-System?node-id=366-1545\r\n * * O componente segue o padrão \"unstyled\" (headless), fornecendo apenas estrutura e lógica.\r\n * Todos os estilos visuais devem ser aplicados externamente via CSS Parts API usando design tokens.\r\n * * @part base - O elemento raiz do item de tab\r\n * @part label - Container do texto do item\r\n * @part badge - Container do badge (quando showBadge=true)\r\n /\r\n@Component({\r\n tag: 'voa-tab-item',\r\n styleUrl: 'voa-tab-item.css',\r\n shadow: true,\r\n scoped: false, // Permite herdar variáveis CSS do contexto pai\r\n})\r\nexport class VoaTabItem {\r\n @Element() host: HTMLVoaTabItemElement;\r\n\r\n /\r\n Estado do item de tab.\r\n * Mapeia os estados do Figma: Active, Default, Disabled.\r\n /\r\n @Prop({ reflect: true }) state: 'active' \| 'default' \| 'disabled' = 'default';\r\n\r\n /\r\n Posição do indicador de ativo (borda).\r\n * Mapeia as posições do Figma: Default (bottom), Top, Right, Left.\r\n /\r\n @Prop({ reflect: true }) position: 'default' \| 'top' \| 'right' \| 'left' = 'default';\r\n\r\n /\r\n Se verdadeiro, exibe um badge no item.\r\n /\r\n @Prop({ reflect: true }) showBadge: boolean = false;\r\n\r\n /\r\n Número a ser exibido no badge (opcional).\r\n * Se não fornecido e showBadge=true, exibe \"0\".\r\n /\r\n @Prop() badgeCount?: number;\r\n\r\n /\r\n Se verdadeiro, o item estará desabilitado.\r\n * Alias para state=\"disabled\".\r\n /\r\n @Prop({ reflect: true }) disabled: boolean = false;\r\n\r\n /\r\n Índice do item (gerenciado pelo componente pai voa-tab).\r\n * Usado internamente para identificação.\r\n /\r\n @Prop({ reflect: true, attribute: 'item-index' }) itemIndex?: number;\r\n\r\n /\r\n Evento emitido quando o tab é clicado.\r\n * O pai (voa-tab) escuta isso para gerenciar a seleção.\r\n /\r\n @Event() tabClick: EventEmitter<void>;\r\n\r\n /\r\n Handler interno de clique.\r\n /\r\n private handleClick = () => {\r\n if (!this.disabled && this.state !== 'disabled') {\r\n this.tabClick.emit();\r\n }\r\n };\r\n\r\n /\r\n Método para acessibilidade WCAG 2.2 AA.\r\n * Delega foco ao elemento interno.\r\n /\r\n @Method()\r\n async setFocus(): Promise<void> {\r\n const base = this.host.shadowRoot?.querySelector('[part=\"base\"]') as HTMLElement;\r\n if (base) {\r\n base.focus();\r\n }\r\n }\r\n\r\n /\r\n Determina o estado efetivo do componente.\r\n * Se disabled=true, força state=\"disabled\".\r\n /\r\n private getEffectiveState(): 'active' \| 'default' \| 'disabled' {\r\n if (this.disabled) {\r\n return 'disabled';\r\n }\r\n return this.state;\r\n }\r\n\r\n /\r\n Determina o valor do badge a ser exibido.\r\n */\r\n private getBadgeValue(): string {\r\n if (this.badgeCount !== undefined) {\r\n return String(this.badgeCount);\r\n }\r\n return '0';\r\n }\r\n\r\n render() {\r\n const effectiveState = this.getEffectiveState();\r\n const isActive = effectiveState === 'active';\r\n const isDisabled = effectiveState === 'disabled';\r\n\r\n return (\r\n <Host\r\n role=\"tab\"\r\n aria-selected={isActive ? 'true' : 'false'}\r\n aria-disabled={isDisabled ? 'true' : undefined}\r\n tabindex={isDisabled ? -1 : (isActive ? 0 : -1)}\r\n onClick={this.handleClick}\r\n >\r\n <div\r\n part=\"base\"\r\n class={{\r\n 'voa-tab-item': true,\r\n [`voa-tab-item--${effectiveState}`]: true,\r\n [`voa-tab-item--${this.position}`]: true,\r\n 'voa-tab-item--disabled': isDisabled,\r\n }}\r\n >\r\n <span part=\"label\" class=\"voa-tab-item__label\">\r\n <slot></slot>\r\n </span>\r\n {this.showBadge && (\r\n <div part=\"badge\" class=\"voa-tab-item__badge\">\r\n <span class=\"voa-tab-item__badge-text\">{this.getBadgeValue()}</span>\r\n </div>\r\n )}\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}"],"version":3}
1	+ {"file":"voa-tab-item.js","mappings":"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","names":["VoaTabItem","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-tab-item/voa-tab-item.css?tag=voa-tab-item&encapsulation=shadow","src/components/voa-tab-item/voa-tab-item.tsx"],"sourcesContent":["/* * UNSTYLED PATTERN: This file contains ONLY structural CSS (layout, positioning).\r\n * All visual styles (colors, backgrounds, fonts, spacing) must be applied externally\r\n * via CSS Parts API (::part() selectors) using design tokens.\r\n * * IMPORTANT: NÃO incluir cores, fontes, espaçamentos ou valores hardcoded.\r\n * Apenas estrutura: display, position, flexbox, grid, box-sizing, cursor, etc.\r\n /\r\n\r\n:host {\r\n display: inline-block;\r\n box-sizing: border-box;\r\n}\r\n\r\n.voa-tab-item {\r\n / APENAS estilos estruturais /\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n position: relative;\r\n box-sizing: border-box;\r\n cursor: pointer;\r\n user-select: none;\r\n / Gap estrutural para espaçamento entre label e badge /\r\n gap: 0;\r\n / Layout flex para garantir alinhamento correto /\r\n flex-direction: row;\r\n flex-wrap: nowrap;\r\n}\r\n\r\n.voa-tab-item--disabled {\r\n cursor: not-allowed;\r\n pointer-events: none;\r\n}\r\n\r\n.voa-tab-item__label {\r\n display: inline-block;\r\n flex-shrink: 0;\r\n}\r\n\r\n.voa-tab-item__badge {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n position: relative;\r\n box-sizing: border-box;\r\n}\r\n\r\n.voa-tab-item__badge-text {\r\n display: inline-block;\r\n text-align: center;\r\n white-space: nowrap;\r\n}","import { Component, Host, h, Prop, Element, Method, Event, EventEmitter } from '@stencil/core';\r\n\r\n/\r\n Item individual de tab do Voa Design System.\r\n * * Baseado no design do Figma: https://www.figma.com/design/wDStUEuqpl7Tu1oHpiAml6/Voa-Design-System?node-id=366-1545\r\n * * O componente segue o padrão \"unstyled\" (headless), fornecendo apenas estrutura e lógica.\r\n * Todos os estilos visuais devem ser aplicados externamente via CSS Parts API usando design tokens.\r\n * * @part base - O elemento raiz do item de tab\r\n * @part label - Container do texto do item\r\n * @part badge - Container do badge (quando showBadge=true)\r\n /\r\n@Component({\r\n tag: 'voa-tab-item',\r\n styleUrl: 'voa-tab-item.css',\r\n shadow: true,\r\n scoped: false, // Permite herdar variáveis CSS do contexto pai\r\n})\r\nexport class VoaTabItem {\r\n @Element() host: HTMLVoaTabItemElement;\r\n\r\n /\r\n Estado do item de tab.\r\n * Mapeia os estados do Figma: Active, Default, Disabled.\r\n /\r\n @Prop({ reflect: true }) state: 'active' \| 'default' \| 'disabled' = 'default';\r\n\r\n /\r\n Posição do indicador de ativo (borda).\r\n * Mapeia as posições do Figma: Default (bottom), Top, Right, Left.\r\n /\r\n @Prop({ reflect: true }) position: 'default' \| 'top' \| 'right' \| 'left' = 'default';\r\n\r\n /\r\n Se verdadeiro, exibe um badge no item.\r\n /\r\n @Prop({ reflect: true }) showBadge: boolean = false;\r\n\r\n /\r\n Número a ser exibido no badge (opcional).\r\n * Se não fornecido e showBadge=true, exibe \"0\".\r\n /\r\n @Prop() badgeCount?: number;\r\n\r\n /\r\n Se verdadeiro, o item estará desabilitado.\r\n * Alias para state=\"disabled\".\r\n /\r\n @Prop({ reflect: true }) disabled: boolean = false;\r\n\r\n /\r\n Índice do item (gerenciado pelo componente pai voa-tab).\r\n * Usado internamente para identificação.\r\n /\r\n @Prop({ reflect: true, attribute: 'item-index' }) itemIndex?: number;\r\n\r\n /\r\n Evento emitido quando o tab é clicado.\r\n * O pai (voa-tab) escuta isso para gerenciar a seleção.\r\n /\r\n @Event() tabClick: EventEmitter<void>;\r\n\r\n /\r\n Handler interno de clique.\r\n /\r\n private handleClick = () => {\r\n if (!this.disabled && this.state !== 'disabled') {\r\n this.tabClick.emit();\r\n }\r\n };\r\n\r\n /\r\n Método para acessibilidade WCAG 2.2 AA.\r\n * Delega foco ao elemento interno.\r\n /\r\n @Method()\r\n async setFocus(): Promise<void> {\r\n const base = this.host.shadowRoot?.querySelector('[part=\"base\"]') as HTMLElement;\r\n if (base) {\r\n base.focus();\r\n }\r\n }\r\n\r\n /\r\n Determina o estado efetivo do componente.\r\n * Se disabled=true, força state=\"disabled\".\r\n /\r\n private getEffectiveState(): 'active' \| 'default' \| 'disabled' {\r\n if (this.disabled) {\r\n return 'disabled';\r\n }\r\n return this.state;\r\n }\r\n\r\n /\r\n Determina o valor do badge a ser exibido.\r\n */\r\n private getBadgeValue(): string {\r\n if (this.badgeCount !== undefined) {\r\n return String(this.badgeCount);\r\n }\r\n return '0';\r\n }\r\n\r\n render() {\r\n const effectiveState = this.getEffectiveState();\r\n const isActive = effectiveState === 'active';\r\n const isDisabled = effectiveState === 'disabled';\r\n\r\n return (\r\n <Host\r\n role=\"tab\"\r\n aria-selected={isActive ? 'true' : 'false'}\r\n aria-disabled={isDisabled ? 'true' : undefined}\r\n tabindex={isDisabled ? -1 : (isActive ? 0 : -1)}\r\n onClick={this.handleClick}\r\n >\r\n <div\r\n part=\"base\"\r\n class={{\r\n 'voa-tab-item': true,\r\n [`voa-tab-item--${effectiveState}`]: true,\r\n [`voa-tab-item--${this.position}`]: true,\r\n 'voa-tab-item--disabled': isDisabled,\r\n }}\r\n >\r\n <span part=\"label\" class=\"voa-tab-item__label\">\r\n <slot></slot>\r\n </span>\r\n {this.showBadge && (\r\n <div part=\"badge\" class=\"voa-tab-item__badge\">\r\n <span class=\"voa-tab-item__badge-text\">{this.getBadgeValue()}</span>\r\n </div>\r\n )}\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}"],"version":3}

package/dist/custom-elements/voa-tab.js CHANGED Viewed

@@ -145,7 +145,6 @@ function defineCustomElement$1() {
             break;
     } });
 }
-defineCustomElement$1();
 const VoaTab = VoaTab$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/custom-elements/voa-tab.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"voa-tab.js","mappings":"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~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~","names":["VoaTab","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-tab/voa-tab.css?tag=voa-tab&encapsulation=shadow","src/components/voa-tab/voa-tab.tsx"],"sourcesContent":[":host {\r\n display: block;\r\n box-sizing: border-box;\r\n}\r\n\r\n.tab-container {\r\n display: block;\r\n width: 100%;\r\n box-sizing: border-box;\r\n}\r\n\r\n.tab-list {\r\n display: flex;\r\n position: relative;\r\n width: 100%;\r\n box-sizing: border-box;\r\n}\r\n\r\n/* Orientation Modifiers /\r\n.tab-horizontal .tab-list {\r\n flex-direction: row;\r\n align-items: flex-end; / Common alignment for tabs sitting on a line /\r\n}\r\n\r\n.tab-vertical {\r\n display: flex; / Container becomes flex in vertical to allow content next to it if needed /\r\n}\r\n\r\n.tab-vertical .tab-list {\r\n flex-direction: column;\r\n width: auto; / Shrink to fit items /\r\n}","import { Component, Host, h, Prop, State, Event, EventEmitter, Element, Watch, Listen } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'voa-tab',\r\n styleUrl: 'voa-tab.css',\r\n shadow: true,\r\n scoped: false, // Permite herdar variáveis CSS do contexto pai\r\n})\r\nexport class VoaTab {\r\n @Element() host: HTMLVoaTabElement;\r\n\r\n @Prop({ reflect: true }) direction: 'horizontal' \| 'vertical' = 'horizontal';\r\n\r\n /\r\n Controlled mode active index.\r\n /\r\n @Prop() activeIndex: number;\r\n\r\n /\r\n Event emitted when the active tab changes.\r\n /\r\n @Event() dsTabChange: EventEmitter<{ index: number }>;\r\n\r\n /\r\n Internal state for uncontrolled mode.\r\n /\r\n @State() internalIndex: number = 0;\r\n\r\n @Watch('activeIndex')\r\n handleActiveIndexChange(newValue: number) {\r\n if (newValue !== undefined) {\r\n this.internalIndex = newValue;\r\n this.syncChildren();\r\n }\r\n }\r\n\r\n componentDidLoad() {\r\n if (this.activeIndex !== undefined) {\r\n this.internalIndex = this.activeIndex;\r\n }\r\n this.syncChildren();\r\n }\r\n\r\n /\r\n Listens for children being added/removed from the slot.\r\n /\r\n private handleSlotChange = () => {\r\n this.syncChildren();\r\n };\r\n\r\n /\r\n Listens for the child emitting its click event.\r\n /\r\n @Listen('tabClick')\r\n handleTabSelected(event: CustomEvent) {\r\n const target = event.target as HTMLVoaTabItemElement;\r\n const tabs = this.getTabs();\r\n const index = tabs.indexOf(target);\r\n\r\n // Ensure we don't activate disabled tabs (double check)\r\n if (index > -1 && !target.disabled && target.state !== 'disabled') {\r\n this.activateTab(index);\r\n }\r\n }\r\n\r\n private getTabs() {\r\n return Array.from(this.host.querySelectorAll('voa-tab-item'));\r\n }\r\n\r\n /\r\n Updates the `state` prop of all children based on current selection.\r\n * Handles the 'active' \| 'default' \| 'disabled' string logic.\r\n */\r\n private syncChildren() {\r\n const tabs = this.getTabs();\r\n tabs.forEach((tab, index) => {\r\n // Never overwrite 'disabled' state\r\n if (tab.disabled \|\| tab.state === 'disabled') {\r\n return; \r\n }\r\n \r\n // Set active or default\r\n if (index === this.internalIndex) {\r\n tab.state = 'active';\r\n } else {\r\n tab.state = 'default';\r\n }\r\n });\r\n }\r\n\r\n private activateTab(index: number) {\r\n this.internalIndex = index;\r\n this.syncChildren();\r\n this.dsTabChange.emit({ index });\r\n }\r\n\r\n private handleKeyDown = (event: KeyboardEvent) => {\r\n const tabs = this.getTabs();\r\n if (tabs.length === 0) return;\r\n\r\n const isVertical = this.direction === 'vertical';\r\n const nextKey = isVertical ? 'ArrowDown' : 'ArrowRight';\r\n const prevKey = isVertical ? 'ArrowUp' : 'ArrowLeft';\r\n\r\n let nextIndex = this.internalIndex;\r\n\r\n if (event.key === nextKey) {\r\n event.preventDefault();\r\n nextIndex = this.internalIndex + 1;\r\n if (nextIndex >= tabs.length) nextIndex = 0;\r\n } else if (event.key === prevKey) {\r\n event.preventDefault();\r\n nextIndex = this.internalIndex - 1;\r\n if (nextIndex < 0) nextIndex = tabs.length - 1;\r\n } else if (event.key === 'Home') {\r\n event.preventDefault();\r\n nextIndex = 0;\r\n } else if (event.key === 'End') {\r\n event.preventDefault();\r\n nextIndex = tabs.length - 1;\r\n } else {\r\n return;\r\n }\r\n\r\n // Simple skip for disabled tabs (moves to the one requested, if disabled, does nothing in this simple version)\r\n // In production, you'd want a while loop to find the next non-disabled index.\r\n const targetTab = tabs[nextIndex];\r\n if (targetTab.disabled \|\| targetTab.state === 'disabled') {\r\n return; \r\n }\r\n\r\n this.activateTab(nextIndex);\r\n tabs[nextIndex].setFocus();\r\n };\r\n\r\n render() {\r\n return (\r\n <Host \r\n role=\"tablist\" \r\n aria-orientation={this.direction}\r\n onKeyDown={this.handleKeyDown}\r\n >\r\n <div part=\"base\" class={{\r\n 'tab-container': true,\r\n [`tab-${this.direction}`]: true\r\n }}>\r\n <div part=\"list\" class=\"tab-list\">\r\n <slot onSlotchange={this.handleSlotChange} />\r\n </div>\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}"],"version":3}
1	+ {"file":"voa-tab.js","mappings":"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","names":["VoaTab","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-tab/voa-tab.css?tag=voa-tab&encapsulation=shadow","src/components/voa-tab/voa-tab.tsx"],"sourcesContent":[":host {\r\n display: block;\r\n box-sizing: border-box;\r\n}\r\n\r\n.tab-container {\r\n display: block;\r\n width: 100%;\r\n box-sizing: border-box;\r\n}\r\n\r\n.tab-list {\r\n display: flex;\r\n position: relative;\r\n width: 100%;\r\n box-sizing: border-box;\r\n}\r\n\r\n/* Orientation Modifiers /\r\n.tab-horizontal .tab-list {\r\n flex-direction: row;\r\n align-items: flex-end; / Common alignment for tabs sitting on a line /\r\n}\r\n\r\n.tab-vertical {\r\n display: flex; / Container becomes flex in vertical to allow content next to it if needed /\r\n}\r\n\r\n.tab-vertical .tab-list {\r\n flex-direction: column;\r\n width: auto; / Shrink to fit items /\r\n}","import { Component, Host, h, Prop, State, Event, EventEmitter, Element, Watch, Listen } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'voa-tab',\r\n styleUrl: 'voa-tab.css',\r\n shadow: true,\r\n scoped: false, // Permite herdar variáveis CSS do contexto pai\r\n})\r\nexport class VoaTab {\r\n @Element() host: HTMLVoaTabElement;\r\n\r\n @Prop({ reflect: true }) direction: 'horizontal' \| 'vertical' = 'horizontal';\r\n\r\n /\r\n Controlled mode active index.\r\n /\r\n @Prop() activeIndex: number;\r\n\r\n /\r\n Event emitted when the active tab changes.\r\n /\r\n @Event() dsTabChange: EventEmitter<{ index: number }>;\r\n\r\n /\r\n Internal state for uncontrolled mode.\r\n /\r\n @State() internalIndex: number = 0;\r\n\r\n @Watch('activeIndex')\r\n handleActiveIndexChange(newValue: number) {\r\n if (newValue !== undefined) {\r\n this.internalIndex = newValue;\r\n this.syncChildren();\r\n }\r\n }\r\n\r\n componentDidLoad() {\r\n if (this.activeIndex !== undefined) {\r\n this.internalIndex = this.activeIndex;\r\n }\r\n this.syncChildren();\r\n }\r\n\r\n /\r\n Listens for children being added/removed from the slot.\r\n /\r\n private handleSlotChange = () => {\r\n this.syncChildren();\r\n };\r\n\r\n /\r\n Listens for the child emitting its click event.\r\n /\r\n @Listen('tabClick')\r\n handleTabSelected(event: CustomEvent) {\r\n const target = event.target as HTMLVoaTabItemElement;\r\n const tabs = this.getTabs();\r\n const index = tabs.indexOf(target);\r\n\r\n // Ensure we don't activate disabled tabs (double check)\r\n if (index > -1 && !target.disabled && target.state !== 'disabled') {\r\n this.activateTab(index);\r\n }\r\n }\r\n\r\n private getTabs() {\r\n return Array.from(this.host.querySelectorAll('voa-tab-item'));\r\n }\r\n\r\n /\r\n Updates the `state` prop of all children based on current selection.\r\n * Handles the 'active' \| 'default' \| 'disabled' string logic.\r\n */\r\n private syncChildren() {\r\n const tabs = this.getTabs();\r\n tabs.forEach((tab, index) => {\r\n // Never overwrite 'disabled' state\r\n if (tab.disabled \|\| tab.state === 'disabled') {\r\n return; \r\n }\r\n \r\n // Set active or default\r\n if (index === this.internalIndex) {\r\n tab.state = 'active';\r\n } else {\r\n tab.state = 'default';\r\n }\r\n });\r\n }\r\n\r\n private activateTab(index: number) {\r\n this.internalIndex = index;\r\n this.syncChildren();\r\n this.dsTabChange.emit({ index });\r\n }\r\n\r\n private handleKeyDown = (event: KeyboardEvent) => {\r\n const tabs = this.getTabs();\r\n if (tabs.length === 0) return;\r\n\r\n const isVertical = this.direction === 'vertical';\r\n const nextKey = isVertical ? 'ArrowDown' : 'ArrowRight';\r\n const prevKey = isVertical ? 'ArrowUp' : 'ArrowLeft';\r\n\r\n let nextIndex = this.internalIndex;\r\n\r\n if (event.key === nextKey) {\r\n event.preventDefault();\r\n nextIndex = this.internalIndex + 1;\r\n if (nextIndex >= tabs.length) nextIndex = 0;\r\n } else if (event.key === prevKey) {\r\n event.preventDefault();\r\n nextIndex = this.internalIndex - 1;\r\n if (nextIndex < 0) nextIndex = tabs.length - 1;\r\n } else if (event.key === 'Home') {\r\n event.preventDefault();\r\n nextIndex = 0;\r\n } else if (event.key === 'End') {\r\n event.preventDefault();\r\n nextIndex = tabs.length - 1;\r\n } else {\r\n return;\r\n }\r\n\r\n // Simple skip for disabled tabs (moves to the one requested, if disabled, does nothing in this simple version)\r\n // In production, you'd want a while loop to find the next non-disabled index.\r\n const targetTab = tabs[nextIndex];\r\n if (targetTab.disabled \|\| targetTab.state === 'disabled') {\r\n return; \r\n }\r\n\r\n this.activateTab(nextIndex);\r\n tabs[nextIndex].setFocus();\r\n };\r\n\r\n render() {\r\n return (\r\n <Host \r\n role=\"tablist\" \r\n aria-orientation={this.direction}\r\n onKeyDown={this.handleKeyDown}\r\n >\r\n <div part=\"base\" class={{\r\n 'tab-container': true,\r\n [`tab-${this.direction}`]: true\r\n }}>\r\n <div part=\"list\" class=\"tab-list\">\r\n <slot onSlotchange={this.handleSlotChange} />\r\n </div>\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}"],"version":3}

package/dist/custom-elements/voa-table.js CHANGED Viewed

@@ -33,7 +33,6 @@ function defineCustomElement$1() {
             break;
     } });
 }
-defineCustomElement$1();
 const VoaTable = Table;
 const defineCustomElement = defineCustomElement$1;

package/dist/custom-elements/voa-table.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"voa-table.js","mappings":";;AAAA,MAAM,QAAQ,GAAG,kIAAkI;;MCOtI,KAAK,iBAAAA,kBAAA,CAAA,MAAA,KAAA,SAAAC,CAAA,CAAA;AALlB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;AAMU,QAAA,IAAI,CAAA,IAAA,GAAU,EAAE;AAChB,QAAA,IAAO,CAAA,OAAA,GAAa,EAAE;AAwB/B;IAtBC,MAAM,GAAA;QACJ,QACE,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAO,KAAK,EAAC,OAAO,EAAA,EAClB,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACE,CAAA,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACG,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,MACvB,CAAK,CAAA,IAAA,EAAA,IAAA,EAAA,MAAM,CAAM,CAClB,CAAC,CACC,CACC,EACR,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACG,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,MACjB,CAAA,CAAA,IAAA,EAAA,IAAA,EACG,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,MACvB,CAAK,CAAA,IAAA,EAAA,IAAA,EAAA,GAAG,CAAC,MAAM,CAAC,CAAM,CACvB,CAAC,CACC,CACN,CAAC,CACI,CACF~~;;;;;;;;;;;;;;;;;;;;;;;;;;;~~","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-table/table.css?tag=voa-table&encapsulation=shadow","src/components/voa-table/table.tsx"],"sourcesContent":[".table {\r\n width: 100%;\r\n border-collapse: collapse;\r\n}\r\n\r\nth,\r\ntd {\r\n padding: 10px;\r\n border: 1px solid #ddd;\r\n text-align: left;\r\n}\r\n\r\nth {\r\n background-color: #f4f4f4;\r\n}\r\n","import { Component, Prop, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n tag: \"voa-table\",\r\n styleUrl: \"table.css\",\r\n shadow: true,\r\n})\r\nexport class Table {\r\n @Prop() data: any[] = [];\r\n @Prop() columns: string[] = [];\r\n\r\n render() {\r\n return (\r\n <table class=\"table\">\r\n <thead>\r\n <tr>\r\n {this.columns.map((column) => (\r\n <th>{column}</th>\r\n ))}\r\n </tr>\r\n </thead>\r\n <tbody>\r\n {this.data.map((row) => (\r\n <tr>\r\n {this.columns.map((column) => (\r\n <td>{row[column]}</td>\r\n ))}\r\n </tr>\r\n ))}\r\n </tbody>\r\n </table>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"voa-table.js","mappings":";;AAAA,MAAM,QAAQ,GAAG,kIAAkI;;MCOtI,KAAK,iBAAAA,kBAAA,CAAA,MAAA,KAAA,SAAAC,CAAA,CAAA;AALlB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;AAMU,QAAA,IAAI,CAAA,IAAA,GAAU,EAAE;AAChB,QAAA,IAAO,CAAA,OAAA,GAAa,EAAE;AAwB/B;IAtBC,MAAM,GAAA;QACJ,QACE,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAO,KAAK,EAAC,OAAO,EAAA,EAClB,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACE,CAAA,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACG,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,MACvB,CAAK,CAAA,IAAA,EAAA,IAAA,EAAA,MAAM,CAAM,CAClB,CAAC,CACC,CACC,EACR,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACG,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,MACjB,CAAA,CAAA,IAAA,EAAA,IAAA,EACG,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,MACvB,CAAK,CAAA,IAAA,EAAA,IAAA,EAAA,GAAG,CAAC,MAAM,CAAC,CAAM,CACvB,CAAC,CACC,CACN,CAAC,CACI,CACF;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-table/table.css?tag=voa-table&encapsulation=shadow","src/components/voa-table/table.tsx"],"sourcesContent":[".table {\r\n width: 100%;\r\n border-collapse: collapse;\r\n}\r\n\r\nth,\r\ntd {\r\n padding: 10px;\r\n border: 1px solid #ddd;\r\n text-align: left;\r\n}\r\n\r\nth {\r\n background-color: #f4f4f4;\r\n}\r\n","import { Component, Prop, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n tag: \"voa-table\",\r\n styleUrl: \"table.css\",\r\n shadow: true,\r\n})\r\nexport class Table {\r\n @Prop() data: any[] = [];\r\n @Prop() columns: string[] = [];\r\n\r\n render() {\r\n return (\r\n <table class=\"table\">\r\n <thead>\r\n <tr>\r\n {this.columns.map((column) => (\r\n <th>{column}</th>\r\n ))}\r\n </tr>\r\n </thead>\r\n <tbody>\r\n {this.data.map((row) => (\r\n <tr>\r\n {this.columns.map((column) => (\r\n <td>{row[column]}</td>\r\n ))}\r\n </tr>\r\n ))}\r\n </tbody>\r\n </table>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/custom-elements/voa-tag.js CHANGED Viewed

@@ -62,7 +62,6 @@ function defineCustomElement$1() {
             break;
     } });
 }
-defineCustomElement$1();
 const VoaTag = VoaTag$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/custom-elements/voa-tag.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"voa-tag.js","mappings":";;AAAA,MAAM,SAAS,GAAG,+WAA+W;;MCmBpXA,QAAM,iBAAAC,kBAAA,CAAA,MAAA,MAAA,SAAAC,CAAA,CAAA;AALnB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;AAaE;;AAEG;AACsB,QAAA,IAAO,CAAA,OAAA,GAAsB,OAAO;AAE7D;;AAEG;AACsB,QAAA,IAAK,CAAA,KAAA,GAAuB,SAAS;AAE9D;;AAEG;AACsB,QAAA,IAAI,CAAA,IAAA,GAAgB,IAAI;AAEjD;;AAEG;AACsB,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AAElD;;AAEG;AACsB,QAAA,IAAS,CAAA,SAAA,GAAY,KAAK;AAoCpD;IAlCC,MAAM,GAAA;AACJ,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,KAAK,OAAO;QAExC,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAC,MAAM,EACX,KAAK,EAAE;AACL,gBAAA,eAAe,EAAE,IAAI;AACrB,gBAAA,CAAC,OAAO,IAAI,CAAC,OAAO,CAAE,CAAA,GAAG,IAAI;AAC7B,gBAAA,CAAC,OAAO,IAAI,CAAC,KAAK,CAAE,CAAA,GAAG,IAAI;AAC3B,gBAAA,CAAC,OAAO,IAAI,CAAC,IAAI,CAAE,CAAA,GAAG,IAAI;aAC3B,EAAA,EAEA,OAAO,IAAI,IAAI,CAAC,QAAQ,KACvB,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,YAAY,EAAC,KAAK,EAAC,gBAAgB,EAAA,EAC5C,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,YAAY,EAAA,CAAG,CACrB,CACR,EAED,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,WAAW,EAAA,EACjC,IAAI,CAAC,KAAK,EACX,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAQ,CACH,EAEN,OAAO,IAAI,IAAI,CAAC,SAAS,KACxB,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,UAAU,EAAC,KAAK,EAAC,cAAc,EAAA,EACxC,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,UAAU,EAAA,CAAG,CACnB,CACR,CACG,CACD~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~","names":["VoaTag","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-tag/voa-tag.css?tag=voa-tag&encapsulation=shadow","src/components/voa-tag/voa-tag.tsx"],"sourcesContent":["/* UNSTYLED PATTERN: Structural CSS only /\r\n\r\n:host {\r\n display: inline-flex;\r\n vertical-align: middle;\r\n box-sizing: border-box;\r\n}\r\n\r\n.tag-container {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n box-sizing: border-box;\r\n width: 100%;\r\n height: 100%;\r\n}\r\n\r\n.tag-label {\r\n display: block;\r\n white-space: nowrap;\r\n box-sizing: border-box;\r\n}\r\n\r\n.tag-icon-start,\r\n.tag-icon-end {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n line-height: 0; / Prevents icon height weirdness /\r\n}\r\n","import { Component, Prop, h, Host, Element } from '@stencil/core';\r\n\r\n/\r\n Tag component para exibir labels categorizadores, status ou metadados.\r\n * Baseado no design do Figma (node-id: 1436-769).\r\n \r\n O componente segue o padrão \"headless/unstyled\" - apenas estrutura e lógica.\r\n * Estilos visuais devem ser aplicados externamente via CSS Parts API usando design tokens.\r\n \r\n @part base - O container principal do tag\r\n * @part label - O wrapper do texto\r\n * @part icon-start - Container do ícone à esquerda (slot para variante icons)\r\n * @part icon-end - Container do ícone à direita (slot para variante icons)\r\n /\r\n@Component({\r\n tag: 'voa-tag',\r\n styleUrl: 'voa-tag.css',\r\n shadow: true,\r\n})\r\nexport class VoaTag {\r\n @Element() host: HTMLElement;\r\n\r\n /\r\n O texto a ser exibido no tag\r\n /\r\n @Prop({ reflect: true }) label?: string;\r\n\r\n /\r\n A variante do tag\r\n /\r\n @Prop({ reflect: true }) variant: 'plain' \| 'icons' = 'plain';\r\n\r\n /\r\n Forma do tag\r\n /\r\n @Prop({ reflect: true }) shape: 'default' \| 'pill' = 'default';\r\n\r\n /\r\n Tamanho do tag\r\n /\r\n @Prop({ reflect: true }) size: 'sm' \| 'md' = 'md';\r\n\r\n /\r\n Exibe o ícone à esquerda (apenas se variant=\"icons\")\r\n /\r\n @Prop({ reflect: true }) iconLeft: boolean = false;\r\n\r\n /\r\n Exibe o ícone à direita (apenas se variant=\"icons\")\r\n */\r\n @Prop({ reflect: true }) iconRight: boolean = false;\r\n\r\n render() {\r\n const isIcons = this.variant === 'icons';\r\n\r\n return (\r\n <Host>\r\n <div\r\n part=\"base\"\r\n class={{\r\n 'tag-container': true,\r\n [`tag-${this.variant}`]: true,\r\n [`tag-${this.shape}`]: true,\r\n [`tag-${this.size}`]: true,\r\n }}\r\n >\r\n {isIcons && this.iconLeft && (\r\n <span part=\"icon-start\" class=\"tag-icon-start\">\r\n <slot name=\"icon-start\" />\r\n </span>\r\n )}\r\n\r\n <span part=\"label\" class=\"tag-label\">\r\n {this.label}\r\n <slot />\r\n </span>\r\n\r\n {isIcons && this.iconRight && (\r\n <span part=\"icon-end\" class=\"tag-icon-end\">\r\n <slot name=\"icon-end\" />\r\n </span>\r\n )}\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"voa-tag.js","mappings":";;AAAA,MAAM,SAAS,GAAG,+WAA+W;;MCmBpXA,QAAM,iBAAAC,kBAAA,CAAA,MAAA,MAAA,SAAAC,CAAA,CAAA;AALnB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;AAaE;;AAEG;AACsB,QAAA,IAAO,CAAA,OAAA,GAAsB,OAAO;AAE7D;;AAEG;AACsB,QAAA,IAAK,CAAA,KAAA,GAAuB,SAAS;AAE9D;;AAEG;AACsB,QAAA,IAAI,CAAA,IAAA,GAAgB,IAAI;AAEjD;;AAEG;AACsB,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AAElD;;AAEG;AACsB,QAAA,IAAS,CAAA,SAAA,GAAY,KAAK;AAoCpD;IAlCC,MAAM,GAAA;AACJ,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,KAAK,OAAO;QAExC,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAC,MAAM,EACX,KAAK,EAAE;AACL,gBAAA,eAAe,EAAE,IAAI;AACrB,gBAAA,CAAC,OAAO,IAAI,CAAC,OAAO,CAAE,CAAA,GAAG,IAAI;AAC7B,gBAAA,CAAC,OAAO,IAAI,CAAC,KAAK,CAAE,CAAA,GAAG,IAAI;AAC3B,gBAAA,CAAC,OAAO,IAAI,CAAC,IAAI,CAAE,CAAA,GAAG,IAAI;aAC3B,EAAA,EAEA,OAAO,IAAI,IAAI,CAAC,QAAQ,KACvB,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,YAAY,EAAC,KAAK,EAAC,gBAAgB,EAAA,EAC5C,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,YAAY,EAAA,CAAG,CACrB,CACR,EAED,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,WAAW,EAAA,EACjC,IAAI,CAAC,KAAK,EACX,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAQ,CACH,EAEN,OAAO,IAAI,IAAI,CAAC,SAAS,KACxB,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,UAAU,EAAC,KAAK,EAAC,cAAc,EAAA,EACxC,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,UAAU,EAAA,CAAG,CACnB,CACR,CACG,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["VoaTag","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-tag/voa-tag.css?tag=voa-tag&encapsulation=shadow","src/components/voa-tag/voa-tag.tsx"],"sourcesContent":["/* UNSTYLED PATTERN: Structural CSS only /\r\n\r\n:host {\r\n display: inline-flex;\r\n vertical-align: middle;\r\n box-sizing: border-box;\r\n}\r\n\r\n.tag-container {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n box-sizing: border-box;\r\n width: 100%;\r\n height: 100%;\r\n}\r\n\r\n.tag-label {\r\n display: block;\r\n white-space: nowrap;\r\n box-sizing: border-box;\r\n}\r\n\r\n.tag-icon-start,\r\n.tag-icon-end {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n line-height: 0; / Prevents icon height weirdness /\r\n}\r\n","import { Component, Prop, h, Host, Element } from '@stencil/core';\r\n\r\n/\r\n Tag component para exibir labels categorizadores, status ou metadados.\r\n * Baseado no design do Figma (node-id: 1436-769).\r\n \r\n O componente segue o padrão \"headless/unstyled\" - apenas estrutura e lógica.\r\n * Estilos visuais devem ser aplicados externamente via CSS Parts API usando design tokens.\r\n \r\n @part base - O container principal do tag\r\n * @part label - O wrapper do texto\r\n * @part icon-start - Container do ícone à esquerda (slot para variante icons)\r\n * @part icon-end - Container do ícone à direita (slot para variante icons)\r\n /\r\n@Component({\r\n tag: 'voa-tag',\r\n styleUrl: 'voa-tag.css',\r\n shadow: true,\r\n})\r\nexport class VoaTag {\r\n @Element() host: HTMLElement;\r\n\r\n /\r\n O texto a ser exibido no tag\r\n /\r\n @Prop({ reflect: true }) label?: string;\r\n\r\n /\r\n A variante do tag\r\n /\r\n @Prop({ reflect: true }) variant: 'plain' \| 'icons' = 'plain';\r\n\r\n /\r\n Forma do tag\r\n /\r\n @Prop({ reflect: true }) shape: 'default' \| 'pill' = 'default';\r\n\r\n /\r\n Tamanho do tag\r\n /\r\n @Prop({ reflect: true }) size: 'sm' \| 'md' = 'md';\r\n\r\n /\r\n Exibe o ícone à esquerda (apenas se variant=\"icons\")\r\n /\r\n @Prop({ reflect: true }) iconLeft: boolean = false;\r\n\r\n /\r\n Exibe o ícone à direita (apenas se variant=\"icons\")\r\n */\r\n @Prop({ reflect: true }) iconRight: boolean = false;\r\n\r\n render() {\r\n const isIcons = this.variant === 'icons';\r\n\r\n return (\r\n <Host>\r\n <div\r\n part=\"base\"\r\n class={{\r\n 'tag-container': true,\r\n [`tag-${this.variant}`]: true,\r\n [`tag-${this.shape}`]: true,\r\n [`tag-${this.size}`]: true,\r\n }}\r\n >\r\n {isIcons && this.iconLeft && (\r\n <span part=\"icon-start\" class=\"tag-icon-start\">\r\n <slot name=\"icon-start\" />\r\n </span>\r\n )}\r\n\r\n <span part=\"label\" class=\"tag-label\">\r\n {this.label}\r\n <slot />\r\n </span>\r\n\r\n {isIcons && this.iconRight && (\r\n <span part=\"icon-end\" class=\"tag-icon-end\">\r\n <slot name=\"icon-end\" />\r\n </span>\r\n )}\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/custom-elements/voa-text-area.js CHANGED Viewed

@@ -144,7 +144,6 @@ function defineCustomElement$1() {
             break;
     } });
 }
-defineCustomElement$1();
 const VoaTextArea = VoaTextArea$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/custom-elements/voa-text-area.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"voa-text-area.js","mappings":"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","names":["VoaTextArea","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-text-area/voa-text-area.css?tag=voa-text-area&encapsulation=shadow","src/components/voa-text-area/voa-text-area.tsx"],"sourcesContent":["/* UNSTYLED PATTERN: Structural CSS only /\r\n\r\n:host {\r\n display: block;\r\n box-sizing: border-box;\r\n}\r\n\r\n.label-wrapper {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: flex-end;\r\n box-sizing: border-box;\r\n}\r\n\r\n.label-text {\r\n flex: 1;\r\n}\r\n\r\n.textarea-container {\r\n position: relative;\r\n box-sizing: border-box;\r\n overflow: hidden;\r\n / Needed for border-radius clipping /\r\n display: flex;\r\n / Flex ensures child textarea fills height /\r\n flex-direction: column;\r\n}\r\n\r\ntextarea {\r\n flex: 1;\r\n / Fills the container /\r\n width: 100%;\r\n / Fills width /\r\n height: 100%;\r\n / Fills height /\r\n border: none;\r\n outline: none;\r\n background: transparent;\r\n resize: none;\r\n / Disable native resize /\r\n box-sizing: border-box;\r\n display: block;\r\n margin: 0;\r\n padding: 0;\r\n}\r\n\r\n.resize-handle {\r\n position: absolute;\r\n bottom: 2px;\r\n right: 2px;\r\n width: 12px;\r\n height: 12px;\r\n cursor: nwse-resize;\r\n z-index: 10;\r\n pointer-events: auto;\r\n}\r\n\r\n.footer {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: flex-start;\r\n margin-top: 4px;\r\n}\r\n\r\n.character-counter {\r\n margin-left: auto;\r\n / Push to right /\r\n}","import { Component, Prop, State, Event, EventEmitter, Method, Element, h, Host, Watch, AttachInternals } from '@stencil/core';\r\n\r\n/\r\n Componente de área de texto para entrada de textos longos\r\n * @part base - The root host element\r\n * @part container - The resizable wrapper\r\n * @part textarea - The native textarea\r\n /\r\n@Component({\r\n tag: 'voa-text-area',\r\n styleUrl: 'voa-text-area.css',\r\n shadow: {\r\n delegatesFocus: true\r\n },\r\n formAssociated: true\r\n})\r\nexport class VoaTextArea {\r\n @Element() host: HTMLVoaTextAreaElement;\r\n @AttachInternals() internals: ElementInternals;\r\n\r\n @Prop() textareaId?: string;\r\n @Prop() name?: string;\r\n @Prop() label?: string;\r\n @Prop() info?: boolean = false;\r\n @Prop() infoText?: string = 'Identificador único';\r\n @Prop() placeholder?: string;\r\n @Prop() value?: string = '';\r\n @Prop() maxLength?: number;\r\n @Prop({ reflect: true }) disabled?: boolean = false;\r\n @Prop({ reflect: true }) readonly?: boolean = false;\r\n @Prop() required?: boolean = false;\r\n @Prop() rows?: number = 4;\r\n @Prop() cols?: number = 20;\r\n @Prop() errorMessage?: string;\r\n @Prop({ reflect: true }) hasError?: boolean = false;\r\n\r\n @State() internalValue: string = '';\r\n @State() isFocused: boolean = false;\r\n @State() characterCount: number = 0;\r\n\r\n // Stable ID for ARIA\r\n private uniqueId: string;\r\n private containerRef?: HTMLDivElement;\r\n\r\n @Event() voaChange: EventEmitter<string>;\r\n @Event() voaInput: EventEmitter<string>;\r\n @Event() voaFocus: EventEmitter<FocusEvent>;\r\n @Event() voaBlur: EventEmitter<FocusEvent>;\r\n\r\n componentWillLoad() {\r\n this.uniqueId = this.textareaId \|\| `voa-textarea-${Math.random().toString(36).substr(2, 9)}`;\r\n this.internalValue = this.value \|\| '';\r\n this.characterCount = this.internalValue.length;\r\n this.updateFormInternals();\r\n }\r\n\r\n @Watch('value')\r\n valueChanged(newValue: string) {\r\n this.internalValue = newValue \|\| '';\r\n this.characterCount = this.internalValue.length;\r\n this.updateFormInternals();\r\n }\r\n\r\n private updateFormInternals() {\r\n this.internals.setFormValue(this.internalValue);\r\n // Aria-invalid is handled on the element in render, but could be done here too if delegating to host\r\n }\r\n\r\n private handleInput = (event: Event) => {\r\n const textarea = event.target as HTMLTextAreaElement;\r\n this.internalValue = textarea.value;\r\n this.characterCount = this.internalValue.length;\r\n\r\n this.updateFormInternals();\r\n this.voaInput.emit(this.internalValue);\r\n };\r\n\r\n private handleChange = (event: Event) => {\r\n event.stopPropagation(); // Stop native change, emit ours\r\n this.voaChange.emit(this.internalValue);\r\n };\r\n\r\n private handleFocus = (event: FocusEvent) => {\r\n this.isFocused = true;\r\n this.voaFocus.emit(event);\r\n };\r\n\r\n private handleBlur = (event: FocusEvent) => {\r\n this.isFocused = false;\r\n this.voaBlur.emit(event);\r\n };\r\n\r\n @Method()\r\n async setFocus(): Promise<void> {\r\n // Delegates focus handles this mostly, but good for imperative usage\r\n this.host.focus();\r\n }\r\n\r\n // --- RESIZE LOGIC FIXED ---\r\n // We resize the CONTAINER, not the textarea.\r\n private startResize = (event: MouseEvent) => {\r\n event.preventDefault();\r\n if (this.disabled \|\| this.readonly \|\| !this.containerRef) return;\r\n\r\n const startX = event.clientX;\r\n const startY = event.clientY;\r\n\r\n // Get current dimensions of the container\r\n const startWidth = this.containerRef.offsetWidth;\r\n const startHeight = this.containerRef.offsetHeight;\r\n\r\n const doDrag = (e: MouseEvent) => {\r\n // Apply style to CONTAINER\r\n // Using requestAnimationFrame for performance is better, but this is simple enough for now\r\n this.containerRef.style.width = `${Math.max(100, startWidth + e.clientX - startX)}px`;\r\n this.containerRef.style.height = `${Math.max(60, startHeight + e.clientY - startY)}px`;\r\n };\r\n\r\n const stopDrag = () => {\r\n document.removeEventListener('mousemove', doDrag);\r\n document.removeEventListener('mouseup', stopDrag);\r\n };\r\n\r\n document.addEventListener('mousemove', doDrag);\r\n document.addEventListener('mouseup', stopDrag);\r\n };\r\n\r\n private renderInfoIcon = () => (\r\n <svg part=\"label-info-icon\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" aria-hidden=\"true\">\r\n <circle cx=\"12\" cy=\"12\" r=\"10\"></circle>\r\n <line x1=\"12\" y1=\"16\" x2=\"12\" y2=\"12\"></line>\r\n <line x1=\"12\" y1=\"8\" x2=\"12.01\" y2=\"8\"></line>\r\n </svg>\r\n );\r\n\r\n private renderResizeIcon = () => (\r\n <svg width=\"10\" height=\"10\" viewBox=\"0 0 10 10\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M8.05113 0.603577L0.603577 8.05113M8.60358 4.87979L4.8798 8.60356\" stroke=\"#9F9FA8\" stroke-width=\"1.20716\" stroke-linecap=\"round\" />\r\n </svg>\r\n );\r\n\r\n render() {\r\n return (\r\n <Host part=\"base\">\r\n {this.label && (\r\n <div part=\"label-wrapper\" class=\"label-wrapper\">\r\n <label part=\"label\" htmlFor={this.uniqueId} class=\"label-text\">\r\n {this.label}\r\n {this.required && <span part=\"required-indicator\" class=\"required-indicator\" aria-hidden=\"true\"></span>}\r\n </label>\r\n {this.info && (\r\n <div part=\"label-info\" class=\"label-info\">\r\n <span part=\"label-info-text\">{this.infoText}</span>\r\n {this.renderInfoIcon()}\r\n </div>\r\n )}\r\n </div>\r\n )}\r\n\r\n <div\r\n part=\"container\"\r\n ref={el => this.containerRef = el}\r\n class={{\r\n 'textarea-container': true,\r\n 'is-focused': this.isFocused,\r\n 'has-error': this.hasError,\r\n 'is-disabled': this.disabled,\r\n 'is-readonly': this.readonly\r\n }}\r\n >\r\n <textarea\r\n part=\"textarea\"\r\n id={this.uniqueId}\r\n name={this.name}\r\n placeholder={this.placeholder}\r\n value={this.internalValue}\r\n maxlength={this.maxLength}\r\n disabled={this.disabled}\r\n readonly={this.readonly}\r\n required={this.required}\r\n rows={this.rows}\r\n cols={this.cols}\r\n onInput={this.handleInput}\r\n onChange={this.handleChange}\r\n onFocus={this.handleFocus}\r\n onBlur={this.handleBlur}\r\n aria-invalid={this.hasError ? 'true' : undefined}\r\n aria-describedby={this.hasError && this.errorMessage ? `${this.uniqueId}-error` : undefined}\r\n />\r\n\r\n {/* Resize Handle - Visual Only, Mouse only for this simple implementation. \r\n Native resize is disabled via CSS. */}\r\n {!this.disabled && !this.readonly && (\r\n <div\r\n part=\"resize-handle\"\r\n class=\"resize-handle\"\r\n onMouseDown={this.startResize}\r\n role=\"presentation\" // Simplified for now\r\n >\r\n {this.renderResizeIcon()}\r\n </div>\r\n )}\r\n </div>\r\n\r\n <div part=\"footer\" class=\"footer\">\r\n {this.hasError && this.errorMessage ? (\r\n <div part=\"error-message\" class=\"error-message\" id={`${this.uniqueId}-error`} role=\"alert\">\r\n {this.errorMessage}\r\n </div>\r\n ) : (<span></span>)}\r\n\r\n <div part=\"character-counter\" class=\"character-counter\">\r\n <span>{this.characterCount}</span>\r\n {this.maxLength && <span>/ {this.maxLength}</span>}\r\n </div>\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}"],"version":3}
1	+ {"file":"voa-text-area.js","mappings":";;AAAA,MAAM,cAAc,GAAG,0qBAA0qB;;MCgBprBA,aAAW,iBAAAC,kBAAA,CAAA,MAAA,WAAA,SAAAC,CAAA,CAAA;AARxB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;;;;;;AAeU,QAAA,IAAI,CAAA,IAAA,GAAa,KAAK;AACtB,QAAA,IAAQ,CAAA,QAAA,GAAY,qBAAqB;AAEzC,QAAA,IAAK,CAAA,KAAA,GAAY,EAAE;AAEF,QAAA,IAAQ,CAAA,QAAA,GAAa,KAAK;AAC1B,QAAA,IAAQ,CAAA,QAAA,GAAa,KAAK;AAC3C,QAAA,IAAQ,CAAA,QAAA,GAAa,KAAK;AAC1B,QAAA,IAAI,CAAA,IAAA,GAAY,CAAC;AACjB,QAAA,IAAI,CAAA,IAAA,GAAY,EAAE;AAED,QAAA,IAAQ,CAAA,QAAA,GAAa,KAAK;AAE1C,QAAA,IAAa,CAAA,aAAA,GAAW,EAAE;AAC1B,QAAA,IAAS,CAAA,SAAA,GAAY,KAAK;AAC1B,QAAA,IAAc,CAAA,cAAA,GAAW,CAAC;AA8B3B,QAAA,IAAA,CAAA,WAAW,GAAG,CAAC,KAAY,KAAI;AACrC,YAAA,MAAM,QAAQ,GAAG,KAAK,CAAC,MAA6B;AACpD,YAAA,IAAI,CAAC,aAAa,GAAG,QAAQ,CAAC,KAAK;YACnC,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,aAAa,CAAC,MAAM;YAE/C,IAAI,CAAC,mBAAmB,EAAE;YAC1B,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC;AACxC,SAAC;AAEO,QAAA,IAAA,CAAA,YAAY,GAAG,CAAC,KAAY,KAAI;AACtC,YAAA,KAAK,CAAC,eAAe,EAAE,CAAC;YACxB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC;AACzC,SAAC;AAEO,QAAA,IAAA,CAAA,WAAW,GAAG,CAAC,KAAiB,KAAI;AAC1C,YAAA,IAAI,CAAC,SAAS,GAAG,IAAI;AACrB,YAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC;AAC3B,SAAC;AAEO,QAAA,IAAA,CAAA,UAAU,GAAG,CAAC,KAAiB,KAAI;AACzC,YAAA,IAAI,CAAC,SAAS,GAAG,KAAK;AACtB,YAAA,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC;AAC1B,SAAC;;;AAUO,QAAA,IAAA,CAAA,WAAW,GAAG,CAAC,KAAiB,KAAI;YAC1C,KAAK,CAAC,cAAc,EAAE;YACtB,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,YAAY;gBAAE;AAE1D,YAAA,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO;AAC5B,YAAA,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO;;AAG5B,YAAA,MAAM,UAAU,GAAG,IAAI,CAAC,YAAY,CAAC,WAAW;AAChD,YAAA,MAAM,WAAW,GAAG,IAAI,CAAC,YAAY,CAAC,YAAY;AAElD,YAAA,MAAM,MAAM,GAAG,CAAC,CAAa,KAAI;;;gBAG/B,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,KAAK,GAAG,CAAG,EAAA,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,UAAU,GAAG,CAAC,CAAC,OAAO,GAAG,MAAM,CAAC,CAAA,EAAA,CAAI;gBACrF,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,MAAM,GAAG,CAAG,EAAA,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,WAAW,GAAG,CAAC,CAAC,OAAO,GAAG,MAAM,CAAC,CAAA,EAAA,CAAI;AACxF,aAAC;YAED,MAAM,QAAQ,GAAG,MAAK;AACpB,gBAAA,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,MAAM,CAAC;AACjD,gBAAA,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,QAAQ,CAAC;AACnD,aAAC;AAED,YAAA,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,MAAM,CAAC;AAC9C,YAAA,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,QAAQ,CAAC;AAChD,SAAC;QAEO,IAAA,CAAA,cAAc,GAAG,OACvB,CAAK,CAAA,KAAA,EAAA,EAAA,IAAI,EAAC,iBAAiB,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAAc,cAAA,EAAA,GAAG,iBAAa,MAAM,EAAA,EAC1I,CAAQ,CAAA,QAAA,EAAA,EAAA,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,CAAC,EAAC,IAAI,EAAU,CAAA,EACxC,CAAA,CAAA,MAAA,EAAA,EAAM,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAQ,CAAA,EAC7C,CAAA,CAAA,MAAA,EAAA,EAAM,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,OAAO,EAAC,EAAE,EAAC,GAAG,EAAQ,CAAA,CAC1C,CACP;QAEO,IAAgB,CAAA,gBAAA,GAAG,OACzB,WAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B,EAAA,EAC5F,CAAA,CAAA,MAAA,EAAA,EAAM,CAAC,EAAC,mEAAmE,EAAC,MAAM,EAAC,SAAS,EAAc,cAAA,EAAA,SAAS,EAAgB,gBAAA,EAAA,OAAO,EAAG,CAAA,CACzI,CACP;AAgFF;IA1KC,iBAAiB,GAAA;QACf,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,UAAU,IAAI,CAAA,aAAA,EAAgB,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC,CAAA,CAAE;QAC5F,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,KAAK,IAAI,EAAE;QACrC,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,aAAa,CAAC,MAAM;QAC/C,IAAI,CAAC,mBAAmB,EAAE;;AAI5B,IAAA,YAAY,CAAC,QAAgB,EAAA;AAC3B,QAAA,IAAI,CAAC,aAAa,GAAG,QAAQ,IAAI,EAAE;QACnC,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,aAAa,CAAC,MAAM;QAC/C,IAAI,CAAC,mBAAmB,EAAE;;IAGpB,mBAAmB,GAAA;QACzB,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,CAAC,aAAa,CAAC;;;AA6BjD,IAAA,MAAM,QAAQ,GAAA;;AAEZ,QAAA,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;;IA8CnB,MAAM,GAAA;AACJ,QAAA,QACE,CAAC,CAAA,IAAI,EAAC,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,MAAM,EAAA,EACd,IAAI,CAAC,KAAK,KACT,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,IAAI,EAAC,eAAe,EAAC,KAAK,EAAC,eAAe,EAAA,EAC7C,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAO,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAC,YAAY,EAAA,EAC3D,IAAI,CAAC,KAAK,EACV,IAAI,CAAC,QAAQ,IAAI,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,oBAAoB,EAAC,KAAK,EAAC,oBAAoB,EAAa,aAAA,EAAA,MAAM,QAAS,CAClG,EACP,IAAI,CAAC,IAAI,KACR,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,IAAI,EAAC,YAAY,EAAC,KAAK,EAAC,YAAY,EAAA,EACvC,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,iBAAiB,IAAE,IAAI,CAAC,QAAQ,CAAQ,EAClD,IAAI,CAAC,cAAc,EAAE,CAClB,CACP,CACG,CACP,EAED,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAC,WAAW,EAChB,GAAG,EAAE,EAAE,IAAI,IAAI,CAAC,YAAY,GAAG,EAAE,EACjC,KAAK,EAAE;AACL,gBAAA,oBAAoB,EAAE,IAAI;gBAC1B,YAAY,EAAE,IAAI,CAAC,SAAS;gBAC5B,WAAW,EAAE,IAAI,CAAC,QAAQ;gBAC1B,aAAa,EAAE,IAAI,CAAC,QAAQ;gBAC5B,aAAa,EAAE,IAAI,CAAC;AACrB,aAAA,EAAA,EAED,CACE,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,UAAU,EACf,EAAE,EAAE,IAAI,CAAC,QAAQ,EACjB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,KAAK,EAAE,IAAI,CAAC,aAAa,EACzB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,QAAQ,EAAE,IAAI,CAAC,YAAY,EAC3B,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,MAAM,EAAE,IAAI,CAAC,UAAU,EAAA,cAAA,EACT,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,SAAS,EAC9B,kBAAA,EAAA,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,YAAY,GAAG,CAAA,EAAG,IAAI,CAAC,QAAQ,QAAQ,GAAG,SAAS,EAC3F,CAAA,EAID,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,QAAQ,KAC/B,CACE,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,eAAe,EACpB,KAAK,EAAC,eAAe,EACrB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,IAAI,EAAC,cAAc;AAElB,SAAA,EAAA,IAAI,CAAC,gBAAgB,EAAE,CACpB,CACP,CACG,EAEN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,QAAQ,EAAA,EAC9B,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,YAAY,IACjC,CAAA,CAAA,KAAA,EAAA,EAAK,IAAI,EAAC,eAAe,EAAC,KAAK,EAAC,eAAe,EAAC,EAAE,EAAE,CAAG,EAAA,IAAI,CAAC,QAAQ,QAAQ,EAAE,IAAI,EAAC,OAAO,EAAA,EACvF,IAAI,CAAC,YAAY,CACd,KACH,eAAa,CAAC,EAEnB,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,IAAI,EAAC,mBAAmB,EAAC,KAAK,EAAC,mBAAmB,EAAA,EACrD,CAAO,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAA,IAAI,CAAC,cAAc,CAAQ,EACjC,IAAI,CAAC,SAAS,IAAI,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,QAAS,IAAI,CAAC,SAAS,CAAQ,CAC9C,CACF,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["VoaTextArea","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/voa-text-area/voa-text-area.css?tag=voa-text-area&encapsulation=shadow","src/components/voa-text-area/voa-text-area.tsx"],"sourcesContent":["/* UNSTYLED PATTERN: Structural CSS only /\r\n\r\n:host {\r\n display: block;\r\n box-sizing: border-box;\r\n}\r\n\r\n.label-wrapper {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: flex-end;\r\n box-sizing: border-box;\r\n}\r\n\r\n.label-text {\r\n flex: 1;\r\n}\r\n\r\n.textarea-container {\r\n position: relative;\r\n box-sizing: border-box;\r\n overflow: hidden;\r\n / Needed for border-radius clipping /\r\n display: flex;\r\n / Flex ensures child textarea fills height /\r\n flex-direction: column;\r\n}\r\n\r\ntextarea {\r\n flex: 1;\r\n / Fills the container /\r\n width: 100%;\r\n / Fills width /\r\n height: 100%;\r\n / Fills height /\r\n border: none;\r\n outline: none;\r\n background: transparent;\r\n resize: none;\r\n / Disable native resize /\r\n box-sizing: border-box;\r\n display: block;\r\n margin: 0;\r\n padding: 0;\r\n}\r\n\r\n.resize-handle {\r\n position: absolute;\r\n bottom: 2px;\r\n right: 2px;\r\n width: 12px;\r\n height: 12px;\r\n cursor: nwse-resize;\r\n z-index: 10;\r\n pointer-events: auto;\r\n}\r\n\r\n.footer {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: flex-start;\r\n margin-top: 4px;\r\n}\r\n\r\n.character-counter {\r\n margin-left: auto;\r\n / Push to right /\r\n}","import { Component, Prop, State, Event, EventEmitter, Method, Element, h, Host, Watch, AttachInternals } from '@stencil/core';\r\n\r\n/\r\n Componente de área de texto para entrada de textos longos\r\n * @part base - The root host element\r\n * @part container - The resizable wrapper\r\n * @part textarea - The native textarea\r\n /\r\n@Component({\r\n tag: 'voa-text-area',\r\n styleUrl: 'voa-text-area.css',\r\n shadow: {\r\n delegatesFocus: true\r\n },\r\n formAssociated: true\r\n})\r\nexport class VoaTextArea {\r\n @Element() host: HTMLVoaTextAreaElement;\r\n @AttachInternals() internals: ElementInternals;\r\n\r\n @Prop() textareaId?: string;\r\n @Prop() name?: string;\r\n @Prop() label?: string;\r\n @Prop() info?: boolean = false;\r\n @Prop() infoText?: string = 'Identificador único';\r\n @Prop() placeholder?: string;\r\n @Prop() value?: string = '';\r\n @Prop() maxLength?: number;\r\n @Prop({ reflect: true }) disabled?: boolean = false;\r\n @Prop({ reflect: true }) readonly?: boolean = false;\r\n @Prop() required?: boolean = false;\r\n @Prop() rows?: number = 4;\r\n @Prop() cols?: number = 20;\r\n @Prop() errorMessage?: string;\r\n @Prop({ reflect: true }) hasError?: boolean = false;\r\n\r\n @State() internalValue: string = '';\r\n @State() isFocused: boolean = false;\r\n @State() characterCount: number = 0;\r\n\r\n // Stable ID for ARIA\r\n private uniqueId: string;\r\n private containerRef?: HTMLDivElement;\r\n\r\n @Event() voaChange: EventEmitter<string>;\r\n @Event() voaInput: EventEmitter<string>;\r\n @Event() voaFocus: EventEmitter<FocusEvent>;\r\n @Event() voaBlur: EventEmitter<FocusEvent>;\r\n\r\n componentWillLoad() {\r\n this.uniqueId = this.textareaId \|\| `voa-textarea-${Math.random().toString(36).substr(2, 9)}`;\r\n this.internalValue = this.value \|\| '';\r\n this.characterCount = this.internalValue.length;\r\n this.updateFormInternals();\r\n }\r\n\r\n @Watch('value')\r\n valueChanged(newValue: string) {\r\n this.internalValue = newValue \|\| '';\r\n this.characterCount = this.internalValue.length;\r\n this.updateFormInternals();\r\n }\r\n\r\n private updateFormInternals() {\r\n this.internals.setFormValue(this.internalValue);\r\n // Aria-invalid is handled on the element in render, but could be done here too if delegating to host\r\n }\r\n\r\n private handleInput = (event: Event) => {\r\n const textarea = event.target as HTMLTextAreaElement;\r\n this.internalValue = textarea.value;\r\n this.characterCount = this.internalValue.length;\r\n\r\n this.updateFormInternals();\r\n this.voaInput.emit(this.internalValue);\r\n };\r\n\r\n private handleChange = (event: Event) => {\r\n event.stopPropagation(); // Stop native change, emit ours\r\n this.voaChange.emit(this.internalValue);\r\n };\r\n\r\n private handleFocus = (event: FocusEvent) => {\r\n this.isFocused = true;\r\n this.voaFocus.emit(event);\r\n };\r\n\r\n private handleBlur = (event: FocusEvent) => {\r\n this.isFocused = false;\r\n this.voaBlur.emit(event);\r\n };\r\n\r\n @Method()\r\n async setFocus(): Promise<void> {\r\n // Delegates focus handles this mostly, but good for imperative usage\r\n this.host.focus();\r\n }\r\n\r\n // --- RESIZE LOGIC FIXED ---\r\n // We resize the CONTAINER, not the textarea.\r\n private startResize = (event: MouseEvent) => {\r\n event.preventDefault();\r\n if (this.disabled \|\| this.readonly \|\| !this.containerRef) return;\r\n\r\n const startX = event.clientX;\r\n const startY = event.clientY;\r\n\r\n // Get current dimensions of the container\r\n const startWidth = this.containerRef.offsetWidth;\r\n const startHeight = this.containerRef.offsetHeight;\r\n\r\n const doDrag = (e: MouseEvent) => {\r\n // Apply style to CONTAINER\r\n // Using requestAnimationFrame for performance is better, but this is simple enough for now\r\n this.containerRef.style.width = `${Math.max(100, startWidth + e.clientX - startX)}px`;\r\n this.containerRef.style.height = `${Math.max(60, startHeight + e.clientY - startY)}px`;\r\n };\r\n\r\n const stopDrag = () => {\r\n document.removeEventListener('mousemove', doDrag);\r\n document.removeEventListener('mouseup', stopDrag);\r\n };\r\n\r\n document.addEventListener('mousemove', doDrag);\r\n document.addEventListener('mouseup', stopDrag);\r\n };\r\n\r\n private renderInfoIcon = () => (\r\n <svg part=\"label-info-icon\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" aria-hidden=\"true\">\r\n <circle cx=\"12\" cy=\"12\" r=\"10\"></circle>\r\n <line x1=\"12\" y1=\"16\" x2=\"12\" y2=\"12\"></line>\r\n <line x1=\"12\" y1=\"8\" x2=\"12.01\" y2=\"8\"></line>\r\n </svg>\r\n );\r\n\r\n private renderResizeIcon = () => (\r\n <svg width=\"10\" height=\"10\" viewBox=\"0 0 10 10\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M8.05113 0.603577L0.603577 8.05113M8.60358 4.87979L4.8798 8.60356\" stroke=\"#9F9FA8\" stroke-width=\"1.20716\" stroke-linecap=\"round\" />\r\n </svg>\r\n );\r\n\r\n render() {\r\n return (\r\n <Host part=\"base\">\r\n {this.label && (\r\n <div part=\"label-wrapper\" class=\"label-wrapper\">\r\n <label part=\"label\" htmlFor={this.uniqueId} class=\"label-text\">\r\n {this.label}\r\n {this.required && <span part=\"required-indicator\" class=\"required-indicator\" aria-hidden=\"true\"></span>}\r\n </label>\r\n {this.info && (\r\n <div part=\"label-info\" class=\"label-info\">\r\n <span part=\"label-info-text\">{this.infoText}</span>\r\n {this.renderInfoIcon()}\r\n </div>\r\n )}\r\n </div>\r\n )}\r\n\r\n <div\r\n part=\"container\"\r\n ref={el => this.containerRef = el}\r\n class={{\r\n 'textarea-container': true,\r\n 'is-focused': this.isFocused,\r\n 'has-error': this.hasError,\r\n 'is-disabled': this.disabled,\r\n 'is-readonly': this.readonly\r\n }}\r\n >\r\n <textarea\r\n part=\"textarea\"\r\n id={this.uniqueId}\r\n name={this.name}\r\n placeholder={this.placeholder}\r\n value={this.internalValue}\r\n maxlength={this.maxLength}\r\n disabled={this.disabled}\r\n readonly={this.readonly}\r\n required={this.required}\r\n rows={this.rows}\r\n cols={this.cols}\r\n onInput={this.handleInput}\r\n onChange={this.handleChange}\r\n onFocus={this.handleFocus}\r\n onBlur={this.handleBlur}\r\n aria-invalid={this.hasError ? 'true' : undefined}\r\n aria-describedby={this.hasError && this.errorMessage ? `${this.uniqueId}-error` : undefined}\r\n />\r\n\r\n {/* Resize Handle - Visual Only, Mouse only for this simple implementation. \r\n Native resize is disabled via CSS. */}\r\n {!this.disabled && !this.readonly && (\r\n <div\r\n part=\"resize-handle\"\r\n class=\"resize-handle\"\r\n onMouseDown={this.startResize}\r\n role=\"presentation\" // Simplified for now\r\n >\r\n {this.renderResizeIcon()}\r\n </div>\r\n )}\r\n </div>\r\n\r\n <div part=\"footer\" class=\"footer\">\r\n {this.hasError && this.errorMessage ? (\r\n <div part=\"error-message\" class=\"error-message\" id={`${this.uniqueId}-error`} role=\"alert\">\r\n {this.errorMessage}\r\n </div>\r\n ) : (<span></span>)}\r\n\r\n <div part=\"character-counter\" class=\"character-counter\">\r\n <span>{this.characterCount}</span>\r\n {this.maxLength && <span>/ {this.maxLength}</span>}\r\n </div>\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}"],"version":3}