@rbxts/uiblox 0.2.0-alpha.23 → 0.2.0-alpha.24

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.
Files changed (5) hide show
  1. package/out/ui/packages/divider/components/Divider.styles.luau +5 -2
  2. package/out/ui/packages/drawer/components/Drawer.d.ts +1 -1
  3. package/out/ui/packages/drawer/components/Drawer.luau +54 -36
  4. package/out/ui/packages/toast/components/Toast.styles.luau +1 -1
  5. package/package.json +1 -1
package/out/ui/packages/divider/components/Divider.styles.luau CHANGED
@@ -36,6 +36,7 @@ local useDividerStyles = componentStyles("Divider", function(theme, props)
36
36
  Size = UDim2.new(1, 0, 0, theme.spacing.calc(2)),
37
37
  BackgroundTransparency = 1,
38
38
  BorderSizePixel = 0,
39
+ ClipsDescendants = true,
39
40
  },
40
41
  line = {
41
42
  Size = UDim2.new(1, 0, 0, weight),
@@ -46,8 +47,8 @@ local useDividerStyles = componentStyles("Divider", function(theme, props)
46
47
  BorderSizePixel = 0,
47
48
  },
48
49
  caption = {
49
- AutomaticSize = Enum.AutomaticSize.XY,
50
- Size = UDim2.fromScale(0, 0),
50
+ AutomaticSize = Enum.AutomaticSize.X,
51
+ Size = UDim2.new(0, 0, 1, 0),
51
52
  AnchorPoint = Vector2.new(0.5, 0.5),
52
53
  Position = UDim2.new(0.5, 0, 0.5, 0),
53
54
  BackgroundColor3 = theme.palette.surface.canvas,
@@ -55,6 +56,8 @@ local useDividerStyles = componentStyles("Divider", function(theme, props)
55
56
  Font = theme.typography.fontFamilies.default,
56
57
  TextSize = theme.typography.fontSizes.caption,
57
58
  TextColor3 = theme.palette.text.secondary,
59
+ TextTruncate = Enum.TextTruncate.AtEnd,
60
+ TextXAlignment = Enum.TextXAlignment.Center,
58
61
  ZIndex = 2,
59
62
  },
60
63
  captionPad = {
package/out/ui/packages/drawer/components/Drawer.d.ts CHANGED
@@ -8,5 +8,5 @@ export interface DrawerProps {
8
8
  onClose: () => void;
9
9
  children?: React.ReactNode;
10
10
  }
11
- declare function Drawer(props: DrawerProps): JSX.Element | undefined;
11
+ declare function Drawer(props: DrawerProps): JSX.Element;
12
12
  export default Drawer;
package/out/ui/packages/drawer/components/Drawer.luau CHANGED
@@ -4,8 +4,11 @@ local _react = TS.import(script, TS.getModule(script, "@rbxts", "react"))
4
4
  local React = _react
5
5
  local useEffect = _react.useEffect
6
6
  local useRef = _react.useRef
7
+ local useState = _react.useState
7
8
  local UserInputService = TS.import(script, TS.getModule(script, "@rbxts", "services")).UserInputService
8
- local Portal = TS.import(script, script.Parent.Parent.Parent, "popup").Portal
9
+ local _popup = TS.import(script, script.Parent.Parent.Parent, "popup")
10
+ local Portal = _popup.Portal
11
+ local portalTarget = _popup.portalTarget
9
12
  local isDismissInput = TS.import(script, script.Parent.Parent.Parent, "modal", "components", "dismissInput").isDismissInput
10
13
  local drawerAnchor = TS.import(script, script.Parent, "drawerPlacement").drawerAnchor
11
14
  local useDrawerStyles = TS.import(script, script.Parent, "Drawer.styles").default
@@ -24,7 +27,14 @@ local function Drawer(props)
24
27
  width = width,
25
28
  })
26
29
  local close = useRef(onClose)
30
+ local anchor = useRef()
31
+ local layer, setLayer = useState(function()
32
+ return portalTarget(host)
33
+ end)
27
34
  close.current = onClose
35
+ useEffect(function()
36
+ setLayer(portalTarget(host or anchor.current))
37
+ end, { host, open })
28
38
  useEffect(function()
29
39
  if not open then
30
40
  return nil
@@ -37,42 +47,50 @@ local function Drawer(props)
37
47
  return function()
38
48
  return connection:Disconnect()
39
49
  end
40
- end, { open })
41
- if not open then
42
- return nil
43
- end
44
- local anchor = drawerAnchor(edge)
45
- local _attributes = {
46
- key = "Drawer",
47
- }
48
- for _k, _v in styles.root do
49
- _attributes[_k] = _v
50
- end
51
- local _attributes_1 = {
52
- key = "Backdrop",
53
- }
54
- for _k, _v in styles.backdrop do
55
- _attributes_1[_k] = _v
56
- end
57
- _attributes_1.Event = {
58
- Activated = function()
59
- return close.current()
60
- end,
61
- }
62
- local _exp = React.createElement("textbutton", _attributes_1)
63
- local _attributes_2 = {
64
- key = "Panel",
65
- }
66
- for _k, _v in styles.panel do
67
- _attributes_2[_k] = _v
50
+ end, { open, layer })
51
+ local placement = drawerAnchor(edge)
52
+ local _exp = React.createElement("frame", {
53
+ key = "DrawerAnchor",
54
+ ref = anchor,
55
+ Size = UDim2.fromOffset(0, 0),
56
+ BackgroundTransparency = 1,
57
+ BorderSizePixel = 0,
58
+ })
59
+ local _condition = open and layer ~= nil
60
+ if _condition then
61
+ local _attributes = {
62
+ key = "Drawer",
63
+ }
64
+ for _k, _v in styles.root do
65
+ _attributes[_k] = _v
66
+ end
67
+ local _attributes_1 = {
68
+ key = "Backdrop",
69
+ }
70
+ for _k, _v in styles.backdrop do
71
+ _attributes_1[_k] = _v
72
+ end
73
+ _attributes_1.Event = {
74
+ Activated = function()
75
+ return close.current()
76
+ end,
77
+ }
78
+ local _exp_1 = React.createElement("textbutton", _attributes_1)
79
+ local _attributes_2 = {
80
+ key = "Panel",
81
+ }
82
+ for _k, _v in styles.panel do
83
+ _attributes_2[_k] = _v
84
+ end
85
+ _attributes_2.AnchorPoint = Vector2.new(placement, 0)
86
+ _attributes_2.Position = UDim2.fromScale(placement, 0)
87
+ local _attributes_3 = table.clone(styles.padding)
88
+ setmetatable(_attributes_3, nil)
89
+ _condition = (React.createElement(Portal, {
90
+ host = layer,
91
+ }, React.createElement("frame", _attributes, _exp_1, React.createElement("frame", _attributes_2, React.createElement("uipadding", _attributes_3), children))))
68
92
  end
