create-absolutejs 0.6.1 → 0.8.0

package/dist/templates/react/components/OAuthLink.tsx

@@ -1,39 +1,39 @@
-import { ProviderOption } from 'citra';
-
-type OAuthLinkProps = {
-	logoUrl: string;
-	name: string;
-	provider: Lowercase<ProviderOption> | undefined;
-	mode: 'in' | 'up';
-};
-
-export const OAuthLink = ({
-	provider,
-	logoUrl,
-	name,
-	mode
-}: OAuthLinkProps) => {
-	const buttonText = `Sign ${mode} with ${name}`;
-
-	return (
-		<a
-			style={{
-				alignItems: 'center',
-				display: 'flex',
-				gap: '0.5rem'
-			}}
-			href={provider ? `/oauth2/${provider}/authorization` : undefined}
-		>
-			{provider ? (
-				<img
-					style={{ height: '2rem', width: '2rem' }}
-					alt={`${name} logo`}
-					src={logoUrl}
-				/>
-			) : (
-				<p>Provider not configured</p>
-			)}
-			<span>{buttonText}</span>
-		</a>
-	);
-};
+import { ProviderOption } from 'citra';
+
+type OAuthLinkProps = {
+	logoUrl: string;
+	name: string;
+	provider: Lowercase<ProviderOption> | undefined;
+	mode: 'in' | 'up';
+};
+
+export const OAuthLink = ({
+	provider,
+	logoUrl,
+	name,
+	mode
+}: OAuthLinkProps) => {
+	const buttonText = `Sign ${mode} with ${name}`;
+
+	return (
+		<a
+			style={{
+				alignItems: 'center',
+				display: 'flex',
+				gap: '0.5rem'
+			}}
+			href={provider ? `/oauth2/${provider}/authorization` : undefined}
+		>
+			{provider ? (
+				<img
+					style={{ height: '2rem', width: '2rem' }}
+					alt={`${name} logo`}
+					src={logoUrl}
+				/>
+			) : (
+				<p>Provider not configured</p>
+			)}
+			<span>{buttonText}</span>
+		</a>
+	);
+};

package/dist/templates/react/components/ProfilePicture.tsx

@@ -1,56 +1,56 @@
-type ProfilePictureProps = {
-	userImage: string | null | undefined;
-	givenName?: string;
-	familyName?: string;
-	color?: string;
-	width?: string;
-	height?: string;
-	fontSize?: string;
-};
-
-export const ProfilePicture = ({
-	userImage,
-	givenName = '',
-	familyName = '',
-	color = '#4285F4',
-	width = '2rem',
-	height = '2rem',
-	fontSize = '0.85rem'
-}: ProfilePictureProps) => {
-	if (userImage) {
-		return (
-			<img
-				alt="Profile"
-				src={userImage}
-				style={{
-					borderRadius: '50%',
-					height,
-					objectFit: 'cover',
-					width
-				}}
-			/>
-		);
-	}
-
-	const initials = `${givenName.charAt(0).toUpperCase()}${familyName.charAt(0).toUpperCase()}`;
-
-	return (
-		<div
-			style={{
-				alignItems: 'center',
-				backgroundColor: color,
-				borderRadius: '50%',
-				color: 'white',
-				display: 'flex',
-				fontSize,
-				fontWeight: 600,
-				height,
-				justifyContent: 'center',
-				userSelect: 'none',
-				width
-			}}
-		>
-			{initials}
-		</div>
-	);
-};
+type ProfilePictureProps = {
+	userImage: string | null | undefined;
+	givenName?: string;
+	familyName?: string;
+	color?: string;
+	width?: string;
+	height?: string;
+	fontSize?: string;
+};
+
+export const ProfilePicture = ({
+	userImage,
+	givenName = '',
+	familyName = '',
+	color = '#4285F4',
+	width = '2rem',
+	height = '2rem',
+	fontSize = '0.85rem'
+}: ProfilePictureProps) => {
+	if (userImage) {
+		return (
+			<img
+				alt="Profile"
+				src={userImage}
+				style={{
+					borderRadius: '50%',
+					height,
+					objectFit: 'cover',
+					width
+				}}
+			/>
+		);
+	}
+
+	const initials = `${givenName.charAt(0).toUpperCase()}${familyName.charAt(0).toUpperCase()}`;
+
+	return (
+		<div
+			style={{
+				alignItems: 'center',
+				backgroundColor: color,
+				borderRadius: '50%',
+				color: 'white',
+				display: 'flex',
+				fontSize,
+				fontWeight: 600,
+				height,
+				justifyContent: 'center',
+				userSelect: 'none',
+				width
+			}}
+		>
+			{initials}
+		</div>
+	);
+};

package/dist/templates/styles/colors.ts

