@drjoshcsimmons/scl 0.1.0 → 0.1.2

package/dist/tokens/colors.d.ts

@@ -1,92 +1,32 @@
 /**
- * Color tokens extracted from the Autism Simulator terminal aesthetic.
- * Features a retro CRT terminal look with green-on-black colors.
+ * Color tokens for the SCL component library.
+ * Minimal, monochrome design with swappable primary/secondary colors.
  */
+export declare const palette: {
+    readonly green: "120 100% 50%";
+    readonly hotpink: "300 100% 50%";
+    readonly yellow: "60 100% 50%";
+    readonly blue: "240 100% 50%";
+    readonly cyan: "180 100% 50%";
+    readonly white: "0 0% 100%";
+    readonly amber: "45 100% 50%";
+    readonly red: "0 100% 50%";
+    readonly black: "0 0% 0%";
+};
 export declare const colors: {
-    readonly light: {
-        readonly background: "0 0% 0%";
-        readonly foreground: "120 100% 50%";
-        readonly card: "0 0% 5%";
-        readonly cardForeground: "120 100% 50%";
-        readonly popover: "0 0% 5%";
-        readonly popoverForeground: "120 100% 50%";
-        readonly primary: "60 100% 50%";
-        readonly primaryForeground: "0 0% 0%";
-        readonly secondary: "120 100% 25%";
-        readonly secondaryForeground: "120 100% 50%";
-        readonly muted: "0 0% 10%";
-        readonly mutedForeground: "120 100% 35%";
-        readonly accent: "60 100% 50%";
-        readonly accentForeground: "0 0% 0%";
-        readonly destructive: "0 100% 50%";
-        readonly destructiveForeground: "0 0% 0%";
-        readonly border: "120 100% 25%";
-        readonly input: "0 0% 10%";
-        readonly ring: "120 100% 50%";
-        readonly chart1: "120 100% 50%";
-        readonly chart2: "60 100% 50%";
-        readonly chart3: "300 100% 50%";
-        readonly chart4: "240 100% 50%";
-        readonly chart5: "30 100% 50%";
-    };
-    readonly dark: {
-        readonly background: "0 0% 0%";
-        readonly foreground: "120 100% 50%";
-        readonly card: "0 0% 5%";
-        readonly cardForeground: "120 100% 50%";
-        readonly popover: "0 0% 5%";
-        readonly popoverForeground: "120 100% 50%";
-        readonly primary: "60 100% 50%";
-        readonly primaryForeground: "0 0% 0%";
-        readonly secondary: "120 100% 25%";
-        readonly secondaryForeground: "120 100% 50%";
-        readonly muted: "0 0% 10%";
-        readonly mutedForeground: "120 100% 35%";
-        readonly accent: "60 100% 50%";
-        readonly accentForeground: "0 0% 0%";
-        readonly destructive: "0 100% 50%";
-        readonly destructiveForeground: "0 0% 0%";
-        readonly border: "120 100% 25%";
-        readonly input: "0 0% 10%";
-        readonly ring: "120 100% 50%";
-        readonly chart1: "120 100% 50%";
-        readonly chart2: "60 100% 50%";
-        readonly chart3: "300 100% 50%";
-        readonly chart4: "240 100% 50%";
-        readonly chart5: "30 100% 50%";
-    };
-    readonly terminal: {
-        readonly green: "rgb(0 255 0)";
-        readonly blue: "rgb(0 0 255)";
-        readonly yellow: "rgb(255 255 0)";
-        readonly magenta: "rgb(255 0 255)";
-        readonly red: "rgb(255 0 0)";
-        readonly orange: "rgb(255 167 0)";
-        readonly deepblue: "rgb(0 0 152)";
-        readonly black: "rgb(0 0 0)";
-    };
-    readonly sidebar: {
-        readonly light: {
-            readonly background: "0 0% 0%";
-            readonly foreground: "120 100% 50%";
-            readonly primary: "60 100% 50%";
-            readonly primaryForeground: "0 0% 0%";
-            readonly accent: "120 100% 15%";
-            readonly accentForeground: "120 100% 50%";
-            readonly border: "120 100% 25%";
-            readonly ring: "120 100% 50%";
-        };
-        readonly dark: {
-            readonly background: "0 0% 0%";
-            readonly foreground: "120 100% 50%";
-            readonly primary: "60 100% 50%";
-            readonly primaryForeground: "0 0% 0%";
-            readonly accent: "120 100% 15%";
-            readonly accentForeground: "120 100% 50%";
-            readonly border: "120 100% 25%";
-            readonly ring: "120 100% 50%";
-        };
-    };
+    readonly primary: "120 100% 50%";
+    readonly primaryForeground: "0 0% 0%";
+    readonly secondary: "300 100% 50%";
+    readonly secondaryForeground: "0 0% 0%";
+    readonly background: "0 0% 0%";
+    readonly foreground: "120 100% 50%";
+    readonly border: "120 100% 50%";
+    readonly ring: "120 100% 50%";
+    readonly destructive: "0 100% 50%";
+    readonly destructiveForeground: "0 0% 0%";
+    readonly muted: "0 0% 8%";
+    readonly mutedForeground: "120 100% 50%";
 };
