npm - @xplor-education/core-stencil-components - Versions diffs - 2.1.0 → 3.0.0 - Mend

@xplor-education/core-stencil-components 2.1.0 → 3.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (293) hide show

package/dist/collection/components/xplor-table/xplor-table.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"xplor-table.js","sourceRoot":"","sources":["../../../src/components/xplor-table/xplor-table.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Prop,\n State,\n Element,\n Event,\n EventEmitter,\n h,\n Watch,\n Host,\n} from '@stencil/core';\nconst getIconType = (sortType) => {\n switch (sortType) {\n case 'asc':\n return 'arrow-up';\n case 'desc':\n return 'arrow-down';\n default:\n return 'dash';\n }\n};\n\n@Component({\n tag: 'xplor-table',\n // styleUrl: 'xplor-table.scss',\n shadow: true,\n})\n\nexport class XplorTable {\n @Element() el: HTMLXplorTableElement;\n\n /*\n The header values for each column.\n /\n @Prop() columns?: string[];\n\n /\n The data for the body of the table.\n /\n @Prop() data?: string[][];\n\n /\n When true, the first column of the table is sticky and will cover the leftmost rows in a horizontally scrollable container.\n /\n @Prop() freeze?: boolean;\n\n /\n Toggles a selectable checkbox for each row in the table\n /\n @Prop() multiselect?: boolean;\n\n /\n Toggles an optional styling of the background of each even row of the table body.\n /\n @Prop() striped?: boolean;\n\n /\n The values for the input for each row when multiselect is activated.\n /\n @Prop() selectedValues?: string[] = [];\n\n /\n Toggles to show the sort button on each table head\n /\n @Prop() isSortable?: boolean = true;\n\n /\n Manually determined if the column is sortable\n /\n @Prop() sortableColumns?: boolean[] = [];\n\n @State() areAllSelected = false;\n\n @State() rowData: string[][];\n\n @State() hasScrolled = false;\n\n @State() selected: (string \| boolean)[];\n\n @State() sortTypeArray: ('asc' \| 'desc' \| null)[] = [];\n @State() selectedDateRange: string = 'All';\n /\n Callback function that is called when the checkbox for a row of a\n * `multiselect` table is checked\n /\n @State() currentPage: number = 1;\n @State() totalPages: number = 3;\n @Event() tableSelect: EventEmitter;\n private handlePagination = (direction: 'first' \| 'prev' \| 'next' \| 'last') => {\n switch (direction) {\n case 'first':\n this.currentPage = 1;\n break;\n case 'prev':\n if (this.currentPage > 1) this.currentPage--;\n break;\n case 'next':\n if (this.currentPage < this.totalPages) this.currentPage++;\n break;\n case 'last':\n this.currentPage = this.totalPages;\n break;\n }\n };\n \n private handleDateRangeChange = (event: Event) => {\n const target = event.target as HTMLSelectElement;\n this.selectedDateRange = target.value;\n };\n\n private handleFilterReports = () => {\n console.log('Filter reports clicked');\n };\n\n private handleDownloadAll = () => {\n console.log('Download all clicked');\n };\n\n // private handleDownloadReport = (index: number) => {\n // console.log(`Download report ${index} clicked`);\n // };\n private selectAllValue = Math.random().toString(36).slice(2);\n\n private container!: HTMLDivElement;\n\n private selectAll = (e: Event) => {\n const { target } = e;\n\n if (!(target instanceof HTMLInputElement)) return;\n\n const { checked } = target;\n\n this.areAllSelected = checked;\n\n this.selected =\n this.selectedValues.length > 0\n ? // gets all checkboxes in body\n Array.from(\n this.el.querySelectorAll('tbody td:first-child input'),\n ).map((input: HTMLInputElement) =>\n // if the select all checkbox is checked, return\n // the value from the current input. If false, set all to false.\n checked ? input?.value : checked,\n )\n : this.selected.map(() => checked);\n this.onChange();\n };\n\n private selectOne = (e: Event, checkboxIdx: number) => {\n const { target } = e;\n if (!(target instanceof HTMLInputElement)) return;\n\n const { checked, value } = target;\n\n this.areAllSelected = false;\n this.selected = this.selected.map((v, selectedIdx) => {\n // if the checkbox that fired the event is not the current idx\n // return the current value\n if (selectedIdx !== checkboxIdx) return v;\n\n /\n If there are values in this.selectedValues, either return the value\n * for that checkbox or false, dependent on if the checkbox is checked or not.\n * If there are no values in this.selectedValues, return the value\n * to either true or false, dependent on if the checkbox is checked or not.\n \n /\n return this.selectedValues.length > 0\n ? checked\n ? value\n : checked\n : checked;\n });\n this.onChange();\n };\n\n private onChange = () => {\n this.tableSelect.emit({\n selected: this.selected,\n areAllSelected: this.areAllSelected,\n });\n };\n\n private onScroll = () => {\n this.hasScrolled = this.container.scrollLeft > 0;\n };\n\n private sortBy = (col: number) => {\n this.sortTypeArray = this.sortTypeArray.map((val, idx) => {\n if (idx !== col) return null;\n\n switch (val) {\n case 'asc':\n return 'desc';\n case 'desc':\n return null;\n default:\n return 'asc';\n }\n });\n\n const handleSort = (a, b) => {\n if (a[col].toLocaleLowerCase() < b[col].toLocaleLowerCase()) {\n return -1;\n }\n if (a[col].toLocaleLowerCase() > b[col].toLocaleLowerCase()) {\n return 1;\n }\n return 0;\n };\n\n if (this.sortTypeArray[col] === 'asc') {\n this.rowData.sort((a, b) => handleSort(a, b));\n } else if (this.sortTypeArray[col] === 'desc') {\n this.rowData.sort((a, b) => handleSort(b, a));\n } else {\n this.rowData = this.data;\n this.sortTypeArray[col] = null;\n }\n\n this.rowData = Array.from(this.rowData);\n this.render();\n };\n\n private setData = () => {\n this.rowData = this.data !== undefined ? Array.from(this.data) : [];\n };\n\n // Add this method to paginate rowData\nprivate getPaginatedData(): string[][] {\n const startIndex = (this.currentPage - 1) * 10;\n const endIndex = startIndex + 10;\n return this.rowData.slice(startIndex, endIndex);\n}\n\n @Watch('data')\n watchData() {\n this.setData();\n }\n\n componentWillLoad() {\n this.areAllSelected = false;\n this.setData();\n this.selected = new Array(this.rowData.length).fill(false);\n // Fill the Sort Type Array to default null depends on number of columns\n this.sortTypeArray = this.columns && this.columns.map(() => null);\n }\n\n render() {\n let className = 'xpl-table';\n if (this.striped) className += ' xpl-table--striped';\n if (this.freeze) className += ' xpl-table--freeze';\n if (this.hasScrolled) className += ' xpl-table--has-scrolled';\n\n const paginatedData = this.getPaginatedData();\n\n return (\n <Host class=\"xplor-table\">\n <div class=\"bg-white rounded-lg shadow-sm border border-gray-200 p-6 max-w-6xl mx-auto\">\n <div\n class=\"xpl-table-container\"\n onScroll={this.onScroll}\n ref={(el) => {\n this.container = el;\n }}\n >\n {/* Header /}\n <div class=\"mb-6\">\n <h1 class=\"text-xl font-semibold text-gray-900 mb-4\">Head Counts Report</h1>\n \n {/ Filter Controls /}\n <div class=\"flex flex-wrap items-center gap-4 mb-6\">\n <div class=\"flex items-center gap-2\">\n <label class=\"text-sm text-gray-600 font-medium\">Date Range</label>\n <select \n class=\"border border-gray-300 rounded px-3 py-1.5 text-sm bg-white focus:outline-none focus:ring-2 focus:ring-teal-500 focus:border-teal-500\"\n // value={this.selectedDateRange}\n onInput={this.handleDateRangeChange}\n >\n <option value=\"All\">All</option>\n <option value=\"Today\">Today</option>\n <option value=\"This Week\">This Week</option>\n <option value=\"This Month\">This Month</option>\n <option value=\"Custom\">Custom Range</option>\n </select>\n <button class=\"p-1.5 border border-gray-300 rounded hover:bg-gray-50\">\n <svg class=\"w-4 h-4 text-gray-500\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z\"/>\n </svg>\n </button>\n </div>\n \n <button \n onClick={this.handleFilterReports}\n class=\"bg-teal-600 hover:bg-teal-700 text-white px-4 py-1.5 rounded text-sm font-medium transition-colors\"\n >\n Filter Reports\n </button>\n \n <button \n onClick={this.handleDownloadAll}\n class=\"flex items-center gap-2 text-gray-600 hover:text-gray-800 text-sm\"\n >\n <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\"/>\n </svg>\n Download All\n </button>\n </div>\n </div>\n\n <table class={`w-full ${className}`}>\n {this.columns && (\n <thead>\n {this.columns.map((column, i) => {\n const iconType = getIconType(\n this.sortTypeArray[i],\n );\n const isColumnSortable = !!(\n this.isSortable &&\n this.sortableColumns[i]\n );\n return (\n <th class=\"text-left py-3 px-4 text-sm font-medium text-gray-600\">\n {this.multiselect && i === 0 ? (\n <label\n onClick={(e) => {\n e.preventDefault();\n e.stopPropagation();\n debugger\n if (isColumnSortable) {\n this.sortBy(i);\n }\n }}\n class={\n isColumnSortable\n ? 'cursor-pointer'\n : ''\n }\n >\n <input\n checked={\n this.areAllSelected\n }\n id=\"__xpl-table-th\"\n // appear indeterminate when at least one but not all\n // are selected\n\n indeterminate={\n !this\n .areAllSelected &&\n this.selected.some(\n (a) => a,\n )\n }\n onClick={(e) => {\n e.stopPropagation();\n this.selectAll(e);\n }}\n type=\"checkbox\"\n value={`select-all-${this.selectAllValue}`}\n />\n {column}\n {isColumnSortable &&\n !!this.sortTypeArray[\n i\n ] && (\n <xpl-icon\n icon={iconType}\n size={16}\n ></xpl-icon>\n )}\n </label>\n ) : (\n <label\n onClick={() =>\n isColumnSortable &&\n this.sortBy(i)\n }\n class={\n isColumnSortable\n ? 'cursor-pointer'\n : ''\n }\n >\n {column}\n {isColumnSortable &&\n !!this.sortTypeArray[\n i\n ] && (\n <svg width=\"11\" height=\"6\" viewBox=\"0 0 11 6\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M10.5 5.5L5.5 0.5L0.5 5.5L10.5 5.5Z\" fill=\"currentColor\"></path></svg>\n // <xpl-icon\n // icon={iconType}\n // size={16}\n // id=\"__xpl-icon-sort\"\n // ></xpl-icon>\n )}\n </label>\n )}\n </th>\n );\n })}\n </thead>\n )}\n <tbody>\n {paginatedData.map((row, rowNum) => (\n <tr\n class={`border-b border-gray-100 hover:bg-gray-50`}\n >\n {row.map((cell, i) => (\n <td class=\"py-3 px-4 text-sm text-gray-900\">\n {this.multiselect && i === 0 ? (\n <label\n class=\"flex items-center gap-2\"\n htmlFor={`__xpl-table-row-${\n rowNum\n }`}\n >\n <input\n id={`__xpl-table-row-${\n rowNum\n }`}\n checked={\n !!this.selected[\n rowNum\n ]\n }\n type=\"checkbox\"\n onChange={(e) =>\n this.selectOne(\n e,\n rowNum,\n )\n }\n value={\n this.selectedValues\n .length > 0\n ? this\n .selectedValues[\n rowNum\n ]\n : `xpl-table-checkbox-${rowNum}`\n }\n />\n <div innerHTML={cell} />\n </label>\n ) : (\n <div innerHTML={cell} />\n )}\n </td>\n ))}\n </tr>\n ))}\n \n </tbody>\n </table>\n {/ Pagination /}\n <div id=\"pagination\" class=\"w-full flex items-center justify-between mt-6 text-sm\">\n <div class=\"flex items-center gap-2\">\n <button \n onClick={() => this.handlePagination('first')}\n class=\"p-1.5 text-gray-400 hover:text-gray-600 disabled:opacity-50\"\n disabled={this.currentPage === 1}\n >\n <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M11 19l-7-7 7-7m8 14l-7-7 7-7\"/>\n </svg>\n </button>\n <button \n onClick={() => this.handlePagination('prev')}\n class=\"p-1.5 text-gray-400 hover:text-gray-600 disabled:opacity-50\"\n disabled={this.currentPage === 1}\n >\n <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M15 19l-7-7 7-7\"/>\n </svg>\n </button>\n </div>\n\n <span class=\"text-gray-600\">\n Page {this.currentPage} of {this.totalPages}\n </span>\n\n <div class=\"flex items-center gap-2\">\n <button \n onClick={() => this.handlePagination('next')}\n class=\"p-1.5 text-gray-400 hover:text-gray-600 disabled:opacity-50\"\n disabled={this.currentPage === this.totalPages}\n >\n <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 5l7 7-7 7\"/>\n </svg>\n </button>\n <button \n onClick={() => this.handlePagination('last')}\n class=\"p-1.5 text-gray-400 hover:text-gray-600 disabled:opacity-50\"\n disabled={this.currentPage === this.totalPages}\n >\n <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M13 5l7 7-7 7M5 5l7 7-7 7\"/>\n </svg>\n </button>\n </div>\n </div>\n </div>\n </div>\n </Host>\n\n );\n }\n}\n\n\n\n\n////////////// ######################## ///////////////////////////////// This code is commented out as it is not currently in use.\n\n\n\n\n// import { Component, Prop, State, h } from '@stencil/core';\n// import { StyledHost } from '../x-styles/x-styles';\n\n// interface ReportData {\n// submitDate: string;\n// time: string;\n// educatorName: string;\n// room: string;\n// }\n\n\n// @Component({\n// tag: 'xplor-table',\n// styleUrl: 'xplor-table.scss',\n// shadow: true,\n// })\n\n\n// export class XplorTable {\n// @State() selectedDateRange: string = 'All';\n// @State() currentPage: number = 1;\n// @State() totalPages: number = 1;\n// @State() sortBy: string = '';\n// @State() sortDirection: 'asc' \| 'desc' = 'asc';\n// @Prop() tablecContent: ReportData[]\n// private reportData: ReportData[] = [\n// {\n// submitDate: '14/01/2025',\n// time: '10:01:21',\n// educatorName: 'Andi Kelman',\n// room: '2025 Holiday Programme'\n// },\n// {\n// submitDate: '10/10/2023',\n// time: '10:44:46',\n// educatorName: 'Andi Kelman',\n// room: '3 Kinder 3 - 23'\n// },\n// {\n// submitDate: '10/10/2023',\n// time: '10:36:15',\n// educatorName: 'Andi Kelman',\n// room: '3 Kinder 3 - 23'\n// },\n// {\n// submitDate: '28/03/2023',\n// time: '15:51:51',\n// educatorName: 'Cara Bierenkrant',\n// room: '8 KINDER 8 - CRECHE Kinder 8 2023'\n// }\n// ];\n\n// private handleDateRangeChange = (event: Event) => {\n// const target = event.target as HTMLSelectElement;\n// this.selectedDateRange = target.value;\n// };\n\n// private handleFilterReports = () => {\n// console.log('Filter reports clicked');\n// };\n\n// private handleDownloadAll = () => {\n// console.log('Download all clicked');\n// };\n\n// private handleDownloadReport = (index: number) => {\n// console.log(`Download report ${index} clicked`);\n// };\n\n// private handleSort = (column: string) => {\n// if (this.sortBy === column) {\n// this.sortDirection = this.sortDirection === 'asc' ? 'desc' : 'asc';\n// } else {\n// this.sortBy = column;\n// this.sortDirection = 'asc';\n// }\n// };\n\n// private handlePagination = (direction: 'first' \| 'prev' \| 'next' \| 'last') => {\n// switch (direction) {\n// case 'first':\n// this.currentPage = 1;\n// break;\n// case 'prev':\n// if (this.currentPage > 1) this.currentPage--;\n// break;\n// case 'next':\n// if (this.currentPage < this.totalPages) this.currentPage++;\n// break;\n// case 'last':\n// this.currentPage = this.totalPages;\n// break;\n// }\n// };\n\n// private getSortIcon(column: string) {\n// if (this.sortBy !== column) {\n// // Unsorted\n// return (\n// <svg class=\"w-3 h-3\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n// <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 9l4-4 4 4m0 6l-4 4-4-4\"/>\n// </svg>\n// );\n// }\n// if (this.sortDirection === 'asc') {\n// // Ascending\n// return (\n// <svg class=\"w-3 h-3\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n// <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 15l4-4 4 4\"/>\n// </svg>\n// );\n// }\n// // Descending\n// return (\n// <svg class=\"w-3 h-3\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n// <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M16 9l-4 4-4-4\"/>\n// </svg>\n// );\n// }\n\n// render() {\n// return (\n// <StyledHost class=\"xplor-table\">\n// <div class=\"bg-white rounded-lg shadow-sm border border-gray-200 p-6 max-w-6xl mx-auto\">\n// {/ Header /}\n// <div class=\"mb-6\">\n// <h1 class=\"text-xl font-semibold text-gray-900 mb-4\">Head Counts Report</h1>\n \n// {/ Filter Controls /}\n// <div class=\"flex flex-wrap items-center gap-4 mb-6\">\n// <div class=\"flex items-center gap-2\">\n// <label class=\"text-sm text-gray-600 font-medium\">Date Range</label>\n// <select \n// class=\"border border-gray-300 rounded px-3 py-1.5 text-sm bg-white focus:outline-none focus:ring-2 focus:ring-teal-500 focus:border-teal-500\"\n// // value={this.selectedDateRange}\n// onInput={this.handleDateRangeChange}\n// >\n// <option value=\"All\">All</option>\n// <option value=\"Today\">Today</option>\n// <option value=\"This Week\">This Week</option>\n// <option value=\"This Month\">This Month</option>\n// <option value=\"Custom\">Custom Range</option>\n// </select>\n// <button class=\"p-1.5 border border-gray-300 rounded hover:bg-gray-50\">\n// <svg class=\"w-4 h-4 text-gray-500\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n// <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z\"/>\n// </svg>\n// </button>\n// </div>\n \n// <button \n// onClick={this.handleFilterReports}\n// class=\"bg-teal-600 hover:bg-teal-700 text-white px-4 py-1.5 rounded text-sm font-medium transition-colors\"\n// >\n// Filter Reports\n// </button>\n \n// <button \n// onClick={this.handleDownloadAll}\n// class=\"flex items-center gap-2 text-gray-600 hover:text-gray-800 text-sm\"\n// >\n// <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n// <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\"/>\n// </svg>\n// Download All\n// </button>\n// </div>\n// </div>\n\n// {/ Table /}\n// <div class=\"overflow-x-auto\">\n// <table class=\"w-full\">\n// <thead>\n// <tr class=\"border-b border-gray-200\">\n// <th class=\"text-left py-3 px-4 text-sm font-medium text-gray-600\">\n// <button \n// onClick={() => this.handleSort('submitDate')}\n// class=\"flex items-center gap-1 hover:text-gray-900\"\n// >\n// Submit Date\n// {this.getSortIcon('submitDate')}\n// </button>\n// </th>\n// <th class=\"text-left py-3 px-4 text-sm font-medium text-gray-600\">\n// <button \n// onClick={() => this.handleSort('time')}\n// class=\"flex items-center gap-1 hover:text-gray-900\"\n// >\n// Time\n// {this.getSortIcon('time')}\n// </button>\n// </th>\n// <th class=\"text-left py-3 px-4 text-sm font-medium text-gray-600\">\n// <button \n// onClick={() => this.handleSort('educatorName')}\n// class=\"flex items-center gap-1 hover:text-gray-900\"\n// >\n// Educator Name\n// {this.getSortIcon('educatorName')}\n// </button>\n// </th>\n// <th class=\"text-left py-3 px-4 text-sm font-medium text-gray-600\">\n// <button \n// onClick={() => this.handleSort('room')}\n// class=\"flex items-center gap-1 hover:text-gray-900\"\n// >\n// Room(s)\n// {this.getSortIcon('room')}\n// </button>\n// </th>\n// <th class=\"text-center py-3 px-4 text-sm font-medium text-gray-600\">\n// Download Report\n// </th>\n// </tr>\n// </thead>\n// <tbody>\n// {this.reportData.map((row, index) => (\n// <tr key={index} class=\"border-b border-gray-100 hover:bg-gray-50\">\n// <td class=\"py-3 px-4 text-sm text-gray-900\">{row.submitDate}</td>\n// <td class=\"py-3 px-4 text-sm text-gray-900\">{row.time}</td>\n// <td class=\"py-3 px-4 text-sm text-gray-900\">{row.educatorName}</td>\n// <td class=\"py-3 px-4 text-sm text-gray-900\">{row.room}</td>\n// <td class=\"py-3 px-4 text-center\">\n// <div class=\"flex items-center justify-center gap-2\">\n// <span class=\"bg-gray-100 text-gray-700 px-2 py-1 rounded text-xs\">\n// Toggle SortBy\n// </span>\n// <button \n// onClick={() => this.handleDownloadReport(index)}\n// class=\"p-1.5 text-teal-600 hover:text-teal-800 hover:bg-teal-50 rounded\"\n// >\n// <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n// <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\"/>\n// </svg>\n// </button>\n// </div>\n// </td>\n// </tr>\n// ))}\n// </tbody>\n// </table>\n// </div>\n\n// {/ Pagination */}\n// <div class=\"flex items-center justify-between mt-6 text-sm\">\n// <div class=\"flex items-center gap-2\">\n// <button \n// onClick={() => this.handlePagination('first')}\n// class=\"p-1.5 text-gray-400 hover:text-gray-600 disabled:opacity-50\"\n// disabled={this.currentPage === 1}\n// >\n// <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n// <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M11 19l-7-7 7-7m8 14l-7-7 7-7\"/>\n// </button>\n// <button \n// onClick={() => this.handlePagination('prev')}\n// class=\"p-1.5 text-gray-400 hover:text-gray-600 disabled:opacity-50\"\n// disabled={this.currentPage === 1}\n// >\n// <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n// <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M15 19l-7-7 7-7\"/>\n// </button>\n// </div>\n\n// <span class=\"text-gray-600\">\n// Page {this.currentPage} of {this.totalPages}\n// </span>\n\n// <div class=\"flex items-center gap-2\">\n// <button \n// onClick={() => this.handlePagination('next')}\n// class=\"p-1.5 text-gray-400 hover:text-gray-600 disabled:opacity-50\"\n// disabled={this.currentPage === this.totalPages}\n// >\n// <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n// <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 5l7 7-7 7\"/>\n// </button>\n// <button \n// onClick={() => this.handlePagination('last')}\n// class=\"p-1.5 text-gray-400 hover:text-gray-600 disabled:opacity-50\"\n// disabled={this.currentPage === this.totalPages}\n// >\n// <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n// <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M13 5l7 7-7 7M5 5l7 7-7 7\"/>\n// </svg>\n// </button>\n// </div>\n// </div>\n// </div>\n// </StyledHost>\n// );\n// }\n// }"]}
1	+ {"version":3,"file":"xplor-table.js","sourceRoot":"","sources":["../../../src/components/xplor-table/xplor-table.tsx"],"names":[],"mappings":"AAAA,OAAO,EACH,SAAS,EACT,IAAI,EACJ,KAAK,EACL,OAAO,EACP,KAAK,EAEL,CAAC,EACD,KAAK,EACL,IAAI,GACP,MAAM,eAAe,CAAC;AACvB,MAAM,WAAW,GAAG,CAAC,QAAQ,EAAE,EAAE;IAC7B,QAAQ,QAAQ,EAAE,CAAC;QACf,KAAK,KAAK;YACN,OAAO,UAAU,CAAC;QACtB,KAAK,MAAM;YACP,OAAO,YAAY,CAAC;QACxB;YACI,OAAO,MAAM,CAAC;IACtB,CAAC;AACL,CAAC,CAAC;AAQF,MAAM,OAAO,UAAU;IANvB;QAkCI;;WAEG;QACK,mBAAc,GAAc,EAAE,CAAC;QAEvC;;WAEG;QACK,eAAU,GAAa,IAAI,CAAC;QAEpC;;WAEG;QACK,oBAAe,GAAe,EAAE,CAAC;QAEhC,mBAAc,GAAG,KAAK,CAAC;QAIvB,gBAAW,GAAG,KAAK,CAAC;QAIpB,kBAAa,GAA8B,EAAE,CAAC;QAC9C,sBAAiB,GAAW,KAAK,CAAC;QAC3C;;;WAGG;QACM,gBAAW,GAAW,CAAC,CAAC;QACxB,eAAU,GAAW,CAAC,CAAC;QAExB,qBAAgB,GAAG,CAAC,SAA6C,EAAE,EAAE;YAC3E,QAAQ,SAAS,EAAE,CAAC;gBAClB,KAAK,OAAO;oBACV,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC;oBACrB,MAAM;gBACR,KAAK,MAAM;oBACT,IAAI,IAAI,CAAC,WAAW,GAAG,CAAC;wBAAE,IAAI,CAAC,WAAW,EAAE,CAAC;oBAC7C,MAAM;gBACR,KAAK,MAAM;oBACT,IAAI,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,UAAU;wBAAE,IAAI,CAAC,WAAW,EAAE,CAAC;oBAC3D,MAAM;gBACR,KAAK,MAAM;oBACT,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,UAAU,CAAC;oBACnC,MAAM;YACV,CAAC;QACH,CAAC,CAAC;QAEQ,0BAAqB,GAAG,CAAC,KAAY,EAAE,EAAE;YACnD,MAAM,MAAM,GAAG,KAAK,CAAC,MAA2B,CAAC;YACjD,IAAI,CAAC,iBAAiB,GAAG,MAAM,CAAC,KAAK,CAAC;QACxC,CAAC,CAAC;QAEM,wBAAmB,GAAG,GAAG,EAAE;YACjC,OAAO,CAAC,GAAG,CAAC,wBAAwB,CAAC,CAAC;QACxC,CAAC,CAAC;QAEM,sBAAiB,GAAG,GAAG,EAAE;YAC/B,OAAO,CAAC,GAAG,CAAC,sBAAsB,CAAC,CAAC;QACtC,CAAC,CAAC;QAEF,sDAAsD;QACtD,qDAAqD;QACrD,KAAK;QACG,mBAAc,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;QAInD,cAAS,GAAG,CAAC,CAAQ,EAAE,EAAE;YAC7B,MAAM,EAAE,MAAM,EAAE,GAAG,CAAC,CAAC;YAErB,IAAI,CAAC,CAAC,MAAM,YAAY,gBAAgB,CAAC;gBAAE,OAAO;YAElD,MAAM,EAAE,OAAO,EAAE,GAAG,MAAM,CAAC;YAE3B,IAAI,CAAC,cAAc,GAAG,OAAO,CAAC;YAE9B,IAAI,CAAC,QAAQ;gBACT,IAAI,CAAC,cAAc,CAAC,MAAM,GAAG,CAAC;oBAC1B,CAAC,CAAC,8BAA8B;wBAC9B,KAAK,CAAC,IAAI,CACN,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,4BAA4B,CAAC,CACzD,CAAC,GAAG,CAAC,CAAC,KAAuB,EAAE,EAAE;wBAC9B,gDAAgD;wBAChD,gEAAgE;wBAChE,OAAO,CAAC,CAAC,CAAC,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,KAAK,CAAC,CAAC,CAAC,OAAO,CACnC;oBACH,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC,OAAO,CAAC,CAAC;YAC3C,IAAI,CAAC,QAAQ,EAAE,CAAC;QACpB,CAAC,CAAC;QAEM,cAAS,GAAG,CAAC,CAAQ,EAAE,WAAmB,EAAE,EAAE;YAClD,MAAM,EAAE,MAAM,EAAE,GAAG,CAAC,CAAC;YACrB,IAAI,CAAC,CAAC,MAAM,YAAY,gBAAgB,CAAC;gBAAE,OAAO;YAElD,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,GAAG,MAAM,CAAC;YAElC,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;YAC5B,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,WAAW,EAAE,EAAE;gBACjD,8DAA8D;gBAC9D,2BAA2B;gBAC3B,IAAI,WAAW,KAAK,WAAW;oBAAE,OAAO,CAAC,CAAC;gBAE1C;;;;;;mBAMG;gBACH,OAAO,IAAI,CAAC,cAAc,CAAC,MAAM,GAAG,CAAC;oBACjC,CAAC,CAAC,OAAO;wBACL,CAAC,CAAC,KAAK;wBACP,CAAC,CAAC,OAAO;oBACb,CAAC,CAAC,OAAO,CAAC;YAClB,CAAC,CAAC,CAAC;YACH,IAAI,CAAC,QAAQ,EAAE,CAAC;QACpB,CAAC,CAAC;QAEM,aAAQ,GAAG,GAAG,EAAE;YACpB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC;gBAClB,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,cAAc,EAAE,IAAI,CAAC,cAAc;aACtC,CAAC,CAAC;QACP,CAAC,CAAC;QAEM,aAAQ,GAAG,GAAG,EAAE;YACpB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,SAAS,CAAC,UAAU,GAAG,CAAC,CAAC;QACrD,CAAC,CAAC;QAEM,WAAM,GAAG,CAAC,GAAW,EAAE,EAAE;YAC7B,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE;gBACrD,IAAI,GAAG,KAAK,GAAG;oBAAE,OAAO,IAAI,CAAC;gBAE7B,QAAQ,GAAG,EAAE,CAAC;oBACV,KAAK,KAAK;wBACN,OAAO,MAAM,CAAC;oBAClB,KAAK,MAAM;wBACP,OAAO,IAAI,CAAC;oBAChB;wBACI,OAAO,KAAK,CAAC;gBACrB,CAAC;YACL,CAAC,CAAC,CAAC;YAEH,MAAM,UAAU,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;gBACxB,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,iBAAiB,EAAE,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,iBAAiB,EAAE,EAAE,CAAC;oBAC1D,OAAO,CAAC,CAAC,CAAC;gBACd,CAAC;gBACD,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,iBAAiB,EAAE,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,iBAAiB,EAAE,EAAE,CAAC;oBAC1D,OAAO,CAAC,CAAC;gBACb,CAAC;gBACD,OAAO,CAAC,CAAC;YACb,CAAC,CAAC;YAEF,IAAI,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,KAAK,KAAK,EAAE,CAAC;gBACpC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,UAAU,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;YAClD,CAAC;iBAAM,IAAI,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,KAAK,MAAM,EAAE,CAAC;gBAC5C,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,UAAU,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;YAClD,CAAC;iBAAM,CAAC;gBACJ,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC;gBACzB,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;YACnC,CAAC;YAED,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YACxC,IAAI,CAAC,MAAM,EAAE,CAAC;QAClB,CAAC,CAAC;QAEM,YAAO,GAAG,GAAG,EAAE;YACnB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;QACxE,CAAC,CAAC;KAwSL;IAtSG,sCAAsC;IAClC,gBAAgB;QACtB,MAAM,UAAU,GAAG,CAAC,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC;QAC/C,MAAM,QAAQ,GAAG,UAAU,GAAG,EAAE,CAAC;QACjC,OAAO,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,UAAU,EAAE,QAAQ,CAAC,CAAC;IAClD,CAAC;IAGG,SAAS;QACL,IAAI,CAAC,OAAO,EAAE,CAAC;IACnB,CAAC;IAED,iBAAiB;QACb,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;QAC5B,IAAI,CAAC,OAAO,EAAE,CAAC;QACf,IAAI,CAAC,QAAQ,GAAG,IAAI,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC3D,wEAAwE;QACxE,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,CAAC;IACtE,CAAC;IAED,MAAM;QACF,IAAI,SAAS,GAAG,WAAW,CAAC;QAC5B,IAAI,IAAI,CAAC,OAAO;YAAE,SAAS,IAAI,qBAAqB,CAAC;QACrD,IAAI,IAAI,CAAC,MAAM;YAAE,SAAS,IAAI,oBAAoB,CAAC;QACnD,IAAI,IAAI,CAAC,WAAW;YAAE,SAAS,IAAI,0BAA0B,CAAC;QAE9D,MAAM,aAAa,GAAG,IAAI,CAAC,gBAAgB,EAAE,CAAC;QAE9C,OAAO,CACH,EAAC,IAAI,qDAAC,KAAK,EAAC,aAAa;YACvB,4DAAK,KAAK,EAAC,4EAA4E;gBACrF,4DACI,KAAK,EAAC,qBAAqB,EAC3B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE;wBACR,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;oBACxB,CAAC;oBAGX,4DAAK,KAAK,EAAC,MAAM;wBACf,2DAAI,KAAK,EAAC,0CAA0C,yBAAwB;wBAG5E,4DAAK,KAAK,EAAC,wCAAwC;4BACjD,4DAAK,KAAK,EAAC,yBAAyB;gCAClC,8DAAO,KAAK,EAAC,mCAAmC,iBAAmB;gCACnE,+DACE,KAAK,EAAC,uIAAuI;oCAC7I,iCAAiC;oCACjC,OAAO,EAAE,IAAI,CAAC,qBAAqB;oCAEnC,+DAAQ,KAAK,EAAC,KAAK,UAAa;oCAChC,+DAAQ,KAAK,EAAC,OAAO,YAAe;oCACpC,+DAAQ,KAAK,EAAC,WAAW,gBAAmB;oCAC5C,+DAAQ,KAAK,EAAC,YAAY,iBAAoB;oCAC9C,+DAAQ,KAAK,EAAC,QAAQ,mBAAsB,CACrC;gCACT,+DAAQ,KAAK,EAAC,uDAAuD;oCACnE,4DAAK,KAAK,EAAC,uBAAuB,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAAC,OAAO,EAAC,WAAW;wCACtF,+EAAqB,OAAO,qBAAiB,OAAO,kBAAc,GAAG,EAAC,CAAC,EAAC,wFAAwF,GAAE,CAC9J,CACC,CACL;4BAEN,+DACE,OAAO,EAAE,IAAI,CAAC,mBAAmB,EACjC,KAAK,EAAC,oGAAoG,qBAGnG;4BAET,+DACE,OAAO,EAAE,IAAI,CAAC,iBAAiB,EAC/B,KAAK,EAAC,mEAAmE;gCAEzE,4DAAK,KAAK,EAAC,SAAS,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAAC,OAAO,EAAC,WAAW;oCACxE,+EAAqB,OAAO,qBAAiB,OAAO,kBAAc,GAAG,EAAC,CAAC,EAAC,iIAAiI,GAAE,CACvM;+CAEC,CACL,CACF;oBAEI,8DAAO,KAAK,EAAE,UAAU,SAAS,EAAE;wBAC9B,IAAI,CAAC,OAAO,IAAI,CACb,gEACK,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;4BAC5B,MAAM,QAAQ,GAAG,WAAW,CACxB,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CACxB,CAAC;4BACF,MAAM,gBAAgB,GAAG,CAAC,CAAC,CACvB,IAAI,CAAC,UAAU;gCACf,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,CAC1B,CAAC;4BACF,OAAO,CACH,UACI,KAAK,EAAC,uDAAuD,eAEzD,gBAAgB,IAAI,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC;oCACrC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK,KAAK;wCAC7B,CAAC,CAAC,WAAW;wCACb,CAAC,CAAC,YAAY;oCAClB,CAAC,CAAC,gBAAgB;wCACd,CAAC,CAAC,MAAM;wCACR,CAAC,CAAC,SAAS,IAGtB,IAAI,CAAC,WAAW,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAC3B,aACI,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;oCACX,CAAC,CAAC,cAAc,EAAE,CAAC;oCACnB,CAAC,CAAC,eAAe,EAAE,CAAC;oCACpB,IAAI,gBAAgB,EAAE,CAAC;wCACnB,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;oCACnB,CAAC;gCACL,CAAC,EACD,KAAK,EACD,gBAAgB;oCACZ,CAAC,CAAC,gBAAgB;oCAClB,CAAC,CAAC,EAAE;gCAGZ,aACI,OAAO,EACH,IAAI,CAAC,cAAc,EAEvB,EAAE,EAAC,gBAAgB;oCACnB,qDAAqD;oCACrD,eAAe;oCAEf,aAAa,EACT,CAAC,IAAI;yCACA,cAAc;wCACnB,IAAI,CAAC,QAAQ,CAAC,IAAI,CACd,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CACX,EAEL,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;wCACX,CAAC,CAAC,eAAe,EAAE,CAAC;wCACpB,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;oCACtB,CAAC,EACD,IAAI,EAAC,UAAU,EACf,KAAK,EAAE,cAAc,IAAI,CAAC,cAAc,EAAE,gBAC/B,iBAAiB,GAC9B;gCACD,MAAM;gCACN,gBAAgB;oCACb,CAAC,CAAC,IAAI,CAAC,aAAa,CAChB,CAAC,CACJ,IAAI,CACD,gBACI,IAAI,EAAE,QAAQ,EACd,IAAI,EAAE,EAAE,GACA,CACf,CACD,CACX,CAAC,CAAC,CAAC,CACA,aACI,OAAO,EAAE,GAAG,EAAE,CACV,gBAAgB;oCAChB,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,EAElB,KAAK,EACD,gBAAgB;oCACZ,CAAC,CAAC,gBAAgB;oCAClB,CAAC,CAAC,EAAE,gBAEA,gBAAgB,CAAC,CAAC,CAAC,WAAW,MAAM,EAAE,CAAC,CAAC,CAAC,SAAS;gCAE7D,MAAM;gCACN,gBAAgB;oCACb,CAAC,CAAC,IAAI,CAAC,aAAa,CAChB,CAAC,CACJ,IAAI,CACH,WAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,GAAG,EAAC,OAAO,EAAC,UAAU,EAAC,KAAK,EAAC,4BAA4B;oCAAC,YAAM,CAAC,EAAC,qCAAqC,EAAC,IAAI,EAAC,cAAc,GAAQ,CAAM;gCAC9J,YAAY;gCACZ,sBAAsB;gCACtB,gBAAgB;gCAChB,2BAA2B;gCAC3B,eAAe;iCAClB,CACD,CACX,CACA,CACR,CAAC;wBACN,CAAC,CAAC,CACE,CACX;wBACD,gEACK,aAAa,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,MAAM,EAAE,EAAE,CAAC,CAChC,UACI,KAAK,EAAE,2CAA2C,IAEjD,GAAG,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,CAAC,CAClB,UAAI,KAAK,EAAC,iCAAiC,IACtC,IAAI,CAAC,WAAW,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAC3B,aACI,KAAK,EAAC,yBAAyB,EAC/B,OAAO,EAAE,mBACL,MACJ,EAAE;4BAEF,aACI,EAAE,EAAE,mBACA,MACJ,EAAE,EACF,OAAO,EACH,CAAC,CAAC,IAAI,CAAC,QAAQ,CACX,MAAM,CACT,EAEL,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CACZ,IAAI,CAAC,SAAS,CACV,CAAC,EACD,MAAM,CACT,EAEL,KAAK,EACD,IAAI,CAAC,cAAc;qCACd,MAAM,GAAG,CAAC;oCACX,CAAC,CAAC,IAAI;yCACC,cAAc,CACf,MAAM,CACT;oCACH,CAAC,CAAC,sBAAsB,MAAM,EAAE,GAE1C;4BACF,WAAK,SAAS,EAAE,IAAI,GAAI,CACpB,CACX,CAAC,CAAC,CAAC,CACA,WAAK,SAAS,EAAE,IAAI,GAAI,CAC3B,CACA,CACR,CAAC,CACD,CACR,CAAC,CAEE,CACJ;oBAEF,4DAAK,EAAE,EAAC,YAAY,EAAC,KAAK,EAAC,uDAAuD;wBAChF,4DAAK,KAAK,EAAC,yBAAyB;4BAClC,+DACE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,EAC7C,KAAK,EAAC,6DAA6D,EACnE,QAAQ,EAAE,IAAI,CAAC,WAAW,KAAK,CAAC;gCAEhC,4DAAK,KAAK,EAAC,SAAS,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAAC,OAAO,EAAC,WAAW;oCACxE,+EAAqB,OAAO,qBAAiB,OAAO,kBAAc,GAAG,EAAC,CAAC,EAAC,+BAA+B,GAAE,CACrG,CACC;4BACT,+DACE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC,EAC5C,KAAK,EAAC,6DAA6D,EACnE,QAAQ,EAAE,IAAI,CAAC,WAAW,KAAK,CAAC;gCAEhC,4DAAK,KAAK,EAAC,SAAS,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAAC,OAAO,EAAC,WAAW;oCACxE,+EAAqB,OAAO,qBAAiB,OAAO,kBAAc,GAAG,EAAC,CAAC,EAAC,iBAAiB,GAAE,CACvF,CACC,CACL;wBAEN,6DAAM,KAAK,EAAC,eAAe;;4BACnB,IAAI,CAAC,WAAW;;4BAAM,IAAI,CAAC,UAAU,CACtC;wBAEP,4DAAK,KAAK,EAAC,yBAAyB;4BAClC,+DACE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC,EAC5C,KAAK,EAAC,6DAA6D,EACnE,QAAQ,EAAE,IAAI,CAAC,WAAW,KAAK,IAAI,CAAC,UAAU;gCAE9C,4DAAK,KAAK,EAAC,SAAS,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAAC,OAAO,EAAC,WAAW;oCACxE,+EAAqB,OAAO,qBAAiB,OAAO,kBAAc,GAAG,EAAC,CAAC,EAAC,cAAc,GAAE,CACpF,CACC;4BACT,+DACE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC,EAC5C,KAAK,EAAC,6DAA6D,EACnE,QAAQ,EAAE,IAAI,CAAC,WAAW,KAAK,IAAI,CAAC,UAAU;gCAE9C,4DAAK,KAAK,EAAC,SAAS,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAAC,OAAO,EAAC,WAAW;oCACxE,+EAAqB,OAAO,qBAAiB,OAAO,kBAAc,GAAG,EAAC,CAAC,EAAC,2BAA2B,GAAE,CACjG,CACC,CACL,CACF,CACV,CACL,CACF,CAEN,CAAC;IACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ;AAKD,mIAAmI;AAKnI,6DAA6D;AAC7D,qDAAqD;AAErD,yBAAyB;AACzB,wBAAwB;AACxB,kBAAkB;AAClB,0BAA0B;AAC1B,kBAAkB;AAClB,IAAI;AAGJ,eAAe;AACf,wBAAwB;AACxB,kCAAkC;AAClC,kBAAkB;AAClB,KAAK;AAGL,4BAA4B;AAC5B,gDAAgD;AAChD,sCAAsC;AACtC,qCAAqC;AACrC,kCAAkC;AAClC,oDAAoD;AACpD,sCAAsC;AACtC,yCAAyC;AACzC,QAAQ;AACR,kCAAkC;AAClC,0BAA0B;AAC1B,qCAAqC;AACrC,uCAAuC;AACvC,SAAS;AACT,QAAQ;AACR,kCAAkC;AAClC,0BAA0B;AAC1B,qCAAqC;AACrC,gCAAgC;AAChC,SAAS;AACT,QAAQ;AACR,kCAAkC;AAClC,0BAA0B;AAC1B,qCAAqC;AACrC,gCAAgC;AAChC,SAAS;AACT,QAAQ;AACR,kCAAkC;AAClC,0BAA0B;AAC1B,0CAA0C;AAC1C,kDAAkD;AAClD,QAAQ;AACR,OAAO;AAEP,wDAAwD;AACxD,wDAAwD;AACxD,6CAA6C;AAC7C,OAAO;AAEP,0CAA0C;AAC1C,6CAA6C;AAC7C,OAAO;AAEP,wCAAwC;AACxC,2CAA2C;AAC3C,OAAO;AAEP,wDAAwD;AACxD,uDAAuD;AACvD,OAAO;AAEP,+CAA+C;AAC/C,oCAAoC;AACpC,4EAA4E;AAC5E,eAAe;AACf,8BAA8B;AAC9B,oCAAoC;AACpC,QAAQ;AACR,OAAO;AAEP,oFAAoF;AACpF,2BAA2B;AAC3B,sBAAsB;AACtB,gCAAgC;AAChC,iBAAiB;AACjB,qBAAqB;AACrB,wDAAwD;AACxD,iBAAiB;AACjB,qBAAqB;AACrB,sEAAsE;AACtE,iBAAiB;AACjB,qBAAqB;AACrB,8CAA8C;AAC9C,iBAAiB;AACjB,QAAQ;AACR,OAAO;AAEP,0CAA0C;AAC1C,oCAAoC;AACpC,oBAAoB;AACpB,iBAAiB;AACjB,sFAAsF;AACtF,kHAAkH;AAClH,iBAAiB;AACjB,WAAW;AACX,QAAQ;AACR,0CAA0C;AAC1C,qBAAqB;AACrB,iBAAiB;AACjB,sFAAsF;AACtF,sGAAsG;AACtG,iBAAiB;AACjB,WAAW;AACX,QAAQ;AACR,oBAAoB;AACpB,eAAe;AACf,oFAAoF;AACpF,qGAAqG;AACrG,eAAe;AACf,SAAS;AACT,MAAM;AAEN,eAAe;AACf,eAAe;AACf,yCAAyC;AACzC,mGAAmG;AACnG,2BAA2B;AAC3B,+BAA+B;AAC/B,2FAA2F;AAE3F,sCAAsC;AACtC,mEAAmE;AACnE,sDAAsD;AACtD,sFAAsF;AACtF,2BAA2B;AAC3B,kKAAkK;AAClK,sDAAsD;AACtD,yDAAyD;AACzD,oBAAoB;AACpB,qDAAqD;AACrD,yDAAyD;AACzD,iEAAiE;AACjE,mEAAmE;AACnE,iEAAiE;AACjE,4BAA4B;AAC5B,yFAAyF;AACzF,8GAA8G;AAC9G,yLAAyL;AACzL,2BAA2B;AAC3B,4BAA4B;AAC5B,uBAAuB;AAEvB,yBAAyB;AACzB,qDAAqD;AACrD,6HAA6H;AAC7H,kBAAkB;AAClB,iCAAiC;AACjC,0BAA0B;AAE1B,yBAAyB;AACzB,mDAAmD;AACnD,4FAA4F;AAC5F,kBAAkB;AAClB,8FAA8F;AAC9F,gOAAgO;AAChO,yBAAyB;AACzB,+BAA+B;AAC/B,0BAA0B;AAC1B,qBAAqB;AACrB,mBAAmB;AAEnB,0BAA0B;AAC1B,0CAA0C;AAC1C,qCAAqC;AACrC,wBAAwB;AACxB,wDAAwD;AACxD,uFAAuF;AACvF,+BAA+B;AAC/B,sEAAsE;AACtE,4EAA4E;AAC5E,wBAAwB;AACxB,oCAAoC;AACpC,yDAAyD;AACzD,gCAAgC;AAChC,0BAA0B;AAC1B,uFAAuF;AACvF,+BAA+B;AAC/B,gEAAgE;AAChE,4EAA4E;AAC5E,wBAAwB;AACxB,6BAA6B;AAC7B,mDAAmD;AACnD,gCAAgC;AAChC,0BAA0B;AAC1B,uFAAuF;AACvF,+BAA+B;AAC/B,wEAAwE;AACxE,4EAA4E;AAC5E,wBAAwB;AACxB,sCAAsC;AACtC,2DAA2D;AAC3D,gCAAgC;AAChC,0BAA0B;AAC1B,uFAAuF;AACvF,+BAA+B;AAC/B,gEAAgE;AAChE,4EAA4E;AAC5E,wBAAwB;AACxB,gCAAgC;AAChC,mDAAmD;AACnD,gCAAgC;AAChC,0BAA0B;AAC1B,yFAAyF;AACzF,sCAAsC;AACtC,0BAA0B;AAC1B,wBAAwB;AACxB,yBAAyB;AACzB,wBAAwB;AACxB,yDAAyD;AACzD,uFAAuF;AACvF,wFAAwF;AACxF,kFAAkF;AAClF,0FAA0F;AAC1F,kFAAkF;AAClF,yDAAyD;AACzD,6EAA6E;AAC7E,6FAA6F;AAC7F,0CAA0C;AAC1C,kCAAkC;AAClC,mCAAmC;AACnC,6EAA6E;AAC7E,qGAAqG;AACrG,4BAA4B;AAC5B,wGAAwG;AACxG,0OAA0O;AAC1O,mCAAmC;AACnC,oCAAoC;AACpC,+BAA+B;AAC/B,4BAA4B;AAC5B,0BAA0B;AAC1B,sBAAsB;AACtB,yBAAyB;AACzB,uBAAuB;AACvB,mBAAmB;AAEnB,+BAA+B;AAC/B,yEAAyE;AACzE,oDAAoD;AACpD,yBAAyB;AACzB,iEAAiE;AACjE,sFAAsF;AACtF,oDAAoD;AACpD,kBAAkB;AAClB,8FAA8F;AAC9F,8HAA8H;AAC9H,0BAA0B;AAC1B,yBAAyB;AACzB,gEAAgE;AAChE,sFAAsF;AACtF,oDAAoD;AACpD,kBAAkB;AAClB,8FAA8F;AAC9F,gHAAgH;AAChH,0BAA0B;AAC1B,qBAAqB;AAErB,2CAA2C;AAC3C,6DAA6D;AAC7D,sBAAsB;AAEtB,oDAAoD;AACpD,yBAAyB;AACzB,gEAAgE;AAChE,sFAAsF;AACtF,kEAAkE;AAClE,kBAAkB;AAClB,8FAA8F;AAC9F,6GAA6G;AAC7G,0BAA0B;AAC1B,yBAAyB;AACzB,gEAAgE;AAChE,sFAAsF;AACtF,kEAAkE;AAClE,kBAAkB;AAClB,8FAA8F;AAC9F,0HAA0H;AAC1H,yBAAyB;AACzB,0BAA0B;AAC1B,qBAAqB;AACrB,mBAAmB;AACnB,iBAAiB;AACjB,sBAAsB;AACtB,SAAS;AACT,MAAM;AACN,IAAI","sourcesContent":["import {\n Component,\n Prop,\n State,\n Element,\n Event,\n EventEmitter,\n h,\n Watch,\n Host,\n} from '@stencil/core';\nconst getIconType = (sortType) => {\n switch (sortType) {\n case 'asc':\n return 'arrow-up';\n case 'desc':\n return 'arrow-down';\n default:\n return 'dash';\n }\n};\n\n@Component({\n tag: 'xplor-table',\n // styleUrl: 'xplor-table.scss',\n shadow: true,\n})\n\nexport class XplorTable {\n @Element() el: HTMLXplorTableElement;\n\n /*\n The header values for each column.\n /\n @Prop() columns?: string[];\n\n /\n The data for the body of the table.\n /\n @Prop() data?: string[][];\n\n /\n When true, the first column of the table is sticky and will cover the leftmost rows in a horizontally scrollable container.\n /\n @Prop() freeze?: boolean;\n\n /\n Toggles a selectable checkbox for each row in the table\n /\n @Prop() multiselect?: boolean;\n\n /\n Toggles an optional styling of the background of each even row of the table body.\n /\n @Prop() striped?: boolean;\n\n /\n The values for the input for each row when multiselect is activated.\n /\n @Prop() selectedValues?: string[] = [];\n\n /\n Toggles to show the sort button on each table head\n /\n @Prop() isSortable?: boolean = true;\n\n /\n Manually determined if the column is sortable\n /\n @Prop() sortableColumns?: boolean[] = [];\n\n @State() areAllSelected = false;\n\n @State() rowData: string[][];\n\n @State() hasScrolled = false;\n\n @State() selected: (string \| boolean)[];\n\n @State() sortTypeArray: ('asc' \| 'desc' \| null)[] = [];\n @State() selectedDateRange: string = 'All';\n /\n Callback function that is called when the checkbox for a row of a\n * `multiselect` table is checked\n /\n @State() currentPage: number = 1;\n @State() totalPages: number = 3;\n @Event() tableSelect: EventEmitter;\n private handlePagination = (direction: 'first' \| 'prev' \| 'next' \| 'last') => {\n switch (direction) {\n case 'first':\n this.currentPage = 1;\n break;\n case 'prev':\n if (this.currentPage > 1) this.currentPage--;\n break;\n case 'next':\n if (this.currentPage < this.totalPages) this.currentPage++;\n break;\n case 'last':\n this.currentPage = this.totalPages;\n break;\n }\n };\n \n private handleDateRangeChange = (event: Event) => {\n const target = event.target as HTMLSelectElement;\n this.selectedDateRange = target.value;\n };\n\n private handleFilterReports = () => {\n console.log('Filter reports clicked');\n };\n\n private handleDownloadAll = () => {\n console.log('Download all clicked');\n };\n\n // private handleDownloadReport = (index: number) => {\n // console.log(`Download report ${index} clicked`);\n // };\n private selectAllValue = Math.random().toString(36).slice(2);\n\n private container!: HTMLDivElement;\n\n private selectAll = (e: Event) => {\n const { target } = e;\n\n if (!(target instanceof HTMLInputElement)) return;\n\n const { checked } = target;\n\n this.areAllSelected = checked;\n\n this.selected =\n this.selectedValues.length > 0\n ? // gets all checkboxes in body\n Array.from(\n this.el.querySelectorAll('tbody td:first-child input'),\n ).map((input: HTMLInputElement) =>\n // if the select all checkbox is checked, return\n // the value from the current input. If false, set all to false.\n checked ? input?.value : checked,\n )\n : this.selected.map(() => checked);\n this.onChange();\n };\n\n private selectOne = (e: Event, checkboxIdx: number) => {\n const { target } = e;\n if (!(target instanceof HTMLInputElement)) return;\n\n const { checked, value } = target;\n\n this.areAllSelected = false;\n this.selected = this.selected.map((v, selectedIdx) => {\n // if the checkbox that fired the event is not the current idx\n // return the current value\n if (selectedIdx !== checkboxIdx) return v;\n\n /\n If there are values in this.selectedValues, either return the value\n * for that checkbox or false, dependent on if the checkbox is checked or not.\n * If there are no values in this.selectedValues, return the value\n * to either true or false, dependent on if the checkbox is checked or not.\n \n /\n return this.selectedValues.length > 0\n ? checked\n ? value\n : checked\n : checked;\n });\n this.onChange();\n };\n\n private onChange = () => {\n this.tableSelect.emit({\n selected: this.selected,\n areAllSelected: this.areAllSelected,\n });\n };\n\n private onScroll = () => {\n this.hasScrolled = this.container.scrollLeft > 0;\n };\n\n private sortBy = (col: number) => {\n this.sortTypeArray = this.sortTypeArray.map((val, idx) => {\n if (idx !== col) return null;\n\n switch (val) {\n case 'asc':\n return 'desc';\n case 'desc':\n return null;\n default:\n return 'asc';\n }\n });\n\n const handleSort = (a, b) => {\n if (a[col].toLocaleLowerCase() < b[col].toLocaleLowerCase()) {\n return -1;\n }\n if (a[col].toLocaleLowerCase() > b[col].toLocaleLowerCase()) {\n return 1;\n }\n return 0;\n };\n\n if (this.sortTypeArray[col] === 'asc') {\n this.rowData.sort((a, b) => handleSort(a, b));\n } else if (this.sortTypeArray[col] === 'desc') {\n this.rowData.sort((a, b) => handleSort(b, a));\n } else {\n this.rowData = this.data;\n this.sortTypeArray[col] = null;\n }\n\n this.rowData = Array.from(this.rowData);\n this.render();\n };\n\n private setData = () => {\n this.rowData = this.data !== undefined ? Array.from(this.data) : [];\n };\n\n // Add this method to paginate rowData\nprivate getPaginatedData(): string[][] {\n const startIndex = (this.currentPage - 1) * 10;\n const endIndex = startIndex + 10;\n return this.rowData.slice(startIndex, endIndex);\n}\n\n @Watch('data')\n watchData() {\n this.setData();\n }\n\n componentWillLoad() {\n this.areAllSelected = false;\n this.setData();\n this.selected = new Array(this.rowData.length).fill(false);\n // Fill the Sort Type Array to default null depends on number of columns\n this.sortTypeArray = this.columns && this.columns.map(() => null);\n }\n\n render() {\n let className = 'xpl-table';\n if (this.striped) className += ' xpl-table--striped';\n if (this.freeze) className += ' xpl-table--freeze';\n if (this.hasScrolled) className += ' xpl-table--has-scrolled';\n\n const paginatedData = this.getPaginatedData();\n\n return (\n <Host class=\"xplor-table\">\n <div class=\"bg-white rounded-lg shadow-sm border border-gray-200 p-6 max-w-6xl mx-auto\">\n <div\n class=\"xpl-table-container\"\n onScroll={this.onScroll}\n ref={(el) => {\n this.container = el;\n }}\n >\n {/* Header /}\n <div class=\"mb-6\">\n <h1 class=\"text-xl font-semibold text-gray-900 mb-4\">Head Counts Report</h1>\n \n {/ Filter Controls /}\n <div class=\"flex flex-wrap items-center gap-4 mb-6\">\n <div class=\"flex items-center gap-2\">\n <label class=\"text-sm text-gray-600 font-medium\">Date Range</label>\n <select \n class=\"border border-gray-300 rounded px-3 py-1.5 text-sm bg-white focus:outline-none focus:ring-2 focus:ring-teal-500 focus:border-teal-500\"\n // value={this.selectedDateRange}\n onInput={this.handleDateRangeChange}\n >\n <option value=\"All\">All</option>\n <option value=\"Today\">Today</option>\n <option value=\"This Week\">This Week</option>\n <option value=\"This Month\">This Month</option>\n <option value=\"Custom\">Custom Range</option>\n </select>\n <button class=\"p-1.5 border border-gray-300 rounded hover:bg-gray-50\">\n <svg class=\"w-4 h-4 text-gray-500\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z\"/>\n </svg>\n </button>\n </div>\n \n <button \n onClick={this.handleFilterReports}\n class=\"bg-teal-600 hover:bg-teal-700 text-white px-4 py-1.5 rounded text-sm font-medium transition-colors\"\n >\n Filter Reports\n </button>\n \n <button \n onClick={this.handleDownloadAll}\n class=\"flex items-center gap-2 text-gray-600 hover:text-gray-800 text-sm\"\n >\n <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\"/>\n </svg>\n Download All\n </button>\n </div>\n </div>\n\n <table class={`w-full ${className}`}>\n {this.columns && (\n <thead>\n {this.columns.map((column, i) => {\n const iconType = getIconType(\n this.sortTypeArray[i],\n );\n const isColumnSortable = !!(\n this.isSortable &&\n this.sortableColumns[i]\n );\n return (\n <th\n class=\"text-left py-3 px-4 text-sm font-medium text-gray-600\"\n aria-sort={\n isColumnSortable && this.sortTypeArray[i]\n ? this.sortTypeArray[i] === 'asc'\n ? 'ascending'\n : 'descending'\n : isColumnSortable\n ? 'none'\n : undefined\n }\n >\n {this.multiselect && i === 0 ? (\n <label\n onClick={(e) => {\n e.preventDefault();\n e.stopPropagation();\n if (isColumnSortable) {\n this.sortBy(i);\n }\n }}\n class={\n isColumnSortable\n ? 'cursor-pointer'\n : ''\n }\n >\n <input\n checked={\n this.areAllSelected\n }\n id=\"__xpl-table-th\"\n // appear indeterminate when at least one but not all\n // are selected\n\n indeterminate={\n !this\n .areAllSelected &&\n this.selected.some(\n (a) => a,\n )\n }\n onClick={(e) => {\n e.stopPropagation();\n this.selectAll(e);\n }}\n type=\"checkbox\"\n value={`select-all-${this.selectAllValue}`}\n aria-label=\"Select all rows\"\n />\n {column}\n {isColumnSortable &&\n !!this.sortTypeArray[\n i\n ] && (\n <xpl-icon\n icon={iconType}\n size={16}\n ></xpl-icon>\n )}\n </label>\n ) : (\n <label\n onClick={() =>\n isColumnSortable &&\n this.sortBy(i)\n }\n class={\n isColumnSortable\n ? 'cursor-pointer'\n : ''\n }\n aria-label={isColumnSortable ? `Sort by ${column}` : undefined}\n >\n {column}\n {isColumnSortable &&\n !!this.sortTypeArray[\n i\n ] && (\n <svg width=\"11\" height=\"6\" viewBox=\"0 0 11 6\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M10.5 5.5L5.5 0.5L0.5 5.5L10.5 5.5Z\" fill=\"currentColor\"></path></svg>\n // <xpl-icon\n // icon={iconType}\n // size={16}\n // id=\"__xpl-icon-sort\"\n // ></xpl-icon>\n )}\n </label>\n )}\n </th>\n );\n })}\n </thead>\n )}\n <tbody>\n {paginatedData.map((row, rowNum) => (\n <tr\n class={`border-b border-gray-100 hover:bg-gray-50`}\n >\n {row.map((cell, i) => (\n <td class=\"py-3 px-4 text-sm text-gray-900\">\n {this.multiselect && i === 0 ? (\n <label\n class=\"flex items-center gap-2\"\n htmlFor={`__xpl-table-row-${\n rowNum\n }`}\n >\n <input\n id={`__xpl-table-row-${\n rowNum\n }`}\n checked={\n !!this.selected[\n rowNum\n ]\n }\n type=\"checkbox\"\n onChange={(e) =>\n this.selectOne(\n e,\n rowNum,\n )\n }\n value={\n this.selectedValues\n .length > 0\n ? this\n .selectedValues[\n rowNum\n ]\n : `xpl-table-checkbox-${rowNum}`\n }\n />\n <div innerHTML={cell} />\n </label>\n ) : (\n <div innerHTML={cell} />\n )}\n </td>\n ))}\n </tr>\n ))}\n \n </tbody>\n </table>\n {/ Pagination /}\n <div id=\"pagination\" class=\"w-full flex items-center justify-between mt-6 text-sm\">\n <div class=\"flex items-center gap-2\">\n <button \n onClick={() => this.handlePagination('first')}\n class=\"p-1.5 text-gray-400 hover:text-gray-600 disabled:opacity-50\"\n disabled={this.currentPage === 1}\n >\n <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M11 19l-7-7 7-7m8 14l-7-7 7-7\"/>\n </svg>\n </button>\n <button \n onClick={() => this.handlePagination('prev')}\n class=\"p-1.5 text-gray-400 hover:text-gray-600 disabled:opacity-50\"\n disabled={this.currentPage === 1}\n >\n <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M15 19l-7-7 7-7\"/>\n </svg>\n </button>\n </div>\n\n <span class=\"text-gray-600\">\n Page {this.currentPage} of {this.totalPages}\n </span>\n\n <div class=\"flex items-center gap-2\">\n <button \n onClick={() => this.handlePagination('next')}\n class=\"p-1.5 text-gray-400 hover:text-gray-600 disabled:opacity-50\"\n disabled={this.currentPage === this.totalPages}\n >\n <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 5l7 7-7 7\"/>\n </svg>\n </button>\n <button \n onClick={() => this.handlePagination('last')}\n class=\"p-1.5 text-gray-400 hover:text-gray-600 disabled:opacity-50\"\n disabled={this.currentPage === this.totalPages}\n >\n <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M13 5l7 7-7 7M5 5l7 7-7 7\"/>\n </svg>\n </button>\n </div>\n </div>\n </div>\n </div>\n </Host>\n\n );\n }\n}\n\n\n\n\n////////////// ######################## ///////////////////////////////// This code is commented out as it is not currently in use.\n\n\n\n\n// import { Component, Prop, State, h } from '@stencil/core';\n// import { StyledHost } from '../x-styles/x-styles';\n\n// interface ReportData {\n// submitDate: string;\n// time: string;\n// educatorName: string;\n// room: string;\n// }\n\n\n// @Component({\n// tag: 'xplor-table',\n// styleUrl: 'xplor-table.scss',\n// shadow: true,\n// })\n\n\n// export class XplorTable {\n// @State() selectedDateRange: string = 'All';\n// @State() currentPage: number = 1;\n// @State() totalPages: number = 1;\n// @State() sortBy: string = '';\n// @State() sortDirection: 'asc' \| 'desc' = 'asc';\n// @Prop() tablecContent: ReportData[]\n// private reportData: ReportData[] = [\n// {\n// submitDate: '14/01/2025',\n// time: '10:01:21',\n// educatorName: 'Andi Kelman',\n// room: '2025 Holiday Programme'\n// },\n// {\n// submitDate: '10/10/2023',\n// time: '10:44:46',\n// educatorName: 'Andi Kelman',\n// room: '3 Kinder 3 - 23'\n// },\n// {\n// submitDate: '10/10/2023',\n// time: '10:36:15',\n// educatorName: 'Andi Kelman',\n// room: '3 Kinder 3 - 23'\n// },\n// {\n// submitDate: '28/03/2023',\n// time: '15:51:51',\n// educatorName: 'Cara Bierenkrant',\n// room: '8 KINDER 8 - CRECHE Kinder 8 2023'\n// }\n// ];\n\n// private handleDateRangeChange = (event: Event) => {\n// const target = event.target as HTMLSelectElement;\n// this.selectedDateRange = target.value;\n// };\n\n// private handleFilterReports = () => {\n// console.log('Filter reports clicked');\n// };\n\n// private handleDownloadAll = () => {\n// console.log('Download all clicked');\n// };\n\n// private handleDownloadReport = (index: number) => {\n// console.log(`Download report ${index} clicked`);\n// };\n\n// private handleSort = (column: string) => {\n// if (this.sortBy === column) {\n// this.sortDirection = this.sortDirection === 'asc' ? 'desc' : 'asc';\n// } else {\n// this.sortBy = column;\n// this.sortDirection = 'asc';\n// }\n// };\n\n// private handlePagination = (direction: 'first' \| 'prev' \| 'next' \| 'last') => {\n// switch (direction) {\n// case 'first':\n// this.currentPage = 1;\n// break;\n// case 'prev':\n// if (this.currentPage > 1) this.currentPage--;\n// break;\n// case 'next':\n// if (this.currentPage < this.totalPages) this.currentPage++;\n// break;\n// case 'last':\n// this.currentPage = this.totalPages;\n// break;\n// }\n// };\n\n// private getSortIcon(column: string) {\n// if (this.sortBy !== column) {\n// // Unsorted\n// return (\n// <svg class=\"w-3 h-3\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n// <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 9l4-4 4 4m0 6l-4 4-4-4\"/>\n// </svg>\n// );\n// }\n// if (this.sortDirection === 'asc') {\n// // Ascending\n// return (\n// <svg class=\"w-3 h-3\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n// <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 15l4-4 4 4\"/>\n// </svg>\n// );\n// }\n// // Descending\n// return (\n// <svg class=\"w-3 h-3\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n// <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M16 9l-4 4-4-4\"/>\n// </svg>\n// );\n// }\n\n// render() {\n// return (\n// <StyledHost class=\"xplor-table\">\n// <div class=\"bg-white rounded-lg shadow-sm border border-gray-200 p-6 max-w-6xl mx-auto\">\n// {/ Header /}\n// <div class=\"mb-6\">\n// <h1 class=\"text-xl font-semibold text-gray-900 mb-4\">Head Counts Report</h1>\n \n// {/ Filter Controls /}\n// <div class=\"flex flex-wrap items-center gap-4 mb-6\">\n// <div class=\"flex items-center gap-2\">\n// <label class=\"text-sm text-gray-600 font-medium\">Date Range</label>\n// <select \n// class=\"border border-gray-300 rounded px-3 py-1.5 text-sm bg-white focus:outline-none focus:ring-2 focus:ring-teal-500 focus:border-teal-500\"\n// // value={this.selectedDateRange}\n// onInput={this.handleDateRangeChange}\n// >\n// <option value=\"All\">All</option>\n// <option value=\"Today\">Today</option>\n// <option value=\"This Week\">This Week</option>\n// <option value=\"This Month\">This Month</option>\n// <option value=\"Custom\">Custom Range</option>\n// </select>\n// <button class=\"p-1.5 border border-gray-300 rounded hover:bg-gray-50\">\n// <svg class=\"w-4 h-4 text-gray-500\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n// <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z\"/>\n// </svg>\n// </button>\n// </div>\n \n// <button \n// onClick={this.handleFilterReports}\n// class=\"bg-teal-600 hover:bg-teal-700 text-white px-4 py-1.5 rounded text-sm font-medium transition-colors\"\n// >\n// Filter Reports\n// </button>\n \n// <button \n// onClick={this.handleDownloadAll}\n// class=\"flex items-center gap-2 text-gray-600 hover:text-gray-800 text-sm\"\n// >\n// <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n// <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\"/>\n// </svg>\n// Download All\n// </button>\n// </div>\n// </div>\n\n// {/ Table /}\n// <div class=\"overflow-x-auto\">\n// <table class=\"w-full\">\n// <thead>\n// <tr class=\"border-b border-gray-200\">\n// <th class=\"text-left py-3 px-4 text-sm font-medium text-gray-600\">\n// <button \n// onClick={() => this.handleSort('submitDate')}\n// class=\"flex items-center gap-1 hover:text-gray-900\"\n// >\n// Submit Date\n// {this.getSortIcon('submitDate')}\n// </button>\n// </th>\n// <th class=\"text-left py-3 px-4 text-sm font-medium text-gray-600\">\n// <button \n// onClick={() => this.handleSort('time')}\n// class=\"flex items-center gap-1 hover:text-gray-900\"\n// >\n// Time\n// {this.getSortIcon('time')}\n// </button>\n// </th>\n// <th class=\"text-left py-3 px-4 text-sm font-medium text-gray-600\">\n// <button \n// onClick={() => this.handleSort('educatorName')}\n// class=\"flex items-center gap-1 hover:text-gray-900\"\n// >\n// Educator Name\n// {this.getSortIcon('educatorName')}\n// </button>\n// </th>\n// <th class=\"text-left py-3 px-4 text-sm font-medium text-gray-600\">\n// <button \n// onClick={() => this.handleSort('room')}\n// class=\"flex items-center gap-1 hover:text-gray-900\"\n// >\n// Room(s)\n// {this.getSortIcon('room')}\n// </button>\n// </th>\n// <th class=\"text-center py-3 px-4 text-sm font-medium text-gray-600\">\n// Download Report\n// </th>\n// </tr>\n// </thead>\n// <tbody>\n// {this.reportData.map((row, index) => (\n// <tr key={index} class=\"border-b border-gray-100 hover:bg-gray-50\">\n// <td class=\"py-3 px-4 text-sm text-gray-900\">{row.submitDate}</td>\n// <td class=\"py-3 px-4 text-sm text-gray-900\">{row.time}</td>\n// <td class=\"py-3 px-4 text-sm text-gray-900\">{row.educatorName}</td>\n// <td class=\"py-3 px-4 text-sm text-gray-900\">{row.room}</td>\n// <td class=\"py-3 px-4 text-center\">\n// <div class=\"flex items-center justify-center gap-2\">\n// <span class=\"bg-gray-100 text-gray-700 px-2 py-1 rounded text-xs\">\n// Toggle SortBy\n// </span>\n// <button \n// onClick={() => this.handleDownloadReport(index)}\n// class=\"p-1.5 text-teal-600 hover:text-teal-800 hover:bg-teal-50 rounded\"\n// >\n// <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n// <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\"/>\n// </svg>\n// </button>\n// </div>\n// </td>\n// </tr>\n// ))}\n// </tbody>\n// </table>\n// </div>\n\n// {/ Pagination */}\n// <div class=\"flex items-center justify-between mt-6 text-sm\">\n// <div class=\"flex items-center gap-2\">\n// <button \n// onClick={() => this.handlePagination('first')}\n// class=\"p-1.5 text-gray-400 hover:text-gray-600 disabled:opacity-50\"\n// disabled={this.currentPage === 1}\n// >\n// <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n// <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M11 19l-7-7 7-7m8 14l-7-7 7-7\"/>\n// </button>\n// <button \n// onClick={() => this.handlePagination('prev')}\n// class=\"p-1.5 text-gray-400 hover:text-gray-600 disabled:opacity-50\"\n// disabled={this.currentPage === 1}\n// >\n// <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n// <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M15 19l-7-7 7-7\"/>\n// </button>\n// </div>\n\n// <span class=\"text-gray-600\">\n// Page {this.currentPage} of {this.totalPages}\n// </span>\n\n// <div class=\"flex items-center gap-2\">\n// <button \n// onClick={() => this.handlePagination('next')}\n// class=\"p-1.5 text-gray-400 hover:text-gray-600 disabled:opacity-50\"\n// disabled={this.currentPage === this.totalPages}\n// >\n// <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n// <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 5l7 7-7 7\"/>\n// </button>\n// <button \n// onClick={() => this.handlePagination('last')}\n// class=\"p-1.5 text-gray-400 hover:text-gray-600 disabled:opacity-50\"\n// disabled={this.currentPage === this.totalPages}\n// >\n// <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n// <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M13 5l7 7-7 7M5 5l7 7-7 7\"/>\n// </svg>\n// </button>\n// </div>\n// </div>\n// </div>\n// </StyledHost>\n// );\n// }\n// }"]}

