inviton-powerduck 0.0.217 → 0.0.219

package/components/chart-js/thirdparty/flot/jquery.flot.stack.min.js

@@ -1,104 +1,104 @@
-/* Javascript plotting library for jQuery, version 0.8.3.
-
-Copyright (c) 2007-2014 IOLA and Ole Laursen.
-Licensed under the MIT license.
-
-*/
-(function ($) {
-    var options = { series: { stack: null } };
-    function init(plot) {
-        function findMatchingSeries(s, allseries) {
-            var res = null;
-            for (var i = 0; i < allseries.length; ++i) {
-                if (s == allseries[i]) break;
-                if (allseries[i].stack == s.stack) res = allseries[i];
-            }
-            return res;
-        }
-        function stackData(plot, s, datapoints) {
-            if (s.stack == null || s.stack === false) return;
-            var other = findMatchingSeries(s, plot.getData());
-            if (!other) return;
-            var ps = datapoints.pointsize,
-                points = datapoints.points,
-                otherps = other.datapoints.pointsize,
-                otherpoints = other.datapoints.points,
-                newpoints = [],
-                px,
-                py,
-                intery,
-                qx,
-                qy,
-                bottom,
-                withlines = s.lines.show,
-                horizontal = s.bars.horizontal,
-                withbottom = ps > 2 && (horizontal ? datapoints.format[2].x : datapoints.format[2].y),
-                withsteps = withlines && s.lines.steps,
-                fromgap = true,
-                keyOffset = horizontal ? 1 : 0,
-                accumulateOffset = horizontal ? 0 : 1,
-                i = 0,
-                j = 0,
-                l,
-                m;
-            while (true) {
-                if (i >= points.length) break;
-                l = newpoints.length;
-                if (points[i] == null) {
-                    for (m = 0; m < ps; ++m) newpoints.push(points[i + m]);
-                    i += ps;
-                } else if (j >= otherpoints.length) {
-                    if (!withlines) {
-                        for (m = 0; m < ps; ++m) newpoints.push(points[i + m]);
-                    }
-                    i += ps;
-                } else if (otherpoints[j] == null) {
-                    for (m = 0; m < ps; ++m) newpoints.push(null);
-                    fromgap = true;
-                    j += otherps;
-                } else {
-                    px = points[i + keyOffset];
-                    py = points[i + accumulateOffset];
-                    qx = otherpoints[j + keyOffset];
-                    qy = otherpoints[j + accumulateOffset];
-                    bottom = 0;
-                    if (px == qx) {
-                        for (m = 0; m < ps; ++m) newpoints.push(points[i + m]);
-                        newpoints[l + accumulateOffset] += qy;
-                        bottom = qy;
-                        i += ps;
-                        j += otherps;
-                    } else if (px > qx) {
-                        if (withlines && i > 0 && points[i - ps] != null) {
-                            intery = py + ((points[i - ps + accumulateOffset] - py) * (qx - px)) / (points[i - ps + keyOffset] - px);
-                            newpoints.push(qx);
-                            newpoints.push(intery + qy);
-                            for (m = 2; m < ps; ++m) newpoints.push(points[i + m]);
-                            bottom = qy;
-                        }
-                        j += otherps;
-                    } else {
-                        if (fromgap && withlines) {
-                            i += ps;
-                            continue;
-                        }
-                        for (m = 0; m < ps; ++m) newpoints.push(points[i + m]);
-                        if (withlines && j > 0 && otherpoints[j - otherps] != null)
-                            bottom = qy + ((otherpoints[j - otherps + accumulateOffset] - qy) * (px - qx)) / (otherpoints[j - otherps + keyOffset] - qx);
-                        newpoints[l + accumulateOffset] += bottom;
-                        i += ps;
-                    }
-                    fromgap = false;
-                    if (l != newpoints.length && withbottom) newpoints[l + 2] += bottom;
-                }
-                if (withsteps && l != newpoints.length && l > 0 && newpoints[l] != null && newpoints[l] != newpoints[l - ps] && newpoints[l + 1] != newpoints[l - ps + 1]) {
-                    for (m = 0; m < ps; ++m) newpoints[l + ps + m] = newpoints[l + m];
-                    newpoints[l + 1] = newpoints[l - ps + 1];
-                }
-            }
-            datapoints.points = newpoints;
-        }
-        plot.hooks.processDatapoints.push(stackData);
-    }
-    $.plot.plugins.push({ init: init, options: options, name: "stack", version: "1.2" });
-})(jQuery);
+/* Javascript plotting library for jQuery, version 0.8.3.
+
+Copyright (c) 2007-2014 IOLA and Ole Laursen.
+Licensed under the MIT license.
+
+*/
+(function ($) {
+    var options = { series: { stack: null } };
+    function init(plot) {
+        function findMatchingSeries(s, allseries) {
+            var res = null;
+            for (var i = 0; i < allseries.length; ++i) {
+                if (s == allseries[i]) break;
+                if (allseries[i].stack == s.stack) res = allseries[i];
+            }
+            return res;
+        }
+        function stackData(plot, s, datapoints) {
+            if (s.stack == null || s.stack === false) return;
+            var other = findMatchingSeries(s, plot.getData());
+            if (!other) return;
+            var ps = datapoints.pointsize,
+                points = datapoints.points,
+                otherps = other.datapoints.pointsize,
+                otherpoints = other.datapoints.points,
+                newpoints = [],
+                px,
+                py,
+                intery,
+                qx,
+                qy,
+                bottom,
+                withlines = s.lines.show,
+                horizontal = s.bars.horizontal,
+                withbottom = ps > 2 && (horizontal ? datapoints.format[2].x : datapoints.format[2].y),
+                withsteps = withlines && s.lines.steps,
+                fromgap = true,
+                keyOffset = horizontal ? 1 : 0,
+                accumulateOffset = horizontal ? 0 : 1,
+                i = 0,
+                j = 0,
+                l,
+                m;
+            while (true) {
+                if (i >= points.length) break;
+                l = newpoints.length;
+                if (points[i] == null) {
+                    for (m = 0; m < ps; ++m) newpoints.push(points[i + m]);
+                    i += ps;
+                } else if (j >= otherpoints.length) {
+                    if (!withlines) {
+                        for (m = 0; m < ps; ++m) newpoints.push(points[i + m]);
+                    }
+                    i += ps;
+                } else if (otherpoints[j] == null) {
+                    for (m = 0; m < ps; ++m) newpoints.push(null);
+                    fromgap = true;
+                    j += otherps;
+                } else {
+                    px = points[i + keyOffset];
+                    py = points[i + accumulateOffset];
+                    qx = otherpoints[j + keyOffset];
+                    qy = otherpoints[j + accumulateOffset];
+                    bottom = 0;
+                    if (px == qx) {
+                        for (m = 0; m < ps; ++m) newpoints.push(points[i + m]);
+                        newpoints[l + accumulateOffset] += qy;
+                        bottom = qy;
+                        i += ps;
+                        j += otherps;
+                    } else if (px > qx) {
+                        if (withlines && i > 0 && points[i - ps] != null) {
+                            intery = py + ((points[i - ps + accumulateOffset] - py) * (qx - px)) / (points[i - ps + keyOffset] - px);
+                            newpoints.push(qx);
+                            newpoints.push(intery + qy);
+                            for (m = 2; m < ps; ++m) newpoints.push(points[i + m]);
+                            bottom = qy;
+                        }
+                        j += otherps;
+                    } else {
+                        if (fromgap && withlines) {
+                            i += ps;
+                            continue;
+                        }
+                        for (m = 0; m < ps; ++m) newpoints.push(points[i + m]);
+                        if (withlines && j > 0 && otherpoints[j - otherps] != null)
+                            bottom = qy + ((otherpoints[j - otherps + accumulateOffset] - qy) * (px - qx)) / (otherpoints[j - otherps + keyOffset] - qx);
+                        newpoints[l + accumulateOffset] += bottom;
+                        i += ps;
+                    }
+                    fromgap = false;
+                    if (l != newpoints.length && withbottom) newpoints[l + 2] += bottom;
+                }
+                if (withsteps && l != newpoints.length && l > 0 && newpoints[l] != null && newpoints[l] != newpoints[l - ps] && newpoints[l + 1] != newpoints[l - ps + 1]) {
+                    for (m = 0; m < ps; ++m) newpoints[l + ps + m] = newpoints[l + m];
+                    newpoints[l + 1] = newpoints[l - ps + 1];
+                }
+            }
+            datapoints.points = newpoints;
+        }
+        plot.hooks.processDatapoints.push(stackData);
+    }
+    $.plot.plugins.push({ init: init, options: options, name: "stack", version: "1.2" });
+})(jQuery);

