@upstart.gg/sdk 0.0.51

package/dist/shared/themes/color-system.d.ts

@@ -0,0 +1,323 @@
+import { Theme } from '../theme.js';
+export { default as chroma } from 'chroma-js';
+import '@sinclair/typebox';
+
+type ColorType = "primary" | "secondary" | "accent" | "neutral";
+type ElementColorType = "page-background" | "background" | "text" | "page-text" | "border" | "shadow" | "accent";
+type HarmonyType = "complementary" | "analogous" | "triadic" | "split-complementary" | "tetradic";
+declare const colorAdjustments: readonly ["pastel", "soft", "default", "bold", "vibrant", "muted", "deep"];
+declare const colorAdjustmentsLuminous: readonly ["pastel", "soft", "default", "bold", "vibrant"];
+declare const colorAdjustmentsSubdued: readonly ["muted", "deep"];
+type ColorAdjustment = (typeof colorAdjustments)[number];
+declare const shades: readonly ["900", "800", "700", "600", "500", "400", "300", "200", "100", "50"];
+type ElementColor = string;
+interface ColorConstraints {
+    lightness: number;
+    saturation: number;
+}
+declare const getHarmoniousHues: (baseHue: number, harmonyType: HarmonyType) => number[];
+declare function getColorsSuggestions(baseHueOrColor: number | string, theme: Theme): number[];
+declare const generateShades: (baseColor: string) => Record<string, string>;
+interface ContrastRequirements {
+    minContrast: number;
+    preferredContrast: number;
+}
+declare function isStandardColor(color: unknown): boolean;
+/**
+ * @deprecated Not working well with gradients
+ */
+declare const generateReadableTextColor: (backgroundColor: string, requirements?: ContrastRequirements) => string;
+declare function propToStyle(prop: string | number | undefined, cssAttr: string): string | undefined;
+declare function generateColorsVars(theme: Theme): Record<string, string>;
+interface TextColors {
+    base: string;
+    subtle: string;
+    strong: string;
+    tonal: string;
+    "tonal-subtle": string;
+    "tonal-strong": string;
+}
+declare const generateTextColors: (backgroundColor: string, requirements?: ContrastRequirements) => TextColors;
+declare const colorFamilies: {
+    readonly Reds: readonly [{
+        readonly name: "Red";
+        readonly base: 0;
+        readonly description: "Pure red";
+    }, {
+        readonly name: "Vermilion";
+        readonly base: 5;
+        readonly description: "Bright red-orange";
+    }, {
+        readonly name: "Scarlet";
+        readonly base: 10;
+        readonly description: "Bright orange-red";
+    }, {
+        readonly name: "Carmine";
+        readonly base: 345;
+        readonly description: "Deep red with purple";
+    }, {
+        readonly name: "Ruby";
+        readonly base: 350;
+        readonly description: "Deep, rich red";
+    }, {
+        readonly name: "Cherry";
+        readonly base: 355;
+        readonly description: "Deep red with slight blue";
+    }];
+    readonly Pinks: readonly [{
+        readonly name: "Coral";
+        readonly base: 15;
+        readonly description: "Orange-pink";
+    }, {
+        readonly name: "Rose";
+        readonly base: 330;
+        readonly description: "Deep pink";
+    }, {
+        readonly name: "Hot Pink";
+        readonly base: 335;
+        readonly description: "Vivid pink";
+    }, {
+        readonly name: "Pink";
+        readonly base: 340;
+        readonly description: "True pink";
+    }, {
+        readonly name: "Rose Gold";
+        readonly base: 345;
+        readonly description: "Metallic pink";
+    }, {
+        readonly name: "Fuchsia";
+        readonly base: 320;
+        readonly description: "Vivid purple-pink";
+    }, {
+        readonly name: "Magenta";
+        readonly base: 300;
+        readonly description: "Pure magenta";
+    }];
+    readonly Purples: readonly [{
+        readonly name: "Purple";
+        readonly base: 270;
+        readonly description: "True purple";
+    }, {
+        readonly name: "Lavender";
+        readonly base: 275;
+        readonly description: "Light purple";
+    }, {
+        readonly name: "Violet";
+        readonly base: 280;
+        readonly description: "Blue-purple";
+    }, {
+        readonly name: "Mauve";
+        readonly base: 285;
+        readonly description: "Muted purple";
+    }, {
+        readonly name: "Plum";
+        readonly base: 290;
+        readonly description: "Deep purple";
+    }, {
+        readonly name: "Orchid";
+        readonly base: 295;
+        readonly description: "Light violet-purple";
+    }];
+    readonly Blues: readonly [{
+        readonly name: "Arctic";
+        readonly base: 200;
+        readonly description: "Icy blue";
+    }, {
+        readonly name: "Cerulean";
+        readonly base: 205;
+        readonly description: "Sky-ocean blue";
+    }, {
+        readonly name: "Blue";
+        readonly base: 210;
+        readonly description: "True blue";
+    }, {
+        readonly name: "Cobalt";
+        readonly base: 215;
+        readonly description: "Pure deep blue";
+    }, {
+        readonly name: "Navy";
+        readonly base: 220;
+        readonly description: "Dark blue";
+    }, {
+        readonly name: "Indigo";
+        readonly base: 230;
+        readonly description: "Deep blue-purple";
+    }];
+    readonly Cyans: readonly [{
+        readonly name: "Aquamarine";
+        readonly base: 160;
+        readonly description: "Light blue-green";
+    }, {
+        readonly name: "Teal";
+        readonly base: 170;
+        readonly description: "Dark blue-green";
+    }, {
+        readonly name: "Turquoise";
+        readonly base: 175;
+        readonly description: "Blue-green";
+    }, {
+        readonly name: "Cyan";
+        readonly base: 180;
+        readonly description: "Pure cyan";
+    }, {
+        readonly name: "Ocean";
+        readonly base: 185;
+        readonly description: "Deep water blue";
+    }, {
+        readonly name: "Aqua";
+        readonly base: 190;
+        readonly description: "Light blue-green";
+    }];
+    readonly Greens: readonly [{
+        readonly name: "Lime";
+        readonly base: 90;
+        readonly description: "Yellow-tinted green";
+    }, {
+        readonly name: "Olive";
+        readonly base: 110;
+        readonly description: "Yellow-green";
+    }, {
+        readonly name: "Green";
+        readonly base: 120;
+        readonly description: "True green";
+    }, {
+        readonly name: "Jade";
+        readonly base: 130;
+        readonly description: "Rich medium green";
+    }, {
+        readonly name: "Sage";
+        readonly base: 135;
+        readonly description: "Muted green";
+    }, {
+        readonly name: "Emerald";
+        readonly base: 140;
+        readonly description: "Bright green";
+    }, {
+        readonly name: "Forest";
+        readonly base: 150;
+        readonly description: "Dark green";
+    }, {
+        readonly name: "Mint";
+        readonly base: 160;
+        readonly description: "Light cool green";
+    }];
+    readonly Yellows: readonly [{
+        readonly name: "Honey";
+        readonly base: 43;
+        readonly description: "Warm yellow";
+    }, {
+        readonly name: "Gold";
+        readonly base: 45;
+        readonly description: "Yellow-orange";
+    }, {
+        readonly name: "Banana";
+        readonly base: 52;
+        readonly description: "Warm light yellow";
+    }, {
+        readonly name: "Butter";
+        readonly base: 55;
+        readonly description: "Soft yellow";
+    }, {
+        readonly name: "Lemon";
+        readonly base: 58;
+        readonly description: "Light yellow";
+    }, {
+        readonly name: "Yellow";
+        readonly base: 60;
+        readonly description: "True yellow";
+    }];
+    readonly Oranges: readonly [{
+        readonly name: "Rust";
+        readonly base: 20;
+        readonly description: "Dark orange-brown";
+    }, {
+        readonly name: "Tangerine";
+        readonly base: 25;
+        readonly description: "Bright orange";
+    }, {
+        readonly name: "Orange";
+        readonly base: 30;
+        readonly description: "True orange";
+    }, {
+        readonly name: "Marigold";
+        readonly base: 35;
+        readonly description: "Deep yellow-orange";
+    }];
+    readonly Browns: readonly [{
+        readonly name: "Sienna";
+        readonly base: 20;
+        readonly description: "Reddish brown";
+    }, {
+        readonly name: "Cedar";
+        readonly base: 22;
+        readonly description: "Red-tinted brown";
+    }, {
+        readonly name: "Brown";
+        readonly base: 25;
+        readonly description: "True brown";
+    }, {
+        readonly name: "Sepia";
+        readonly base: 30;
+        readonly description: "Warm dark brown";
+    }, {
+        readonly name: "Tan";
+        readonly base: 34;
+        readonly description: "Light brown";
+    }, {
+        readonly name: "Khaki";
+        readonly base: 37;
+        readonly description: "Yellow-brown";
+    }];
+    readonly Grays: readonly [{
+        readonly name: "Charcoal";
+        readonly base: 200;
+        readonly description: "Dark gray";
+        readonly lowSaturation: true;
+    }, {
+        readonly name: "Silver";
+        readonly base: 210;
+        readonly description: "Light metallic gray";
+        readonly lowSaturation: true;
+    }, {
+        readonly name: "Slate";
+        readonly base: 215;
+        readonly description: "Blue-gray";
+        readonly lowSaturation: true;
+    }, {
+        readonly name: "Gray";
+        readonly base: 220;
+        readonly description: "True gray";
+        readonly lowSaturation: true;
+    }, {
+        readonly name: "Steel";
+        readonly base: 225;
+        readonly description: "Cool gray";
+        readonly lowSaturation: true;
+    }];
+};
+declare const colorAdjustmentBaseValues: Record<ColorAdjustment, Record<ColorType, ColorConstraints>>;
+/**
+ * Color Variants
+ * Different visual variants for color application
+ */
+type ColorVariant = "surface" | "filled" | "soft" | "ghost" | "outlined" | "faded" | "glazed" | "solid";
+declare const generateVariantClasses: (variant: ColorVariant, colorType: ColorType) => {
+    base: {
+        background: string;
+        content: string;
+    };
+    hover: {
+        background: string;
+        content: string;
+    };
+    active: {
+        background: string;
+        content: string;
+    };
+    disabled: {
+        background: string;
+        content: string;
+    };
+};
+
+export { type ColorAdjustment, type ColorType, type ColorVariant, type ElementColor, type ElementColorType, type HarmonyType, colorAdjustmentBaseValues, colorAdjustments, colorAdjustmentsLuminous, colorAdjustmentsSubdued, colorFamilies, generateColorsVars, generateReadableTextColor, generateShades, generateTextColors, generateVariantClasses, getColorsSuggestions, getHarmoniousHues, isStandardColor, propToStyle, shades };

