@lattice-ui/toggle-group 0.3.1 → 0.4.0

package/out/ToggleGroup/ToggleGroupItem.luau

@@ -3,7 +3,6 @@ local TS = _G[script]
 local _core = TS.import(script, TS.getModule(script, "@lattice-ui", "core").out)
 local React = _core.React
 local Slot = _core.Slot
-local RovingFocusItem = TS.import(script, TS.getModule(script, "@lattice-ui", "focus").out).RovingFocusItem
 local useToggleGroupContext = TS.import(script, script.Parent, "context").useToggleGroupContext
 local function ToggleGroupItem(props)
 	local toggleGroupContext = useToggleGroupContext()
@@ -36,30 +35,24 @@ local function ToggleGroupItem(props)
 		if not child then
 			error("[ToggleGroupItem] `asChild` requires a child element.")
 		end
-		return React.createElement(RovingFocusItem, {
-			asChild = true,
-			disabled = disabled,
-		}, React.createElement(Slot, {
+		return React.createElement(Slot, {
 			Active = not disabled,
 			Event = eventHandlers,
-			Selectable = not disabled,
-		}, child))
+			Selectable = false,
+		}, child)
 	end
-	return React.createElement(RovingFocusItem, {
-		asChild = true,
-		disabled = disabled,
-	}, React.createElement("textbutton", {
+	return React.createElement("textbutton", {
 		Active = not disabled,
 		AutoButtonColor = false,
 		BackgroundColor3 = if pressed then Color3.fromRGB(88, 142, 255) else Color3.fromRGB(47, 53, 68),
 		BorderSizePixel = 0,
 		Event = eventHandlers,
-		Selectable = not disabled,
+		Selectable = false,
 		Size = UDim2.fromOffset(170, 34),
 		Text = props.value,
 		TextColor3 = if disabled then Color3.fromRGB(139, 146, 160) else Color3.fromRGB(236, 241, 249),
 		TextSize = 15,
-	}, props.children))
+	}, props.children)
 end
 return {
 	ToggleGroupItem = ToggleGroupItem,

package/out/ToggleGroup/ToggleGroupRoot.luau

@@ -4,7 +4,6 @@ local _core = TS.import(script, TS.getModule(script, "@lattice-ui", "core").out)
 local React = _core.React
 local Slot = _core.Slot
 local useControllableState = _core.useControllableState
-local RovingFocusGroup = TS.import(script, TS.getModule(script, "@lattice-ui", "focus").out).RovingFocusGroup
 local ToggleGroupContextProvider = TS.import(script, script.Parent, "context").ToggleGroupContextProvider
 local function normalizeMultiple(value)
 	local _value = value
@@ -27,12 +26,6 @@ local function normalizeMultiple(value)
 end
 local function ToggleGroupRoot(props)
 	local disabled = props.disabled == true
-	local _condition = props.loop
-	if _condition == nil then
-		_condition = true
-	end
-	local loop = _condition
-	local orientation = props.orientation or "horizontal"
 	local _binding = useControllableState({
 		value = if props.type == "single" then props.value else nil,
 		defaultValue = if props.type == "single" then props.defaultValue else nil,
@@ -110,12 +103,10 @@ local function ToggleGroupRoot(props)
 		return {
 			type = props.type,
 			disabled = disabled,
-			orientation = orientation,
-			loop = loop,
 			isPressed = isPressed,
 			toggleValue = toggleValue,
 		}
-	end, { disabled, isPressed, loop, orientation, props.type, toggleValue })
+	end, { disabled, isPressed, props.type, toggleValue })
 	local groupNode = if props.asChild then ((function()
 		local child = props.children
 		if not React.isValidElement(child) then
@@ -129,12 +120,7 @@ local function ToggleGroupRoot(props)
 	}, props.children))
 	return React.createElement(ToggleGroupContextProvider, {
 		value = contextValue,
-	}, React.createElement(RovingFocusGroup, {
-		active = not disabled,
-		autoFocus = "none",
-		loop = loop,
-		orientation = orientation,
-	}, groupNode))
+	}, groupNode)
 end
 return {
 	ToggleGroupRoot = ToggleGroupRoot,

package/out/ToggleGroup/types.d.ts

@@ -1,11 +1,8 @@
 import type React from "@rbxts/react";
 export type ToggleGroupType = "single" | "multiple";
 export type ToggleGroupValue = string | string[];
-export type ToggleGroupOrientation = "horizontal" | "vertical" | "both";
 export type ToggleGroupCommonProps = {
     disabled?: boolean;
-    loop?: boolean;
-    orientation?: ToggleGroupOrientation;
     asChild?: boolean;
     children?: React.ReactNode;
 };
@@ -25,8 +22,6 @@ export type ToggleGroupProps = ToggleGroupCommonProps & (ToggleGroupSingleProps
 export type ToggleGroupContextValue = {
     type: ToggleGroupType;
     disabled: boolean;
-    orientation: ToggleGroupOrientation;
-    loop: boolean;
     isPressed: (itemValue: string) => boolean;
     toggleValue: (itemValue: string) => void;
 };

package/out/index.d.ts

@@ -4,4 +4,4 @@ export declare const ToggleGroup: {
     readonly Root: typeof ToggleGroupRoot;
     readonly Item: typeof ToggleGroupItem;
 };
-export type { ToggleGroupCommonProps, ToggleGroupContextValue, ToggleGroupItemProps, ToggleGroupMultipleProps, ToggleGroupOrientation, ToggleGroupProps, ToggleGroupSingleProps, ToggleGroupType, ToggleGroupValue, } from "./ToggleGroup/types";
+export type { ToggleGroupCommonProps, ToggleGroupContextValue, ToggleGroupItemProps, ToggleGroupMultipleProps, ToggleGroupProps, ToggleGroupSingleProps, ToggleGroupType, ToggleGroupValue, } from "./ToggleGroup/types";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lattice-ui/toggle-group",
-  "version": "0.3.1",
+  "version": "0.4.0",
   "private": false,
   "main": "out/init.luau",
   "types": "out/index.d.ts",
@@ -9,8 +9,7 @@
     "README.md"
   ],
   "dependencies": {
-    "@lattice-ui/focus": "0.3.1",
-    "@lattice-ui/core": "0.3.1"
+    "@lattice-ui/core": "0.4.0"
   },
   "devDependencies": {
     "@rbxts/react": "17.3.7-ts.1",