package/dist/collection/components/xplor-text-bubble/xplor-text-bubble.js CHANGED Viewed

@@ -4,11 +4,11 @@ export class XplorTextBubble {
         this.color = 'orange';
     }
     render() {
-        return (h(Host, { key: '61174051f7acc2747a0c95e1599a8ca04a9bc5e6' }, h("div", { key: 'fe266a910f906422a4e5d9e73d4f4d0570fa8c79', class: {
+        return (h(Host, { key: 'bd93a7c09ef941a3c5a18b8b6b0704b2c9842b23' }, h("div", { key: '234e72bed4c9cdf297901639130b452dd82392cf', class: {
                 'text-bubble': true,
                 'text-bubble--green': this.color === 'green',
                 'text-bubble--orange': this.color === 'orange',
-            } }, h("slot", { key: '1286ac72861f5da019bece897343778d40acdc36' }))));
+            } }, h("slot", { key: '92c5fe22e00dd2506b15d49333ba8e31021d9bbf' }))));
     }
     static get is() { return "xplor-text-bubble"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/xplor-text-field/xplor-text-field.js CHANGED Viewed

@@ -124,10 +124,10 @@ export class XplorTextField {
     }
     render() {
         const labelFloating = this.isFocused || this.hasValue;
-        return (h(Host, { key: '93fdd30e48260ae52b33c18368637b1e7fdd7b6b' }, h("div", { key: 'ef93e7bc3588c225dfb7fef553f1146aecfcc027', class: this.computedClasses }, h("div", { key: '5ffdd5634f410b2432e549403040e9ce7fdb0da4', class: "xplor-text-field__wrapper", style: { backgroundColor: this.bgColor } }, h("div", { key: '08ab012b2ccb2698256f149563cc1ed47052e694', class: "xplor-text-field__input-wrapper" }, this.label && (h("label", { key: 'c4f359a167cb4cb47ba39355c56f7249523d8ef7', class: {
+        return (h(Host, { key: '3c7117a290dc3f7157270b083559266c94ad21b8' }, h("div", { key: 'f97ceed7ef938aed090f297d070cd240b658d8a7', class: this.computedClasses }, h("div", { key: '81ba47f6a22762d85e33052765896949e87e824f', class: "xplor-text-field__wrapper", style: { backgroundColor: this.bgColor } }, h("div", { key: '33190e56a1443af9e4891d4a166442daa52ecb79', class: "xplor-text-field__input-wrapper" }, this.label && (h("label", { key: 'a44ab99f0e1719b2a93edcd7963c89476154f2f6', class: {
                 'xplor-text-field__label': true,
                 'xplor-text-field__label--floating': labelFloating,
-            } }, h("slot", { key: 'cfd751bb2bbe51c6a847b6ac6317559b06feae39', name: "label" }, this.label), this.required && h("span", { key: '0d53dea42c4b288ec44c699aac77670ff45167b9', class: "xplor-text-field__required" }, "*"))), h("input", { key: 'cbb7810c082c222a6aebe67fbfdfcce7804ff82c', ref: (el) => (this.inputElement = el), class: "xplor-text-field__input", type: this.type, value: this.value, placeholder: this.isFocused ? this.placeholder : '', disabled: this.disabled, readonly: this.readonly, required: this.required, maxlength: this.maxlength, min: this.min, max: this.max, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur, "aria-invalid": this.hasError ? 'true' : 'false', "aria-describedby": this.hasError ? 'error-messages' : undefined }), h("div", { key: '24a63d349c6a425854ed76c6ddb4a30ed5e91566', class: "xplor-text-field__append-inner" }, this.clearable && this.hasValue && !this.disabled && !this.readonly && (h("button", { key: '9145e93c91f67f98f0759370515552c66aeaae28', type: "button", class: "xplor-text-field__clear-btn", onClick: this.handleClear, "aria-label": "Clear" }, h("svg", { key: '8dc823a286290bc563939bdee1b13bac39a6596d', width: "20", height: "20", viewBox: "0 0 24 24", fill: "currentColor" }, h("path", { key: 'd2f82e862b8331992aadd769366ef4bae2b744fd', d: "M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z" })))), h("slot", { key: '40cc5d4ba05c8e13a4697af6da86069b8f8d0003', name: "append-inner" })), h("fieldset", { key: 'd066e7b23972b722cd9e1dca0a008ba3e412cde7', class: "xplor-text-field__outline" }, h("legend", { key: 'b8a3597b17f85b6877499cf7d984a874b0a124eb', class: { 'xplor-text-field__outline-legend': true, 'xplor-text-field__outline-legend--floating': labelFloating } }, labelFloating && this.label ? h("span", null, this.label, this.required && '*') : h("span", null, "\u200B")))), h("div", { key: 'b116ffbdb2e0fa04aee252137c3300c5939df4e4', class: "xplor-text-field__append" }, h("slot", { key: '5ff712dd69e453d488f3fc3cdad49a72ed9d5779', name: "append" }))), this.showDetails && (h("div", { key: '48ffb972bfb61eab4c33c61a4610f54ab6172cf6', class: "xplor-text-field__details" }, this.hasError && (h("div", { key: '301bcf461bc00f3c4f5c5a322781f43a8451a597', id: "error-messages", class: "xplor-text-field__error-messages" }, this.errorMessages.map((error) => (h("div", { class: "xplor-text-field__error" }, error))))))))));
+            } }, h("slot", { key: 'c2299aedeb64c404c6bb7b6c0a29c9daae67fc44', name: "label" }, this.label), this.required && h("span", { key: '0d6ed2e883c3a651986470ef89f7be59ba33a645', class: "xplor-text-field__required" }, "*"))), h("input", { key: 'de966a8eb84dd86bd8a0e529561badffe71d3d46', ref: (el) => (this.inputElement = el), class: "xplor-text-field__input", type: this.type, value: this.value, placeholder: this.isFocused ? this.placeholder : '', disabled: this.disabled, readonly: this.readonly, required: this.required, maxlength: this.maxlength, min: this.min, max: this.max, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur, "aria-invalid": this.hasError ? 'true' : 'false', "aria-describedby": this.hasError ? 'error-messages' : undefined }), h("div", { key: 'b0bcd17da89b2f63f25d212f863d875489175a8c', class: "xplor-text-field__append-inner" }, this.clearable && this.hasValue && !this.disabled && !this.readonly && (h("button", { key: '0cac263bf21ccc5536d62d420ce493e906811fd6', type: "button", class: "xplor-text-field__clear-btn", onClick: this.handleClear, "aria-label": "Clear" }, h("svg", { key: '2c02a7e8a9dbe7f9d133fc3c3156389db914bf73', width: "20", height: "20", viewBox: "0 0 24 24", fill: "currentColor" }, h("path", { key: 'bfaf865c53bb90b7d14ba27e419ca131e4107bfd', d: "M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z" })))), h("slot", { key: '82eb809592dcc52a9c447c837b614d57e47f1678', name: "append-inner" })), h("fieldset", { key: '828c5d47eab64b6ff91edd9d739c87fdaa88c589', class: "xplor-text-field__outline" }, h("legend", { key: 'e1fef5e2002b8ea21c07c8f06272c6f53785f8b0', class: { 'xplor-text-field__outline-legend': true, 'xplor-text-field__outline-legend--floating': labelFloating } }, labelFloating && this.label ? h("span", null, this.label, this.required && '*') : h("span", null, "\u200B")))), h("div", { key: 'f5d2af691c5e9adb1295bbc4eb74b5510ab203f6', class: "xplor-text-field__append" }, h("slot", { key: '8b26d1a847bfbbecd77067d2addb2a555464684e', name: "append" }))), this.showDetails && (h("div", { key: '63acbf8b66a619b74769b5aba9559da813e3081e', class: "xplor-text-field__details" }, this.hasError && (h("div", { key: 'c1e72205a335a0cf361ebb1936d19a0a6e1f52fd', id: "error-messages", class: "xplor-text-field__error-messages" }, this.errorMessages.map((error) => (h("div", { class: "xplor-text-field__error" }, error))))))))));
     }
     static get is() { return "xplor-text-field"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/xplor-time-picker/xplor-time-picker.js CHANGED Viewed

@@ -282,16 +282,16 @@ export class XplorTimePicker {
     }
     render() {
         const showDetails = this.hideDetails === false || (this.hideDetails === 'auto' && this.error);
-        const clockIcon = (h("svg", { key: '9b8bc8f441d31aaa0c92e49e5c1a669f48c7ca6e', class: "time-picker__icon-svg", viewBox: "0 0 24 24", width: "20", height: "20", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("circle", { key: 'a21fb969eeb8690b82879ebc9a6c51b1cd7aafa7', cx: "12", cy: "12", r: "10" }), h("polyline", { key: '3a9baa3e13e7b8c34291a3755122262d868c61ed', points: "12 6 12 12 16 14" })));
-        return (h(Host, { key: 'd33be9ec453c217585e40c0eb8b0c0960c7bb382' }, h("div", { key: '7ab538480696c0f08acd0855801f800bfe8c8862', class: {
+        const clockIcon = (h("svg", { key: '4ceaab6e781f50e8a90c075c56cfadabb647d44a', class: "time-picker__icon-svg", viewBox: "0 0 24 24", width: "20", height: "20", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("circle", { key: '468d7d3f69e93dfa1dbd1c57922c62747d0332fc', cx: "12", cy: "12", r: "10" }), h("polyline", { key: 'c6e3f11bc952645e9016ff95b3a712394c4a22b8', points: "12 6 12 12 16 14" })));
+        return (h(Host, { key: 'c645e604a3e24895a27018db69116ab12f83f8bf' }, h("div", { key: '67a035080a85b790df31f65292babdddf4e4e61b', class: {
                 'time-picker': true,
                 'time-picker--disabled': this.disabled,
                 'time-picker--error': !!this.error,
                 'time-picker--open': this.isOpen,
-            } }, this.label && (h("label", { key: '360dc161f783af2b499223cdadac2232e3e78ba5', class: "time-picker__label" }, this.label, this.required && h("span", { key: '78a2e4b030a913d992580d6ce1651a74ad5aab5e', class: "time-picker__required" }, "*"))), h("div", { key: 'e17649b5447152ea129bd56d491c878fca99a2bd', class: "time-picker__field" }, h("input", { key: '4d14139c735efafc6267e0a08e7087e61f38fea1', type: "text", class: "time-picker__input", value: this.inputText, placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, onFocus: this.handleInputFocus, onBlur: this.handleInputBlur, onInput: this.handleInputChange, style: { backgroundColor: this.bgColor } }), h("div", { key: '84d7dbcc0f16b6f99453998b9daa27e6106cfc40', class: "time-picker__actions" }, this.clearable && this.value && !this.disabled && !this.readonly && (h("button", { key: 'a70fedda5e74f4940fe098c9d78fe68a1bc0b54d', type: "button", class: "time-picker__clear", onClick: this.handleClear, "aria-label": "Clear" }, "\u00D7")), h("button", { key: 'a1fd37c75457a5dd93da61318e6ee40c206cf5e1', type: "button", class: "time-picker__icon-btn", onClick: this.toggleDropdown, disabled: this.disabled, "aria-label": "Open time picker" }, clockIcon))), showDetails && (h("div", { key: '32d5afad7a12bbe4fe427f095d8683c80f91982e', class: "time-picker__details" }, this.error && h("div", { key: 'd8b06c272ddc8f89b629a4829d72268853f2de59', class: "time-picker__error-message" }, this.error))), this.isOpen && (h("div", { key: 'e32482cb95af8020176a98d430da82cd14e22d47', class: "time-picker__dropdown" }, h("div", { key: 'fda4e88d54bbe1aee73c559ed4739d8af92a1312', class: "time-picker__columns" }, h("div", { key: 'f6b11e869323e3ead50450c50c1513917e7d54b8', class: "time-picker__column" }, h("button", { key: '006920c8b6f9482c71e86e51b57941ba9b01ac1a', type: "button", class: "time-picker__spinner-btn", onClick: this.incrementHours, "aria-label": "Increase hours" }, this.renderChevronUp()), h("div", { key: '8d24980d4686acb684198234be4e5795bb260a68', class: "time-picker__value" }, String(this.hours).padStart(2, '0')), h("button", { key: 'd3bacc27468fce121f8fd9d33bbdc017471d186a', type: "button", class: "time-picker__spinner-btn", onClick: this.decrementHours, "aria-label": "Decrease hours" }, this.renderChevronDown())), h("div", { key: '47b37a654b39d927bc8d61631f37b1f4668ddf4f', class: "time-picker__separator" }, ":"), h("div", { key: '06338eaa14004fe3db215d8dd3aab3148e187e1e', class: "time-picker__column" }, h("button", { key: '2ef570ff9b18c21d5380a4d84b04ce9ae2e2b29a', type: "button", class: "time-picker__spinner-btn", onClick: this.incrementMinutes, "aria-label": "Increase minutes" }, this.renderChevronUp()), h("div", { key: 'd6b0499440d0316ef9ce34564b3430580890a3d4', class: "time-picker__value" }, String(this.minutes).padStart(2, '0')), h("button", { key: 'da3cae735a153e422c8916575e6450ff60944b84', type: "button", class: "time-picker__spinner-btn", onClick: this.decrementMinutes, "aria-label": "Decrease minutes" }, this.renderChevronDown())), this.showSeconds && [
-            h("div", { key: 'ac3ae8aaeff962e05ce23463e38ce8e1757125d6', class: "time-picker__separator" }, ":"),
-            h("div", { key: 'bacd826ab467fcfbe31bb0bfb0e14482792a83a7', class: "time-picker__column" }, h("button", { key: '9f5160fbe4c64aabd12b7b1b0a862ad67b5d1c0b', type: "button", class: "time-picker__spinner-btn", onClick: this.incrementSeconds, "aria-label": "Increase seconds" }, this.renderChevronUp()), h("div", { key: 'e0de300ff5896edefc657e0c700ef63022896ba0', class: "time-picker__value" }, String(this.seconds).padStart(2, '0')), h("button", { key: 'ddd4a3851c3b95fbb204df8be210ff45770a5d4a', type: "button", class: "time-picker__spinner-btn", onClick: this.decrementSeconds, "aria-label": "Decrease seconds" }, this.renderChevronDown()))
-        ], h("div", { key: '9475cca4161ce49d5542f9e80e67cca0fa8d6e47', class: "time-picker__column time-picker__column--period" }, h("button", { key: '478377c07a24bf7d42efb8ead573f212fd71a5e5', type: "button", class: "time-picker__spinner-btn", onClick: this.togglePeriod, "aria-label": "Toggle AM/PM" }, this.renderChevronUp()), h("div", { key: 'c1f4614e726d95eea32c5b02ad906a9455588594', class: "time-picker__value time-picker__value--period" }, this.period), h("button", { key: '26c95e4dcec81c18808ff42861a3ac319e43ea73', type: "button", class: "time-picker__spinner-btn", onClick: this.togglePeriod, "aria-label": "Toggle AM/PM" }, this.renderChevronDown()))))))));
+            } }, this.label && (h("label", { key: 'fc39aebaf65eb55a47e36b9e502329938a50deac', class: "time-picker__label" }, this.label, this.required && h("span", { key: 'f55931cd0b55c17176fa0f3da333f44b57b7e6a9', class: "time-picker__required" }, "*"))), h("div", { key: '3f4e57bf5c2973baaa0e53ec9bed0658e23c4c9c', class: "time-picker__field" }, h("input", { key: 'd893bd5ed3793a2e3d4aae60f16846db6c3d84a4', type: "text", class: "time-picker__input", value: this.inputText, placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, onFocus: this.handleInputFocus, onBlur: this.handleInputBlur, onInput: this.handleInputChange, style: { backgroundColor: this.bgColor } }), h("div", { key: '7cb62a66b55645c2bc3c18a60abcb0098f4700d9', class: "time-picker__actions" }, this.clearable && this.value && !this.disabled && !this.readonly && (h("button", { key: 'a547394c2508cddbcad2f3ebc52e7f361cab8f2e', type: "button", class: "time-picker__clear", onClick: this.handleClear, "aria-label": "Clear" }, "\u00D7")), h("button", { key: '48bac21bb410015f81b539205bafad2f556ced51', type: "button", class: "time-picker__icon-btn", onClick: this.toggleDropdown, disabled: this.disabled, "aria-label": "Open time picker" }, clockIcon))), showDetails && (h("div", { key: 'f10a2918e0d2cd57c7fc1d64f24e3fd4038463be', class: "time-picker__details" }, this.error && h("div", { key: 'da588b32f0fb80a797b44df89a4526ab337ec491', class: "time-picker__error-message" }, this.error))), this.isOpen && (h("div", { key: 'b23b28c312732c033a28bcb39f862311554d599c', class: "time-picker__dropdown" }, h("div", { key: 'fd8811287be54584fac873644be6da4d9a90a918', class: "time-picker__columns" }, h("div", { key: '9373ac9977bb02507c09673783ecc9fc34f796f6', class: "time-picker__column" }, h("button", { key: '64506ff04f398acf50e11e15adfabfc8a6e2950a', type: "button", class: "time-picker__spinner-btn", onClick: this.incrementHours, "aria-label": "Increase hours" }, this.renderChevronUp()), h("div", { key: 'b593fe8ea7cc1c1620f534a010d0828297845f8a', class: "time-picker__value" }, String(this.hours).padStart(2, '0')), h("button", { key: '1b2729ac84afa3aa5cbace2b027a8be77de7453c', type: "button", class: "time-picker__spinner-btn", onClick: this.decrementHours, "aria-label": "Decrease hours" }, this.renderChevronDown())), h("div", { key: 'cfc0910a6a02a6545d03dc6fd56dce45e389825b', class: "time-picker__separator" }, ":"), h("div", { key: '084da53c62bfe3cfb2cf8843761509393541b82d', class: "time-picker__column" }, h("button", { key: '017378d4bd006957267a242fd5da84bb5364626a', type: "button", class: "time-picker__spinner-btn", onClick: this.incrementMinutes, "aria-label": "Increase minutes" }, this.renderChevronUp()), h("div", { key: '344202f97262fbf267b872927c054d1fbcc636c4', class: "time-picker__value" }, String(this.minutes).padStart(2, '0')), h("button", { key: '690a243ddce9f3da11d172647202e65212e87b53', type: "button", class: "time-picker__spinner-btn", onClick: this.decrementMinutes, "aria-label": "Decrease minutes" }, this.renderChevronDown())), this.showSeconds && [
+            h("div", { key: '6ca3eae6b03f75773a39d1eb67b0db8cbf00021d', class: "time-picker__separator" }, ":"),
+            h("div", { key: 'ce31e8550cff9783229d58f866f5b2cab6b236e6', class: "time-picker__column" }, h("button", { key: '6be3f03bb5cb13f95d9381e22ed4ef27a2c31786', type: "button", class: "time-picker__spinner-btn", onClick: this.incrementSeconds, "aria-label": "Increase seconds" }, this.renderChevronUp()), h("div", { key: 'faae89dc8d1a40f7a91df944c33d6cb0347dab72', class: "time-picker__value" }, String(this.seconds).padStart(2, '0')), h("button", { key: '2e6094b085acefb6b80c835fc49d6d0c6fcde192', type: "button", class: "time-picker__spinner-btn", onClick: this.decrementSeconds, "aria-label": "Decrease seconds" }, this.renderChevronDown()))
+        ], h("div", { key: '2b029185906910cf1336726691b491bd8cd10421', class: "time-picker__column time-picker__column--period" }, h("button", { key: 'a1cced2dca331985851a8b2a71733cdc75540339', type: "button", class: "time-picker__spinner-btn", onClick: this.togglePeriod, "aria-label": "Toggle AM/PM" }, this.renderChevronUp()), h("div", { key: 'b17134d423b342cb077af961e9a684a985ed6f13', class: "time-picker__value time-picker__value--period" }, this.period), h("button", { key: '4c4d04f7ba212eb7babccf6ec2ead94fa63dcb04', type: "button", class: "time-picker__spinner-btn", onClick: this.togglePeriod, "aria-label": "Toggle AM/PM" }, this.renderChevronDown()))))))));
     }
     static get is() { return "xplor-time-picker"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/xplor-tooltip/xplor-tooltip.js CHANGED Viewed

@@ -1,4 +1,5 @@
 import { Host, h } from "@stencil/core";
+let tooltipIdCounter = 0;
 export class XplorTooltip {
     constructor() {
         this.position = 'top';
@@ -8,6 +9,7 @@ export class XplorTooltip {
         this.disabled = false;
         this.tooltipStyle = {};
         this.arrowStyle = {};
+        this.tooltipId = `xplor-tooltip-${++tooltipIdCounter}`;
         this.handleMouseEnter = () => {
             if (this.disabled)
                 return;
@@ -23,6 +25,16 @@ export class XplorTooltip {
                 this.hideTooltip();
             }, 100);
         };
+        this.handleFocusIn = () => {
+            if (this.disabled)
+                return;
+            this.showTooltip();
+        };
+        this.handleFocusOut = () => {
+            if (this.disabled)
+                return;
+            this.hideTooltip();
+        };
         this.handleClick = () => {
             if (this.disabled)
                 return;
@@ -49,12 +61,16 @@ export class XplorTooltip {
         if (this.triggerEl) {
             this.triggerEl.addEventListener('mouseenter', this.handleMouseEnter);
             this.triggerEl.addEventListener('mouseleave', this.handleMouseLeave);
+            this.triggerEl.addEventListener('focusin', this.handleFocusIn);
+            this.triggerEl.addEventListener('focusout', this.handleFocusOut);
         }
     }
     cleanupListeners() {
         if (this.triggerEl) {
             this.triggerEl.removeEventListener('mouseenter', this.handleMouseEnter);
             this.triggerEl.removeEventListener('mouseleave', this.handleMouseLeave);
+            this.triggerEl.removeEventListener('focusin', this.handleFocusIn);
+            this.triggerEl.removeEventListener('focusout', this.handleFocusOut);
         }
     }
     handleDocumentClick(event) {
@@ -139,10 +155,10 @@ export class XplorTooltip {
         };
     }
     render() {
-        return (h(Host, { key: '472521bc51295f0b7dcc4d17c0aef70df5c7181e' }, h("div", { key: '9458cc629deea68c914e7214a762498ff9c3d4c8', class: "tooltip-trigger", ref: (el) => (this.triggerEl = el), onClick: this.handleClick }, h("slot", { key: 'f5f6d6c85270fdca9b345dc9fed31b776c5d6358', name: "trigger" })), this.open && (h("div", { key: 'd56f6b7f8e2d4c0b6425a85a290e330978645e74', class: {
+        return (h(Host, { key: '135c627d93956798eef4e842ec256a0f156c771a' }, h("div", { key: '1a4253fa4f893d7726227c346c9ebc850c7ee463', class: "tooltip-trigger", ref: (el) => (this.triggerEl = el), onClick: this.handleClick, "aria-describedby": this.open ? this.tooltipId : undefined }, h("slot", { key: '8970f94fa612b40e573a66102533b1f54387b9b2', name: "trigger" })), this.open && (h("div", { key: 'c1b873e3b9ccaf8747c772672282e63615528be7', class: {
                 'tooltip': true,
                 [`tooltip--${this.position}`]: true,
-            }, style: this.tooltipStyle, ref: (el) => (this.tooltipEl = el), role: "tooltip" }, h("div", { key: '0b5735ca4b5d591dbec6f6ca6b2e47233b391198', class: "tooltip__content" }, h("slot", { key: 'c4e8c76025b546b8aa485f3f9d37ee7ecf7fbddd' }, this.content)), this.arrow && (h("div", { key: '373c339feda5732f8c5f2307deea89f2d66969ba', class: "tooltip__arrow", style: this.arrowStyle }))))));
+            }, style: this.tooltipStyle, ref: (el) => (this.tooltipEl = el), role: "tooltip", id: this.tooltipId }, h("div", { key: '93af160a6f7fc1776ca358f3f91f0fecb381ce8d', class: "tooltip__content" }, h("slot", { key: 'cb1c56d228c3f494d668dad73e2af6b303af9f42' }, this.content)), this.arrow && (h("div", { key: '9d528e58c6b772c4b72096533bdb1f0df710aa8f', class: "tooltip__arrow", style: this.arrowStyle }))))));
     }
     static get is() { return "xplor-tooltip"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/xplor-tooltip/xplor-tooltip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"xplor-tooltip.js","sourceRoot":"","sources":["../../../src/components/xplor-tooltip/xplor-tooltip.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Element, Listen } from '@stencil/core';\n\nexport type TooltipPosition = 'top' \| 'bottom' \| 'left' \| 'right';\nexport type TooltipTrigger = 'hover' \| 'click' \| 'manual';\n\n@Component({\n tag: 'xplor-tooltip',\n styleUrl: 'xplor-tooltip.scss',\n scoped: true,\n})\nexport class XplorTooltip {\n @Element() el: HTMLElement;\n\n @Prop() position: TooltipPosition = 'top';\n @Prop() trigger: TooltipTrigger = 'hover';\n @Prop() arrow: boolean = true;\n @Prop({ mutable: true }) open: boolean = false;\n @Prop() content: string;\n @Prop() disabled: boolean = false;\n\n @State() tooltipStyle: any = {};\n @State() arrowStyle: any = {};\n\n private triggerEl: HTMLDivElement;\n private tooltipEl: HTMLDivElement;\n private hideTimeout: any;\n\n componentDidLoad() {\n if (this.trigger === 'hover') {\n this.setupHoverListeners();\n }\n }\n\n disconnectedCallback() {\n this.cleanupListeners();\n if (this.hideTimeout) {\n clearTimeout(this.hideTimeout);\n }\n }\n\n private setupHoverListeners() {\n if (this.triggerEl) {\n this.triggerEl.addEventListener('mouseenter', this.handleMouseEnter);\n this.triggerEl.addEventListener('mouseleave', this.handleMouseLeave);\n }\n }\n\n private cleanupListeners() {\n if (this.triggerEl) {\n this.triggerEl.removeEventListener('mouseenter', this.handleMouseEnter);\n this.triggerEl.removeEventListener('mouseleave', this.handleMouseLeave);\n }\n }\n\n private handleMouseEnter = () => {\n if (this.disabled) return;\n if (this.hideTimeout) {\n clearTimeout(this.hideTimeout);\n }\n this.showTooltip();\n };\n\n private handleMouseLeave = () => {\n if (this.disabled) return;\n this.hideTimeout = setTimeout(() => {\n this.hideTooltip();\n }, 100);\n };\n\n private handleClick = () => {\n if (this.disabled) return;\n if (this.trigger === 'click') {\n this.open = !this.open;\n if (this.open) {\n requestAnimationFrame(() => this.updatePosition());\n }\n }\n };\n\n @Listen('click', { target: 'document' })\n handleDocumentClick(event: MouseEvent) {\n if (this.trigger === 'click' && this.open) {\n const target = event.target as Node;\n if (!this.el.contains(target)) {\n this.open = false;\n }\n }\n }\n\n private showTooltip() {\n this.open = true;\n requestAnimationFrame(() => this.updatePosition());\n }\n\n private hideTooltip() {\n this.open = false;\n }\n\n private updatePosition() {\n if (!this.triggerEl \|\| !this.tooltipEl) return;\n\n const triggerRect = this.triggerEl.getBoundingClientRect();\n const tooltipRect = this.tooltipEl.getBoundingClientRect();\n const gap = 8; // Space between trigger and tooltip\n const arrowSize = this.arrow ? 6 : 0;\n\n let top = 0;\n let left = 0;\n let arrowTop = '';\n let arrowLeft = '';\n let arrowTransform = '';\n\n switch (this.position) {\n case 'top':\n top = triggerRect.top - tooltipRect.height - gap - arrowSize;\n left = triggerRect.left + triggerRect.width / 2 - tooltipRect.width / 2;\n arrowTop = '100%';\n arrowLeft = '50%';\n arrowTransform = 'translateX(-50%) rotate(45deg)';\n break;\n\n case 'bottom':\n top = triggerRect.bottom + gap + arrowSize;\n left = triggerRect.left + triggerRect.width / 2 - tooltipRect.width / 2;\n arrowTop = '-6px';\n arrowLeft = '50%';\n arrowTransform = 'translateX(-50%) rotate(45deg)';\n break;\n\n case 'left':\n top = triggerRect.top + triggerRect.height / 2 - tooltipRect.height / 2;\n left = triggerRect.left - tooltipRect.width - gap - arrowSize;\n arrowTop = '50%';\n arrowLeft = '100%';\n arrowTransform = 'translateY(-50%) rotate(45deg)';\n break;\n\n case 'right':\n top = triggerRect.top + triggerRect.height / 2 - tooltipRect.height / 2;\n left = triggerRect.right + gap + arrowSize;\n arrowTop = '50%';\n arrowLeft = '-6px';\n arrowTransform = 'translateY(-50%) rotate(45deg)';\n break;\n }\n\n // Keep tooltip within viewport\n const viewportPadding = 8;\n if (left < viewportPadding) {\n left = viewportPadding;\n } else if (left + tooltipRect.width > window.innerWidth - viewportPadding) {\n left = window.innerWidth - tooltipRect.width - viewportPadding;\n }\n\n if (top < viewportPadding) {\n top = viewportPadding;\n } else if (top + tooltipRect.height > window.innerHeight - viewportPadding) {\n top = window.innerHeight - tooltipRect.height - viewportPadding;\n }\n\n this.tooltipStyle = {\n top: `${top}px`,\n left: `${left}px`,\n };\n\n this.arrowStyle = {\n top: arrowTop,\n left: arrowLeft,\n transform: arrowTransform,\n };\n }\n\n render() {\n return (\n <Host>\n <div\n class=\"tooltip-trigger\"\n ref={(el) => (this.triggerEl = el)}\n onClick={this.handleClick}\n >\n <slot name=\"trigger\" />\n </div>\n\n {this.open && (\n <div\n class={{\n 'tooltip': true,\n [`tooltip--${this.position}`]: true,\n }}\n style={this.tooltipStyle}\n ref={(el) => (this.tooltipEl = el)}\n role=\"tooltip\"\n >\n <div class=\"tooltip__content\">\n <slot>{this.content}</slot>\n </div>\n {this.arrow && (\n <div\n class=\"tooltip__arrow\"\n style={this.arrowStyle}\n />\n )}\n </div>\n )}\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"xplor-tooltip.js","sourceRoot":"","sources":["../../../src/components/xplor-tooltip/xplor-tooltip.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Element, Listen } from '@stencil/core';\n\nlet tooltipIdCounter = 0;\n\nexport type TooltipPosition = 'top' \| 'bottom' \| 'left' \| 'right';\nexport type TooltipTrigger = 'hover' \| 'click' \| 'manual';\n\n@Component({\n tag: 'xplor-tooltip',\n styleUrl: 'xplor-tooltip.scss',\n scoped: true,\n})\nexport class XplorTooltip {\n @Element() el: HTMLElement;\n\n @Prop() position: TooltipPosition = 'top';\n @Prop() trigger: TooltipTrigger = 'hover';\n @Prop() arrow: boolean = true;\n @Prop({ mutable: true }) open: boolean = false;\n @Prop() content: string;\n @Prop() disabled: boolean = false;\n\n @State() tooltipStyle: any = {};\n @State() arrowStyle: any = {};\n\n private tooltipId = `xplor-tooltip-${++tooltipIdCounter}`;\n\n private triggerEl: HTMLDivElement;\n private tooltipEl: HTMLDivElement;\n private hideTimeout: any;\n\n componentDidLoad() {\n if (this.trigger === 'hover') {\n this.setupHoverListeners();\n }\n }\n\n disconnectedCallback() {\n this.cleanupListeners();\n if (this.hideTimeout) {\n clearTimeout(this.hideTimeout);\n }\n }\n\n private setupHoverListeners() {\n if (this.triggerEl) {\n this.triggerEl.addEventListener('mouseenter', this.handleMouseEnter);\n this.triggerEl.addEventListener('mouseleave', this.handleMouseLeave);\n this.triggerEl.addEventListener('focusin', this.handleFocusIn);\n this.triggerEl.addEventListener('focusout', this.handleFocusOut);\n }\n }\n\n private cleanupListeners() {\n if (this.triggerEl) {\n this.triggerEl.removeEventListener('mouseenter', this.handleMouseEnter);\n this.triggerEl.removeEventListener('mouseleave', this.handleMouseLeave);\n this.triggerEl.removeEventListener('focusin', this.handleFocusIn);\n this.triggerEl.removeEventListener('focusout', this.handleFocusOut);\n }\n }\n\n private handleMouseEnter = () => {\n if (this.disabled) return;\n if (this.hideTimeout) {\n clearTimeout(this.hideTimeout);\n }\n this.showTooltip();\n };\n\n private handleMouseLeave = () => {\n if (this.disabled) return;\n this.hideTimeout = setTimeout(() => {\n this.hideTooltip();\n }, 100);\n };\n\n private handleFocusIn = () => {\n if (this.disabled) return;\n this.showTooltip();\n };\n\n private handleFocusOut = () => {\n if (this.disabled) return;\n this.hideTooltip();\n };\n\n private handleClick = () => {\n if (this.disabled) return;\n if (this.trigger === 'click') {\n this.open = !this.open;\n if (this.open) {\n requestAnimationFrame(() => this.updatePosition());\n }\n }\n };\n\n @Listen('click', { target: 'document' })\n handleDocumentClick(event: MouseEvent) {\n if (this.trigger === 'click' && this.open) {\n const target = event.target as Node;\n if (!this.el.contains(target)) {\n this.open = false;\n }\n }\n }\n\n private showTooltip() {\n this.open = true;\n requestAnimationFrame(() => this.updatePosition());\n }\n\n private hideTooltip() {\n this.open = false;\n }\n\n private updatePosition() {\n if (!this.triggerEl \|\| !this.tooltipEl) return;\n\n const triggerRect = this.triggerEl.getBoundingClientRect();\n const tooltipRect = this.tooltipEl.getBoundingClientRect();\n const gap = 8; // Space between trigger and tooltip\n const arrowSize = this.arrow ? 6 : 0;\n\n let top = 0;\n let left = 0;\n let arrowTop = '';\n let arrowLeft = '';\n let arrowTransform = '';\n\n switch (this.position) {\n case 'top':\n top = triggerRect.top - tooltipRect.height - gap - arrowSize;\n left = triggerRect.left + triggerRect.width / 2 - tooltipRect.width / 2;\n arrowTop = '100%';\n arrowLeft = '50%';\n arrowTransform = 'translateX(-50%) rotate(45deg)';\n break;\n\n case 'bottom':\n top = triggerRect.bottom + gap + arrowSize;\n left = triggerRect.left + triggerRect.width / 2 - tooltipRect.width / 2;\n arrowTop = '-6px';\n arrowLeft = '50%';\n arrowTransform = 'translateX(-50%) rotate(45deg)';\n break;\n\n case 'left':\n top = triggerRect.top + triggerRect.height / 2 - tooltipRect.height / 2;\n left = triggerRect.left - tooltipRect.width - gap - arrowSize;\n arrowTop = '50%';\n arrowLeft = '100%';\n arrowTransform = 'translateY(-50%) rotate(45deg)';\n break;\n\n case 'right':\n top = triggerRect.top + triggerRect.height / 2 - tooltipRect.height / 2;\n left = triggerRect.right + gap + arrowSize;\n arrowTop = '50%';\n arrowLeft = '-6px';\n arrowTransform = 'translateY(-50%) rotate(45deg)';\n break;\n }\n\n // Keep tooltip within viewport\n const viewportPadding = 8;\n if (left < viewportPadding) {\n left = viewportPadding;\n } else if (left + tooltipRect.width > window.innerWidth - viewportPadding) {\n left = window.innerWidth - tooltipRect.width - viewportPadding;\n }\n\n if (top < viewportPadding) {\n top = viewportPadding;\n } else if (top + tooltipRect.height > window.innerHeight - viewportPadding) {\n top = window.innerHeight - tooltipRect.height - viewportPadding;\n }\n\n this.tooltipStyle = {\n top: `${top}px`,\n left: `${left}px`,\n };\n\n this.arrowStyle = {\n top: arrowTop,\n left: arrowLeft,\n transform: arrowTransform,\n };\n }\n\n render() {\n return (\n <Host>\n <div\n class=\"tooltip-trigger\"\n ref={(el) => (this.triggerEl = el)}\n onClick={this.handleClick}\n aria-describedby={this.open ? this.tooltipId : undefined}\n >\n <slot name=\"trigger\" />\n </div>\n\n {this.open && (\n <div\n class={{\n 'tooltip': true,\n [`tooltip--${this.position}`]: true,\n }}\n style={this.tooltipStyle}\n ref={(el) => (this.tooltipEl = el)}\n role=\"tooltip\"\n id={this.tooltipId}\n >\n <div class=\"tooltip__content\">\n <slot>{this.content}</slot>\n </div>\n {this.arrow && (\n <div\n class=\"tooltip__arrow\"\n style={this.arrowStyle}\n />\n )}\n </div>\n )}\n </Host>\n );\n }\n}\n"]}

package/dist/components/index.js CHANGED Viewed

@@ -2316,7 +2316,7 @@ function render(vnode, container) {
   renderVdom(ref, vnode);
 }
-const globalStyles = "*,::before,::after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}*,::before,::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb;}::before,::after{--tw-content:''}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:Montserrat, ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;}body{margin:0;line-height:inherit;}hr{height:0;color:inherit;border-top-width:1px;}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse;}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0;}button,select{text-transform:none}button,input:where([type='button']),input:where([type='reset']),input:where([type='submit']){-webkit-appearance:button;background-color:transparent;background-image:none;}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type='search']{-webkit-appearance:textfield;outline-offset:-2px;}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af;}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af;}button,[role=\"button\"]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle;}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=\"until-found\"])){display:none}html[data-theme='office']{--color-primary:rgb(219, 59, 3);--color-secondary:rgb(0, 119, 107);--color-buttons:#89da59;--color-typography:#ff320e}html{--color-primary:#db3b03;--color-secondary:rgb(0, 119, 107);--color-buttons:#fbbc05;--color-typography:#ea4335}:root{--color-primary:#db3b03;--color-secondary:rgb(0, 119, 107);--color-tertiary:rgb(128, 104, 186);--color-white:white;--color-emphasis:rgb(8, 8, 9);--color-supergiant:rgb(213, 66, 99);--color-orange:rgb(250, 200, 127);--color-buttons:#fbbc05;--color-typography:#ea4335;--background:20 66% 99%;--foreground:20 51% 4%;--muted:20 25% 86%;--muted-foreground:20 7% 25%;--popover:20 66% 98%;--popover-foreground:20 51% 3%;--card:20 66% 98%;--card-foreground:20 51% 3%;--border:20 15% 94%;--input:20 15% 94%;--primary:20 48% 72%;--primary-foreground:20 48% 12%;--secondary:20 12% 92%;--secondary-foreground:20 12% 32%;--accent:20 12% 92%;--accent-foreground:20 12% 32%;--destructive:11 80% 22%;--destructive-foreground:11 80% 82%;--ring:20 48% 72%;--radius:0.5rem;--chart-1:12 76% 61%;--chart-2:173 58% 39%;--chart-3:197 37% 24%;--chart-4:43 74% 66%;--chart-5:27 87% 67%}.dark{--background:253 43% 3%;--foreground:253 31% 98%;--muted:253 7% 13%;--muted-foreground:253 13% 63%;--popover:253 43% 3%;--popover-foreground:253 31% 98%;--card:253 43% 4%;--card-foreground:253 31% 99%;--border:215 27.9% 16.9%;--input:215 27.9% 16.9%;--primary:253 91% 58%;--primary-foreground:253 91% 98%;--secondary:253 7% 9%;--secondary-foreground:253 7% 69%;--accent:253 13% 14%;--accent-foreground:253 13% 74%;--destructive:339.2 90.36% 51.18%;--destructive-foreground:0 0% 100%;--ring:253 91% 58%;--chart-1:220 70% 50%;--chart-2:160 60% 45%;--chart-3:30 80% 55%;--chart-4:280 65% 60%;--chart-5:340 75% 55%}*{border-color:hsl(var(--border))}body{box-sizing:border-box;background-color:hsl(var(--background));color:hsl(var(--foreground))}.container{width:100%}@media (min-width: 640px){.container{max-width:640px}}@media (min-width: 768px){.container{max-width:768px}}@media (min-width: 1024px){.container{max-width:1024px}}@media (min-width: 1280px){.container{max-width:1280px}}@media (min-width: 1536px){.container{max-width:1536px}}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.mx-auto{margin-left:auto;margin-right:auto}.mb-4{margin-bottom:0.25rem}.mb-6{margin-bottom:1.5rem}.mt-6{margin-top:1.5rem}.block{display:block}.inline{display:inline}.flex{display:flex}.table{display:table}.grid{display:grid}.contents{display:contents}.hidden{display:none}.size-16{width:1rem;height:1rem}.h-3{height:0.75rem}.h-4{height:0.25rem}.w-3{width:0.75rem}.w-4{width:0.25rem}.w-full{width:100%}.max-w-6xl{max-width:72rem}.max-w-7xl{max-width:80rem}.max-w-xl{max-width:36rem}.grow{flex-grow:1}.transform{transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.cursor-pointer{cursor:pointer}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:0.25rem}.gap-2{gap:0.5rem}.gap-20{gap:1.25rem}.gap-4{gap:0.25rem}.gap-x-6{-moz-column-gap:1.5rem;column-gap:1.5rem}.gap-x-8{-moz-column-gap:0.5rem;column-gap:0.5rem}.gap-y-12{row-gap:0.75rem}.overflow-x-auto{overflow-x:auto}.text-pretty{text-wrap:pretty}.rounded{border-radius:0.25rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:0.5rem}.rounded-md{border-radius:0.375rem}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-gray-100{--tw-border-opacity:1;border-color:rgb(243 244 246 / var(--tw-border-opacity, 1))}.border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1))}.border-gray-300{--tw-border-opacity:1;border-color:rgb(209 213 219 / var(--tw-border-opacity, 1))}.bg-black{--tw-bg-opacity:1;background-color:rgb(0 0 0 / var(--tw-bg-opacity, 1))}.bg-blue-500{--tw-bg-opacity:1;background-color:rgb(59 130 246 / var(--tw-bg-opacity, 1))}.bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.bg-teal-600{--tw-bg-opacity:1;background-color:rgb(13 148 136 / var(--tw-bg-opacity, 1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.p-1\\.5{padding:0.375rem}.p-2{padding:0.5rem}.p-6{padding:1.5rem}.px-2{padding-left:0.5rem;padding-right:0.5rem}.px-3{padding-left:0.75rem;padding-right:0.75rem}.px-4{padding-left:0.25rem;padding-right:0.25rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-1{padding-top:0.25rem;padding-bottom:0.25rem}.py-1\\.5{padding-top:0.375rem;padding-bottom:0.375rem}.py-24{padding-top:1.5rem;padding-bottom:1.5rem}.py-3{padding-top:0.75rem;padding-bottom:0.75rem}.text-left{text-align:left}.text-center{text-align:center}.font-sans{font-family:Montserrat, ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-base\\/7{font-size:1rem;line-height:1.75rem}.text-lg\\/8{font-size:1.125rem;line-height:2rem}.text-sm{font-size:0.875rem;line-height:1.25rem}.text-sm\\/6{font-size:0.875rem;line-height:1.5rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:0.75rem;line-height:1rem}.font-medium{font-weight:500}.font-semibold{font-weight:600}.tracking-tight{letter-spacing:-0.025em}.text-gray-400{--tw-text-opacity:1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}.text-gray-600{--tw-text-opacity:1;color:rgb(75 85 99 / var(--tw-text-opacity, 1))}.text-gray-700{--tw-text-opacity:1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}.text-gray-900{--tw-text-opacity:1;color:rgb(17 24 39 / var(--tw-text-opacity, 1))}.text-indigo-600{--tw-text-opacity:1;color:rgb(79 70 229 / var(--tw-text-opacity, 1))}.text-primary{color:var(--color-primary)}.text-teal-600{--tw-text-opacity:1;color:rgb(13 148 136 / var(--tw-text-opacity, 1))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgb(0 0 0 / 0.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.outline{outline-style:solid}.blur{--tw-blur:blur(8px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.transition-colors{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.theme-office{--color-black:#000000;--color-white:#ffffff;--color-primary:#db3b03;--color-secondary:#ec7702;--color-buttons:#89da59;--color-typography:#ff320e}.theme-pg{--color-primary:#00776b;--color-secondary:#01a39d;--color-buttons:#89da59;--color-typography:#ff320e}.hover\\:bg-gray-50:hover{--tw-bg-opacity:1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1))}.hover\\:bg-teal-50:hover{--tw-bg-opacity:1;background-color:rgb(240 253 250 / var(--tw-bg-opacity, 1))}.hover\\:bg-teal-700:hover{--tw-bg-opacity:1;background-color:rgb(15 118 110 / var(--tw-bg-opacity, 1))}.hover\\:text-gray-600:hover{--tw-text-opacity:1;color:rgb(75 85 99 / var(--tw-text-opacity, 1))}.hover\\:text-gray-800:hover{--tw-text-opacity:1;color:rgb(31 41 55 / var(--tw-text-opacity, 1))}.hover\\:text-gray-900:hover{--tw-text-opacity:1;color:rgb(17 24 39 / var(--tw-text-opacity, 1))}.hover\\:text-teal-800:hover{--tw-text-opacity:1;color:rgb(17 94 89 / var(--tw-text-opacity, 1))}.focus\\:border-teal-500:focus{--tw-border-opacity:1;border-color:rgb(20 184 166 / var(--tw-border-opacity, 1))}.focus\\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\\:ring-2:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000)}.focus\\:ring-teal-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(20 184 166 / var(--tw-ring-opacity, 1))}.disabled\\:opacity-50:disabled{opacity:0.5}@media (min-width: 640px){.sm\\:grid-cols-2{grid-template-columns:repeat(2, minmax(0, 1fr))}.sm\\:gap-y-16{row-gap:1rem}.sm\\:py-32{padding-top:2rem;padding-bottom:2rem}.sm\\:text-4xl{font-size:2.25rem;line-height:2.5rem}}@media (min-width: 1024px){.lg\\:px-8{padding-left:0.5rem;padding-right:0.5rem}}@media (min-width: 1280px){.xl\\:col-span-2{grid-column:span 2 / span 2}.xl\\:grid-cols-3{grid-template-columns:repeat(3, minmax(0, 1fr))}}";
+const globalStyles = "*,::before,::after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}*,::before,::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb;}::before,::after{--tw-content:''}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:Montserrat, ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;}body{margin:0;line-height:inherit;}hr{height:0;color:inherit;border-top-width:1px;}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse;}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0;}button,select{text-transform:none}button,input:where([type='button']),input:where([type='reset']),input:where([type='submit']){-webkit-appearance:button;background-color:transparent;background-image:none;}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type='search']{-webkit-appearance:textfield;outline-offset:-2px;}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af;}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af;}button,[role=\"button\"]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle;}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=\"until-found\"])){display:none}html[data-theme='office']{--color-primary:rgb(219, 59, 3);--color-secondary:rgb(0, 119, 107);--color-buttons:#89da59;--color-typography:#ff320e}html{--color-primary:#db3b03;--color-secondary:rgb(0, 119, 107);--color-buttons:#fbbc05;--color-typography:#ea4335}:root{--color-primary:#db3b03;--color-secondary:rgb(0, 119, 107);--color-tertiary:rgb(128, 104, 186);--color-white:white;--color-emphasis:rgb(8, 8, 9);--color-supergiant:rgb(213, 66, 99);--color-orange:rgb(250, 200, 127);--color-buttons:#fbbc05;--color-typography:#ea4335;--background:20 66% 99%;--foreground:20 51% 4%;--muted:20 25% 86%;--muted-foreground:20 7% 25%;--popover:20 66% 98%;--popover-foreground:20 51% 3%;--card:20 66% 98%;--card-foreground:20 51% 3%;--border:20 15% 94%;--input:20 15% 94%;--primary:20 48% 72%;--primary-foreground:20 48% 12%;--secondary:20 12% 92%;--secondary-foreground:20 12% 32%;--accent:20 12% 92%;--accent-foreground:20 12% 32%;--destructive:11 80% 22%;--destructive-foreground:11 80% 82%;--ring:20 48% 72%;--radius:0.5rem;--chart-1:12 76% 61%;--chart-2:173 58% 39%;--chart-3:197 37% 24%;--chart-4:43 74% 66%;--chart-5:27 87% 67%}.dark{--background:253 43% 3%;--foreground:253 31% 98%;--muted:253 7% 13%;--muted-foreground:253 13% 63%;--popover:253 43% 3%;--popover-foreground:253 31% 98%;--card:253 43% 4%;--card-foreground:253 31% 99%;--border:215 27.9% 16.9%;--input:215 27.9% 16.9%;--primary:253 91% 58%;--primary-foreground:253 91% 98%;--secondary:253 7% 9%;--secondary-foreground:253 7% 69%;--accent:253 13% 14%;--accent-foreground:253 13% 74%;--destructive:339.2 90.36% 51.18%;--destructive-foreground:0 0% 100%;--ring:253 91% 58%;--chart-1:220 70% 50%;--chart-2:160 60% 45%;--chart-3:30 80% 55%;--chart-4:280 65% 60%;--chart-5:340 75% 55%}*{border-color:hsl(var(--border))}body{box-sizing:border-box;background-color:hsl(var(--background));color:hsl(var(--foreground))}.container{width:100%}@media (min-width: 640px){.container{max-width:640px}}@media (min-width: 768px){.container{max-width:768px}}@media (min-width: 1024px){.container{max-width:1024px}}@media (min-width: 1280px){.container{max-width:1280px}}@media (min-width: 1536px){.container{max-width:1536px}}.visible{visibility:visible}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.mx-auto{margin-left:auto;margin-right:auto}.mb-4{margin-bottom:0.25rem}.mb-6{margin-bottom:1.5rem}.mt-6{margin-top:1.5rem}.block{display:block}.inline{display:inline}.flex{display:flex}.table{display:table}.grid{display:grid}.contents{display:contents}.hidden{display:none}.size-16{width:1rem;height:1rem}.h-3{height:0.75rem}.h-4{height:0.25rem}.w-3{width:0.75rem}.w-4{width:0.25rem}.w-full{width:100%}.max-w-6xl{max-width:72rem}.max-w-7xl{max-width:80rem}.max-w-xl{max-width:36rem}.grow{flex-grow:1}.transform{transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.cursor-pointer{cursor:pointer}.select-all{-webkit-user-select:all;-moz-user-select:all;user-select:all}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:0.25rem}.gap-2{gap:0.5rem}.gap-20{gap:1.25rem}.gap-4{gap:0.25rem}.gap-x-6{-moz-column-gap:1.5rem;column-gap:1.5rem}.gap-x-8{-moz-column-gap:0.5rem;column-gap:0.5rem}.gap-y-12{row-gap:0.75rem}.overflow-x-auto{overflow-x:auto}.text-pretty{text-wrap:pretty}.rounded{border-radius:0.25rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:0.5rem}.rounded-md{border-radius:0.375rem}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-gray-100{--tw-border-opacity:1;border-color:rgb(243 244 246 / var(--tw-border-opacity, 1))}.border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1))}.border-gray-300{--tw-border-opacity:1;border-color:rgb(209 213 219 / var(--tw-border-opacity, 1))}.bg-black{--tw-bg-opacity:1;background-color:rgb(0 0 0 / var(--tw-bg-opacity, 1))}.bg-blue-500{--tw-bg-opacity:1;background-color:rgb(59 130 246 / var(--tw-bg-opacity, 1))}.bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.bg-teal-600{--tw-bg-opacity:1;background-color:rgb(13 148 136 / var(--tw-bg-opacity, 1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.p-1\\.5{padding:0.375rem}.p-2{padding:0.5rem}.p-6{padding:1.5rem}.px-2{padding-left:0.5rem;padding-right:0.5rem}.px-3{padding-left:0.75rem;padding-right:0.75rem}.px-4{padding-left:0.25rem;padding-right:0.25rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-1{padding-top:0.25rem;padding-bottom:0.25rem}.py-1\\.5{padding-top:0.375rem;padding-bottom:0.375rem}.py-24{padding-top:1.5rem;padding-bottom:1.5rem}.py-3{padding-top:0.75rem;padding-bottom:0.75rem}.text-left{text-align:left}.text-center{text-align:center}.font-sans{font-family:Montserrat, ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-base\\/7{font-size:1rem;line-height:1.75rem}.text-lg\\/8{font-size:1.125rem;line-height:2rem}.text-sm{font-size:0.875rem;line-height:1.25rem}.text-sm\\/6{font-size:0.875rem;line-height:1.5rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:0.75rem;line-height:1rem}.font-medium{font-weight:500}.font-semibold{font-weight:600}.tracking-tight{letter-spacing:-0.025em}.text-gray-400{--tw-text-opacity:1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}.text-gray-600{--tw-text-opacity:1;color:rgb(75 85 99 / var(--tw-text-opacity, 1))}.text-gray-700{--tw-text-opacity:1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}.text-gray-900{--tw-text-opacity:1;color:rgb(17 24 39 / var(--tw-text-opacity, 1))}.text-indigo-600{--tw-text-opacity:1;color:rgb(79 70 229 / var(--tw-text-opacity, 1))}.text-primary{color:var(--color-primary)}.text-teal-600{--tw-text-opacity:1;color:rgb(13 148 136 / var(--tw-text-opacity, 1))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgb(0 0 0 / 0.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.outline{outline-style:solid}.blur{--tw-blur:blur(8px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.transition-colors{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.theme-office{--color-black:#000000;--color-white:#ffffff;--color-primary:#db3b03;--color-secondary:#ec7702;--color-buttons:#89da59;--color-typography:#ff320e}.theme-pg{--color-primary:#00776b;--color-secondary:#01a39d;--color-buttons:#89da59;--color-typography:#ff320e}.hover\\:bg-gray-50:hover{--tw-bg-opacity:1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1))}.hover\\:bg-teal-50:hover{--tw-bg-opacity:1;background-color:rgb(240 253 250 / var(--tw-bg-opacity, 1))}.hover\\:bg-teal-700:hover{--tw-bg-opacity:1;background-color:rgb(15 118 110 / var(--tw-bg-opacity, 1))}.hover\\:text-gray-600:hover{--tw-text-opacity:1;color:rgb(75 85 99 / var(--tw-text-opacity, 1))}.hover\\:text-gray-800:hover{--tw-text-opacity:1;color:rgb(31 41 55 / var(--tw-text-opacity, 1))}.hover\\:text-gray-900:hover{--tw-text-opacity:1;color:rgb(17 24 39 / var(--tw-text-opacity, 1))}.hover\\:text-teal-800:hover{--tw-text-opacity:1;color:rgb(17 94 89 / var(--tw-text-opacity, 1))}.focus\\:border-teal-500:focus{--tw-border-opacity:1;border-color:rgb(20 184 166 / var(--tw-border-opacity, 1))}.focus\\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\\:ring-2:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000)}.focus\\:ring-teal-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(20 184 166 / var(--tw-ring-opacity, 1))}.disabled\\:opacity-50:disabled{opacity:0.5}@media (min-width: 640px){.sm\\:grid-cols-2{grid-template-columns:repeat(2, minmax(0, 1fr))}.sm\\:gap-y-16{row-gap:1rem}.sm\\:py-32{padding-top:2rem;padding-bottom:2rem}.sm\\:text-4xl{font-size:2.25rem;line-height:2.5rem}}@media (min-width: 1024px){.lg\\:px-8{padding-left:0.5rem;padding-right:0.5rem}}@media (min-width: 1280px){.xl\\:col-span-2{grid-column:span 2 / span 2}.xl\\:grid-cols-3{grid-template-columns:repeat(3, minmax(0, 1fr))}}";
 export { H, Host as a, createEvent as c, getAssetPath, h, proxyCustomElement as p, render, setAssetPath, setNonce, setPlatformOptions };
 //# sourceMappingURL=index.js.map