@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;
@@ -5,3 +5,4 @@ export default meta;
5
5
  type Story = StoryObj<typeof BottomDrawer>;
6
6
  export declare const UnsavedChanges: Story;
7
7
  export declare const FloatType: Story;
8
+ export declare const Contained: Story;
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
  {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gobolt/genesis",
3
- "version": "0.10.0",
3
+ "version": "0.10.2",
4
4
  "description": "genesis design system",
5
5
  "author": "gobolt",
6
6
  "license": "MIT",