package/components/counter/testall.tsx

@@ -7,6 +7,7 @@ import type { AppMenuItem } from '../app/menu';
 import type { CardHeaderDropdownArgs } from '../card/card-header-with-options';
 import type { DropdownListOption } from '../dropdown';
 import type { ImageDropdownDataItem } from '../dropdown/image-dropdown';
+import type { SmartDropdownCategoryItem, SmartDropdownSearchResultItem } from '../dropdown/smart-dropdown';
 import type { TimegridCalendarAddClickedArgs, TimegridCalendarEvent } from '../fullcalendar/timegrid-calendar';
 import { Temporal } from '@js-temporal/polyfill';
 import { Prop, toNative } from 'vue-facing-decorator';
@@ -30,6 +31,7 @@ import DropdownButtonItem from '../dropdown-button/dropdown-button-item';
 import DropdownButtonSeparator from '../dropdown-button/dropdown-button-separator';
 import CountryDropdown from '../dropdown/country-dropdown';
 import ImageDropdown from '../dropdown/image-dropdown';
+import SmartDropdown from '../dropdown/smart-dropdown';
 import Fieldset from '../form/fieldset';
 import FlexContainer from '../form/flex-container';
 import FooterButtons from '../form/footer-buttons';
@@ -155,6 +157,81 @@ class TestAllComponentsPageComponent extends PowerduckViewModelBase {
 		});
 	}
 
