@db-ux/wc-core-components 3.0.1 → 3.0.2
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.
- package/dist/cjs/db-tabs.cjs.entry.js +23 -18
- package/dist/cjs/db-tabs.cjs.entry.js.map +1 -1
- package/dist/cjs/db-tabs.entry.cjs.js.map +1 -1
- package/dist/collection/components/tabs/tabs.js +23 -18
- package/dist/collection/components/tabs/tabs.js.map +1 -1
- package/dist/db-ux/db-tabs.entry.esm.js.map +1 -1
- package/dist/db-ux/db-ux.esm.js +1 -1
- package/dist/db-ux/p-72330d25.entry.js +2 -0
- package/dist/db-ux/p-72330d25.entry.js.map +1 -0
- package/dist/esm/db-tabs.entry.js +23 -18
- package/dist/esm/db-tabs.entry.js.map +1 -1
- package/package.json +3 -3
- package/dist/db-ux/p-6c4115c8.entry.js +0 -2
- package/dist/db-ux/p-6c4115c8.entry.js.map +0 -1
|
@@ -102,24 +102,29 @@ const DBTabs = class {
|
|
|
102
102
|
}
|
|
103
103
|
}
|
|
104
104
|
handleChange(event) {
|
|
105
|
-
var _a
|
|
105
|
+
var _a;
|
|
106
106
|
event.stopPropagation();
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
107
|
+
if (event.target) {
|
|
108
|
+
const target = event.target;
|
|
109
|
+
const parent = target.parentElement;
|
|
110
|
+
if (parent &&
|
|
111
|
+
parent.parentElement &&
|
|
112
|
+
((_a = parent.parentElement) === null || _a === void 0 ? void 0 : _a.nodeName) === "LI") {
|
|
113
|
+
const tabItem = parent.parentElement.parentElement;
|
|
114
|
+
if (tabItem) {
|
|
115
|
+
const list = tabItem.parentElement;
|
|
116
|
+
if (list) {
|
|
117
|
+
const indices = Array.from(list.childNodes).indexOf(tabItem);
|
|
118
|
+
if (this.indexChange) {
|
|
119
|
+
this.indexChange.emit(indices);
|
|
120
|
+
}
|
|
121
|
+
if (this.tabSelect) {
|
|
122
|
+
this.tabSelect.emit(event);
|
|
123
|
+
}
|
|
124
|
+
}
|
|
125
|
+
}
|
|
118
126
|
}
|
|
119
127
|
}
|
|
120
|
-
if (this.tabSelect) {
|
|
121
|
-
this.tabSelect.emit(event);
|
|
122
|
-
}
|
|
123
128
|
}
|
|
124
129
|
/**
|
|
125
130
|
* Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.
|
|
@@ -187,10 +192,10 @@ const DBTabs = class {
|
|
|
187
192
|
}
|
|
188
193
|
render() {
|
|
189
194
|
var _a, _b, _c, _d;
|
|
190
|
-
return (index.h("div", { key: '
|
|
195
|
+
return (index.h("div", { key: 'f2927c65e3e2199780a8d5a8f5adc04dc48241e1', class: index$1.cls("db-tabs", this.className), ref: (el) => {
|
|
191
196
|
this._ref = el;
|
|
192
|
-
}, id: this._id, "data-orientation": this.orientation, "data-scroll-behavior": this.behavior, "data-alignment": (_a = this.alignment) !== null && _a !== void 0 ? _a : "start", "data-width": (_b = this.width) !== null && _b !== void 0 ? _b : "auto", onInput: (event) => this.handleChange(event) }, this.showScrollLeft ? (index.h("db-button", { class: "tabs-scroll-left", variant: "ghost", icon: "chevron_left", type: "button", noText: true, onClick: () => this.scroll(true) }, "Scroll left")) : null, this.tabs ? (index.h(index.Fragment, null, index.h("db-tab-list", null, (_c = this.convertTabs()) === null || _c === void 0 ? void 0 : _c.map((tab, index$1) => (index.h("db-tab-item", { key: this.name + "tab-item" + index$1, active: tab.active, label: tab.label, iconTrailing: tab.iconTrailing, icon: tab.icon, noText: tab.noText })))), (_d = this.convertTabs()) === null || _d === void 0 ? void 0 :
|
|
193
|
-
_d.map((tab, index$1) => (index.h("db-tab-panel", { key: this.name + "tab-panel" + index$1, content: tab.content }, tab.children))))) : null, this.showScrollRight ? (index.h("db-button", { class: "tabs-scroll-right", variant: "ghost", icon: "chevron_right", type: "button", noText: true, onClick: () => this.scroll() }, "Scroll right")) : null, index.h("slot", { key: '
|
|
197
|
+
}, id: this._id, "data-orientation": this.orientation, "data-scroll-behavior": this.behavior, "data-alignment": (_a = this.alignment) !== null && _a !== void 0 ? _a : "start", "data-width": (_b = this.width) !== null && _b !== void 0 ? _b : "auto", onInput: (event) => this.handleChange(event), onChange: (event) => this.handleChange(event) }, this.showScrollLeft ? (index.h("db-button", { class: "tabs-scroll-left", variant: "ghost", icon: "chevron_left", type: "button", noText: true, onClick: () => this.scroll(true) }, "Scroll left")) : null, this.tabs ? (index.h(index.Fragment, null, index.h("db-tab-list", null, (_c = this.convertTabs()) === null || _c === void 0 ? void 0 : _c.map((tab, index$1) => (index.h("db-tab-item", { key: this.name + "tab-item" + index$1, active: tab.active, label: tab.label, iconTrailing: tab.iconTrailing, icon: tab.icon, noText: tab.noText })))), (_d = this.convertTabs()) === null || _d === void 0 ? void 0 :
|
|
198
|
+
_d.map((tab, index$1) => (index.h("db-tab-panel", { key: this.name + "tab-panel" + index$1, content: tab.content }, tab.children))))) : null, this.showScrollRight ? (index.h("db-button", { class: "tabs-scroll-right", variant: "ghost", icon: "chevron_right", type: "button", noText: true, onClick: () => this.scroll() }, "Scroll right")) : null, index.h("slot", { key: 'e34a5daca2d4be08527f000f1c9f9d8d405d16dd' })));
|
|
194
199
|
}
|
|
195
200
|
static get watchers() { return {
|
|
196
201
|
"_ref": ["watch0"],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"db-tabs.entry.cjs.js","mappings":"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","names":["uuid","h","cls","Fragment","index"],"sources":["src/components/tabs/tabs.tsx"],"sourcesContent":["import { InputEvent } from \"../../shared/model\";\nimport { cls, uuid } from \"../../utils\";\nimport { DBButton } from \"../button/button\";\nimport { DBTabItem } from \"../tab-item/tab-item\";\nimport { DBTabList } from \"../tab-list/tab-list\";\nimport { DBTabPanel } from \"../tab-panel/tab-panel\";\nimport { DBSimpleTabProps, DBTabsProps, DBTabsState } from \"./model\";\n\nimport {\n Component,\n h,\n Fragment,\n Watch,\n Event,\n EventEmitter,\n Prop,\n State,\n} from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n tag: \"db-tabs\",\n})\nexport class DBTabs {\n private _ref!: HTMLDivElement | any;\n @Prop() id: DBTabsProps[\"id\"];\n @Prop() name: DBTabsProps[\"name\"];\n @Prop() tabs: DBTabsProps[\"tabs\"];\n @Prop() arrowScrollDistance: DBTabsProps[\"arrowScrollDistance\"];\n @Prop() orientation: DBTabsProps[\"orientation\"];\n @Prop() behavior: DBTabsProps[\"behavior\"];\n @Prop() initialSelectedMode: DBTabsProps[\"initialSelectedMode\"];\n @Prop() initialSelectedIndex: DBTabsProps[\"initialSelectedIndex\"];\n @Event() indexChange: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onIndexChange\"]>[number]\n > | void;\n @Event() tabSelect: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onTabSelect\"]>[number]\n > | void;\n @Prop({attribute: \"classname\"}) className: DBTabsProps[\"className\"];\n @Prop() alignment: DBTabsProps[\"alignment\"];\n @Prop() width: DBTabsProps[\"width\"];\n @State() _id = \"tabs-\" + uuid();\n @State() _name = \"\";\n @State() initialized = false;\n @State() showScrollLeft = false;\n @State() showScrollRight = false;\n @State() scrollContainer = null;\n\n convertTabs() {\n try {\n if (typeof this.tabs === \"string\") {\n return JSON.parse(this.tabs as string);\n }\n return this.tabs as DBSimpleTabProps[];\n } catch (error) {\n console.error(error);\n }\n return [];\n }\n evaluateScrollButtons(tList: Element) {\n const needsScroll = tList.scrollWidth > tList.clientWidth;\n this.showScrollLeft = needsScroll && tList.scrollLeft > 1;\n this.showScrollRight =\n needsScroll && tList.scrollLeft < tList.scrollWidth - tList.clientWidth;\n }\n scroll(left?: boolean) {\n let step = Number(this.arrowScrollDistance) || 100;\n if (left) {\n step *= -1;\n }\n this.scrollContainer?.scrollBy({\n top: 0,\n left: step,\n behavior: \"smooth\",\n });\n }\n initTabList() {\n if (this._ref) {\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const container: HTMLElement | null =\n tabList.querySelector('[role=\"tablist\"]');\n if (container) {\n container.setAttribute(\n \"aria-orientation\",\n this.orientation || \"horizontal\"\n );\n if (this.behavior === \"arrows\") {\n this.scrollContainer = container;\n this.evaluateScrollButtons(container);\n container.addEventListener(\"scroll\", () => {\n this.evaluateScrollButtons(container);\n });\n }\n }\n }\n }\n }\n initTabs(init?: boolean) {\n if (this._ref) {\n const tabItems = Array.from<Element>(\n this._ref.getElementsByClassName(\"db-tab-item\")\n );\n const tabPanels = Array.from<Element>(\n this._ref.querySelectorAll(\n \":is(:scope > .db-tab-panel, :scope > db-tab-panel > .db-tab-panel)\"\n )\n );\n for (const tabItem of tabItems) {\n const index: number = tabItems.indexOf(tabItem);\n const label = tabItem.querySelector(\"label\");\n const input = tabItem.querySelector(\"input\");\n if (input && label) {\n if (!input.id) {\n const tabId = `${this._name}-tab-${index}`;\n label.setAttribute(\"for\", tabId);\n input.id = tabId;\n input.setAttribute(\"name\", this._name);\n if (tabPanels.length > index) {\n input.setAttribute(\n \"aria-controls\",\n `${this._name}-tab-panel-${index}`\n );\n }\n }\n if (init) {\n // Auto select\n const autoSelect =\n !this.initialSelectedMode || this.initialSelectedMode === \"auto\";\n const shouldAutoSelect =\n (this.initialSelectedIndex == null && index === 0) ||\n Number(this.initialSelectedIndex) === index;\n if (autoSelect && shouldAutoSelect) {\n input.click();\n }\n }\n }\n }\n for (const panel of tabPanels) {\n if (panel.id) continue;\n const index: number = tabPanels.indexOf(panel);\n panel.id = `${this._name}-tab-panel-${index}`;\n panel.setAttribute(\"aria-labelledby\", `${this._name}-tab-${index}`);\n }\n }\n }\n handleChange(event: InputEvent<HTMLElement>) {\n event.stopPropagation();\n const closest: ((element: string) => HTMLElement | null) | undefined = (\n event.target as any\n )?.closest;\n if (!closest) return;\n const list = closest(\"ul\");\n const listItem =\n // db-tab-item for angular and stencil wrapping elements\n closest(\"db-tab-item\") ?? closest(\"li\");\n if (list !== null && listItem !== null) {\n const indices = Array.from(list.childNodes).indexOf(listItem);\n if (this.indexChange) {\n this.indexChange.emit(indices);\n }\n }\n if (this.tabSelect) {\n this.tabSelect.emit(event);\n }\n }\n\n /**\n * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n * @param element the ref for the component\n * @param customElementSelector the custom element like `my-component`\n */\n private enableAttributePassing(\n element: HTMLElement | null,\n customElementSelector: string\n ) {\n const parent = element?.closest(customElementSelector);\n if (element && parent) {\n const attributes = parent.attributes;\n for (let i = 0; i < attributes.length; i++) {\n const attr = attributes.item(i);\n if (\n attr &&\n (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n ) {\n element.setAttribute(attr.name, attr.value);\n parent.removeAttribute(attr.name);\n }\n if (attr && attr.name === \"class\") {\n const isWebComponent = attr.value.includes(\"hydrated\");\n const value = attr.value.replace(\"hydrated\", \"\").trim();\n const currentClass = element.getAttribute(\"class\");\n element.setAttribute(\n attr.name,\n `${currentClass ? `${currentClass} ` : \"\"}${value}`\n );\n if (isWebComponent) {\n // Stencil is using this class for lazy loading component\n parent.setAttribute(\"class\", \"hydrated\");\n } else {\n parent.removeAttribute(attr.name);\n }\n }\n }\n }\n }\n\n watch0Fn() {\n if (this._ref && this.initialized) {\n this.initTabList();\n this.initTabs(true);\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const observer = new MutationObserver((mutations) => {\n mutations.forEach((mutation) => {\n if (mutation.removedNodes.length || mutation.addedNodes.length) {\n this.initTabList();\n this.initTabs();\n }\n });\n });\n observer.observe(tabList, {\n childList: true,\n subtree: true,\n });\n }\n this.initialized = false;\n }\n }\n\n @Watch(\"_ref\")\n @Watch(\"initialized\")\n watch0() {\n this.watch0Fn();\n }\n\n componentDidLoad() {\n this.enableAttributePassing(this._ref, \"db-tabs\");\n this._id = this.id || this._id;\n this._name = `tabs-${this.name || uuid()}`;\n this.initialized = true;\n this.watch0Fn();\n }\n\n render() {\n return (\n <div\n class={cls(\"db-tabs\", this.className)}\n ref={(el: any) => {\n this._ref = el;\n }}\n id={this._id}\n data-orientation={this.orientation}\n data-scroll-behavior={this.behavior}\n data-alignment={this.alignment ?? \"start\"}\n data-width={this.width ?? \"auto\"}\n onInput={(event) => this.handleChange(event)}\n >\n {this.showScrollLeft ? (\n <db-button\n class=\"tabs-scroll-left\"\n variant=\"ghost\"\n icon=\"chevron_left\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll(true)}\n >\n Scroll left\n </db-button>\n ) : null}\n {this.tabs ? (\n <Fragment>\n <db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-item\n key={this.name + \"tab-item\" + index}\n active={tab.active}\n label={tab.label}\n iconTrailing={tab.iconTrailing}\n icon={tab.icon}\n noText={tab.noText}\n ></db-tab-item>\n ))}\n </db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-panel\n key={this.name + \"tab-panel\" + index}\n content={tab.content}\n >\n {tab.children}\n </db-tab-panel>\n ))}\n </Fragment>\n ) : null}\n {this.showScrollRight ? (\n <db-button\n class=\"tabs-scroll-right\"\n variant=\"ghost\"\n icon=\"chevron_right\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll()}\n >\n Scroll right\n </db-button>\n ) : null}\n <slot></slot>\n </div>\n );\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"db-tabs.entry.cjs.js","mappings":"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","names":["uuid","h","cls","Fragment","index"],"sources":["src/components/tabs/tabs.tsx"],"sourcesContent":["import { InputEvent } from \"../../shared/model\";\nimport { cls, uuid } from \"../../utils\";\nimport { DBButton } from \"../button/button\";\nimport { DBTabItem } from \"../tab-item/tab-item\";\nimport { DBTabList } from \"../tab-list/tab-list\";\nimport { DBTabPanel } from \"../tab-panel/tab-panel\";\nimport { DBSimpleTabProps, DBTabsProps, DBTabsState } from \"./model\";\n\nimport {\n Component,\n h,\n Fragment,\n Watch,\n Event,\n EventEmitter,\n Prop,\n State,\n} from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n tag: \"db-tabs\",\n})\nexport class DBTabs {\n private _ref!: HTMLDivElement | any;\n @Prop() id: DBTabsProps[\"id\"];\n @Prop() name: DBTabsProps[\"name\"];\n @Prop() tabs: DBTabsProps[\"tabs\"];\n @Prop() arrowScrollDistance: DBTabsProps[\"arrowScrollDistance\"];\n @Prop() orientation: DBTabsProps[\"orientation\"];\n @Prop() behavior: DBTabsProps[\"behavior\"];\n @Prop() initialSelectedMode: DBTabsProps[\"initialSelectedMode\"];\n @Prop() initialSelectedIndex: DBTabsProps[\"initialSelectedIndex\"];\n @Event() indexChange: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onIndexChange\"]>[number]\n > | void;\n @Event() tabSelect: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onTabSelect\"]>[number]\n > | void;\n @Prop({attribute: \"classname\"}) className: DBTabsProps[\"className\"];\n @Prop() alignment: DBTabsProps[\"alignment\"];\n @Prop() width: DBTabsProps[\"width\"];\n @State() _id = \"tabs-\" + uuid();\n @State() _name = \"\";\n @State() initialized = false;\n @State() showScrollLeft = false;\n @State() showScrollRight = false;\n @State() scrollContainer = null;\n\n convertTabs() {\n try {\n if (typeof this.tabs === \"string\") {\n return JSON.parse(this.tabs as string);\n }\n return this.tabs as DBSimpleTabProps[];\n } catch (error) {\n console.error(error);\n }\n return [];\n }\n evaluateScrollButtons(tList: Element) {\n const needsScroll = tList.scrollWidth > tList.clientWidth;\n this.showScrollLeft = needsScroll && tList.scrollLeft > 1;\n this.showScrollRight =\n needsScroll && tList.scrollLeft < tList.scrollWidth - tList.clientWidth;\n }\n scroll(left?: boolean) {\n let step = Number(this.arrowScrollDistance) || 100;\n if (left) {\n step *= -1;\n }\n this.scrollContainer?.scrollBy({\n top: 0,\n left: step,\n behavior: \"smooth\",\n });\n }\n initTabList() {\n if (this._ref) {\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const container: HTMLElement | null =\n tabList.querySelector('[role=\"tablist\"]');\n if (container) {\n container.setAttribute(\n \"aria-orientation\",\n this.orientation || \"horizontal\"\n );\n if (this.behavior === \"arrows\") {\n this.scrollContainer = container;\n this.evaluateScrollButtons(container);\n container.addEventListener(\"scroll\", () => {\n this.evaluateScrollButtons(container);\n });\n }\n }\n }\n }\n }\n initTabs(init?: boolean) {\n if (this._ref) {\n const tabItems = Array.from<Element>(\n this._ref.getElementsByClassName(\"db-tab-item\")\n );\n const tabPanels = Array.from<Element>(\n this._ref.querySelectorAll(\n \":is(:scope > .db-tab-panel, :scope > db-tab-panel > .db-tab-panel)\"\n )\n );\n for (const tabItem of tabItems) {\n const index: number = tabItems.indexOf(tabItem);\n const label = tabItem.querySelector(\"label\");\n const input = tabItem.querySelector(\"input\");\n if (input && label) {\n if (!input.id) {\n const tabId = `${this._name}-tab-${index}`;\n label.setAttribute(\"for\", tabId);\n input.id = tabId;\n input.setAttribute(\"name\", this._name);\n if (tabPanels.length > index) {\n input.setAttribute(\n \"aria-controls\",\n `${this._name}-tab-panel-${index}`\n );\n }\n }\n if (init) {\n // Auto select\n const autoSelect =\n !this.initialSelectedMode || this.initialSelectedMode === \"auto\";\n const shouldAutoSelect =\n (this.initialSelectedIndex == null && index === 0) ||\n Number(this.initialSelectedIndex) === index;\n if (autoSelect && shouldAutoSelect) {\n input.click();\n }\n }\n }\n }\n for (const panel of tabPanels) {\n if (panel.id) continue;\n const index: number = tabPanels.indexOf(panel);\n panel.id = `${this._name}-tab-panel-${index}`;\n panel.setAttribute(\"aria-labelledby\", `${this._name}-tab-${index}`);\n }\n }\n }\n handleChange(event: InputEvent<HTMLElement>) {\n event.stopPropagation();\n if (event.target) {\n const target = event.target as HTMLElement;\n const parent = target.parentElement;\n if (\n parent &&\n parent.parentElement &&\n parent.parentElement?.nodeName === \"LI\"\n ) {\n const tabItem = parent.parentElement.parentElement;\n if (tabItem) {\n const list = tabItem.parentElement;\n if (list) {\n const indices = Array.from(list.childNodes).indexOf(tabItem);\n if (this.indexChange) {\n this.indexChange.emit(indices);\n }\n if (this.tabSelect) {\n this.tabSelect.emit(event);\n }\n }\n }\n }\n }\n }\n\n /**\n * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n * @param element the ref for the component\n * @param customElementSelector the custom element like `my-component`\n */\n private enableAttributePassing(\n element: HTMLElement | null,\n customElementSelector: string\n ) {\n const parent = element?.closest(customElementSelector);\n if (element && parent) {\n const attributes = parent.attributes;\n for (let i = 0; i < attributes.length; i++) {\n const attr = attributes.item(i);\n if (\n attr &&\n (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n ) {\n element.setAttribute(attr.name, attr.value);\n parent.removeAttribute(attr.name);\n }\n if (attr && attr.name === \"class\") {\n const isWebComponent = attr.value.includes(\"hydrated\");\n const value = attr.value.replace(\"hydrated\", \"\").trim();\n const currentClass = element.getAttribute(\"class\");\n element.setAttribute(\n attr.name,\n `${currentClass ? `${currentClass} ` : \"\"}${value}`\n );\n if (isWebComponent) {\n // Stencil is using this class for lazy loading component\n parent.setAttribute(\"class\", \"hydrated\");\n } else {\n parent.removeAttribute(attr.name);\n }\n }\n }\n }\n }\n\n watch0Fn() {\n if (this._ref && this.initialized) {\n this.initTabList();\n this.initTabs(true);\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const observer = new MutationObserver((mutations) => {\n mutations.forEach((mutation) => {\n if (mutation.removedNodes.length || mutation.addedNodes.length) {\n this.initTabList();\n this.initTabs();\n }\n });\n });\n observer.observe(tabList, {\n childList: true,\n subtree: true,\n });\n }\n this.initialized = false;\n }\n }\n\n @Watch(\"_ref\")\n @Watch(\"initialized\")\n watch0() {\n this.watch0Fn();\n }\n\n componentDidLoad() {\n this.enableAttributePassing(this._ref, \"db-tabs\");\n this._id = this.id || this._id;\n this._name = `tabs-${this.name || uuid()}`;\n this.initialized = true;\n this.watch0Fn();\n }\n\n render() {\n return (\n <div\n class={cls(\"db-tabs\", this.className)}\n ref={(el: any) => {\n this._ref = el;\n }}\n id={this._id}\n data-orientation={this.orientation}\n data-scroll-behavior={this.behavior}\n data-alignment={this.alignment ?? \"start\"}\n data-width={this.width ?? \"auto\"}\n onInput={(event) => this.handleChange(event)}\n onChange={(event) => this.handleChange(event)}\n >\n {this.showScrollLeft ? (\n <db-button\n class=\"tabs-scroll-left\"\n variant=\"ghost\"\n icon=\"chevron_left\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll(true)}\n >\n Scroll left\n </db-button>\n ) : null}\n {this.tabs ? (\n <Fragment>\n <db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-item\n key={this.name + \"tab-item\" + index}\n active={tab.active}\n label={tab.label}\n iconTrailing={tab.iconTrailing}\n icon={tab.icon}\n noText={tab.noText}\n ></db-tab-item>\n ))}\n </db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-panel\n key={this.name + \"tab-panel\" + index}\n content={tab.content}\n >\n {tab.children}\n </db-tab-panel>\n ))}\n </Fragment>\n ) : null}\n {this.showScrollRight ? (\n <db-button\n class=\"tabs-scroll-right\"\n variant=\"ghost\"\n icon=\"chevron_right\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll()}\n >\n Scroll right\n </db-button>\n ) : null}\n <slot></slot>\n </div>\n );\n }\n}\n"],"version":3}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"db-tabs.entry.cjs.js","sources":["src/components/tabs/tabs.tsx"],"sourcesContent":["import { InputEvent } from \"../../shared/model\";\nimport { cls, uuid } from \"../../utils\";\nimport { DBButton } from \"../button/button\";\nimport { DBTabItem } from \"../tab-item/tab-item\";\nimport { DBTabList } from \"../tab-list/tab-list\";\nimport { DBTabPanel } from \"../tab-panel/tab-panel\";\nimport { DBSimpleTabProps, DBTabsProps, DBTabsState } from \"./model\";\n\nimport {\n Component,\n h,\n Fragment,\n Watch,\n Event,\n EventEmitter,\n Prop,\n State,\n} from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n tag: \"db-tabs\",\n})\nexport class DBTabs {\n private _ref!: HTMLDivElement | any;\n @Prop() id: DBTabsProps[\"id\"];\n @Prop() name: DBTabsProps[\"name\"];\n @Prop() tabs: DBTabsProps[\"tabs\"];\n @Prop() arrowScrollDistance: DBTabsProps[\"arrowScrollDistance\"];\n @Prop() orientation: DBTabsProps[\"orientation\"];\n @Prop() behavior: DBTabsProps[\"behavior\"];\n @Prop() initialSelectedMode: DBTabsProps[\"initialSelectedMode\"];\n @Prop() initialSelectedIndex: DBTabsProps[\"initialSelectedIndex\"];\n @Event() indexChange: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onIndexChange\"]>[number]\n > | void;\n @Event() tabSelect: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onTabSelect\"]>[number]\n > | void;\n @Prop({attribute: \"classname\"}) className: DBTabsProps[\"className\"];\n @Prop() alignment: DBTabsProps[\"alignment\"];\n @Prop() width: DBTabsProps[\"width\"];\n @State() _id = \"tabs-\" + uuid();\n @State() _name = \"\";\n @State() initialized = false;\n @State() showScrollLeft = false;\n @State() showScrollRight = false;\n @State() scrollContainer = null;\n\n convertTabs() {\n try {\n if (typeof this.tabs === \"string\") {\n return JSON.parse(this.tabs as string);\n }\n return this.tabs as DBSimpleTabProps[];\n } catch (error) {\n console.error(error);\n }\n return [];\n }\n evaluateScrollButtons(tList: Element) {\n const needsScroll = tList.scrollWidth > tList.clientWidth;\n this.showScrollLeft = needsScroll && tList.scrollLeft > 1;\n this.showScrollRight =\n needsScroll && tList.scrollLeft < tList.scrollWidth - tList.clientWidth;\n }\n scroll(left?: boolean) {\n let step = Number(this.arrowScrollDistance) || 100;\n if (left) {\n step *= -1;\n }\n this.scrollContainer?.scrollBy({\n top: 0,\n left: step,\n behavior: \"smooth\",\n });\n }\n initTabList() {\n if (this._ref) {\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const container: HTMLElement | null =\n tabList.querySelector('[role=\"tablist\"]');\n if (container) {\n container.setAttribute(\n \"aria-orientation\",\n this.orientation || \"horizontal\"\n );\n if (this.behavior === \"arrows\") {\n this.scrollContainer = container;\n this.evaluateScrollButtons(container);\n container.addEventListener(\"scroll\", () => {\n this.evaluateScrollButtons(container);\n });\n }\n }\n }\n }\n }\n initTabs(init?: boolean) {\n if (this._ref) {\n const tabItems = Array.from<Element>(\n this._ref.getElementsByClassName(\"db-tab-item\")\n );\n const tabPanels = Array.from<Element>(\n this._ref.querySelectorAll(\n \":is(:scope > .db-tab-panel, :scope > db-tab-panel > .db-tab-panel)\"\n )\n );\n for (const tabItem of tabItems) {\n const index: number = tabItems.indexOf(tabItem);\n const label = tabItem.querySelector(\"label\");\n const input = tabItem.querySelector(\"input\");\n if (input && label) {\n if (!input.id) {\n const tabId = `${this._name}-tab-${index}`;\n label.setAttribute(\"for\", tabId);\n input.id = tabId;\n input.setAttribute(\"name\", this._name);\n if (tabPanels.length > index) {\n input.setAttribute(\n \"aria-controls\",\n `${this._name}-tab-panel-${index}`\n );\n }\n }\n if (init) {\n // Auto select\n const autoSelect =\n !this.initialSelectedMode || this.initialSelectedMode === \"auto\";\n const shouldAutoSelect =\n (this.initialSelectedIndex == null && index === 0) ||\n Number(this.initialSelectedIndex) === index;\n if (autoSelect && shouldAutoSelect) {\n input.click();\n }\n }\n }\n }\n for (const panel of tabPanels) {\n if (panel.id) continue;\n const index: number = tabPanels.indexOf(panel);\n panel.id = `${this._name}-tab-panel-${index}`;\n panel.setAttribute(\"aria-labelledby\", `${this._name}-tab-${index}`);\n }\n }\n }\n handleChange(event: InputEvent<HTMLElement>) {\n event.stopPropagation();\n const closest: ((element: string) => HTMLElement | null) | undefined = (\n event.target as any\n )?.closest;\n if (!closest) return;\n const list = closest(\"ul\");\n const listItem =\n // db-tab-item for angular and stencil wrapping elements\n closest(\"db-tab-item\") ?? closest(\"li\");\n if (list !== null && listItem !== null) {\n const indices = Array.from(list.childNodes).indexOf(listItem);\n if (this.indexChange) {\n this.indexChange.emit(indices);\n }\n }\n if (this.tabSelect) {\n this.tabSelect.emit(event);\n }\n }\n\n /**\n * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n * @param element the ref for the component\n * @param customElementSelector the custom element like `my-component`\n */\n private enableAttributePassing(\n element: HTMLElement | null,\n customElementSelector: string\n ) {\n const parent = element?.closest(customElementSelector);\n if (element && parent) {\n const attributes = parent.attributes;\n for (let i = 0; i < attributes.length; i++) {\n const attr = attributes.item(i);\n if (\n attr &&\n (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n ) {\n element.setAttribute(attr.name, attr.value);\n parent.removeAttribute(attr.name);\n }\n if (attr && attr.name === \"class\") {\n const isWebComponent = attr.value.includes(\"hydrated\");\n const value = attr.value.replace(\"hydrated\", \"\").trim();\n const currentClass = element.getAttribute(\"class\");\n element.setAttribute(\n attr.name,\n `${currentClass ? `${currentClass} ` : \"\"}${value}`\n );\n if (isWebComponent) {\n // Stencil is using this class for lazy loading component\n parent.setAttribute(\"class\", \"hydrated\");\n } else {\n parent.removeAttribute(attr.name);\n }\n }\n }\n }\n }\n\n watch0Fn() {\n if (this._ref && this.initialized) {\n this.initTabList();\n this.initTabs(true);\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const observer = new MutationObserver((mutations) => {\n mutations.forEach((mutation) => {\n if (mutation.removedNodes.length || mutation.addedNodes.length) {\n this.initTabList();\n this.initTabs();\n }\n });\n });\n observer.observe(tabList, {\n childList: true,\n subtree: true,\n });\n }\n this.initialized = false;\n }\n }\n\n @Watch(\"_ref\")\n @Watch(\"initialized\")\n watch0() {\n this.watch0Fn();\n }\n\n componentDidLoad() {\n this.enableAttributePassing(this._ref, \"db-tabs\");\n this._id = this.id || this._id;\n this._name = `tabs-${this.name || uuid()}`;\n this.initialized = true;\n this.watch0Fn();\n }\n\n render() {\n return (\n <div\n class={cls(\"db-tabs\", this.className)}\n ref={(el: any) => {\n this._ref = el;\n }}\n id={this._id}\n data-orientation={this.orientation}\n data-scroll-behavior={this.behavior}\n data-alignment={this.alignment ?? \"start\"}\n data-width={this.width ?? \"auto\"}\n onInput={(event) => this.handleChange(event)}\n >\n {this.showScrollLeft ? (\n <db-button\n class=\"tabs-scroll-left\"\n variant=\"ghost\"\n icon=\"chevron_left\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll(true)}\n >\n Scroll left\n </db-button>\n ) : null}\n {this.tabs ? (\n <Fragment>\n <db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-item\n key={this.name + \"tab-item\" + index}\n active={tab.active}\n label={tab.label}\n iconTrailing={tab.iconTrailing}\n icon={tab.icon}\n noText={tab.noText}\n ></db-tab-item>\n ))}\n </db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-panel\n key={this.name + \"tab-panel\" + index}\n content={tab.content}\n >\n {tab.children}\n </db-tab-panel>\n ))}\n </Fragment>\n ) : null}\n {this.showScrollRight ? (\n <db-button\n class=\"tabs-scroll-right\"\n variant=\"ghost\"\n icon=\"chevron_right\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll()}\n >\n Scroll right\n </db-button>\n ) : null}\n <slot></slot>\n </div>\n );\n }\n}\n"],"names":["uuid","h","cls","Fragment","index"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"db-tabs.entry.cjs.js","sources":["src/components/tabs/tabs.tsx"],"sourcesContent":["import { InputEvent } from \"../../shared/model\";\nimport { cls, uuid } from \"../../utils\";\nimport { DBButton } from \"../button/button\";\nimport { DBTabItem } from \"../tab-item/tab-item\";\nimport { DBTabList } from \"../tab-list/tab-list\";\nimport { DBTabPanel } from \"../tab-panel/tab-panel\";\nimport { DBSimpleTabProps, DBTabsProps, DBTabsState } from \"./model\";\n\nimport {\n Component,\n h,\n Fragment,\n Watch,\n Event,\n EventEmitter,\n Prop,\n State,\n} from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n tag: \"db-tabs\",\n})\nexport class DBTabs {\n private _ref!: HTMLDivElement | any;\n @Prop() id: DBTabsProps[\"id\"];\n @Prop() name: DBTabsProps[\"name\"];\n @Prop() tabs: DBTabsProps[\"tabs\"];\n @Prop() arrowScrollDistance: DBTabsProps[\"arrowScrollDistance\"];\n @Prop() orientation: DBTabsProps[\"orientation\"];\n @Prop() behavior: DBTabsProps[\"behavior\"];\n @Prop() initialSelectedMode: DBTabsProps[\"initialSelectedMode\"];\n @Prop() initialSelectedIndex: DBTabsProps[\"initialSelectedIndex\"];\n @Event() indexChange: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onIndexChange\"]>[number]\n > | void;\n @Event() tabSelect: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onTabSelect\"]>[number]\n > | void;\n @Prop({attribute: \"classname\"}) className: DBTabsProps[\"className\"];\n @Prop() alignment: DBTabsProps[\"alignment\"];\n @Prop() width: DBTabsProps[\"width\"];\n @State() _id = \"tabs-\" + uuid();\n @State() _name = \"\";\n @State() initialized = false;\n @State() showScrollLeft = false;\n @State() showScrollRight = false;\n @State() scrollContainer = null;\n\n convertTabs() {\n try {\n if (typeof this.tabs === \"string\") {\n return JSON.parse(this.tabs as string);\n }\n return this.tabs as DBSimpleTabProps[];\n } catch (error) {\n console.error(error);\n }\n return [];\n }\n evaluateScrollButtons(tList: Element) {\n const needsScroll = tList.scrollWidth > tList.clientWidth;\n this.showScrollLeft = needsScroll && tList.scrollLeft > 1;\n this.showScrollRight =\n needsScroll && tList.scrollLeft < tList.scrollWidth - tList.clientWidth;\n }\n scroll(left?: boolean) {\n let step = Number(this.arrowScrollDistance) || 100;\n if (left) {\n step *= -1;\n }\n this.scrollContainer?.scrollBy({\n top: 0,\n left: step,\n behavior: \"smooth\",\n });\n }\n initTabList() {\n if (this._ref) {\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const container: HTMLElement | null =\n tabList.querySelector('[role=\"tablist\"]');\n if (container) {\n container.setAttribute(\n \"aria-orientation\",\n this.orientation || \"horizontal\"\n );\n if (this.behavior === \"arrows\") {\n this.scrollContainer = container;\n this.evaluateScrollButtons(container);\n container.addEventListener(\"scroll\", () => {\n this.evaluateScrollButtons(container);\n });\n }\n }\n }\n }\n }\n initTabs(init?: boolean) {\n if (this._ref) {\n const tabItems = Array.from<Element>(\n this._ref.getElementsByClassName(\"db-tab-item\")\n );\n const tabPanels = Array.from<Element>(\n this._ref.querySelectorAll(\n \":is(:scope > .db-tab-panel, :scope > db-tab-panel > .db-tab-panel)\"\n )\n );\n for (const tabItem of tabItems) {\n const index: number = tabItems.indexOf(tabItem);\n const label = tabItem.querySelector(\"label\");\n const input = tabItem.querySelector(\"input\");\n if (input && label) {\n if (!input.id) {\n const tabId = `${this._name}-tab-${index}`;\n label.setAttribute(\"for\", tabId);\n input.id = tabId;\n input.setAttribute(\"name\", this._name);\n if (tabPanels.length > index) {\n input.setAttribute(\n \"aria-controls\",\n `${this._name}-tab-panel-${index}`\n );\n }\n }\n if (init) {\n // Auto select\n const autoSelect =\n !this.initialSelectedMode || this.initialSelectedMode === \"auto\";\n const shouldAutoSelect =\n (this.initialSelectedIndex == null && index === 0) ||\n Number(this.initialSelectedIndex) === index;\n if (autoSelect && shouldAutoSelect) {\n input.click();\n }\n }\n }\n }\n for (const panel of tabPanels) {\n if (panel.id) continue;\n const index: number = tabPanels.indexOf(panel);\n panel.id = `${this._name}-tab-panel-${index}`;\n panel.setAttribute(\"aria-labelledby\", `${this._name}-tab-${index}`);\n }\n }\n }\n handleChange(event: InputEvent<HTMLElement>) {\n event.stopPropagation();\n if (event.target) {\n const target = event.target as HTMLElement;\n const parent = target.parentElement;\n if (\n parent &&\n parent.parentElement &&\n parent.parentElement?.nodeName === \"LI\"\n ) {\n const tabItem = parent.parentElement.parentElement;\n if (tabItem) {\n const list = tabItem.parentElement;\n if (list) {\n const indices = Array.from(list.childNodes).indexOf(tabItem);\n if (this.indexChange) {\n this.indexChange.emit(indices);\n }\n if (this.tabSelect) {\n this.tabSelect.emit(event);\n }\n }\n }\n }\n }\n }\n\n /**\n * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n * @param element the ref for the component\n * @param customElementSelector the custom element like `my-component`\n */\n private enableAttributePassing(\n element: HTMLElement | null,\n customElementSelector: string\n ) {\n const parent = element?.closest(customElementSelector);\n if (element && parent) {\n const attributes = parent.attributes;\n for (let i = 0; i < attributes.length; i++) {\n const attr = attributes.item(i);\n if (\n attr &&\n (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n ) {\n element.setAttribute(attr.name, attr.value);\n parent.removeAttribute(attr.name);\n }\n if (attr && attr.name === \"class\") {\n const isWebComponent = attr.value.includes(\"hydrated\");\n const value = attr.value.replace(\"hydrated\", \"\").trim();\n const currentClass = element.getAttribute(\"class\");\n element.setAttribute(\n attr.name,\n `${currentClass ? `${currentClass} ` : \"\"}${value}`\n );\n if (isWebComponent) {\n // Stencil is using this class for lazy loading component\n parent.setAttribute(\"class\", \"hydrated\");\n } else {\n parent.removeAttribute(attr.name);\n }\n }\n }\n }\n }\n\n watch0Fn() {\n if (this._ref && this.initialized) {\n this.initTabList();\n this.initTabs(true);\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const observer = new MutationObserver((mutations) => {\n mutations.forEach((mutation) => {\n if (mutation.removedNodes.length || mutation.addedNodes.length) {\n this.initTabList();\n this.initTabs();\n }\n });\n });\n observer.observe(tabList, {\n childList: true,\n subtree: true,\n });\n }\n this.initialized = false;\n }\n }\n\n @Watch(\"_ref\")\n @Watch(\"initialized\")\n watch0() {\n this.watch0Fn();\n }\n\n componentDidLoad() {\n this.enableAttributePassing(this._ref, \"db-tabs\");\n this._id = this.id || this._id;\n this._name = `tabs-${this.name || uuid()}`;\n this.initialized = true;\n this.watch0Fn();\n }\n\n render() {\n return (\n <div\n class={cls(\"db-tabs\", this.className)}\n ref={(el: any) => {\n this._ref = el;\n }}\n id={this._id}\n data-orientation={this.orientation}\n data-scroll-behavior={this.behavior}\n data-alignment={this.alignment ?? \"start\"}\n data-width={this.width ?? \"auto\"}\n onInput={(event) => this.handleChange(event)}\n onChange={(event) => this.handleChange(event)}\n >\n {this.showScrollLeft ? (\n <db-button\n class=\"tabs-scroll-left\"\n variant=\"ghost\"\n icon=\"chevron_left\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll(true)}\n >\n Scroll left\n </db-button>\n ) : null}\n {this.tabs ? (\n <Fragment>\n <db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-item\n key={this.name + \"tab-item\" + index}\n active={tab.active}\n label={tab.label}\n iconTrailing={tab.iconTrailing}\n icon={tab.icon}\n noText={tab.noText}\n ></db-tab-item>\n ))}\n </db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-panel\n key={this.name + \"tab-panel\" + index}\n content={tab.content}\n >\n {tab.children}\n </db-tab-panel>\n ))}\n </Fragment>\n ) : null}\n {this.showScrollRight ? (\n <db-button\n class=\"tabs-scroll-right\"\n variant=\"ghost\"\n icon=\"chevron_right\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll()}\n >\n Scroll right\n </db-button>\n ) : null}\n <slot></slot>\n </div>\n );\n }\n}\n"],"names":["uuid","h","cls","Fragment","index"],"mappings":"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"}
|
|
@@ -100,24 +100,29 @@ export class DBTabs {
|
|
|
100
100
|
}
|
|
101
101
|
}
|
|
102
102
|
handleChange(event) {
|
|
103
|
-
var _a
|
|
103
|
+
var _a;
|
|
104
104
|
event.stopPropagation();
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
105
|
+
if (event.target) {
|
|
106
|
+
const target = event.target;
|
|
107
|
+
const parent = target.parentElement;
|
|
108
|
+
if (parent &&
|
|
109
|
+
parent.parentElement &&
|
|
110
|
+
((_a = parent.parentElement) === null || _a === void 0 ? void 0 : _a.nodeName) === "LI") {
|
|
111
|
+
const tabItem = parent.parentElement.parentElement;
|
|
112
|
+
if (tabItem) {
|
|
113
|
+
const list = tabItem.parentElement;
|
|
114
|
+
if (list) {
|
|
115
|
+
const indices = Array.from(list.childNodes).indexOf(tabItem);
|
|
116
|
+
if (this.indexChange) {
|
|
117
|
+
this.indexChange.emit(indices);
|
|
118
|
+
}
|
|
119
|
+
if (this.tabSelect) {
|
|
120
|
+
this.tabSelect.emit(event);
|
|
121
|
+
}
|
|
122
|
+
}
|
|
123
|
+
}
|
|
116
124
|
}
|
|
117
125
|
}
|
|
118
|
-
if (this.tabSelect) {
|
|
119
|
-
this.tabSelect.emit(event);
|
|
120
|
-
}
|
|
121
126
|
}
|
|
122
127
|
/**
|
|
123
128
|
* Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.
|
|
@@ -185,10 +190,10 @@ export class DBTabs {
|
|
|
185
190
|
}
|
|
186
191
|
render() {
|
|
187
192
|
var _a, _b, _c, _d;
|
|
188
|
-
return (h("div", { key: '
|
|
193
|
+
return (h("div", { key: 'f2927c65e3e2199780a8d5a8f5adc04dc48241e1', class: cls("db-tabs", this.className), ref: (el) => {
|
|
189
194
|
this._ref = el;
|
|
190
|
-
}, id: this._id, "data-orientation": this.orientation, "data-scroll-behavior": this.behavior, "data-alignment": (_a = this.alignment) !== null && _a !== void 0 ? _a : "start", "data-width": (_b = this.width) !== null && _b !== void 0 ? _b : "auto", onInput: (event) => this.handleChange(event) }, this.showScrollLeft ? (h("db-button", { class: "tabs-scroll-left", variant: "ghost", icon: "chevron_left", type: "button", noText: true, onClick: () => this.scroll(true) }, "Scroll left")) : null, this.tabs ? (h(Fragment, null, h("db-tab-list", null, (_c = this.convertTabs()) === null || _c === void 0 ? void 0 : _c.map((tab, index) => (h("db-tab-item", { key: this.name + "tab-item" + index, active: tab.active, label: tab.label, iconTrailing: tab.iconTrailing, icon: tab.icon, noText: tab.noText })))), (_d = this.convertTabs()) === null || _d === void 0 ? void 0 :
|
|
191
|
-
_d.map((tab, index) => (h("db-tab-panel", { key: this.name + "tab-panel" + index, content: tab.content }, tab.children))))) : null, this.showScrollRight ? (h("db-button", { class: "tabs-scroll-right", variant: "ghost", icon: "chevron_right", type: "button", noText: true, onClick: () => this.scroll() }, "Scroll right")) : null, h("slot", { key: '
|
|
195
|
+
}, id: this._id, "data-orientation": this.orientation, "data-scroll-behavior": this.behavior, "data-alignment": (_a = this.alignment) !== null && _a !== void 0 ? _a : "start", "data-width": (_b = this.width) !== null && _b !== void 0 ? _b : "auto", onInput: (event) => this.handleChange(event), onChange: (event) => this.handleChange(event) }, this.showScrollLeft ? (h("db-button", { class: "tabs-scroll-left", variant: "ghost", icon: "chevron_left", type: "button", noText: true, onClick: () => this.scroll(true) }, "Scroll left")) : null, this.tabs ? (h(Fragment, null, h("db-tab-list", null, (_c = this.convertTabs()) === null || _c === void 0 ? void 0 : _c.map((tab, index) => (h("db-tab-item", { key: this.name + "tab-item" + index, active: tab.active, label: tab.label, iconTrailing: tab.iconTrailing, icon: tab.icon, noText: tab.noText })))), (_d = this.convertTabs()) === null || _d === void 0 ? void 0 :
|
|
196
|
+
_d.map((tab, index) => (h("db-tab-panel", { key: this.name + "tab-panel" + index, content: tab.content }, tab.children))))) : null, this.showScrollRight ? (h("db-button", { class: "tabs-scroll-right", variant: "ghost", icon: "chevron_right", type: "button", noText: true, onClick: () => this.scroll() }, "Scroll right")) : null, h("slot", { key: 'e34a5daca2d4be08527f000f1c9f9d8d405d16dd' })));
|
|
192
197
|
}
|
|
193
198
|
static get is() { return "db-tabs"; }
|
|
194
199
|
static get properties() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../../src/components/tabs/tabs.tsx"],"names":[],"mappings":"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","sourcesContent":["import { InputEvent } from \"../../shared/model\";\nimport { cls, uuid } from \"../../utils\";\nimport { DBButton } from \"../button/button\";\nimport { DBTabItem } from \"../tab-item/tab-item\";\nimport { DBTabList } from \"../tab-list/tab-list\";\nimport { DBTabPanel } from \"../tab-panel/tab-panel\";\nimport { DBSimpleTabProps, DBTabsProps, DBTabsState } from \"./model\";\n\nimport {\n Component,\n h,\n Fragment,\n Watch,\n Event,\n EventEmitter,\n Prop,\n State,\n} from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n tag: \"db-tabs\",\n})\nexport class DBTabs {\n private _ref!: HTMLDivElement | any;\n @Prop() id: DBTabsProps[\"id\"];\n @Prop() name: DBTabsProps[\"name\"];\n @Prop() tabs: DBTabsProps[\"tabs\"];\n @Prop() arrowScrollDistance: DBTabsProps[\"arrowScrollDistance\"];\n @Prop() orientation: DBTabsProps[\"orientation\"];\n @Prop() behavior: DBTabsProps[\"behavior\"];\n @Prop() initialSelectedMode: DBTabsProps[\"initialSelectedMode\"];\n @Prop() initialSelectedIndex: DBTabsProps[\"initialSelectedIndex\"];\n @Event() indexChange: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onIndexChange\"]>[number]\n > | void;\n @Event() tabSelect: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onTabSelect\"]>[number]\n > | void;\n @Prop({attribute: \"classname\"}) className: DBTabsProps[\"className\"];\n @Prop() alignment: DBTabsProps[\"alignment\"];\n @Prop() width: DBTabsProps[\"width\"];\n @State() _id = \"tabs-\" + uuid();\n @State() _name = \"\";\n @State() initialized = false;\n @State() showScrollLeft = false;\n @State() showScrollRight = false;\n @State() scrollContainer = null;\n\n convertTabs() {\n try {\n if (typeof this.tabs === \"string\") {\n return JSON.parse(this.tabs as string);\n }\n return this.tabs as DBSimpleTabProps[];\n } catch (error) {\n console.error(error);\n }\n return [];\n }\n evaluateScrollButtons(tList: Element) {\n const needsScroll = tList.scrollWidth > tList.clientWidth;\n this.showScrollLeft = needsScroll && tList.scrollLeft > 1;\n this.showScrollRight =\n needsScroll && tList.scrollLeft < tList.scrollWidth - tList.clientWidth;\n }\n scroll(left?: boolean) {\n let step = Number(this.arrowScrollDistance) || 100;\n if (left) {\n step *= -1;\n }\n this.scrollContainer?.scrollBy({\n top: 0,\n left: step,\n behavior: \"smooth\",\n });\n }\n initTabList() {\n if (this._ref) {\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const container: HTMLElement | null =\n tabList.querySelector('[role=\"tablist\"]');\n if (container) {\n container.setAttribute(\n \"aria-orientation\",\n this.orientation || \"horizontal\"\n );\n if (this.behavior === \"arrows\") {\n this.scrollContainer = container;\n this.evaluateScrollButtons(container);\n container.addEventListener(\"scroll\", () => {\n this.evaluateScrollButtons(container);\n });\n }\n }\n }\n }\n }\n initTabs(init?: boolean) {\n if (this._ref) {\n const tabItems = Array.from<Element>(\n this._ref.getElementsByClassName(\"db-tab-item\")\n );\n const tabPanels = Array.from<Element>(\n this._ref.querySelectorAll(\n \":is(:scope > .db-tab-panel, :scope > db-tab-panel > .db-tab-panel)\"\n )\n );\n for (const tabItem of tabItems) {\n const index: number = tabItems.indexOf(tabItem);\n const label = tabItem.querySelector(\"label\");\n const input = tabItem.querySelector(\"input\");\n if (input && label) {\n if (!input.id) {\n const tabId = `${this._name}-tab-${index}`;\n label.setAttribute(\"for\", tabId);\n input.id = tabId;\n input.setAttribute(\"name\", this._name);\n if (tabPanels.length > index) {\n input.setAttribute(\n \"aria-controls\",\n `${this._name}-tab-panel-${index}`\n );\n }\n }\n if (init) {\n // Auto select\n const autoSelect =\n !this.initialSelectedMode || this.initialSelectedMode === \"auto\";\n const shouldAutoSelect =\n (this.initialSelectedIndex == null && index === 0) ||\n Number(this.initialSelectedIndex) === index;\n if (autoSelect && shouldAutoSelect) {\n input.click();\n }\n }\n }\n }\n for (const panel of tabPanels) {\n if (panel.id) continue;\n const index: number = tabPanels.indexOf(panel);\n panel.id = `${this._name}-tab-panel-${index}`;\n panel.setAttribute(\"aria-labelledby\", `${this._name}-tab-${index}`);\n }\n }\n }\n handleChange(event: InputEvent<HTMLElement>) {\n event.stopPropagation();\n const closest: ((element: string) => HTMLElement | null) | undefined = (\n event.target as any\n )?.closest;\n if (!closest) return;\n const list = closest(\"ul\");\n const listItem =\n // db-tab-item for angular and stencil wrapping elements\n closest(\"db-tab-item\") ?? closest(\"li\");\n if (list !== null && listItem !== null) {\n const indices = Array.from(list.childNodes).indexOf(listItem);\n if (this.indexChange) {\n this.indexChange.emit(indices);\n }\n }\n if (this.tabSelect) {\n this.tabSelect.emit(event);\n }\n }\n\n /**\n * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n * @param element the ref for the component\n * @param customElementSelector the custom element like `my-component`\n */\n private enableAttributePassing(\n element: HTMLElement | null,\n customElementSelector: string\n ) {\n const parent = element?.closest(customElementSelector);\n if (element && parent) {\n const attributes = parent.attributes;\n for (let i = 0; i < attributes.length; i++) {\n const attr = attributes.item(i);\n if (\n attr &&\n (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n ) {\n element.setAttribute(attr.name, attr.value);\n parent.removeAttribute(attr.name);\n }\n if (attr && attr.name === \"class\") {\n const isWebComponent = attr.value.includes(\"hydrated\");\n const value = attr.value.replace(\"hydrated\", \"\").trim();\n const currentClass = element.getAttribute(\"class\");\n element.setAttribute(\n attr.name,\n `${currentClass ? `${currentClass} ` : \"\"}${value}`\n );\n if (isWebComponent) {\n // Stencil is using this class for lazy loading component\n parent.setAttribute(\"class\", \"hydrated\");\n } else {\n parent.removeAttribute(attr.name);\n }\n }\n }\n }\n }\n\n watch0Fn() {\n if (this._ref && this.initialized) {\n this.initTabList();\n this.initTabs(true);\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const observer = new MutationObserver((mutations) => {\n mutations.forEach((mutation) => {\n if (mutation.removedNodes.length || mutation.addedNodes.length) {\n this.initTabList();\n this.initTabs();\n }\n });\n });\n observer.observe(tabList, {\n childList: true,\n subtree: true,\n });\n }\n this.initialized = false;\n }\n }\n\n @Watch(\"_ref\")\n @Watch(\"initialized\")\n watch0() {\n this.watch0Fn();\n }\n\n componentDidLoad() {\n this.enableAttributePassing(this._ref, \"db-tabs\");\n this._id = this.id || this._id;\n this._name = `tabs-${this.name || uuid()}`;\n this.initialized = true;\n this.watch0Fn();\n }\n\n render() {\n return (\n <div\n class={cls(\"db-tabs\", this.className)}\n ref={(el: any) => {\n this._ref = el;\n }}\n id={this._id}\n data-orientation={this.orientation}\n data-scroll-behavior={this.behavior}\n data-alignment={this.alignment ?? \"start\"}\n data-width={this.width ?? \"auto\"}\n onInput={(event) => this.handleChange(event)}\n >\n {this.showScrollLeft ? (\n <db-button\n class=\"tabs-scroll-left\"\n variant=\"ghost\"\n icon=\"chevron_left\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll(true)}\n >\n Scroll left\n </db-button>\n ) : null}\n {this.tabs ? (\n <Fragment>\n <db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-item\n key={this.name + \"tab-item\" + index}\n active={tab.active}\n label={tab.label}\n iconTrailing={tab.iconTrailing}\n icon={tab.icon}\n noText={tab.noText}\n ></db-tab-item>\n ))}\n </db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-panel\n key={this.name + \"tab-panel\" + index}\n content={tab.content}\n >\n {tab.children}\n </db-tab-panel>\n ))}\n </Fragment>\n ) : null}\n {this.showScrollRight ? (\n <db-button\n class=\"tabs-scroll-right\"\n variant=\"ghost\"\n icon=\"chevron_right\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll()}\n >\n Scroll right\n </db-button>\n ) : null}\n <slot></slot>\n </div>\n );\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../../src/components/tabs/tabs.tsx"],"names":[],"mappings":"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","sourcesContent":["import { InputEvent } from \"../../shared/model\";\nimport { cls, uuid } from \"../../utils\";\nimport { DBButton } from \"../button/button\";\nimport { DBTabItem } from \"../tab-item/tab-item\";\nimport { DBTabList } from \"../tab-list/tab-list\";\nimport { DBTabPanel } from \"../tab-panel/tab-panel\";\nimport { DBSimpleTabProps, DBTabsProps, DBTabsState } from \"./model\";\n\nimport {\n Component,\n h,\n Fragment,\n Watch,\n Event,\n EventEmitter,\n Prop,\n State,\n} from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n tag: \"db-tabs\",\n})\nexport class DBTabs {\n private _ref!: HTMLDivElement | any;\n @Prop() id: DBTabsProps[\"id\"];\n @Prop() name: DBTabsProps[\"name\"];\n @Prop() tabs: DBTabsProps[\"tabs\"];\n @Prop() arrowScrollDistance: DBTabsProps[\"arrowScrollDistance\"];\n @Prop() orientation: DBTabsProps[\"orientation\"];\n @Prop() behavior: DBTabsProps[\"behavior\"];\n @Prop() initialSelectedMode: DBTabsProps[\"initialSelectedMode\"];\n @Prop() initialSelectedIndex: DBTabsProps[\"initialSelectedIndex\"];\n @Event() indexChange: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onIndexChange\"]>[number]\n > | void;\n @Event() tabSelect: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onTabSelect\"]>[number]\n > | void;\n @Prop({attribute: \"classname\"}) className: DBTabsProps[\"className\"];\n @Prop() alignment: DBTabsProps[\"alignment\"];\n @Prop() width: DBTabsProps[\"width\"];\n @State() _id = \"tabs-\" + uuid();\n @State() _name = \"\";\n @State() initialized = false;\n @State() showScrollLeft = false;\n @State() showScrollRight = false;\n @State() scrollContainer = null;\n\n convertTabs() {\n try {\n if (typeof this.tabs === \"string\") {\n return JSON.parse(this.tabs as string);\n }\n return this.tabs as DBSimpleTabProps[];\n } catch (error) {\n console.error(error);\n }\n return [];\n }\n evaluateScrollButtons(tList: Element) {\n const needsScroll = tList.scrollWidth > tList.clientWidth;\n this.showScrollLeft = needsScroll && tList.scrollLeft > 1;\n this.showScrollRight =\n needsScroll && tList.scrollLeft < tList.scrollWidth - tList.clientWidth;\n }\n scroll(left?: boolean) {\n let step = Number(this.arrowScrollDistance) || 100;\n if (left) {\n step *= -1;\n }\n this.scrollContainer?.scrollBy({\n top: 0,\n left: step,\n behavior: \"smooth\",\n });\n }\n initTabList() {\n if (this._ref) {\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const container: HTMLElement | null =\n tabList.querySelector('[role=\"tablist\"]');\n if (container) {\n container.setAttribute(\n \"aria-orientation\",\n this.orientation || \"horizontal\"\n );\n if (this.behavior === \"arrows\") {\n this.scrollContainer = container;\n this.evaluateScrollButtons(container);\n container.addEventListener(\"scroll\", () => {\n this.evaluateScrollButtons(container);\n });\n }\n }\n }\n }\n }\n initTabs(init?: boolean) {\n if (this._ref) {\n const tabItems = Array.from<Element>(\n this._ref.getElementsByClassName(\"db-tab-item\")\n );\n const tabPanels = Array.from<Element>(\n this._ref.querySelectorAll(\n \":is(:scope > .db-tab-panel, :scope > db-tab-panel > .db-tab-panel)\"\n )\n );\n for (const tabItem of tabItems) {\n const index: number = tabItems.indexOf(tabItem);\n const label = tabItem.querySelector(\"label\");\n const input = tabItem.querySelector(\"input\");\n if (input && label) {\n if (!input.id) {\n const tabId = `${this._name}-tab-${index}`;\n label.setAttribute(\"for\", tabId);\n input.id = tabId;\n input.setAttribute(\"name\", this._name);\n if (tabPanels.length > index) {\n input.setAttribute(\n \"aria-controls\",\n `${this._name}-tab-panel-${index}`\n );\n }\n }\n if (init) {\n // Auto select\n const autoSelect =\n !this.initialSelectedMode || this.initialSelectedMode === \"auto\";\n const shouldAutoSelect =\n (this.initialSelectedIndex == null && index === 0) ||\n Number(this.initialSelectedIndex) === index;\n if (autoSelect && shouldAutoSelect) {\n input.click();\n }\n }\n }\n }\n for (const panel of tabPanels) {\n if (panel.id) continue;\n const index: number = tabPanels.indexOf(panel);\n panel.id = `${this._name}-tab-panel-${index}`;\n panel.setAttribute(\"aria-labelledby\", `${this._name}-tab-${index}`);\n }\n }\n }\n handleChange(event: InputEvent<HTMLElement>) {\n event.stopPropagation();\n if (event.target) {\n const target = event.target as HTMLElement;\n const parent = target.parentElement;\n if (\n parent &&\n parent.parentElement &&\n parent.parentElement?.nodeName === \"LI\"\n ) {\n const tabItem = parent.parentElement.parentElement;\n if (tabItem) {\n const list = tabItem.parentElement;\n if (list) {\n const indices = Array.from(list.childNodes).indexOf(tabItem);\n if (this.indexChange) {\n this.indexChange.emit(indices);\n }\n if (this.tabSelect) {\n this.tabSelect.emit(event);\n }\n }\n }\n }\n }\n }\n\n /**\n * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n * @param element the ref for the component\n * @param customElementSelector the custom element like `my-component`\n */\n private enableAttributePassing(\n element: HTMLElement | null,\n customElementSelector: string\n ) {\n const parent = element?.closest(customElementSelector);\n if (element && parent) {\n const attributes = parent.attributes;\n for (let i = 0; i < attributes.length; i++) {\n const attr = attributes.item(i);\n if (\n attr &&\n (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n ) {\n element.setAttribute(attr.name, attr.value);\n parent.removeAttribute(attr.name);\n }\n if (attr && attr.name === \"class\") {\n const isWebComponent = attr.value.includes(\"hydrated\");\n const value = attr.value.replace(\"hydrated\", \"\").trim();\n const currentClass = element.getAttribute(\"class\");\n element.setAttribute(\n attr.name,\n `${currentClass ? `${currentClass} ` : \"\"}${value}`\n );\n if (isWebComponent) {\n // Stencil is using this class for lazy loading component\n parent.setAttribute(\"class\", \"hydrated\");\n } else {\n parent.removeAttribute(attr.name);\n }\n }\n }\n }\n }\n\n watch0Fn() {\n if (this._ref && this.initialized) {\n this.initTabList();\n this.initTabs(true);\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const observer = new MutationObserver((mutations) => {\n mutations.forEach((mutation) => {\n if (mutation.removedNodes.length || mutation.addedNodes.length) {\n this.initTabList();\n this.initTabs();\n }\n });\n });\n observer.observe(tabList, {\n childList: true,\n subtree: true,\n });\n }\n this.initialized = false;\n }\n }\n\n @Watch(\"_ref\")\n @Watch(\"initialized\")\n watch0() {\n this.watch0Fn();\n }\n\n componentDidLoad() {\n this.enableAttributePassing(this._ref, \"db-tabs\");\n this._id = this.id || this._id;\n this._name = `tabs-${this.name || uuid()}`;\n this.initialized = true;\n this.watch0Fn();\n }\n\n render() {\n return (\n <div\n class={cls(\"db-tabs\", this.className)}\n ref={(el: any) => {\n this._ref = el;\n }}\n id={this._id}\n data-orientation={this.orientation}\n data-scroll-behavior={this.behavior}\n data-alignment={this.alignment ?? \"start\"}\n data-width={this.width ?? \"auto\"}\n onInput={(event) => this.handleChange(event)}\n onChange={(event) => this.handleChange(event)}\n >\n {this.showScrollLeft ? (\n <db-button\n class=\"tabs-scroll-left\"\n variant=\"ghost\"\n icon=\"chevron_left\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll(true)}\n >\n Scroll left\n </db-button>\n ) : null}\n {this.tabs ? (\n <Fragment>\n <db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-item\n key={this.name + \"tab-item\" + index}\n active={tab.active}\n label={tab.label}\n iconTrailing={tab.iconTrailing}\n icon={tab.icon}\n noText={tab.noText}\n ></db-tab-item>\n ))}\n </db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-panel\n key={this.name + \"tab-panel\" + index}\n content={tab.content}\n >\n {tab.children}\n </db-tab-panel>\n ))}\n </Fragment>\n ) : null}\n {this.showScrollRight ? (\n <db-button\n class=\"tabs-scroll-right\"\n variant=\"ghost\"\n icon=\"chevron_right\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll()}\n >\n Scroll right\n </db-button>\n ) : null}\n <slot></slot>\n </div>\n );\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"db-tabs.entry.esm.js","sources":["src/components/tabs/tabs.tsx"],"sourcesContent":["import { InputEvent } from \"../../shared/model\";\nimport { cls, uuid } from \"../../utils\";\nimport { DBButton } from \"../button/button\";\nimport { DBTabItem } from \"../tab-item/tab-item\";\nimport { DBTabList } from \"../tab-list/tab-list\";\nimport { DBTabPanel } from \"../tab-panel/tab-panel\";\nimport { DBSimpleTabProps, DBTabsProps, DBTabsState } from \"./model\";\n\nimport {\n Component,\n h,\n Fragment,\n Watch,\n Event,\n EventEmitter,\n Prop,\n State,\n} from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n tag: \"db-tabs\",\n})\nexport class DBTabs {\n private _ref!: HTMLDivElement | any;\n @Prop() id: DBTabsProps[\"id\"];\n @Prop() name: DBTabsProps[\"name\"];\n @Prop() tabs: DBTabsProps[\"tabs\"];\n @Prop() arrowScrollDistance: DBTabsProps[\"arrowScrollDistance\"];\n @Prop() orientation: DBTabsProps[\"orientation\"];\n @Prop() behavior: DBTabsProps[\"behavior\"];\n @Prop() initialSelectedMode: DBTabsProps[\"initialSelectedMode\"];\n @Prop() initialSelectedIndex: DBTabsProps[\"initialSelectedIndex\"];\n @Event() indexChange: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onIndexChange\"]>[number]\n > | void;\n @Event() tabSelect: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onTabSelect\"]>[number]\n > | void;\n @Prop({attribute: \"classname\"}) className: DBTabsProps[\"className\"];\n @Prop() alignment: DBTabsProps[\"alignment\"];\n @Prop() width: DBTabsProps[\"width\"];\n @State() _id = \"tabs-\" + uuid();\n @State() _name = \"\";\n @State() initialized = false;\n @State() showScrollLeft = false;\n @State() showScrollRight = false;\n @State() scrollContainer = null;\n\n convertTabs() {\n try {\n if (typeof this.tabs === \"string\") {\n return JSON.parse(this.tabs as string);\n }\n return this.tabs as DBSimpleTabProps[];\n } catch (error) {\n console.error(error);\n }\n return [];\n }\n evaluateScrollButtons(tList: Element) {\n const needsScroll = tList.scrollWidth > tList.clientWidth;\n this.showScrollLeft = needsScroll && tList.scrollLeft > 1;\n this.showScrollRight =\n needsScroll && tList.scrollLeft < tList.scrollWidth - tList.clientWidth;\n }\n scroll(left?: boolean) {\n let step = Number(this.arrowScrollDistance) || 100;\n if (left) {\n step *= -1;\n }\n this.scrollContainer?.scrollBy({\n top: 0,\n left: step,\n behavior: \"smooth\",\n });\n }\n initTabList() {\n if (this._ref) {\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const container: HTMLElement | null =\n tabList.querySelector('[role=\"tablist\"]');\n if (container) {\n container.setAttribute(\n \"aria-orientation\",\n this.orientation || \"horizontal\"\n );\n if (this.behavior === \"arrows\") {\n this.scrollContainer = container;\n this.evaluateScrollButtons(container);\n container.addEventListener(\"scroll\", () => {\n this.evaluateScrollButtons(container);\n });\n }\n }\n }\n }\n }\n initTabs(init?: boolean) {\n if (this._ref) {\n const tabItems = Array.from<Element>(\n this._ref.getElementsByClassName(\"db-tab-item\")\n );\n const tabPanels = Array.from<Element>(\n this._ref.querySelectorAll(\n \":is(:scope > .db-tab-panel, :scope > db-tab-panel > .db-tab-panel)\"\n )\n );\n for (const tabItem of tabItems) {\n const index: number = tabItems.indexOf(tabItem);\n const label = tabItem.querySelector(\"label\");\n const input = tabItem.querySelector(\"input\");\n if (input && label) {\n if (!input.id) {\n const tabId = `${this._name}-tab-${index}`;\n label.setAttribute(\"for\", tabId);\n input.id = tabId;\n input.setAttribute(\"name\", this._name);\n if (tabPanels.length > index) {\n input.setAttribute(\n \"aria-controls\",\n `${this._name}-tab-panel-${index}`\n );\n }\n }\n if (init) {\n // Auto select\n const autoSelect =\n !this.initialSelectedMode || this.initialSelectedMode === \"auto\";\n const shouldAutoSelect =\n (this.initialSelectedIndex == null && index === 0) ||\n Number(this.initialSelectedIndex) === index;\n if (autoSelect && shouldAutoSelect) {\n input.click();\n }\n }\n }\n }\n for (const panel of tabPanels) {\n if (panel.id) continue;\n const index: number = tabPanels.indexOf(panel);\n panel.id = `${this._name}-tab-panel-${index}`;\n panel.setAttribute(\"aria-labelledby\", `${this._name}-tab-${index}`);\n }\n }\n }\n handleChange(event: InputEvent<HTMLElement>) {\n event.stopPropagation();\n const closest: ((element: string) => HTMLElement | null) | undefined = (\n event.target as any\n )?.closest;\n if (!closest) return;\n const list = closest(\"ul\");\n const listItem =\n // db-tab-item for angular and stencil wrapping elements\n closest(\"db-tab-item\") ?? closest(\"li\");\n if (list !== null && listItem !== null) {\n const indices = Array.from(list.childNodes).indexOf(listItem);\n if (this.indexChange) {\n this.indexChange.emit(indices);\n }\n }\n if (this.tabSelect) {\n this.tabSelect.emit(event);\n }\n }\n\n /**\n * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n * @param element the ref for the component\n * @param customElementSelector the custom element like `my-component`\n */\n private enableAttributePassing(\n element: HTMLElement | null,\n customElementSelector: string\n ) {\n const parent = element?.closest(customElementSelector);\n if (element && parent) {\n const attributes = parent.attributes;\n for (let i = 0; i < attributes.length; i++) {\n const attr = attributes.item(i);\n if (\n attr &&\n (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n ) {\n element.setAttribute(attr.name, attr.value);\n parent.removeAttribute(attr.name);\n }\n if (attr && attr.name === \"class\") {\n const isWebComponent = attr.value.includes(\"hydrated\");\n const value = attr.value.replace(\"hydrated\", \"\").trim();\n const currentClass = element.getAttribute(\"class\");\n element.setAttribute(\n attr.name,\n `${currentClass ? `${currentClass} ` : \"\"}${value}`\n );\n if (isWebComponent) {\n // Stencil is using this class for lazy loading component\n parent.setAttribute(\"class\", \"hydrated\");\n } else {\n parent.removeAttribute(attr.name);\n }\n }\n }\n }\n }\n\n watch0Fn() {\n if (this._ref && this.initialized) {\n this.initTabList();\n this.initTabs(true);\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const observer = new MutationObserver((mutations) => {\n mutations.forEach((mutation) => {\n if (mutation.removedNodes.length || mutation.addedNodes.length) {\n this.initTabList();\n this.initTabs();\n }\n });\n });\n observer.observe(tabList, {\n childList: true,\n subtree: true,\n });\n }\n this.initialized = false;\n }\n }\n\n @Watch(\"_ref\")\n @Watch(\"initialized\")\n watch0() {\n this.watch0Fn();\n }\n\n componentDidLoad() {\n this.enableAttributePassing(this._ref, \"db-tabs\");\n this._id = this.id || this._id;\n this._name = `tabs-${this.name || uuid()}`;\n this.initialized = true;\n this.watch0Fn();\n }\n\n render() {\n return (\n <div\n class={cls(\"db-tabs\", this.className)}\n ref={(el: any) => {\n this._ref = el;\n }}\n id={this._id}\n data-orientation={this.orientation}\n data-scroll-behavior={this.behavior}\n data-alignment={this.alignment ?? \"start\"}\n data-width={this.width ?? \"auto\"}\n onInput={(event) => this.handleChange(event)}\n >\n {this.showScrollLeft ? (\n <db-button\n class=\"tabs-scroll-left\"\n variant=\"ghost\"\n icon=\"chevron_left\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll(true)}\n >\n Scroll left\n </db-button>\n ) : null}\n {this.tabs ? (\n <Fragment>\n <db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-item\n key={this.name + \"tab-item\" + index}\n active={tab.active}\n label={tab.label}\n iconTrailing={tab.iconTrailing}\n icon={tab.icon}\n noText={tab.noText}\n ></db-tab-item>\n ))}\n </db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-panel\n key={this.name + \"tab-panel\" + index}\n content={tab.content}\n >\n {tab.children}\n </db-tab-panel>\n ))}\n </Fragment>\n ) : null}\n {this.showScrollRight ? (\n <db-button\n class=\"tabs-scroll-right\"\n variant=\"ghost\"\n icon=\"chevron_right\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll()}\n >\n Scroll right\n </db-button>\n ) : null}\n <slot></slot>\n </div>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"db-tabs.entry.esm.js","sources":["src/components/tabs/tabs.tsx"],"sourcesContent":["import { InputEvent } from \"../../shared/model\";\nimport { cls, uuid } from \"../../utils\";\nimport { DBButton } from \"../button/button\";\nimport { DBTabItem } from \"../tab-item/tab-item\";\nimport { DBTabList } from \"../tab-list/tab-list\";\nimport { DBTabPanel } from \"../tab-panel/tab-panel\";\nimport { DBSimpleTabProps, DBTabsProps, DBTabsState } from \"./model\";\n\nimport {\n Component,\n h,\n Fragment,\n Watch,\n Event,\n EventEmitter,\n Prop,\n State,\n} from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n tag: \"db-tabs\",\n})\nexport class DBTabs {\n private _ref!: HTMLDivElement | any;\n @Prop() id: DBTabsProps[\"id\"];\n @Prop() name: DBTabsProps[\"name\"];\n @Prop() tabs: DBTabsProps[\"tabs\"];\n @Prop() arrowScrollDistance: DBTabsProps[\"arrowScrollDistance\"];\n @Prop() orientation: DBTabsProps[\"orientation\"];\n @Prop() behavior: DBTabsProps[\"behavior\"];\n @Prop() initialSelectedMode: DBTabsProps[\"initialSelectedMode\"];\n @Prop() initialSelectedIndex: DBTabsProps[\"initialSelectedIndex\"];\n @Event() indexChange: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onIndexChange\"]>[number]\n > | void;\n @Event() tabSelect: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onTabSelect\"]>[number]\n > | void;\n @Prop({attribute: \"classname\"}) className: DBTabsProps[\"className\"];\n @Prop() alignment: DBTabsProps[\"alignment\"];\n @Prop() width: DBTabsProps[\"width\"];\n @State() _id = \"tabs-\" + uuid();\n @State() _name = \"\";\n @State() initialized = false;\n @State() showScrollLeft = false;\n @State() showScrollRight = false;\n @State() scrollContainer = null;\n\n convertTabs() {\n try {\n if (typeof this.tabs === \"string\") {\n return JSON.parse(this.tabs as string);\n }\n return this.tabs as DBSimpleTabProps[];\n } catch (error) {\n console.error(error);\n }\n return [];\n }\n evaluateScrollButtons(tList: Element) {\n const needsScroll = tList.scrollWidth > tList.clientWidth;\n this.showScrollLeft = needsScroll && tList.scrollLeft > 1;\n this.showScrollRight =\n needsScroll && tList.scrollLeft < tList.scrollWidth - tList.clientWidth;\n }\n scroll(left?: boolean) {\n let step = Number(this.arrowScrollDistance) || 100;\n if (left) {\n step *= -1;\n }\n this.scrollContainer?.scrollBy({\n top: 0,\n left: step,\n behavior: \"smooth\",\n });\n }\n initTabList() {\n if (this._ref) {\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const container: HTMLElement | null =\n tabList.querySelector('[role=\"tablist\"]');\n if (container) {\n container.setAttribute(\n \"aria-orientation\",\n this.orientation || \"horizontal\"\n );\n if (this.behavior === \"arrows\") {\n this.scrollContainer = container;\n this.evaluateScrollButtons(container);\n container.addEventListener(\"scroll\", () => {\n this.evaluateScrollButtons(container);\n });\n }\n }\n }\n }\n }\n initTabs(init?: boolean) {\n if (this._ref) {\n const tabItems = Array.from<Element>(\n this._ref.getElementsByClassName(\"db-tab-item\")\n );\n const tabPanels = Array.from<Element>(\n this._ref.querySelectorAll(\n \":is(:scope > .db-tab-panel, :scope > db-tab-panel > .db-tab-panel)\"\n )\n );\n for (const tabItem of tabItems) {\n const index: number = tabItems.indexOf(tabItem);\n const label = tabItem.querySelector(\"label\");\n const input = tabItem.querySelector(\"input\");\n if (input && label) {\n if (!input.id) {\n const tabId = `${this._name}-tab-${index}`;\n label.setAttribute(\"for\", tabId);\n input.id = tabId;\n input.setAttribute(\"name\", this._name);\n if (tabPanels.length > index) {\n input.setAttribute(\n \"aria-controls\",\n `${this._name}-tab-panel-${index}`\n );\n }\n }\n if (init) {\n // Auto select\n const autoSelect =\n !this.initialSelectedMode || this.initialSelectedMode === \"auto\";\n const shouldAutoSelect =\n (this.initialSelectedIndex == null && index === 0) ||\n Number(this.initialSelectedIndex) === index;\n if (autoSelect && shouldAutoSelect) {\n input.click();\n }\n }\n }\n }\n for (const panel of tabPanels) {\n if (panel.id) continue;\n const index: number = tabPanels.indexOf(panel);\n panel.id = `${this._name}-tab-panel-${index}`;\n panel.setAttribute(\"aria-labelledby\", `${this._name}-tab-${index}`);\n }\n }\n }\n handleChange(event: InputEvent<HTMLElement>) {\n event.stopPropagation();\n if (event.target) {\n const target = event.target as HTMLElement;\n const parent = target.parentElement;\n if (\n parent &&\n parent.parentElement &&\n parent.parentElement?.nodeName === \"LI\"\n ) {\n const tabItem = parent.parentElement.parentElement;\n if (tabItem) {\n const list = tabItem.parentElement;\n if (list) {\n const indices = Array.from(list.childNodes).indexOf(tabItem);\n if (this.indexChange) {\n this.indexChange.emit(indices);\n }\n if (this.tabSelect) {\n this.tabSelect.emit(event);\n }\n }\n }\n }\n }\n }\n\n /**\n * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n * @param element the ref for the component\n * @param customElementSelector the custom element like `my-component`\n */\n private enableAttributePassing(\n element: HTMLElement | null,\n customElementSelector: string\n ) {\n const parent = element?.closest(customElementSelector);\n if (element && parent) {\n const attributes = parent.attributes;\n for (let i = 0; i < attributes.length; i++) {\n const attr = attributes.item(i);\n if (\n attr &&\n (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n ) {\n element.setAttribute(attr.name, attr.value);\n parent.removeAttribute(attr.name);\n }\n if (attr && attr.name === \"class\") {\n const isWebComponent = attr.value.includes(\"hydrated\");\n const value = attr.value.replace(\"hydrated\", \"\").trim();\n const currentClass = element.getAttribute(\"class\");\n element.setAttribute(\n attr.name,\n `${currentClass ? `${currentClass} ` : \"\"}${value}`\n );\n if (isWebComponent) {\n // Stencil is using this class for lazy loading component\n parent.setAttribute(\"class\", \"hydrated\");\n } else {\n parent.removeAttribute(attr.name);\n }\n }\n }\n }\n }\n\n watch0Fn() {\n if (this._ref && this.initialized) {\n this.initTabList();\n this.initTabs(true);\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const observer = new MutationObserver((mutations) => {\n mutations.forEach((mutation) => {\n if (mutation.removedNodes.length || mutation.addedNodes.length) {\n this.initTabList();\n this.initTabs();\n }\n });\n });\n observer.observe(tabList, {\n childList: true,\n subtree: true,\n });\n }\n this.initialized = false;\n }\n }\n\n @Watch(\"_ref\")\n @Watch(\"initialized\")\n watch0() {\n this.watch0Fn();\n }\n\n componentDidLoad() {\n this.enableAttributePassing(this._ref, \"db-tabs\");\n this._id = this.id || this._id;\n this._name = `tabs-${this.name || uuid()}`;\n this.initialized = true;\n this.watch0Fn();\n }\n\n render() {\n return (\n <div\n class={cls(\"db-tabs\", this.className)}\n ref={(el: any) => {\n this._ref = el;\n }}\n id={this._id}\n data-orientation={this.orientation}\n data-scroll-behavior={this.behavior}\n data-alignment={this.alignment ?? \"start\"}\n data-width={this.width ?? \"auto\"}\n onInput={(event) => this.handleChange(event)}\n onChange={(event) => this.handleChange(event)}\n >\n {this.showScrollLeft ? (\n <db-button\n class=\"tabs-scroll-left\"\n variant=\"ghost\"\n icon=\"chevron_left\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll(true)}\n >\n Scroll left\n </db-button>\n ) : null}\n {this.tabs ? (\n <Fragment>\n <db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-item\n key={this.name + \"tab-item\" + index}\n active={tab.active}\n label={tab.label}\n iconTrailing={tab.iconTrailing}\n icon={tab.icon}\n noText={tab.noText}\n ></db-tab-item>\n ))}\n </db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-panel\n key={this.name + \"tab-panel\" + index}\n content={tab.content}\n >\n {tab.children}\n </db-tab-panel>\n ))}\n </Fragment>\n ) : null}\n {this.showScrollRight ? (\n <db-button\n class=\"tabs-scroll-right\"\n variant=\"ghost\"\n icon=\"chevron_right\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll()}\n >\n Scroll right\n </db-button>\n ) : null}\n <slot></slot>\n </div>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
package/dist/db-ux/db-ux.esm.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,b as a}from"./p-CNzNv7KB.js";export{s as setNonce}from"./p-CNzNv7KB.js";import{g as i}from"./p-DQuL1Twl.js";var l=()=>{const a=import.meta.url;const i={};if(a!==""){i.resourcesUrl=new URL(".",a).href}return e(i)};l().then((async e=>{await i();return a(JSON.parse('[["p-340bb722",[[260,"db-custom-select",{"id":[1],"invalidMessage":[1,"invalid-message"],"message":[1],"showMessage":[8,"show-message"],"ariaDescribedBy":[1,"aria-described-by"],"showNoResults":[4,"show-no-results"],"showLoading":[4,"show-loading"],"multiple":[8],"showSelectAll":[4,"show-select-all"],"showSearch":[4,"show-search"],"values":[16],"validation":[1],"options":[16],"searchValue":[1,"search-value"],"selectedLabels":[1,"selected-labels"],"transformSelectedLabels":[16,"transform-selected-labels"],"selectedType":[1,"selected-type"],"amountText":[1,"amount-text"],"validMessage":[1,"valid-message"],"required":[8],"selectAllLabel":[1,"select-all-label"],"removeTagsTexts":[16,"remove-tags-texts"],"placement":[1],"searchFilter":[16,"search-filter"],"className":[1,"classname"],"formFieldWidth":[1,"form-field-width"],"variant":[1],"showRequiredAsterisk":[8,"show-required-asterisk"],"showLabel":[8,"show-label"],"icon":[1],"showIcon":[8,"show-icon"],"label":[1],"form":[1],"name":[1],"disabled":[8],"open":[4],"dropdownWidth":[1,"dropdown-width"],"searchLabel":[1,"search-label"],"searchPlaceholder":[1,"search-placeholder"],"ariaListLabel":[1,"aria-list-label"],"loadingText":[1,"loading-text"],"noResultsText":[1,"no-results-text"],"mobileCloseButtonText":[1,"mobile-close-button-text"],"showClearSelection":[4,"show-clear-selection"],"clearSelectionText":[1,"clear-selection-text"],"placeholder":[1],"messageIcon":[1,"message-icon"],"_id":[32],"_messageId":[32],"_validMessageId":[32],"_invalidMessageId":[32],"_invalidMessage":[32],"_selectId":[32],"_labelId":[32],"_summaryId":[32],"_placeholderId":[32],"_infoTextId":[32],"_validity":[32],"_userInteraction":[32],"_descByIds":[32],"_selectedLabels":[32],"_selectedLabelsId":[32],"_voiceOverFallback":[32],"_selectedOptions":[32],"selectAllEnabled":[32],"searchEnabled":[32],"amountOptions":[32],"_values":[32],"_options":[32],"_hasNoOptions":[32],"_documentClickListenerCallbackId":[32],"_internalChangeTimestamp":[32],"_documentScrollListenerCallbackId":[32],"_observer":[32],"_searchValue":[32],"selectAllChecked":[32],"selectAllIndeterminate":[32]},null,{"detailsRef":["watch0","watch2"],"_id":["watch1"],"_descByIds":["watch2"],"showNoResults":["watch3"],"showLoading":["watch3"],"_options":["watch3"],"showSelectAll":["watch4"],"amountOptions":["watch4","watch5","watch9"],"multiple":["watch4"],"showSearch":["watch5"],"values":["watch6"],"_values":["watch7","watch9","watch12"],"selectRef":["watch7","watch16"],"validation":["watch8"],"options":["watch10","watch12"],"searchValue":["watch11"],"_selectedOptions":["watch13","watch14"],"selectedType":["watch13"],"amountText":["watch13"],"selectedLabels":["watch13"],"transformSelectedLabels":["watch13"],"selectAllIndeterminate":["watch15"],"selectAllRef":["watch15"],"invalidMessage":["watch16"]}]]],["p-6c4115c8",[[260,"db-tabs",{"id":[1],"name":[1],"tabs":[1],"arrowScrollDistance":[8,"arrow-scroll-distance"],"orientation":[1],"behavior":[1],"initialSelectedMode":[1,"initial-selected-mode"],"initialSelectedIndex":[8,"initial-selected-index"],"className":[1,"classname"],"alignment":[1],"width":[1],"_id":[32],"_name":[32],"initialized":[32],"showScrollLeft":[32],"showScrollRight":[32],"scrollContainer":[32]},null,{"_ref":["watch0"],"initialized":["watch0"]}]]],["p-3d7eb768",[[260,"db-header",{"forceMobile":[8,"force-mobile"],"drawerOpen":[8,"drawer-open"],"className":[1,"classname"],"id":[1],"width":[1],"burgerMenuLabel":[1,"burger-menu-label"],"initialized":[32],"forcedToMobile":[32]},null,{"initialized":["watch0"],"_ref":["watch0"]}]]],["p-16f1fa7c",[[260,"db-accordion",{"id":[1],"name":[1],"behavior":[1],"initOpenIndex":[16,"init-open-index"],"items":[1],"className":[1,"classname"],"variant":[1],"_id":[32],"_name":[32],"initialized":[32],"_initOpenIndexDone":[32]},null,{"initialized":["watch0"],"name":["watch0"],"behavior":["watch0"],"_id":["watch0"],"_ref":["watch1","watch2"],"_name":["watch1"],"_initOpenIndexDone":["watch2"],"initOpenIndex":["watch2"]}]]],["p-8b41c30e",[[260,"db-checkbox",{"id":[1],"invalidMessage":[1,"invalid-message"],"message":[1],"showMessage":[8,"show-message"],"indeterminate":[8],"checked":[8],"validMessage":[1,"valid-message"],"validation":[1],"required":[8],"className":[1,"classname"],"size":[1],"showRequiredAsterisk":[8,"show-required-asterisk"],"showLabel":[8,"show-label"],"name":[1],"disabled":[8],"value":[8],"ariaDescribedBy":[1,"aria-described-by"],"label":[1],"messageIcon":[1,"message-icon"],"initialized":[32],"_id":[32],"_messageId":[32],"_validMessageId":[32],"_invalidMessageId":[32],"_invalidMessage":[32],"_descByIds":[32],"_voiceOverFallback":[32]},null,{"_ref":["watch0","watch2","watch3"],"invalidMessage":["watch0"],"_id":["watch1"],"initialized":["watch2","watch3"],"indeterminate":["watch2"],"checked":["watch3"]}]]],["p-e9c323af",[[260,"db-navigation-item",{"subNavigationExpanded":[8,"sub-navigation-expanded"],"id":[1],"className":[1,"classname"],"width":[1],"icon":[1],"showIcon":[8,"show-icon"],"active":[4],"wrap":[8],"disabled":[8],"text":[1],"backButtonId":[1,"back-button-id"],"backButtonText":[1,"back-button-text"],"initialized":[32],"hasAreaPopup":[32],"hasSubNavigation":[32],"isSubNavigationExpanded":[32],"autoClose":[32],"subNavigationId":[32],"navigationItemSafeTriangle":[32]},null,{"subNavigationExpanded":["watch0"],"initialized":["watch1"],"_ref":["watch1"]}]]],["p-5c6da0f3",[[260,"db-notification",{"id":[1],"className":[1,"classname"],"ariaLive":[1,"aria-live"],"semantic":[1],"variant":[1],"icon":[1],"showIcon":[8,"show-icon"],"linkVariant":[1,"link-variant"],"headline":[8],"showHeadline":[8,"show-headline"],"text":[1],"timestamp":[1],"showTimestamp":[8,"show-timestamp"],"closeable":[8],"closeButtonId":[1,"close-button-id"],"closeButtonText":[1,"close-button-text"]}]]],["p-84dd974f",[[260,"db-select",{"id":[1],"invalidMessage":[1,"invalid-message"],"message":[1],"showMessage":[8,"show-message"],"value":[8],"validMessage":[1,"valid-message"],"validation":[1],"required":[8],"className":[1,"classname"],"variant":[1],"showLabel":[8,"show-label"],"showRequiredAsterisk":[8,"show-required-asterisk"],"icon":[1],"showIcon":[8,"show-icon"],"label":[1],"disabled":[8],"name":[1],"size":[2],"autocomplete":[1],"multiple":[4],"ariaDescribedBy":[1,"aria-described-by"],"options":[16],"placeholder":[1],"messageIcon":[1,"message-icon"],"_id":[32],"_messageId":[32],"_validMessageId":[32],"_invalidMessageId":[32],"_invalidMessage":[32],"_placeholderId":[32],"_descByIds":[32],"_value":[32],"initialized":[32],"_voiceOverFallback":[32]},null,{"_ref":["watch0"],"invalidMessage":["watch0"],"_id":["watch1"],"initialized":["watch1"],"value":["watch2"]}]]],["p-a3541c03",[[256,"db-textarea",{"id":[1],"invalidMessage":[1,"invalid-message"],"message":[1],"showMessage":[8,"show-message"],"value":[8],"validMessage":[1,"valid-message"],"validation":[1],"required":[8],"minLength":[8,"min-length"],"maxLength":[8,"max-length"],"className":[1,"classname"],"variant":[1],"showRequiredAsterisk":[8,"show-required-asterisk"],"showLabel":[8,"show-label"],"label":[1],"fieldSizing":[1,"field-sizing"],"resize":[1],"showResizer":[8,"show-resizer"],"disabled":[8],"readOnly":[8,"read-only"],"readonly":[8],"form":[1],"maxlength":[8],"minlength":[8],"name":[1],"wrap":[1],"spellCheck":[4,"spell-check"],"autocomplete":[1],"ariaDescribedBy":[1,"aria-described-by"],"placeholder":[1],"rows":[8],"cols":[8],"messageIcon":[1,"message-icon"],"_id":[32],"_messageId":[32],"_validMessageId":[32],"_invalidMessageId":[32],"_invalidMessage":[32],"_descByIds":[32],"_value":[32],"_voiceOverFallback":[32]},null,{"_ref":["watch0"],"invalidMessage":["watch0"],"_id":["watch1"],"value":["watch2"]}]]],["p-d7168627",[[260,"db-badge",{"placement":[1],"id":[1],"className":[1,"classname"],"semantic":[1],"size":[1],"emphasis":[1],"label":[1],"text":[1],"initialized":[32]},null,{"_ref":["watch0"],"initialized":["watch0"]}]]],["p-58007675",[[260,"db-brand",{"hideLogo":[4,"hide-logo"],"icon":[1],"showIcon":[8,"show-icon"],"id":[1],"className":[1,"classname"],"text":[1]}]]],["p-c5ff3d3f",[[260,"db-card",{"id":[1],"className":[1,"classname"],"behavior":[1],"elevationLevel":[1,"elevation-level"],"spacing":[1]}]]],["p-c8cdde8c",[[260,"db-custom-select-form-field",{"id":[1],"className":[1,"classname"]}]]],["p-02fcd4a8",[[256,"db-divider",{"id":[1],"margin":[1],"variant":[1],"emphasis":[1],"width":[1],"className":[1,"classname"]}]]],["p-bd7d1646",[[260,"db-icon",{"id":[1],"className":[1,"classname"],"icon":[1],"weight":[1],"variant":[1],"text":[1]}]]],["p-51de401e",[[260,"db-link",{"id":[1],"className":[1,"classname"],"href":[1],"target":[1],"rel":[1],"role":[1],"hreflang":[1],"disabled":[8],"size":[1],"showIcon":[8,"show-icon"],"variant":[1],"content":[1],"wrap":[8],"text":[1]}]]],["p-ce895e0c",[[260,"db-navigation",{"id":[1],"className":[1,"classname"],"_id":[32]}]]],["p-ec957247",[[260,"db-page",{"fadeIn":[8,"fade-in"],"documentOverflow":[1,"document-overflow"],"variant":[1],"id":[1],"className":[1,"classname"],"mainClass":[1,"main-class"],"fontsLoaded":[32]}]]],["p-fdf5578d",[[260,"db-popover",{"placement":[1],"id":[1],"className":[1,"classname"],"spacing":[1],"gap":[8],"animation":[8],"open":[8],"delay":[1],"width":[1],"initialized":[32],"isExpanded":[32],"_documentScrollListenerCallbackId":[32],"_observer":[32]},null,{"_ref":["watch0","watch1"],"initialized":["watch0"],"isExpanded":["watch1"]}]]],["p-a2b55626",[[260,"db-radio",{"id":[1],"checked":[8],"size":[1],"showLabel":[8,"show-label"],"showRequiredAsterisk":[8,"show-required-asterisk"],"className":[1,"classname"],"validation":[1],"name":[1],"disabled":[8],"value":[8],"required":[8],"label":[1],"initialized":[32],"_id":[32]},null,{"initialized":["watch0"],"_ref":["watch0"],"checked":["watch0"]}]]],["p-c8bdd952",[[260,"db-section",{"id":[1],"className":[1,"classname"],"spacing":[1],"width":[1],"_id":[32]}]]],["p-9d0996e9",[[260,"db-stack",{"id":[1],"className":[1,"classname"],"gap":[1],"variant":[1],"direction":[1],"alignment":[1],"justifyContent":[1,"justify-content"],"wrap":[8]}]]],["p-d6aeabf0",[[260,"db-switch",{"id":[1],"visualAid":[8,"visual-aid"],"size":[1],"showLabel":[8,"show-label"],"emphasis":[1],"showRequiredAsterisk":[8,"show-required-asterisk"],"className":[1,"classname"],"checked":[8],"value":[8],"disabled":[8],"validation":[1],"name":[1],"required":[8],"iconLeading":[1,"icon-leading"],"icon":[1],"iconTrailing":[1,"icon-trailing"],"label":[1],"_id":[32]}]]],["p-971a16c3",[[260,"db-drawer",{"open":[8],"position":[1],"backdrop":[1],"variant":[1],"id":[1],"direction":[1],"className":[1,"classname"],"spacing":[1],"width":[1],"rounded":[8],"closeButtonId":[1,"close-button-id"],"closeButtonText":[1,"close-button-text"],"initialized":[32]},null,{"open":["watch0"],"_ref":["watch1"],"initialized":["watch1"],"position":["watch1"]}]]],["p-e6e7719e",[[260,"db-accordion-item",{"id":[1],"defaultOpen":[4,"default-open"],"name":[1],"className":[1,"classname"],"disabled":[8],"headlinePlain":[1,"headline-plain"],"text":[1],"_id":[32],"_open":[32],"_name":[32],"initialized":[32]},null,{"_ref":["watch0"],"initialized":["watch0"],"name":["watch1"]}]]],["p-d4e3d1db",[[260,"db-tooltip",{"id":[1],"variant":[1],"placement":[1],"className":[1,"classname"],"emphasis":[1],"animation":[8],"delay":[1],"width":[1],"showArrow":[8,"show-arrow"],"_id":[32],"initialized":[32],"_documentScrollListenerCallbackId":[32],"_observer":[32]},null,{"_ref":["watch0"],"initialized":["watch0"]}]]],["p-f03f7076",[[260,"db-tab-item",{"active":[8],"name":[1],"className":[1,"classname"],"id":[1],"iconLeading":[1,"icon-leading"],"icon":[1],"iconTrailing":[1,"icon-trailing"],"showIconLeading":[8,"show-icon-leading"],"showIcon":[8,"show-icon"],"showIconTrailing":[8,"show-icon-trailing"],"noText":[8,"no-text"],"disabled":[8],"checked":[8],"label":[1],"_selected":[32],"_name":[32],"initialized":[32]},null,{"_ref":["watch0"],"initialized":["watch0"],"name":["watch1"]}],[260,"db-tab-list",{"id":[1],"className":[1,"classname"],"_id":[32]}],[260,"db-tab-panel",{"className":[1,"classname"],"id":[1],"content":[1]}]]],["p-5b45664d",[[260,"db-infotext",{"id":[1],"className":[1,"classname"],"icon":[1],"semantic":[1],"size":[1],"showIcon":[8,"show-icon"],"text":[1]}]]],["p-6e35a260",[[260,"db-input",{"id":[1],"invalidMessage":[1,"invalid-message"],"dataListId":[1,"data-list-id"],"message":[1],"showMessage":[8,"show-message"],"value":[8],"validMessage":[1,"valid-message"],"validation":[1],"required":[8],"minLength":[8,"min-length"],"maxLength":[8,"max-length"],"pattern":[1],"dataList":[16,"data-list"],"className":[1,"classname"],"variant":[1],"showLabel":[8,"show-label"],"showIconLeading":[8,"show-icon-leading"],"showIcon":[8,"show-icon"],"iconLeading":[1,"icon-leading"],"icon":[1],"iconTrailing":[1,"icon-trailing"],"showRequiredAsterisk":[8,"show-required-asterisk"],"showIconTrailing":[8,"show-icon-trailing"],"label":[1],"fieldSizing":[1,"field-sizing"],"name":[1],"type":[1],"multiple":[8],"placeholder":[1],"disabled":[8],"step":[8],"maxlength":[8],"minlength":[8],"max":[8],"min":[8],"readOnly":[8,"read-only"],"readonly":[8],"form":[1],"size":[2],"autocomplete":[1],"autofocus":[8],"ariaDescribedBy":[1,"aria-described-by"],"messageIcon":[1,"message-icon"],"_id":[32],"_messageId":[32],"_validMessageId":[32],"_invalidMessageId":[32],"_invalidMessage":[32],"_dataListId":[32],"_descByIds":[32],"_value":[32],"_voiceOverFallback":[32]},null,{"_ref":["watch0"],"invalidMessage":["watch0"],"_id":["watch1"],"value":["watch2"]}],[260,"db-tag",{"removeButton":[1,"remove-button"],"id":[1],"className":[1,"classname"],"semantic":[1],"emphasis":[1],"icon":[1],"showCheckState":[8,"show-check-state"],"showIcon":[8,"show-icon"],"noText":[8,"no-text"],"overflow":[8],"text":[1],"behavior":[1]}],[260,"db-custom-select-dropdown",{"id":[1],"className":[1,"classname"],"width":[1]}],[260,"db-custom-select-list",{"multiple":[4],"label":[1],"id":[1],"className":[1,"classname"]}],[260,"db-custom-select-list-item",{"id":[1],"isGroupTitle":[4,"is-group-title"],"showDivider":[4,"show-divider"],"type":[1],"checked":[8],"className":[1,"classname"],"groupTitle":[1,"group-title"],"icon":[1],"showIcon":[8,"show-icon"],"name":[1],"disabled":[8],"value":[8],"label":[1],"_id":[32],"hasDivider":[32]},null,{"isGroupTitle":["watch0"],"showDivider":["watch0"]}]]],["p-209cf793",[[260,"db-button",{"type":[1],"id":[1],"className":[1,"classname"],"disabled":[8],"iconLeading":[1,"icon-leading"],"icon":[1],"showIconLeading":[8,"show-icon-leading"],"showIcon":[8,"show-icon"],"iconTrailing":[1,"icon-trailing"],"showIconTrailing":[8,"show-icon-trailing"],"size":[1],"width":[1],"variant":[1],"noText":[8,"no-text"],"name":[1],"form":[1],"value":[1],"text":[1]}]]]]'),e)}));
|
|
1
|
+
import{p as e,b as a}from"./p-CNzNv7KB.js";export{s as setNonce}from"./p-CNzNv7KB.js";import{g as i}from"./p-DQuL1Twl.js";var l=()=>{const a=import.meta.url;const i={};if(a!==""){i.resourcesUrl=new URL(".",a).href}return e(i)};l().then((async e=>{await i();return a(JSON.parse('[["p-340bb722",[[260,"db-custom-select",{"id":[1],"invalidMessage":[1,"invalid-message"],"message":[1],"showMessage":[8,"show-message"],"ariaDescribedBy":[1,"aria-described-by"],"showNoResults":[4,"show-no-results"],"showLoading":[4,"show-loading"],"multiple":[8],"showSelectAll":[4,"show-select-all"],"showSearch":[4,"show-search"],"values":[16],"validation":[1],"options":[16],"searchValue":[1,"search-value"],"selectedLabels":[1,"selected-labels"],"transformSelectedLabels":[16,"transform-selected-labels"],"selectedType":[1,"selected-type"],"amountText":[1,"amount-text"],"validMessage":[1,"valid-message"],"required":[8],"selectAllLabel":[1,"select-all-label"],"removeTagsTexts":[16,"remove-tags-texts"],"placement":[1],"searchFilter":[16,"search-filter"],"className":[1,"classname"],"formFieldWidth":[1,"form-field-width"],"variant":[1],"showRequiredAsterisk":[8,"show-required-asterisk"],"showLabel":[8,"show-label"],"icon":[1],"showIcon":[8,"show-icon"],"label":[1],"form":[1],"name":[1],"disabled":[8],"open":[4],"dropdownWidth":[1,"dropdown-width"],"searchLabel":[1,"search-label"],"searchPlaceholder":[1,"search-placeholder"],"ariaListLabel":[1,"aria-list-label"],"loadingText":[1,"loading-text"],"noResultsText":[1,"no-results-text"],"mobileCloseButtonText":[1,"mobile-close-button-text"],"showClearSelection":[4,"show-clear-selection"],"clearSelectionText":[1,"clear-selection-text"],"placeholder":[1],"messageIcon":[1,"message-icon"],"_id":[32],"_messageId":[32],"_validMessageId":[32],"_invalidMessageId":[32],"_invalidMessage":[32],"_selectId":[32],"_labelId":[32],"_summaryId":[32],"_placeholderId":[32],"_infoTextId":[32],"_validity":[32],"_userInteraction":[32],"_descByIds":[32],"_selectedLabels":[32],"_selectedLabelsId":[32],"_voiceOverFallback":[32],"_selectedOptions":[32],"selectAllEnabled":[32],"searchEnabled":[32],"amountOptions":[32],"_values":[32],"_options":[32],"_hasNoOptions":[32],"_documentClickListenerCallbackId":[32],"_internalChangeTimestamp":[32],"_documentScrollListenerCallbackId":[32],"_observer":[32],"_searchValue":[32],"selectAllChecked":[32],"selectAllIndeterminate":[32]},null,{"detailsRef":["watch0","watch2"],"_id":["watch1"],"_descByIds":["watch2"],"showNoResults":["watch3"],"showLoading":["watch3"],"_options":["watch3"],"showSelectAll":["watch4"],"amountOptions":["watch4","watch5","watch9"],"multiple":["watch4"],"showSearch":["watch5"],"values":["watch6"],"_values":["watch7","watch9","watch12"],"selectRef":["watch7","watch16"],"validation":["watch8"],"options":["watch10","watch12"],"searchValue":["watch11"],"_selectedOptions":["watch13","watch14"],"selectedType":["watch13"],"amountText":["watch13"],"selectedLabels":["watch13"],"transformSelectedLabels":["watch13"],"selectAllIndeterminate":["watch15"],"selectAllRef":["watch15"],"invalidMessage":["watch16"]}]]],["p-72330d25",[[260,"db-tabs",{"id":[1],"name":[1],"tabs":[1],"arrowScrollDistance":[8,"arrow-scroll-distance"],"orientation":[1],"behavior":[1],"initialSelectedMode":[1,"initial-selected-mode"],"initialSelectedIndex":[8,"initial-selected-index"],"className":[1,"classname"],"alignment":[1],"width":[1],"_id":[32],"_name":[32],"initialized":[32],"showScrollLeft":[32],"showScrollRight":[32],"scrollContainer":[32]},null,{"_ref":["watch0"],"initialized":["watch0"]}]]],["p-3d7eb768",[[260,"db-header",{"forceMobile":[8,"force-mobile"],"drawerOpen":[8,"drawer-open"],"className":[1,"classname"],"id":[1],"width":[1],"burgerMenuLabel":[1,"burger-menu-label"],"initialized":[32],"forcedToMobile":[32]},null,{"initialized":["watch0"],"_ref":["watch0"]}]]],["p-16f1fa7c",[[260,"db-accordion",{"id":[1],"name":[1],"behavior":[1],"initOpenIndex":[16,"init-open-index"],"items":[1],"className":[1,"classname"],"variant":[1],"_id":[32],"_name":[32],"initialized":[32],"_initOpenIndexDone":[32]},null,{"initialized":["watch0"],"name":["watch0"],"behavior":["watch0"],"_id":["watch0"],"_ref":["watch1","watch2"],"_name":["watch1"],"_initOpenIndexDone":["watch2"],"initOpenIndex":["watch2"]}]]],["p-8b41c30e",[[260,"db-checkbox",{"id":[1],"invalidMessage":[1,"invalid-message"],"message":[1],"showMessage":[8,"show-message"],"indeterminate":[8],"checked":[8],"validMessage":[1,"valid-message"],"validation":[1],"required":[8],"className":[1,"classname"],"size":[1],"showRequiredAsterisk":[8,"show-required-asterisk"],"showLabel":[8,"show-label"],"name":[1],"disabled":[8],"value":[8],"ariaDescribedBy":[1,"aria-described-by"],"label":[1],"messageIcon":[1,"message-icon"],"initialized":[32],"_id":[32],"_messageId":[32],"_validMessageId":[32],"_invalidMessageId":[32],"_invalidMessage":[32],"_descByIds":[32],"_voiceOverFallback":[32]},null,{"_ref":["watch0","watch2","watch3"],"invalidMessage":["watch0"],"_id":["watch1"],"initialized":["watch2","watch3"],"indeterminate":["watch2"],"checked":["watch3"]}]]],["p-e9c323af",[[260,"db-navigation-item",{"subNavigationExpanded":[8,"sub-navigation-expanded"],"id":[1],"className":[1,"classname"],"width":[1],"icon":[1],"showIcon":[8,"show-icon"],"active":[4],"wrap":[8],"disabled":[8],"text":[1],"backButtonId":[1,"back-button-id"],"backButtonText":[1,"back-button-text"],"initialized":[32],"hasAreaPopup":[32],"hasSubNavigation":[32],"isSubNavigationExpanded":[32],"autoClose":[32],"subNavigationId":[32],"navigationItemSafeTriangle":[32]},null,{"subNavigationExpanded":["watch0"],"initialized":["watch1"],"_ref":["watch1"]}]]],["p-5c6da0f3",[[260,"db-notification",{"id":[1],"className":[1,"classname"],"ariaLive":[1,"aria-live"],"semantic":[1],"variant":[1],"icon":[1],"showIcon":[8,"show-icon"],"linkVariant":[1,"link-variant"],"headline":[8],"showHeadline":[8,"show-headline"],"text":[1],"timestamp":[1],"showTimestamp":[8,"show-timestamp"],"closeable":[8],"closeButtonId":[1,"close-button-id"],"closeButtonText":[1,"close-button-text"]}]]],["p-84dd974f",[[260,"db-select",{"id":[1],"invalidMessage":[1,"invalid-message"],"message":[1],"showMessage":[8,"show-message"],"value":[8],"validMessage":[1,"valid-message"],"validation":[1],"required":[8],"className":[1,"classname"],"variant":[1],"showLabel":[8,"show-label"],"showRequiredAsterisk":[8,"show-required-asterisk"],"icon":[1],"showIcon":[8,"show-icon"],"label":[1],"disabled":[8],"name":[1],"size":[2],"autocomplete":[1],"multiple":[4],"ariaDescribedBy":[1,"aria-described-by"],"options":[16],"placeholder":[1],"messageIcon":[1,"message-icon"],"_id":[32],"_messageId":[32],"_validMessageId":[32],"_invalidMessageId":[32],"_invalidMessage":[32],"_placeholderId":[32],"_descByIds":[32],"_value":[32],"initialized":[32],"_voiceOverFallback":[32]},null,{"_ref":["watch0"],"invalidMessage":["watch0"],"_id":["watch1"],"initialized":["watch1"],"value":["watch2"]}]]],["p-a3541c03",[[256,"db-textarea",{"id":[1],"invalidMessage":[1,"invalid-message"],"message":[1],"showMessage":[8,"show-message"],"value":[8],"validMessage":[1,"valid-message"],"validation":[1],"required":[8],"minLength":[8,"min-length"],"maxLength":[8,"max-length"],"className":[1,"classname"],"variant":[1],"showRequiredAsterisk":[8,"show-required-asterisk"],"showLabel":[8,"show-label"],"label":[1],"fieldSizing":[1,"field-sizing"],"resize":[1],"showResizer":[8,"show-resizer"],"disabled":[8],"readOnly":[8,"read-only"],"readonly":[8],"form":[1],"maxlength":[8],"minlength":[8],"name":[1],"wrap":[1],"spellCheck":[4,"spell-check"],"autocomplete":[1],"ariaDescribedBy":[1,"aria-described-by"],"placeholder":[1],"rows":[8],"cols":[8],"messageIcon":[1,"message-icon"],"_id":[32],"_messageId":[32],"_validMessageId":[32],"_invalidMessageId":[32],"_invalidMessage":[32],"_descByIds":[32],"_value":[32],"_voiceOverFallback":[32]},null,{"_ref":["watch0"],"invalidMessage":["watch0"],"_id":["watch1"],"value":["watch2"]}]]],["p-d7168627",[[260,"db-badge",{"placement":[1],"id":[1],"className":[1,"classname"],"semantic":[1],"size":[1],"emphasis":[1],"label":[1],"text":[1],"initialized":[32]},null,{"_ref":["watch0"],"initialized":["watch0"]}]]],["p-58007675",[[260,"db-brand",{"hideLogo":[4,"hide-logo"],"icon":[1],"showIcon":[8,"show-icon"],"id":[1],"className":[1,"classname"],"text":[1]}]]],["p-c5ff3d3f",[[260,"db-card",{"id":[1],"className":[1,"classname"],"behavior":[1],"elevationLevel":[1,"elevation-level"],"spacing":[1]}]]],["p-c8cdde8c",[[260,"db-custom-select-form-field",{"id":[1],"className":[1,"classname"]}]]],["p-02fcd4a8",[[256,"db-divider",{"id":[1],"margin":[1],"variant":[1],"emphasis":[1],"width":[1],"className":[1,"classname"]}]]],["p-bd7d1646",[[260,"db-icon",{"id":[1],"className":[1,"classname"],"icon":[1],"weight":[1],"variant":[1],"text":[1]}]]],["p-51de401e",[[260,"db-link",{"id":[1],"className":[1,"classname"],"href":[1],"target":[1],"rel":[1],"role":[1],"hreflang":[1],"disabled":[8],"size":[1],"showIcon":[8,"show-icon"],"variant":[1],"content":[1],"wrap":[8],"text":[1]}]]],["p-ce895e0c",[[260,"db-navigation",{"id":[1],"className":[1,"classname"],"_id":[32]}]]],["p-ec957247",[[260,"db-page",{"fadeIn":[8,"fade-in"],"documentOverflow":[1,"document-overflow"],"variant":[1],"id":[1],"className":[1,"classname"],"mainClass":[1,"main-class"],"fontsLoaded":[32]}]]],["p-fdf5578d",[[260,"db-popover",{"placement":[1],"id":[1],"className":[1,"classname"],"spacing":[1],"gap":[8],"animation":[8],"open":[8],"delay":[1],"width":[1],"initialized":[32],"isExpanded":[32],"_documentScrollListenerCallbackId":[32],"_observer":[32]},null,{"_ref":["watch0","watch1"],"initialized":["watch0"],"isExpanded":["watch1"]}]]],["p-a2b55626",[[260,"db-radio",{"id":[1],"checked":[8],"size":[1],"showLabel":[8,"show-label"],"showRequiredAsterisk":[8,"show-required-asterisk"],"className":[1,"classname"],"validation":[1],"name":[1],"disabled":[8],"value":[8],"required":[8],"label":[1],"initialized":[32],"_id":[32]},null,{"initialized":["watch0"],"_ref":["watch0"],"checked":["watch0"]}]]],["p-c8bdd952",[[260,"db-section",{"id":[1],"className":[1,"classname"],"spacing":[1],"width":[1],"_id":[32]}]]],["p-9d0996e9",[[260,"db-stack",{"id":[1],"className":[1,"classname"],"gap":[1],"variant":[1],"direction":[1],"alignment":[1],"justifyContent":[1,"justify-content"],"wrap":[8]}]]],["p-d6aeabf0",[[260,"db-switch",{"id":[1],"visualAid":[8,"visual-aid"],"size":[1],"showLabel":[8,"show-label"],"emphasis":[1],"showRequiredAsterisk":[8,"show-required-asterisk"],"className":[1,"classname"],"checked":[8],"value":[8],"disabled":[8],"validation":[1],"name":[1],"required":[8],"iconLeading":[1,"icon-leading"],"icon":[1],"iconTrailing":[1,"icon-trailing"],"label":[1],"_id":[32]}]]],["p-971a16c3",[[260,"db-drawer",{"open":[8],"position":[1],"backdrop":[1],"variant":[1],"id":[1],"direction":[1],"className":[1,"classname"],"spacing":[1],"width":[1],"rounded":[8],"closeButtonId":[1,"close-button-id"],"closeButtonText":[1,"close-button-text"],"initialized":[32]},null,{"open":["watch0"],"_ref":["watch1"],"initialized":["watch1"],"position":["watch1"]}]]],["p-e6e7719e",[[260,"db-accordion-item",{"id":[1],"defaultOpen":[4,"default-open"],"name":[1],"className":[1,"classname"],"disabled":[8],"headlinePlain":[1,"headline-plain"],"text":[1],"_id":[32],"_open":[32],"_name":[32],"initialized":[32]},null,{"_ref":["watch0"],"initialized":["watch0"],"name":["watch1"]}]]],["p-d4e3d1db",[[260,"db-tooltip",{"id":[1],"variant":[1],"placement":[1],"className":[1,"classname"],"emphasis":[1],"animation":[8],"delay":[1],"width":[1],"showArrow":[8,"show-arrow"],"_id":[32],"initialized":[32],"_documentScrollListenerCallbackId":[32],"_observer":[32]},null,{"_ref":["watch0"],"initialized":["watch0"]}]]],["p-f03f7076",[[260,"db-tab-item",{"active":[8],"name":[1],"className":[1,"classname"],"id":[1],"iconLeading":[1,"icon-leading"],"icon":[1],"iconTrailing":[1,"icon-trailing"],"showIconLeading":[8,"show-icon-leading"],"showIcon":[8,"show-icon"],"showIconTrailing":[8,"show-icon-trailing"],"noText":[8,"no-text"],"disabled":[8],"checked":[8],"label":[1],"_selected":[32],"_name":[32],"initialized":[32]},null,{"_ref":["watch0"],"initialized":["watch0"],"name":["watch1"]}],[260,"db-tab-list",{"id":[1],"className":[1,"classname"],"_id":[32]}],[260,"db-tab-panel",{"className":[1,"classname"],"id":[1],"content":[1]}]]],["p-5b45664d",[[260,"db-infotext",{"id":[1],"className":[1,"classname"],"icon":[1],"semantic":[1],"size":[1],"showIcon":[8,"show-icon"],"text":[1]}]]],["p-6e35a260",[[260,"db-input",{"id":[1],"invalidMessage":[1,"invalid-message"],"dataListId":[1,"data-list-id"],"message":[1],"showMessage":[8,"show-message"],"value":[8],"validMessage":[1,"valid-message"],"validation":[1],"required":[8],"minLength":[8,"min-length"],"maxLength":[8,"max-length"],"pattern":[1],"dataList":[16,"data-list"],"className":[1,"classname"],"variant":[1],"showLabel":[8,"show-label"],"showIconLeading":[8,"show-icon-leading"],"showIcon":[8,"show-icon"],"iconLeading":[1,"icon-leading"],"icon":[1],"iconTrailing":[1,"icon-trailing"],"showRequiredAsterisk":[8,"show-required-asterisk"],"showIconTrailing":[8,"show-icon-trailing"],"label":[1],"fieldSizing":[1,"field-sizing"],"name":[1],"type":[1],"multiple":[8],"placeholder":[1],"disabled":[8],"step":[8],"maxlength":[8],"minlength":[8],"max":[8],"min":[8],"readOnly":[8,"read-only"],"readonly":[8],"form":[1],"size":[2],"autocomplete":[1],"autofocus":[8],"ariaDescribedBy":[1,"aria-described-by"],"messageIcon":[1,"message-icon"],"_id":[32],"_messageId":[32],"_validMessageId":[32],"_invalidMessageId":[32],"_invalidMessage":[32],"_dataListId":[32],"_descByIds":[32],"_value":[32],"_voiceOverFallback":[32]},null,{"_ref":["watch0"],"invalidMessage":["watch0"],"_id":["watch1"],"value":["watch2"]}],[260,"db-tag",{"removeButton":[1,"remove-button"],"id":[1],"className":[1,"classname"],"semantic":[1],"emphasis":[1],"icon":[1],"showCheckState":[8,"show-check-state"],"showIcon":[8,"show-icon"],"noText":[8,"no-text"],"overflow":[8],"text":[1],"behavior":[1]}],[260,"db-custom-select-dropdown",{"id":[1],"className":[1,"classname"],"width":[1]}],[260,"db-custom-select-list",{"multiple":[4],"label":[1],"id":[1],"className":[1,"classname"]}],[260,"db-custom-select-list-item",{"id":[1],"isGroupTitle":[4,"is-group-title"],"showDivider":[4,"show-divider"],"type":[1],"checked":[8],"className":[1,"classname"],"groupTitle":[1,"group-title"],"icon":[1],"showIcon":[8,"show-icon"],"name":[1],"disabled":[8],"value":[8],"label":[1],"_id":[32],"hasDivider":[32]},null,{"isGroupTitle":["watch0"],"showDivider":["watch0"]}]]],["p-209cf793",[[260,"db-button",{"type":[1],"id":[1],"className":[1,"classname"],"disabled":[8],"iconLeading":[1,"icon-leading"],"icon":[1],"showIconLeading":[8,"show-icon-leading"],"showIcon":[8,"show-icon"],"iconTrailing":[1,"icon-trailing"],"showIconTrailing":[8,"show-icon-trailing"],"size":[1],"width":[1],"variant":[1],"noText":[8,"no-text"],"name":[1],"form":[1],"value":[1],"text":[1]}]]]]'),e)}));
|
|
2
2
|
//# sourceMappingURL=db-ux.esm.js.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,c as i,h as s,F as a}from"./p-CNzNv7KB.js";import{u as o,c as n}from"./p-YECpAE3G.js";const h=class{constructor(s){t(this,s);this.indexChange=i(this,"indexChange");this.tabSelect=i(this,"tabSelect");this._id="tabs-"+o();this._name="";this.initialized=false;this.showScrollLeft=false;this.showScrollRight=false;this.scrollContainer=null}convertTabs(){try{if(typeof this.tabs==="string"){return JSON.parse(this.tabs)}return this.tabs}catch(t){console.error(t)}return[]}evaluateScrollButtons(t){const i=t.scrollWidth>t.clientWidth;this.showScrollLeft=i&&t.scrollLeft>1;this.showScrollRight=i&&t.scrollLeft<t.scrollWidth-t.clientWidth}scroll(t){var i;let s=Number(this.arrowScrollDistance)||100;if(t){s*=-1}(i=this.scrollContainer)===null||i===void 0?void 0:i.scrollBy({top:0,left:s,behavior:"smooth"})}initTabList(){if(this._ref){const t=this._ref.querySelector(".db-tab-list");if(t){const i=t.querySelector('[role="tablist"]');if(i){i.setAttribute("aria-orientation",this.orientation||"horizontal");if(this.behavior==="arrows"){this.scrollContainer=i;this.evaluateScrollButtons(i);i.addEventListener("scroll",(()=>{this.evaluateScrollButtons(i)}))}}}}}initTabs(t){if(this._ref){const i=Array.from(this._ref.getElementsByClassName("db-tab-item"));const s=Array.from(this._ref.querySelectorAll(":is(:scope > .db-tab-panel, :scope > db-tab-panel > .db-tab-panel)"));for(const a of i){const o=i.indexOf(a);const n=a.querySelector("label");const h=a.querySelector("input");if(h&&n){if(!h.id){const t=`${this._name}-tab-${o}`;n.setAttribute("for",t);h.id=t;h.setAttribute("name",this._name);if(s.length>o){h.setAttribute("aria-controls",`${this._name}-tab-panel-${o}`)}}if(t){const t=!this.initialSelectedMode||this.initialSelectedMode==="auto";const i=this.initialSelectedIndex==null&&o===0||Number(this.initialSelectedIndex)===o;if(t&&i){h.click()}}}}for(const t of s){if(t.id)continue;const i=s.indexOf(t);t.id=`${this._name}-tab-panel-${i}`;t.setAttribute("aria-labelledby",`${this._name}-tab-${i}`)}}}handleChange(t){var i;t.stopPropagation();if(t.target){const s=t.target;const a=s.parentElement;if(a&&a.parentElement&&((i=a.parentElement)===null||i===void 0?void 0:i.nodeName)==="LI"){const i=a.parentElement.parentElement;if(i){const s=i.parentElement;if(s){const a=Array.from(s.childNodes).indexOf(i);if(this.indexChange){this.indexChange.emit(a)}if(this.tabSelect){this.tabSelect.emit(t)}}}}}}enableAttributePassing(t,i){const s=t===null||t===void 0?void 0:t.closest(i);if(t&&s){const i=s.attributes;for(let a=0;a<i.length;a++){const o=i.item(a);if(o&&(o.name.startsWith("data-")||o.name.startsWith("aria-"))){t.setAttribute(o.name,o.value);s.removeAttribute(o.name)}if(o&&o.name==="class"){const i=o.value.includes("hydrated");const a=o.value.replace("hydrated","").trim();const n=t.getAttribute("class");t.setAttribute(o.name,`${n?`${n} `:""}${a}`);if(i){s.setAttribute("class","hydrated")}else{s.removeAttribute(o.name)}}}}}watch0Fn(){if(this._ref&&this.initialized){this.initTabList();this.initTabs(true);const t=this._ref.querySelector(".db-tab-list");if(t){const i=new MutationObserver((t=>{t.forEach((t=>{if(t.removedNodes.length||t.addedNodes.length){this.initTabList();this.initTabs()}}))}));i.observe(t,{childList:true,subtree:true})}this.initialized=false}}watch0(){this.watch0Fn()}componentDidLoad(){this.enableAttributePassing(this._ref,"db-tabs");this._id=this.id||this._id;this._name=`tabs-${this.name||o()}`;this.initialized=true;this.watch0Fn()}render(){var t,i,o,h;return s("div",{key:"f2927c65e3e2199780a8d5a8f5adc04dc48241e1",class:n("db-tabs",this.className),ref:t=>{this._ref=t},id:this._id,"data-orientation":this.orientation,"data-scroll-behavior":this.behavior,"data-alignment":(t=this.alignment)!==null&&t!==void 0?t:"start","data-width":(i=this.width)!==null&&i!==void 0?i:"auto",onInput:t=>this.handleChange(t),onChange:t=>this.handleChange(t)},this.showScrollLeft?s("db-button",{class:"tabs-scroll-left",variant:"ghost",icon:"chevron_left",type:"button",noText:true,onClick:()=>this.scroll(true)},"Scroll left"):null,this.tabs?s(a,null,s("db-tab-list",null,(o=this.convertTabs())===null||o===void 0?void 0:o.map(((t,i)=>s("db-tab-item",{key:this.name+"tab-item"+i,active:t.active,label:t.label,iconTrailing:t.iconTrailing,icon:t.icon,noText:t.noText})))),(h=this.convertTabs())===null||h===void 0?void 0:h.map(((t,i)=>s("db-tab-panel",{key:this.name+"tab-panel"+i,content:t.content},t.children)))):null,this.showScrollRight?s("db-button",{class:"tabs-scroll-right",variant:"ghost",icon:"chevron_right",type:"button",noText:true,onClick:()=>this.scroll()},"Scroll right"):null,s("slot",{key:"e34a5daca2d4be08527f000f1c9f9d8d405d16dd"}))}static get watchers(){return{_ref:["watch0"],initialized:["watch0"]}}};export{h as db_tabs};
|
|
2
|
+
//# sourceMappingURL=p-72330d25.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["DBTabs","constructor","hostRef","this","_id","uuid","_name","initialized","showScrollLeft","showScrollRight","scrollContainer","convertTabs","tabs","JSON","parse","error","console","evaluateScrollButtons","tList","needsScroll","scrollWidth","clientWidth","scrollLeft","scroll","left","step","Number","arrowScrollDistance","_a","scrollBy","top","behavior","initTabList","_ref","tabList","querySelector","container","setAttribute","orientation","addEventListener","initTabs","init","tabItems","Array","from","getElementsByClassName","tabPanels","querySelectorAll","tabItem","index","indexOf","label","input","id","tabId","length","autoSelect","initialSelectedMode","shouldAutoSelect","initialSelectedIndex","click","panel","handleChange","event","stopPropagation","target","parent","parentElement","nodeName","list","indices","childNodes","indexChange","emit","tabSelect","enableAttributePassing","element","customElementSelector","closest","attributes","i","attr","item","name","startsWith","value","removeAttribute","isWebComponent","includes","replace","trim","currentClass","getAttribute","watch0Fn","observer","MutationObserver","mutations","forEach","mutation","removedNodes","addedNodes","observe","childList","subtree","watch0","componentDidLoad","render","h","key","class","cls","className","ref","el","alignment","_b","width","onInput","onChange","variant","icon","type","noText","onClick","Fragment","_c","map","tab","active","iconTrailing","_d","content","children"],"sources":["src/components/tabs/tabs.tsx"],"sourcesContent":["import { InputEvent } from \"../../shared/model\";\nimport { cls, uuid } from \"../../utils\";\nimport { DBButton } from \"../button/button\";\nimport { DBTabItem } from \"../tab-item/tab-item\";\nimport { DBTabList } from \"../tab-list/tab-list\";\nimport { DBTabPanel } from \"../tab-panel/tab-panel\";\nimport { DBSimpleTabProps, DBTabsProps, DBTabsState } from \"./model\";\n\nimport {\n Component,\n h,\n Fragment,\n Watch,\n Event,\n EventEmitter,\n Prop,\n State,\n} from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n tag: \"db-tabs\",\n})\nexport class DBTabs {\n private _ref!: HTMLDivElement | any;\n @Prop() id: DBTabsProps[\"id\"];\n @Prop() name: DBTabsProps[\"name\"];\n @Prop() tabs: DBTabsProps[\"tabs\"];\n @Prop() arrowScrollDistance: DBTabsProps[\"arrowScrollDistance\"];\n @Prop() orientation: DBTabsProps[\"orientation\"];\n @Prop() behavior: DBTabsProps[\"behavior\"];\n @Prop() initialSelectedMode: DBTabsProps[\"initialSelectedMode\"];\n @Prop() initialSelectedIndex: DBTabsProps[\"initialSelectedIndex\"];\n @Event() indexChange: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onIndexChange\"]>[number]\n > | void;\n @Event() tabSelect: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onTabSelect\"]>[number]\n > | void;\n @Prop({attribute: \"classname\"}) className: DBTabsProps[\"className\"];\n @Prop() alignment: DBTabsProps[\"alignment\"];\n @Prop() width: DBTabsProps[\"width\"];\n @State() _id = \"tabs-\" + uuid();\n @State() _name = \"\";\n @State() initialized = false;\n @State() showScrollLeft = false;\n @State() showScrollRight = false;\n @State() scrollContainer = null;\n\n convertTabs() {\n try {\n if (typeof this.tabs === \"string\") {\n return JSON.parse(this.tabs as string);\n }\n return this.tabs as DBSimpleTabProps[];\n } catch (error) {\n console.error(error);\n }\n return [];\n }\n evaluateScrollButtons(tList: Element) {\n const needsScroll = tList.scrollWidth > tList.clientWidth;\n this.showScrollLeft = needsScroll && tList.scrollLeft > 1;\n this.showScrollRight =\n needsScroll && tList.scrollLeft < tList.scrollWidth - tList.clientWidth;\n }\n scroll(left?: boolean) {\n let step = Number(this.arrowScrollDistance) || 100;\n if (left) {\n step *= -1;\n }\n this.scrollContainer?.scrollBy({\n top: 0,\n left: step,\n behavior: \"smooth\",\n });\n }\n initTabList() {\n if (this._ref) {\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const container: HTMLElement | null =\n tabList.querySelector('[role=\"tablist\"]');\n if (container) {\n container.setAttribute(\n \"aria-orientation\",\n this.orientation || \"horizontal\"\n );\n if (this.behavior === \"arrows\") {\n this.scrollContainer = container;\n this.evaluateScrollButtons(container);\n container.addEventListener(\"scroll\", () => {\n this.evaluateScrollButtons(container);\n });\n }\n }\n }\n }\n }\n initTabs(init?: boolean) {\n if (this._ref) {\n const tabItems = Array.from<Element>(\n this._ref.getElementsByClassName(\"db-tab-item\")\n );\n const tabPanels = Array.from<Element>(\n this._ref.querySelectorAll(\n \":is(:scope > .db-tab-panel, :scope > db-tab-panel > .db-tab-panel)\"\n )\n );\n for (const tabItem of tabItems) {\n const index: number = tabItems.indexOf(tabItem);\n const label = tabItem.querySelector(\"label\");\n const input = tabItem.querySelector(\"input\");\n if (input && label) {\n if (!input.id) {\n const tabId = `${this._name}-tab-${index}`;\n label.setAttribute(\"for\", tabId);\n input.id = tabId;\n input.setAttribute(\"name\", this._name);\n if (tabPanels.length > index) {\n input.setAttribute(\n \"aria-controls\",\n `${this._name}-tab-panel-${index}`\n );\n }\n }\n if (init) {\n // Auto select\n const autoSelect =\n !this.initialSelectedMode || this.initialSelectedMode === \"auto\";\n const shouldAutoSelect =\n (this.initialSelectedIndex == null && index === 0) ||\n Number(this.initialSelectedIndex) === index;\n if (autoSelect && shouldAutoSelect) {\n input.click();\n }\n }\n }\n }\n for (const panel of tabPanels) {\n if (panel.id) continue;\n const index: number = tabPanels.indexOf(panel);\n panel.id = `${this._name}-tab-panel-${index}`;\n panel.setAttribute(\"aria-labelledby\", `${this._name}-tab-${index}`);\n }\n }\n }\n handleChange(event: InputEvent<HTMLElement>) {\n event.stopPropagation();\n if (event.target) {\n const target = event.target as HTMLElement;\n const parent = target.parentElement;\n if (\n parent &&\n parent.parentElement &&\n parent.parentElement?.nodeName === \"LI\"\n ) {\n const tabItem = parent.parentElement.parentElement;\n if (tabItem) {\n const list = tabItem.parentElement;\n if (list) {\n const indices = Array.from(list.childNodes).indexOf(tabItem);\n if (this.indexChange) {\n this.indexChange.emit(indices);\n }\n if (this.tabSelect) {\n this.tabSelect.emit(event);\n }\n }\n }\n }\n }\n }\n\n /**\n * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n * @param element the ref for the component\n * @param customElementSelector the custom element like `my-component`\n */\n private enableAttributePassing(\n element: HTMLElement | null,\n customElementSelector: string\n ) {\n const parent = element?.closest(customElementSelector);\n if (element && parent) {\n const attributes = parent.attributes;\n for (let i = 0; i < attributes.length; i++) {\n const attr = attributes.item(i);\n if (\n attr &&\n (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n ) {\n element.setAttribute(attr.name, attr.value);\n parent.removeAttribute(attr.name);\n }\n if (attr && attr.name === \"class\") {\n const isWebComponent = attr.value.includes(\"hydrated\");\n const value = attr.value.replace(\"hydrated\", \"\").trim();\n const currentClass = element.getAttribute(\"class\");\n element.setAttribute(\n attr.name,\n `${currentClass ? `${currentClass} ` : \"\"}${value}`\n );\n if (isWebComponent) {\n // Stencil is using this class for lazy loading component\n parent.setAttribute(\"class\", \"hydrated\");\n } else {\n parent.removeAttribute(attr.name);\n }\n }\n }\n }\n }\n\n watch0Fn() {\n if (this._ref && this.initialized) {\n this.initTabList();\n this.initTabs(true);\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const observer = new MutationObserver((mutations) => {\n mutations.forEach((mutation) => {\n if (mutation.removedNodes.length || mutation.addedNodes.length) {\n this.initTabList();\n this.initTabs();\n }\n });\n });\n observer.observe(tabList, {\n childList: true,\n subtree: true,\n });\n }\n this.initialized = false;\n }\n }\n\n @Watch(\"_ref\")\n @Watch(\"initialized\")\n watch0() {\n this.watch0Fn();\n }\n\n componentDidLoad() {\n this.enableAttributePassing(this._ref, \"db-tabs\");\n this._id = this.id || this._id;\n this._name = `tabs-${this.name || uuid()}`;\n this.initialized = true;\n this.watch0Fn();\n }\n\n render() {\n return (\n <div\n class={cls(\"db-tabs\", this.className)}\n ref={(el: any) => {\n this._ref = el;\n }}\n id={this._id}\n data-orientation={this.orientation}\n data-scroll-behavior={this.behavior}\n data-alignment={this.alignment ?? \"start\"}\n data-width={this.width ?? \"auto\"}\n onInput={(event) => this.handleChange(event)}\n onChange={(event) => this.handleChange(event)}\n >\n {this.showScrollLeft ? (\n <db-button\n class=\"tabs-scroll-left\"\n variant=\"ghost\"\n icon=\"chevron_left\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll(true)}\n >\n Scroll left\n </db-button>\n ) : null}\n {this.tabs ? (\n <Fragment>\n <db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-item\n key={this.name + \"tab-item\" + index}\n active={tab.active}\n label={tab.label}\n iconTrailing={tab.iconTrailing}\n icon={tab.icon}\n noText={tab.noText}\n ></db-tab-item>\n ))}\n </db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-panel\n key={this.name + \"tab-panel\" + index}\n content={tab.content}\n >\n {tab.children}\n </db-tab-panel>\n ))}\n </Fragment>\n ) : null}\n {this.showScrollRight ? (\n <db-button\n class=\"tabs-scroll-right\"\n variant=\"ghost\"\n icon=\"chevron_right\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll()}\n >\n Scroll right\n </db-button>\n ) : null}\n <slot></slot>\n </div>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -100,24 +100,29 @@ const DBTabs = class {
|
|
|
100
100
|
}
|
|
101
101
|
}
|
|
102
102
|
handleChange(event) {
|
|
103
|
-
var _a
|
|
103
|
+
var _a;
|
|
104
104
|
event.stopPropagation();
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
105
|
+
if (event.target) {
|
|
106
|
+
const target = event.target;
|
|
107
|
+
const parent = target.parentElement;
|
|
108
|
+
if (parent &&
|
|
109
|
+
parent.parentElement &&
|
|
110
|
+
((_a = parent.parentElement) === null || _a === void 0 ? void 0 : _a.nodeName) === "LI") {
|
|
111
|
+
const tabItem = parent.parentElement.parentElement;
|
|
112
|
+
if (tabItem) {
|
|
113
|
+
const list = tabItem.parentElement;
|
|
114
|
+
if (list) {
|
|
115
|
+
const indices = Array.from(list.childNodes).indexOf(tabItem);
|
|
116
|
+
if (this.indexChange) {
|
|
117
|
+
this.indexChange.emit(indices);
|
|
118
|
+
}
|
|
119
|
+
if (this.tabSelect) {
|
|
120
|
+
this.tabSelect.emit(event);
|
|
121
|
+
}
|
|
122
|
+
}
|
|
123
|
+
}
|
|
116
124
|
}
|
|
117
125
|
}
|
|
118
|
-
if (this.tabSelect) {
|
|
119
|
-
this.tabSelect.emit(event);
|
|
120
|
-
}
|
|
121
126
|
}
|
|
122
127
|
/**
|
|
123
128
|
* Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.
|
|
@@ -185,10 +190,10 @@ const DBTabs = class {
|
|
|
185
190
|
}
|
|
186
191
|
render() {
|
|
187
192
|
var _a, _b, _c, _d;
|
|
188
|
-
return (h("div", { key: '
|
|
193
|
+
return (h("div", { key: 'f2927c65e3e2199780a8d5a8f5adc04dc48241e1', class: cls("db-tabs", this.className), ref: (el) => {
|
|
189
194
|
this._ref = el;
|
|
190
|
-
}, id: this._id, "data-orientation": this.orientation, "data-scroll-behavior": this.behavior, "data-alignment": (_a = this.alignment) !== null && _a !== void 0 ? _a : "start", "data-width": (_b = this.width) !== null && _b !== void 0 ? _b : "auto", onInput: (event) => this.handleChange(event) }, this.showScrollLeft ? (h("db-button", { class: "tabs-scroll-left", variant: "ghost", icon: "chevron_left", type: "button", noText: true, onClick: () => this.scroll(true) }, "Scroll left")) : null, this.tabs ? (h(Fragment, null, h("db-tab-list", null, (_c = this.convertTabs()) === null || _c === void 0 ? void 0 : _c.map((tab, index) => (h("db-tab-item", { key: this.name + "tab-item" + index, active: tab.active, label: tab.label, iconTrailing: tab.iconTrailing, icon: tab.icon, noText: tab.noText })))), (_d = this.convertTabs()) === null || _d === void 0 ? void 0 :
|
|
191
|
-
_d.map((tab, index) => (h("db-tab-panel", { key: this.name + "tab-panel" + index, content: tab.content }, tab.children))))) : null, this.showScrollRight ? (h("db-button", { class: "tabs-scroll-right", variant: "ghost", icon: "chevron_right", type: "button", noText: true, onClick: () => this.scroll() }, "Scroll right")) : null, h("slot", { key: '
|
|
195
|
+
}, id: this._id, "data-orientation": this.orientation, "data-scroll-behavior": this.behavior, "data-alignment": (_a = this.alignment) !== null && _a !== void 0 ? _a : "start", "data-width": (_b = this.width) !== null && _b !== void 0 ? _b : "auto", onInput: (event) => this.handleChange(event), onChange: (event) => this.handleChange(event) }, this.showScrollLeft ? (h("db-button", { class: "tabs-scroll-left", variant: "ghost", icon: "chevron_left", type: "button", noText: true, onClick: () => this.scroll(true) }, "Scroll left")) : null, this.tabs ? (h(Fragment, null, h("db-tab-list", null, (_c = this.convertTabs()) === null || _c === void 0 ? void 0 : _c.map((tab, index) => (h("db-tab-item", { key: this.name + "tab-item" + index, active: tab.active, label: tab.label, iconTrailing: tab.iconTrailing, icon: tab.icon, noText: tab.noText })))), (_d = this.convertTabs()) === null || _d === void 0 ? void 0 :
|
|
196
|
+
_d.map((tab, index) => (h("db-tab-panel", { key: this.name + "tab-panel" + index, content: tab.content }, tab.children))))) : null, this.showScrollRight ? (h("db-button", { class: "tabs-scroll-right", variant: "ghost", icon: "chevron_right", type: "button", noText: true, onClick: () => this.scroll() }, "Scroll right")) : null, h("slot", { key: 'e34a5daca2d4be08527f000f1c9f9d8d405d16dd' })));
|
|
192
197
|
}
|
|
193
198
|
static get watchers() { return {
|
|
194
199
|
"_ref": ["watch0"],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"db-tabs.entry.js","sources":["src/components/tabs/tabs.tsx"],"sourcesContent":["import { InputEvent } from \"../../shared/model\";\nimport { cls, uuid } from \"../../utils\";\nimport { DBButton } from \"../button/button\";\nimport { DBTabItem } from \"../tab-item/tab-item\";\nimport { DBTabList } from \"../tab-list/tab-list\";\nimport { DBTabPanel } from \"../tab-panel/tab-panel\";\nimport { DBSimpleTabProps, DBTabsProps, DBTabsState } from \"./model\";\n\nimport {\n Component,\n h,\n Fragment,\n Watch,\n Event,\n EventEmitter,\n Prop,\n State,\n} from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n tag: \"db-tabs\",\n})\nexport class DBTabs {\n private _ref!: HTMLDivElement | any;\n @Prop() id: DBTabsProps[\"id\"];\n @Prop() name: DBTabsProps[\"name\"];\n @Prop() tabs: DBTabsProps[\"tabs\"];\n @Prop() arrowScrollDistance: DBTabsProps[\"arrowScrollDistance\"];\n @Prop() orientation: DBTabsProps[\"orientation\"];\n @Prop() behavior: DBTabsProps[\"behavior\"];\n @Prop() initialSelectedMode: DBTabsProps[\"initialSelectedMode\"];\n @Prop() initialSelectedIndex: DBTabsProps[\"initialSelectedIndex\"];\n @Event() indexChange: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onIndexChange\"]>[number]\n > | void;\n @Event() tabSelect: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onTabSelect\"]>[number]\n > | void;\n @Prop({attribute: \"classname\"}) className: DBTabsProps[\"className\"];\n @Prop() alignment: DBTabsProps[\"alignment\"];\n @Prop() width: DBTabsProps[\"width\"];\n @State() _id = \"tabs-\" + uuid();\n @State() _name = \"\";\n @State() initialized = false;\n @State() showScrollLeft = false;\n @State() showScrollRight = false;\n @State() scrollContainer = null;\n\n convertTabs() {\n try {\n if (typeof this.tabs === \"string\") {\n return JSON.parse(this.tabs as string);\n }\n return this.tabs as DBSimpleTabProps[];\n } catch (error) {\n console.error(error);\n }\n return [];\n }\n evaluateScrollButtons(tList: Element) {\n const needsScroll = tList.scrollWidth > tList.clientWidth;\n this.showScrollLeft = needsScroll && tList.scrollLeft > 1;\n this.showScrollRight =\n needsScroll && tList.scrollLeft < tList.scrollWidth - tList.clientWidth;\n }\n scroll(left?: boolean) {\n let step = Number(this.arrowScrollDistance) || 100;\n if (left) {\n step *= -1;\n }\n this.scrollContainer?.scrollBy({\n top: 0,\n left: step,\n behavior: \"smooth\",\n });\n }\n initTabList() {\n if (this._ref) {\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const container: HTMLElement | null =\n tabList.querySelector('[role=\"tablist\"]');\n if (container) {\n container.setAttribute(\n \"aria-orientation\",\n this.orientation || \"horizontal\"\n );\n if (this.behavior === \"arrows\") {\n this.scrollContainer = container;\n this.evaluateScrollButtons(container);\n container.addEventListener(\"scroll\", () => {\n this.evaluateScrollButtons(container);\n });\n }\n }\n }\n }\n }\n initTabs(init?: boolean) {\n if (this._ref) {\n const tabItems = Array.from<Element>(\n this._ref.getElementsByClassName(\"db-tab-item\")\n );\n const tabPanels = Array.from<Element>(\n this._ref.querySelectorAll(\n \":is(:scope > .db-tab-panel, :scope > db-tab-panel > .db-tab-panel)\"\n )\n );\n for (const tabItem of tabItems) {\n const index: number = tabItems.indexOf(tabItem);\n const label = tabItem.querySelector(\"label\");\n const input = tabItem.querySelector(\"input\");\n if (input && label) {\n if (!input.id) {\n const tabId = `${this._name}-tab-${index}`;\n label.setAttribute(\"for\", tabId);\n input.id = tabId;\n input.setAttribute(\"name\", this._name);\n if (tabPanels.length > index) {\n input.setAttribute(\n \"aria-controls\",\n `${this._name}-tab-panel-${index}`\n );\n }\n }\n if (init) {\n // Auto select\n const autoSelect =\n !this.initialSelectedMode || this.initialSelectedMode === \"auto\";\n const shouldAutoSelect =\n (this.initialSelectedIndex == null && index === 0) ||\n Number(this.initialSelectedIndex) === index;\n if (autoSelect && shouldAutoSelect) {\n input.click();\n }\n }\n }\n }\n for (const panel of tabPanels) {\n if (panel.id) continue;\n const index: number = tabPanels.indexOf(panel);\n panel.id = `${this._name}-tab-panel-${index}`;\n panel.setAttribute(\"aria-labelledby\", `${this._name}-tab-${index}`);\n }\n }\n }\n handleChange(event: InputEvent<HTMLElement>) {\n event.stopPropagation();\n const closest: ((element: string) => HTMLElement | null) | undefined = (\n event.target as any\n )?.closest;\n if (!closest) return;\n const list = closest(\"ul\");\n const listItem =\n // db-tab-item for angular and stencil wrapping elements\n closest(\"db-tab-item\") ?? closest(\"li\");\n if (list !== null && listItem !== null) {\n const indices = Array.from(list.childNodes).indexOf(listItem);\n if (this.indexChange) {\n this.indexChange.emit(indices);\n }\n }\n if (this.tabSelect) {\n this.tabSelect.emit(event);\n }\n }\n\n /**\n * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n * @param element the ref for the component\n * @param customElementSelector the custom element like `my-component`\n */\n private enableAttributePassing(\n element: HTMLElement | null,\n customElementSelector: string\n ) {\n const parent = element?.closest(customElementSelector);\n if (element && parent) {\n const attributes = parent.attributes;\n for (let i = 0; i < attributes.length; i++) {\n const attr = attributes.item(i);\n if (\n attr &&\n (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n ) {\n element.setAttribute(attr.name, attr.value);\n parent.removeAttribute(attr.name);\n }\n if (attr && attr.name === \"class\") {\n const isWebComponent = attr.value.includes(\"hydrated\");\n const value = attr.value.replace(\"hydrated\", \"\").trim();\n const currentClass = element.getAttribute(\"class\");\n element.setAttribute(\n attr.name,\n `${currentClass ? `${currentClass} ` : \"\"}${value}`\n );\n if (isWebComponent) {\n // Stencil is using this class for lazy loading component\n parent.setAttribute(\"class\", \"hydrated\");\n } else {\n parent.removeAttribute(attr.name);\n }\n }\n }\n }\n }\n\n watch0Fn() {\n if (this._ref && this.initialized) {\n this.initTabList();\n this.initTabs(true);\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const observer = new MutationObserver((mutations) => {\n mutations.forEach((mutation) => {\n if (mutation.removedNodes.length || mutation.addedNodes.length) {\n this.initTabList();\n this.initTabs();\n }\n });\n });\n observer.observe(tabList, {\n childList: true,\n subtree: true,\n });\n }\n this.initialized = false;\n }\n }\n\n @Watch(\"_ref\")\n @Watch(\"initialized\")\n watch0() {\n this.watch0Fn();\n }\n\n componentDidLoad() {\n this.enableAttributePassing(this._ref, \"db-tabs\");\n this._id = this.id || this._id;\n this._name = `tabs-${this.name || uuid()}`;\n this.initialized = true;\n this.watch0Fn();\n }\n\n render() {\n return (\n <div\n class={cls(\"db-tabs\", this.className)}\n ref={(el: any) => {\n this._ref = el;\n }}\n id={this._id}\n data-orientation={this.orientation}\n data-scroll-behavior={this.behavior}\n data-alignment={this.alignment ?? \"start\"}\n data-width={this.width ?? \"auto\"}\n onInput={(event) => this.handleChange(event)}\n >\n {this.showScrollLeft ? (\n <db-button\n class=\"tabs-scroll-left\"\n variant=\"ghost\"\n icon=\"chevron_left\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll(true)}\n >\n Scroll left\n </db-button>\n ) : null}\n {this.tabs ? (\n <Fragment>\n <db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-item\n key={this.name + \"tab-item\" + index}\n active={tab.active}\n label={tab.label}\n iconTrailing={tab.iconTrailing}\n icon={tab.icon}\n noText={tab.noText}\n ></db-tab-item>\n ))}\n </db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-panel\n key={this.name + \"tab-panel\" + index}\n content={tab.content}\n >\n {tab.children}\n </db-tab-panel>\n ))}\n </Fragment>\n ) : null}\n {this.showScrollRight ? (\n <db-button\n class=\"tabs-scroll-right\"\n variant=\"ghost\"\n icon=\"chevron_right\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll()}\n >\n Scroll right\n </db-button>\n ) : null}\n <slot></slot>\n </div>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"db-tabs.entry.js","sources":["src/components/tabs/tabs.tsx"],"sourcesContent":["import { InputEvent } from \"../../shared/model\";\nimport { cls, uuid } from \"../../utils\";\nimport { DBButton } from \"../button/button\";\nimport { DBTabItem } from \"../tab-item/tab-item\";\nimport { DBTabList } from \"../tab-list/tab-list\";\nimport { DBTabPanel } from \"../tab-panel/tab-panel\";\nimport { DBSimpleTabProps, DBTabsProps, DBTabsState } from \"./model\";\n\nimport {\n Component,\n h,\n Fragment,\n Watch,\n Event,\n EventEmitter,\n Prop,\n State,\n} from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n tag: \"db-tabs\",\n})\nexport class DBTabs {\n private _ref!: HTMLDivElement | any;\n @Prop() id: DBTabsProps[\"id\"];\n @Prop() name: DBTabsProps[\"name\"];\n @Prop() tabs: DBTabsProps[\"tabs\"];\n @Prop() arrowScrollDistance: DBTabsProps[\"arrowScrollDistance\"];\n @Prop() orientation: DBTabsProps[\"orientation\"];\n @Prop() behavior: DBTabsProps[\"behavior\"];\n @Prop() initialSelectedMode: DBTabsProps[\"initialSelectedMode\"];\n @Prop() initialSelectedIndex: DBTabsProps[\"initialSelectedIndex\"];\n @Event() indexChange: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onIndexChange\"]>[number]\n > | void;\n @Event() tabSelect: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onTabSelect\"]>[number]\n > | void;\n @Prop({attribute: \"classname\"}) className: DBTabsProps[\"className\"];\n @Prop() alignment: DBTabsProps[\"alignment\"];\n @Prop() width: DBTabsProps[\"width\"];\n @State() _id = \"tabs-\" + uuid();\n @State() _name = \"\";\n @State() initialized = false;\n @State() showScrollLeft = false;\n @State() showScrollRight = false;\n @State() scrollContainer = null;\n\n convertTabs() {\n try {\n if (typeof this.tabs === \"string\") {\n return JSON.parse(this.tabs as string);\n }\n return this.tabs as DBSimpleTabProps[];\n } catch (error) {\n console.error(error);\n }\n return [];\n }\n evaluateScrollButtons(tList: Element) {\n const needsScroll = tList.scrollWidth > tList.clientWidth;\n this.showScrollLeft = needsScroll && tList.scrollLeft > 1;\n this.showScrollRight =\n needsScroll && tList.scrollLeft < tList.scrollWidth - tList.clientWidth;\n }\n scroll(left?: boolean) {\n let step = Number(this.arrowScrollDistance) || 100;\n if (left) {\n step *= -1;\n }\n this.scrollContainer?.scrollBy({\n top: 0,\n left: step,\n behavior: \"smooth\",\n });\n }\n initTabList() {\n if (this._ref) {\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const container: HTMLElement | null =\n tabList.querySelector('[role=\"tablist\"]');\n if (container) {\n container.setAttribute(\n \"aria-orientation\",\n this.orientation || \"horizontal\"\n );\n if (this.behavior === \"arrows\") {\n this.scrollContainer = container;\n this.evaluateScrollButtons(container);\n container.addEventListener(\"scroll\", () => {\n this.evaluateScrollButtons(container);\n });\n }\n }\n }\n }\n }\n initTabs(init?: boolean) {\n if (this._ref) {\n const tabItems = Array.from<Element>(\n this._ref.getElementsByClassName(\"db-tab-item\")\n );\n const tabPanels = Array.from<Element>(\n this._ref.querySelectorAll(\n \":is(:scope > .db-tab-panel, :scope > db-tab-panel > .db-tab-panel)\"\n )\n );\n for (const tabItem of tabItems) {\n const index: number = tabItems.indexOf(tabItem);\n const label = tabItem.querySelector(\"label\");\n const input = tabItem.querySelector(\"input\");\n if (input && label) {\n if (!input.id) {\n const tabId = `${this._name}-tab-${index}`;\n label.setAttribute(\"for\", tabId);\n input.id = tabId;\n input.setAttribute(\"name\", this._name);\n if (tabPanels.length > index) {\n input.setAttribute(\n \"aria-controls\",\n `${this._name}-tab-panel-${index}`\n );\n }\n }\n if (init) {\n // Auto select\n const autoSelect =\n !this.initialSelectedMode || this.initialSelectedMode === \"auto\";\n const shouldAutoSelect =\n (this.initialSelectedIndex == null && index === 0) ||\n Number(this.initialSelectedIndex) === index;\n if (autoSelect && shouldAutoSelect) {\n input.click();\n }\n }\n }\n }\n for (const panel of tabPanels) {\n if (panel.id) continue;\n const index: number = tabPanels.indexOf(panel);\n panel.id = `${this._name}-tab-panel-${index}`;\n panel.setAttribute(\"aria-labelledby\", `${this._name}-tab-${index}`);\n }\n }\n }\n handleChange(event: InputEvent<HTMLElement>) {\n event.stopPropagation();\n if (event.target) {\n const target = event.target as HTMLElement;\n const parent = target.parentElement;\n if (\n parent &&\n parent.parentElement &&\n parent.parentElement?.nodeName === \"LI\"\n ) {\n const tabItem = parent.parentElement.parentElement;\n if (tabItem) {\n const list = tabItem.parentElement;\n if (list) {\n const indices = Array.from(list.childNodes).indexOf(tabItem);\n if (this.indexChange) {\n this.indexChange.emit(indices);\n }\n if (this.tabSelect) {\n this.tabSelect.emit(event);\n }\n }\n }\n }\n }\n }\n\n /**\n * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n * @param element the ref for the component\n * @param customElementSelector the custom element like `my-component`\n */\n private enableAttributePassing(\n element: HTMLElement | null,\n customElementSelector: string\n ) {\n const parent = element?.closest(customElementSelector);\n if (element && parent) {\n const attributes = parent.attributes;\n for (let i = 0; i < attributes.length; i++) {\n const attr = attributes.item(i);\n if (\n attr &&\n (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n ) {\n element.setAttribute(attr.name, attr.value);\n parent.removeAttribute(attr.name);\n }\n if (attr && attr.name === \"class\") {\n const isWebComponent = attr.value.includes(\"hydrated\");\n const value = attr.value.replace(\"hydrated\", \"\").trim();\n const currentClass = element.getAttribute(\"class\");\n element.setAttribute(\n attr.name,\n `${currentClass ? `${currentClass} ` : \"\"}${value}`\n );\n if (isWebComponent) {\n // Stencil is using this class for lazy loading component\n parent.setAttribute(\"class\", \"hydrated\");\n } else {\n parent.removeAttribute(attr.name);\n }\n }\n }\n }\n }\n\n watch0Fn() {\n if (this._ref && this.initialized) {\n this.initTabList();\n this.initTabs(true);\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const observer = new MutationObserver((mutations) => {\n mutations.forEach((mutation) => {\n if (mutation.removedNodes.length || mutation.addedNodes.length) {\n this.initTabList();\n this.initTabs();\n }\n });\n });\n observer.observe(tabList, {\n childList: true,\n subtree: true,\n });\n }\n this.initialized = false;\n }\n }\n\n @Watch(\"_ref\")\n @Watch(\"initialized\")\n watch0() {\n this.watch0Fn();\n }\n\n componentDidLoad() {\n this.enableAttributePassing(this._ref, \"db-tabs\");\n this._id = this.id || this._id;\n this._name = `tabs-${this.name || uuid()}`;\n this.initialized = true;\n this.watch0Fn();\n }\n\n render() {\n return (\n <div\n class={cls(\"db-tabs\", this.className)}\n ref={(el: any) => {\n this._ref = el;\n }}\n id={this._id}\n data-orientation={this.orientation}\n data-scroll-behavior={this.behavior}\n data-alignment={this.alignment ?? \"start\"}\n data-width={this.width ?? \"auto\"}\n onInput={(event) => this.handleChange(event)}\n onChange={(event) => this.handleChange(event)}\n >\n {this.showScrollLeft ? (\n <db-button\n class=\"tabs-scroll-left\"\n variant=\"ghost\"\n icon=\"chevron_left\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll(true)}\n >\n Scroll left\n </db-button>\n ) : null}\n {this.tabs ? (\n <Fragment>\n <db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-item\n key={this.name + \"tab-item\" + index}\n active={tab.active}\n label={tab.label}\n iconTrailing={tab.iconTrailing}\n icon={tab.icon}\n noText={tab.noText}\n ></db-tab-item>\n ))}\n </db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-panel\n key={this.name + \"tab-panel\" + index}\n content={tab.content}\n >\n {tab.children}\n </db-tab-panel>\n ))}\n </Fragment>\n ) : null}\n {this.showScrollRight ? (\n <db-button\n class=\"tabs-scroll-right\"\n variant=\"ghost\"\n icon=\"chevron_right\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll()}\n >\n Scroll right\n </db-button>\n ) : null}\n <slot></slot>\n </div>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@db-ux/wc-core-components",
|
|
3
|
-
"version": "3.0.
|
|
3
|
+
"version": "3.0.2",
|
|
4
4
|
"description": "Stencil components for @db-ux/core-components",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -42,7 +42,7 @@
|
|
|
42
42
|
},
|
|
43
43
|
"web-types": "./dist/web-types.json",
|
|
44
44
|
"dependencies": {
|
|
45
|
-
"@db-ux/core-components": "3.0.
|
|
46
|
-
"@db-ux/core-foundations": "3.0.
|
|
45
|
+
"@db-ux/core-components": "3.0.2",
|
|
46
|
+
"@db-ux/core-foundations": "3.0.2"
|
|
47
47
|
}
|
|
48
48
|
}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as t,c as i,h as s,F as a}from"./p-CNzNv7KB.js";import{u as n,c as o}from"./p-YECpAE3G.js";const l=class{constructor(s){t(this,s);this.indexChange=i(this,"indexChange");this.tabSelect=i(this,"tabSelect");this._id="tabs-"+n();this._name="";this.initialized=false;this.showScrollLeft=false;this.showScrollRight=false;this.scrollContainer=null}convertTabs(){try{if(typeof this.tabs==="string"){return JSON.parse(this.tabs)}return this.tabs}catch(t){console.error(t)}return[]}evaluateScrollButtons(t){const i=t.scrollWidth>t.clientWidth;this.showScrollLeft=i&&t.scrollLeft>1;this.showScrollRight=i&&t.scrollLeft<t.scrollWidth-t.clientWidth}scroll(t){var i;let s=Number(this.arrowScrollDistance)||100;if(t){s*=-1}(i=this.scrollContainer)===null||i===void 0?void 0:i.scrollBy({top:0,left:s,behavior:"smooth"})}initTabList(){if(this._ref){const t=this._ref.querySelector(".db-tab-list");if(t){const i=t.querySelector('[role="tablist"]');if(i){i.setAttribute("aria-orientation",this.orientation||"horizontal");if(this.behavior==="arrows"){this.scrollContainer=i;this.evaluateScrollButtons(i);i.addEventListener("scroll",(()=>{this.evaluateScrollButtons(i)}))}}}}}initTabs(t){if(this._ref){const i=Array.from(this._ref.getElementsByClassName("db-tab-item"));const s=Array.from(this._ref.querySelectorAll(":is(:scope > .db-tab-panel, :scope > db-tab-panel > .db-tab-panel)"));for(const a of i){const n=i.indexOf(a);const o=a.querySelector("label");const l=a.querySelector("input");if(l&&o){if(!l.id){const t=`${this._name}-tab-${n}`;o.setAttribute("for",t);l.id=t;l.setAttribute("name",this._name);if(s.length>n){l.setAttribute("aria-controls",`${this._name}-tab-panel-${n}`)}}if(t){const t=!this.initialSelectedMode||this.initialSelectedMode==="auto";const i=this.initialSelectedIndex==null&&n===0||Number(this.initialSelectedIndex)===n;if(t&&i){l.click()}}}}for(const t of s){if(t.id)continue;const i=s.indexOf(t);t.id=`${this._name}-tab-panel-${i}`;t.setAttribute("aria-labelledby",`${this._name}-tab-${i}`)}}}handleChange(t){var i,s;t.stopPropagation();const a=(i=t.target)===null||i===void 0?void 0:i.closest;if(!a)return;const n=a("ul");const o=(s=a("db-tab-item"))!==null&&s!==void 0?s:a("li");if(n!==null&&o!==null){const t=Array.from(n.childNodes).indexOf(o);if(this.indexChange){this.indexChange.emit(t)}}if(this.tabSelect){this.tabSelect.emit(t)}}enableAttributePassing(t,i){const s=t===null||t===void 0?void 0:t.closest(i);if(t&&s){const i=s.attributes;for(let a=0;a<i.length;a++){const n=i.item(a);if(n&&(n.name.startsWith("data-")||n.name.startsWith("aria-"))){t.setAttribute(n.name,n.value);s.removeAttribute(n.name)}if(n&&n.name==="class"){const i=n.value.includes("hydrated");const a=n.value.replace("hydrated","").trim();const o=t.getAttribute("class");t.setAttribute(n.name,`${o?`${o} `:""}${a}`);if(i){s.setAttribute("class","hydrated")}else{s.removeAttribute(n.name)}}}}}watch0Fn(){if(this._ref&&this.initialized){this.initTabList();this.initTabs(true);const t=this._ref.querySelector(".db-tab-list");if(t){const i=new MutationObserver((t=>{t.forEach((t=>{if(t.removedNodes.length||t.addedNodes.length){this.initTabList();this.initTabs()}}))}));i.observe(t,{childList:true,subtree:true})}this.initialized=false}}watch0(){this.watch0Fn()}componentDidLoad(){this.enableAttributePassing(this._ref,"db-tabs");this._id=this.id||this._id;this._name=`tabs-${this.name||n()}`;this.initialized=true;this.watch0Fn()}render(){var t,i,n,l;return s("div",{key:"2f9bfdff6295a23f68661c47804c32ca3dd4a311",class:o("db-tabs",this.className),ref:t=>{this._ref=t},id:this._id,"data-orientation":this.orientation,"data-scroll-behavior":this.behavior,"data-alignment":(t=this.alignment)!==null&&t!==void 0?t:"start","data-width":(i=this.width)!==null&&i!==void 0?i:"auto",onInput:t=>this.handleChange(t)},this.showScrollLeft?s("db-button",{class:"tabs-scroll-left",variant:"ghost",icon:"chevron_left",type:"button",noText:true,onClick:()=>this.scroll(true)},"Scroll left"):null,this.tabs?s(a,null,s("db-tab-list",null,(n=this.convertTabs())===null||n===void 0?void 0:n.map(((t,i)=>s("db-tab-item",{key:this.name+"tab-item"+i,active:t.active,label:t.label,iconTrailing:t.iconTrailing,icon:t.icon,noText:t.noText})))),(l=this.convertTabs())===null||l===void 0?void 0:l.map(((t,i)=>s("db-tab-panel",{key:this.name+"tab-panel"+i,content:t.content},t.children)))):null,this.showScrollRight?s("db-button",{class:"tabs-scroll-right",variant:"ghost",icon:"chevron_right",type:"button",noText:true,onClick:()=>this.scroll()},"Scroll right"):null,s("slot",{key:"c31db6d7a7a76b726d7f17bcf844c948427e8b1a"}))}static get watchers(){return{_ref:["watch0"],initialized:["watch0"]}}};export{l as db_tabs};
|
|
2
|
-
//# sourceMappingURL=p-6c4115c8.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["DBTabs","constructor","hostRef","this","_id","uuid","_name","initialized","showScrollLeft","showScrollRight","scrollContainer","convertTabs","tabs","JSON","parse","error","console","evaluateScrollButtons","tList","needsScroll","scrollWidth","clientWidth","scrollLeft","scroll","left","step","Number","arrowScrollDistance","_a","scrollBy","top","behavior","initTabList","_ref","tabList","querySelector","container","setAttribute","orientation","addEventListener","initTabs","init","tabItems","Array","from","getElementsByClassName","tabPanels","querySelectorAll","tabItem","index","indexOf","label","input","id","tabId","length","autoSelect","initialSelectedMode","shouldAutoSelect","initialSelectedIndex","click","panel","handleChange","event","stopPropagation","closest","target","list","listItem","_b","indices","childNodes","indexChange","emit","tabSelect","enableAttributePassing","element","customElementSelector","parent","attributes","i","attr","item","name","startsWith","value","removeAttribute","isWebComponent","includes","replace","trim","currentClass","getAttribute","watch0Fn","observer","MutationObserver","mutations","forEach","mutation","removedNodes","addedNodes","observe","childList","subtree","watch0","componentDidLoad","render","h","key","class","cls","className","ref","el","alignment","width","onInput","variant","icon","type","noText","onClick","Fragment","_c","map","tab","active","iconTrailing","_d","content","children"],"sources":["src/components/tabs/tabs.tsx"],"sourcesContent":["import { InputEvent } from \"../../shared/model\";\nimport { cls, uuid } from \"../../utils\";\nimport { DBButton } from \"../button/button\";\nimport { DBTabItem } from \"../tab-item/tab-item\";\nimport { DBTabList } from \"../tab-list/tab-list\";\nimport { DBTabPanel } from \"../tab-panel/tab-panel\";\nimport { DBSimpleTabProps, DBTabsProps, DBTabsState } from \"./model\";\n\nimport {\n Component,\n h,\n Fragment,\n Watch,\n Event,\n EventEmitter,\n Prop,\n State,\n} from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n tag: \"db-tabs\",\n})\nexport class DBTabs {\n private _ref!: HTMLDivElement | any;\n @Prop() id: DBTabsProps[\"id\"];\n @Prop() name: DBTabsProps[\"name\"];\n @Prop() tabs: DBTabsProps[\"tabs\"];\n @Prop() arrowScrollDistance: DBTabsProps[\"arrowScrollDistance\"];\n @Prop() orientation: DBTabsProps[\"orientation\"];\n @Prop() behavior: DBTabsProps[\"behavior\"];\n @Prop() initialSelectedMode: DBTabsProps[\"initialSelectedMode\"];\n @Prop() initialSelectedIndex: DBTabsProps[\"initialSelectedIndex\"];\n @Event() indexChange: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onIndexChange\"]>[number]\n > | void;\n @Event() tabSelect: EventEmitter<\n Parameters<Required<DBTabsProps>[\"onTabSelect\"]>[number]\n > | void;\n @Prop({attribute: \"classname\"}) className: DBTabsProps[\"className\"];\n @Prop() alignment: DBTabsProps[\"alignment\"];\n @Prop() width: DBTabsProps[\"width\"];\n @State() _id = \"tabs-\" + uuid();\n @State() _name = \"\";\n @State() initialized = false;\n @State() showScrollLeft = false;\n @State() showScrollRight = false;\n @State() scrollContainer = null;\n\n convertTabs() {\n try {\n if (typeof this.tabs === \"string\") {\n return JSON.parse(this.tabs as string);\n }\n return this.tabs as DBSimpleTabProps[];\n } catch (error) {\n console.error(error);\n }\n return [];\n }\n evaluateScrollButtons(tList: Element) {\n const needsScroll = tList.scrollWidth > tList.clientWidth;\n this.showScrollLeft = needsScroll && tList.scrollLeft > 1;\n this.showScrollRight =\n needsScroll && tList.scrollLeft < tList.scrollWidth - tList.clientWidth;\n }\n scroll(left?: boolean) {\n let step = Number(this.arrowScrollDistance) || 100;\n if (left) {\n step *= -1;\n }\n this.scrollContainer?.scrollBy({\n top: 0,\n left: step,\n behavior: \"smooth\",\n });\n }\n initTabList() {\n if (this._ref) {\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const container: HTMLElement | null =\n tabList.querySelector('[role=\"tablist\"]');\n if (container) {\n container.setAttribute(\n \"aria-orientation\",\n this.orientation || \"horizontal\"\n );\n if (this.behavior === \"arrows\") {\n this.scrollContainer = container;\n this.evaluateScrollButtons(container);\n container.addEventListener(\"scroll\", () => {\n this.evaluateScrollButtons(container);\n });\n }\n }\n }\n }\n }\n initTabs(init?: boolean) {\n if (this._ref) {\n const tabItems = Array.from<Element>(\n this._ref.getElementsByClassName(\"db-tab-item\")\n );\n const tabPanels = Array.from<Element>(\n this._ref.querySelectorAll(\n \":is(:scope > .db-tab-panel, :scope > db-tab-panel > .db-tab-panel)\"\n )\n );\n for (const tabItem of tabItems) {\n const index: number = tabItems.indexOf(tabItem);\n const label = tabItem.querySelector(\"label\");\n const input = tabItem.querySelector(\"input\");\n if (input && label) {\n if (!input.id) {\n const tabId = `${this._name}-tab-${index}`;\n label.setAttribute(\"for\", tabId);\n input.id = tabId;\n input.setAttribute(\"name\", this._name);\n if (tabPanels.length > index) {\n input.setAttribute(\n \"aria-controls\",\n `${this._name}-tab-panel-${index}`\n );\n }\n }\n if (init) {\n // Auto select\n const autoSelect =\n !this.initialSelectedMode || this.initialSelectedMode === \"auto\";\n const shouldAutoSelect =\n (this.initialSelectedIndex == null && index === 0) ||\n Number(this.initialSelectedIndex) === index;\n if (autoSelect && shouldAutoSelect) {\n input.click();\n }\n }\n }\n }\n for (const panel of tabPanels) {\n if (panel.id) continue;\n const index: number = tabPanels.indexOf(panel);\n panel.id = `${this._name}-tab-panel-${index}`;\n panel.setAttribute(\"aria-labelledby\", `${this._name}-tab-${index}`);\n }\n }\n }\n handleChange(event: InputEvent<HTMLElement>) {\n event.stopPropagation();\n const closest: ((element: string) => HTMLElement | null) | undefined = (\n event.target as any\n )?.closest;\n if (!closest) return;\n const list = closest(\"ul\");\n const listItem =\n // db-tab-item for angular and stencil wrapping elements\n closest(\"db-tab-item\") ?? closest(\"li\");\n if (list !== null && listItem !== null) {\n const indices = Array.from(list.childNodes).indexOf(listItem);\n if (this.indexChange) {\n this.indexChange.emit(indices);\n }\n }\n if (this.tabSelect) {\n this.tabSelect.emit(event);\n }\n }\n\n /**\n * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n * @param element the ref for the component\n * @param customElementSelector the custom element like `my-component`\n */\n private enableAttributePassing(\n element: HTMLElement | null,\n customElementSelector: string\n ) {\n const parent = element?.closest(customElementSelector);\n if (element && parent) {\n const attributes = parent.attributes;\n for (let i = 0; i < attributes.length; i++) {\n const attr = attributes.item(i);\n if (\n attr &&\n (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n ) {\n element.setAttribute(attr.name, attr.value);\n parent.removeAttribute(attr.name);\n }\n if (attr && attr.name === \"class\") {\n const isWebComponent = attr.value.includes(\"hydrated\");\n const value = attr.value.replace(\"hydrated\", \"\").trim();\n const currentClass = element.getAttribute(\"class\");\n element.setAttribute(\n attr.name,\n `${currentClass ? `${currentClass} ` : \"\"}${value}`\n );\n if (isWebComponent) {\n // Stencil is using this class for lazy loading component\n parent.setAttribute(\"class\", \"hydrated\");\n } else {\n parent.removeAttribute(attr.name);\n }\n }\n }\n }\n }\n\n watch0Fn() {\n if (this._ref && this.initialized) {\n this.initTabList();\n this.initTabs(true);\n const tabList = this._ref.querySelector(\".db-tab-list\");\n if (tabList) {\n const observer = new MutationObserver((mutations) => {\n mutations.forEach((mutation) => {\n if (mutation.removedNodes.length || mutation.addedNodes.length) {\n this.initTabList();\n this.initTabs();\n }\n });\n });\n observer.observe(tabList, {\n childList: true,\n subtree: true,\n });\n }\n this.initialized = false;\n }\n }\n\n @Watch(\"_ref\")\n @Watch(\"initialized\")\n watch0() {\n this.watch0Fn();\n }\n\n componentDidLoad() {\n this.enableAttributePassing(this._ref, \"db-tabs\");\n this._id = this.id || this._id;\n this._name = `tabs-${this.name || uuid()}`;\n this.initialized = true;\n this.watch0Fn();\n }\n\n render() {\n return (\n <div\n class={cls(\"db-tabs\", this.className)}\n ref={(el: any) => {\n this._ref = el;\n }}\n id={this._id}\n data-orientation={this.orientation}\n data-scroll-behavior={this.behavior}\n data-alignment={this.alignment ?? \"start\"}\n data-width={this.width ?? \"auto\"}\n onInput={(event) => this.handleChange(event)}\n >\n {this.showScrollLeft ? (\n <db-button\n class=\"tabs-scroll-left\"\n variant=\"ghost\"\n icon=\"chevron_left\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll(true)}\n >\n Scroll left\n </db-button>\n ) : null}\n {this.tabs ? (\n <Fragment>\n <db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-item\n key={this.name + \"tab-item\" + index}\n active={tab.active}\n label={tab.label}\n iconTrailing={tab.iconTrailing}\n icon={tab.icon}\n noText={tab.noText}\n ></db-tab-item>\n ))}\n </db-tab-list>\n {this.convertTabs()?.map((tab, index) => (\n <db-tab-panel\n key={this.name + \"tab-panel\" + index}\n content={tab.content}\n >\n {tab.children}\n </db-tab-panel>\n ))}\n </Fragment>\n ) : null}\n {this.showScrollRight ? (\n <db-button\n class=\"tabs-scroll-right\"\n variant=\"ghost\"\n icon=\"chevron_right\"\n type=\"button\"\n noText={true}\n onClick={() => this.scroll()}\n >\n Scroll right\n </db-button>\n ) : null}\n <slot></slot>\n </div>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|