@lattice-ui/toggle-group 0.3.2 → 0.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3,7 +3,6 @@ local TS = _G[script]
3
3
  local _core = TS.import(script, TS.getModule(script, "@lattice-ui", "core").out)
4
4
  local React = _core.React
5
5
  local Slot = _core.Slot
6
- local RovingFocusItem = TS.import(script, TS.getModule(script, "@lattice-ui", "focus").out).RovingFocusItem
7
6
  local useToggleGroupContext = TS.import(script, script.Parent, "context").useToggleGroupContext
8
7
  local function ToggleGroupItem(props)
9
8
  local toggleGroupContext = useToggleGroupContext()
@@ -36,30 +35,24 @@ local function ToggleGroupItem(props)
36
35
  if not child then
37
36
  error("[ToggleGroupItem] `asChild` requires a child element.")
38
37
  end
39
- return React.createElement(RovingFocusItem, {
40
- asChild = true,
41
- disabled = disabled,
42
- }, React.createElement(Slot, {
38
+ return React.createElement(Slot, {
43
39
  Active = not disabled,
44
40
  Event = eventHandlers,
45
- Selectable = not disabled,
46
- }, child))
41
+ Selectable = false,
42
+ }, child)
47
43
  end
48
- return React.createElement(RovingFocusItem, {
49
- asChild = true,
50
- disabled = disabled,
51
- }, React.createElement("textbutton", {
44
+ return React.createElement("textbutton", {
52
45
  Active = not disabled,
53
46
  AutoButtonColor = false,
54
47
  BackgroundColor3 = if pressed then Color3.fromRGB(88, 142, 255) else Color3.fromRGB(47, 53, 68),
55
48
  BorderSizePixel = 0,
56
49
  Event = eventHandlers,
57
- Selectable = not disabled,
50
+ Selectable = false,
58
51
  Size = UDim2.fromOffset(170, 34),
59
52
  Text = props.value,
60
53
  TextColor3 = if disabled then Color3.fromRGB(139, 146, 160) else Color3.fromRGB(236, 241, 249),
61
54
  TextSize = 15,
62
- }, props.children))
55
+ }, props.children)
63
56
  end
64
57
  return {
65
58
  ToggleGroupItem = ToggleGroupItem,
@@ -4,7 +4,6 @@ local _core = TS.import(script, TS.getModule(script, "@lattice-ui", "core").out)
4
4
  local React = _core.React
5
5
  local Slot = _core.Slot
6
6
  local useControllableState = _core.useControllableState
7
- local RovingFocusGroup = TS.import(script, TS.getModule(script, "@lattice-ui", "focus").out).RovingFocusGroup
8
7
  local ToggleGroupContextProvider = TS.import(script, script.Parent, "context").ToggleGroupContextProvider
9
8
  local function normalizeMultiple(value)
10
9
  local _value = value
@@ -27,12 +26,6 @@ local function normalizeMultiple(value)
27
26
  end
28
27
  local function ToggleGroupRoot(props)
29
28
  local disabled = props.disabled == true
30
- local _condition = props.loop
31
- if _condition == nil then
32
- _condition = true
33
- end
34
- local loop = _condition
35
- local orientation = props.orientation or "horizontal"
36
29
  local _binding = useControllableState({
37
30
  value = if props.type == "single" then props.value else nil,
38
31
  defaultValue = if props.type == "single" then props.defaultValue else nil,
@@ -110,12 +103,10 @@ local function ToggleGroupRoot(props)
110
103
  return {
111
104
  type = props.type,
112
105
  disabled = disabled,
113
- orientation = orientation,
114
- loop = loop,
115
106
  isPressed = isPressed,
116
107
  toggleValue = toggleValue,
117
108
  }
118
- end, { disabled, isPressed, loop, orientation, props.type, toggleValue })
109
+ end, { disabled, isPressed, props.type, toggleValue })
119
110
  local groupNode = if props.asChild then ((function()
120
111
  local child = props.children
121
112
  if not React.isValidElement(child) then
@@ -129,12 +120,7 @@ local function ToggleGroupRoot(props)
129
120
  }, props.children))
130
121
  return React.createElement(ToggleGroupContextProvider, {
131
122
  value = contextValue,
132
- }, React.createElement(RovingFocusGroup, {
133
- active = not disabled,
134
- autoFocus = "none",
135
- loop = loop,
136
- orientation = orientation,
137
- }, groupNode))
123
+ }, groupNode)
138
124
  end
139
125
  return {
140
126
  ToggleGroupRoot = ToggleGroupRoot,
@@ -1,11 +1,8 @@
1
1
  import type React from "@rbxts/react";
2
2
  export type ToggleGroupType = "single" | "multiple";
3
3
  export type ToggleGroupValue = string | string[];
4
- export type ToggleGroupOrientation = "horizontal" | "vertical" | "both";
5
4
  export type ToggleGroupCommonProps = {
6
5
  disabled?: boolean;
7
- loop?: boolean;
8
- orientation?: ToggleGroupOrientation;
9
6
  asChild?: boolean;
10
7
  children?: React.ReactNode;
11
8
  };
@@ -25,8 +22,6 @@ export type ToggleGroupProps = ToggleGroupCommonProps & (ToggleGroupSingleProps
25
22
  export type ToggleGroupContextValue = {
26
23
  type: ToggleGroupType;
27
24
  disabled: boolean;
28
- orientation: ToggleGroupOrientation;
29
- loop: boolean;
30
25
  isPressed: (itemValue: string) => boolean;
31
26
  toggleValue: (itemValue: string) => void;
32
27
  };
package/out/index.d.ts CHANGED
@@ -4,4 +4,4 @@ export declare const ToggleGroup: {
4
4
  readonly Root: typeof ToggleGroupRoot;
5
5
  readonly Item: typeof ToggleGroupItem;
6
6
  };
7
- export type { ToggleGroupCommonProps, ToggleGroupContextValue, ToggleGroupItemProps, ToggleGroupMultipleProps, ToggleGroupOrientation, ToggleGroupProps, ToggleGroupSingleProps, ToggleGroupType, ToggleGroupValue, } from "./ToggleGroup/types";
7
+ export type { ToggleGroupCommonProps, ToggleGroupContextValue, ToggleGroupItemProps, ToggleGroupMultipleProps, ToggleGroupProps, ToggleGroupSingleProps, ToggleGroupType, ToggleGroupValue, } from "./ToggleGroup/types";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lattice-ui/toggle-group",
3
- "version": "0.3.2",
3
+ "version": "0.4.1",
4
4
  "private": false,
5
5
  "main": "out/init.luau",
6
6
  "types": "out/index.d.ts",
@@ -9,8 +9,7 @@
9
9
  "README.md"
10
10
  ],
11
11
  "dependencies": {
12
- "@lattice-ui/focus": "0.3.2",
13
- "@lattice-ui/core": "0.3.2"
12
+ "@lattice-ui/core": "0.4.1"
14
13
  },
15
14
  "devDependencies": {
16
15
  "@rbxts/react": "17.3.7-ts.1",