+export type Palette = typeof palette;
 export type ColorTokens = typeof colors;
 //# sourceMappingURL=colors.d.ts.map

package/dist/tokens/colors.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"colors.d.ts","sourceRoot":"","sources":["../../src/tokens/colors.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwFT,CAAA;AAEV,MAAM,MAAM,WAAW,GAAG,OAAO,MAAM,CAAA"}
+{"version":3,"file":"colors.d.ts","sourceRoot":"","sources":["../../src/tokens/colors.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,eAAO,MAAM,OAAO;;;;;;;;;;CAUV,CAAA;AAEV,eAAO,MAAM,MAAM;;;;;;;;;;;;;CAoBT,CAAA;AAEV,MAAM,MAAM,OAAO,GAAG,OAAO,OAAO,CAAA;AACpC,MAAM,MAAM,WAAW,GAAG,OAAO,MAAM,CAAA"}

package/dist/tokens/index.d.ts

@@ -13,90 +13,18 @@ export * from './shadows';
  */
 export declare const theme: {
     readonly colors: {
-        readonly light: {
-            readonly background: "0 0% 0%";
-            readonly foreground: "120 100% 50%";
-            readonly card: "0 0% 5%";
-            readonly cardForeground: "120 100% 50%";
-            readonly popover: "0 0% 5%";
-            readonly popoverForeground: "120 100% 50%";
-            readonly primary: "60 100% 50%";
-            readonly primaryForeground: "0 0% 0%";
-            readonly secondary: "120 100% 25%";
-            readonly secondaryForeground: "120 100% 50%";
-            readonly muted: "0 0% 10%";
-            readonly mutedForeground: "120 100% 35%";
-            readonly accent: "60 100% 50%";
-            readonly accentForeground: "0 0% 0%";
-            readonly destructive: "0 100% 50%";
-            readonly destructiveForeground: "0 0% 0%";
-            readonly border: "120 100% 25%";
-            readonly input: "0 0% 10%";
-            readonly ring: "120 100% 50%";
-            readonly chart1: "120 100% 50%";
-            readonly chart2: "60 100% 50%";
-            readonly chart3: "300 100% 50%";
-            readonly chart4: "240 100% 50%";
-            readonly chart5: "30 100% 50%";
-        };
-        readonly dark: {
-            readonly background: "0 0% 0%";
-            readonly foreground: "120 100% 50%";
-            readonly card: "0 0% 5%";
-            readonly cardForeground: "120 100% 50%";
-            readonly popover: "0 0% 5%";
-            readonly popoverForeground: "120 100% 50%";
-            readonly primary: "60 100% 50%";
-            readonly primaryForeground: "0 0% 0%";
-            readonly secondary: "120 100% 25%";
-            readonly secondaryForeground: "120 100% 50%";
-            readonly muted: "0 0% 10%";
-            readonly mutedForeground: "120 100% 35%";
-            readonly accent: "60 100% 50%";
-            readonly accentForeground: "0 0% 0%";
-            readonly destructive: "0 100% 50%";
-            readonly destructiveForeground: "0 0% 0%";
-            readonly border: "120 100% 25%";
-            readonly input: "0 0% 10%";
-            readonly ring: "120 100% 50%";
-            readonly chart1: "120 100% 50%";
-            readonly chart2: "60 100% 50%";
-            readonly chart3: "300 100% 50%";
-            readonly chart4: "240 100% 50%";
-            readonly chart5: "30 100% 50%";
-        };
-        readonly terminal: {
-            readonly green: "rgb(0 255 0)";
-            readonly blue: "rgb(0 0 255)";
-            readonly yellow: "rgb(255 255 0)";
-            readonly magenta: "rgb(255 0 255)";
-            readonly red: "rgb(255 0 0)";
-            readonly orange: "rgb(255 167 0)";
-            readonly deepblue: "rgb(0 0 152)";
-            readonly black: "rgb(0 0 0)";
-        };
-        readonly sidebar: {
-            readonly light: {
-                readonly background: "0 0% 0%";
-                readonly foreground: "120 100% 50%";
-                readonly primary: "60 100% 50%";
-                readonly primaryForeground: "0 0% 0%";
-                readonly accent: "120 100% 15%";
-                readonly accentForeground: "120 100% 50%";
-                readonly border: "120 100% 25%";
-                readonly ring: "120 100% 50%";
-            };
-            readonly dark: {
-                readonly background: "0 0% 0%";
-                readonly foreground: "120 100% 50%";
-                readonly primary: "60 100% 50%";
-                readonly primaryForeground: "0 0% 0%";
-                readonly accent: "120 100% 15%";
-                readonly accentForeground: "120 100% 50%";
-                readonly border: "120 100% 25%";
-                readonly ring: "120 100% 50%";
-            };
-        };
+        readonly primary: "120 100% 50%";
+        readonly primaryForeground: "0 0% 0%";
+        readonly secondary: "300 100% 50%";
+        readonly secondaryForeground: "0 0% 0%";
+        readonly background: "0 0% 0%";
+        readonly foreground: "120 100% 50%";
+        readonly border: "120 100% 50%";
+        readonly ring: "120 100% 50%";
+        readonly destructive: "0 100% 50%";
+        readonly destructiveForeground: "0 0% 0%";
+        readonly muted: "0 0% 8%";
+        readonly mutedForeground: "120 100% 50%";
     };
     readonly typography: {
         readonly fontFamily: {

package/dist/tokens/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/tokens/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,cAAc,UAAU,CAAA;AACxB,cAAc,cAAc,CAAA;AAC5B,cAAc,WAAW,CAAA;AACzB,cAAc,cAAc,CAAA;AAC5B,cAAc,WAAW,CAAA;AAQzB;;;GAGG;AACH,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAOR,CAAA;AAEV,MAAM,MAAM,KAAK,GAAG,OAAO,KAAK,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/tokens/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,cAAc,UAAU,CAAA;AACxB,cAAc,cAAc,CAAA;AAC5B,cAAc,WAAW,CAAA;AACzB,cAAc,cAAc,CAAA;AAC5B,cAAc,WAAW,CAAA;AAQzB;;;GAGG;AACH,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAOR,CAAA;AAEV,MAAM,MAAM,KAAK,GAAG,OAAO,KAAK,CAAA"}

package/package.json

@@ -1,7 +1,11 @@
 {
   "name": "@drjoshcsimmons/scl",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "type": "module",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/jcpsimmons/scl"
+  },
   "main": "./dist/index.js",
   "module": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -18,16 +22,6 @@
   "sideEffects": [
     "**/*.css"
   ],
-  "scripts": {
-    "dev": "storybook dev -p 6006",
-    "build": "tsc && vite build",
-    "build:storybook": "storybook build -o storybook-static",
-    "test": "vitest",
-    "test:coverage": "vitest --coverage",
-    "lint": "eslint src --ext .ts,.tsx",
-    "typecheck": "tsc --noEmit",
-    "prepublishOnly": "npm run build"
-  },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0",
     "react-dom": "^18.0.0 || ^19.0.0"
@@ -61,15 +55,15 @@
     "@radix-ui/react-toggle": "^1.1.0",
     "@radix-ui/react-toggle-group": "^1.1.0",
     "@radix-ui/react-tooltip": "^1.1.0",
-    "@storybook/addon-a11y": "^8.4.0",
-    "@storybook/addon-essentials": "^8.4.0",
-    "@storybook/addon-interactions": "^8.4.0",
-    "@storybook/addon-links": "^8.4.0",
-    "@storybook/addon-themes": "^8.4.0",
-    "@storybook/blocks": "^8.4.0",
-    "@storybook/react": "^8.4.0",
-    "@storybook/react-vite": "^8.4.0",
-    "@storybook/test": "^8.4.0",
+    "@storybook/addon-a11y": "8.6.15",
+    "@storybook/addon-essentials": "8.6.15",
+    "@storybook/addon-interactions": "8.6.15",
+    "@storybook/addon-links": "8.6.15",
+    "@storybook/addon-themes": "8.6.15",
+    "@storybook/blocks": "8.6.15",
+    "@storybook/react": "8.6.15",
+    "@storybook/react-vite": "8.6.15",
+    "@storybook/test": "8.6.15",
     "@testing-library/jest-dom": "^6.6.0",
     "@testing-library/react": "^16.0.0",
     "@testing-library/user-event": "^14.5.0",
@@ -100,7 +94,7 @@
     "react-resizable-panels": "^2.1.0",
     "recharts": "^2.13.0",
     "sonner": "^1.7.0",
-    "storybook": "^8.4.0",
+    "storybook": "8.6.15",
     "tailwind-merge": "^2.5.0",
     "tailwindcss": "^3.4.0",
     "tailwindcss-animate": "^1.0.0",
@@ -123,6 +117,17 @@
     "@codemirror/language": "^6.11.3",
     "@codemirror/state": "^6.5.2",
     "@codemirror/view": "^6.39.4",
-    "@replit/codemirror-vim": "^6.3.0"
+    "@lezer/highlight": "^1.2.3",
+    "@replit/codemirror-vim": "^6.3.0",
+    "@vercel/analytics": "^1.6.1"
+  },
+  "scripts": {
+    "dev": "storybook dev -p 6006",
+    "build": "tsc && vite build",
+    "build:storybook": "storybook build -o storybook-static",
+    "test": "vitest",
+    "test:coverage": "vitest --coverage",
+    "lint": "eslint src --ext .ts,.tsx",
+    "typecheck": "tsc --noEmit"
   }
-}
+}

package/dist/index141.js

@@ -1,5 +0,0 @@
-import { createSidecarMedium as e } from "./index148.js";
-var a = e();
-export {
-  a as effectCar
-};

package/dist/index142.js

@@ -1,26 +0,0 @@
-import * as f from "react";
-import { assignRef as o } from "./index153.js";
-import { useCallbackRef as l } from "./index154.js";
-var s = typeof window < "u" ? f.useLayoutEffect : f.useEffect, c = /* @__PURE__ */ new WeakMap();
-function v(e, m) {
-  var t = l(null, function(n) {
-    return e.forEach(function(u) {
-      return o(u, n);
-    });
-  });
-  return s(function() {
-    var n = c.get(t);
-    if (n) {
-      var u = new Set(n), r = new Set(e), i = t.current;
-      u.forEach(function(a) {
-        r.has(a) || o(a, null);
-      }), r.forEach(function(a) {
-        u.has(a) || o(a, i);
-      });
-    }
-    c.set(t, e);
-  }, [e]), t;
-}
-export {
-  v as useMergeRefs
-};

package/dist/index143.js

@@ -1,115 +0,0 @@
-import { __spreadArray as N } from "./index135.js";
-import * as n from "react";
-import { RemoveScrollBar as W } from "./index149.js";
-import { styleSingleton as F } from "./index150.js";
-import { nonPassive as s } from "./index151.js";
-import { locationCouldBeScrolled as B, handleScroll as K } from "./index152.js";
-var k = function(e) {
-  return "changedTouches" in e ? [e.changedTouches[0].clientX, e.changedTouches[0].clientY] : [0, 0];
-}, M = function(e) {
-  return [e.deltaX, e.deltaY];
-}, X = function(e) {
-  return e && "current" in e ? e.current : e;
-}, O = function(e, c) {
-  return e[0] === c[0] && e[1] === c[1];
-}, Q = function(e) {
-  return `
-  .block-interactivity-`.concat(e, ` {pointer-events: none;}
-  .allow-interactivity-`).concat(e, ` {pointer-events: all;}
-`);
-}, Z = 0, f = [];
-function J(e) {
-  var c = n.useRef([]), R = n.useRef([0, 0]), m = n.useRef(), h = n.useState(Z++)[0], g = n.useState(F)[0], S = n.useRef(e);
-  n.useEffect(function() {
-    S.current = e;
-  }, [e]), n.useEffect(function() {
-    if (e.inert) {
-      document.body.classList.add("block-interactivity-".concat(h));
-      var t = N([e.lockRef.current], (e.shards || []).map(X), !0).filter(Boolean);
-      return t.forEach(function(r) {
-        return r.classList.add("allow-interactivity-".concat(h));
-      }), function() {
-        document.body.classList.remove("block-interactivity-".concat(h)), t.forEach(function(r) {
-          return r.classList.remove("allow-interactivity-".concat(h));
-        });
-      };
-    }
-  }, [e.inert, e.lockRef.current, e.shards]);
-  var C = n.useCallback(function(t, r) {
-    if ("touches" in t && t.touches.length === 2 || t.type === "wheel" && t.ctrlKey)
-      return !S.current.allowPinchZoom;
-    var l = k(t), u = R.current, o = "deltaX" in t ? t.deltaX : u[0] - l[0], i = "deltaY" in t ? t.deltaY : u[1] - l[1], a, v = t.target, d = Math.abs(o) > Math.abs(i) ? "h" : "v";
-    if ("touches" in t && d === "h" && v.type === "range")
-      return !1;
-    var P = window.getSelection(), E = P && P.anchorNode, I = E ? E === v || E.contains(v) : !1;
-    if (I)
-      return !1;
-    var b = B(d, v);
-    if (!b)
-      return !0;
-    if (b ? a = d : (a = d === "v" ? "h" : "v", b = B(d, v)), !b)
-      return !1;
-    if (!m.current && "changedTouches" in t && (o || i) && (m.current = a), !a)
-      return !0;
-    var Y = m.current || a;
-    return K(Y, r, t, Y === "h" ? o : i);
-  }, []), y = n.useCallback(function(t) {
-    var r = t;
-    if (!(!f.length || f[f.length - 1] !== g)) {
-      var l = "deltaY" in r ? M(r) : k(r), u = c.current.filter(function(a) {
-        return a.name === r.type && (a.target === r.target || r.target === a.shadowParent) && O(a.delta, l);
-      })[0];
-      if (u && u.should) {
-        r.cancelable && r.preventDefault();
-        return;
-      }
-      if (!u) {
-        var o = (S.current.shards || []).map(X).filter(Boolean).filter(function(a) {
-          return a.contains(r.target);
-        }), i = o.length > 0 ? C(r, o[0]) : !S.current.noIsolation;
-        i && r.cancelable && r.preventDefault();
-      }
-    }
-  }, []), w = n.useCallback(function(t, r, l, u) {
-    var o = { name: t, delta: r, target: l, should: u, shadowParent: _(l) };
-    c.current.push(o), setTimeout(function() {
-      c.current = c.current.filter(function(i) {
-        return i !== o;
-      });
-    }, 1);
-  }, []), L = n.useCallback(function(t) {
-    R.current = k(t), m.current = void 0;
-  }, []), T = n.useCallback(function(t) {
-    w(t.type, M(t), t.target, C(t, e.lockRef.current));
-  }, []), D = n.useCallback(function(t) {
-    w(t.type, k(t), t.target, C(t, e.lockRef.current));
-  }, []);
-  n.useEffect(function() {
-    return f.push(g), e.setCallbacks({
-      onScrollCapture: T,
-      onWheelCapture: T,
-      onTouchMoveCapture: D
-    }), document.addEventListener("wheel", y, s), document.addEventListener("touchmove", y, s), document.addEventListener("touchstart", L, s), function() {
-      f = f.filter(function(t) {
-        return t !== g;
-      }), document.removeEventListener("wheel", y, s), document.removeEventListener("touchmove", y, s), document.removeEventListener("touchstart", L, s);
-    };
-  }, []);
-  var x = e.removeScrollBar, A = e.inert;
-  return n.createElement(
-    n.Fragment,
-    null,
-    A ? n.createElement(g, { styles: Q(h) }) : null,
-    x ? n.createElement(W, { noRelative: e.noRelative, gapMode: e.gapMode }) : null
-  );
-}
-function _(e) {
-  for (var c = null; e !== null; )
-    e instanceof ShadowRoot && (c = e.host, e = e.host), e = e.parentNode;
-  return c;
-}
-export {
-  J as RemoveScrollSideCar,
-  M as getDeltaXY,
-  k as getTouchXY
-};

package/dist/index144.js

@@ -1,18 +0,0 @@
-import { __rest as o, __assign as d } from "./index135.js";
-import * as n from "react";
-var i = function(r) {
-  var e = r.sideCar, a = o(r, ["sideCar"]);
-  if (!e)
-    throw new Error("Sidecar: please provide `sideCar` property to import the right car");
-  var t = e.read();
-  if (!t)
-    throw new Error("Sidecar medium not found");
-  return n.createElement(t, d({}, a));
-};
-i.isSideCarExport = !0;
-function p(r, e) {
-  return r.useMedium(e), i;
-}
-export {
-  p as exportSidecar
-};