@@ -1,11 +1,11 @@
-export const primaryColor = '#5FBEEB';
-export const secondaryColor = '#35d5a2';
-export const tertiaryColor = '#ff4b91';
-
-export const lightPrimaryColor = '#ffffff';
-export const lightSecondaryColor = '#f5f5f5';
-export const lightTertiaryColor = '#e0e0e0';
-
-export const darkPrimaryColor = '#1a1a1a';
-export const darkSecondaryColor = '#2c2c2c';
-export const darkTertiaryColor = '#3c3c3c';
+export const primaryColor = '#5FBEEB';
+export const secondaryColor = '#35d5a2';
+export const tertiaryColor = '#ff4b91';
+
+export const lightPrimaryColor = '#ffffff';
+export const lightSecondaryColor = '#f5f5f5';
+export const lightTertiaryColor = '#e0e0e0';
+
+export const darkPrimaryColor = '#1a1a1a';
+export const darkSecondaryColor = '#2c2c2c';
+export const darkTertiaryColor = '#3c3c3c';

package/dist/templates/styles/reset.css

@@ -1,84 +1,84 @@
-* {
-	box-sizing: border-box;
-	line-height: 1.5;
-	margin: 0;
-	padding: 0;
-}
-
-html {
-	font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;
-	height: 100%;
-}
-
-body {
-	background-color: #2c2c2c;
-	color: #f5f5f5;
-	color-scheme: light dark;
-	display: flex;
-	flex-direction: column;
-	font-synthesis: none;
-	font-weight: 400;
-	height: 100%;
-	-moz-osx-font-smoothing: grayscale;
-	text-rendering: optimizeLegibility;
-	-webkit-font-smoothing: antialiased;
-}
-
-main {
-	align-items: center;
-	display: flex;
-	flex: 1;
-	flex-direction: column;
-	justify-content: center;
-	text-align: center;
-}
-
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
-	line-height: 1.1;
-}
-
-p {
-	font-size: 1.2rem;
-	max-width: 1280px;
-}
-
-a {
-	color: #5fbeeb;
-	font-size: 1.5rem;
-	font-weight: 500;
-	position: relative;
-	text-decoration: none;
-}
-
-button {
-	background-color: #1a1a1a;
-	border: 1px solid transparent;
-	border-radius: 0.5rem;
-	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
-	cursor: pointer;
-	font-family: inherit;
-	font-size: 1.1rem;
-	font-weight: 500;
-	margin: 2rem 0;
-	padding: 0.6rem 1.2rem;
-	transition: border-color 0.25s;
-}
-button:hover {
-	border-color: #5fbeeb;
-}
-button:focus,
-button:focus-visible {
-	outline: 4px auto -webkit-focus-ring-color;
-}
-
-@media (prefers-color-scheme: light) {
-	body {
-		background-color: #f5f5f5;
-		color: #1a1a1a;
-	}
-}
+* {
+	box-sizing: border-box;
+	line-height: 1.5;
+	margin: 0;
+	padding: 0;
+}
+
+html {
+	font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;
+	height: 100%;
+}
+
+body {
+	background-color: #2c2c2c;
+	color: #f5f5f5;
+	color-scheme: light dark;
+	display: flex;
+	flex-direction: column;
+	font-synthesis: none;
+	font-weight: 400;
+	height: 100%;
+	-moz-osx-font-smoothing: grayscale;
+	text-rendering: optimizeLegibility;
+	-webkit-font-smoothing: antialiased;
+}
+
+main {
+	align-items: center;
+	display: flex;
+	flex: 1;
+	flex-direction: column;
+	justify-content: center;
+	text-align: center;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+	line-height: 1.1;
+}
+
+p {
+	font-size: 1.2rem;
+	max-width: 1280px;
+}
+
+a {
+	color: #5fbeeb;
+	font-size: 1.5rem;
+	font-weight: 500;
+	position: relative;
+	text-decoration: none;
+}
+
+button {
+	background-color: #1a1a1a;
+	border: 1px solid transparent;
+	border-radius: 0.5rem;
+	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+	cursor: pointer;
+	font-family: inherit;
+	font-size: 1.1rem;
+	font-weight: 500;
+	margin: 2rem 0;
+	padding: 0.6rem 1.2rem;
+	transition: border-color 0.25s;
+}
+button:hover {
+	border-color: #5fbeeb;
+}
+button:focus,
+button:focus-visible {
+	outline: 4px auto -webkit-focus-ring-color;
+}
+
+@media (prefers-color-scheme: light) {
+	body {
+		background-color: #f5f5f5;
+		color: #1a1a1a;
+	}
+}

package/dist/templates/svelte/components/Counter.svelte

@@ -1,19 +1,19 @@
-<script lang="ts">
-	type CounterProps = {
-		initialCount: number;
-	};
-
-	let { initialCount }: CounterProps = $props();
-	import { counter } from '../composables/counter.svelte';
-	const { getCount, increment } = counter(initialCount);
-</script>
-
-<button onclick={increment}>count is {getCount()}</button>
-
-<style>
-	@media (prefers-color-scheme: light) {
-		button {
-			background-color: #ffffff;
-		}
-	}
-</style>
+<script lang="ts">
+	type CounterProps = {
+		initialCount: number;
+	};
+
+	let { initialCount }: CounterProps = $props();
+	import { counter } from '../composables/counter.svelte';
+	const { getCount, increment } = counter(initialCount);
+</script>
+
+<button onclick={increment}>count is {getCount()}</button>
+
+<style>
+	@media (prefers-color-scheme: light) {
+		button {
+			background-color: #ffffff;
+		}
+	}
+</style>

