@magic-spells/cart-progress-bar 1.0.0 → 2.0.0

package/dist/cart-progress-bar.js

@@ -1,269 +0,0 @@
-(function (global, factory) {
-	typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
-	typeof define === 'function' && define.amd ? define(['exports'], factory) :
-	(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.CartProgressBar = {}));
-})(this, (function (exports) { 'use strict';
-
-	/**
-	 * ProgressBar helper class for the visual progress bar element
-	 */
-	class ProgressBar extends HTMLElement {
-		constructor() {
-			super();
-			const _ = this;
-			_.setAttribute('role', 'progressbar');
-			_.setAttribute('aria-valuemin', '0');
-			_.setAttribute('aria-valuemax', '100');
-			_.setAttribute('aria-valuenow', '0');
-			_.innerHTML = '<div class="progress-bar-fill"></div>';
-		}
-
-		setPercent(percent) {
-			const p = Math.max(0, Math.min(100, percent));
-			this.style.setProperty('--cart-progress-percent', `${p}%`);
-			this.setAttribute('aria-valuenow', p);
-		}
-	}
-
-	// Define ProgressBar custom element immediately so it's available for CartProgressBar
-	customElements.define('progress-bar', ProgressBar);
-
-	/**
-	 * CartProgressBar main component
-	 */
-	class CartProgressBar extends HTMLElement {
-		// Private fields
-		#threshold = 0;
-		#current = 0;
-		#percent = 0;
-		#msgAbove = '';
-		#msgBelow = '';
-		#bar = null;
-		#msgEl = null;
-		#moneyFmt = null;
-		#debounce = null;
-
-		static get observedAttributes() {
-			return ['threshold', 'current', 'message-above', 'message-below', 'money-format'];
-		}
-
-		constructor() {
-			super();
-			const _ = this;
-			_.#threshold = parseFloat(_.getAttribute('threshold')) || 0;
-			_.#current = parseFloat(_.getAttribute('current')) || 0;
-			_.#msgAbove = _.getAttribute('message-above') || '';
-			_.#msgBelow = _.getAttribute('message-below') || '';
-			_.#moneyFmt = _.getAttribute('money-format');
-		}
-
-		async connectedCallback() {
-			await customElements.whenDefined('progress-bar');
-			this.#render();
-			this.#updateProgress();
-			this.#attachListeners();
-		}
-
-		disconnectedCallback() {
-			if (this.#debounce) clearTimeout(this.#debounce);
-		}
-
-		attributeChangedCallback(name, oldVal, newVal) {
-			if (oldVal === newVal) return;
-			const _ = this;
-
-			switch (name) {
-				case 'threshold':
-					_.#threshold = parseFloat(newVal) || 0;
-					_.#updateProgress();
-					break;
-				case 'current':
-					_.#current = parseFloat(newVal) || 0;
-					_.#updateProgress();
-					break;
-				case 'message-above':
-					_.#msgAbove = newVal || '';
-					_.#updateMessages();
-					break;
-				case 'message-below':
-					_.#msgBelow = newVal || '';
-					_.#updateMessages();
-					break;
-				case 'money-format':
-					_.#moneyFmt = newVal;
-					_.#updateMessages();
-					break;
-			}
-		}
-
-		#render() {
-			const _ = this;
-			// Find existing elements or create them
-			_.#msgEl = _.querySelector('[data-content-cart-progress-message]');
-			_.#bar = _.querySelector('progress-bar');
-
-			// Create message element if needed
-			if (!_.#msgEl && (_.#msgAbove || _.#msgBelow)) {
-				_.#msgEl = document.createElement('p');
-				_.#msgEl.setAttribute('data-content-cart-progress-message', '');
-				_.appendChild(_.#msgEl);
-			}
-
-			// Create progress bar if needed
-			if (!_.#bar) {
-				_.#bar = document.createElement('progress-bar');
-				_.appendChild(_.#bar);
-			}
-		}
-
-		#updateProgress() {
-			const _ = this;
-			const converted = _.#converted();
-			_.#percent = converted === 0 ? 100 : Math.min(100, (_.#current / converted) * 100);
-			if (_.#bar) _.#bar.setPercent(_.#percent);
-			_.#updateState(converted);
-		}
-
-		#attachListeners() {
-			const _ = this;
-			const panel = _.closest('cart-panel');
-			if (panel) {
-				panel.addEventListener('cart-panel:data-changed', (e) => _.#onCartChange(e));
-			}
-		}
-
-		#onCartChange(event) {
-			const _ = this;
-			const cart = event.detail;
-			if (!cart) return;
-
-			if (_.#debounce) clearTimeout(_.#debounce);
-			_.#debounce = setTimeout(() => {
-				_.#debounce = null;
-				// Use calculated_subtotal if available, else total_price (both in cents)
-				const amt = (cart.calculated_subtotal ?? cart.total_price ?? 0) / 100;
-				_.setCurrentAmount(amt);
-			}, 100);
-		}
-
-		#updateState(converted) {
-			const _ = this;
-			const complete = _.#current >= converted;
-			const remaining = Math.max(0, converted - _.#current);
-			const formatted = _.#fmtMoney(remaining);
-
-			// Update message
-			if (_.#msgEl) {
-				let tpl = complete ? _.#msgAbove : (_.#msgBelow || _.#msgAbove);
-				if (tpl) {
-					_.#msgEl.textContent = tpl.replace(/\[\s*amount\s*\]/g, formatted);
-					_.#msgEl.style.display = 'block';
-				} else {
-					_.#msgEl.style.display = 'none';
-				}
-			}
-
-			// Update complete attribute
-			_.setAttribute('complete', complete.toString());
-		}
-
-		#fmtMoney(amt) {
-			const fmt = this.#moneyFmt;
-			if (!fmt) return amt.toFixed(2).replace(/\.00$/, '');
-
-			const fixed = amt.toFixed(2);
-			const noDecimals = Math.round(amt).toString();
-			const withComma = fixed.replace('.', ',');
-			const noDecWithComma = noDecimals.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
-
-			return fmt
-				.replace(/\{\{\s*amount_no_decimals_with_comma_separator\s*\}\}/g, noDecWithComma)
-				.replace(/\{\{\s*amount_with_comma_separator\s*\}\}/g, withComma)
-				.replace(/\{\{\s*amount_no_decimals\s*\}\}/g, noDecimals)
-				.replace(/\{\{\s*amount\s*\}\}/g, fixed);
-		}
-
-		#converted() {
-			const rate = parseFloat(window.Shopify?.currency?.rate) || 1;
-			return this.#threshold * rate;
-		}
-
-		#updateMessages() {
-			this.#updateState(this.#converted());
-		}
-
-		// Public API
-		setPercent(pct) {
-			const _ = this;
-			const p = Math.max(0, Math.min(100, pct));
-			_.#percent = p;
-			if (_.#bar) _.#bar.setPercent(p);
-			// Use converted threshold for multi-currency consistency
-			_.#current = (p / 100) * _.#converted();
-			_.setAttribute('current', _.#current.toString());
-			_.#updateState(_.#converted());
-		}
-
-		setCurrentAmount(amt) {
-			const _ = this;
-			_.#current = parseFloat(amt) || 0;
-			_.setAttribute('current', _.#current.toString());
-			_.#updateProgress();
-		}
-
-		setThresholdAmount(amt) {
-			const _ = this;
-			_.#threshold = parseFloat(amt) || 0;
-			_.setAttribute('threshold', _.#threshold.toString());
-			_.#updateProgress();
-		}
-
-		/** @deprecated Use setThresholdAmount */
-		setMinAmount(amt) {
-			this.setThresholdAmount(amt);
-		}
-
-		getProgress() {
-			const _ = this;
-			const converted = _.#converted();
-			return {
-				currentAmount: _.#current,
-				thresholdAmount: _.#threshold,
-				convertedThreshold: converted,
-				minAmount: _.#threshold,
-				remainingAmount: Math.max(0, converted - _.#current),
-				percent: _.#percent,
-				isComplete: _.#current >= converted,
-				currencyRate: parseFloat(window.Shopify?.currency?.rate) || 1,
-			};
-		}
-
-		setMessages(above = null, below = null) {
-			const _ = this;
-			if (above !== null) {
-				_.#msgAbove = above;
-				_.setAttribute('message-above', above);
-			}
-			if (below !== null) {
-				_.#msgBelow = below;
-				_.setAttribute('message-below', below);
-			}
-			_.#updateMessages();
-		}
-
-		// Getters (with backwards compatibility)
-		get currentAmount() { return this.#current; }
-		get thresholdAmount() { return this.#threshold; }
-		get minAmount() { return this.#threshold; }
-		get percent() { return this.#percent; }
-		get isComplete() { return this.#current >= this.#converted(); }
-	}
-
-	// Define CartProgressBar custom element
-	customElements.define('cart-progress-bar', CartProgressBar);
-
-	exports.CartProgressBar = CartProgressBar;
-	exports.ProgressBar = ProgressBar;
-
-}));
-//# sourceMappingURL=cart-progress-bar.js.map

package/dist/cart-progress-bar.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"cart-progress-bar.js","sources":["../src/cart-progress-bar.js"],"sourcesContent":["import './cart-progress-bar.scss';\n\n/**\n * ProgressBar helper class for the visual progress bar element\n */\nclass ProgressBar extends HTMLElement {\n\tconstructor() {\n\t\tsuper();\n\t\tconst _ = this;\n\t\t_.setAttribute('role', 'progressbar');\n\t\t_.setAttribute('aria-valuemin', '0');\n\t\t_.setAttribute('aria-valuemax', '100');\n\t\t_.setAttribute('aria-valuenow', '0');\n\t\t_.innerHTML = '<div class=\"progress-bar-fill\"></div>';\n\t}\n\n\tsetPercent(percent) {\n\t\tconst p = Math.max(0, Math.min(100, percent));\n\t\tthis.style.setProperty('--cart-progress-percent', `${p}%`);\n\t\tthis.setAttribute('aria-valuenow', p);\n\t}\n}\n\n// Define ProgressBar custom element immediately so it's available for CartProgressBar\ncustomElements.define('progress-bar', ProgressBar);\n\n/**\n * CartProgressBar main component\n */\nclass CartProgressBar extends HTMLElement {\n\t// Private fields\n\t#threshold = 0;\n\t#current = 0;\n\t#percent = 0;\n\t#msgAbove = '';\n\t#msgBelow = '';\n\t#bar = null;\n\t#msgEl = null;\n\t#moneyFmt = null;\n\t#debounce = null;\n\n\tstatic get observedAttributes() {\n\t\treturn ['threshold', 'current', 'message-above', 'message-below', 'money-format'];\n\t}\n\n\tconstructor() {\n\t\tsuper();\n\t\tconst _ = this;\n\t\t_.#threshold = parseFloat(_.getAttribute('threshold')) || 0;\n\t\t_.#current = parseFloat(_.getAttribute('current')) || 0;\n\t\t_.#msgAbove = _.getAttribute('message-above') || '';\n\t\t_.#msgBelow = _.getAttribute('message-below') || '';\n\t\t_.#moneyFmt = _.getAttribute('money-format');\n\t}\n\n\tasync connectedCallback() {\n\t\tawait customElements.whenDefined('progress-bar');\n\t\tthis.#render();\n\t\tthis.#updateProgress();\n\t\tthis.#attachListeners();\n\t}\n\n\tdisconnectedCallback() {\n\t\tif (this.#debounce) clearTimeout(this.#debounce);\n\t}\n\n\tattributeChangedCallback(name, oldVal, newVal) {\n\t\tif (oldVal === newVal) return;\n\t\tconst _ = this;\n\n\t\tswitch (name) {\n\t\t\tcase 'threshold':\n\t\t\t\t_.#threshold = parseFloat(newVal) || 0;\n\t\t\t\t_.#updateProgress();\n\t\t\t\tbreak;\n\t\t\tcase 'current':\n\t\t\t\t_.#current = parseFloat(newVal) || 0;\n\t\t\t\t_.#updateProgress();\n\t\t\t\tbreak;\n\t\t\tcase 'message-above':\n\t\t\t\t_.#msgAbove = newVal || '';\n\t\t\t\t_.#updateMessages();\n\t\t\t\tbreak;\n\t\t\tcase 'message-below':\n\t\t\t\t_.#msgBelow = newVal || '';\n\t\t\t\t_.#updateMessages();\n\t\t\t\tbreak;\n\t\t\tcase 'money-format':\n\t\t\t\t_.#moneyFmt = newVal;\n\t\t\t\t_.#updateMessages();\n\t\t\t\tbreak;\n\t\t}\n\t}\n\n\t#render() {\n\t\tconst _ = this;\n\t\t// Find existing elements or create them\n\t\t_.#msgEl = _.querySelector('[data-content-cart-progress-message]');\n\t\t_.#bar = _.querySelector('progress-bar');\n\n\t\t// Create message element if needed\n\t\tif (!_.#msgEl && (_.#msgAbove || _.#msgBelow)) {\n\t\t\t_.#msgEl = document.createElement('p');\n\t\t\t_.#msgEl.setAttribute('data-content-cart-progress-message', '');\n\t\t\t_.appendChild(_.#msgEl);\n\t\t}\n\n\t\t// Create progress bar if needed\n\t\tif (!_.#bar) {\n\t\t\t_.#bar = document.createElement('progress-bar');\n\t\t\t_.appendChild(_.#bar);\n\t\t}\n\t}\n\n\t#updateProgress() {\n\t\tconst _ = this;\n\t\tconst converted = _.#converted();\n\t\t_.#percent = converted === 0 ? 100 : Math.min(100, (_.#current / converted) * 100);\n\t\tif (_.#bar) _.#bar.setPercent(_.#percent);\n\t\t_.#updateState(converted);\n\t}\n\n\t#attachListeners() {\n\t\tconst _ = this;\n\t\tconst panel = _.closest('cart-panel');\n\t\tif (panel) {\n\t\t\tpanel.addEventListener('cart-panel:data-changed', (e) => _.#onCartChange(e));\n\t\t}\n\t}\n\n\t#onCartChange(event) {\n\t\tconst _ = this;\n\t\tconst cart = event.detail;\n\t\tif (!cart) return;\n\n\t\tif (_.#debounce) clearTimeout(_.#debounce);\n\t\t_.#debounce = setTimeout(() => {\n\t\t\t_.#debounce = null;\n\t\t\t// Use calculated_subtotal if available, else total_price (both in cents)\n\t\t\tconst amt = (cart.calculated_subtotal ?? cart.total_price ?? 0) / 100;\n\t\t\t_.setCurrentAmount(amt);\n\t\t}, 100);\n\t}\n\n\t#updateState(converted) {\n\t\tconst _ = this;\n\t\tconst complete = _.#current >= converted;\n\t\tconst remaining = Math.max(0, converted - _.#current);\n\t\tconst formatted = _.#fmtMoney(remaining);\n\n\t\t// Update message\n\t\tif (_.#msgEl) {\n\t\t\tlet tpl = complete ? _.#msgAbove : (_.#msgBelow || _.#msgAbove);\n\t\t\tif (tpl) {\n\t\t\t\t_.#msgEl.textContent = tpl.replace(/\\[\\s*amount\\s*\\]/g, formatted);\n\t\t\t\t_.#msgEl.style.display = 'block';\n\t\t\t} else {\n\t\t\t\t_.#msgEl.style.display = 'none';\n\t\t\t}\n\t\t}\n\n\t\t// Update complete attribute\n\t\t_.setAttribute('complete', complete.toString());\n\t}\n\n\t#fmtMoney(amt) {\n\t\tconst fmt = this.#moneyFmt;\n\t\tif (!fmt) return amt.toFixed(2).replace(/\\.00$/, '');\n\n\t\tconst fixed = amt.toFixed(2);\n\t\tconst noDecimals = Math.round(amt).toString();\n\t\tconst withComma = fixed.replace('.', ',');\n\t\tconst noDecWithComma = noDecimals.replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n\n\t\treturn fmt\n\t\t\t.replace(/\\{\\{\\s*amount_no_decimals_with_comma_separator\\s*\\}\\}/g, noDecWithComma)\n\t\t\t.replace(/\\{\\{\\s*amount_with_comma_separator\\s*\\}\\}/g, withComma)\n\t\t\t.replace(/\\{\\{\\s*amount_no_decimals\\s*\\}\\}/g, noDecimals)\n\t\t\t.replace(/\\{\\{\\s*amount\\s*\\}\\}/g, fixed);\n\t}\n\n\t#converted() {\n\t\tconst rate = parseFloat(window.Shopify?.currency?.rate) || 1;\n\t\treturn this.#threshold * rate;\n\t}\n\n\t#updateMessages() {\n\t\tthis.#updateState(this.#converted());\n\t}\n\n\t// Public API\n\tsetPercent(pct) {\n\t\tconst _ = this;\n\t\tconst p = Math.max(0, Math.min(100, pct));\n\t\t_.#percent = p;\n\t\tif (_.#bar) _.#bar.setPercent(p);\n\t\t// Use converted threshold for multi-currency consistency\n\t\t_.#current = (p / 100) * _.#converted();\n\t\t_.setAttribute('current', _.#current.toString());\n\t\t_.#updateState(_.#converted());\n\t}\n\n\tsetCurrentAmount(amt) {\n\t\tconst _ = this;\n\t\t_.#current = parseFloat(amt) || 0;\n\t\t_.setAttribute('current', _.#current.toString());\n\t\t_.#updateProgress();\n\t}\n\n\tsetThresholdAmount(amt) {\n\t\tconst _ = this;\n\t\t_.#threshold = parseFloat(amt) || 0;\n\t\t_.setAttribute('threshold', _.#threshold.toString());\n\t\t_.#updateProgress();\n\t}\n\n\t/** @deprecated Use setThresholdAmount */\n\tsetMinAmount(amt) {\n\t\tthis.setThresholdAmount(amt);\n\t}\n\n\tgetProgress() {\n\t\tconst _ = this;\n\t\tconst converted = _.#converted();\n\t\treturn {\n\t\t\tcurrentAmount: _.#current,\n\t\t\tthresholdAmount: _.#threshold,\n\t\t\tconvertedThreshold: converted,\n\t\t\tminAmount: _.#threshold,\n\t\t\tremainingAmount: Math.max(0, converted - _.#current),\n\t\t\tpercent: _.#percent,\n\t\t\tisComplete: _.#current >= converted,\n\t\t\tcurrencyRate: parseFloat(window.Shopify?.currency?.rate) || 1,\n\t\t};\n\t}\n\n\tsetMessages(above = null, below = null) {\n\t\tconst _ = this;\n\t\tif (above !== null) {\n\t\t\t_.#msgAbove = above;\n\t\t\t_.setAttribute('message-above', above);\n\t\t}\n\t\tif (below !== null) {\n\t\t\t_.#msgBelow = below;\n\t\t\t_.setAttribute('message-below', below);\n\t\t}\n\t\t_.#updateMessages();\n\t}\n\n\t// Getters (with backwards compatibility)\n\tget currentAmount() { return this.#current; }\n\tget thresholdAmount() { return this.#threshold; }\n\tget minAmount() { return this.#threshold; }\n\tget percent() { return this.#percent; }\n\tget isComplete() { return this.#current >= this.#converted(); }\n}\n\n// Define CartProgressBar custom element\ncustomElements.define('cart-progress-bar', CartProgressBar);\n\n// Export components for external use\nexport { CartProgressBar, ProgressBar };\n"],"names":[],"mappings":"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"}

package/dist/cart-progress-bar.scss

@@ -1,124 +0,0 @@
-// SCSS Variables (can be overridden before import)
-$cart-progress-bar-height: 12px !default;
-$cart-progress-bar-border-radius: 6px !default;
-$cart-progress-bar-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1) !default;
-$cart-progress-bar-transition-duration: 0.3s !default;
-
-// Core color variables
-$cart-progress-section-bg: transparent !default;
-$cart-progress-section-color: #495057 !default;
-$cart-progress-bar-bg: #e9ecef !default;
-$cart-progress-bar-fill-before: #28a745 !default;
-$cart-progress-bar-fill-after: #007bff !default;
-
-// Responsive breakpoints
-$cart-progress-mobile-breakpoint: 768px !default;
-
-// Cart progress bar component styles
-cart-progress-bar {
-	// CSS Custom Properties for customization (mapped from SCSS variables)
-	--cart-progress-bar-height: #{$cart-progress-bar-height};
-	--cart-progress-bar-border-radius: #{$cart-progress-bar-border-radius};
-	--cart-progress-bar-shadow: #{$cart-progress-bar-shadow};
-	--cart-progress-bar-transition-duration: #{$cart-progress-bar-transition-duration};
-
-	// Core color variables
-	--cart-progress-section-bg: #{$cart-progress-section-bg};
-	--cart-progress-section-color: #{$cart-progress-section-color};
-	--cart-progress-bar-bg: #{$cart-progress-bar-bg};
-	--cart-progress-bar-fill-before: #{$cart-progress-bar-fill-before};
-	--cart-progress-bar-fill-after: #{$cart-progress-bar-fill-after};
-
-	// Dynamic variables (set by JavaScript)
-	--cart-progress-percent: 0%;
-	--cart-progress-bar-fill-current: var(--cart-progress-bar-fill-before);
-
-	display: block;
-	width: 100%;
-	max-width: 100%;
-	background-color: var(--cart-progress-section-bg);
-	color: var(--cart-progress-section-color);
-
-	// Message styling
-	p[data-content-cart-progress-message] {
-		color: inherit;
-		transition: opacity var(--cart-progress-bar-transition-duration) ease;
-	}
-
-	// State-based styling
-	&[complete='true'] {
-		p[data-content-cart-progress-message] {
-			font-weight: 600;
-		}
-	}
-
-	// State-based progress bar coloring
-	&[complete='false'] {
-		--cart-progress-bar-fill-current: var(--cart-progress-bar-fill-before);
-	}
-
-	&[complete='true'] {
-		--cart-progress-bar-fill-current: var(--cart-progress-bar-fill-after);
-	}
-}
-
-// Progress bar component styles
-progress-bar {
-	display: block;
-	width: 100%;
-	height: var(--cart-progress-bar-height);
-	background-color: var(--cart-progress-bar-bg);
-	border-radius: var(--cart-progress-bar-border-radius);
-	box-shadow: var(--cart-progress-bar-shadow);
-	overflow: hidden;
-	position: relative;
-
-	.progress-bar-fill {
-		height: 100%;
-		width: var(--cart-progress-percent);
-		background-color: var(--cart-progress-bar-fill-current);
-		border-radius: var(--cart-progress-bar-border-radius);
-		transition:
-			width var(--cart-progress-bar-transition-duration) ease,
-			background-color var(--cart-progress-bar-transition-duration) ease;
-		position: relative;
-
-		// Subtle gradient effect
-		background-image: linear-gradient(
-			45deg,
-			rgba(255, 255, 255, 0.1) 25%,
-			transparent 25%,
-			transparent 50%,
-			rgba(255, 255, 255, 0.1) 50%,
-			rgba(255, 255, 255, 0.1) 75%,
-			transparent 75%,
-			transparent
-		);
-		background-size: 12px 12px;
-
-		// Shine effect for completed state
-		&::after {
-			content: '';
-			position: absolute;
-			top: 0;
-			left: -100%;
-			width: 100%;
-			height: 100%;
-			background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
-			transition: left 0.5s ease;
-		}
-	}
-
-	// Animate shine effect when complete
-	cart-progress-bar[complete='true'] & {
-		.progress-bar-fill::after {
-			left: 100%;
-		}
-	}
-
-	// Accessibility improvements
-	&:focus-visible {
-		outline: 2px solid #007bff;
-		outline-offset: 2px;
-	}
-}

package/src/cart-progress-bar.js

@@ -1,262 +0,0 @@
-import './cart-progress-bar.scss';
-
-/**
- * ProgressBar helper class for the visual progress bar element
- */
-class ProgressBar extends HTMLElement {
-	constructor() {
-		super();
-		const _ = this;
-		_.setAttribute('role', 'progressbar');
-		_.setAttribute('aria-valuemin', '0');
-		_.setAttribute('aria-valuemax', '100');
-		_.setAttribute('aria-valuenow', '0');
-		_.innerHTML = '<div class="progress-bar-fill"></div>';
-	}
-
-	setPercent(percent) {
-		const p = Math.max(0, Math.min(100, percent));
-		this.style.setProperty('--cart-progress-percent', `${p}%`);
-		this.setAttribute('aria-valuenow', p);
-	}
-}
-
-// Define ProgressBar custom element immediately so it's available for CartProgressBar
-customElements.define('progress-bar', ProgressBar);
-
-/**
- * CartProgressBar main component
- */
-class CartProgressBar extends HTMLElement {
-	// Private fields
-	#threshold = 0;
-	#current = 0;
-	#percent = 0;
-	#msgAbove = '';
-	#msgBelow = '';
-	#bar = null;
-	#msgEl = null;
-	#moneyFmt = null;
-	#debounce = null;
-
-	static get observedAttributes() {
-		return ['threshold', 'current', 'message-above', 'message-below', 'money-format'];
-	}
-
-	constructor() {
-		super();
-		const _ = this;
-		_.#threshold = parseFloat(_.getAttribute('threshold')) || 0;
-		_.#current = parseFloat(_.getAttribute('current')) || 0;
-		_.#msgAbove = _.getAttribute('message-above') || '';
-		_.#msgBelow = _.getAttribute('message-below') || '';
-		_.#moneyFmt = _.getAttribute('money-format');
-	}
-
-	async connectedCallback() {
-		await customElements.whenDefined('progress-bar');
-		this.#render();
-		this.#updateProgress();
-		this.#attachListeners();
-	}
-
-	disconnectedCallback() {
-		if (this.#debounce) clearTimeout(this.#debounce);
-	}
-
-	attributeChangedCallback(name, oldVal, newVal) {
-		if (oldVal === newVal) return;
-		const _ = this;
-
-		switch (name) {
-			case 'threshold':
-				_.#threshold = parseFloat(newVal) || 0;
-				_.#updateProgress();
-				break;
-			case 'current':
-				_.#current = parseFloat(newVal) || 0;
-				_.#updateProgress();
-				break;
-			case 'message-above':
-				_.#msgAbove = newVal || '';
-				_.#updateMessages();
-				break;
-			case 'message-below':
-				_.#msgBelow = newVal || '';
-				_.#updateMessages();
-				break;
-			case 'money-format':
-				_.#moneyFmt = newVal;
-				_.#updateMessages();
-				break;
-		}
-	}
-
-	#render() {
-		const _ = this;
-		// Find existing elements or create them
-		_.#msgEl = _.querySelector('[data-content-cart-progress-message]');
-		_.#bar = _.querySelector('progress-bar');
-
-		// Create message element if needed
-		if (!_.#msgEl && (_.#msgAbove || _.#msgBelow)) {
-			_.#msgEl = document.createElement('p');
-			_.#msgEl.setAttribute('data-content-cart-progress-message', '');
-			_.appendChild(_.#msgEl);
-		}
-
-		// Create progress bar if needed
-		if (!_.#bar) {
-			_.#bar = document.createElement('progress-bar');
-			_.appendChild(_.#bar);
-		}
-	}
-
-	#updateProgress() {
-		const _ = this;
-		const converted = _.#converted();
-		_.#percent = converted === 0 ? 100 : Math.min(100, (_.#current / converted) * 100);
-		if (_.#bar) _.#bar.setPercent(_.#percent);
-		_.#updateState(converted);
-	}
-
-	#attachListeners() {
-		const _ = this;
-		const panel = _.closest('cart-panel');
-		if (panel) {
-			panel.addEventListener('cart-panel:data-changed', (e) => _.#onCartChange(e));
-		}
-	}
-
-	#onCartChange(event) {
-		const _ = this;
-		const cart = event.detail;
-		if (!cart) return;
-
-		if (_.#debounce) clearTimeout(_.#debounce);
-		_.#debounce = setTimeout(() => {
-			_.#debounce = null;
-			// Use calculated_subtotal if available, else total_price (both in cents)
-			const amt = (cart.calculated_subtotal ?? cart.total_price ?? 0) / 100;
-			_.setCurrentAmount(amt);
-		}, 100);
-	}
-
-	#updateState(converted) {
-		const _ = this;
-		const complete = _.#current >= converted;
-		const remaining = Math.max(0, converted - _.#current);
-		const formatted = _.#fmtMoney(remaining);
-
-		// Update message
-		if (_.#msgEl) {
-			let tpl = complete ? _.#msgAbove : (_.#msgBelow || _.#msgAbove);
-			if (tpl) {
-				_.#msgEl.textContent = tpl.replace(/\[\s*amount\s*\]/g, formatted);
-				_.#msgEl.style.display = 'block';
-			} else {
-				_.#msgEl.style.display = 'none';
-			}
-		}
-
-		// Update complete attribute
-		_.setAttribute('complete', complete.toString());
-	}
-
-	#fmtMoney(amt) {
-		const fmt = this.#moneyFmt;
-		if (!fmt) return amt.toFixed(2).replace(/\.00$/, '');
-
-		const fixed = amt.toFixed(2);
-		const noDecimals = Math.round(amt).toString();
-		const withComma = fixed.replace('.', ',');
-		const noDecWithComma = noDecimals.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
-
-		return fmt
-			.replace(/\{\{\s*amount_no_decimals_with_comma_separator\s*\}\}/g, noDecWithComma)
-			.replace(/\{\{\s*amount_with_comma_separator\s*\}\}/g, withComma)
-			.replace(/\{\{\s*amount_no_decimals\s*\}\}/g, noDecimals)
-			.replace(/\{\{\s*amount\s*\}\}/g, fixed);
-	}
-
-	#converted() {
-		const rate = parseFloat(window.Shopify?.currency?.rate) || 1;
-		return this.#threshold * rate;
-	}
-
-	#updateMessages() {
-		this.#updateState(this.#converted());
-	}
-
-	// Public API
-	setPercent(pct) {
-		const _ = this;
-		const p = Math.max(0, Math.min(100, pct));
-		_.#percent = p;
-		if (_.#bar) _.#bar.setPercent(p);
-		// Use converted threshold for multi-currency consistency
-		_.#current = (p / 100) * _.#converted();
-		_.setAttribute('current', _.#current.toString());
-		_.#updateState(_.#converted());
-	}
-
-	setCurrentAmount(amt) {
-		const _ = this;
-		_.#current = parseFloat(amt) || 0;
-		_.setAttribute('current', _.#current.toString());
-		_.#updateProgress();
-	}
-
-	setThresholdAmount(amt) {
-		const _ = this;
-		_.#threshold = parseFloat(amt) || 0;
-		_.setAttribute('threshold', _.#threshold.toString());
-		_.#updateProgress();
-	}
-
-	/** @deprecated Use setThresholdAmount */
-	setMinAmount(amt) {
-		this.setThresholdAmount(amt);
-	}
-
-	getProgress() {
-		const _ = this;
-		const converted = _.#converted();
-		return {
-			currentAmount: _.#current,
-			thresholdAmount: _.#threshold,
-			convertedThreshold: converted,
-			minAmount: _.#threshold,
-			remainingAmount: Math.max(0, converted - _.#current),
-			percent: _.#percent,
-			isComplete: _.#current >= converted,
-			currencyRate: parseFloat(window.Shopify?.currency?.rate) || 1,
-		};
-	}
-
-	setMessages(above = null, below = null) {
-		const _ = this;
-		if (above !== null) {
-			_.#msgAbove = above;
-			_.setAttribute('message-above', above);
-		}
-		if (below !== null) {
-			_.#msgBelow = below;
-			_.setAttribute('message-below', below);
-		}
-		_.#updateMessages();
-	}
-
-	// Getters (with backwards compatibility)
-	get currentAmount() { return this.#current; }
-	get thresholdAmount() { return this.#threshold; }
-	get minAmount() { return this.#threshold; }
-	get percent() { return this.#percent; }
-	get isComplete() { return this.#current >= this.#converted(); }
-}
-
-// Define CartProgressBar custom element
-customElements.define('cart-progress-bar', CartProgressBar);
-
-// Export components for external use
-export { CartProgressBar, ProgressBar };