package/dist/shared/themes/color-system.js

@@ -0,0 +1,2 @@
+/*! Enpage - Copyright (C) 2024 Flippable - https://github.com/enpage/enpage/blob/main/LICENSE */
+import a from"chroma-js";import{default as U}from"chroma-js";import{colors as d,css as F}from"@upstart.gg/style-system/twind";var A=["pastel","soft","default","bold","vibrant","muted","deep"],O=["pastel","soft","default","bold","vibrant"],P=["muted","deep"],V=["900","800","700","600","500","400","300","200","100","50"],C=(e,n)=>{switch(n){case"complementary":return[e,(e+180)%360];case"analogous":return[(e-30+360)%360,e,(e+30)%360];case"triadic":return[e,(e+120)%360,(e+240)%360];case"split-complementary":return[e,(e+150)%360,(e+210)%360];case"tetradic":return[e,(e+90)%360,(e+180)%360,(e+270)%360]}};function I(e,n){let t=typeof e=="string"?a(e).get("hsl.h"):e,i=[...Object.values(n.colors).map(l=>a(l).get("hsl.h")),t];return console.log({baseHueOrColor:e,excluded:i}),Array.from(new Set([...C(t,"complementary"),...C(t,"analogous"),...C(t,"triadic"),...C(t,"tetradic"),...C(t,"split-complementary")])).sort().filter(l=>i.includes(l)===!1).slice(0,8)}var M=e=>{let n=a(e).oklab(),[t,s,i]=n,l=Math.sqrt(s*s+i*i),r=Math.atan2(i,s),u={50:[.3,.12],100:[.25,.25],200:[.2,.4],300:[.1,.7],400:[.05,.85],500:[0,1],600:[-.05,1.1],700:[-.1,1.2],800:[-.15,1.3],900:[-.2,1.4]},o={},g=new Set;return Object.entries(u).forEach(([c,[w,b]])=>{try{let y=Math.max(.01,Math.min(.99,t+w)),h=l*b,f=h*Math.cos(r),m=h*Math.sin(r),p=a.oklab(y,f,m).hex();if(g.has(p)){let x=y+(c>"500"?-.02:.02),v=h*(c>"500"?1.05:.95),$=v*Math.cos(r),T=v*Math.sin(r);o[c]=a.oklab(x,$,T).hex()}else o[c]=p;g.add(o[c])}catch(y){console.error(`Error generating shade ${c}:`,y),o[c]=e}}),new Set(Object.values(o)).size!==Object.keys(u).length&&Object.entries(o).forEach(([c,w],b)=>{if(b>0&&o[Object.keys(o)[b-1]]===w){let y=Object.keys(o)[b-1],[h,f]=u[c],m=t+h*1.2,p=l*(f*1.1),x=p*Math.cos(r),v=p*Math.sin(r);o[c]=a.oklab(m,x,v).hex()}}),o};function S(e){return typeof e!="string"?!1:e.startsWith("rgb")||e.startsWith("hsl")||e.startsWith("#")||e.startsWith("var(--")}function B(e){let n=e.match(/\s((from|to-)[\S]+)/);return n?n[1]:e}var q=(e,n={minContrast:4.5,preferredContrast:7})=>{if(!S(e)){e=B(e),console.log("backgroundColor rewrite to",e);let t=document.querySelector(`.${e}`);if(!t)return console.warn("No matching element:",e),"#000000";e=window.getComputedStyle(t).backgroundColor,console.log("backgroundColor from element",e)}try{let t=a(e).luminance(),s=a.contrast(e,"#000000"),i=a.contrast(e,"#FFFFFF");return i>=n.minContrast||s>=n.minContrast?i>s?"#FFFFFF":"#000000":t>.5?"#FFFFFF":"#000000"}catch{return console.warn("Invalid color provided:",e),"#000000"}};function W(e,n){if(!(typeof e>"u"))return S(e)||typeof e=="number"?F({[n]:e}):e}function E(e){let n=Object.entries(e.colors).reduce((t,[s,i])=>{t[`color-${s}`]=i;for(let[l,r]of Object.entries(M(i))){t[`color-${s}-${l}`]=r;for(let[u,o]of Object.entries(L(r)))u==="base"?t[`text-${s}-${l}`]=o:t[`text-${s}-${l}-${u}`]=o}return t},{});return n["color-gray-50"]=d.gray[50],n["color-gray-100"]=d.gray[100],n["color-gray-200"]=d.gray[200],n["color-gray-300"]=d.gray[300],n["color-gray-400"]=d.gray[400],n["color-gray-500"]=d.gray[500],n["color-gray-600"]=d.gray[600],n["color-gray-700"]=d.gray[700],n["color-gray-800"]=d.gray[800],n["color-gray-900"]=d.gray[900],n}var L=(e,n={minContrast:4.5,preferredContrast:7})=>{try{let t=a(e),s=t.luminance(),[i,l,r]=t.hsl(),u=s>.5?"#000000":"#FFFFFF",o={base:u,subtle:a.mix(e,u,.4).hex(),strong:a.mix(e,u,.9).hex()},g=f=>{let m=l,p=a.hsl(i,m,f);for(;a.contrast(e,p)<n.minContrast&&m<1;)m=Math.min(1,m+.1),p=a.hsl(i,m,f);return p.hex()},k=g(Math.min(.95,r+.4)),c=g(Math.max(.05,r-.4)),w=a.contrast(e,k),b=a.contrast(e,c),h={tonal:w>b?k:c,"tonal-subtle":s>.5?g(Math.max(.1,r-.2)):g(Math.min(.9,r+.2)),"tonal-strong":s>.5?g(Math.max(.05,r-.6)):g(Math.min(.95,r+.6))};return{...o,...h}}catch{return console.warn("Invalid color provided:",e),{base:"#000000",subtle:"#000000",strong:"#000000",tonal:"#000000","tonal-subtle":"#000000","tonal-strong":"#000000"}}},G={Reds:[{name:"Red",base:0,description:"Pure red"},{name:"Vermilion",base:5,description:"Bright red-orange"},{name:"Scarlet",base:10,description:"Bright orange-red"},{name:"Carmine",base:345,description:"Deep red with purple"},{name:"Ruby",base:350,description:"Deep, rich red"},{name:"Cherry",base:355,description:"Deep red with slight blue"}],Pinks:[{name:"Coral",base:15,description:"Orange-pink"},{name:"Rose",base:330,description:"Deep pink"},{name:"Hot Pink",base:335,description:"Vivid pink"},{name:"Pink",base:340,description:"True pink"},{name:"Rose Gold",base:345,description:"Metallic pink"},{name:"Fuchsia",base:320,description:"Vivid purple-pink"},{name:"Magenta",base:300,description:"Pure magenta"}],Purples:[{name:"Purple",base:270,description:"True purple"},{name:"Lavender",base:275,description:"Light purple"},{name:"Violet",base:280,description:"Blue-purple"},{name:"Mauve",base:285,description:"Muted purple"},{name:"Plum",base:290,description:"Deep purple"},{name:"Orchid",base:295,description:"Light violet-purple"}],Blues:[{name:"Arctic",base:200,description:"Icy blue"},{name:"Cerulean",base:205,description:"Sky-ocean blue"},{name:"Blue",base:210,description:"True blue"},{name:"Cobalt",base:215,description:"Pure deep blue"},{name:"Navy",base:220,description:"Dark blue"},{name:"Indigo",base:230,description:"Deep blue-purple"}],Cyans:[{name:"Aquamarine",base:160,description:"Light blue-green"},{name:"Teal",base:170,description:"Dark blue-green"},{name:"Turquoise",base:175,description:"Blue-green"},{name:"Cyan",base:180,description:"Pure cyan"},{name:"Ocean",base:185,description:"Deep water blue"},{name:"Aqua",base:190,description:"Light blue-green"}],Greens:[{name:"Lime",base:90,description:"Yellow-tinted green"},{name:"Olive",base:110,description:"Yellow-green"},{name:"Green",base:120,description:"True green"},{name:"Jade",base:130,description:"Rich medium green"},{name:"Sage",base:135,description:"Muted green"},{name:"Emerald",base:140,description:"Bright green"},{name:"Forest",base:150,description:"Dark green"},{name:"Mint",base:160,description:"Light cool green"}],Yellows:[{name:"Honey",base:43,description:"Warm yellow"},{name:"Gold",base:45,description:"Yellow-orange"},{name:"Banana",base:52,description:"Warm light yellow"},{name:"Butter",base:55,description:"Soft yellow"},{name:"Lemon",base:58,description:"Light yellow"},{name:"Yellow",base:60,description:"True yellow"}],Oranges:[{name:"Rust",base:20,description:"Dark orange-brown"},{name:"Tangerine",base:25,description:"Bright orange"},{name:"Orange",base:30,description:"True orange"},{name:"Marigold",base:35,description:"Deep yellow-orange"}],Browns:[{name:"Sienna",base:20,description:"Reddish brown"},{name:"Cedar",base:22,description:"Red-tinted brown"},{name:"Brown",base:25,description:"True brown"},{name:"Sepia",base:30,description:"Warm dark brown"},{name:"Tan",base:34,description:"Light brown"},{name:"Khaki",base:37,description:"Yellow-brown"}],Grays:[{name:"Charcoal",base:200,description:"Dark gray",lowSaturation:!0},{name:"Silver",base:210,description:"Light metallic gray",lowSaturation:!0},{name:"Slate",base:215,description:"Blue-gray",lowSaturation:!0},{name:"Gray",base:220,description:"True gray",lowSaturation:!0},{name:"Steel",base:225,description:"Cool gray",lowSaturation:!0}]},Y={default:{primary:{saturation:65,lightness:50},secondary:{saturation:65,lightness:50},accent:{saturation:65,lightness:50},neutral:{saturation:10,lightness:50}},pastel:{primary:{saturation:55,lightness:68},secondary:{saturation:55,lightness:68},accent:{saturation:55,lightness:68},neutral:{saturation:5,lightness:68}},soft:{primary:{saturation:45,lightness:60},secondary:{saturation:45,lightness:60},accent:{saturation:45,lightness:60},neutral:{saturation:8,lightness:60}},bold:{primary:{saturation:70,lightness:45},secondary:{saturation:70,lightness:45},accent:{saturation:70,lightness:45},neutral:{saturation:12,lightness:45}},deep:{primary:{saturation:60,lightness:40},secondary:{saturation:60,lightness:40},accent:{saturation:60,lightness:40},neutral:{saturation:10,lightness:40}},vibrant:{primary:{saturation:75,lightness:55},secondary:{saturation:75,lightness:55},accent:{saturation:75,lightness:55},neutral:{saturation:15,lightness:55}},muted:{primary:{saturation:37,lightness:48},secondary:{saturation:37,lightness:48},accent:{saturation:37,lightness:48},neutral:{saturation:8,lightness:48}}},j={surface:{background:{base:"50",hover:"100",active:"200",disabled:"50"},content:{useContrast:!0,useTonal:!1},description:"Light backgrounds for large surfaces and containers",usage:["Page backgrounds","Cards","Containers","Panels","Sidebars"]},filled:{background:{base:"600",hover:"700",active:"800",disabled:"400"},content:{useContrast:!0,useTonal:!1},description:"Solid colored backgrounds with contrasting content",usage:["Primary buttons","Call-to-action elements","Selected states","Important UI elements","Navigation items"]},soft:{background:{base:"100",hover:"200",active:"300",disabled:"50"},content:{useContrast:!1,useTonal:!0},description:"Subtle, gentle color application for secondary elements",usage:["Secondary buttons","Background highlights","Selected items","Tags","Chips"]},ghost:{background:{base:"transparent",hover:"50",active:"100",disabled:"transparent"},content:{useContrast:!1,useTonal:!0},description:"Transparent background with colored content",usage:["Text buttons","Links","Menu items","Low-emphasis actions","Inline elements"]},outlined:{background:{base:"transparent",hover:"50",active:"100",disabled:"transparent"},content:{useContrast:!1,useTonal:!0},description:"Bordered elements with optional light background on interaction",usage:["Secondary buttons","Selectable cards","Input fields","Dropdown triggers","Menu items"]},faded:{background:{base:"50",hover:"100",active:"100",disabled:"50"},content:{useContrast:!1,useTonal:!0},description:"Very light, subtle color application",usage:["Background accents","Disabled states","Inactive elements","Secondary information","Subtle indicators"]},glazed:{background:{base:"100",hover:"200",active:"300",disabled:"50"},content:{useContrast:!0,useTonal:!1},description:"Semi-transparent color application with blur effect",usage:["Modal backgrounds","Overlay panels","Floating elements","Tooltips","Context menus"]},solid:{background:{base:"500",hover:"600",active:"700",disabled:"300"},content:{useContrast:!0,useTonal:!1},description:"Full solid color application with medium emphasis",usage:["Headers","Navigation bars","Important sections","Progress indicators","Status indicators"]}},z=(e,n)=>{let t=j[e];return{base:{background:`bg-${n}-${t.background.base}`,content:t.content.useTonal?`text-${n}-${t.background.base}-tonal`:`text-${n}-${t.background.base}-base`},hover:{background:`hover:bg-${n}-${t.background.hover}`,content:t.content.useTonal?`hover:text-${n}-${t.background.hover}-tonal`:`hover:text-${n}-${t.background.hover}-base`},active:{background:`active:bg-${n}-${t.background.active}`,content:t.content.useTonal?`active:text-${n}-${t.background.active}-tonal`:`active:text-${n}-${t.background.active}-base`},disabled:{background:`bg-${n}-${t.background.disabled}`,content:t.content.useTonal?`text-${n}-${t.background.disabled}-tonal`:`text-${n}-${t.background.disabled}-base`}}};export{U as chroma,Y as colorAdjustmentBaseValues,A as colorAdjustments,O as colorAdjustmentsLuminous,P as colorAdjustmentsSubdued,G as colorFamilies,E as generateColorsVars,q as generateReadableTextColor,M as generateShades,L as generateTextColors,z as generateVariantClasses,I as getColorsSuggestions,C as getHarmoniousHues,S as isStandardColor,W as propToStyle,V as shades};

