@gobolt/genesis 0.10.0 → 0.10.2
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.
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { ReactNode } from 'react';
|
|
2
|
+
import { DrawerProps } from 'antd';
|
|
2
3
|
import { ButtonProps } from '../Button';
|
|
3
4
|
type BottomDrawerAction = {
|
|
4
5
|
label: string;
|
|
@@ -15,11 +16,23 @@ export interface BottomDrawerProps {
|
|
|
15
16
|
label?: ReactNode;
|
|
16
17
|
/** Right-aligned action buttons (e.g. Cancel + Confirm). */
|
|
17
18
|
actions?: BottomDrawerAction[];
|
|
19
|
+
/**
|
|
20
|
+
* Where to mount the drawer. By default it portals to `document.body` (full
|
|
21
|
+
* viewport width). Pass a positioned container (a node getter) or `false` to
|
|
22
|
+
* render it inside a `position: relative` parent, scoped to that parent's width.
|
|
23
|
+
*/
|
|
24
|
+
getContainer?: DrawerProps["getContainer"];
|
|
25
|
+
/**
|
|
26
|
+
* Whether the drawer grabs focus when it opens. Defaults to `false` so a bar
|
|
27
|
+
* that appears while the user is typing (e.g. an unsaved-changes prompt) does
|
|
28
|
+
* not steal focus and interrupt input. Set `true` to focus the drawer on open.
|
|
29
|
+
*/
|
|
30
|
+
autoFocus?: boolean;
|
|
18
31
|
}
|
|
19
32
|
/**
|
|
20
33
|
* A slim slide-up drawer for user confirmation: a description on the left and
|
|
21
34
|
* actions on the right. Shares SidePanel's slide-up + overlay behavior, but the
|
|
22
35
|
* contents are intentionally trimmed to a single action row.
|
|
23
36
|
*/
|
|
24
|
-
declare const BottomDrawer: ({ open, onClose, type, height, label, actions, }: BottomDrawerProps) => import("react/jsx-runtime").JSX.Element;
|
|
37
|
+
declare const BottomDrawer: ({ open, onClose, type, height, label, actions, getContainer, autoFocus, }: BottomDrawerProps) => import("react/jsx-runtime").JSX.Element;
|
|
25
38
|
export default BottomDrawer;
|
package/dist/index.cjs
CHANGED
|
@@ -87894,7 +87894,9 @@ const BottomDrawer = ({
|
|
|
87894
87894
|
type: type4 = "full",
|
|
87895
87895
|
height = 88,
|
|
87896
87896
|
label,
|
|
87897
|
-
actions = []
|
|
87897
|
+
actions = [],
|
|
87898
|
+
getContainer: getContainer2,
|
|
87899
|
+
autoFocus = false
|
|
87898
87900
|
}) => {
|
|
87899
87901
|
const theme = styled.useTheme();
|
|
87900
87902
|
const spacing = {
|
|
@@ -87903,6 +87905,7 @@ const BottomDrawer = ({
|
|
|
87903
87905
|
};
|
|
87904
87906
|
const textColor = theme?.colors?.onsurface?.active?.textColor || "#3E3E3E";
|
|
87905
87907
|
const isFloat = type4 === "float";
|
|
87908
|
+
const isContained = getContainer2 !== void 0;
|
|
87906
87909
|
const floatOffset = 24;
|
|
87907
87910
|
const border = "1px solid var(--interactive-utility-border, #CBCBCB)";
|
|
87908
87911
|
const sharedStyles = {
|
|
@@ -87930,12 +87933,15 @@ const BottomDrawer = ({
|
|
|
87930
87933
|
{
|
|
87931
87934
|
closable: false,
|
|
87932
87935
|
mask: false,
|
|
87936
|
+
autoFocus,
|
|
87933
87937
|
onClose,
|
|
87934
87938
|
placement: "bottom",
|
|
87935
87939
|
height,
|
|
87936
87940
|
open,
|
|
87937
87941
|
$type: type4,
|
|
87938
87942
|
styles: drawerStyles,
|
|
87943
|
+
getContainer: getContainer2,
|
|
87944
|
+
rootStyle: isContained ? { position: "absolute" } : void 0,
|
|
87939
87945
|
children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
87940
87946
|
Tile,
|
|
87941
87947
|
{
|
package/dist/index.js
CHANGED
|
@@ -87876,7 +87876,9 @@ const BottomDrawer = ({
|
|
|
87876
87876
|
type: type4 = "full",
|
|
87877
87877
|
height = 88,
|
|
87878
87878
|
label,
|
|
87879
|
-
actions = []
|
|
87879
|
+
actions = [],
|
|
87880
|
+
getContainer: getContainer2,
|
|
87881
|
+
autoFocus = false
|
|
87880
87882
|
}) => {
|
|
87881
87883
|
const theme = useTheme$1();
|
|
87882
87884
|
const spacing = {
|
|
@@ -87885,6 +87887,7 @@ const BottomDrawer = ({
|
|
|
87885
87887
|
};
|
|
87886
87888
|
const textColor = theme?.colors?.onsurface?.active?.textColor || "#3E3E3E";
|
|
87887
87889
|
const isFloat = type4 === "float";
|
|
87890
|
+
const isContained = getContainer2 !== void 0;
|
|
87888
87891
|
const floatOffset = 24;
|
|
87889
87892
|
const border = "1px solid var(--interactive-utility-border, #CBCBCB)";
|
|
87890
87893
|
const sharedStyles = {
|
|
@@ -87912,12 +87915,15 @@ const BottomDrawer = ({
|
|
|
87912
87915
|
{
|
|
87913
87916
|
closable: false,
|
|
87914
87917
|
mask: false,
|
|
87918
|
+
autoFocus,
|
|
87915
87919
|
onClose,
|
|
87916
87920
|
placement: "bottom",
|
|
87917
87921
|
height,
|
|
87918
87922
|
open,
|
|
87919
87923
|
$type: type4,
|
|
87920
87924
|
styles: drawerStyles,
|
|
87925
|
+
getContainer: getContainer2,
|
|
87926
|
+
rootStyle: isContained ? { position: "absolute" } : void 0,
|
|
87921
87927
|
children: /* @__PURE__ */ jsxs(
|
|
87922
87928
|
Tile,
|
|
87923
87929
|
{
|