@uniformdev/design-system 18.20.0 → 18.22.0
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.
- package/dist/esm/index.js +118 -91
- package/dist/index.d.ts +12 -6
- package/dist/index.js +321 -293
- package/package.json +5 -5
package/dist/esm/index.js
CHANGED
|
@@ -1713,9 +1713,12 @@ var PageHeaderSection = ({
|
|
|
1713
1713
|
linkManagerComponent,
|
|
1714
1714
|
...htmlProps
|
|
1715
1715
|
}) => {
|
|
1716
|
+
if (linkText && linkProps && !linkManagerComponent) {
|
|
1717
|
+
throw Error("You must provide a linkManagerComponent");
|
|
1718
|
+
}
|
|
1716
1719
|
return /* @__PURE__ */ jsxs6("div", { css: PageHeaderSectionContainer, children: [
|
|
1717
1720
|
/* @__PURE__ */ jsxs6("section", { css: PageHeaderSectionDetails, children: [
|
|
1718
|
-
linkText && linkProps ? /* @__PURE__ */ jsxs6("div", { css: PageHeaderSectionLinkContainer, children: [
|
|
1721
|
+
linkText && linkProps && linkManagerComponent ? /* @__PURE__ */ jsxs6("div", { css: PageHeaderSectionLinkContainer, children: [
|
|
1719
1722
|
/* @__PURE__ */ jsx13(Icon, { icon: CgChevronLeft, size: 18, css: PageHeaderSectionLinkIcon }),
|
|
1720
1723
|
/* @__PURE__ */ jsx13(
|
|
1721
1724
|
LinkWithRef,
|
|
@@ -9144,7 +9147,7 @@ var Details = ({ summary: summary2, children, isOpenByDefault = false, ...props
|
|
|
9144
9147
|
};
|
|
9145
9148
|
|
|
9146
9149
|
// src/components/Drawer/Drawer.tsx
|
|
9147
|
-
import
|
|
9150
|
+
import React11, { useEffect as useEffect5, useMemo, useRef as useRef2 } from "react";
|
|
9148
9151
|
import { CgChevronRight } from "react-icons/cg";
|
|
9149
9152
|
|
|
9150
9153
|
// src/components/Drawer/Drawer.styles.ts
|
|
@@ -9280,71 +9283,15 @@ function isEqualDrawerInstance(a, b) {
|
|
|
9280
9283
|
return isEqualDrawer(a, b) && a.instanceKey === b.instanceKey;
|
|
9281
9284
|
}
|
|
9282
9285
|
|
|
9283
|
-
// src/components/Drawer/Drawer.tsx
|
|
9284
|
-
import { jsx as jsx31, jsxs as jsxs17 } from "@emotion/react/jsx-runtime";
|
|
9285
|
-
var Drawer = React10.forwardRef(
|
|
9286
|
-
({ id, stackId, instanceKey, onRequestClose, header, bgColor, children }, ref) => {
|
|
9287
|
-
const { registerDrawer, unregisterDrawer } = useDrawer();
|
|
9288
|
-
const closeButtonRef = useRef2(null);
|
|
9289
|
-
const component = useMemo(() => {
|
|
9290
|
-
const headerId = `dialog-header-${stackId}-${id}`;
|
|
9291
|
-
return /* @__PURE__ */ jsxs17(
|
|
9292
|
-
"div",
|
|
9293
|
-
{
|
|
9294
|
-
ref,
|
|
9295
|
-
id,
|
|
9296
|
-
role: "dialog",
|
|
9297
|
-
tabIndex: -1,
|
|
9298
|
-
"aria-labelledby": headerId,
|
|
9299
|
-
css: drawerStyles(bgColor),
|
|
9300
|
-
"data-test-id": "side-dialog",
|
|
9301
|
-
children: [
|
|
9302
|
-
/* @__PURE__ */ jsx31(
|
|
9303
|
-
Button,
|
|
9304
|
-
{
|
|
9305
|
-
ref: closeButtonRef,
|
|
9306
|
-
type: "button",
|
|
9307
|
-
onClick: onRequestClose,
|
|
9308
|
-
css: drawerCloseButtonStyles,
|
|
9309
|
-
title: "Close dialog",
|
|
9310
|
-
buttonType: "ghost",
|
|
9311
|
-
children: /* @__PURE__ */ jsx31(Icon, { icon: CgChevronRight, iconColor: "gray", size: "1.5rem" })
|
|
9312
|
-
}
|
|
9313
|
-
),
|
|
9314
|
-
header ? /* @__PURE__ */ jsx31("div", { id: headerId, css: drawerHeaderStyles, children: header }) : null,
|
|
9315
|
-
/* @__PURE__ */ jsx31("div", { css: drawerInnerStyles, children })
|
|
9316
|
-
]
|
|
9317
|
-
}
|
|
9318
|
-
);
|
|
9319
|
-
}, [children, header, id, stackId, bgColor, onRequestClose, ref]);
|
|
9320
|
-
useEffect5(() => {
|
|
9321
|
-
registerDrawer({
|
|
9322
|
-
drawer: {
|
|
9323
|
-
id,
|
|
9324
|
-
component,
|
|
9325
|
-
stackId,
|
|
9326
|
-
onRequestClose,
|
|
9327
|
-
instanceKey
|
|
9328
|
-
},
|
|
9329
|
-
onFirstRender: () => {
|
|
9330
|
-
setTimeout(() => {
|
|
9331
|
-
var _a;
|
|
9332
|
-
(_a = closeButtonRef.current) == null ? void 0 : _a.focus({ preventScroll: true });
|
|
9333
|
-
}, 0);
|
|
9334
|
-
}
|
|
9335
|
-
});
|
|
9336
|
-
}, [component, instanceKey, registerDrawer]);
|
|
9337
|
-
useEffect5(() => {
|
|
9338
|
-
return () => unregisterDrawer({ id, stackId, instanceKey });
|
|
9339
|
-
}, [id, stackId, instanceKey, unregisterDrawer]);
|
|
9340
|
-
return null;
|
|
9341
|
-
}
|
|
9342
|
-
);
|
|
9343
|
-
|
|
9344
9286
|
// src/components/Drawer/DrawerRenderer.tsx
|
|
9345
|
-
import {
|
|
9287
|
+
import { createContext as createContext4, useContext as useContext5 } from "react";
|
|
9288
|
+
import { Fragment as Fragment4, jsx as jsx31, jsxs as jsxs17 } from "@emotion/react/jsx-runtime";
|
|
9346
9289
|
var maxLayeringInPx = 64;
|
|
9347
9290
|
var idealDistanceBetweenLayersInPx = 16;
|
|
9291
|
+
var CurrentDrawerRendererContext = createContext4({});
|
|
9292
|
+
var useCurrentDrawerRenderer = () => {
|
|
9293
|
+
return useContext5(CurrentDrawerRendererContext);
|
|
9294
|
+
};
|
|
9348
9295
|
var DrawerRenderer = ({
|
|
9349
9296
|
stackId,
|
|
9350
9297
|
position = "absolute",
|
|
@@ -9358,7 +9305,7 @@ var DrawerRenderer = ({
|
|
|
9358
9305
|
if (drawersToRender.length === 0) {
|
|
9359
9306
|
return null;
|
|
9360
9307
|
}
|
|
9361
|
-
return /* @__PURE__ */
|
|
9308
|
+
return /* @__PURE__ */ jsx31(CurrentDrawerRendererContext.Provider, { value: { stackId }, children: /* @__PURE__ */ jsx31("div", { css: drawerRendererStyles(position), ...otherProps, children: drawersToRender.map(({ component, id, stackId: stackId2, onRequestClose }, index) => /* @__PURE__ */ jsx31(
|
|
9362
9309
|
DrawerWrapper,
|
|
9363
9310
|
{
|
|
9364
9311
|
index,
|
|
@@ -9370,7 +9317,7 @@ var DrawerRenderer = ({
|
|
|
9370
9317
|
children: component
|
|
9371
9318
|
},
|
|
9372
9319
|
`${stackId2}-${id}`
|
|
9373
|
-
)) });
|
|
9320
|
+
)) }) });
|
|
9374
9321
|
};
|
|
9375
9322
|
var DrawerWrapper = ({
|
|
9376
9323
|
index,
|
|
@@ -9387,12 +9334,91 @@ var DrawerWrapper = ({
|
|
|
9387
9334
|
offsetInPx = Math.round(maxLayeringInPx * relativeLevel);
|
|
9388
9335
|
}
|
|
9389
9336
|
const calculatedWidth = `calc(${width} - ${offsetInPx}px)`;
|
|
9390
|
-
return /* @__PURE__ */
|
|
9391
|
-
/* @__PURE__ */
|
|
9392
|
-
/* @__PURE__ */
|
|
9337
|
+
return /* @__PURE__ */ jsxs17(Fragment4, { children: [
|
|
9338
|
+
/* @__PURE__ */ jsx31("div", { css: drawerWrapperOverlayStyles, onClick: onOverlayClick }),
|
|
9339
|
+
/* @__PURE__ */ jsx31("div", { css: [drawerWrapperStyles, { width: calculatedWidth, minWidth, maxWidth }], children })
|
|
9393
9340
|
] });
|
|
9394
9341
|
};
|
|
9395
9342
|
|
|
9343
|
+
// src/components/Drawer/Drawer.tsx
|
|
9344
|
+
import { jsx as jsx32, jsxs as jsxs18 } from "@emotion/react/jsx-runtime";
|
|
9345
|
+
var defaultSackId = "_default";
|
|
9346
|
+
var Drawer = React11.forwardRef(
|
|
9347
|
+
({ width, minWidth, maxWidth, position, ...drawerProps }, ref) => {
|
|
9348
|
+
const drawerRendererProps = { width, minWidth, maxWidth, position };
|
|
9349
|
+
const { stackId: inheritedStackId } = useCurrentDrawerRenderer();
|
|
9350
|
+
return inheritedStackId ? /* @__PURE__ */ jsx32(DrawerInner, { ref, ...drawerProps, stackId: inheritedStackId }) : drawerProps.stackId ? /* @__PURE__ */ jsx32(DrawerInner, { ref, ...drawerProps }) : /* @__PURE__ */ jsxs18(DrawerProvider, { children: [
|
|
9351
|
+
/* @__PURE__ */ jsx32(DrawerInner, { ref, ...drawerProps }),
|
|
9352
|
+
/* @__PURE__ */ jsx32(DrawerRenderer, { stackId: defaultSackId, ...drawerRendererProps })
|
|
9353
|
+
] });
|
|
9354
|
+
}
|
|
9355
|
+
);
|
|
9356
|
+
var DrawerInner = ({
|
|
9357
|
+
ref,
|
|
9358
|
+
stackId = defaultSackId,
|
|
9359
|
+
id,
|
|
9360
|
+
bgColor,
|
|
9361
|
+
children,
|
|
9362
|
+
header,
|
|
9363
|
+
instanceKey,
|
|
9364
|
+
onRequestClose
|
|
9365
|
+
}) => {
|
|
9366
|
+
const { registerDrawer, unregisterDrawer } = useDrawer();
|
|
9367
|
+
const closeButtonRef = useRef2(null);
|
|
9368
|
+
const component = useMemo(() => {
|
|
9369
|
+
const headerId = `dialog-header-${stackId}-${id}`;
|
|
9370
|
+
return /* @__PURE__ */ jsxs18(
|
|
9371
|
+
"div",
|
|
9372
|
+
{
|
|
9373
|
+
ref,
|
|
9374
|
+
id,
|
|
9375
|
+
role: "dialog",
|
|
9376
|
+
tabIndex: -1,
|
|
9377
|
+
"aria-labelledby": headerId,
|
|
9378
|
+
css: drawerStyles(bgColor),
|
|
9379
|
+
"data-test-id": "side-dialog",
|
|
9380
|
+
children: [
|
|
9381
|
+
/* @__PURE__ */ jsx32(
|
|
9382
|
+
Button,
|
|
9383
|
+
{
|
|
9384
|
+
ref: closeButtonRef,
|
|
9385
|
+
type: "button",
|
|
9386
|
+
onClick: onRequestClose,
|
|
9387
|
+
css: drawerCloseButtonStyles,
|
|
9388
|
+
title: "Close dialog",
|
|
9389
|
+
buttonType: "ghost",
|
|
9390
|
+
children: /* @__PURE__ */ jsx32(Icon, { icon: CgChevronRight, iconColor: "gray", size: "1.5rem" })
|
|
9391
|
+
}
|
|
9392
|
+
),
|
|
9393
|
+
header ? /* @__PURE__ */ jsx32("div", { id: headerId, css: drawerHeaderStyles, children: header }) : null,
|
|
9394
|
+
/* @__PURE__ */ jsx32("div", { css: drawerInnerStyles, children })
|
|
9395
|
+
]
|
|
9396
|
+
}
|
|
9397
|
+
);
|
|
9398
|
+
}, [children, header, id, stackId, bgColor, onRequestClose, ref]);
|
|
9399
|
+
useEffect5(() => {
|
|
9400
|
+
registerDrawer({
|
|
9401
|
+
drawer: {
|
|
9402
|
+
id,
|
|
9403
|
+
component,
|
|
9404
|
+
stackId,
|
|
9405
|
+
onRequestClose,
|
|
9406
|
+
instanceKey
|
|
9407
|
+
},
|
|
9408
|
+
onFirstRender: () => {
|
|
9409
|
+
setTimeout(() => {
|
|
9410
|
+
var _a;
|
|
9411
|
+
(_a = closeButtonRef.current) == null ? void 0 : _a.focus({ preventScroll: true });
|
|
9412
|
+
}, 0);
|
|
9413
|
+
}
|
|
9414
|
+
});
|
|
9415
|
+
}, [component, instanceKey, registerDrawer]);
|
|
9416
|
+
useEffect5(() => {
|
|
9417
|
+
return () => unregisterDrawer({ id, stackId, instanceKey });
|
|
9418
|
+
}, [id, stackId, instanceKey, unregisterDrawer]);
|
|
9419
|
+
return null;
|
|
9420
|
+
};
|
|
9421
|
+
|
|
9396
9422
|
// src/components/Input/styles/CaptionText.styles.ts
|
|
9397
9423
|
import { css as css28 } from "@emotion/react";
|
|
9398
9424
|
var CaptionText = (dynamicSize) => css28`
|
|
@@ -9526,7 +9552,7 @@ var ErrorMessage = ({ message, testId, ...otherProps }) => {
|
|
|
9526
9552
|
};
|
|
9527
9553
|
|
|
9528
9554
|
// src/components/Input/Fieldset.tsx
|
|
9529
|
-
import * as
|
|
9555
|
+
import * as React12 from "react";
|
|
9530
9556
|
|
|
9531
9557
|
// src/components/Input/styles/Fieldset.styles.ts
|
|
9532
9558
|
import { css as css31 } from "@emotion/react";
|
|
@@ -9570,7 +9596,7 @@ var fieldsetBody = css31`
|
|
|
9570
9596
|
|
|
9571
9597
|
// src/components/Input/Fieldset.tsx
|
|
9572
9598
|
import { jsx as jsx36, jsxs as jsxs21 } from "@emotion/react/jsx-runtime";
|
|
9573
|
-
var Fieldset =
|
|
9599
|
+
var Fieldset = React12.forwardRef(
|
|
9574
9600
|
({ legend, disabled, children, invert, ...props }, ref) => {
|
|
9575
9601
|
return /* @__PURE__ */ jsxs21("fieldset", { css: fieldsetContainer(Boolean(invert)), ref, disabled, ...props, children: [
|
|
9576
9602
|
legend,
|
|
@@ -9580,7 +9606,7 @@ var Fieldset = React11.forwardRef(
|
|
|
9580
9606
|
);
|
|
9581
9607
|
|
|
9582
9608
|
// src/components/Input/Input.tsx
|
|
9583
|
-
import * as
|
|
9609
|
+
import * as React13 from "react";
|
|
9584
9610
|
|
|
9585
9611
|
// src/components/Input/Label.tsx
|
|
9586
9612
|
import { jsx as jsx37 } from "@emotion/react/jsx-runtime";
|
|
@@ -9623,7 +9649,7 @@ var WarningMessage = ({ message, testId, ...props }) => {
|
|
|
9623
9649
|
|
|
9624
9650
|
// src/components/Input/Input.tsx
|
|
9625
9651
|
import { jsx as jsx39, jsxs as jsxs23 } from "@emotion/react/jsx-runtime";
|
|
9626
|
-
var Input =
|
|
9652
|
+
var Input = React13.forwardRef(
|
|
9627
9653
|
({
|
|
9628
9654
|
label,
|
|
9629
9655
|
icon,
|
|
@@ -11112,7 +11138,7 @@ var IntegrationModalHeader = ({ icon, name, menu: menu2, children }) => {
|
|
|
11112
11138
|
};
|
|
11113
11139
|
|
|
11114
11140
|
// src/components/Tooltip/Tooltip.tsx
|
|
11115
|
-
import
|
|
11141
|
+
import React14 from "react";
|
|
11116
11142
|
import {
|
|
11117
11143
|
Tooltip as ReakitTooltip,
|
|
11118
11144
|
TooltipArrow,
|
|
@@ -11141,7 +11167,7 @@ import { Fragment as Fragment9, jsx as jsx64, jsxs as jsxs44 } from "@emotion/re
|
|
|
11141
11167
|
function Tooltip({ children, title, placement = "bottom", visible, ...props }) {
|
|
11142
11168
|
const tooltip = useTooltipState({ placement });
|
|
11143
11169
|
return /* @__PURE__ */ jsxs44(Fragment9, { children: [
|
|
11144
|
-
/* @__PURE__ */ jsx64(TooltipReference, { ...tooltip, ...children.props, children: (referenceProps) =>
|
|
11170
|
+
/* @__PURE__ */ jsx64(TooltipReference, { ...tooltip, ...children.props, children: (referenceProps) => React14.cloneElement(children, referenceProps) }),
|
|
11145
11171
|
/* @__PURE__ */ jsxs44(ReakitTooltip, { ...tooltip, ...props, css: TooltipContainer, visible: visible != null ? visible : tooltip.visible, children: [
|
|
11146
11172
|
/* @__PURE__ */ jsx64(TooltipArrow, { ...tooltip, css: TooltipArrowStyles }),
|
|
11147
11173
|
title
|
|
@@ -11193,8 +11219,8 @@ var ConnectToDataElementButton = ({
|
|
|
11193
11219
|
};
|
|
11194
11220
|
|
|
11195
11221
|
// src/components/ParameterInputs/hooks/ParameterShellContext.tsx
|
|
11196
|
-
import { createContext as
|
|
11197
|
-
var ParameterShellContext =
|
|
11222
|
+
import { createContext as createContext5, useContext as useContext6 } from "react";
|
|
11223
|
+
var ParameterShellContext = createContext5({
|
|
11198
11224
|
id: "",
|
|
11199
11225
|
label: "",
|
|
11200
11226
|
hiddenLabel: void 0,
|
|
@@ -11203,7 +11229,7 @@ var ParameterShellContext = createContext4({
|
|
|
11203
11229
|
}
|
|
11204
11230
|
});
|
|
11205
11231
|
var useParameterShell = () => {
|
|
11206
|
-
const { id, label, hiddenLabel, errorMessage, onManuallySetErrorMessage } =
|
|
11232
|
+
const { id, label, hiddenLabel, errorMessage, onManuallySetErrorMessage } = useContext6(ParameterShellContext);
|
|
11207
11233
|
return {
|
|
11208
11234
|
id,
|
|
11209
11235
|
label,
|
|
@@ -12169,7 +12195,7 @@ var Skeleton = ({
|
|
|
12169
12195
|
);
|
|
12170
12196
|
|
|
12171
12197
|
// src/components/Switch/Switch.tsx
|
|
12172
|
-
import * as
|
|
12198
|
+
import * as React15 from "react";
|
|
12173
12199
|
|
|
12174
12200
|
// src/components/Switch/Switch.styles.ts
|
|
12175
12201
|
import { css as css58 } from "@emotion/react";
|
|
@@ -12258,7 +12284,7 @@ var SwitchText = css58`
|
|
|
12258
12284
|
|
|
12259
12285
|
// src/components/Switch/Switch.tsx
|
|
12260
12286
|
import { Fragment as Fragment13, jsx as jsx81, jsxs as jsxs56 } from "@emotion/react/jsx-runtime";
|
|
12261
|
-
var Switch =
|
|
12287
|
+
var Switch = React15.forwardRef(
|
|
12262
12288
|
({ label, infoText, toggleText, children, ...inputProps }, ref) => {
|
|
12263
12289
|
let additionalText = infoText;
|
|
12264
12290
|
if (infoText && toggleText) {
|
|
@@ -12276,7 +12302,7 @@ var Switch = React14.forwardRef(
|
|
|
12276
12302
|
);
|
|
12277
12303
|
|
|
12278
12304
|
// src/components/Table/Table.tsx
|
|
12279
|
-
import * as
|
|
12305
|
+
import * as React16 from "react";
|
|
12280
12306
|
|
|
12281
12307
|
// src/components/Table/Table.styles.ts
|
|
12282
12308
|
import { css as css59 } from "@emotion/react";
|
|
@@ -12306,42 +12332,42 @@ var tableCellData = css59`
|
|
|
12306
12332
|
|
|
12307
12333
|
// src/components/Table/Table.tsx
|
|
12308
12334
|
import { jsx as jsx82 } from "@emotion/react/jsx-runtime";
|
|
12309
|
-
var Table =
|
|
12335
|
+
var Table = React16.forwardRef(({ children, ...otherProps }, ref) => {
|
|
12310
12336
|
return /* @__PURE__ */ jsx82("table", { ref, css: table, ...otherProps, children });
|
|
12311
12337
|
});
|
|
12312
|
-
var TableHead =
|
|
12338
|
+
var TableHead = React16.forwardRef(
|
|
12313
12339
|
({ children, ...otherProps }, ref) => {
|
|
12314
12340
|
return /* @__PURE__ */ jsx82("thead", { ref, css: tableHead, ...otherProps, children });
|
|
12315
12341
|
}
|
|
12316
12342
|
);
|
|
12317
|
-
var TableBody =
|
|
12343
|
+
var TableBody = React16.forwardRef(
|
|
12318
12344
|
({ children, ...otherProps }, ref) => {
|
|
12319
12345
|
return /* @__PURE__ */ jsx82("tbody", { ref, ...otherProps, children });
|
|
12320
12346
|
}
|
|
12321
12347
|
);
|
|
12322
|
-
var TableFoot =
|
|
12348
|
+
var TableFoot = React16.forwardRef(
|
|
12323
12349
|
({ children, ...otherProps }, ref) => {
|
|
12324
12350
|
return /* @__PURE__ */ jsx82("tfoot", { ref, ...otherProps, children });
|
|
12325
12351
|
}
|
|
12326
12352
|
);
|
|
12327
|
-
var TableRow =
|
|
12353
|
+
var TableRow = React16.forwardRef(
|
|
12328
12354
|
({ children, ...otherProps }, ref) => {
|
|
12329
12355
|
return /* @__PURE__ */ jsx82("tr", { ref, css: tableRow, ...otherProps, children });
|
|
12330
12356
|
}
|
|
12331
12357
|
);
|
|
12332
|
-
var TableCellHead =
|
|
12358
|
+
var TableCellHead = React16.forwardRef(
|
|
12333
12359
|
({ children, ...otherProps }, ref) => {
|
|
12334
12360
|
return /* @__PURE__ */ jsx82("th", { ref, css: tableCellHead, ...otherProps, children });
|
|
12335
12361
|
}
|
|
12336
12362
|
);
|
|
12337
|
-
var TableCellData =
|
|
12363
|
+
var TableCellData = React16.forwardRef(
|
|
12338
12364
|
({ children, ...otherProps }, ref) => {
|
|
12339
12365
|
return /* @__PURE__ */ jsx82("td", { ref, css: tableCellData, ...otherProps, children });
|
|
12340
12366
|
}
|
|
12341
12367
|
);
|
|
12342
12368
|
|
|
12343
12369
|
// src/components/Tabs/Tabs.tsx
|
|
12344
|
-
import { createContext as
|
|
12370
|
+
import { createContext as createContext6, useContext as useContext7, useEffect as useEffect7, useMemo as useMemo2 } from "react";
|
|
12345
12371
|
import {
|
|
12346
12372
|
Tab as ReakitTab,
|
|
12347
12373
|
TabList as ReakitTabList,
|
|
@@ -12376,9 +12402,9 @@ var tabButtonGroupStyles = css60`
|
|
|
12376
12402
|
|
|
12377
12403
|
// src/components/Tabs/Tabs.tsx
|
|
12378
12404
|
import { jsx as jsx83 } from "@emotion/react/jsx-runtime";
|
|
12379
|
-
var CurrentTabContext =
|
|
12405
|
+
var CurrentTabContext = createContext6(null);
|
|
12380
12406
|
var useCurrentTab = () => {
|
|
12381
|
-
const context =
|
|
12407
|
+
const context = useContext7(CurrentTabContext);
|
|
12382
12408
|
if (!context) {
|
|
12383
12409
|
throw new Error("This component can only be used inside <Tabs>");
|
|
12384
12410
|
}
|
|
@@ -12638,6 +12664,7 @@ export {
|
|
|
12638
12664
|
skeletonLoading,
|
|
12639
12665
|
supports,
|
|
12640
12666
|
useBreakpoint,
|
|
12667
|
+
useCurrentDrawerRenderer,
|
|
12641
12668
|
useCurrentTab,
|
|
12642
12669
|
useDrawer,
|
|
12643
12670
|
useIconContext,
|
package/dist/index.d.ts
CHANGED
|
@@ -409,8 +409,12 @@ interface DrawerItem {
|
|
|
409
409
|
id: string;
|
|
410
410
|
/** The ReactNode to render inside the drawer */
|
|
411
411
|
component: React__default.ReactNode;
|
|
412
|
-
/**
|
|
413
|
-
|
|
412
|
+
/**
|
|
413
|
+
* The ID of the stack where the drawer should be renderer. It should match the stack ID of an existing DrawerRenderer.
|
|
414
|
+
* If not provided, it will fall back to the default renderer of the drawer.
|
|
415
|
+
* If the drawer is rendered inside another one, this value gets inherited.
|
|
416
|
+
* */
|
|
417
|
+
stackId?: string;
|
|
414
418
|
/** Just like React.Key, changing this value indicates that the drawer has changed and we need to close the current instance and open a new one */
|
|
415
419
|
instanceKey?: string;
|
|
416
420
|
/** Called when the close button is clicked, the Escape button is pressed, or when the drawer's overlay is clicked */
|
|
@@ -442,7 +446,7 @@ interface DrawerProps extends Omit<DrawerItem, 'component'> {
|
|
|
442
446
|
* A drawer component that opens from the right side of is parent. The component is used in combination with DrawerProvider and DrawerRenderer
|
|
443
447
|
* @example <DrawerProvider><Drawer id="my-drawer" stackId="my-stack" header="Title">Hello</Drawer><DrawerRenderer stackId="my-stack"/></DrawerProvider>
|
|
444
448
|
*/
|
|
445
|
-
declare const Drawer: React__default.ForwardRefExoticComponent<DrawerProps & React__default.RefAttributes<HTMLDivElement>>;
|
|
449
|
+
declare const Drawer: React__default.ForwardRefExoticComponent<DrawerProps & Omit<DrawerRendererProps, "stackId"> & React__default.RefAttributes<HTMLDivElement>>;
|
|
446
450
|
|
|
447
451
|
interface DrawerRendererProps extends Omit<React__default.HTMLAttributes<HTMLDivElement>, 'children'> {
|
|
448
452
|
/** The ID of the stack to render. Some drawers need to use the same stack ID to be rendered here */
|
|
@@ -453,7 +457,6 @@ interface DrawerRendererProps extends Omit<React__default.HTMLAttributes<HTMLDiv
|
|
|
453
457
|
width?: string;
|
|
454
458
|
/** The minimum width of the drawers. In any CSS length unit (px, rem, %, et al)
|
|
455
459
|
* @default '0'
|
|
456
|
-
|
|
457
460
|
*/
|
|
458
461
|
minWidth?: string;
|
|
459
462
|
/** The maximum width of the drawers. In any CSS length unit (px, rem, %, et al)
|
|
@@ -465,6 +468,9 @@ interface DrawerRendererProps extends Omit<React__default.HTMLAttributes<HTMLDiv
|
|
|
465
468
|
*/
|
|
466
469
|
position?: 'absolute' | 'fixed';
|
|
467
470
|
}
|
|
471
|
+
declare const useCurrentDrawerRenderer: () => {
|
|
472
|
+
stackId?: string | undefined;
|
|
473
|
+
};
|
|
468
474
|
declare const DrawerRenderer: ({ stackId, position, width, minWidth, maxWidth, ...otherProps }: DrawerRendererProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element | null;
|
|
469
475
|
interface DrawerRendererItemProps extends React__default.HTMLAttributes<HTMLDivElement> {
|
|
470
476
|
index: number;
|
|
@@ -1672,7 +1678,7 @@ type PageHeaderSectionProps = React$1.HTMLAttributes<HTMLElement> & {
|
|
|
1672
1678
|
linkProps?: RouteProps;
|
|
1673
1679
|
linkText?: string;
|
|
1674
1680
|
level?: LevelProps;
|
|
1675
|
-
linkManagerComponent
|
|
1681
|
+
linkManagerComponent?: LinkManagerWithRefType;
|
|
1676
1682
|
};
|
|
1677
1683
|
declare const PageHeaderSection: ({ title, desc, children, linkText, level, linkProps, linkManagerComponent, ...htmlProps }: PageHeaderSectionProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
|
|
1678
1684
|
|
|
@@ -1698,4 +1704,4 @@ type StatusBulletProps = React$1.HTMLAttributes<HTMLSpanElement> & {
|
|
|
1698
1704
|
};
|
|
1699
1705
|
declare const StatusBullet: ({ status, hideText, message, ...props }: StatusBulletProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
|
|
1700
1706
|
|
|
1701
|
-
export { ActionButtonsProps, AddButton, AddButtonProps, AddListButton, AddListButtonProps, AddListButtonThemeProps, AnimationFile, AnimationFileProps, ArrowPositionProps, Badge, BadgeProps, BoxHeightProps, BreakpointSize, BreakpointsMap, Button, ButtonProps, ButtonSizeProps, ButtonThemeProps$1 as ButtonThemeProps, ButtonWithMenu, ButtonWithMenuProps, Callout, CalloutProps, CalloutType, Caption, CaptionProps, Card, CardContainer, CardContainerBgColorProps, CardContainerProps, CardProps, CheckboxWithInfo, CheckboxWithInforProps, ChildFunction, ComboBoxGroupBase, ConnectToDataElementButton, ConnectToDataElementButtonProps, Counter, CounterProps, CreateTeamIntegrationTile, CreateTeamIntegrationTileProps, DashedBox, DashedBoxProps, Details, DetailsProps, Drawer, DrawerContextValue, DrawerItem, DrawerProps, DrawerProvider, DrawerRenderer, DrawerRendererItemProps, DrawerRendererProps, EditTeamIntegrationTile, EditTeamIntegrationTileProps, ErrorMessage, ErrorMessageProps, Fieldset, FieldsetProps, Heading, HeadingProps, HexModalBackground, Icon, IconColor, IconName, IconProps, IconType, IconsProvider, InlineAlert, InlineAlertProps, Input, InputComboBox, InputComboBoxOption, InputComboBoxProps, InputInlineSelect, InputInlineSelectOption, InputInlineSelectProps, InputKeywordSearch, InputKeywordSearchProps, InputProps, InputSelect, InputSelectProps, InputToggle, InputToggleProps, IntegrationComingSoon, IntegrationComingSoonProps, IntegrationHeaderSection, IntegrationHeaderSectionProps, IntegrationLoadingTile, IntegrationLoadingTileProps, IntegrationModalHeader, IntegrationModalHeaderProps, IntegrationModalIcon, IntegrationModalIconProps, IntegrationTile, IntegrationTileProps, Label, LabelProps, Legend, LegendProps, LevelProps, LimitsBar, LimitsBarProps, Link, LinkColorProps, LinkList, LinkListProps, LinkManagerWithRefType, LinkProps, LinkWithRef, LoadingIcon, LoadingIconProps, LoadingIndicator, LoadingOverlay, LoadingOverlayProps, LottieFile, LottieFileKeyProps, LottieFileProps, Menu, MenuContext, MenuItem, MenuItemProps, MenuItemSeparator, MenuItemTextThemeProps, MenuProps, PageHeaderSection, PageHeaderSectionProps, Paragraph, ParagraphProps, ParameterDataConnectButtonProps, ParameterDataResource, ParameterDrawerHeader, ParameterDrawerHeaderProps, ParameterGroup, ParameterGroupProps, ParameterImage, ParameterImageInner, ParameterImageProps, ParameterInput, ParameterInputInner, ParameterInputProps, ParameterLabel, ParameterLabelProps, ParameterLink, ParameterLinkInner, ParameterLinkProps, ParameterMenuButton, ParameterMenuButtonProps, ParameterNameAndPublicIdInput, ParameterNameAndPublicIdInputProps, ParameterOverrideMarker, ParameterRichText, ParameterRichTextInner, ParameterRichTextProps, ParameterSelect, ParameterSelectInner, ParameterSelectProps, ParameterShell, ParameterShellContext, ParameterShellPlaceholder, ParameterShellProps, ParameterTextarea, ParameterTextareaInner, ParameterTextareaProps, ParameterToggle, ParameterToggleInner, ParameterToggleProps, RegisterDrawerProps, ResolveIcon, ResolveIconProps, ScrollableItemProps, ScrollableList, ScrollableListInputItem, ScrollableListItem, ScrollableListItemProps, ScrollableListProps, ShortcutContext, ShortcutRevealer, Skeleton, SkeletonProps, StatusBullet, StatusBulletProps, StatusTypeProps, Switch, SwitchProps, TabButton, TabButtonGroup, TabButtonProps, TabContent, TabContentProps, Table, TableBody, TableBodyProps, TableCellData, TableCellDataProps, TableCellHead, TableCellHeadProps, TableFoot, TableFootProps, TableHead, TableHeadProps, TableProps, TableRow, TableRowProps, Tabs, TabsProps, TextAlignProps, Textarea, TextareaProps, Theme, ThemeProps, TileContainer, TileContainerProps, Tooltip, TooltipProps, UniformBadge, UniformLogo, UniformLogoProps, UseShortcutOptions, WarningMessage, WarningMessageProps, breakpoints, button, buttonGhost, buttonGhostDestructive, buttonPrimary, buttonRippleEffect, buttonSecondary, buttonSecondaryInvert, buttonTertiary, buttonUnimportant, extractParameterProps, fadeIn, fadeInBottom, fadeInLtr, fadeInRtl, fadeInTop, fadeOutBottom, growSubtle, input, inputError, inputSelect, isMacLike, labelText, macifyShortcut, mq, ripple, scrollbarStyles, skeletonLoading, supports, useBreakpoint, useCurrentTab, useDrawer, useIconContext, useMenuContext, useOutsideClick, useParameterShell, useShortcut };
|
|
1707
|
+
export { ActionButtonsProps, AddButton, AddButtonProps, AddListButton, AddListButtonProps, AddListButtonThemeProps, AnimationFile, AnimationFileProps, ArrowPositionProps, Badge, BadgeProps, BoxHeightProps, BreakpointSize, BreakpointsMap, Button, ButtonProps, ButtonSizeProps, ButtonThemeProps$1 as ButtonThemeProps, ButtonWithMenu, ButtonWithMenuProps, Callout, CalloutProps, CalloutType, Caption, CaptionProps, Card, CardContainer, CardContainerBgColorProps, CardContainerProps, CardProps, CheckboxWithInfo, CheckboxWithInforProps, ChildFunction, ComboBoxGroupBase, ConnectToDataElementButton, ConnectToDataElementButtonProps, Counter, CounterProps, CreateTeamIntegrationTile, CreateTeamIntegrationTileProps, DashedBox, DashedBoxProps, Details, DetailsProps, Drawer, DrawerContextValue, DrawerItem, DrawerProps, DrawerProvider, DrawerRenderer, DrawerRendererItemProps, DrawerRendererProps, EditTeamIntegrationTile, EditTeamIntegrationTileProps, ErrorMessage, ErrorMessageProps, Fieldset, FieldsetProps, Heading, HeadingProps, HexModalBackground, Icon, IconColor, IconName, IconProps, IconType, IconsProvider, InlineAlert, InlineAlertProps, Input, InputComboBox, InputComboBoxOption, InputComboBoxProps, InputInlineSelect, InputInlineSelectOption, InputInlineSelectProps, InputKeywordSearch, InputKeywordSearchProps, InputProps, InputSelect, InputSelectProps, InputToggle, InputToggleProps, IntegrationComingSoon, IntegrationComingSoonProps, IntegrationHeaderSection, IntegrationHeaderSectionProps, IntegrationLoadingTile, IntegrationLoadingTileProps, IntegrationModalHeader, IntegrationModalHeaderProps, IntegrationModalIcon, IntegrationModalIconProps, IntegrationTile, IntegrationTileProps, Label, LabelProps, Legend, LegendProps, LevelProps, LimitsBar, LimitsBarProps, Link, LinkColorProps, LinkList, LinkListProps, LinkManagerWithRefType, LinkProps, LinkWithRef, LoadingIcon, LoadingIconProps, LoadingIndicator, LoadingOverlay, LoadingOverlayProps, LottieFile, LottieFileKeyProps, LottieFileProps, Menu, MenuContext, MenuItem, MenuItemProps, MenuItemSeparator, MenuItemTextThemeProps, MenuProps, PageHeaderSection, PageHeaderSectionProps, Paragraph, ParagraphProps, ParameterDataConnectButtonProps, ParameterDataResource, ParameterDrawerHeader, ParameterDrawerHeaderProps, ParameterGroup, ParameterGroupProps, ParameterImage, ParameterImageInner, ParameterImageProps, ParameterInput, ParameterInputInner, ParameterInputProps, ParameterLabel, ParameterLabelProps, ParameterLink, ParameterLinkInner, ParameterLinkProps, ParameterMenuButton, ParameterMenuButtonProps, ParameterNameAndPublicIdInput, ParameterNameAndPublicIdInputProps, ParameterOverrideMarker, ParameterRichText, ParameterRichTextInner, ParameterRichTextProps, ParameterSelect, ParameterSelectInner, ParameterSelectProps, ParameterShell, ParameterShellContext, ParameterShellPlaceholder, ParameterShellProps, ParameterTextarea, ParameterTextareaInner, ParameterTextareaProps, ParameterToggle, ParameterToggleInner, ParameterToggleProps, RegisterDrawerProps, ResolveIcon, ResolveIconProps, ScrollableItemProps, ScrollableList, ScrollableListInputItem, ScrollableListItem, ScrollableListItemProps, ScrollableListProps, ShortcutContext, ShortcutRevealer, Skeleton, SkeletonProps, StatusBullet, StatusBulletProps, StatusTypeProps, Switch, SwitchProps, TabButton, TabButtonGroup, TabButtonProps, TabContent, TabContentProps, Table, TableBody, TableBodyProps, TableCellData, TableCellDataProps, TableCellHead, TableCellHeadProps, TableFoot, TableFootProps, TableHead, TableHeadProps, TableProps, TableRow, TableRowProps, Tabs, TabsProps, TextAlignProps, Textarea, TextareaProps, Theme, ThemeProps, TileContainer, TileContainerProps, Tooltip, TooltipProps, UniformBadge, UniformLogo, UniformLogoProps, UseShortcutOptions, WarningMessage, WarningMessageProps, breakpoints, button, buttonGhost, buttonGhostDestructive, buttonPrimary, buttonRippleEffect, buttonSecondary, buttonSecondaryInvert, buttonTertiary, buttonUnimportant, extractParameterProps, fadeIn, fadeInBottom, fadeInLtr, fadeInRtl, fadeInTop, fadeOutBottom, growSubtle, input, inputError, inputSelect, isMacLike, labelText, macifyShortcut, mq, ripple, scrollbarStyles, skeletonLoading, supports, useBreakpoint, useCurrentDrawerRenderer, useCurrentTab, useDrawer, useIconContext, useMenuContext, useOutsideClick, useParameterShell, useShortcut };
|