package/dist/templates/svelte/composables/counter.svelte.ts

@@ -1,14 +1,14 @@
-export const counter = (initialCount: number) => {
-	let count = $state(initialCount);
-
-	const getCount = () => count;
-
-	const increment = () => {
-		count += 1;
-	};
-
-	return {
-		getCount,
-		increment
-	};
-};
+export const counter = (initialCount: number) => {
+	let count = $state(initialCount);
+
+	const getCount = () => count;
+
+	const increment = () => {
+		count += 1;
+	};
+
+	return {
+		getCount,
+		increment
+	};
+};

package/dist/templates/tailwind/postcss.config.ts

@@ -1,8 +1,8 @@
-import autoprefixer from 'autoprefixer';
-import tailwindcss from 'tailwindcss';
-
-const config = {
-	plugins: [tailwindcss, autoprefixer]
-};
-
-export default config;
+import autoprefixer from 'autoprefixer';
+import tailwindcss from 'tailwindcss';
+
+const config = {
+	plugins: [tailwindcss, autoprefixer]
+};
+
+export default config;

package/dist/templates/tailwind/tailwind.config.ts

@@ -1,7 +1,7 @@
-import type { Config } from 'tailwindcss';
-
-const config: Config = {
-	content: ['./src/frontend/**/*.{js,ts,jsx,tsx,mdx}']
-};
-
-export default config;
+import type { Config } from 'tailwindcss';
+
+const config: Config = {
+	content: ['./src/frontend/**/*.{js,ts,jsx,tsx,mdx}']
+};
+
+export default config;

package/dist/templates/tailwind/tailwind.css

@@ -1 +1 @@
-@import 'tailwindcss';
+@import 'tailwindcss';

package/dist/templates/vue/components/CountButton.vue

@@ -1,39 +1,39 @@
-<script setup lang="ts">
-import { useCount } from '../composables/useCount';
-
-const props = defineProps<{ initialCount: number }>();
-const { count, increment } = useCount(props.initialCount);
-</script>
-
-<template>
-	<button @click="increment">count is {{ count }}</button>
-</template>
-
-<style scoped>
-button {
-	background-color: #1a1a1a;
-	border: 1px solid transparent;
-	border-radius: 0.5rem;
-	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
-	cursor: pointer;
-	font-family: inherit;
-	font-size: 1.1rem;
-	font-weight: 500;
-	margin: 2rem 0;
-	padding: 0.6rem 1.2rem;
-	transition: border-color 0.25s;
-}
-button:hover {
-	border-color: #5fbeeb;
-}
-button:focus,
-button:focus-visible {
-	outline: 4px auto -webkit-focus-ring-color;
-}
-
-@media (prefers-color-scheme: light) {
-	button {
-		background-color: #ffffff;
-	}
-}
-</style>
+<script setup lang="ts">
+import { useCount } from '../composables/useCount';
+
+const props = defineProps<{ initialCount: number }>();
+const { count, increment } = useCount(props.initialCount);
+</script>
+
+<template>
+	<button @click="increment">count is {{ count }}</button>
+</template>
+
+<style scoped>
+button {
+	background-color: #1a1a1a;
+	border: 1px solid transparent;
+	border-radius: 0.5rem;
+	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+	cursor: pointer;
+	font-family: inherit;
+	font-size: 1.1rem;
+	font-weight: 500;
+	margin: 2rem 0;
+	padding: 0.6rem 1.2rem;
+	transition: border-color 0.25s;
+}
+button:hover {
+	border-color: #5fbeeb;
+}
+button:focus,
+button:focus-visible {
+	outline: 4px auto -webkit-focus-ring-color;
+}
+
+@media (prefers-color-scheme: light) {
+	button {
+		background-color: #ffffff;
+	}
+}
+</style>

package/dist/templates/vue/composables/useCount.ts

@@ -1,14 +1,14 @@
-import { ref } from 'vue';
-
-export const useCount = (initialCount: number) => {
-	const count = ref(initialCount);
-
-	const increment = () => {
-		count.value++;
-	};
-
-	return {
-		count,
-		increment
-	};
-};
+import { ref } from 'vue';
+
+export const useCount = (initialCount: number) => {
+	const count = ref(initialCount);
+
+	const increment = () => {
+		count.value++;
+	};
+
+	return {
+		count,
+		increment
+	};
+};

package/dist/utils/checkDockerInstalled.d.ts

@@ -1,2 +1,10 @@
+export declare const resolveDockerExe: () => string;
 export declare const hasDocker: () => Promise<boolean>;
-export declare const checkDockerInstalled: () => Promise<void>;
+export declare const isDockerDaemonRunning: () => Promise<boolean>;
+export declare const ensureDockerDaemonRunning: () => Promise<{
+    daemonWasStarted: boolean;
+}>;
+export declare const shutdownDockerDaemon: () => Promise<void>;
+export declare const checkDockerInstalled: (databaseEngine?: string) => Promise<{
+    freshInstall: boolean;
+}>;