package/dist/shared/utils/invariant.d.ts

@@ -0,0 +1,8 @@
+declare function invariant(condition: any, 
+/**
+ * Can provide a string, or a function that returns a string for cases where
+ * the message takes a fair amount of effort to compute
+ */
+message?: string | (() => string)): asserts condition;
+
+export { invariant as default };

package/dist/shared/utils/invariant.js

@@ -0,0 +1,2 @@
+/*! Enpage - Copyright (C) 2024 Flippable - https://github.com/enpage/enpage/blob/main/LICENSE */
+var i="Invariant failed";function e(r,n){if(r)return;let t=typeof n=="function"?n():n,o=t?`${i}: ${t}`:i;throw new Error(o)}export{e as default};

package/dist/shared/utils/layout-utils.d.ts

@@ -0,0 +1,24 @@
+import { Brick, BrickConstraints } from '../bricks.js';
+import { ResponsiveMode } from '../responsive.js';
+import '@sinclair/typebox';
+import 'zod';
+
+/**
+ * Adjust the bricks "mobile" position based on the "desktop" position by:
+ * - Setting each brick to 100% width
+ * - Guess the order based on the desktop position
+ * - Respecting the optional "manualHeight" that could be already set on the brick's mobile position
+ * - Add a blank row between each brick
+ */
+declare function adjustMobileLayout(layout: Brick[]): Brick[];
+declare function canDropOnLayout(bricks: Brick[], currentBp: ResponsiveMode, dropPosition: {
+    y: number;
+    x: number;
+}, constraints: BrickConstraints): {
+    y: number;
+    x: number;
+    w: number;
+    h: number;
+} | false;
+
+export { adjustMobileLayout, canDropOnLayout };

