@lattice-ui/core 0.1.1 → 0.3.1

package/LICENSE

@@ -0,0 +1,7 @@
+Copyright 2026 astra-void
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/out/slot.luau

@@ -77,6 +77,27 @@ local function mergeHandlerTable(a, b)
 	end
 	return out
 end
+local function moveHandlersToReactKeyedProps(props, key)
+	local handlers = toHandlerTable(props[key])
+	if not handlers then
+		props[key] = nil
+		return nil
+	end
+	local reactRuntime = React
+	local source = if key == "Event" then reactRuntime.Event else reactRuntime.Change
+	local dynamicProps = props
+	for rawKey, candidate in pairs(handlers) do
+		if not (type(rawKey) == "string") or not isFn(candidate) then
+			continue
+		end
+		local reactKey = source[rawKey]
+		if reactKey == nil then
+			continue
+		end
+		dynamicProps[reactKey] = candidate
+	end
+	props[key] = nil
+end
 local Slot = React.forwardRef(function(props, forwardedRef)
 	local child = props.children
 	local childProps = toSlotPropBag(child.props)
@@ -103,6 +124,9 @@ local Slot = React.forwardRef(function(props, forwardedRef)
 	local childRef = toForwardedRef(childProps.ref)
 	local mergedRef = composeRefs(childRef, forwardedRef, slotRef)
 	mergedProps.ref = mergedRef
+	-- cloneElement bypasses @rbxts/react createElement Event/Change normalization.
+	moveHandlersToReactKeyedProps(mergedProps, "Event")
+	moveHandlersToReactKeyedProps(mergedProps, "Change")
 	return React.cloneElement(child, mergedProps)
 end)
 Slot.displayName = "Slot"

package/out/useControllableState.luau

@@ -12,16 +12,27 @@ local function useControllableState(_param)
 	local inner, setInner = React.useState(defaultValue)
 	local controlled = value ~= nil
 	local state = if value ~= nil then value else inner
+	local stateRef = React.useRef(state)
+	local controlledRef = React.useRef(controlled)
+	local onChangeRef = React.useRef(onChange)
+	stateRef.current = state
+	controlledRef.current = controlled
+	onChangeRef.current = onChange
 	local setState = React.useCallback(function(nextValue)
-		local computed = if isUpdater(nextValue) then nextValue(state) else nextValue
-		if not controlled then
+		local current = stateRef.current
+		local computed = if isUpdater(nextValue) then nextValue(current) else nextValue
+		if computed == current then
+			return nil
+		end
+		stateRef.current = computed
+		if not controlledRef.current then
 			setInner(computed)
 		end
-		local _result = onChange
+		local _result = onChangeRef.current
 		if _result ~= nil then
 			_result(computed)
 		end
-	end, { controlled, onChange, state })
+	end, {})
 	return { state, setState }
 end
 return {

package/package.json

@@ -1,9 +1,13 @@
 {
   "name": "@lattice-ui/core",
-  "version": "0.1.1",
+  "version": "0.3.1",
   "private": false,
   "main": "out/init.luau",
   "types": "out/index.d.ts",
+  "files": [
+    "out",
+    "README.md"
+  ],
   "devDependencies": {
     "@rbxts/react": "17.3.7-ts.1",
     "@rbxts/react-roblox": "17.3.7-ts.1"
@@ -13,10 +17,10 @@
     "@rbxts/react-roblox": "^17"
   },
   "scripts": {
-    "prebuild": "node ./scripts/ensure-hoisted-links.mjs",
     "build": "rbxtsc -p tsconfig.json",
+    "prebuild": "node ./scripts/ensure-hoisted-links.mjs",
     "prewatch": "node ./scripts/ensure-hoisted-links.mjs",
-    "watch": "rbxtsc -p tsconfig.json -w",
-    "typecheck": "tsc -p tsconfig.typecheck.json"
+    "typecheck": "tsc -p tsconfig.typecheck.json",
+    "watch": "rbxtsc -p tsconfig.json -w"
   }
 }

package/scripts/ensure-hoisted-links.mjs

@@ -1,35 +0,0 @@
-import fs from "node:fs";
-import path from "node:path";
-import { fileURLToPath } from "node:url";
-
-const scriptDir = path.dirname(fileURLToPath(import.meta.url));
-const packageDir = path.resolve(scriptDir, "..");
-const packageNodeModulesDir = path.join(packageDir, "node_modules");
-const rootNodeModulesDir = path.resolve(packageDir, "../../node_modules");
-const scopedDirs = ["@rbxts", "@rbxts-js"];
-const symlinkType = process.platform === "win32" ? "junction" : "dir";
-
-fs.mkdirSync(packageNodeModulesDir, { recursive: true });
-
-for (const scopedDir of scopedDirs) {
-  const targetPath = path.join(rootNodeModulesDir, scopedDir);
-  const linkPath = path.join(packageNodeModulesDir, scopedDir);
-
-  if (!fs.existsSync(targetPath)) {
-    continue;
-  }
-
-  let shouldRelink = true;
-  if (fs.existsSync(linkPath)) {
-    const current = fs.realpathSync(linkPath);
-    const expected = fs.realpathSync(targetPath);
-    shouldRelink = current !== expected;
-  }
-
-  if (!shouldRelink) {
-    continue;
-  }
-
-  fs.rmSync(linkPath, { recursive: true, force: true });
-  fs.symlinkSync(targetPath, linkPath, symlinkType);
-}

package/src/context.ts

@@ -1,15 +0,0 @@
-import React from "@rbxts/react";
-
-export function createStrictContext<T>(name: string) {
-  const Ctx = React.createContext<T | undefined>(undefined);
-
-  function useCtx(): T {
-    const v = React.useContext(Ctx);
-    if (v === undefined) {
-      error(`[${name}] context is undefined. Wrap components with <${name}.Provider>.`);
-    }
-    return v;
-  }
-
-  return [Ctx.Provider, useCtx] as const;
-}

package/src/index.ts

@@ -1,6 +0,0 @@
-export * from "./context";
-export { default as React } from "./react";
-export { default as ReactRoblox } from "./reactRoblox";
-export * from "./refs";
-export * from "./slot";
-export * from "./useControllableState";

package/src/react.ts

@@ -1,3 +0,0 @@
-import React = require("@rbxts/react");
-
-export default React;

package/src/reactRoblox.ts

@@ -1,3 +0,0 @@
-import ReactRoblox = require("@rbxts/react-roblox");
-
-export default ReactRoblox;

package/src/refs.ts

@@ -1,28 +0,0 @@
-import type React from "@rbxts/react";
-
-type AnyRef<T> = React.Ref<T> | React.ForwardedRef<T>;
-type RefCallback<T> = (value: T | undefined) => void;
-
-function isRefCallback<T>(ref: AnyRef<T> | undefined): ref is RefCallback<T> {
-  return typeIs(ref, "function");
-}
-
-function isMutableRefObject<T>(ref: AnyRef<T> | undefined): ref is React.MutableRefObject<T | undefined> {
-  return typeIs(ref, "table") && "current" in ref;
-}
-
-export function setRef<T>(ref: AnyRef<T> | undefined, value: T | undefined) {
-  if (isRefCallback(ref)) {
-    ref(value);
-    return;
-  }
-  if (isMutableRefObject(ref)) {
-    ref.current = value;
-  }
-}
-
-export function composeRefs<T>(...refs: Array<AnyRef<T> | undefined>) {
-  return (node: T | undefined) => {
-    for (const ref of refs) if (ref) setRef(ref, node);
-  };
-}

package/src/slot.tsx

@@ -1,116 +0,0 @@
-import React from "@rbxts/react";
-import { composeRefs } from "./refs";
-
-type Fn = (...args: unknown[]) => void;
-type HandlerTable = Partial<Record<string, Fn>>;
-type SlotRef = React.ForwardedRef<Instance>;
-type SlotPropBag = React.Attributes & Record<string, unknown>;
-type InstanceRefCallback = (instance: Instance | undefined) => void;
-
-function isRecord(value: unknown): value is Record<string, unknown> {
-  return typeIs(value, "table");
-}
-
-function toSlotPropBag(value: unknown): SlotPropBag {
-  return isRecord(value) ? (value as SlotPropBag) : {};
-}
-
-function isFn(value: unknown): value is Fn {
-  return typeIs(value, "function");
-}
-
-function toHandlerTable(value: unknown): HandlerTable | undefined {
-  if (!isRecord(value)) {
-    return undefined;
-  }
-
-  const out: HandlerTable = {};
-  for (const [rawKey, candidate] of pairs(value)) {
-    if (!typeIs(rawKey, "string")) {
-      continue;
-    }
-
-    if (isFn(candidate)) {
-      out[rawKey] = candidate;
-    }
-  }
-
-  return next(out)[0] !== undefined ? out : undefined;
-}
-
-function toForwardedRef(value: unknown): SlotRef | undefined {
-  if (value === undefined) {
-    return undefined;
-  }
-
-  if (isInstanceRefCallback(value)) {
-    return value;
-  }
-
-  if (isInstanceMutableRefObject(value)) {
-    return value;
-  }
-
-  return undefined;
-}
-
-function isInstanceRefCallback(value: unknown): value is InstanceRefCallback {
-  return typeIs(value, "function");
-}
-
-function isInstanceMutableRefObject(value: unknown): value is React.MutableRefObject<Instance | undefined> {
-  return typeIs(value, "table") && "current" in value;
-}
-
-function mergeHandlerTable(a?: HandlerTable, b?: HandlerTable) {
-  if (!a) return b;
-  if (!b) return a;
-  const out: HandlerTable = { ...a };
-  for (const [rawKey, candidate] of pairs(b)) {
-    if (!typeIs(rawKey, "string") || !isFn(candidate)) {
-      continue;
-    }
-
-    const af = a[rawKey];
-    const bf = candidate;
-    out[rawKey] =
-      af && bf
-        ? (...args) => {
-            bf(...args);
-            af(...args);
-          }
-        : (bf ?? af)!;
-  }
-  return out;
-}
-
-export type SlotProps = {
-  children: React.ReactElement<SlotPropBag>;
-  ref?: SlotRef;
-} & SlotPropBag;
-
-export const Slot = React.forwardRef<Instance, SlotProps>((props, forwardedRef) => {
-  const child = props.children;
-  const childProps = toSlotPropBag((child as { props?: unknown }).props);
-
-  const mergedProps: SlotPropBag = { ...props, ...childProps };
-  mergedProps.children = childProps.children;
-
-  const slotEvent = toHandlerTable(props.Event);
-  const childEvent = toHandlerTable(childProps.Event);
-  const slotChange = toHandlerTable(props.Change);
-  const childChange = toHandlerTable(childProps.Change);
-
-  const Event = mergeHandlerTable(slotEvent, childEvent);
-  const Change = mergeHandlerTable(slotChange, childChange);
-  if (Event) mergedProps.Event = Event;
-  if (Change) mergedProps.Change = Change;
-
-  const slotRef = toForwardedRef(props.ref);
-  const childRef = toForwardedRef(childProps.ref);
-  const mergedRef = composeRefs(childRef, forwardedRef, slotRef);
-  mergedProps.ref = mergedRef;
-
-  return React.cloneElement(child, mergedProps);
-});
-Slot.displayName = "Slot";

package/src/useControllableState.ts

@@ -1,28 +0,0 @@
-import React from "@rbxts/react";
-
-type Props<T> = {
-  value?: T;
-  defaultValue: T;
-  onChange?: (next: T) => void;
-};
-
-function isUpdater<T>(value: T | ((prev: T) => T)): value is (prev: T) => T {
-  return typeIs(value, "function");
-}
-
-export function useControllableState<T>({ value, defaultValue, onChange }: Props<T>) {
-  const [inner, setInner] = React.useState(defaultValue);
-  const controlled = value !== undefined;
-  const state = value !== undefined ? value : inner;
-
-  const setState = React.useCallback(
-    (nextValue: T | ((prev: T) => T)) => {
-      const computed = isUpdater(nextValue) ? nextValue(state) : nextValue;
-      if (!controlled) setInner(computed);
-      onChange?.(computed);
-    },
-    [controlled, onChange, state],
-  );
-
-  return [state, setState] as const;
-}

package/tsconfig.json

@@ -1,11 +0,0 @@
-{
-  "extends": "../../tsconfig.base.json",
-  "compilerOptions": {
-    "rootDir": "src",
-    "outDir": "out",
-    "declaration": true,
-    "typeRoots": ["./node_modules/@rbxts", "../../node_modules/@rbxts"],
-    "types": ["types", "compiler-types"]
-  },
-  "include": ["src"]
-}

package/tsconfig.typecheck.json

@@ -1,25 +0,0 @@
-{
-  "extends": "./tsconfig.json",
-  "compilerOptions": {
-    "noEmit": true,
-    "baseUrl": "..",
-    "rootDir": "..",
-    "paths": {
-      "@lattice-ui/checkbox": ["checkbox/src/index.ts"],
-      "@lattice-ui/core": ["core/src/index.ts"],
-      "@lattice-ui/dialog": ["dialog/src/index.ts"],
-      "@lattice-ui/focus": ["focus/src/index.ts"],
-      "@lattice-ui/layer": ["layer/src/index.ts"],
-      "@lattice-ui/menu": ["menu/src/index.ts"],
-      "@lattice-ui/popover": ["popover/src/index.ts"],
-      "@lattice-ui/popper": ["popper/src/index.ts"],
-      "@lattice-ui/radio-group": ["radio-group/src/index.ts"],
-      "@lattice-ui/style": ["style/src/index.ts"],
-      "@lattice-ui/switch": ["switch/src/index.ts"],
-      "@lattice-ui/system": ["system/src/index.ts"],
-      "@lattice-ui/tabs": ["tabs/src/index.ts"],
-      "@lattice-ui/toggle-group": ["toggle-group/src/index.ts"],
-      "@lattice-ui/tooltip": ["tooltip/src/index.ts"]
-    }
-  }
-}