@onetype/framework 2.0.40 → 2.0.42

package/lib/items/elements/sections/footer/footer.js

@@ -1,109 +0,0 @@
-onetype.AddonReady('elements', (elements) =>
-{
-	elements.ItemAdd({
-		id: 'sections-footer',
-		icon: 'dock_to_bottom',
-		name: 'Footer',
-		description: 'Site footer with logo, link columns, integrations, trust badges, and copyright.',
-		category: 'Section',
-		author: 'OneType',
-		config: {
-			columns: {
-				type: 'array',
-				value: [
-					{
-						title: 'Product',
-						links: [
-							{ label: 'Transforms', href: '/#transforms' },
-							{ label: 'Features', href: '/#features' },
-							{ label: 'Pricing', href: '/pricing' },
-							{ label: 'Changelog', href: '/changelog' }
-						]
-					},
-					{
-						title: 'Resources',
-						links: [
-							{ label: 'Documentation', href: 'https://docs.onetype.ai/transforms' },
-							{ label: 'GitHub', href: 'https://github.com/nicely-gg/transforms' },
-							{ label: 'npm', href: 'https://www.npmjs.com/package/@nicely-gg/transforms' },
-							{ label: 'Contact', href: 'https://onetype.ai/contact' }
-						]
-					},
-					{
-						title: 'Legal',
-						links: [
-							{ label: 'Terms of Service', href: 'https://onetype.ai/legal/terms' },
-							{ label: 'Privacy Policy', href: 'https://onetype.ai/legal/privacy' },
-							{ label: 'Cookie Policy', href: 'https://onetype.ai/legal/cookies' },
-							{ label: 'Developer Agreement', href: 'https://onetype.ai/legal/developer' },
-							{ label: 'Data Processing', href: 'https://onetype.ai/legal/dpa' },
-							{ label: 'Acceptable Use', href: 'https://onetype.ai/legal/aup' },
-							{ label: 'Subprocessors', href: 'https://onetype.ai/legal/subprocessors' }
-						]
-					}
-				]
-			},
-			platforms: {
-				type: 'array',
-				value: [
-					{ icon: 'language', label: 'Any HTML' },
-					{ icon: 'web', label: 'Webflow' },
-					{ icon: 'design_services', label: 'Framer' },
-					{ icon: 'article', label: 'WordPress' },
-					{ icon: 'shopping_cart', label: 'Shopify' },
-					{ icon: 'storefront', label: 'Squarespace' }
-				]
-			},
-			badges: {
-				type: 'array',
-				value: [
-					{ icon: 'code_off', label: 'Zero Dependencies' },
-					{ icon: 'speed', label: 'Lazy Loaded' },
-					{ icon: 'devices', label: 'All Platforms' },
-					{ icon: 'open_in_new', label: 'Open Source Core' },
-					{ icon: 'verified', label: 'Web Components' }
-				]
-			}
-		},
-		render: function()
-		{
-			this.year = new Date().getFullYear();
-
-			return `
-				<footer class="holder">
-					<div class="inner">
-						<div class="brand">
-							<a class="logo" href="/">
-								<img class="logo-icon" src="https://global.divhunt.com/bd8ffd2fc9cf3a7e81b3326ac63a7cfe_4406.svg" alt="OneType" />
-							</a>
-							<p class="tagline">Custom HTML tags that become interactive components. One script, one tag — works on any platform.</p>
-							<div class="integrations">
-								<div class="integrations-list">
-									<div ot-for="item in platforms" class="integration">
-										<i>{{ item.icon }}</i>
-										<span>{{ item.label }}</span>
-									</div>
-								</div>
-							</div>
-						</div>
-						<div class="columns">
-							<div ot-for="col in columns" class="column">
-								<h4 class="column-title">{{ col.title }}</h4>
-								<a ot-for="link in col.links" class="link" :href="link.href">{{ link.label }}</a>
-							</div>
-						</div>
-					</div>
-					<div class="badges">
-						<div ot-for="badge in badges" class="badge">
-							<i>{{ badge.icon }}</i>
-							<span>{{ badge.label }}</span>
-						</div>
-					</div>
-					<div class="bottom">
-						<span class="copyright">&copy; {{ year }} OneType. All rights reserved.</span>
-					</div>
-				</footer>
-			`;
-		}
-	});
-});

package/lib/items/elements/sections/hero/hero.css