+	// 1. Static Categories
+	categories: SmartDropdownCategoryItem[] = [
+		{ id: 101, text: 'Skipass' },
+		{ id: 102, text: 'Výlet lanovkou' },
+		{ id: 103, text: 'Aquapass' },
+		{ id: 104, text: 'Ubytovanie' },
+		{ id: 105, text: 'Parkovanie' },
+		{ id: 106, text: 'Eventy' },
+		{ id: 107, text: 'Zazitky' },
+		{ id: 108, text: 'Ine srandy' },
+		{ id: 109, text: 'Vouchery' },
+		{ id: 110, text: 'Pokemony' },
+		{ id: 111, text: 'Kino' },
+		{ id: 112, text: 'Restauracie' },
+		{ id: 113, text: 'Este insie srandy' },
+		{ id: 114, text: 'Sranda banda' },
+	];
+
+	// 2. Selected State
+	selectedItems: (SmartDropdownCategoryItem | SmartDropdownSearchResultItem)[] = [];
+
+	// 3. Search Data Logic (Simulated Backend)
+	async fetchSmartDropdownSearchData(query: string): Promise<SmartDropdownSearchResultItem[]> {
+		console.log('Fetching for:', query);
+
+		// Simulate network delay
+		await new Promise(resolve => setTimeout(resolve, 500)); // 500ms delay
+
+		const mockDb: SmartDropdownSearchResultItem[] = [
+			{ id: 1, text: 'Hotel Grand Jasná', subtitle: 'Ubytovanie • Jasná', imageUrl: 'https://picsum.photos/200' },
+			{ id: 2, text: 'Celosezónny Skipass', subtitle: 'Produkt • Nízke Tatry', imageUrl: 'https://picsum.photos/200' },
+			{ id: 3, text: 'Hotel Rotunda', subtitle: 'Ubytovanie • Chopok', imageUrl: 'https://picsum.photos/200' },
+			{ id: 4, text: 'Fresh Track', subtitle: 'Zážitok • Lomnica' },
+			{ id: 5, text: 'Wellness Hotel', subtitle: 'Ubytovanie • Bešeňová' },
+		];
+
+		return mockDb.filter(item =>
+			item.text.toLowerCase().includes(query.toLowerCase()));
+	}
+
+	// 4. Handle Change
+	onSmartDropdownSelectionChange(newSelection: any[]) {
+		console.log('Selection updated:', newSelection);
+		this.selectedItems = newSelection;
+	}
+
+	// 2. Custom Sections (History & Inspiration)
+	get customSections() {
+		return [
+			{
+				id: 'history',
+				title: 'Nedávne vyhľadávania',
+				items: [
+					{ id: 'h1', text: 'Jasná', type: 'history' },
+					{ id: 'h2', text: 'Vysoké Tatry', type: 'history' },
+				],
+			},
+			{
+				id: 'inspiration',
+				title: 'Váhate, kam cestovať najbližšie?',
+				items: [
+					{ id: 'insp1', text: 'Zadajte Kamkoľvek', type: 'special', icon: 'pin' },
+					{ id: 'insp2', text: 'V mojej lokalite', type: 'special', icon: 'target' },
+				],
+			},
+		];
+	}
+
+	// 4. Custom Handler for History Delete
+	removeSmartDropdownHistory(e: Event, id: string | number) {
+		e.stopPropagation();
+		console.log('Removing history', id);
+		// logic to remove from customSections...
+	}
+
 	render(h) {
 		return (
 			<div>
@@ -333,11 +410,11 @@ class TestAllComponentsPageComponent extends PowerduckViewModelBase {
 								<p>Some modal content1</p>
 							</ModalSection>
 							{this.boolValue == true
-							&& (
-								<ModalSection icon="icon icon-settings" navCaption="Settings2">
-									<p>Some modal content2</p>
-								</ModalSection>
-							)}
+								&& (
+									<ModalSection icon="icon icon-settings" navCaption="Settings2">
+										<p>Some modal content2</p>
+									</ModalSection>
+								)}
 
 							<ModalSection icon="icon icon-settings" navCaption="Settings4">
 								<p>Some modal content4444</p>
@@ -411,16 +488,12 @@ class TestAllComponentsPageComponent extends PowerduckViewModelBase {
 						h,
 						item,
 						originator,
-					) => {
-						return (<CustomDropdownItem text={item.text} />);
-					}}
+					) => <CustomDropdownItem text={item.text} />}
 					customRenderSelectionResult={(
 						h,
 						item,
 						originator,
-					) => {
-						return (<CustomDropdownItem text={item.text} />);
-					}}
+					) => <CustomDropdownItem text={item.text} />}
 					changed={(v) => {
 						this.selectedOptions = v.id;
 					}}