package/dist/shared/utils/layout-utils.js

@@ -0,0 +1,2 @@
+/*! Enpage - Copyright (C) 2024 Flippable - https://github.com/enpage/enpage/blob/main/LICENSE */
+var t={desktop:36,mobile:18};var y={mobile:{width:t.mobile/2,height:Math.round(t.mobile/4)},desktop:{width:t.desktop/3,height:t.desktop/3}};function L(h){let o=[...h].sort((n,r)=>{let e=n.position.desktop,s=r.position.desktop;return e.y===s.y?e.x-s.x:e.y-s.y}),i=0,p=1;return o.map(n=>{let r={...n},e=n.position.mobile;return r.position={...n.position,mobile:{...e,x:0,y:i,w:t.mobile,h:e.manualHeight||e.h}},i+=r.position.mobile.h+p,r})}function g(h,o,i,p){function n(a,c,l,u,b){return c<0||c+u>t[o]||l<0?!1:!a.some(d=>{let m=d.position[o],f=c<m.x+m.w&&c+u>m.x,k=l<m.y+m.h&&l+b>m.y;return f&&k})}let r=Math.max(p.minWidth[o],1),e=Math.min(p.preferredWidth[o]||r,t[o]),s=p.preferredHeight[o]||y[o].height;return n(h,i.x,i.y,e,s)?{x:i.x,y:i.y,w:e,h:s}:!1}export{L as adjustMobileLayout,g as canDropOnLayout};

