@rbxts/uiblox 0.2.0-alpha.36 → 0.2.0-alpha.38

package/out/ui/packages/colorPicker/components/ColorPicker.styles.luau

@@ -3,8 +3,11 @@ local TS = _G[script]
 local _theme = TS.import(script, script.Parent.Parent.Parent.Parent.Parent, "theme")
 local createStyles = _theme.createStyles
 local componentStyles = _theme.componentStyles
+local _editorFace = TS.import(script, script.Parent.Parent.Parent, "editorFace")
+local editorPad = _editorFace.editorPad
+local editorText = _editorFace.editorText
 local useColorPickerStyles = componentStyles("ColorPicker", function(theme)
-	return createStyles({
+	local _object = {
 		root = {
 			Size = UDim2.new(1, 0, 0, 0),
 			AutomaticSize = Enum.AutomaticSize.Y,
@@ -15,7 +18,7 @@ local useColorPickerStyles = componentStyles("ColorPicker", function(theme)
 		},
 		column = {
 			FillDirection = Enum.FillDirection.Vertical,
-			Padding = UDim.new(0, theme.padding.calc(0.75)),
+			Padding = UDim.new(0, editorPad(theme)),
 			SortOrder = Enum.SortOrder.LayoutOrder,
 		},
 		row = {
@@ -25,7 +28,7 @@ local useColorPickerStyles = componentStyles("ColorPicker", function(theme)
 		},
 		rowLayout = {
 			FillDirection = Enum.FillDirection.Horizontal,
-			Padding = UDim.new(0, theme.padding.calc(0.5)),
+			Padding = UDim.new(0, editorPad(theme)),
 			VerticalAlignment = Enum.VerticalAlignment.Center,
 			SortOrder = Enum.SortOrder.LayoutOrder,
 		},
@@ -86,72 +89,76 @@ local useColorPickerStyles = componentStyles("ColorPicker", function(theme)
 			BorderSizePixel = 0,
 		},
 		channel = {
-			Size = UDim2.new(1 / 3, -theme.padding.calc(0.5), 0, theme.spacing.calc(3)),
+			Size = UDim2.new(1 / 3, -editorPad(theme), 0, theme.spacing.calc(3)),
 			BackgroundTransparency = 1,
 		},
-		label = {
-			Size = UDim2.new(0, theme.spacing.calc(1.5), 1, 0),
-			BackgroundTransparency = 1,
-			Font = theme.typography.fontFamilies.default,
-			TextSize = theme.typography.fontSizes.button,
-			TextColor3 = theme.palette.text.secondary,
-			TextXAlignment = Enum.TextXAlignment.Left,
-		},
-		channelField = {
-			Size = UDim2.new(1, -theme.spacing.calc(1.5), 1, 0),
-			BackgroundTransparency = 1,
-		},
-		field = {
-			Size = UDim2.new(1, 0, 0, theme.spacing.calc(3)),
-			BackgroundTransparency = 1,
-			BorderSizePixel = 0,
-		},
-		swatchButton = {
-			Size = UDim2.fromOffset(theme.spacing.calc(3), theme.spacing.calc(3)),
-			BorderSizePixel = 0,
-			AutoButtonColor = false,
-			Text = "",
-		},
-		value = {
-			Size = UDim2.new(1, -theme.spacing.calc(4), 1, 0),
-			BackgroundTransparency = 1,
-		},
-		shell = {
-			Size = UDim2.fromScale(1, 1),
-			BackgroundColor3 = theme.palette.surface.elevated,
-			BorderSizePixel = 0,
-		},
-		shellPad = {
-			PaddingTop = UDim.new(0, theme.padding.calc(1)),
-			PaddingBottom = UDim.new(0, theme.padding.calc(1)),
-			PaddingLeft = UDim.new(0, theme.padding.calc(1)),
-			PaddingRight = UDim.new(0, theme.padding.calc(1)),
-		},
-		shellStroke = {
-			Color = theme.palette.divider,
-			Thickness = 1,
-		},
-		recent = {
-			Size = UDim2.new(1, 0, 0, theme.spacing.calc(2)),
-			BackgroundTransparency = 1,
-		},
-		recentChip = {
-			Size = UDim2.fromOffset(theme.spacing.calc(2), theme.spacing.calc(2)),
-			BorderSizePixel = 0,
-			AutoButtonColor = false,
-			Text = "",
-		},
-		link = {
-			Size = UDim2.new(0, 0, 0, theme.spacing.calc(2)),
-			AutomaticSize = Enum.AutomaticSize.X,
-			BackgroundTransparency = 1,
-			AutoButtonColor = false,
-			Font = theme.typography.fontFamilies.default,
-			TextSize = theme.typography.fontSizes.button,
-			TextColor3 = theme.palette.text.secondary,
-			TextXAlignment = Enum.TextXAlignment.Left,
-		},
-	})
+	}
+	local _left = "label"
+	local _object_1 = {
+		Size = UDim2.new(0, theme.spacing.calc(1.5), 1, 0),
+		BackgroundTransparency = 1,
+		TextColor3 = theme.palette.text.secondary,
+	}
+	for _k, _v in editorText(theme) do
+		_object_1[_k] = _v
+	end
+	_object[_left] = _object_1
+	_object.channelField = {
+		Size = UDim2.new(1, -theme.spacing.calc(1.5), 1, 0),
+		BackgroundTransparency = 1,
+	}
+	_object.field = {
+		Size = UDim2.new(1, 0, 0, theme.spacing.calc(3)),
+		BackgroundTransparency = 1,
+		BorderSizePixel = 0,
+	}
+	_object.swatchButton = {
+		Size = UDim2.fromOffset(theme.spacing.calc(3), theme.spacing.calc(3)),
+		BorderSizePixel = 0,
+		AutoButtonColor = false,
+		Text = "",
+	}
+	_object.value = {
+		Size = UDim2.new(1, -theme.spacing.calc(4), 1, 0),
+		BackgroundTransparency = 1,
+	}
+	_object.shell = {
+		Size = UDim2.fromScale(1, 1),
+		BackgroundColor3 = theme.palette.surface.elevated,
+		BorderSizePixel = 0,
+	}
+	_object.shellPad = {
+		PaddingTop = UDim.new(0, editorPad(theme)),
+		PaddingBottom = UDim.new(0, editorPad(theme)),
+		PaddingLeft = UDim.new(0, editorPad(theme)),
+		PaddingRight = UDim.new(0, editorPad(theme)),
+	}
+	_object.shellStroke = {
+		Color = theme.palette.divider,
+		Thickness = 1,
+	}
+	_object.recent = {
+		Size = UDim2.new(1, 0, 0, theme.spacing.calc(2)),
+		BackgroundTransparency = 1,
+	}
+	_object.recentChip = {
+		Size = UDim2.fromOffset(theme.spacing.calc(2), theme.spacing.calc(2)),
+		BorderSizePixel = 0,
+		AutoButtonColor = false,
+		Text = "",
+	}
+	local _left_1 = "link"
+	local _object_2 = {
+		Size = UDim2.new(1, 0, 0, theme.spacing.calc(2)),
+		BackgroundTransparency = 1,
+		AutoButtonColor = false,
+		TextColor3 = theme.palette.text.secondary,
+	}
+	for _k, _v in editorText(theme) do
+		_object_2[_k] = _v
+	end
+	_object[_left_1] = _object_2
+	return createStyles(_object)
 end)
 local default = useColorPickerStyles
 return {

package/out/ui/packages/colorPicker/components/ColorSequenceEditor.luau

@@ -4,6 +4,7 @@ local _react = TS.import(script, TS.getModule(script, "@rbxts", "react"))
 local React = _react
 local useRef = _react.useRef
 local useState = _react.useState
+local useEditorHover = TS.import(script, script.Parent.Parent.Parent, "editorFace").useEditorHover
 local SxHost = TS.import(script, script.Parent.Parent.Parent, "host").SxHost
 local canActivate = TS.import(script, script.Parent.Parent.Parent, "button", "components", "activation").canActivate
 local ColorPicker = TS.import(script, script.Parent, "ColorPicker").default
@@ -14,6 +15,8 @@ local insertColorStop = _sequenceValue.insertColorStop
 local patchColorStop = _sequenceValue.patchColorStop
 local readColorStops = _sequenceValue.readColorStops
 local removeColorStop = _sequenceValue.removeColorStop
+local sequenceMove = _sequenceValue.sequenceMove
+local sequencePress = _sequenceValue.sequencePress
 local writeColorStops = _sequenceValue.writeColorStops
 local function ColorSequenceEditor(props)
 	local _binding = props
@@ -25,6 +28,7 @@ local function ColorSequenceEditor(props)
 	local id = _binding.id
 	local ref = _binding.ref
 	local styles = useColorPickerStyles()
+	local hover = useEditorHover(disabled)
 	local active = canActivate(disabled)
 	local stops = readColorStops(value)
 	local selected, setSelected = useState(0)
@@ -53,12 +57,18 @@ local function ColorSequenceEditor(props)
 	end
 	_attributes.key = _condition
 	_attributes.hostRef = ref
-	_attributes.base = styles.root
+	local _object = table.clone(styles.root)
+	setmetatable(_object, nil)
+	for _k, _v in hover.face do
+		_object[_k] = _v
+	end
+	_attributes.base = _object
 	_attributes.className = className
 	_attributes.sx = sx
 	_attributes.state = {
 		disabled = disabled,
 	}
+	_attributes.Event = hover.event
 	_attributes.Selectable = false
 	local _attributes_1 = table.clone(styles.column)
 	setmetatable(_attributes_1, nil)
@@ -73,7 +83,7 @@ local function ColorSequenceEditor(props)
 	_attributes_2.Active = active
 	_attributes_2.Event = {
 		InputBegan = function(rbx, input)
-			if not active or input.UserInputType ~= Enum.UserInputType.MouseButton1 then
+			if not active or not sequencePress(input.UserInputType.Name) then
 				return nil
 			end
 			local alpha = atAlpha(rbx, input.Position)
@@ -106,7 +116,7 @@ local function ColorSequenceEditor(props)
 			setSelected(hitStop(_newValue_1, alpha, 1))
 		end,
 		InputChanged = function(rbx, input)
-			if not dragging.current or input.UserInputType ~= Enum.UserInputType.MouseMovement then
+			if not dragging.current or not sequenceMove(input.UserInputType.Name) then
 				return nil
 			end
 			commit(patchColorStop(stops, index, {
@@ -138,9 +148,9 @@ local function ColorSequenceEditor(props)
 		_attributes_5.BackgroundColor3 = stop.color
 		_attributes_5.Position = UDim2.fromScale(stop.t, 0.5)
 		_attributes_5.ZIndex = if stopIndex == index then 2 else 1
-		return React.createElement("frame", _attributes_5, React.createElement("uicorner", {
-			CornerRadius = UDim.new(0, 2),
-		}), React.createElement("uistroke", {
+		local _attributes_6 = table.clone(styles.corner)
+		setmetatable(_attributes_6, nil)
+		return React.createElement("frame", _attributes_5, React.createElement("uicorner", _attributes_6), React.createElement("uistroke", {
 			Thickness = if stopIndex == index then 2 else 1,
 			Color = Color3.new(1, 1, 1),
 		}))

package/out/ui/packages/colorPicker/components/NumberSequenceEditor.luau

@@ -4,6 +4,7 @@ local _react = TS.import(script, TS.getModule(script, "@rbxts", "react"))
 local React = _react
 local useRef = _react.useRef
 local useState = _react.useState
+local useEditorHover = TS.import(script, script.Parent.Parent.Parent, "editorFace").useEditorHover
 local SxHost = TS.import(script, script.Parent.Parent.Parent, "host").SxHost
 local canActivate = TS.import(script, script.Parent.Parent.Parent, "button", "components", "activation").canActivate
 local NumberInput = TS.import(script, script.Parent.Parent.Parent, "numberInput").NumberInput
@@ -14,6 +15,8 @@ local insertNumberStop = _sequenceValue.insertNumberStop
 local patchNumberStop = _sequenceValue.patchNumberStop
 local readNumberStops = _sequenceValue.readNumberStops
 local removeNumberStop = _sequenceValue.removeNumberStop
+local sequenceMove = _sequenceValue.sequenceMove
+local sequencePress = _sequenceValue.sequencePress
 local writeNumberStops = _sequenceValue.writeNumberStops
 local function NumberSequenceEditor(props)
 	local _binding = props
@@ -25,6 +28,7 @@ local function NumberSequenceEditor(props)
 	local id = _binding.id
 	local ref = _binding.ref
 	local styles = useColorPickerStyles()
+	local hover = useEditorHover(disabled)
 	local active = canActivate(disabled)
 	local stops = readNumberStops(value)
 	local selected, setSelected = useState(0)
@@ -54,12 +58,18 @@ local function NumberSequenceEditor(props)
 	end
 	_attributes.key = _condition
 	_attributes.hostRef = ref
-	_attributes.base = styles.root
+	local _object = table.clone(styles.root)
+	setmetatable(_object, nil)
+	for _k, _v in hover.face do
+		_object[_k] = _v
+	end
+	_attributes.base = _object
 	_attributes.className = className
 	_attributes.sx = sx
 	_attributes.state = {
 		disabled = disabled,
 	}
+	_attributes.Event = hover.event
 	_attributes.Selectable = false
 	local _attributes_1 = table.clone(styles.column)
 	setmetatable(_attributes_1, nil)
@@ -75,7 +85,7 @@ local function NumberSequenceEditor(props)
 	_attributes_2.Active = active
 	_attributes_2.Event = {
 		InputBegan = function(rbx, input)
-			if not active or input.UserInputType ~= Enum.UserInputType.MouseButton1 then
+			if not active or not sequencePress(input.UserInputType.Name) then
 				return nil
 			end
 			local alpha = atAlpha(rbx, input.Position)
@@ -108,7 +118,7 @@ local function NumberSequenceEditor(props)
 			setSelected(hitStop(_newValue_1, alpha, 1))
 		end,
 		InputChanged = function(rbx, input)
-			if not dragging.current or input.UserInputType ~= Enum.UserInputType.MouseMovement then
+			if not dragging.current or not sequenceMove(input.UserInputType.Name) then
 				return nil
 			end
 			commit(patchNumberStop(stops, index, {
@@ -140,9 +150,9 @@ local function NumberSequenceEditor(props)
 		_attributes_5.BackgroundColor3 = Color3.new(0.85, 0.85, 0.85)
 		_attributes_5.Position = UDim2.fromScale(stop.t, 0.5)
 		_attributes_5.ZIndex = if stopIndex == index then 2 else 1
-		return React.createElement("frame", _attributes_5, React.createElement("uicorner", {
-			CornerRadius = UDim.new(0, 2),
-		}), React.createElement("uistroke", {
+		local _attributes_6 = table.clone(styles.corner)
+		setmetatable(_attributes_6, nil)
+		return React.createElement("frame", _attributes_5, React.createElement("uicorner", _attributes_6), React.createElement("uistroke", {
 			Thickness = if stopIndex == index then 2 else 1,
 			Color = Color3.new(1, 1, 1),
 		}))

package/out/ui/packages/colorPicker/components/sequenceValue.d.ts

@@ -23,4 +23,6 @@ export declare function sampleNumber(stops: NumberStop[], time: number): {
 export declare function insertNumberStop(stops: NumberStop[], time: number): NumberStop[];
 export declare function patchNumberStop(stops: NumberStop[], index: number, patch: Partial<NumberStop>): NumberStop[];
 export declare function removeNumberStop(stops: NumberStop[], index: number): NumberStop[];
+export declare function sequencePress(kind: string): kind is "MouseButton1" | "Touch";
+export declare function sequenceMove(kind: string): kind is "MouseMovement" | "Touch";
 export declare function hitStop(times: number[], alpha: number, threshold: number): number;

package/out/ui/packages/colorPicker/components/sequenceValue.luau

@@ -277,6 +277,12 @@ local function removeNumberStop(stops, index)
 	end
 	return updated
 end
+local function sequencePress(kind)
+	return kind == "MouseButton1" or kind == "Touch"
+end
+local function sequenceMove(kind)
+	return kind == "MouseMovement" or kind == "Touch"
+end
 local function hitStop(times, alpha, threshold)
 	local best = -1
 	local distance = threshold
@@ -303,5 +309,7 @@ return {
 	insertNumberStop = insertNumberStop,
 	patchNumberStop = patchNumberStop,
 	removeNumberStop = removeNumberStop,
+	sequencePress = sequencePress,
+	sequenceMove = sequenceMove,
 	hitStop = hitStop,
 }

package/out/ui/packages/colorPicker/index.d.ts

@@ -6,6 +6,6 @@ export { default as NumberSequenceEditor } from "./components/NumberSequenceEdit
 export { NumberSequenceEditorProps } from "./components/NumberSequenceEditor";
 export { byteToUnit, channelToByte, colorToHex, hsvToColor3, hsvToRgb, parseByte, parseHex, resolveHsv, rgbToHsv, sameColor, } from "./components/colorValue";
 export { Hsv } from "./components/colorValue";
-export { hitStop, insertColorStop, insertNumberStop, lerpColor, patchColorStop, patchNumberStop, readColorStops, readNumberStops, removeColorStop, removeNumberStop, sampleColor, sampleNumber, writeColorStops, writeNumberStops, } from "./components/sequenceValue";
+export { hitStop, insertColorStop, insertNumberStop, lerpColor, patchColorStop, patchNumberStop, readColorStops, readNumberStops, removeColorStop, removeNumberStop, sampleColor, sampleNumber, sequenceMove, sequencePress, writeColorStops, writeNumberStops, } from "./components/sequenceValue";
 export { ColorStop, NumberStop } from "./components/sequenceValue";
 export { colorBytes, recentColors, rememberColor } from "./components/colorValue";

package/out/ui/packages/colorPicker/init.luau

@@ -28,6 +28,8 @@ exports.removeColorStop = _sequenceValue.removeColorStop
 exports.removeNumberStop = _sequenceValue.removeNumberStop
 exports.sampleColor = _sequenceValue.sampleColor
 exports.sampleNumber = _sequenceValue.sampleNumber
+exports.sequenceMove = _sequenceValue.sequenceMove
+exports.sequencePress = _sequenceValue.sequencePress
 exports.writeColorStops = _sequenceValue.writeColorStops
 exports.writeNumberStops = _sequenceValue.writeNumberStops
 local _colorValue_1 = TS.import(script, script, "components", "colorValue")

package/out/ui/packages/copyButton/components/CopyButton.d.ts

@@ -0,0 +1,8 @@
+import { CustomizedProps } from "../../../../theme/index";
+export interface CopyButtonProps {
+    text: string;
+    onCopy?: (text: string) => void;
+    disabled?: boolean;
+}
+declare function CopyButton(props: CustomizedProps<TextButton, CopyButtonProps>): JSX.Element;
+export default CopyButton;

package/out/ui/packages/copyButton/components/CopyButton.luau

@@ -0,0 +1,32 @@
+-- Compiled with roblox-ts v3.0.0
+local TS = _G[script]
+local React = TS.import(script, TS.getModule(script, "@rbxts", "react"))
+local Button = TS.import(script, script.Parent.Parent.Parent, "button").Button
+local copyInvoke = TS.import(script, script.Parent, "copyInvoke").copyInvoke
+local function CopyButton(props)
+	local _binding = props
+	local text = _binding.text
+	local onCopy = _binding.onCopy
+	local disabled = _binding.disabled
+	local className = _binding.className
+	local sx = _binding.sx
+	local id = _binding.id
+	local ref = _binding.ref
+	return React.createElement(Button, {
+		id = id,
+		ref = ref,
+		className = className,
+		sx = sx,
+		text = "Copy",
+		size = "small",
+		variant = "text",
+		disabled = disabled,
+		onLeftClick = function()
+			return copyInvoke(text, onCopy)
+		end,
+	})
+end
+local default = CopyButton
+return {
+	default = default,
+}

package/out/ui/packages/copyButton/components/copyInvoke.d.ts

@@ -0,0 +1,2 @@
+/** Hands the string to the caller. Does nothing when there is no callback. */
+export declare function copyInvoke(text: string, onCopy?: (text: string) => void): string | undefined;

package/out/ui/packages/copyButton/components/copyInvoke.luau

@@ -0,0 +1,12 @@
+-- Compiled with roblox-ts v3.0.0
+--* Hands the string to the caller. Does nothing when there is no callback. 
+local function copyInvoke(text, onCopy)
+	if onCopy == nil then
+		return nil
+	end
+	onCopy(text)
+	return text
+end
+return {
+	copyInvoke = copyInvoke,
+}

package/out/ui/packages/copyButton/index.d.ts

@@ -0,0 +1,3 @@
+export { default as CopyButton } from "./components/CopyButton";
+export { CopyButtonProps } from "./components/CopyButton";
+export { copyInvoke } from "./components/copyInvoke";

package/out/ui/packages/copyButton/init.luau

@@ -0,0 +1,6 @@
+-- Compiled with roblox-ts v3.0.0
+local TS = _G[script]
+local exports = {}
+exports.CopyButton = TS.import(script, script, "components", "CopyButton").default
+exports.copyInvoke = TS.import(script, script, "components", "copyInvoke").copyInvoke
+return exports

package/out/ui/packages/cover/components/Cover.d.ts

@@ -0,0 +1,8 @@
+import React from "@rbxts/react";
+import { CustomizedProps } from "../../../../theme/index";
+export interface CoverProps {
+    value?: number;
+    children?: React.ReactNode;
+}
+declare function Cover(props: CustomizedProps<Frame, CoverProps>): JSX.Element;
+export default Cover;

package/out/ui/packages/cover/components/Cover.luau

@@ -0,0 +1,47 @@
+-- Compiled with roblox-ts v3.0.0
+local TS = _G[script]
+local React = TS.import(script, TS.getModule(script, "@rbxts", "react"))
+local useTheme = TS.import(script, script.Parent.Parent.Parent.Parent.Parent, "theme").useTheme
+local SxHost = TS.import(script, script.Parent.Parent.Parent, "host").SxHost
+local coverFill = TS.import(script, script.Parent, "coverFill").coverFill
+local function Cover(props)
+	local _binding = props
+	local value = _binding.value
+	local children = _binding.children
+	local className = _binding.className
+	local sx = _binding.sx
+	local id = _binding.id
+	local ref = _binding.ref
+	local _binding_1 = useTheme()
+	local theme = _binding_1.theme
+	local fill = coverFill(value)
+	local _attributes = {
+		tag = "frame",
+	}
+	local _condition = id
+	if not (_condition ~= 0 and _condition == _condition and _condition ~= "" and _condition) then
+		_condition = "Cover"
+	end
+	_attributes.key = _condition
+	_attributes.hostRef = ref
+	_attributes.base = {
+		Size = UDim2.new(1, 0, 1, 0),
+		BackgroundTransparency = 1,
+		BorderSizePixel = 0,
+		ClipsDescendants = true,
+	}
+	_attributes.className = className
+	_attributes.sx = sx
+	return React.createElement(SxHost, _attributes, children, if fill > 0 then (React.createElement("frame", {
+		key = "Shade",
+		Size = UDim2.new(1, 0, fill, 0),
+		BackgroundColor3 = theme.palette.backdrop,
+		BackgroundTransparency = 0.35,
+		BorderSizePixel = 0,
+		ZIndex = 2,
+	})) else nil)
+end
+local default = Cover
+return {
+	default = default,
+}

package/out/ui/packages/cover/components/coverFill.d.ts

@@ -0,0 +1,2 @@
+/** Remaining fraction of the child to shade. Zero when there is nothing left. */
+export declare function coverFill(value?: number): number;

package/out/ui/packages/cover/components/coverFill.luau

@@ -0,0 +1,14 @@
+-- Compiled with roblox-ts v3.0.0
+--* Remaining fraction of the child to shade. Zero when there is nothing left. 
+local function coverFill(value)
+	if value == nil or value <= 0 then
+		return 0
+	end
+	if value >= 1 then
+		return 1
+	end
+	return value
+end
+return {
+	coverFill = coverFill,
+}

package/out/ui/packages/cover/index.d.ts

@@ -0,0 +1,3 @@
+export { default as Cover } from "./components/Cover";
+export { CoverProps } from "./components/Cover";
+export { coverFill } from "./components/coverFill";

package/out/ui/packages/cover/init.luau

@@ -0,0 +1,6 @@
+-- Compiled with roblox-ts v3.0.0
+local TS = _G[script]
+local exports = {}
+exports.Cover = TS.import(script, script, "components", "Cover").default
+exports.coverFill = TS.import(script, script, "components", "coverFill").coverFill
+return exports

package/out/ui/packages/dateRange/components/DateRangePicker.d.ts

@@ -6,6 +6,9 @@ export interface DateRangePickerProps {
     value: DateSpan;
     onChange: (value: DateSpan) => void;
     onMonthChange: (year: number, month: number) => void;
+    view?: "month" | "week";
+    anchor?: number;
+    onAnchorChange?: (stamp: number) => void;
 }
 declare function DateRangePicker(props: CustomizedProps<Frame, DateRangePickerProps>): JSX.Element;
 export default DateRangePicker;