@@ -479,6 +552,58 @@ class TestAllComponentsPageComponent extends PowerduckViewModelBase {
 					}}
 				/>
 
+				<SmartDropdown
+					label="Mudry dropdown"
+					wrap={false}
+					categories={this.categories}
+					searchData={this.fetchSmartDropdownSearchData}
+					customSections={this.customSections}
+					value={this.selectedItems}
+					buttonLayout="inline"
+					selectionDisplay="chips"
+
+					searchMode="input"
+					changed={this.onSmartDropdownSelectionChange} // Or use @selectionChanged in template
+					multiselect={true} // Toggle to false for single select
+					placeholder="Hľadajte hotel, službu..."
+					// customSectionRender={(item, selected) => {
+					// 	// Example: History Item
+					// 	if (item.type === 'history') {
+					// 		return (
+					// 			<div style="display:flex; justify-content:space-between; padding: 8px 16px;">
+					// 				<span>
+					// 					↻
+					// 					<b>{item.text}</b>
+					// 				</span>
+					// 				<span onClick={e => this.removeHistory(e, item.id)}>x</span>
+					// 			</div>
+					// 		);
+					// 	}
+
+					// 	// Example: Default Checkbox style via simple HTML
+					// 	return (
+					// 		<div style="display:flex; align-items:center; padding: 8px 16px;">
+					// 			<div class={`checkbox-visual ${selected ? 'checked' : ''}`} style="margin-right:10px; width:16px; height:16px; border:1px solid #ccc;"></div>
+					// 			{item.text}
+					// 		</div>
+					// 	);
+					// }}
+					customTriggerScope="mobile"
+					customTriggerRender={() => (
+						<div style="display:flex; flex-direction:column; width:100%; gap:8px;">
+							{/* Mimicking the stacked mobile inputs */}
+							<div style="border:1px solid #eee; padding:8px; border-radius:8px; display:flex; justify-content:space-between;">
+								<span style="color:#999; font-size:12px">Kam</span>
+								<strong>Jasná</strong>
+							</div>
+							<div style="border:1px solid #eee; padding:8px; border-radius:8px; display:flex; justify-content:space-between;">
+								<span style="color:#999; font-size:12px">Čo hľadáte</span>
+								<strong>Skipass</strong>
+							</div>
+						</div>
+					)}
+				/>
+
 				<DropdownButton layout={ButtonLayout.Default} size={ButtonSize.Regular} text="Akcie">
 					<DropdownButtonItem icon="icon icon-settings" text="Edit" clicked={() => alert('clicked me')} />
 					<DropdownButtonSeparator />