@@ -1,100 +0,0 @@
-.e-59eb0a1d
-{
-	display: flex;
-}
-
-.e-59eb0a1d > .holder
-{
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	width: 100%;
-	padding: 80px var(--ot-spacing-m) 60px;
-	text-align: center;
-	gap: var(--ot-spacing-m);
-}
-
-/* Badge */
-
-.e-59eb0a1d > .holder > .badge
-{
-	display: inline-flex;
-	align-items: center;
-	gap: 6px;
-	padding: 6px 14px;
-	border-radius: 100px;
-	border: 1px solid var(--ot-bg-2-border);
-	background: var(--ot-bg-2);
-	font-size: var(--ot-size-s);
-	font-weight: 500;
-	color: var(--ot-text-2);
-}
-
-.e-59eb0a1d > .holder > .badge > i
-{
-	font-size: 14px;
-	color: var(--ot-brand);
-}
-
-/* Title */
-
-.e-59eb0a1d > .holder > .title
-{
-	font-size: 52px;
-	font-weight: 800;
-	line-height: 1.1;
-	color: var(--ot-text-1);
-	letter-spacing: -1px;
-	margin: 0;
-}
-
-.e-59eb0a1d > .holder > .title > .highlight
-{
-	color: var(--ot-brand);
-}
-
-/* Description */
-
-.e-59eb0a1d > .holder > .description
-{
-	max-width: 480px;
-	font-size: var(--ot-size-m);
-	line-height: 1.6;
-	color: var(--ot-text-2);
-	margin: 0;
-}
-
-/* Buttons */
-
-.e-59eb0a1d > .holder > .buttons
-{
-	display: flex;
-	align-items: center;
-	gap: var(--ot-spacing-s);
-	margin-top: var(--ot-spacing-s);
-}
-
-/* Trust */
-
-.e-59eb0a1d > .holder > .trust
-{
-	display: flex;
-	align-items: center;
-	gap: var(--ot-spacing-m);
-	margin-top: var(--ot-spacing-x);
-}
-
-.e-59eb0a1d > .holder > .trust > .trust-item
-{
-	display: flex;
-	align-items: center;
-	gap: 4px;
-	font-size: var(--ot-size-s);
-	color: var(--ot-text-2);
-}
-
-.e-59eb0a1d > .holder > .trust > .trust-item > i
-{
-	font-size: 14px;
-	color: var(--ot-green);
-}

package/lib/items/elements/sections/hero/hero.js

@@ -1,54 +0,0 @@
-onetype.AddonReady('elements', (elements) =>
-{
-	elements.ItemAdd({
-		id: 'sections-hero',
-		icon: 'star',
-		name: 'Hero',
-		description: 'Hero section with badge, heading, description, and CTA buttons.',
-		category: 'Component',
-		author: 'OneType',
-		config: {
-			badge: {
-				type: 'string',
-				value: 'Interactive HTML Components'
-			},
-			title: {
-				type: 'string',
-				value: 'One tag.'
-			},
-			highlight: {
-				type: 'string',
-				value: 'Zero config.'
-			},
-			description: {
-				type: 'string',
-				value: 'Drop a custom HTML tag, get an interactive component. Swiper, tabs, accordion, modal — works on any platform. No build tools, no JavaScript required.'
-			},
-			buttons: {
-				type: 'array',
-				value: [
-					{ text: 'Get Started', icon: 'arrow_forward', href: '#get-started', variant: 'brand' },
-					{ text: 'View on GitHub', icon: 'code', href: 'https://github.com/nicely-gg/transforms', variant: 'ghost border' }
-				]
-			}
-		},
-		render: function()
-		{
-			return `
-				<div class="holder">
-					<div ot-if="badge" class="badge"><i>widgets</i> {{ badge }}</div>
-					<h1 class="title">{{ title }}<br><span class="highlight">{{ highlight }}</span></h1>
-					<p ot-if="description" class="description">{{ description }}</p>
-					<div ot-if="buttons.length" class="buttons">
-						<e-button ot-for="btn in buttons" :text="btn.text" :icon="btn.icon" :href="btn.href" :variant="[btn.variant, 'size-m']"></e-button>
-					</div>
-					<div class="trust">
-						<span class="trust-item"><i>check_circle</i> Works everywhere</span>
-						<span class="trust-item"><i>check_circle</i> Zero dependencies</span>
-						<span class="trust-item"><i>check_circle</i> Free tier available</span>
-					</div>
-				</div>
-			`;
-		}
-	});
-});

package/lib/items/elements/sections/pricing/pricing.css