package/env.d.ts

@@ -0,0 +1,24 @@
+import type { Locals } from "@hattip/compose";
+import type { CloudflareWorkersPlatformInfo } from "@hattip/adapter-cloudflare-workers";
+
+// augment window object with custom properties
+declare global {
+  interface Window {
+    enpage: import("./src/browser/js-api").EnpageJavascriptAPI;
+    __ENPAGE_STATE__: import("./src/browser/js-api").State;
+    __ENPAGE_ROUTING__: import("./src/browser/js-api").Routing;
+  }
+}
+
+declare module "@hattip/compose" {
+  interface Locals {
+    pageConfig: import("./src/shared/page").GenericPageConfig;
+    vite: import("vite").ViteDevServer;
+  }
+}
+
+declare module "@hattip/adapter-cloudflare-workers" {
+  interface CloudflareWorkersPlatformInfo {
+    env: import("./src/shared/env").EnpageEnv;
+  }
+}

package/package.json

@@ -0,0 +1,162 @@
+{
+  "name": "@upstart.gg/sdk",
+  "version": "0.0.51",
+  "type": "module",
+  "files": [
+    "dist",
+    "env.d.ts",
+    "custom-attrs.d.ts"
+  ],
+  "sideEffects": false,
+  "exports": {
+    ".": {
+      "import": "./dist/shared/index.js",
+      "types": "./dist/shared/index.d.ts"
+    },
+    "./shared/*": {
+      "types": "./dist/shared/*.d.ts",
+      "import": "./dist/shared/*.js"
+    },
+    "./builder/*": {
+      "import": "./dist/node/builder/*.js"
+    },
+    "./cli/*": {
+      "import": "./dist/node/cli/*.js"
+    },
+    "./env.d.ts": {
+      "types": "./env.d.ts",
+      "require": "./env.d.ts",
+      "import": "./env.d.ts"
+    },
+    "./custom-attrs.d.ts": "./custom-attrs.d.ts",
+    "./*": {
+      "types": "./dist/shared/*.d.ts",
+      "import": "./dist/shared/*.js"
+    }
+  },
+  "bin": {
+    "enpage": "dist/node/cli/program.js"
+  },
+  "dependencies": {
+    "@csstools/postcss-global-data": "3.0.0",
+    "@date-fns/utc": "1.2.0",
+    "@dnd-kit/core": "6.1.0",
+    "@dnd-kit/modifiers": "7.0.0",
+    "@dnd-kit/sortable": "8.0.0",
+    "@dnd-kit/utilities": "3.2.2",
+    "@fullhuman/postcss-purgecss": "6.0.0",
+    "@hattip/adapter-cloudflare-workers": "0.0.47",
+    "@hattip/adapter-node": "0.0.47",
+    "@hattip/compose": "0.0.47",
+    "@hattip/core": "0.0.47",
+    "@headlessui/react": "2.1.2",
+    "@inquirer/prompts": "5.3.8",
+    "@radix-ui/react-context-menu": "2.2.2",
+    "@radix-ui/react-toggle-group": "1.1.0",
+    "@radix-ui/themes": "3.1.4",
+    "@sinclair/typebox": "0.33.7",
+    "@tiptap/extension-code": "2.8.0",
+    "@tiptap/extension-text-align": "2.8.0",
+    "@tiptap/pm": "2.8.0",
+    "@tiptap/react": "2.8.0",
+    "@tiptap/starter-kit": "2.8.0",
+    "@vitejs/plugin-react": "^4.3.1",
+    "ajv": "8.17.1",
+    "ajv-formats": "3.0.1",
+    "autoprefixer": "10.4.20",
+    "aws4fetch": "1.0.20",
+    "axe-core": "4.10.0",
+    "chalk": "5.3.0",
+    "chroma-js": "3.1.2",
+    "clsx": "2.1.1",
+    "commander": "12.1.0",
+    "conf": "13.0.1",
+    "cssnano": "7.0.5",
+    "csstype": "3.1.3",
+    "date-fns": "3.6.0",
+    "debug": "4.3.6",
+    "dompurify": "3.1.6",
+    "express": "^4.20.0",
+    "fast-glob": "3.3.2",
+    "form-data": "4.0.0",
+    "get-port": "7.1.0",
+    "htmlparser2": "9.1.0",
+    "http-cache-semantics": "4.1.1",
+    "http-errors-enhanced": "2.0.8",
+    "immer": "10.1.1",
+    "import-meta-resolve": "4.1.0",
+    "jsdom": "25.0.0",
+    "lodash-es": "4.17.21",
+    "marked": "14.1.2",
+    "merge-refs": "1.3.0",
+    "nanoid": "5.0.7",
+    "open": "10.1.0",
+    "open-props": "1.7.6",
+    "ora": "8.1.0",
+    "p-queue": "8.0.1",
+    "polished": "4.3.1",
+    "postcss": "8.4.42",
+    "postcss-custom-media": "11.0.1",
+    "postcss-import": "16.1.0",
+    "postcss-jit-props": "1.0.14",
+    "postcss-nested": "6.2.0",
+    "postcss-preset-env": "10.0.2",
+    "react-hotkeys-hook": "4.5.1",
+    "react-icons": "5.3.0",
+    "react-selecto": "1.26.3",
+    "rimraf": "6.0.1",
+    "rollup-plugin-strip-banner": "3.1.0",
+    "serve-favicon": "2.5.0",
+    "sharp": "0.33.5",
+    "svgo": "3.3.2",
+    "tailwindcss": "3.4.10",
+    "unstorage": "1.10.2",
+    "usehooks-ts": "3.1.0",
+    "vite": "5.4.6",
+    "vite-plugin-dts": "4.2.1",
+    "vite-plugin-image-optimizer": "1.1.8",
+    "vite-plugin-inspect": "0.8.7",
+    "vite-plugin-virtual": "0.3.0",
+    "vite-tsconfig-paths": "5.0.1",
+    "zod": "3.23.8",
+    "zod-validation-error": "3.3.1",
+    "zundo": "2.1.0",
+    "zustand": "4.5.5"
+  },
+  "peerDependencies": {
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "@upstart.gg/style-system": "0.0.23"
+  },
+  "devDependencies": {
+    "@cloudflare/workers-types": "4.20240806.0",
+    "@types/chroma-js": "2.4.4",
+    "@types/cli-progress": "3.11.6",
+    "@types/debug": "4.1.12",
+    "@types/dompurify": "3.0.5",
+    "@types/express": "^4.17.21",
+    "@types/jsdom": "21.1.7",
+    "@types/lodash-es": "4.17.12",
+    "@types/node": "^20.14.10",
+    "@types/react": "18.3.3",
+    "@types/react-dom": "^18.3.0",
+    "@types/serve-favicon": "2.5.7",
+    "@types/sortablejs": "1.15.8",
+    "concurrently": "8.2.2",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "tsup": "8.2.4"
+  },
+  "author": "Matthias Etienne",
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "NODE_OPTIONS='--max-old-space-size=12384' tsup --clean",
+    "dev": "NODE_OPTIONS='--max-old-space-size=12384' tsup --watch",
+    "sizetest": "pnpm build && du -sh dist",
+    "lint": "biome check --write . && tsc --noEmit",
+    "ci:lint": "tsc --noEmit",
+    "test": "vitest"
+  }
+}