@stamcat/craftsman 0.0.23-alpha.24 → 0.0.23-alpha.26

package/src/styles/utilities/layout.d.ts

@@ -1,10 +1,13 @@
 import { CSSObject, SerializedStyles } from '@emotion/react';
-import { Breakpoint, LayoutWidthsType, ResponsiveWidth } from './types';
-export declare const widths: ResponsiveWidth;
+import { Breakpoint, LayoutWidthsType } from './types';
+export declare const widths: Record<LayoutWidthsType, string>;
 export declare const media: {
     readonly mobile: string;
+    readonly mobileMax: string;
     readonly tablet: string;
+    readonly tabletMax: string;
     readonly desktop: string;
+    readonly desktopMax: string;
     readonly extDesktop: string;
     readonly mobileOnly: string;
     readonly tabletOnly: string;

package/src/styles/utilities/layout.esm.js

@@ -1,31 +1,26 @@
-import { getCraftsmanConfig as e } from "./config.esm.js";
-import { css as t } from "@emotion/react";
+import { defaultWidths as e } from "./constants.esm.js";
+import { LayoutWidthsSchema as t } from "./types.esm.js";
+import { css as n } from "@emotion/react";
 //#region src/styles/utilities/layout.ts
-var n = [
-	"text",
-	"column",
-	"gutter",
-	"extDesktop",
-	"extNav",
-	"desktop",
-	"tablet",
-	"extMobile",
-	"mobileMax",
-	"tabletMax",
-	"desktopMax"
-].reduce((t, n) => (t[n] = {
-	enumerable: !0,
-	get: () => e().widths[n]
-}, t), {}), r = Object.defineProperties({}, n), i = {
+var r = Object.fromEntries(t.options.map((t) => [t, `var(--w-${t}, ${e[t]}px)`])), i = {
 	get mobile() {
 		return "(min-width: 0px)";
 	},
+	get mobileMax() {
+		return `(max-width: ${r.mobileMax}px)`;
+	},
 	get tablet() {
 		return `(min-width: ${r.tablet}px)`;
 	},
+	get tabletMax() {
+		return `(max-width: ${r.tabletMax}px)`;
+	},
 	get desktop() {
 		return `(min-width: ${r.desktop}px)`;
 	},
+	get desktopMax() {
+		return `(max-width: ${r.desktopMax}px)`;
+	},
 	get extDesktop() {
 		return `(min-width: ${r.extDesktop}px)`;
 	},
@@ -42,14 +37,14 @@ var n = [
 		return `(min-width: ${r.desktop}px) and (max-width: ${r.desktopMax}px)`;
 	}
 }, a = (e, t = 1, n = !0) => {
-	let i = 0;
+	let i = r[e];
 	if (e === "column") {
-		let e = t - 1;
-		i = r.gutter * e;
+		let e = t - 1, a = `calc((${i} * ${t}) + (${r.gutter} * ${e}))`;
+		return n ? a : `calc(((${i} / 1px) * ${t}) + ((${r.gutter} / 1px) * ${e}))`;
 	}
-	return `${r[e] * t + i}${n ? "px" : ""}`;
-}, o = (e, n) => t`@media ${i[e]} {
-        ${n}
+	return n ? t === 1 ? i : `calc(${i} * ${t})` : t === 1 ? `calc(${i} / 1px)` : `calc((${i} / 1px) * ${t})`;
+}, o = (e, t) => n`@media ${i[e]} {
+        ${t}
     }`;
 //#endregion
 export { o as breakpoint, i as media, a as width, r as widths };

package/src/styles/utilities/types.d.ts

@@ -1,17 +1,51 @@
-type BaseLayoutWidth = "column" | "gutter" | "extDesktop" | "extNav" | "desktop" | "tablet" | "extMobile";
-type MaxLayoutWidth = "mobileMax" | "tabletMax" | "desktopMax";
-export type Breakpoint = "mobile" | "tablet" | "desktop" | "extDesktop" | "mobileOnly" | "tabletOnly" | "mobileTablet" | "desktopOnly";
-export type LayoutWidthsType = BaseLayoutWidth | MaxLayoutWidth;
-export type Width = Record<"text" | BaseLayoutWidth, number>;
-export type ResponsiveWidth = Width & Record<MaxLayoutWidth, number>;
+import { default as z } from 'zod';
+export declare const BaseWidthSchema: z.ZodEnum<{
+    gutter: "gutter";
+    column: "column";
+}>;
+export declare const ScreenWidthSchema: z.ZodEnum<{
+    tablet: "tablet";
+    desktop: "desktop";
+    extDesktop: "extDesktop";
+}>;
+export declare const MaxScreenWidthSchema: z.ZodEnum<{
+    mobileMax: "mobileMax";
+    tabletMax: "tabletMax";
+    desktopMax: "desktopMax";
+}>;
+export declare const BreakpointSchema: z.ZodEnum<{
+    tablet: "tablet";
+    desktop: "desktop";
+    extDesktop: "extDesktop";
+    mobileMax: "mobileMax";
+    tabletMax: "tabletMax";
+    desktopMax: "desktopMax";
+    mobileOnly: "mobileOnly";
+    tabletOnly: "tabletOnly";
+    mobileTablet: "mobileTablet";
+    desktopOnly: "desktopOnly";
+}>;
+export declare const LayoutWidthsSchema: z.ZodEnum<{
+    gutter: "gutter";
+    column: "column";
+    tablet: "tablet";
+    desktop: "desktop";
+    extDesktop: "extDesktop";
+    mobileMax: "mobileMax";
+    tabletMax: "tabletMax";
+    desktopMax: "desktopMax";
+    text: "text";
+}>;
+export type BaseWidth = z.infer<typeof BaseWidthSchema>;
+export type ScreenWidth = z.infer<typeof ScreenWidthSchema>;
+export type MaxScreenWidth = z.infer<typeof MaxScreenWidthSchema>;
+export type Breakpoint = z.infer<typeof BreakpointSchema>;
+export type LayoutWidthsType = z.infer<typeof LayoutWidthsSchema>;
+export type Width = Record<LayoutWidthsType, number>;
 export type Colors = Record<string, string>;
 export type ColorType = "rgba" | "hex";
-export type CraftsmanConfig = {
-    colors: Colors;
-    widths: Width;
-};
-export type CraftsmanStyleConfig = Partial<{
-    colors: Partial<Colors>;
-    widths: Partial<Width>;
+export declare const zTextInputExclusions: z.ZodEnum<{
+    checkbox: "checkbox";
+    radio: "radio";
 }>;
-export {};
+export type TextInputExclusions = z.infer<typeof zTextInputExclusions>;

package/src/styles/utilities/types.esm.js

@@ -0,0 +1,25 @@
+import e from "zod";
+//#region src/styles/utilities/types.ts
+var t = e.enum(["gutter", "column"]), n = e.enum([
+	"tablet",
+	"desktop",
+	"extDesktop"
+]), r = e.enum([
+	"mobileMax",
+	"tabletMax",
+	"desktopMax"
+]), i = e.enum([
+	...n.options,
+	...r.options,
+	"mobileOnly",
+	"tabletOnly",
+	"mobileTablet",
+	"desktopOnly"
+]), a = e.enum([
+	...t.options,
+	...n.options,
+	...r.options,
+	"text"
+]), o = e.enum(["checkbox", "radio"]);
+//#endregion
+export { t as BaseWidthSchema, i as BreakpointSchema, a as LayoutWidthsSchema, r as MaxScreenWidthSchema, n as ScreenWidthSchema, o as zTextInputExclusions };

package/src/styles/utilities/config.d.ts

@@ -1,7 +0,0 @@
-import { ResponsiveWidth, CraftsmanStyleConfig } from './types';
-export declare function setCraftsmanConfig(config: CraftsmanStyleConfig): void;
-export declare function resetCraftsmanConfig(): void;
-export declare function getCraftsmanConfig(): {
-    colors: Record<string, string>;
-    widths: ResponsiveWidth;
-};

package/src/styles/utilities/config.esm.js

@@ -1,41 +0,0 @@
-import { defaultColors as e, defaultWidths as t } from "./constants.esm.js";
-//#region src/styles/utilities/config.ts
-var n = {
-	colors: e,
-	widths: t
-}, r = {
-	colors: { ...n.colors },
-	widths: { ...n.widths }
-};
-function i(e) {
-	return {
-		...e,
-		mobileMax: e.tablet - 1e-5,
-		tabletMax: e.desktop - 1e-5,
-		desktopMax: e.extDesktop - 1e-5
-	};
-}
-function a(e) {
-	let t = Object.entries(e.colors ?? {}).reduce((e, [t, n]) => (typeof n == "string" && (e[t] = n), e), {}), n = e.widths ? { ...e.widths } : {};
-	r = {
-		colors: {
-			...r.colors,
-			...t
-		},
-		widths: {
-			...r.widths,
-			...n
-		}
-	};
-}
-function o() {
-	r = { ...n };
-}
-function s() {
-	return {
-		colors: { ...r.colors },
-		widths: i(r.widths)
-	};
-}
-//#endregion
-export { s as getCraftsmanConfig, o as resetCraftsmanConfig, a as setCraftsmanConfig };