69
- _attributes_2.AnchorPoint = Vector2.new(anchor, 0)
70
- _attributes_2.Position = UDim2.fromScale(anchor, 0)
71
- local _attributes_3 = table.clone(styles.padding)
72
- setmetatable(_attributes_3, nil)
73
- return React.createElement(Portal, {
74
- host = host,
75
- }, React.createElement("frame", _attributes, _exp, React.createElement("frame", _attributes_2, React.createElement("uipadding", _attributes_3), children)))
93
+ return React.createElement(React.Fragment, nil, _exp, _condition)
76
94
  end
77
95
  local default = Drawer
78
96
  return {
package/out/ui/packages/toast/components/Toast.styles.luau CHANGED
@@ -46,7 +46,7 @@ local useToastStyles = componentStyles("Toast", function(theme, _param)
46
46
  return createStyles({
47
47
  container = {
48
48
  Size = UDim2.new(0, theme.spacing.calc(20), 0, theme.spacing.calc(4)),
49
- Position = INACTIVE_POSITION,
49
+ Position = ACTIVE_POSITION,
50
50
  BackgroundColor3 = toastColors.background,
51
51
  AnchorPoint = Vector2.new(0.5, 1),
52
52
  BorderSizePixel = 0,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rbxts/uiblox",
3
- "version": "0.2.0-alpha.23",
3
+ "version": "0.2.0-alpha.24",
4
4
  "description": "UI Library and theming for roblox-ts projects",
5
5
  "main": "out/init.luau",
6
6
  "packageManager": "pnpm@11.3.0",