@@ -1,148 +0,0 @@
-.e-21efbac3
-{
-	display: flex;
-	width: 100%;
-}
-
-.e-21efbac3 > .holder
-{
-	display: flex;
-	flex-direction: column;
-	width: 100%;
-	padding: var(--ot-spacing-l) var(--ot-spacing-m);
-	gap: var(--ot-spacing-l);
-}
-
-.e-21efbac3 > .holder.highlighted
-{
-	border-top: 2px solid var(--ot-brand);
-}
-
-/* Header */
-
-.e-21efbac3 > .holder > .header
-{
-	display: flex;
-	flex-direction: column;
-	gap: var(--ot-spacing-s);
-}
-
-.e-21efbac3 > .holder > .header > .badge
-{
-	display: inline-flex;
-	align-self: flex-start;
-	padding: 3px 10px;
-	border-radius: 100px;
-	background: color-mix(in srgb, var(--ot-brand) 12%, transparent);
-	font-size: 11px;
-	font-weight: 600;
-	color: var(--ot-brand);
-	text-transform: uppercase;
-	letter-spacing: 0.5px;
-}
-
-.e-21efbac3 > .holder > .header > .name
-{
-	font-size: 20px;
-	font-weight: 700;
-	color: var(--ot-text-1);
-	margin: 0;
-}
-
-.e-21efbac3 > .holder > .header > .description
-{
-	font-size: var(--ot-size-s);
-	color: var(--ot-text-2);
-	line-height: 1.5;
-	margin: 0;
-}
-
-.e-21efbac3 > .holder > .header > .price
-{
-	display: flex;
-	align-items: baseline;
-	gap: 2px;
-	margin-top: var(--ot-spacing-x);
-}
-
-.e-21efbac3 > .holder > .header > .price > .currency
-{
-	font-size: 20px;
-	font-weight: 700;
-	color: var(--ot-text-1);
-}
-
-.e-21efbac3 > .holder > .header > .price > .amount
-{
-	font-size: 40px;
-	font-weight: 800;
-	color: var(--ot-text-1);
-	line-height: 1;
-}
-
-.e-21efbac3 > .holder > .header > .price > .period
-{
-	font-size: var(--ot-size-m);
-	color: var(--ot-text-2);
-	margin-left: 4px;
-}
-
-.e-21efbac3 > .holder > .header > .yearly
-{
-	font-size: var(--ot-size-s);
-	color: var(--ot-text-2);
-}
-
-/* Features */
-
-.e-21efbac3 > .holder > .features
-{
-	display: flex;
-	flex-direction: column;
-	gap: var(--ot-spacing-s);
-	flex: 1;
-	padding-top: var(--ot-spacing-l);
-	border-top: 1px solid var(--ot-bg-2-border);
-}
-
-.e-21efbac3 > .holder > .features > .feature
-{
-	display: flex;
-	align-items: center;
-	gap: var(--ot-spacing-s);
-}
-
-.e-21efbac3 > .holder > .features > .feature > .icon
-{
-	font-size: 18px;
-	flex-shrink: 0;
-	color: var(--ot-green);
-}
-
-.e-21efbac3 > .holder > .features > .feature > .text
-{
-	font-size: var(--ot-size-m);
-	color: var(--ot-text-2);
-}
-
-/* Disabled */
-
-.e-21efbac3 > .holder > .features > .feature.disabled > .icon
-{
-	color: var(--ot-text-2);
-	opacity: 0.4;
-}
-
-.e-21efbac3 > .holder > .features > .feature.disabled > .text
-{
-	color: var(--ot-text-2);
-	opacity: 0.4;
-}
-
-/* Action */
-
-.e-21efbac3 > .holder > .action
-{
-	display: flex;
-	margin-top: auto;
-}

package/lib/items/elements/sections/stats/stats.css

@@ -1,34 +0,0 @@
-.e-1d2b5bd6
-{
-	display: flex;
-}
-
-.e-1d2b5bd6 > .holder
-{
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	gap: var(--ot-spacing-l);
-	width: 100%;
-}
-
-.e-1d2b5bd6 > .holder > .item
-{
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	gap: var(--ot-spacing-x);
-}
-
-.e-1d2b5bd6 > .holder > .item > .value
-{
-	font-size: var(--ot-size-l);
-	font-weight: 700;
-	color: var(--ot-brand);
-}
-
-.e-1d2b5bd6 > .holder > .item > .label
-{
-	font-size: var(--ot-size-s);
-	color: var(--ot-text-2);
-}

package/lib/items/elements/sections/stats/stats.js

@@ -1,74 +0,0 @@
-onetype.AddonReady('elements', (elements) =>
-{
-	elements.ItemAdd({
-		id: 'sections-stats',
-		icon: 'bar_chart',
-		name: 'Stats',
-		description: 'Animated statistics row.',
-		category: 'Component',
-		author: 'OneType',
-		config: {
-			items: {
-				type: 'array',
-				value: [
-					{ value: 30, suffix: '+', label: 'Actions' },
-					{ value: 8, suffix: '+', label: 'Integrations' },
-					{ value: 100000, suffix: '+', label: 'Executions' },
-					{ value: 1500, suffix: '+', label: 'Users' }
-				]
-			}
-		},
-		render: function()
-		{
-			this.counts = this.items.map(() => 0);
-
-			this.animate = () =>
-			{
-				const duration = 1500;
-				const start = performance.now();
-
-				const step = (now) =>
-				{
-					const progress = Math.min((now - start) / duration, 1);
-					const ease = 1 - Math.pow(1 - progress, 3);
-
-					this.items.forEach((item, i) =>
-					{
-						this.counts[i] = Math.round(ease * item.value);
-					});
-
-					this.Update();
-
-					if(progress < 1)
-					{
-						requestAnimationFrame(step);
-					}
-				};
-
-				requestAnimationFrame(step);
-			};
-
-			this.format = (num) =>
-			{
-				return num.toLocaleString('en-US');
-			};
-
-			this.display = (index) =>
-			{
-				const item = this.items[index];
-				return (item.prefix || '') + this.format(this.counts[index]) + (item.suffix || '');
-			};
-
-			setTimeout(() => this.animate(), 200);
-
-			return `
-				<div class="holder">
-					<div ot-for="item, index in items" class="item">
-						<span class="value">{{ display(index) }}</span>
-						<span class="label">{{ item.label }}</span>
-					</div>
-				</div>
-			`;
-		}
-	});
-});