@lumx/react 3.7.6-alpha.9 → 3.7.6-test.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/index.d.ts +1 -65
- package/index.js +551 -1293
- package/index.js.map +1 -1
- package/package.json +3 -3
- package/src/components/heading/Heading.test.tsx +3 -1
- package/src/components/heading/Heading.tsx +3 -2
- package/src/components/image-block/ImageBlock.stories.tsx +74 -63
- package/src/components/image-block/ImageBlock.tsx +1 -0
- package/src/components/image-block/ImageCaption.tsx +6 -6
- package/src/components/thumbnail/Thumbnail.stories.tsx +0 -29
- package/src/components/thumbnail/Thumbnail.tsx +0 -16
- package/src/components/thumbnail/useFocusPointStyle.tsx +4 -3
- package/src/hooks/useOnResize.ts +41 -0
- package/src/index.ts +0 -1
- package/src/utils/type.ts +0 -15
- package/src/components/image-lightbox/ImageLightbox.stories.tsx +0 -165
- package/src/components/image-lightbox/ImageLightbox.test.tsx +0 -252
- package/src/components/image-lightbox/ImageLightbox.tsx +0 -72
- package/src/components/image-lightbox/constants.ts +0 -11
- package/src/components/image-lightbox/index.ts +0 -2
- package/src/components/image-lightbox/internal/ImageSlide.tsx +0 -106
- package/src/components/image-lightbox/internal/ImageSlideshow.tsx +0 -173
- package/src/components/image-lightbox/internal/useAnimateScroll.ts +0 -55
- package/src/components/image-lightbox/internal/usePointerZoom.ts +0 -148
- package/src/components/image-lightbox/types.ts +0 -50
- package/src/components/image-lightbox/useImageLightbox.tsx +0 -130
- package/src/hooks/useElementSizeDependentOfWindowSize.ts +0 -32
- package/src/hooks/useImageSize.ts +0 -17
- package/src/stories/generated/ImageLightbox/Demos.stories.tsx +0 -6
- package/src/utils/findImage.tsx +0 -3
- package/src/utils/getPrefersReducedMotion.ts +0 -6
- package/src/utils/startViewTransition.ts +0 -54
- package/src/utils/unref.ts +0 -6
package/index.js
CHANGED
|
@@ -6,7 +6,7 @@ import noop from 'lodash/noop';
|
|
|
6
6
|
import get from 'lodash/get';
|
|
7
7
|
import isFunction from 'lodash/isFunction';
|
|
8
8
|
import last from 'lodash/last';
|
|
9
|
-
import
|
|
9
|
+
import { createPortal } from 'react-dom';
|
|
10
10
|
import pull from 'lodash/pull';
|
|
11
11
|
import concat from 'lodash/concat';
|
|
12
12
|
import dropRight from 'lodash/dropRight';
|
|
@@ -17,8 +17,6 @@ import memoize from 'lodash/memoize';
|
|
|
17
17
|
import castArray from 'lodash/castArray';
|
|
18
18
|
import pick from 'lodash/pick';
|
|
19
19
|
import isInteger from 'lodash/isInteger';
|
|
20
|
-
import isEqual from 'lodash/isEqual';
|
|
21
|
-
import throttle from 'lodash/throttle';
|
|
22
20
|
import take from 'lodash/take';
|
|
23
21
|
import uniqueId from 'lodash/uniqueId';
|
|
24
22
|
import isObject from 'lodash/isObject';
|
|
@@ -343,7 +341,7 @@ var classnames = createCommonjsModule(function (module) {
|
|
|
343
341
|
}());
|
|
344
342
|
});
|
|
345
343
|
|
|
346
|
-
const mdiAlert='M13 14h-2V9h2m0 9h-2v-2h2M1 21h22L12 2z';const mdiAlertCircle='M13 13h-2V7h2m0 10h-2v-2h2M12 2A10 10 0 0 0 2 12a10 10 0 0 0 10 10 10 10 0 0 0 10-10A10 10 0 0 0 12 2';const mdiArrowDown='M11 4h2v12l5.5-5.5 1.42 1.42L12 19.84l-7.92-7.92L5.5 10.5 11 16z';const mdiArrowUp='M13 20h-2V8l-5.5 5.5-1.42-1.42L12 4.16l7.92 7.92-1.42 1.42L13 8z';const mdiCheck='M21 7 9 19l-5.5-5.5 1.41-1.41L9 16.17 19.59 5.59z';const mdiCheckCircle='M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10 10-4.5 10-10S17.5 2 12 2m-2 15-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8z';const mdiChevronDown='M7.41 8.58 12 13.17l4.59-4.59L18 10l-6 6-6-6z';const mdiChevronLeft='M15.41 16.58 10.83 12l4.58-4.59L14 6l-6 6 6 6z';const mdiChevronRight='M8.59 16.58 13.17 12 8.59 7.41 10 6l6 6-6 6z';const mdiChevronUp='M7.41 15.41 12 10.83l4.59 4.58L18 14l-6-6-6 6z';const mdiClose='M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z';const mdiCloseCircle='M12 2a10 10 0 1 1 0 20 10 10 0 1 1 0-20m3.59 5L12 10.59 8.41 7 7 8.41 10.59 12 7 15.59 8.41 17 12 13.41 15.59 17 17 15.59 13.41 12 17 8.41z';const mdiDragVertical='M9 3h2v2H9zm4 0h2v2h-2zM9 7h2v2H9zm4 0h2v2h-2zm-4 4h2v2H9zm4 0h2v2h-2zm-4 4h2v2H9zm4 0h2v2h-2zm-4 4h2v2H9zm4 0h2v2h-2z';const mdiImageBroken='M19 3a2 2 0 0 1 2 2v6h-2v2h-2v2h-2v2h-2v2h-2v2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2zm2 12v4a2 2 0 0 1-2 2h-4v-2h2v-2h2v-2zm-2-6.5a.5.5 0 0 0-.5-.5h-13a.5.5 0 0 0-.5.5v7a.5.5 0 0 0 .5.5H11v-1h2v-2h2v-2h2V9h2z';const mdiInformation='M13 9h-2V7h2m0 10h-2v-6h2m-1-9A10 10 0 0 0 2 12a10 10 0 0 0 10 10 10 10 0 0 0 10-10A10 10 0 0 0 12 2';const
|
|
344
|
+
const mdiAlert='M13 14h-2V9h2m0 9h-2v-2h2M1 21h22L12 2z';const mdiAlertCircle='M13 13h-2V7h2m0 10h-2v-2h2M12 2A10 10 0 0 0 2 12a10 10 0 0 0 10 10 10 10 0 0 0 10-10A10 10 0 0 0 12 2';const mdiArrowDown='M11 4h2v12l5.5-5.5 1.42 1.42L12 19.84l-7.92-7.92L5.5 10.5 11 16z';const mdiArrowUp='M13 20h-2V8l-5.5 5.5-1.42-1.42L12 4.16l7.92 7.92-1.42 1.42L13 8z';const mdiCheck='M21 7 9 19l-5.5-5.5 1.41-1.41L9 16.17 19.59 5.59z';const mdiCheckCircle='M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10 10-4.5 10-10S17.5 2 12 2m-2 15-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8z';const mdiChevronDown='M7.41 8.58 12 13.17l4.59-4.59L18 10l-6 6-6-6z';const mdiChevronLeft='M15.41 16.58 10.83 12l4.58-4.59L14 6l-6 6 6 6z';const mdiChevronRight='M8.59 16.58 13.17 12 8.59 7.41 10 6l6 6-6 6z';const mdiChevronUp='M7.41 15.41 12 10.83l4.59 4.58L18 14l-6-6-6 6z';const mdiClose='M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z';const mdiCloseCircle='M12 2a10 10 0 1 1 0 20 10 10 0 1 1 0-20m3.59 5L12 10.59 8.41 7 7 8.41 10.59 12 7 15.59 8.41 17 12 13.41 15.59 17 17 15.59 13.41 12 17 8.41z';const mdiDragVertical='M9 3h2v2H9zm4 0h2v2h-2zM9 7h2v2H9zm4 0h2v2h-2zm-4 4h2v2H9zm4 0h2v2h-2zm-4 4h2v2H9zm4 0h2v2h-2zm-4 4h2v2H9zm4 0h2v2h-2z';const mdiImageBroken='M19 3a2 2 0 0 1 2 2v6h-2v2h-2v2h-2v2h-2v2h-2v2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2zm2 12v4a2 2 0 0 1-2 2h-4v-2h2v-2h2v-2zm-2-6.5a.5.5 0 0 0-.5-.5h-13a.5.5 0 0 0-.5.5v7a.5.5 0 0 0 .5.5H11v-1h2v-2h2v-2h2V9h2z';const mdiInformation='M13 9h-2V7h2m0 10h-2v-6h2m-1-9A10 10 0 0 0 2 12a10 10 0 0 0 10 10 10 10 0 0 0 10-10A10 10 0 0 0 12 2';const mdiMenuDown='m7 10 5 5 5-5z';const mdiPauseCircleOutline='M13 16V8h2v8zm-4 0V8h2v8zm3-14a10 10 0 0 1 10 10 10 10 0 0 1-10 10A10 10 0 0 1 2 12 10 10 0 0 1 12 2m0 2a8 8 0 0 0-8 8 8 8 0 0 0 8 8 8 8 0 0 0 8-8 8 8 0 0 0-8-8';const mdiPlayCircleOutline='M12 20a8.01 8.01 0 0 1 0-16 8.01 8.01 0 0 1 0 16m0-18A10 10 0 0 0 2 12a10 10 0 0 0 10 10 10 10 0 0 0 10-10A10 10 0 0 0 12 2m-2 14.5 6-4.5-6-4.5z';const mdiRadioboxBlank='M12 20a8 8 0 0 1-8-8 8 8 0 0 1 8-8 8 8 0 0 1 8 8 8 8 0 0 1-8 8m0-18A10 10 0 0 0 2 12a10 10 0 0 0 10 10 10 10 0 0 0 10-10A10 10 0 0 0 12 2';const mdiRadioboxMarked='M12 20a8 8 0 0 1-8-8 8 8 0 0 1 8-8 8 8 0 0 1 8 8 8 8 0 0 1-8 8m0-18A10 10 0 0 0 2 12a10 10 0 0 0 10 10 10 10 0 0 0 10-10A10 10 0 0 0 12 2m0 5a5 5 0 0 0-5 5 5 5 0 0 0 5 5 5 5 0 0 0 5-5 5 5 0 0 0-5-5';
|
|
347
345
|
|
|
348
346
|
var IDX=256, HEX=[], SIZE=256, BUFFER;
|
|
349
347
|
while (IDX--) HEX[IDX] = (IDX + 256).toString(16).substring(1);
|
|
@@ -1257,18 +1255,6 @@ const isComponentType = type => node => /*#__PURE__*/React.isValidElement(node)
|
|
|
1257
1255
|
* @example ComponentRef<Button> => React.Ref<HTMLButtonElement
|
|
1258
1256
|
*/
|
|
1259
1257
|
|
|
1260
|
-
/**
|
|
1261
|
-
* Rectangle size
|
|
1262
|
-
*/
|
|
1263
|
-
|
|
1264
|
-
/**
|
|
1265
|
-
* Maybe a HTMLElement or a React ref of a HTMLElement
|
|
1266
|
-
*/
|
|
1267
|
-
|
|
1268
|
-
/**
|
|
1269
|
-
* A point coordinate in 2D space
|
|
1270
|
-
*/
|
|
1271
|
-
|
|
1272
1258
|
const _excluded$6 = ["linkAs"];
|
|
1273
1259
|
/**
|
|
1274
1260
|
* Render link with default <a> HTML component or a custom one provided by `linkAs`.
|
|
@@ -7360,13 +7346,14 @@ const Heading = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
7360
7346
|
const {
|
|
7361
7347
|
headingElement
|
|
7362
7348
|
} = useHeadingLevel();
|
|
7349
|
+
const computedHeadingElement = as || headingElement;
|
|
7363
7350
|
return /*#__PURE__*/React.createElement(Text, _extends({
|
|
7364
7351
|
ref: ref,
|
|
7365
7352
|
className: classnames(className, handleBasicClasses({
|
|
7366
7353
|
prefix: CLASSNAME$p
|
|
7367
7354
|
})),
|
|
7368
|
-
as:
|
|
7369
|
-
typography: DEFAULT_TYPOGRAPHY_BY_LEVEL[
|
|
7355
|
+
as: computedHeadingElement,
|
|
7356
|
+
typography: DEFAULT_TYPOGRAPHY_BY_LEVEL[computedHeadingElement]
|
|
7370
7357
|
}, forwardedProps), children);
|
|
7371
7358
|
});
|
|
7372
7359
|
Heading.displayName = COMPONENT_NAME$s;
|
|
@@ -7672,7 +7659,7 @@ const ImageCaption = props => {
|
|
|
7672
7659
|
const titleColor = {
|
|
7673
7660
|
color: theme === 'dark' ? 'light' : 'dark'
|
|
7674
7661
|
};
|
|
7675
|
-
const
|
|
7662
|
+
const baseColor = {
|
|
7676
7663
|
color: theme === 'dark' ? 'light' : 'dark',
|
|
7677
7664
|
colorVariant: 'L2'
|
|
7678
7665
|
};
|
|
@@ -7691,16 +7678,16 @@ const ImageCaption = props => {
|
|
|
7691
7678
|
vAlign: align,
|
|
7692
7679
|
hAlign: align === 'center' ? align : undefined,
|
|
7693
7680
|
gap: "regular"
|
|
7694
|
-
}, (title || description) && /*#__PURE__*/React.createElement(Text, {
|
|
7681
|
+
}, (title || description) && /*#__PURE__*/React.createElement(Text, _extends({
|
|
7695
7682
|
as: "p",
|
|
7696
7683
|
truncate: truncate
|
|
7697
|
-
}, title && /*#__PURE__*/React.createElement(Text, _extends({
|
|
7684
|
+
}, baseColor), title && /*#__PURE__*/React.createElement(Text, _extends({
|
|
7698
7685
|
as: "span",
|
|
7699
7686
|
typography: "subtitle1"
|
|
7700
7687
|
}, titleColor), title), ' ', description && /*#__PURE__*/React.createElement(Text, _extends({
|
|
7701
7688
|
as: "span",
|
|
7702
7689
|
typography: "body1"
|
|
7703
|
-
},
|
|
7690
|
+
}, descriptionContent))), tags && /*#__PURE__*/React.createElement(FlexBox, {
|
|
7704
7691
|
orientation: "horizontal",
|
|
7705
7692
|
vAlign: align
|
|
7706
7693
|
}, tags));
|
|
@@ -7787,6 +7774,7 @@ const ImageBlock = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
7787
7774
|
theme: theme,
|
|
7788
7775
|
alt: alt || title
|
|
7789
7776
|
})), /*#__PURE__*/React.createElement(ImageCaption, {
|
|
7777
|
+
as: "figcaption",
|
|
7790
7778
|
className: `${CLASSNAME$u}__wrapper`,
|
|
7791
7779
|
theme: theme,
|
|
7792
7780
|
title: title,
|
|
@@ -7803,726 +7791,7 @@ ImageBlock.displayName = COMPONENT_NAME$x;
|
|
|
7803
7791
|
ImageBlock.className = CLASSNAME$u;
|
|
7804
7792
|
ImageBlock.defaultProps = DEFAULT_PROPS$q;
|
|
7805
7793
|
|
|
7806
|
-
|
|
7807
|
-
* Component display name.
|
|
7808
|
-
*/
|
|
7809
|
-
const COMPONENT_NAME$y = 'ImageLightbox';
|
|
7810
|
-
|
|
7811
|
-
/**
|
|
7812
|
-
* Component default class name and class prefix.
|
|
7813
|
-
*/
|
|
7814
|
-
const CLASSNAME$v = getRootClassName(COMPONENT_NAME$y);
|
|
7815
|
-
|
|
7816
|
-
/**
|
|
7817
|
-
* Observe element size (only works if it's size depends on the window size).
|
|
7818
|
-
*
|
|
7819
|
-
* (Not using ResizeObserver for better browser backward compat)
|
|
7820
|
-
*
|
|
7821
|
-
* @param elementRef Element to observe
|
|
7822
|
-
* @return the size and a manual update callback
|
|
7823
|
-
*/
|
|
7824
|
-
function useElementSizeDependentOfWindowSize(elementRef) {
|
|
7825
|
-
const [size, setSize] = React.useState(null);
|
|
7826
|
-
const updateSize = React.useMemo(() => throttle(() => {
|
|
7827
|
-
var _elementRef$current;
|
|
7828
|
-
const newSize = (_elementRef$current = elementRef.current) === null || _elementRef$current === void 0 ? void 0 : _elementRef$current.getBoundingClientRect();
|
|
7829
|
-
if (newSize) setSize(newSize);
|
|
7830
|
-
}, 10), [elementRef]);
|
|
7831
|
-
React.useEffect(() => {
|
|
7832
|
-
updateSize();
|
|
7833
|
-
window.addEventListener('resize', updateSize);
|
|
7834
|
-
return () => window.removeEventListener('resize', updateSize);
|
|
7835
|
-
}, [updateSize]);
|
|
7836
|
-
return [size, updateSize];
|
|
7837
|
-
}
|
|
7838
|
-
|
|
7839
|
-
/** Get natural image size after load. */
|
|
7840
|
-
function useImageSize(imgRef, getInitialSize) {
|
|
7841
|
-
const [imageSize, setImageSize] = React.useState(getInitialSize || null);
|
|
7842
|
-
React.useEffect(() => {
|
|
7843
|
-
const {
|
|
7844
|
-
current: img
|
|
7845
|
-
} = imgRef;
|
|
7846
|
-
if (!img) {
|
|
7847
|
-
return undefined;
|
|
7848
|
-
}
|
|
7849
|
-
const onLoad = () => setImageSize({
|
|
7850
|
-
width: img.naturalWidth,
|
|
7851
|
-
height: img.naturalHeight
|
|
7852
|
-
});
|
|
7853
|
-
img.addEventListener('load', onLoad);
|
|
7854
|
-
return () => img.removeEventListener('load', onLoad);
|
|
7855
|
-
}, [imgRef]);
|
|
7856
|
-
return imageSize;
|
|
7857
|
-
}
|
|
7858
|
-
|
|
7859
|
-
/** Check if user prefers reduced motion */
|
|
7860
|
-
function getPrefersReducedMotion() {
|
|
7861
|
-
var _WINDOW$matchMedia;
|
|
7862
|
-
return WINDOW === null || WINDOW === void 0 ? void 0 : (_WINDOW$matchMedia = WINDOW.matchMedia) === null || _WINDOW$matchMedia === void 0 ? void 0 : _WINDOW$matchMedia.call(WINDOW, '(prefers-reduced-motion: reduce)').matches;
|
|
7863
|
-
}
|
|
7864
|
-
|
|
7865
|
-
/**
|
|
7866
|
-
* Listen to mouse wheel + ctrl and multi-pointer pinch to zoom
|
|
7867
|
-
*/
|
|
7868
|
-
function usePointerZoom(scrollAreaRef, onScaleChange, animateScroll) {
|
|
7869
|
-
const [isPointerZooming, setPointerZooming] = React.useState(false);
|
|
7870
|
-
React.useEffect(() => {
|
|
7871
|
-
const scrollArea = scrollAreaRef.current;
|
|
7872
|
-
if (!scrollArea || !onScaleChange) {
|
|
7873
|
-
return undefined;
|
|
7874
|
-
}
|
|
7875
|
-
let animationFrame;
|
|
7876
|
-
let zoomStateTimeoutId;
|
|
7877
|
-
function updateScaleOnNextFrame(newScale, mousePosition) {
|
|
7878
|
-
// Cancel previously scheduled frame
|
|
7879
|
-
if (animationFrame) cancelAnimationFrame(animationFrame);
|
|
7880
|
-
|
|
7881
|
-
// Cancel previously scheduled zoom state change
|
|
7882
|
-
if (zoomStateTimeoutId) clearTimeout(zoomStateTimeoutId);
|
|
7883
|
-
function nextFrame() {
|
|
7884
|
-
setPointerZooming(true);
|
|
7885
|
-
onScaleChange === null || onScaleChange === void 0 ? void 0 : onScaleChange(newScale);
|
|
7886
|
-
animationFrame = null;
|
|
7887
|
-
// Wait a bit before indicating the pointer zooming is finished
|
|
7888
|
-
zoomStateTimeoutId = setTimeout(() => setPointerZooming(false), 100);
|
|
7889
|
-
}
|
|
7890
|
-
animationFrame = requestAnimationFrame(nextFrame);
|
|
7891
|
-
|
|
7892
|
-
// Animate scroll in parallel (centering on the current mouse position)
|
|
7893
|
-
animateScroll(mousePosition, {
|
|
7894
|
-
width: scrollArea.scrollWidth,
|
|
7895
|
-
height: scrollArea.scrollHeight
|
|
7896
|
-
});
|
|
7897
|
-
}
|
|
7898
|
-
function onWheel(event) {
|
|
7899
|
-
if (!event.ctrlKey) {
|
|
7900
|
-
return;
|
|
7901
|
-
}
|
|
7902
|
-
event.preventDefault();
|
|
7903
|
-
const newScale = Math.exp(-event.deltaY / 50);
|
|
7904
|
-
|
|
7905
|
-
// Update scale on next frame (focused on the mouse position)
|
|
7906
|
-
updateScaleOnNextFrame(newScale, {
|
|
7907
|
-
x: event.pageX,
|
|
7908
|
-
y: event.pageY
|
|
7909
|
-
});
|
|
7910
|
-
}
|
|
7911
|
-
const activePointers = {};
|
|
7912
|
-
let prevDistance = null;
|
|
7913
|
-
let previousCenterPoint = null;
|
|
7914
|
-
function onPointerDown(event) {
|
|
7915
|
-
activePointers[event.pointerId] = event;
|
|
7916
|
-
}
|
|
7917
|
-
function onPointerMove(event) {
|
|
7918
|
-
// Update pointer in cache
|
|
7919
|
-
if (activePointers[event.pointerId]) {
|
|
7920
|
-
activePointers[event.pointerId] = event;
|
|
7921
|
-
}
|
|
7922
|
-
const pointers = Object.values(activePointers);
|
|
7923
|
-
|
|
7924
|
-
// Make sure we run computation on one of the pointer in the group
|
|
7925
|
-
if (pointers[0].pointerId !== event.pointerId) {
|
|
7926
|
-
return;
|
|
7927
|
-
}
|
|
7928
|
-
|
|
7929
|
-
// Centered point between all pointers
|
|
7930
|
-
const centerPoint = {
|
|
7931
|
-
x: pointers.reduce((x, _ref) => {
|
|
7932
|
-
let {
|
|
7933
|
-
clientX
|
|
7934
|
-
} = _ref;
|
|
7935
|
-
return x + clientX;
|
|
7936
|
-
}, 0) / pointers.length,
|
|
7937
|
-
y: pointers.reduce((y, _ref2) => {
|
|
7938
|
-
let {
|
|
7939
|
-
clientY
|
|
7940
|
-
} = _ref2;
|
|
7941
|
-
return y + clientY;
|
|
7942
|
-
}, 0) / pointers.length
|
|
7943
|
-
};
|
|
7944
|
-
|
|
7945
|
-
// Movement of the center point
|
|
7946
|
-
const deltaCenterPoint = previousCenterPoint && {
|
|
7947
|
-
left: previousCenterPoint.x - centerPoint.x,
|
|
7948
|
-
top: previousCenterPoint.y - centerPoint.y
|
|
7949
|
-
};
|
|
7950
|
-
|
|
7951
|
-
// Pan X & Y
|
|
7952
|
-
if (deltaCenterPoint) {
|
|
7953
|
-
// Apply movement of the center point to the scroll
|
|
7954
|
-
scrollArea.scrollBy({
|
|
7955
|
-
top: deltaCenterPoint.top / 2,
|
|
7956
|
-
left: deltaCenterPoint.left / 2
|
|
7957
|
-
});
|
|
7958
|
-
}
|
|
7959
|
-
|
|
7960
|
-
// Pinch to zoom
|
|
7961
|
-
if (pointers.length === 2) {
|
|
7962
|
-
const [pointer1, pointer2] = pointers;
|
|
7963
|
-
const distance = Math.hypot(pointer2.clientX - pointer1.clientX, pointer2.clientY - pointer1.clientY);
|
|
7964
|
-
if (prevDistance && deltaCenterPoint) {
|
|
7965
|
-
const delta = prevDistance - distance;
|
|
7966
|
-
const absDelta = Math.abs(delta);
|
|
7967
|
-
|
|
7968
|
-
// Zoom only if we are "pinching" more than we are moving the pointers
|
|
7969
|
-
if (absDelta > Math.abs(deltaCenterPoint.left) && absDelta > Math.abs(deltaCenterPoint.top)) {
|
|
7970
|
-
// Update scale on next frame (focused on the center point between the two pointers)
|
|
7971
|
-
const newScale = Math.exp(-delta / 100);
|
|
7972
|
-
updateScaleOnNextFrame(newScale, centerPoint);
|
|
7973
|
-
}
|
|
7974
|
-
}
|
|
7975
|
-
prevDistance = distance;
|
|
7976
|
-
}
|
|
7977
|
-
previousCenterPoint = centerPoint;
|
|
7978
|
-
}
|
|
7979
|
-
function onPointerUp(event) {
|
|
7980
|
-
prevDistance = null;
|
|
7981
|
-
previousCenterPoint = null;
|
|
7982
|
-
delete activePointers[event.pointerId];
|
|
7983
|
-
}
|
|
7984
|
-
scrollArea.addEventListener('wheel', onWheel, {
|
|
7985
|
-
passive: false
|
|
7986
|
-
});
|
|
7987
|
-
const isMultiTouch = navigator.maxTouchPoints >= 2;
|
|
7988
|
-
if (isMultiTouch) {
|
|
7989
|
-
scrollArea.addEventListener('pointerdown', onPointerDown);
|
|
7990
|
-
scrollArea.addEventListener('pointermove', onPointerMove);
|
|
7991
|
-
scrollArea.addEventListener('pointerup', onPointerUp);
|
|
7992
|
-
}
|
|
7993
|
-
return () => {
|
|
7994
|
-
scrollArea.removeEventListener('wheel', onWheel);
|
|
7995
|
-
if (isMultiTouch) {
|
|
7996
|
-
scrollArea.removeEventListener('pointerdown', onPointerDown);
|
|
7997
|
-
scrollArea.removeEventListener('pointermove', onPointerMove);
|
|
7998
|
-
scrollArea.removeEventListener('pointerup', onPointerUp);
|
|
7999
|
-
}
|
|
8000
|
-
};
|
|
8001
|
-
}, [animateScroll, onScaleChange, scrollAreaRef]);
|
|
8002
|
-
return isPointerZooming;
|
|
8003
|
-
}
|
|
8004
|
-
|
|
8005
|
-
/** Maintains the scroll position centered relative to the original scroll area's dimensions when the content scales. */
|
|
8006
|
-
function useAnimateScroll(scrollAreaRef) {
|
|
8007
|
-
return React.useMemo(() => {
|
|
8008
|
-
let animationFrame = null;
|
|
8009
|
-
return function animate(centerPoint, initialScrollAreaSize) {
|
|
8010
|
-
const scrollArea = scrollAreaRef.current;
|
|
8011
|
-
if (!scrollArea) {
|
|
8012
|
-
return;
|
|
8013
|
-
}
|
|
8014
|
-
|
|
8015
|
-
// Cancel previously running animation
|
|
8016
|
-
if (animationFrame) cancelAnimationFrame(animationFrame);
|
|
8017
|
-
|
|
8018
|
-
// Center on the given point or else on the scroll area visual center
|
|
8019
|
-
const clientHeightRatio = centerPoint !== null && centerPoint !== void 0 && centerPoint.y ? centerPoint.y / scrollArea.clientHeight : 0.5;
|
|
8020
|
-
const clientWidthRatio = centerPoint !== null && centerPoint !== void 0 && centerPoint.x ? centerPoint.x / scrollArea.clientWidth : 0.5;
|
|
8021
|
-
const initialScrollHeight = (initialScrollAreaSize === null || initialScrollAreaSize === void 0 ? void 0 : initialScrollAreaSize.height) || scrollArea.scrollHeight;
|
|
8022
|
-
const initialScrollWidth = (initialScrollAreaSize === null || initialScrollAreaSize === void 0 ? void 0 : initialScrollAreaSize.width) || scrollArea.scrollWidth;
|
|
8023
|
-
const heightCenter = scrollArea.scrollTop + scrollArea.clientHeight * clientHeightRatio;
|
|
8024
|
-
const heightRatio = heightCenter / initialScrollHeight;
|
|
8025
|
-
const widthCenter = scrollArea.scrollLeft + scrollArea.clientWidth * clientWidthRatio;
|
|
8026
|
-
const widthRatio = widthCenter / initialScrollWidth;
|
|
8027
|
-
let prevScrollHeight = 0;
|
|
8028
|
-
let prevScrollWidth = 0;
|
|
8029
|
-
function nextFrame() {
|
|
8030
|
-
const {
|
|
8031
|
-
scrollHeight,
|
|
8032
|
-
scrollWidth,
|
|
8033
|
-
clientHeight,
|
|
8034
|
-
clientWidth
|
|
8035
|
-
} = scrollArea;
|
|
8036
|
-
|
|
8037
|
-
// Scroll area stopped expanding => stop animation
|
|
8038
|
-
if (scrollHeight === prevScrollHeight && scrollWidth === prevScrollWidth) {
|
|
8039
|
-
animationFrame = null;
|
|
8040
|
-
return;
|
|
8041
|
-
}
|
|
8042
|
-
|
|
8043
|
-
// Compute next scroll position
|
|
8044
|
-
const top = heightRatio * scrollHeight - clientHeight * clientHeightRatio;
|
|
8045
|
-
const left = widthRatio * scrollWidth - clientWidth * clientWidthRatio;
|
|
8046
|
-
scrollArea.scrollTo({
|
|
8047
|
-
top,
|
|
8048
|
-
left
|
|
8049
|
-
});
|
|
8050
|
-
prevScrollHeight = scrollHeight;
|
|
8051
|
-
prevScrollWidth = scrollWidth;
|
|
8052
|
-
animationFrame = requestAnimationFrame(nextFrame);
|
|
8053
|
-
}
|
|
8054
|
-
animationFrame = requestAnimationFrame(nextFrame);
|
|
8055
|
-
};
|
|
8056
|
-
}, [scrollAreaRef]);
|
|
8057
|
-
}
|
|
8058
|
-
|
|
8059
|
-
/** Internal image slide component for ImageLightbox */
|
|
8060
|
-
const ImageSlide = /*#__PURE__*/React.memo(props => {
|
|
8061
|
-
const {
|
|
8062
|
-
isActive,
|
|
8063
|
-
scale,
|
|
8064
|
-
onScaleChange,
|
|
8065
|
-
image: {
|
|
8066
|
-
image,
|
|
8067
|
-
imgRef: propImgRef,
|
|
8068
|
-
imgProps,
|
|
8069
|
-
alt
|
|
8070
|
-
}
|
|
8071
|
-
} = props;
|
|
8072
|
-
|
|
8073
|
-
// Get scroll area size
|
|
8074
|
-
const scrollAreaRef = React.useRef(null);
|
|
8075
|
-
const [scrollAreaSize, updateSize] = useElementSizeDependentOfWindowSize(scrollAreaRef);
|
|
8076
|
-
React.useEffect(() => {
|
|
8077
|
-
// Update size when active
|
|
8078
|
-
if (isActive) updateSize();
|
|
8079
|
-
}, [isActive, updateSize]);
|
|
8080
|
-
|
|
8081
|
-
// Get image size
|
|
8082
|
-
const imgRef = React.useRef(null);
|
|
8083
|
-
const imageSize = useImageSize(imgRef, () => {
|
|
8084
|
-
const initialWidth = Number.parseInt(imgProps === null || imgProps === void 0 ? void 0 : imgProps.width, 10);
|
|
8085
|
-
const initialHeight = Number.parseInt(imgProps === null || imgProps === void 0 ? void 0 : imgProps.height, 10);
|
|
8086
|
-
return initialWidth && initialHeight ? {
|
|
8087
|
-
width: initialWidth,
|
|
8088
|
-
height: initialHeight
|
|
8089
|
-
} : null;
|
|
8090
|
-
});
|
|
8091
|
-
|
|
8092
|
-
// Calculate new image size with scale
|
|
8093
|
-
const scaledImageSize = React.useMemo(() => {
|
|
8094
|
-
if (!scrollAreaSize || !imageSize) {
|
|
8095
|
-
return null;
|
|
8096
|
-
}
|
|
8097
|
-
const horizontalScale = scrollAreaSize.width / imageSize.width;
|
|
8098
|
-
const verticalScale = scrollAreaSize.height / imageSize.height;
|
|
8099
|
-
const baseScale = Math.min(1, Math.min(horizontalScale, verticalScale));
|
|
8100
|
-
return {
|
|
8101
|
-
width: imageSize.width * baseScale * (scale !== null && scale !== void 0 ? scale : 1),
|
|
8102
|
-
height: imageSize.height * baseScale * (scale !== null && scale !== void 0 ? scale : 1)
|
|
8103
|
-
};
|
|
8104
|
-
}, [scrollAreaSize, imageSize, scale]);
|
|
8105
|
-
|
|
8106
|
-
// Animate scroll to preserve the center of the current visible window in the scroll area
|
|
8107
|
-
const animateScroll = useAnimateScroll(scrollAreaRef);
|
|
8108
|
-
|
|
8109
|
-
// Zoom via mouse wheel or multi-touch pinch zoom
|
|
8110
|
-
const isPointerZooming = usePointerZoom(scrollAreaRef, onScaleChange, animateScroll);
|
|
8111
|
-
|
|
8112
|
-
// Animate scroll on scale change
|
|
8113
|
-
React.useLayoutEffect(() => {
|
|
8114
|
-
if (scale && !isPointerZooming) {
|
|
8115
|
-
animateScroll();
|
|
8116
|
-
}
|
|
8117
|
-
}, [isPointerZooming, scale, animateScroll]);
|
|
8118
|
-
const isScrollable = scaledImageSize && scrollAreaSize && (scaledImageSize.width > scrollAreaSize.width || scaledImageSize.height > scrollAreaSize.height);
|
|
8119
|
-
return /*#__PURE__*/React.createElement(SlideshowItem, {
|
|
8120
|
-
ref: scrollAreaRef
|
|
8121
|
-
// Make it accessible to keyboard nav when the zone is scrollable
|
|
8122
|
-
,
|
|
8123
|
-
tabIndex: isScrollable ? 0 : undefined,
|
|
8124
|
-
className: `${CLASSNAME$v}__image-slide`
|
|
8125
|
-
}, /*#__PURE__*/React.createElement(Thumbnail, {
|
|
8126
|
-
imgRef: mergeRefs(imgRef, propImgRef),
|
|
8127
|
-
image: image,
|
|
8128
|
-
alt: alt,
|
|
8129
|
-
className: `${CLASSNAME$v}__thumbnail`,
|
|
8130
|
-
imgProps: _objectSpread2(_objectSpread2({}, imgProps), {}, {
|
|
8131
|
-
style: _objectSpread2(_objectSpread2(_objectSpread2({}, imgProps === null || imgProps === void 0 ? void 0 : imgProps.style), scaledImageSize || {
|
|
8132
|
-
maxHeight: scrollAreaSize === null || scrollAreaSize === void 0 ? void 0 : scrollAreaSize.height,
|
|
8133
|
-
maxWidth: scrollAreaSize === null || scrollAreaSize === void 0 ? void 0 : scrollAreaSize.width
|
|
8134
|
-
}), {}, {
|
|
8135
|
-
// Only animate when scale is set, and we are not pointer zooming and the user does not prefer reduced motion
|
|
8136
|
-
transition: scale && !isPointerZooming && !getPrefersReducedMotion() ? 'all 250ms' : undefined
|
|
8137
|
-
})
|
|
8138
|
-
})
|
|
8139
|
-
}));
|
|
8140
|
-
}, isEqual);
|
|
8141
|
-
|
|
8142
|
-
const _excluded$z = ["image", "imgRef"];
|
|
8143
|
-
/** Internal image slideshow component for ImageLightbox */
|
|
8144
|
-
const ImageSlideshow = _ref => {
|
|
8145
|
-
var _images$activeIndex, _images$activeIndex2, _images$activeIndex3;
|
|
8146
|
-
let {
|
|
8147
|
-
activeImageIndex,
|
|
8148
|
-
images,
|
|
8149
|
-
slideGroupLabel,
|
|
8150
|
-
zoomInButtonProps,
|
|
8151
|
-
zoomOutButtonProps,
|
|
8152
|
-
slideshowControlsProps,
|
|
8153
|
-
currentPaginationItemRef,
|
|
8154
|
-
footerRef,
|
|
8155
|
-
activeImageRef
|
|
8156
|
-
} = _ref;
|
|
8157
|
-
const {
|
|
8158
|
-
activeIndex,
|
|
8159
|
-
slideshowId,
|
|
8160
|
-
setSlideshow,
|
|
8161
|
-
slideshowSlidesId,
|
|
8162
|
-
slidesCount,
|
|
8163
|
-
onNextClick,
|
|
8164
|
-
onPaginationClick,
|
|
8165
|
-
onPreviousClick,
|
|
8166
|
-
toggleAutoPlay
|
|
8167
|
-
} = SlideshowControls.useSlideshowControls({
|
|
8168
|
-
itemsCount: images.length,
|
|
8169
|
-
activeIndex: activeImageIndex
|
|
8170
|
-
});
|
|
8171
|
-
|
|
8172
|
-
// Image metadata (caption)
|
|
8173
|
-
const title = (_images$activeIndex = images[activeIndex]) === null || _images$activeIndex === void 0 ? void 0 : _images$activeIndex.title;
|
|
8174
|
-
const description = (_images$activeIndex2 = images[activeIndex]) === null || _images$activeIndex2 === void 0 ? void 0 : _images$activeIndex2.description;
|
|
8175
|
-
const tags = (_images$activeIndex3 = images[activeIndex]) === null || _images$activeIndex3 === void 0 ? void 0 : _images$activeIndex3.tags;
|
|
8176
|
-
const metadata = title || description || tags ? /*#__PURE__*/React.createElement(ImageCaption, {
|
|
8177
|
-
theme: "dark",
|
|
8178
|
-
as: "div",
|
|
8179
|
-
title: title,
|
|
8180
|
-
description: description,
|
|
8181
|
-
tags: tags,
|
|
8182
|
-
align: "center"
|
|
8183
|
-
}) : null;
|
|
8184
|
-
|
|
8185
|
-
// Slideshow controls
|
|
8186
|
-
const slideShowControls = slidesCount > 1 && slideshowControlsProps ? /*#__PURE__*/React.createElement(SlideshowControls, _extends({
|
|
8187
|
-
theme: "dark",
|
|
8188
|
-
activeIndex: activeIndex,
|
|
8189
|
-
slidesCount: slidesCount,
|
|
8190
|
-
onNextClick: onNextClick,
|
|
8191
|
-
onPreviousClick: onPreviousClick,
|
|
8192
|
-
onPaginationClick: onPaginationClick
|
|
8193
|
-
}, slideshowControlsProps, {
|
|
8194
|
-
paginationItemProps: index => {
|
|
8195
|
-
var _slideshowControlsPro;
|
|
8196
|
-
const props = (slideshowControlsProps === null || slideshowControlsProps === void 0 ? void 0 : (_slideshowControlsPro = slideshowControlsProps.paginationItemProps) === null || _slideshowControlsPro === void 0 ? void 0 : _slideshowControlsPro.call(slideshowControlsProps, index)) || {};
|
|
8197
|
-
return _objectSpread2(_objectSpread2({}, props), {}, {
|
|
8198
|
-
ref: mergeRefs(props === null || props === void 0 ? void 0 : props.ref,
|
|
8199
|
-
// Focus the active pagination item once on mount
|
|
8200
|
-
activeIndex === index ? currentPaginationItemRef : undefined)
|
|
8201
|
-
});
|
|
8202
|
-
}
|
|
8203
|
-
})) : null;
|
|
8204
|
-
|
|
8205
|
-
// Zoom controls
|
|
8206
|
-
const [scale, setScale] = React.useState(undefined);
|
|
8207
|
-
const zoomEnabled = zoomInButtonProps && zoomOutButtonProps;
|
|
8208
|
-
const onScaleChange = React.useMemo(() => {
|
|
8209
|
-
if (!zoomEnabled) return undefined;
|
|
8210
|
-
return newScale => {
|
|
8211
|
-
setScale(function () {
|
|
8212
|
-
let prevScale = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
|
|
8213
|
-
return Math.max(1, newScale * prevScale);
|
|
8214
|
-
});
|
|
8215
|
-
};
|
|
8216
|
-
}, [zoomEnabled]);
|
|
8217
|
-
const zoomIn = React.useCallback(() => onScaleChange === null || onScaleChange === void 0 ? void 0 : onScaleChange(1.5), [onScaleChange]);
|
|
8218
|
-
const zoomOut = React.useCallback(() => onScaleChange === null || onScaleChange === void 0 ? void 0 : onScaleChange(0.5), [onScaleChange]);
|
|
8219
|
-
React.useEffect(() => {
|
|
8220
|
-
// Reset scale on slide change
|
|
8221
|
-
if (activeIndex) setScale(undefined);
|
|
8222
|
-
}, [activeIndex]);
|
|
8223
|
-
const zoomControls = zoomEnabled && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IconButton, _extends({}, zoomInButtonProps, {
|
|
8224
|
-
theme: "dark",
|
|
8225
|
-
emphasis: "low",
|
|
8226
|
-
icon: mdiMagnifyPlusOutline,
|
|
8227
|
-
onClick: zoomIn
|
|
8228
|
-
})), /*#__PURE__*/React.createElement(IconButton, _extends({}, zoomOutButtonProps, {
|
|
8229
|
-
theme: "dark",
|
|
8230
|
-
emphasis: "low",
|
|
8231
|
-
isDisabled: !scale || scale <= 1,
|
|
8232
|
-
icon: mdiMagnifyMinusOutline,
|
|
8233
|
-
onClick: zoomOut
|
|
8234
|
-
})));
|
|
8235
|
-
const getImgRef = React.useMemo(() => memoize((index, isActive) => {
|
|
8236
|
-
return mergeRefs(images === null || images === void 0 ? void 0 : images[index].imgRef, isActive ? activeImageRef : undefined);
|
|
8237
|
-
},
|
|
8238
|
-
// memoize based on both arguments
|
|
8239
|
-
function () {
|
|
8240
|
-
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
8241
|
-
args[_key] = arguments[_key];
|
|
8242
|
-
}
|
|
8243
|
-
return args.join();
|
|
8244
|
-
}), [images, activeImageRef]);
|
|
8245
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Slides, {
|
|
8246
|
-
activeIndex: activeIndex,
|
|
8247
|
-
theme: "dark",
|
|
8248
|
-
slideGroupLabel: slideGroupLabel,
|
|
8249
|
-
fillHeight: true,
|
|
8250
|
-
id: slideshowId,
|
|
8251
|
-
ref: setSlideshow,
|
|
8252
|
-
slidesId: slideshowSlidesId,
|
|
8253
|
-
toggleAutoPlay: toggleAutoPlay
|
|
8254
|
-
}, images.map((_ref2, index) => {
|
|
8255
|
-
let {
|
|
8256
|
-
image,
|
|
8257
|
-
imgRef
|
|
8258
|
-
} = _ref2,
|
|
8259
|
-
imageProps = _objectWithoutProperties(_ref2, _excluded$z);
|
|
8260
|
-
const isActive = index === activeIndex;
|
|
8261
|
-
return /*#__PURE__*/React.createElement(ImageSlide, {
|
|
8262
|
-
isActive: isActive,
|
|
8263
|
-
key: image,
|
|
8264
|
-
image: _objectSpread2(_objectSpread2({}, imageProps), {}, {
|
|
8265
|
-
image,
|
|
8266
|
-
imgRef: getImgRef(index, isActive)
|
|
8267
|
-
}),
|
|
8268
|
-
scale: isActive ? scale : undefined,
|
|
8269
|
-
onScaleChange: onScaleChange
|
|
8270
|
-
});
|
|
8271
|
-
})), (metadata || slideShowControls || zoomControls) && /*#__PURE__*/React.createElement(FlexBox, {
|
|
8272
|
-
ref: footerRef,
|
|
8273
|
-
className: `${CLASSNAME$v}__footer`,
|
|
8274
|
-
orientation: "vertical",
|
|
8275
|
-
vAlign: "center",
|
|
8276
|
-
gap: "big"
|
|
8277
|
-
}, metadata, /*#__PURE__*/React.createElement(FlexBox, {
|
|
8278
|
-
className: `${CLASSNAME$v}__footer-actions`,
|
|
8279
|
-
orientation: "horizontal",
|
|
8280
|
-
gap: "regular"
|
|
8281
|
-
}, slideShowControls, zoomControls)));
|
|
8282
|
-
};
|
|
8283
|
-
|
|
8284
|
-
function unref(maybeElement) {
|
|
8285
|
-
if (maybeElement instanceof HTMLElement) return maybeElement;
|
|
8286
|
-
return maybeElement === null || maybeElement === void 0 ? void 0 : maybeElement.current;
|
|
8287
|
-
}
|
|
8288
|
-
|
|
8289
|
-
function setTransitionViewName(elementRef, name) {
|
|
8290
|
-
const element = unref(elementRef);
|
|
8291
|
-
if (element) element.style.viewTransitionName = name;
|
|
8292
|
-
}
|
|
8293
|
-
|
|
8294
|
-
/**
|
|
8295
|
-
* Wrapper around the `document.startViewTransition` handling browser incompatibilities, react DOM flush and
|
|
8296
|
-
* user preference.
|
|
8297
|
-
*
|
|
8298
|
-
* @param changes callback containing the changes to apply within the view transition.
|
|
8299
|
-
* @param setViewTransitionName set the `viewTransitionName` style on a `source` & `target` to morph these elements.
|
|
8300
|
-
*/
|
|
8301
|
-
async function startViewTransition(_ref) {
|
|
8302
|
-
var _document, _document$startViewTr;
|
|
8303
|
-
let {
|
|
8304
|
-
changes,
|
|
8305
|
-
viewTransitionName
|
|
8306
|
-
} = _ref;
|
|
8307
|
-
const start = (_document = document) === null || _document === void 0 ? void 0 : (_document$startViewTr = _document.startViewTransition) === null || _document$startViewTr === void 0 ? void 0 : _document$startViewTr.bind(document);
|
|
8308
|
-
const prefersReducedMotion = getPrefersReducedMotion();
|
|
8309
|
-
const {
|
|
8310
|
-
flushSync
|
|
8311
|
-
} = ReactDOM;
|
|
8312
|
-
if (prefersReducedMotion || !start || !flushSync || !(viewTransitionName !== null && viewTransitionName !== void 0 && viewTransitionName.source) || !(viewTransitionName !== null && viewTransitionName !== void 0 && viewTransitionName.target)) {
|
|
8313
|
-
// Skip, apply changes without a transition
|
|
8314
|
-
changes();
|
|
8315
|
-
return;
|
|
8316
|
-
}
|
|
8317
|
-
|
|
8318
|
-
// Set transition name on source element
|
|
8319
|
-
setTransitionViewName(viewTransitionName.source, viewTransitionName.name);
|
|
8320
|
-
|
|
8321
|
-
// Start view transition, apply changes & flush to DOM
|
|
8322
|
-
await start(() => {
|
|
8323
|
-
// Un-set transition name on source element
|
|
8324
|
-
setTransitionViewName(viewTransitionName.source, null);
|
|
8325
|
-
flushSync(changes);
|
|
8326
|
-
|
|
8327
|
-
// Set transition name on target element
|
|
8328
|
-
setTransitionViewName(viewTransitionName.target, viewTransitionName.name);
|
|
8329
|
-
}).updateCallbackDone;
|
|
8330
|
-
|
|
8331
|
-
// Un-set transition name on target element
|
|
8332
|
-
setTransitionViewName(viewTransitionName.target, null);
|
|
8333
|
-
}
|
|
8334
|
-
|
|
8335
|
-
/** Find image in element including the element */
|
|
8336
|
-
const findImage = element => element !== null && element !== void 0 && element.matches('img') ? element : (element === null || element === void 0 ? void 0 : element.querySelector('img')) || null;
|
|
8337
|
-
|
|
8338
|
-
const _excluded$A = ["images"];
|
|
8339
|
-
|
|
8340
|
-
/** Subset of the ImageLightboxProps managed by the useImageLightbox hook */
|
|
8341
|
-
|
|
8342
|
-
const EMPTY_PROPS = {
|
|
8343
|
-
isOpen: false,
|
|
8344
|
-
images: [],
|
|
8345
|
-
parentElement: /*#__PURE__*/React.createRef()
|
|
8346
|
-
};
|
|
8347
|
-
/**
|
|
8348
|
-
* Set up an ImageLightbox with images and triggers.
|
|
8349
|
-
*
|
|
8350
|
-
* - Associate a trigger with the lightbox to properly focus the trigger on close
|
|
8351
|
-
* - Associate a trigger with an image to display on open
|
|
8352
|
-
* - Automatically provide a view transition between an image trigger and the displayed image on open & close
|
|
8353
|
-
*
|
|
8354
|
-
* @param initialProps Images to display in the image lightbox
|
|
8355
|
-
*/
|
|
8356
|
-
function useImageLightbox(initialProps) {
|
|
8357
|
-
const {
|
|
8358
|
-
images = []
|
|
8359
|
-
} = initialProps,
|
|
8360
|
-
otherProps = _objectWithoutProperties(initialProps, _excluded$A);
|
|
8361
|
-
const basePropsRef = React.useRef(EMPTY_PROPS);
|
|
8362
|
-
React.useEffect(() => {
|
|
8363
|
-
basePropsRef.current = _objectSpread2(_objectSpread2({}, EMPTY_PROPS), otherProps);
|
|
8364
|
-
}, [otherProps]);
|
|
8365
|
-
const imagesPropsRef = React.useRef(images);
|
|
8366
|
-
React.useEffect(() => {
|
|
8367
|
-
imagesPropsRef.current = images.map(props => _objectSpread2({
|
|
8368
|
-
imgRef: /*#__PURE__*/React.createRef()
|
|
8369
|
-
}, props));
|
|
8370
|
-
}, [images]);
|
|
8371
|
-
const currentImageRef = React.useRef(null);
|
|
8372
|
-
const [imageLightboxProps, setImageLightboxProps] = React.useState(basePropsRef.current);
|
|
8373
|
-
const getTriggerProps = React.useMemo(() => {
|
|
8374
|
-
const triggerImageRefs = {};
|
|
8375
|
-
async function closeLightbox() {
|
|
8376
|
-
const currentImage = currentImageRef.current;
|
|
8377
|
-
if (!currentImage) {
|
|
8378
|
-
return;
|
|
8379
|
-
}
|
|
8380
|
-
const currentIndex = imagesPropsRef.current.findIndex(_ref => {
|
|
8381
|
-
let {
|
|
8382
|
-
imgRef
|
|
8383
|
-
} = _ref;
|
|
8384
|
-
return (imgRef === null || imgRef === void 0 ? void 0 : imgRef.current) === currentImage;
|
|
8385
|
-
});
|
|
8386
|
-
await startViewTransition({
|
|
8387
|
-
changes() {
|
|
8388
|
-
// Close lightbox with reset empty props
|
|
8389
|
-
setImageLightboxProps(_ref2 => {
|
|
8390
|
-
let {
|
|
8391
|
-
parentElement
|
|
8392
|
-
} = _ref2;
|
|
8393
|
-
return _objectSpread2(_objectSpread2({}, basePropsRef.current), {}, {
|
|
8394
|
-
parentElement
|
|
8395
|
-
});
|
|
8396
|
-
});
|
|
8397
|
-
},
|
|
8398
|
-
// Morph from the image in lightbox to the image in trigger
|
|
8399
|
-
viewTransitionName: {
|
|
8400
|
-
source: currentImageRef,
|
|
8401
|
-
target: triggerImageRefs[currentIndex],
|
|
8402
|
-
name: CLASSNAME$v
|
|
8403
|
-
}
|
|
8404
|
-
});
|
|
8405
|
-
}
|
|
8406
|
-
async function openLightbox(triggerElement) {
|
|
8407
|
-
var _triggerImageRefs;
|
|
8408
|
-
let {
|
|
8409
|
-
activeImageIndex
|
|
8410
|
-
} = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
8411
|
-
// If we find an image inside the trigger, animate it in transition with the opening image
|
|
8412
|
-
const triggerImage = ((_triggerImageRefs = triggerImageRefs[activeImageIndex]) === null || _triggerImageRefs === void 0 ? void 0 : _triggerImageRefs.current) || findImage(triggerElement);
|
|
8413
|
-
|
|
8414
|
-
// Inject the trigger image as loading placeholder for better loading state
|
|
8415
|
-
const imagesWithFallbackSize = imagesPropsRef.current.map((image, idx) => {
|
|
8416
|
-
if (triggerImage && idx === activeImageIndex && !image.loadingPlaceholderImageRef) {
|
|
8417
|
-
return _objectSpread2(_objectSpread2({}, image), {}, {
|
|
8418
|
-
loadingPlaceholderImageRef: {
|
|
8419
|
-
current: triggerImage
|
|
8420
|
-
}
|
|
8421
|
-
});
|
|
8422
|
-
}
|
|
8423
|
-
return image;
|
|
8424
|
-
});
|
|
8425
|
-
await startViewTransition({
|
|
8426
|
-
changes: () => {
|
|
8427
|
-
// Open lightbox with setup props
|
|
8428
|
-
setImageLightboxProps(_objectSpread2(_objectSpread2({}, basePropsRef.current), {}, {
|
|
8429
|
-
activeImageRef: currentImageRef,
|
|
8430
|
-
parentElement: {
|
|
8431
|
-
current: triggerElement
|
|
8432
|
-
},
|
|
8433
|
-
isOpen: true,
|
|
8434
|
-
onClose: closeLightbox,
|
|
8435
|
-
images: imagesWithFallbackSize,
|
|
8436
|
-
activeImageIndex: activeImageIndex || 0
|
|
8437
|
-
}));
|
|
8438
|
-
},
|
|
8439
|
-
// Morph from the image in trigger to the image in lightbox
|
|
8440
|
-
viewTransitionName: {
|
|
8441
|
-
source: triggerImage,
|
|
8442
|
-
target: currentImageRef,
|
|
8443
|
-
name: CLASSNAME$v
|
|
8444
|
-
}
|
|
8445
|
-
});
|
|
8446
|
-
}
|
|
8447
|
-
return memoize(options => ({
|
|
8448
|
-
ref(element) {
|
|
8449
|
-
// Track trigger image ref if any
|
|
8450
|
-
if ((options === null || options === void 0 ? void 0 : options.activeImageIndex) !== undefined && element) {
|
|
8451
|
-
triggerImageRefs[options.activeImageIndex] = {
|
|
8452
|
-
current: findImage(element)
|
|
8453
|
-
};
|
|
8454
|
-
}
|
|
8455
|
-
},
|
|
8456
|
-
onClick(e) {
|
|
8457
|
-
openLightbox(e.target, options);
|
|
8458
|
-
}
|
|
8459
|
-
}));
|
|
8460
|
-
}, []);
|
|
8461
|
-
return {
|
|
8462
|
-
getTriggerProps,
|
|
8463
|
-
imageLightboxProps
|
|
8464
|
-
};
|
|
8465
|
-
}
|
|
8466
|
-
|
|
8467
|
-
const _excluded$B = ["className", "isOpen", "closeButtonProps", "onClose", "parentElement", "activeImageIndex", "slideshowControlsProps", "slideGroupLabel", "images", "zoomOutButtonProps", "zoomInButtonProps", "activeImageRef"];
|
|
8468
|
-
const Inner = /*#__PURE__*/forwardRef((props, ref) => {
|
|
8469
|
-
const {
|
|
8470
|
-
className,
|
|
8471
|
-
isOpen,
|
|
8472
|
-
closeButtonProps,
|
|
8473
|
-
onClose,
|
|
8474
|
-
parentElement,
|
|
8475
|
-
activeImageIndex,
|
|
8476
|
-
slideshowControlsProps,
|
|
8477
|
-
slideGroupLabel,
|
|
8478
|
-
images,
|
|
8479
|
-
zoomOutButtonProps,
|
|
8480
|
-
zoomInButtonProps,
|
|
8481
|
-
activeImageRef: propImageRef
|
|
8482
|
-
} = props,
|
|
8483
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$B);
|
|
8484
|
-
const currentPaginationItemRef = React.useRef(null);
|
|
8485
|
-
const footerRef = React.useRef(null);
|
|
8486
|
-
const imageRef = React.useRef(null);
|
|
8487
|
-
const clickAwayChildrenRefs = React.useRef([imageRef, footerRef]);
|
|
8488
|
-
return /*#__PURE__*/React.createElement(Lightbox, _extends({
|
|
8489
|
-
ref: ref,
|
|
8490
|
-
className: classnames(className, CLASSNAME$v),
|
|
8491
|
-
parentElement: parentElement,
|
|
8492
|
-
isOpen: isOpen,
|
|
8493
|
-
onClose: onClose,
|
|
8494
|
-
closeButtonProps: closeButtonProps,
|
|
8495
|
-
focusElement: currentPaginationItemRef
|
|
8496
|
-
}, forwardedProps), /*#__PURE__*/React.createElement(ClickAwayProvider, {
|
|
8497
|
-
childrenRefs: clickAwayChildrenRefs,
|
|
8498
|
-
callback: onClose
|
|
8499
|
-
}, /*#__PURE__*/React.createElement(ImageSlideshow, {
|
|
8500
|
-
activeImageIndex: activeImageIndex,
|
|
8501
|
-
slideGroupLabel: slideGroupLabel,
|
|
8502
|
-
slideshowControlsProps: slideshowControlsProps,
|
|
8503
|
-
images: images,
|
|
8504
|
-
zoomInButtonProps: zoomInButtonProps,
|
|
8505
|
-
zoomOutButtonProps: zoomOutButtonProps,
|
|
8506
|
-
footerRef: footerRef,
|
|
8507
|
-
activeImageRef: mergeRefs(propImageRef, imageRef),
|
|
8508
|
-
currentPaginationItemRef: currentPaginationItemRef
|
|
8509
|
-
})));
|
|
8510
|
-
});
|
|
8511
|
-
Inner.displayName = COMPONENT_NAME$y;
|
|
8512
|
-
Inner.className = CLASSNAME$v;
|
|
8513
|
-
|
|
8514
|
-
/**
|
|
8515
|
-
* ImageLightbox component.
|
|
8516
|
-
*
|
|
8517
|
-
* @param props Component props.
|
|
8518
|
-
* @param ref Component ref.
|
|
8519
|
-
* @return React element.
|
|
8520
|
-
*/
|
|
8521
|
-
const ImageLightbox = Object.assign(Inner, {
|
|
8522
|
-
useImageLightbox
|
|
8523
|
-
});
|
|
8524
|
-
|
|
8525
|
-
const _excluded$C = ["className", "color", "colorVariant", "typography", "children", "wrap"];
|
|
7794
|
+
const _excluded$z = ["className", "color", "colorVariant", "typography", "children", "wrap"];
|
|
8526
7795
|
|
|
8527
7796
|
/**
|
|
8528
7797
|
* Defines the props of the component.
|
|
@@ -8531,12 +7800,12 @@ const _excluded$C = ["className", "color", "colorVariant", "typography", "childr
|
|
|
8531
7800
|
/**
|
|
8532
7801
|
* Component display name.
|
|
8533
7802
|
*/
|
|
8534
|
-
const COMPONENT_NAME$
|
|
7803
|
+
const COMPONENT_NAME$y = 'InlineList';
|
|
8535
7804
|
|
|
8536
7805
|
/**
|
|
8537
7806
|
* Component default class name and class prefix.
|
|
8538
7807
|
*/
|
|
8539
|
-
const CLASSNAME$
|
|
7808
|
+
const CLASSNAME$v = getRootClassName(COMPONENT_NAME$y);
|
|
8540
7809
|
|
|
8541
7810
|
/**
|
|
8542
7811
|
* Component default props.
|
|
@@ -8559,7 +7828,7 @@ const InlineList = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8559
7828
|
children,
|
|
8560
7829
|
wrap
|
|
8561
7830
|
} = props,
|
|
8562
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
7831
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$z);
|
|
8563
7832
|
const fontColorClassName = color && getFontColorClassName(color, colorVariant);
|
|
8564
7833
|
const typographyClassName = typography && getTypographyClassName(typography);
|
|
8565
7834
|
return (
|
|
@@ -8567,7 +7836,7 @@ const InlineList = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8567
7836
|
// eslint-disable-next-line jsx-a11y/no-redundant-roles
|
|
8568
7837
|
React.createElement("ul", _extends({}, forwardedProps, {
|
|
8569
7838
|
ref: ref,
|
|
8570
|
-
className: classnames(className, CLASSNAME$
|
|
7839
|
+
className: classnames(className, CLASSNAME$v, wrap && `${CLASSNAME$v}--wrap`, fontColorClassName, typographyClassName)
|
|
8571
7840
|
// Lists with removed bullet style can lose their a11y list role on some browsers
|
|
8572
7841
|
,
|
|
8573
7842
|
role: "list"
|
|
@@ -8580,17 +7849,17 @@ const InlineList = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8580
7849
|
React.createElement("li", {
|
|
8581
7850
|
key: key,
|
|
8582
7851
|
role: "listitem",
|
|
8583
|
-
className: `${CLASSNAME$
|
|
7852
|
+
className: `${CLASSNAME$v}__item`
|
|
8584
7853
|
}, index !== 0 && /*#__PURE__*/React.createElement("span", {
|
|
8585
|
-
className: `${CLASSNAME$
|
|
7854
|
+
className: `${CLASSNAME$v}__item-separator`,
|
|
8586
7855
|
"aria-hidden": "true"
|
|
8587
7856
|
}, '\u00A0•\u00A0'), child)
|
|
8588
7857
|
);
|
|
8589
7858
|
}))
|
|
8590
7859
|
);
|
|
8591
7860
|
});
|
|
8592
|
-
InlineList.displayName = COMPONENT_NAME$
|
|
8593
|
-
InlineList.className = CLASSNAME$
|
|
7861
|
+
InlineList.displayName = COMPONENT_NAME$y;
|
|
7862
|
+
InlineList.className = CLASSNAME$v;
|
|
8594
7863
|
InlineList.defaultProps = DEFAULT_PROPS$r;
|
|
8595
7864
|
|
|
8596
7865
|
const INPUT_HELPER_CONFIGURATION = {
|
|
@@ -8605,7 +7874,7 @@ const INPUT_HELPER_CONFIGURATION = {
|
|
|
8605
7874
|
}
|
|
8606
7875
|
};
|
|
8607
7876
|
|
|
8608
|
-
const _excluded$
|
|
7877
|
+
const _excluded$A = ["children", "className", "kind", "theme"];
|
|
8609
7878
|
|
|
8610
7879
|
/**
|
|
8611
7880
|
* Defines the props of the component.
|
|
@@ -8614,12 +7883,12 @@ const _excluded$D = ["children", "className", "kind", "theme"];
|
|
|
8614
7883
|
/**
|
|
8615
7884
|
* Component display name.
|
|
8616
7885
|
*/
|
|
8617
|
-
const COMPONENT_NAME$
|
|
7886
|
+
const COMPONENT_NAME$z = 'InputHelper';
|
|
8618
7887
|
|
|
8619
7888
|
/**
|
|
8620
7889
|
* Component default class name and class prefix.
|
|
8621
7890
|
*/
|
|
8622
|
-
const CLASSNAME$
|
|
7891
|
+
const CLASSNAME$w = getRootClassName(COMPONENT_NAME$z);
|
|
8623
7892
|
|
|
8624
7893
|
/**
|
|
8625
7894
|
* Component default props.
|
|
@@ -8643,7 +7912,7 @@ const InputHelper = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8643
7912
|
kind,
|
|
8644
7913
|
theme
|
|
8645
7914
|
} = props,
|
|
8646
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
7915
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$A);
|
|
8647
7916
|
const {
|
|
8648
7917
|
color
|
|
8649
7918
|
} = INPUT_HELPER_CONFIGURATION[kind] || {};
|
|
@@ -8651,17 +7920,17 @@ const InputHelper = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8651
7920
|
ref: ref
|
|
8652
7921
|
}, forwardedProps, {
|
|
8653
7922
|
className: classnames(className, handleBasicClasses({
|
|
8654
|
-
prefix: CLASSNAME$
|
|
7923
|
+
prefix: CLASSNAME$w,
|
|
8655
7924
|
color,
|
|
8656
7925
|
theme
|
|
8657
7926
|
}))
|
|
8658
7927
|
}), children);
|
|
8659
7928
|
});
|
|
8660
|
-
InputHelper.displayName = COMPONENT_NAME$
|
|
8661
|
-
InputHelper.className = CLASSNAME$
|
|
7929
|
+
InputHelper.displayName = COMPONENT_NAME$z;
|
|
7930
|
+
InputHelper.className = CLASSNAME$w;
|
|
8662
7931
|
InputHelper.defaultProps = DEFAULT_PROPS$s;
|
|
8663
7932
|
|
|
8664
|
-
const _excluded$
|
|
7933
|
+
const _excluded$B = ["children", "className", "htmlFor", "isRequired", "theme"];
|
|
8665
7934
|
|
|
8666
7935
|
/**
|
|
8667
7936
|
* Defines the props of the component.
|
|
@@ -8670,12 +7939,12 @@ const _excluded$E = ["children", "className", "htmlFor", "isRequired", "theme"];
|
|
|
8670
7939
|
/**
|
|
8671
7940
|
* Component display name.
|
|
8672
7941
|
*/
|
|
8673
|
-
const COMPONENT_NAME$
|
|
7942
|
+
const COMPONENT_NAME$A = 'InputLabel';
|
|
8674
7943
|
|
|
8675
7944
|
/**
|
|
8676
7945
|
* Component default class name and class prefix.
|
|
8677
7946
|
*/
|
|
8678
|
-
const CLASSNAME$
|
|
7947
|
+
const CLASSNAME$x = getRootClassName(COMPONENT_NAME$A);
|
|
8679
7948
|
|
|
8680
7949
|
/**
|
|
8681
7950
|
* Component default props.
|
|
@@ -8699,23 +7968,23 @@ const InputLabel = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8699
7968
|
isRequired,
|
|
8700
7969
|
theme
|
|
8701
7970
|
} = props,
|
|
8702
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
7971
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$B);
|
|
8703
7972
|
return /*#__PURE__*/React.createElement("label", _extends({
|
|
8704
7973
|
ref: ref
|
|
8705
7974
|
}, forwardedProps, {
|
|
8706
7975
|
htmlFor: htmlFor,
|
|
8707
7976
|
className: classnames(className, handleBasicClasses({
|
|
8708
|
-
prefix: CLASSNAME$
|
|
7977
|
+
prefix: CLASSNAME$x,
|
|
8709
7978
|
isRequired,
|
|
8710
7979
|
theme
|
|
8711
7980
|
}))
|
|
8712
7981
|
}), children);
|
|
8713
7982
|
});
|
|
8714
|
-
InputLabel.displayName = COMPONENT_NAME$
|
|
8715
|
-
InputLabel.className = CLASSNAME$
|
|
7983
|
+
InputLabel.displayName = COMPONENT_NAME$A;
|
|
7984
|
+
InputLabel.className = CLASSNAME$x;
|
|
8716
7985
|
InputLabel.defaultProps = DEFAULT_PROPS$t;
|
|
8717
7986
|
|
|
8718
|
-
const _excluded$
|
|
7987
|
+
const _excluded$C = ["aria-labelledby", "ariaLabelledBy", "aria-label", "ariaLabel", "children", "className", "closeButtonProps", "isOpen", "onClose", "parentElement", "focusElement", "preventAutoClose", "theme", "zIndex"];
|
|
8719
7988
|
|
|
8720
7989
|
/**
|
|
8721
7990
|
* Defines the props of the component.
|
|
@@ -8724,12 +7993,12 @@ const _excluded$F = ["aria-labelledby", "ariaLabelledBy", "aria-label", "ariaLab
|
|
|
8724
7993
|
/**
|
|
8725
7994
|
* Component display name.
|
|
8726
7995
|
*/
|
|
8727
|
-
const COMPONENT_NAME$
|
|
7996
|
+
const COMPONENT_NAME$B = 'Lightbox';
|
|
8728
7997
|
|
|
8729
7998
|
/**
|
|
8730
7999
|
* Component default class name and class prefix.
|
|
8731
8000
|
*/
|
|
8732
|
-
const CLASSNAME$
|
|
8001
|
+
const CLASSNAME$y = getRootClassName(COMPONENT_NAME$B);
|
|
8733
8002
|
|
|
8734
8003
|
/**
|
|
8735
8004
|
* Lightbox component.
|
|
@@ -8755,7 +8024,7 @@ const Lightbox = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8755
8024
|
theme,
|
|
8756
8025
|
zIndex
|
|
8757
8026
|
} = props,
|
|
8758
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8027
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$C);
|
|
8759
8028
|
if (!DOCUMENT) {
|
|
8760
8029
|
// Can't render in SSR.
|
|
8761
8030
|
return null;
|
|
@@ -8816,7 +8085,7 @@ const Lightbox = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8816
8085
|
role: "dialog",
|
|
8817
8086
|
tabIndex: -1,
|
|
8818
8087
|
className: classnames(className, handleBasicClasses({
|
|
8819
|
-
prefix: CLASSNAME$
|
|
8088
|
+
prefix: CLASSNAME$y,
|
|
8820
8089
|
isHidden: !isOpen,
|
|
8821
8090
|
isShown: isOpen || isVisible,
|
|
8822
8091
|
theme
|
|
@@ -8825,7 +8094,7 @@ const Lightbox = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8825
8094
|
zIndex
|
|
8826
8095
|
}
|
|
8827
8096
|
}), closeButtonProps && /*#__PURE__*/React.createElement("div", {
|
|
8828
|
-
className: `${CLASSNAME$
|
|
8097
|
+
className: `${CLASSNAME$y}__close`
|
|
8829
8098
|
}, /*#__PURE__*/React.createElement(IconButton, _extends({}, closeButtonProps, {
|
|
8830
8099
|
ref: closeButtonRef,
|
|
8831
8100
|
emphasis: "low",
|
|
@@ -8839,14 +8108,14 @@ const Lightbox = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8839
8108
|
childrenRefs: clickAwayRefs
|
|
8840
8109
|
}, /*#__PURE__*/React.createElement("div", {
|
|
8841
8110
|
ref: childrenRef,
|
|
8842
|
-
className: `${CLASSNAME$
|
|
8111
|
+
className: `${CLASSNAME$y}__wrapper`,
|
|
8843
8112
|
role: "presentation"
|
|
8844
8113
|
}, children))), document.body);
|
|
8845
8114
|
});
|
|
8846
|
-
Lightbox.displayName = COMPONENT_NAME$
|
|
8847
|
-
Lightbox.className = CLASSNAME$
|
|
8115
|
+
Lightbox.displayName = COMPONENT_NAME$B;
|
|
8116
|
+
Lightbox.className = CLASSNAME$y;
|
|
8848
8117
|
|
|
8849
|
-
const _excluded$
|
|
8118
|
+
const _excluded$D = ["children", "className", "color", "colorVariant", "disabled", "isDisabled", "href", "leftIcon", "linkAs", "rightIcon", "target", "typography"];
|
|
8850
8119
|
|
|
8851
8120
|
/**
|
|
8852
8121
|
* Defines the props of the component.
|
|
@@ -8855,12 +8124,12 @@ const _excluded$G = ["children", "className", "color", "colorVariant", "disabled
|
|
|
8855
8124
|
/**
|
|
8856
8125
|
* Component display name.
|
|
8857
8126
|
*/
|
|
8858
|
-
const COMPONENT_NAME$
|
|
8127
|
+
const COMPONENT_NAME$C = 'Link';
|
|
8859
8128
|
|
|
8860
8129
|
/**
|
|
8861
8130
|
* Component default class name and class prefix.
|
|
8862
8131
|
*/
|
|
8863
|
-
const CLASSNAME$
|
|
8132
|
+
const CLASSNAME$z = getRootClassName(COMPONENT_NAME$C);
|
|
8864
8133
|
const getIconSize = typography => {
|
|
8865
8134
|
switch (typography) {
|
|
8866
8135
|
case Typography.display1:
|
|
@@ -8909,18 +8178,18 @@ const Link = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8909
8178
|
target,
|
|
8910
8179
|
typography
|
|
8911
8180
|
} = props,
|
|
8912
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8181
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$D);
|
|
8913
8182
|
const renderedChildren = useMemo(() => /*#__PURE__*/React.createElement(React.Fragment, null, leftIcon && !isEmpty(leftIcon) && /*#__PURE__*/React.createElement(Icon, {
|
|
8914
8183
|
icon: leftIcon,
|
|
8915
|
-
className: `${CLASSNAME$
|
|
8184
|
+
className: `${CLASSNAME$z}__left-icon`,
|
|
8916
8185
|
size: getIconSize(typography)
|
|
8917
8186
|
}), children && /*#__PURE__*/React.createElement("span", {
|
|
8918
|
-
className: classnames(`${CLASSNAME$
|
|
8187
|
+
className: classnames(`${CLASSNAME$z}__content`, {
|
|
8919
8188
|
[`lumx-typography-${typography}`]: typography
|
|
8920
8189
|
})
|
|
8921
8190
|
}, children), rightIcon && !isEmpty(rightIcon) && /*#__PURE__*/React.createElement(Icon, {
|
|
8922
8191
|
icon: rightIcon,
|
|
8923
|
-
className: `${CLASSNAME$
|
|
8192
|
+
className: `${CLASSNAME$z}__right-icon`,
|
|
8924
8193
|
size: getIconSize(typography)
|
|
8925
8194
|
})), [leftIcon, typography, children, rightIcon]);
|
|
8926
8195
|
|
|
@@ -8935,7 +8204,7 @@ const Link = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8935
8204
|
ref: ref,
|
|
8936
8205
|
disabled: isDisabled,
|
|
8937
8206
|
className: classnames(className, handleBasicClasses({
|
|
8938
|
-
prefix: CLASSNAME$
|
|
8207
|
+
prefix: CLASSNAME$z,
|
|
8939
8208
|
color,
|
|
8940
8209
|
colorVariant
|
|
8941
8210
|
}))
|
|
@@ -8947,17 +8216,17 @@ const Link = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8947
8216
|
href,
|
|
8948
8217
|
target,
|
|
8949
8218
|
className: classnames(className, handleBasicClasses({
|
|
8950
|
-
prefix: CLASSNAME$
|
|
8219
|
+
prefix: CLASSNAME$z,
|
|
8951
8220
|
color,
|
|
8952
8221
|
colorVariant
|
|
8953
8222
|
})),
|
|
8954
8223
|
ref: ref
|
|
8955
8224
|
}), renderedChildren);
|
|
8956
8225
|
});
|
|
8957
|
-
Link.displayName = COMPONENT_NAME$
|
|
8958
|
-
Link.className = CLASSNAME$
|
|
8226
|
+
Link.displayName = COMPONENT_NAME$C;
|
|
8227
|
+
Link.className = CLASSNAME$z;
|
|
8959
8228
|
|
|
8960
|
-
const _excluded$
|
|
8229
|
+
const _excluded$E = ["className", "description", "link", "linkAs", "linkProps", "size", "theme", "thumbnailProps", "title", "titleHeading"];
|
|
8961
8230
|
|
|
8962
8231
|
/**
|
|
8963
8232
|
* Defines the props of the component.
|
|
@@ -8966,12 +8235,12 @@ const _excluded$H = ["className", "description", "link", "linkAs", "linkProps",
|
|
|
8966
8235
|
/**
|
|
8967
8236
|
* Component display name.
|
|
8968
8237
|
*/
|
|
8969
|
-
const COMPONENT_NAME$
|
|
8238
|
+
const COMPONENT_NAME$D = 'LinkPreview';
|
|
8970
8239
|
|
|
8971
8240
|
/**
|
|
8972
8241
|
* Component default class name and class prefix.
|
|
8973
8242
|
*/
|
|
8974
|
-
const CLASSNAME$
|
|
8243
|
+
const CLASSNAME$A = getRootClassName(COMPONENT_NAME$D);
|
|
8975
8244
|
|
|
8976
8245
|
/**
|
|
8977
8246
|
* Component default props.
|
|
@@ -9002,21 +8271,21 @@ const LinkPreview = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9002
8271
|
title,
|
|
9003
8272
|
titleHeading
|
|
9004
8273
|
} = props,
|
|
9005
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8274
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$E);
|
|
9006
8275
|
// Use title heading as title wrapper (see DEFAULT_PROPS for the default value).
|
|
9007
8276
|
const TitleHeading = titleHeading;
|
|
9008
8277
|
return /*#__PURE__*/React.createElement("article", _extends({
|
|
9009
8278
|
ref: ref
|
|
9010
8279
|
}, forwardedProps, {
|
|
9011
8280
|
className: classnames(className, handleBasicClasses({
|
|
9012
|
-
prefix: CLASSNAME$
|
|
8281
|
+
prefix: CLASSNAME$A,
|
|
9013
8282
|
size: size === Size.big && thumbnailProps ? Size.big : Size.regular,
|
|
9014
8283
|
theme
|
|
9015
8284
|
}))
|
|
9016
8285
|
}), /*#__PURE__*/React.createElement("div", {
|
|
9017
|
-
className: `${CLASSNAME$
|
|
8286
|
+
className: `${CLASSNAME$A}__wrapper`
|
|
9018
8287
|
}, thumbnailProps && /*#__PURE__*/React.createElement("div", {
|
|
9019
|
-
className: `${CLASSNAME$
|
|
8288
|
+
className: `${CLASSNAME$A}__thumbnail`
|
|
9020
8289
|
}, /*#__PURE__*/React.createElement(Thumbnail, _extends({}, thumbnailProps, {
|
|
9021
8290
|
linkAs: linkAs,
|
|
9022
8291
|
linkProps: _objectSpread2(_objectSpread2({}, linkProps), {}, {
|
|
@@ -9028,9 +8297,9 @@ const LinkPreview = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9028
8297
|
aspectRatio: AspectRatio.free,
|
|
9029
8298
|
fillHeight: true
|
|
9030
8299
|
}))), /*#__PURE__*/React.createElement("div", {
|
|
9031
|
-
className: `${CLASSNAME$
|
|
8300
|
+
className: `${CLASSNAME$A}__container`
|
|
9032
8301
|
}, title && /*#__PURE__*/React.createElement(TitleHeading, {
|
|
9033
|
-
className: `${CLASSNAME$
|
|
8302
|
+
className: `${CLASSNAME$A}__title`
|
|
9034
8303
|
}, /*#__PURE__*/React.createElement(Link, _extends({}, linkProps, {
|
|
9035
8304
|
linkAs: linkAs,
|
|
9036
8305
|
target: "_blank",
|
|
@@ -9038,12 +8307,12 @@ const LinkPreview = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9038
8307
|
color: theme === Theme.light ? ColorPalette.dark : ColorPalette.light,
|
|
9039
8308
|
colorVariant: ColorVariant.N
|
|
9040
8309
|
}), title)), description && /*#__PURE__*/React.createElement("p", {
|
|
9041
|
-
className: `${CLASSNAME$
|
|
8310
|
+
className: `${CLASSNAME$A}__description`
|
|
9042
8311
|
}, description), /*#__PURE__*/React.createElement("div", {
|
|
9043
|
-
className: `${CLASSNAME$
|
|
8312
|
+
className: `${CLASSNAME$A}__link`
|
|
9044
8313
|
}, /*#__PURE__*/React.createElement(Link, _extends({}, linkProps, {
|
|
9045
8314
|
linkAs: linkAs,
|
|
9046
|
-
className: classnames(`${CLASSNAME$
|
|
8315
|
+
className: classnames(`${CLASSNAME$A}__link`, linkProps === null || linkProps === void 0 ? void 0 : linkProps.className),
|
|
9047
8316
|
target: "_blank",
|
|
9048
8317
|
href: link,
|
|
9049
8318
|
color: theme === Theme.light ? ColorPalette.primary : ColorPalette.light,
|
|
@@ -9053,11 +8322,11 @@ const LinkPreview = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9053
8322
|
tabIndex: title ? '-1' : undefined
|
|
9054
8323
|
}), link)))));
|
|
9055
8324
|
});
|
|
9056
|
-
LinkPreview.displayName = COMPONENT_NAME$
|
|
9057
|
-
LinkPreview.className = CLASSNAME$
|
|
8325
|
+
LinkPreview.displayName = COMPONENT_NAME$D;
|
|
8326
|
+
LinkPreview.className = CLASSNAME$A;
|
|
9058
8327
|
LinkPreview.defaultProps = DEFAULT_PROPS$u;
|
|
9059
8328
|
|
|
9060
|
-
const _excluded$
|
|
8329
|
+
const _excluded$F = ["className"];
|
|
9061
8330
|
|
|
9062
8331
|
/**
|
|
9063
8332
|
* Defines the props of the component.
|
|
@@ -9066,12 +8335,12 @@ const _excluded$I = ["className"];
|
|
|
9066
8335
|
/**
|
|
9067
8336
|
* Component display name.
|
|
9068
8337
|
*/
|
|
9069
|
-
const COMPONENT_NAME$
|
|
8338
|
+
const COMPONENT_NAME$E = 'ListDivider';
|
|
9070
8339
|
|
|
9071
8340
|
/**
|
|
9072
8341
|
* Component default class name and class prefix.
|
|
9073
8342
|
*/
|
|
9074
|
-
const CLASSNAME$
|
|
8343
|
+
const CLASSNAME$B = getRootClassName(COMPONENT_NAME$E);
|
|
9075
8344
|
|
|
9076
8345
|
/**
|
|
9077
8346
|
* ListDivider component.
|
|
@@ -9084,19 +8353,19 @@ const ListDivider = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9084
8353
|
const {
|
|
9085
8354
|
className
|
|
9086
8355
|
} = props,
|
|
9087
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8356
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$F);
|
|
9088
8357
|
return /*#__PURE__*/React.createElement("li", _extends({
|
|
9089
8358
|
ref: ref
|
|
9090
8359
|
}, forwardedProps, {
|
|
9091
8360
|
className: classnames(className, handleBasicClasses({
|
|
9092
|
-
prefix: CLASSNAME$
|
|
8361
|
+
prefix: CLASSNAME$B
|
|
9093
8362
|
}))
|
|
9094
8363
|
}));
|
|
9095
8364
|
});
|
|
9096
|
-
ListDivider.displayName = COMPONENT_NAME$
|
|
9097
|
-
ListDivider.className = CLASSNAME$
|
|
8365
|
+
ListDivider.displayName = COMPONENT_NAME$E;
|
|
8366
|
+
ListDivider.className = CLASSNAME$B;
|
|
9098
8367
|
|
|
9099
|
-
const _excluded$
|
|
8368
|
+
const _excluded$G = ["children", "className"];
|
|
9100
8369
|
|
|
9101
8370
|
/**
|
|
9102
8371
|
* Defines the props of the component.
|
|
@@ -9105,12 +8374,12 @@ const _excluded$J = ["children", "className"];
|
|
|
9105
8374
|
/**
|
|
9106
8375
|
* Component display name.
|
|
9107
8376
|
*/
|
|
9108
|
-
const COMPONENT_NAME$
|
|
8377
|
+
const COMPONENT_NAME$F = 'ListSubheader';
|
|
9109
8378
|
|
|
9110
8379
|
/**
|
|
9111
8380
|
* Component default class name and class prefix.
|
|
9112
8381
|
*/
|
|
9113
|
-
const CLASSNAME$
|
|
8382
|
+
const CLASSNAME$C = getRootClassName(COMPONENT_NAME$F);
|
|
9114
8383
|
|
|
9115
8384
|
/**
|
|
9116
8385
|
* ListSubheader component.
|
|
@@ -9124,19 +8393,19 @@ const ListSubheader = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9124
8393
|
children,
|
|
9125
8394
|
className
|
|
9126
8395
|
} = props,
|
|
9127
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8396
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$G);
|
|
9128
8397
|
return /*#__PURE__*/React.createElement("li", _extends({
|
|
9129
8398
|
ref: ref
|
|
9130
8399
|
}, forwardedProps, {
|
|
9131
8400
|
className: classnames(className, handleBasicClasses({
|
|
9132
|
-
prefix: CLASSNAME$
|
|
8401
|
+
prefix: CLASSNAME$C
|
|
9133
8402
|
}))
|
|
9134
8403
|
}), children);
|
|
9135
8404
|
});
|
|
9136
|
-
ListSubheader.displayName = COMPONENT_NAME$
|
|
9137
|
-
ListSubheader.className = CLASSNAME$
|
|
8405
|
+
ListSubheader.displayName = COMPONENT_NAME$F;
|
|
8406
|
+
ListSubheader.className = CLASSNAME$C;
|
|
9138
8407
|
|
|
9139
|
-
const _excluded$
|
|
8408
|
+
const _excluded$H = ["children", "className", "hasBackground", "kind", "icon", "closeButtonProps"];
|
|
9140
8409
|
|
|
9141
8410
|
/**
|
|
9142
8411
|
* Defines the props of the component.
|
|
@@ -9145,12 +8414,12 @@ const _excluded$K = ["children", "className", "hasBackground", "kind", "icon", "
|
|
|
9145
8414
|
/**
|
|
9146
8415
|
* Component display name.
|
|
9147
8416
|
*/
|
|
9148
|
-
const COMPONENT_NAME$
|
|
8417
|
+
const COMPONENT_NAME$G = 'Message';
|
|
9149
8418
|
|
|
9150
8419
|
/**
|
|
9151
8420
|
* Component default class name and class prefix.
|
|
9152
8421
|
*/
|
|
9153
|
-
const CLASSNAME$
|
|
8422
|
+
const CLASSNAME$D = getRootClassName(COMPONENT_NAME$G);
|
|
9154
8423
|
|
|
9155
8424
|
/**
|
|
9156
8425
|
* Associative map from message kind to color and icon.
|
|
@@ -9190,7 +8459,7 @@ const Message = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9190
8459
|
icon: customIcon,
|
|
9191
8460
|
closeButtonProps
|
|
9192
8461
|
} = props,
|
|
9193
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8462
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$H);
|
|
9194
8463
|
const {
|
|
9195
8464
|
color,
|
|
9196
8465
|
icon
|
|
@@ -9205,27 +8474,27 @@ const Message = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9205
8474
|
className: classnames(className, handleBasicClasses({
|
|
9206
8475
|
color,
|
|
9207
8476
|
hasBackground,
|
|
9208
|
-
prefix: CLASSNAME$
|
|
8477
|
+
prefix: CLASSNAME$D
|
|
9209
8478
|
}))
|
|
9210
8479
|
}, forwardedProps), (customIcon || icon) && /*#__PURE__*/React.createElement(Icon, {
|
|
9211
|
-
className: `${CLASSNAME$
|
|
8480
|
+
className: `${CLASSNAME$D}__icon`,
|
|
9212
8481
|
icon: customIcon || icon,
|
|
9213
8482
|
size: Size.xs,
|
|
9214
8483
|
color: color
|
|
9215
8484
|
}), /*#__PURE__*/React.createElement("div", {
|
|
9216
|
-
className: `${CLASSNAME$
|
|
8485
|
+
className: `${CLASSNAME$D}__text`
|
|
9217
8486
|
}, children), isCloseButtonDisplayed && /*#__PURE__*/React.createElement(IconButton, {
|
|
9218
|
-
className: `${CLASSNAME$
|
|
8487
|
+
className: `${CLASSNAME$D}__close-button`,
|
|
9219
8488
|
icon: mdiClose,
|
|
9220
8489
|
onClick: onClick,
|
|
9221
8490
|
label: closeButtonLabel,
|
|
9222
8491
|
emphasis: Emphasis.low
|
|
9223
8492
|
}));
|
|
9224
8493
|
});
|
|
9225
|
-
Message.displayName = COMPONENT_NAME$
|
|
9226
|
-
Message.className = CLASSNAME$
|
|
8494
|
+
Message.displayName = COMPONENT_NAME$G;
|
|
8495
|
+
Message.className = CLASSNAME$D;
|
|
9227
8496
|
|
|
9228
|
-
const _excluded$
|
|
8497
|
+
const _excluded$I = ["className", "theme", "thumbnails", "onImageClick"],
|
|
9229
8498
|
_excluded2$1 = ["image", "onClick", "align"];
|
|
9230
8499
|
|
|
9231
8500
|
/**
|
|
@@ -9235,12 +8504,12 @@ const _excluded$L = ["className", "theme", "thumbnails", "onImageClick"],
|
|
|
9235
8504
|
/**
|
|
9236
8505
|
* Component display name.
|
|
9237
8506
|
*/
|
|
9238
|
-
const COMPONENT_NAME$
|
|
8507
|
+
const COMPONENT_NAME$H = 'Mosaic';
|
|
9239
8508
|
|
|
9240
8509
|
/**
|
|
9241
8510
|
* Component default class name and class prefix.
|
|
9242
8511
|
*/
|
|
9243
|
-
const CLASSNAME$
|
|
8512
|
+
const CLASSNAME$E = getRootClassName(COMPONENT_NAME$H);
|
|
9244
8513
|
|
|
9245
8514
|
/**
|
|
9246
8515
|
* Component default props.
|
|
@@ -9263,7 +8532,7 @@ const Mosaic = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9263
8532
|
thumbnails,
|
|
9264
8533
|
onImageClick
|
|
9265
8534
|
} = props,
|
|
9266
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8535
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$I);
|
|
9267
8536
|
const handleImageClick = useMemo(() => {
|
|
9268
8537
|
if (!onImageClick) return undefined;
|
|
9269
8538
|
return (index, onClick) => event => {
|
|
@@ -9275,16 +8544,16 @@ const Mosaic = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9275
8544
|
ref: ref
|
|
9276
8545
|
}, forwardedProps, {
|
|
9277
8546
|
className: classnames(className, handleBasicClasses({
|
|
9278
|
-
prefix: CLASSNAME$
|
|
8547
|
+
prefix: CLASSNAME$E,
|
|
9279
8548
|
theme
|
|
9280
8549
|
}), {
|
|
9281
|
-
[`${CLASSNAME$
|
|
9282
|
-
[`${CLASSNAME$
|
|
9283
|
-
[`${CLASSNAME$
|
|
9284
|
-
[`${CLASSNAME$
|
|
8550
|
+
[`${CLASSNAME$E}--has-1-thumbnail`]: (thumbnails === null || thumbnails === void 0 ? void 0 : thumbnails.length) === 1,
|
|
8551
|
+
[`${CLASSNAME$E}--has-2-thumbnails`]: (thumbnails === null || thumbnails === void 0 ? void 0 : thumbnails.length) === 2,
|
|
8552
|
+
[`${CLASSNAME$E}--has-3-thumbnails`]: (thumbnails === null || thumbnails === void 0 ? void 0 : thumbnails.length) === 3,
|
|
8553
|
+
[`${CLASSNAME$E}--has-4-thumbnails`]: (thumbnails === null || thumbnails === void 0 ? void 0 : thumbnails.length) >= 4
|
|
9285
8554
|
})
|
|
9286
8555
|
}), /*#__PURE__*/React.createElement("div", {
|
|
9287
|
-
className: `${CLASSNAME$
|
|
8556
|
+
className: `${CLASSNAME$E}__wrapper`
|
|
9288
8557
|
}, take(thumbnails, 4).map((thumbnail, index) => {
|
|
9289
8558
|
const {
|
|
9290
8559
|
image,
|
|
@@ -9294,7 +8563,7 @@ const Mosaic = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9294
8563
|
thumbnailProps = _objectWithoutProperties(thumbnail, _excluded2$1);
|
|
9295
8564
|
return /*#__PURE__*/React.createElement("div", {
|
|
9296
8565
|
key: index,
|
|
9297
|
-
className: `${CLASSNAME$
|
|
8566
|
+
className: `${CLASSNAME$E}__thumbnail`
|
|
9298
8567
|
}, /*#__PURE__*/React.createElement(Thumbnail, _extends({}, thumbnailProps, {
|
|
9299
8568
|
align: align || Alignment.left,
|
|
9300
8569
|
image: image,
|
|
@@ -9303,12 +8572,12 @@ const Mosaic = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9303
8572
|
fillHeight: true,
|
|
9304
8573
|
onClick: (handleImageClick === null || handleImageClick === void 0 ? void 0 : handleImageClick(index, onClick)) || onClick
|
|
9305
8574
|
})), thumbnails.length > 4 && index === 3 && /*#__PURE__*/React.createElement("div", {
|
|
9306
|
-
className: `${CLASSNAME$
|
|
8575
|
+
className: `${CLASSNAME$E}__overlay`
|
|
9307
8576
|
}, /*#__PURE__*/React.createElement("span", null, "+", thumbnails.length - 4)));
|
|
9308
8577
|
})));
|
|
9309
8578
|
});
|
|
9310
|
-
Mosaic.displayName = COMPONENT_NAME$
|
|
9311
|
-
Mosaic.className = CLASSNAME$
|
|
8579
|
+
Mosaic.displayName = COMPONENT_NAME$H;
|
|
8580
|
+
Mosaic.className = CLASSNAME$E;
|
|
9312
8581
|
Mosaic.defaultProps = DEFAULT_PROPS$v;
|
|
9313
8582
|
|
|
9314
8583
|
const ThemeContext = /*#__PURE__*/createContext(undefined);
|
|
@@ -9318,7 +8587,7 @@ function forwardRefPolymorphic(render) {
|
|
|
9318
8587
|
return /*#__PURE__*/React.forwardRef(render);
|
|
9319
8588
|
}
|
|
9320
8589
|
|
|
9321
|
-
const _excluded$
|
|
8590
|
+
const _excluded$J = ["className", "icon", "label", "isCurrentPage", "as"];
|
|
9322
8591
|
|
|
9323
8592
|
/** Make `href` required when `as` is `a` */
|
|
9324
8593
|
|
|
@@ -9329,12 +8598,12 @@ const _excluded$M = ["className", "icon", "label", "isCurrentPage", "as"];
|
|
|
9329
8598
|
/**
|
|
9330
8599
|
* Component display name.
|
|
9331
8600
|
*/
|
|
9332
|
-
const COMPONENT_NAME$
|
|
8601
|
+
const COMPONENT_NAME$I = 'NavigationItem';
|
|
9333
8602
|
|
|
9334
8603
|
/**
|
|
9335
8604
|
* Component default class name and class prefix.
|
|
9336
8605
|
*/
|
|
9337
|
-
const CLASSNAME$
|
|
8606
|
+
const CLASSNAME$F = getRootClassName(COMPONENT_NAME$I);
|
|
9338
8607
|
const NavigationItem = Object.assign(forwardRefPolymorphic((props, ref) => {
|
|
9339
8608
|
const {
|
|
9340
8609
|
className,
|
|
@@ -9343,7 +8612,7 @@ const NavigationItem = Object.assign(forwardRefPolymorphic((props, ref) => {
|
|
|
9343
8612
|
isCurrentPage,
|
|
9344
8613
|
as: Element = 'a'
|
|
9345
8614
|
} = props,
|
|
9346
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8615
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$J);
|
|
9347
8616
|
const theme = useContext(ThemeContext);
|
|
9348
8617
|
const {
|
|
9349
8618
|
tooltipLabel,
|
|
@@ -9354,7 +8623,7 @@ const NavigationItem = Object.assign(forwardRefPolymorphic((props, ref) => {
|
|
|
9354
8623
|
} : {};
|
|
9355
8624
|
return /*#__PURE__*/React.createElement("li", {
|
|
9356
8625
|
className: classnames(className, handleBasicClasses({
|
|
9357
|
-
prefix: CLASSNAME$
|
|
8626
|
+
prefix: CLASSNAME$F,
|
|
9358
8627
|
theme
|
|
9359
8628
|
}))
|
|
9360
8629
|
}, /*#__PURE__*/React.createElement(Tooltip, {
|
|
@@ -9362,41 +8631,41 @@ const NavigationItem = Object.assign(forwardRefPolymorphic((props, ref) => {
|
|
|
9362
8631
|
placement: Placement.TOP
|
|
9363
8632
|
}, /*#__PURE__*/React.createElement(Element, _extends({
|
|
9364
8633
|
className: handleBasicClasses({
|
|
9365
|
-
prefix: `${CLASSNAME$
|
|
8634
|
+
prefix: `${CLASSNAME$F}__link`,
|
|
9366
8635
|
isSelected: isCurrentPage
|
|
9367
8636
|
}),
|
|
9368
8637
|
ref: ref,
|
|
9369
8638
|
"aria-current": isCurrentPage ? 'page' : undefined
|
|
9370
8639
|
}, buttonProps, forwardedProps), icon ? /*#__PURE__*/React.createElement(Icon, {
|
|
9371
|
-
className: `${CLASSNAME$
|
|
8640
|
+
className: `${CLASSNAME$F}__icon`,
|
|
9372
8641
|
icon: icon,
|
|
9373
8642
|
size: Size.xs,
|
|
9374
8643
|
theme: theme
|
|
9375
8644
|
}) : null, /*#__PURE__*/React.createElement(Text, {
|
|
9376
8645
|
as: "span",
|
|
9377
8646
|
truncate: true,
|
|
9378
|
-
className: `${CLASSNAME$
|
|
8647
|
+
className: `${CLASSNAME$F}__label`,
|
|
9379
8648
|
ref: labelRef
|
|
9380
8649
|
}, label))));
|
|
9381
8650
|
}), {
|
|
9382
|
-
displayName: COMPONENT_NAME$
|
|
9383
|
-
className: CLASSNAME$
|
|
8651
|
+
displayName: COMPONENT_NAME$I,
|
|
8652
|
+
className: CLASSNAME$F
|
|
9384
8653
|
});
|
|
9385
8654
|
|
|
9386
8655
|
const NavigationContext = /*#__PURE__*/createContext({
|
|
9387
8656
|
orientation: Orientation.vertical
|
|
9388
8657
|
});
|
|
9389
8658
|
|
|
9390
|
-
const _excluded$
|
|
8659
|
+
const _excluded$K = ["children", "className", "label", "icon"];
|
|
9391
8660
|
/**
|
|
9392
8661
|
* Component display name.
|
|
9393
8662
|
*/
|
|
9394
|
-
const COMPONENT_NAME$
|
|
8663
|
+
const COMPONENT_NAME$J = 'NavigationSection';
|
|
9395
8664
|
|
|
9396
8665
|
/**
|
|
9397
8666
|
* Component default class name and class prefix.
|
|
9398
8667
|
*/
|
|
9399
|
-
const CLASSNAME$
|
|
8668
|
+
const CLASSNAME$G = getRootClassName(COMPONENT_NAME$J);
|
|
9400
8669
|
const NavigationSection = Object.assign( /*#__PURE__*/forwardRef((props, ref) => {
|
|
9401
8670
|
const {
|
|
9402
8671
|
children,
|
|
@@ -9404,7 +8673,7 @@ const NavigationSection = Object.assign( /*#__PURE__*/forwardRef((props, ref) =>
|
|
|
9404
8673
|
label,
|
|
9405
8674
|
icon
|
|
9406
8675
|
} = props,
|
|
9407
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8676
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$K);
|
|
9408
8677
|
const [isOpen, setIsOpen] = useState(false);
|
|
9409
8678
|
const buttonRef = useRef(null);
|
|
9410
8679
|
const sectionId = useMemo(() => uniqueId('section'), []);
|
|
@@ -9414,15 +8683,15 @@ const NavigationSection = Object.assign( /*#__PURE__*/forwardRef((props, ref) =>
|
|
|
9414
8683
|
const theme = useContext(ThemeContext);
|
|
9415
8684
|
const isDropdown = orientation === Orientation.horizontal;
|
|
9416
8685
|
return /*#__PURE__*/React.createElement("li", _extends({
|
|
9417
|
-
className: classnames(className, CLASSNAME$
|
|
9418
|
-
prefix: CLASSNAME$
|
|
8686
|
+
className: classnames(className, CLASSNAME$G, CLASSNAME$F, handleBasicClasses({
|
|
8687
|
+
prefix: CLASSNAME$F,
|
|
9419
8688
|
theme
|
|
9420
8689
|
})),
|
|
9421
8690
|
ref: ref
|
|
9422
8691
|
}, forwardedProps), /*#__PURE__*/React.createElement("button", {
|
|
9423
8692
|
"aria-controls": sectionId,
|
|
9424
8693
|
"aria-expanded": isOpen,
|
|
9425
|
-
className: classnames(`${CLASSNAME$
|
|
8694
|
+
className: classnames(`${CLASSNAME$F}__link`),
|
|
9426
8695
|
ref: buttonRef,
|
|
9427
8696
|
onClick: event => {
|
|
9428
8697
|
setIsOpen(!isOpen);
|
|
@@ -9430,16 +8699,16 @@ const NavigationSection = Object.assign( /*#__PURE__*/forwardRef((props, ref) =>
|
|
|
9430
8699
|
},
|
|
9431
8700
|
type: "button"
|
|
9432
8701
|
}, icon ? /*#__PURE__*/React.createElement(Icon, {
|
|
9433
|
-
className: `${CLASSNAME$
|
|
8702
|
+
className: `${CLASSNAME$F}__icon`,
|
|
9434
8703
|
icon: icon,
|
|
9435
8704
|
size: Size.xs
|
|
9436
8705
|
}) : null, /*#__PURE__*/React.createElement(Text, {
|
|
9437
8706
|
as: "span",
|
|
9438
8707
|
truncate: true,
|
|
9439
|
-
className: `${CLASSNAME$
|
|
8708
|
+
className: `${CLASSNAME$F}__label`,
|
|
9440
8709
|
ref: ref
|
|
9441
8710
|
}, label), /*#__PURE__*/React.createElement(Icon, {
|
|
9442
|
-
className: classnames(`${CLASSNAME$
|
|
8711
|
+
className: classnames(`${CLASSNAME$F}__icon`, `${CLASSNAME$G}__chevron`),
|
|
9443
8712
|
icon: isOpen ? mdiChevronUp : mdiChevronDown
|
|
9444
8713
|
})), isOpen && (isDropdown ? /*#__PURE__*/React.createElement(Popover, {
|
|
9445
8714
|
anchorRef: buttonRef,
|
|
@@ -9454,31 +8723,31 @@ const NavigationSection = Object.assign( /*#__PURE__*/forwardRef((props, ref) =>
|
|
|
9454
8723
|
}, /*#__PURE__*/React.createElement(ThemeContext.Provider, {
|
|
9455
8724
|
value: Theme.light
|
|
9456
8725
|
}, /*#__PURE__*/React.createElement("ul", {
|
|
9457
|
-
className: `${CLASSNAME$
|
|
8726
|
+
className: `${CLASSNAME$G}__drawer--popover`,
|
|
9458
8727
|
id: sectionId
|
|
9459
8728
|
}, /*#__PURE__*/React.createElement(NavigationContext.Provider, {
|
|
9460
8729
|
value: {
|
|
9461
8730
|
orientation: Orientation.vertical
|
|
9462
8731
|
}
|
|
9463
8732
|
}, children)))) : /*#__PURE__*/React.createElement("ul", {
|
|
9464
|
-
className: `${CLASSNAME$
|
|
8733
|
+
className: `${CLASSNAME$G}__drawer`,
|
|
9465
8734
|
id: sectionId
|
|
9466
8735
|
}, children)));
|
|
9467
8736
|
}), {
|
|
9468
|
-
displayName: COMPONENT_NAME$
|
|
9469
|
-
className: CLASSNAME$
|
|
8737
|
+
displayName: COMPONENT_NAME$J,
|
|
8738
|
+
className: CLASSNAME$G
|
|
9470
8739
|
});
|
|
9471
8740
|
|
|
9472
|
-
const _excluded$
|
|
8741
|
+
const _excluded$L = ["children", "className", "theme", "orientation"];
|
|
9473
8742
|
/**
|
|
9474
8743
|
* Component display name.
|
|
9475
8744
|
*/
|
|
9476
|
-
const COMPONENT_NAME$
|
|
8745
|
+
const COMPONENT_NAME$K = 'Navigation';
|
|
9477
8746
|
|
|
9478
8747
|
/**
|
|
9479
8748
|
* Component default class name and class prefix.
|
|
9480
8749
|
*/
|
|
9481
|
-
const CLASSNAME$
|
|
8750
|
+
const CLASSNAME$H = getRootClassName(COMPONENT_NAME$K);
|
|
9482
8751
|
const Navigation = Object.assign(
|
|
9483
8752
|
/*#__PURE__*/
|
|
9484
8753
|
// eslint-disable-next-line react/display-name
|
|
@@ -9489,12 +8758,12 @@ forwardRef((props, ref) => {
|
|
|
9489
8758
|
theme,
|
|
9490
8759
|
orientation
|
|
9491
8760
|
} = props,
|
|
9492
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8761
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$L);
|
|
9493
8762
|
return /*#__PURE__*/React.createElement(ThemeContext.Provider, {
|
|
9494
8763
|
value: theme
|
|
9495
8764
|
}, /*#__PURE__*/React.createElement("nav", _extends({
|
|
9496
8765
|
className: classnames(className, handleBasicClasses({
|
|
9497
|
-
prefix: CLASSNAME$
|
|
8766
|
+
prefix: CLASSNAME$H,
|
|
9498
8767
|
theme,
|
|
9499
8768
|
orientation
|
|
9500
8769
|
})),
|
|
@@ -9504,11 +8773,11 @@ forwardRef((props, ref) => {
|
|
|
9504
8773
|
orientation
|
|
9505
8774
|
}
|
|
9506
8775
|
}, /*#__PURE__*/React.createElement("ul", {
|
|
9507
|
-
className: `${CLASSNAME$
|
|
8776
|
+
className: `${CLASSNAME$H}__list`
|
|
9508
8777
|
}, children))));
|
|
9509
8778
|
}), {
|
|
9510
|
-
displayName: COMPONENT_NAME$
|
|
9511
|
-
className: CLASSNAME$
|
|
8779
|
+
displayName: COMPONENT_NAME$K,
|
|
8780
|
+
className: CLASSNAME$H,
|
|
9512
8781
|
defaultProps: {
|
|
9513
8782
|
theme: Theme.light,
|
|
9514
8783
|
orientation: Orientation.vertical
|
|
@@ -9540,7 +8809,7 @@ const NOTIFICATION_CONFIGURATION = {
|
|
|
9540
8809
|
}
|
|
9541
8810
|
};
|
|
9542
8811
|
|
|
9543
|
-
const _excluded$
|
|
8812
|
+
const _excluded$M = ["actionLabel", "className", "content", "isOpen", "onActionClick", "onClick", "theme", "type", "zIndex", "usePortal", "style"];
|
|
9544
8813
|
|
|
9545
8814
|
/**
|
|
9546
8815
|
* Defines the props of the component.
|
|
@@ -9549,12 +8818,12 @@ const _excluded$P = ["actionLabel", "className", "content", "isOpen", "onActionC
|
|
|
9549
8818
|
/**
|
|
9550
8819
|
* Component display name.
|
|
9551
8820
|
*/
|
|
9552
|
-
const COMPONENT_NAME$
|
|
8821
|
+
const COMPONENT_NAME$L = 'Notification';
|
|
9553
8822
|
|
|
9554
8823
|
/**
|
|
9555
8824
|
* Component default class name and class prefix.
|
|
9556
8825
|
*/
|
|
9557
|
-
const CLASSNAME$
|
|
8826
|
+
const CLASSNAME$I = getRootClassName(COMPONENT_NAME$L);
|
|
9558
8827
|
|
|
9559
8828
|
/**
|
|
9560
8829
|
* Component default props.
|
|
@@ -9587,7 +8856,7 @@ const Notification = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9587
8856
|
usePortal,
|
|
9588
8857
|
style
|
|
9589
8858
|
} = props,
|
|
9590
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8859
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$M);
|
|
9591
8860
|
if (!DOCUMENT) {
|
|
9592
8861
|
// Can't render in SSR.
|
|
9593
8862
|
return null;
|
|
@@ -9619,21 +8888,21 @@ const Notification = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9619
8888
|
color,
|
|
9620
8889
|
hasAction,
|
|
9621
8890
|
isHidden: !isOpen,
|
|
9622
|
-
prefix: CLASSNAME$
|
|
8891
|
+
prefix: CLASSNAME$I
|
|
9623
8892
|
})),
|
|
9624
8893
|
onClick: onClick,
|
|
9625
8894
|
style: _objectSpread2(_objectSpread2({}, style), {}, {
|
|
9626
8895
|
zIndex
|
|
9627
8896
|
})
|
|
9628
8897
|
}), /*#__PURE__*/React.createElement("div", {
|
|
9629
|
-
className: `${CLASSNAME$
|
|
8898
|
+
className: `${CLASSNAME$I}__icon`
|
|
9630
8899
|
}, /*#__PURE__*/React.createElement(Icon, {
|
|
9631
8900
|
icon: icon,
|
|
9632
8901
|
size: Size.s
|
|
9633
8902
|
})), /*#__PURE__*/React.createElement("div", {
|
|
9634
|
-
className: `${CLASSNAME$
|
|
8903
|
+
className: `${CLASSNAME$I}__content`
|
|
9635
8904
|
}, content), hasAction && /*#__PURE__*/React.createElement("div", {
|
|
9636
|
-
className: `${CLASSNAME$
|
|
8905
|
+
className: `${CLASSNAME$I}__action`
|
|
9637
8906
|
}, /*#__PURE__*/React.createElement(Button, {
|
|
9638
8907
|
emphasis: Emphasis.medium,
|
|
9639
8908
|
theme: theme,
|
|
@@ -9641,11 +8910,11 @@ const Notification = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9641
8910
|
}, /*#__PURE__*/React.createElement("span", null, actionLabel))));
|
|
9642
8911
|
return usePortal ? /*#__PURE__*/createPortal(notification, document.body) : notification;
|
|
9643
8912
|
});
|
|
9644
|
-
Notification.displayName = COMPONENT_NAME$
|
|
9645
|
-
Notification.className = CLASSNAME$
|
|
8913
|
+
Notification.displayName = COMPONENT_NAME$L;
|
|
8914
|
+
Notification.className = CLASSNAME$I;
|
|
9646
8915
|
Notification.defaultProps = DEFAULT_PROPS$w;
|
|
9647
8916
|
|
|
9648
|
-
const _excluded$
|
|
8917
|
+
const _excluded$N = ["children", "isOpen", "focusElement", "aria-label", "label", "className"];
|
|
9649
8918
|
|
|
9650
8919
|
/**
|
|
9651
8920
|
* PopoverDialog props.
|
|
@@ -9655,12 +8924,12 @@ const _excluded$Q = ["children", "isOpen", "focusElement", "aria-label", "label"
|
|
|
9655
8924
|
/**
|
|
9656
8925
|
* Component display name.
|
|
9657
8926
|
*/
|
|
9658
|
-
const COMPONENT_NAME$
|
|
8927
|
+
const COMPONENT_NAME$M = 'PopoverDialog';
|
|
9659
8928
|
|
|
9660
8929
|
/**
|
|
9661
8930
|
* Component default class name and class prefix.
|
|
9662
8931
|
*/
|
|
9663
|
-
const CLASSNAME$
|
|
8932
|
+
const CLASSNAME$J = getRootClassName(COMPONENT_NAME$M);
|
|
9664
8933
|
|
|
9665
8934
|
/**
|
|
9666
8935
|
* Component default props.
|
|
@@ -9683,11 +8952,11 @@ const PopoverDialog = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9683
8952
|
label = ariaLabel,
|
|
9684
8953
|
className
|
|
9685
8954
|
} = props,
|
|
9686
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8955
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$N);
|
|
9687
8956
|
return /*#__PURE__*/React.createElement(Popover, _extends({}, forwardedProps, {
|
|
9688
8957
|
ref: ref,
|
|
9689
8958
|
className: classnames(className, handleBasicClasses({
|
|
9690
|
-
prefix: CLASSNAME$
|
|
8959
|
+
prefix: CLASSNAME$J
|
|
9691
8960
|
})),
|
|
9692
8961
|
role: "dialog",
|
|
9693
8962
|
"aria-modal": "true"
|
|
@@ -9703,11 +8972,11 @@ const PopoverDialog = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9703
8972
|
withFocusTrap: true
|
|
9704
8973
|
}), children);
|
|
9705
8974
|
});
|
|
9706
|
-
PopoverDialog.displayName = COMPONENT_NAME$
|
|
9707
|
-
PopoverDialog.className = CLASSNAME$
|
|
8975
|
+
PopoverDialog.displayName = COMPONENT_NAME$M;
|
|
8976
|
+
PopoverDialog.className = CLASSNAME$J;
|
|
9708
8977
|
PopoverDialog.defaultProps = DEFAULT_PROPS$x;
|
|
9709
8978
|
|
|
9710
|
-
const _excluded$
|
|
8979
|
+
const _excluded$O = ["actions", "attachments", "author", "className", "meta", "onClick", "orientation", "tags", "text", "theme", "thumbnailProps", "title"];
|
|
9711
8980
|
|
|
9712
8981
|
/**
|
|
9713
8982
|
* Defines the props of the component.
|
|
@@ -9716,12 +8985,12 @@ const _excluded$R = ["actions", "attachments", "author", "className", "meta", "o
|
|
|
9716
8985
|
/**
|
|
9717
8986
|
* Component display name.
|
|
9718
8987
|
*/
|
|
9719
|
-
const COMPONENT_NAME$
|
|
8988
|
+
const COMPONENT_NAME$N = 'PostBlock';
|
|
9720
8989
|
|
|
9721
8990
|
/**
|
|
9722
8991
|
* Component default class name and class prefix.
|
|
9723
8992
|
*/
|
|
9724
|
-
const CLASSNAME$
|
|
8993
|
+
const CLASSNAME$K = getRootClassName(COMPONENT_NAME$N);
|
|
9725
8994
|
|
|
9726
8995
|
/**
|
|
9727
8996
|
* Component default props.
|
|
@@ -9753,61 +9022,61 @@ const PostBlock = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9753
9022
|
thumbnailProps,
|
|
9754
9023
|
title
|
|
9755
9024
|
} = props,
|
|
9756
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
9025
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$O);
|
|
9757
9026
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
9758
9027
|
ref: ref,
|
|
9759
9028
|
className: classnames(className, handleBasicClasses({
|
|
9760
|
-
prefix: CLASSNAME$
|
|
9029
|
+
prefix: CLASSNAME$K,
|
|
9761
9030
|
orientation,
|
|
9762
9031
|
theme
|
|
9763
9032
|
}))
|
|
9764
9033
|
}, forwardedProps), thumbnailProps && /*#__PURE__*/React.createElement("div", {
|
|
9765
|
-
className: `${CLASSNAME$
|
|
9034
|
+
className: `${CLASSNAME$K}__thumbnail`
|
|
9766
9035
|
}, /*#__PURE__*/React.createElement(Thumbnail, _extends({}, thumbnailProps, {
|
|
9767
9036
|
theme: theme,
|
|
9768
9037
|
variant: ThumbnailVariant.rounded
|
|
9769
9038
|
}))), /*#__PURE__*/React.createElement("div", {
|
|
9770
|
-
className: `${CLASSNAME$
|
|
9039
|
+
className: `${CLASSNAME$K}__wrapper`
|
|
9771
9040
|
}, author && /*#__PURE__*/React.createElement("div", {
|
|
9772
|
-
className: `${CLASSNAME$
|
|
9041
|
+
className: `${CLASSNAME$K}__author`
|
|
9773
9042
|
}, author), title && /*#__PURE__*/React.createElement("button", {
|
|
9774
9043
|
type: "button",
|
|
9775
|
-
className: `${CLASSNAME$
|
|
9044
|
+
className: `${CLASSNAME$K}__title`,
|
|
9776
9045
|
onClick: onClick
|
|
9777
9046
|
}, title), meta && /*#__PURE__*/React.createElement("span", {
|
|
9778
|
-
className: `${CLASSNAME$
|
|
9047
|
+
className: `${CLASSNAME$K}__meta`
|
|
9779
9048
|
}, meta), isObject(text) && text.__html ?
|
|
9780
9049
|
/*#__PURE__*/
|
|
9781
9050
|
// eslint-disable-next-line react/no-danger
|
|
9782
9051
|
React.createElement("p", {
|
|
9783
9052
|
dangerouslySetInnerHTML: text,
|
|
9784
|
-
className: `${CLASSNAME$
|
|
9053
|
+
className: `${CLASSNAME$K}__text`
|
|
9785
9054
|
}) : /*#__PURE__*/React.createElement("p", {
|
|
9786
|
-
className: `${CLASSNAME$
|
|
9055
|
+
className: `${CLASSNAME$K}__text`
|
|
9787
9056
|
}, text), attachments && /*#__PURE__*/React.createElement("div", {
|
|
9788
|
-
className: `${CLASSNAME$
|
|
9057
|
+
className: `${CLASSNAME$K}__attachments`
|
|
9789
9058
|
}, attachments), (tags || actions) && /*#__PURE__*/React.createElement("div", {
|
|
9790
|
-
className: `${CLASSNAME$
|
|
9059
|
+
className: `${CLASSNAME$K}__toolbar`
|
|
9791
9060
|
}, tags && /*#__PURE__*/React.createElement("div", {
|
|
9792
|
-
className: `${CLASSNAME$
|
|
9061
|
+
className: `${CLASSNAME$K}__tags`
|
|
9793
9062
|
}, tags), actions && /*#__PURE__*/React.createElement("div", {
|
|
9794
|
-
className: `${CLASSNAME$
|
|
9063
|
+
className: `${CLASSNAME$K}__actions`
|
|
9795
9064
|
}, actions))));
|
|
9796
9065
|
});
|
|
9797
|
-
PostBlock.displayName = COMPONENT_NAME$
|
|
9798
|
-
PostBlock.className = CLASSNAME$
|
|
9066
|
+
PostBlock.displayName = COMPONENT_NAME$N;
|
|
9067
|
+
PostBlock.className = CLASSNAME$K;
|
|
9799
9068
|
PostBlock.defaultProps = DEFAULT_PROPS$y;
|
|
9800
9069
|
|
|
9801
|
-
const _excluded$
|
|
9070
|
+
const _excluded$P = ["className", "theme"];
|
|
9802
9071
|
/**
|
|
9803
9072
|
* Component display name.
|
|
9804
9073
|
*/
|
|
9805
|
-
const COMPONENT_NAME$
|
|
9074
|
+
const COMPONENT_NAME$O = 'ProgressLinear';
|
|
9806
9075
|
|
|
9807
9076
|
/**
|
|
9808
9077
|
* Component default class name and class prefix.
|
|
9809
9078
|
*/
|
|
9810
|
-
const CLASSNAME$
|
|
9079
|
+
const CLASSNAME$L = getRootClassName(COMPONENT_NAME$O);
|
|
9811
9080
|
|
|
9812
9081
|
/**
|
|
9813
9082
|
* Component default props.
|
|
@@ -9828,12 +9097,12 @@ const ProgressLinear = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9828
9097
|
className,
|
|
9829
9098
|
theme
|
|
9830
9099
|
} = props,
|
|
9831
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
9100
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$P);
|
|
9832
9101
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
9833
9102
|
ref: ref
|
|
9834
9103
|
}, forwardedProps, {
|
|
9835
9104
|
className: classnames(className, handleBasicClasses({
|
|
9836
|
-
prefix: CLASSNAME$
|
|
9105
|
+
prefix: CLASSNAME$L,
|
|
9837
9106
|
theme
|
|
9838
9107
|
}))
|
|
9839
9108
|
}), /*#__PURE__*/React.createElement("div", {
|
|
@@ -9842,11 +9111,11 @@ const ProgressLinear = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9842
9111
|
className: "lumx-progress-linear__line2"
|
|
9843
9112
|
}));
|
|
9844
9113
|
});
|
|
9845
|
-
ProgressLinear.displayName = COMPONENT_NAME$
|
|
9846
|
-
ProgressLinear.className = CLASSNAME$
|
|
9114
|
+
ProgressLinear.displayName = COMPONENT_NAME$O;
|
|
9115
|
+
ProgressLinear.className = CLASSNAME$L;
|
|
9847
9116
|
ProgressLinear.defaultProps = DEFAULT_PROPS$z;
|
|
9848
9117
|
|
|
9849
|
-
const _excluded$
|
|
9118
|
+
const _excluded$Q = ["className", "theme", "size"];
|
|
9850
9119
|
|
|
9851
9120
|
/**
|
|
9852
9121
|
* Progress sizes.
|
|
@@ -9859,12 +9128,12 @@ const _excluded$T = ["className", "theme", "size"];
|
|
|
9859
9128
|
/**
|
|
9860
9129
|
* Component display name.
|
|
9861
9130
|
*/
|
|
9862
|
-
const COMPONENT_NAME$
|
|
9131
|
+
const COMPONENT_NAME$P = 'ProgressCircular';
|
|
9863
9132
|
|
|
9864
9133
|
/**
|
|
9865
9134
|
* Component default class name and class prefix.
|
|
9866
9135
|
*/
|
|
9867
|
-
const CLASSNAME$
|
|
9136
|
+
const CLASSNAME$M = getRootClassName(COMPONENT_NAME$P);
|
|
9868
9137
|
|
|
9869
9138
|
/**
|
|
9870
9139
|
* Component default props.
|
|
@@ -9887,12 +9156,12 @@ const ProgressCircular = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9887
9156
|
theme,
|
|
9888
9157
|
size
|
|
9889
9158
|
} = props,
|
|
9890
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
9159
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$Q);
|
|
9891
9160
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
9892
9161
|
ref: ref
|
|
9893
9162
|
}, forwardedProps, {
|
|
9894
9163
|
className: classnames(className, handleBasicClasses({
|
|
9895
|
-
prefix: CLASSNAME$
|
|
9164
|
+
prefix: CLASSNAME$M,
|
|
9896
9165
|
theme,
|
|
9897
9166
|
size
|
|
9898
9167
|
}))
|
|
@@ -9912,11 +9181,11 @@ const ProgressCircular = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9912
9181
|
strokeWidth: "5"
|
|
9913
9182
|
})));
|
|
9914
9183
|
});
|
|
9915
|
-
ProgressCircular.displayName = COMPONENT_NAME$
|
|
9916
|
-
ProgressCircular.className = CLASSNAME$
|
|
9184
|
+
ProgressCircular.displayName = COMPONENT_NAME$P;
|
|
9185
|
+
ProgressCircular.className = CLASSNAME$M;
|
|
9917
9186
|
ProgressCircular.defaultProps = DEFAULT_PROPS$A;
|
|
9918
9187
|
|
|
9919
|
-
const _excluded$
|
|
9188
|
+
const _excluded$R = ["className", "theme", "variant"];
|
|
9920
9189
|
|
|
9921
9190
|
/**
|
|
9922
9191
|
* Progress variants.
|
|
@@ -9933,12 +9202,12 @@ const ProgressVariant = {
|
|
|
9933
9202
|
/**
|
|
9934
9203
|
* Component display name.
|
|
9935
9204
|
*/
|
|
9936
|
-
const COMPONENT_NAME$
|
|
9205
|
+
const COMPONENT_NAME$Q = 'Progress';
|
|
9937
9206
|
|
|
9938
9207
|
/**
|
|
9939
9208
|
* Component default class name and class prefix.
|
|
9940
9209
|
*/
|
|
9941
|
-
const CLASSNAME$
|
|
9210
|
+
const CLASSNAME$N = getRootClassName(COMPONENT_NAME$Q);
|
|
9942
9211
|
|
|
9943
9212
|
/**
|
|
9944
9213
|
* Component default props.
|
|
@@ -9962,12 +9231,12 @@ const Progress = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9962
9231
|
theme,
|
|
9963
9232
|
variant
|
|
9964
9233
|
} = props,
|
|
9965
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
9234
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$R);
|
|
9966
9235
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
9967
9236
|
ref: ref
|
|
9968
9237
|
}, forwardedProps, {
|
|
9969
9238
|
className: classnames(className, handleBasicClasses({
|
|
9970
|
-
prefix: CLASSNAME$
|
|
9239
|
+
prefix: CLASSNAME$N,
|
|
9971
9240
|
theme,
|
|
9972
9241
|
variant
|
|
9973
9242
|
}))
|
|
@@ -9977,8 +9246,8 @@ const Progress = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9977
9246
|
theme: theme
|
|
9978
9247
|
}));
|
|
9979
9248
|
});
|
|
9980
|
-
Progress.displayName = COMPONENT_NAME$
|
|
9981
|
-
Progress.className = CLASSNAME$
|
|
9249
|
+
Progress.displayName = COMPONENT_NAME$Q;
|
|
9250
|
+
Progress.className = CLASSNAME$N;
|
|
9982
9251
|
Progress.defaultProps = DEFAULT_PROPS$B;
|
|
9983
9252
|
|
|
9984
9253
|
const INIT_STATE = {
|
|
@@ -10100,7 +9369,7 @@ const useTabProviderContextState = () => {
|
|
|
10100
9369
|
return context === null || context === void 0 ? void 0 : context[0];
|
|
10101
9370
|
};
|
|
10102
9371
|
|
|
10103
|
-
const _excluded$
|
|
9372
|
+
const _excluded$S = ["children", "onChange"];
|
|
10104
9373
|
const DEFAULT_PROPS$C = {
|
|
10105
9374
|
isLazy: INIT_STATE.isLazy,
|
|
10106
9375
|
shouldActivateOnFocus: INIT_STATE.shouldActivateOnFocus
|
|
@@ -10122,7 +9391,7 @@ const ProgressTrackerProvider = props => {
|
|
|
10122
9391
|
children,
|
|
10123
9392
|
onChange
|
|
10124
9393
|
} = props,
|
|
10125
|
-
propState = _objectWithoutProperties(props, _excluded$
|
|
9394
|
+
propState = _objectWithoutProperties(props, _excluded$S);
|
|
10126
9395
|
const [state, dispatch] = useReducer(reducer, INIT_STATE);
|
|
10127
9396
|
|
|
10128
9397
|
// On prop state change => dispatch update.
|
|
@@ -10226,7 +9495,7 @@ const useRovingTabIndex = _ref => {
|
|
|
10226
9495
|
[parentRef, ...extraDependencies]);
|
|
10227
9496
|
};
|
|
10228
9497
|
|
|
10229
|
-
const _excluded$
|
|
9498
|
+
const _excluded$T = ["aria-label", "children", "className"];
|
|
10230
9499
|
|
|
10231
9500
|
/**
|
|
10232
9501
|
* Defines the props of the component.
|
|
@@ -10235,12 +9504,12 @@ const _excluded$W = ["aria-label", "children", "className"];
|
|
|
10235
9504
|
/**
|
|
10236
9505
|
* Component display name.
|
|
10237
9506
|
*/
|
|
10238
|
-
const COMPONENT_NAME$
|
|
9507
|
+
const COMPONENT_NAME$R = 'ProgressTracker';
|
|
10239
9508
|
|
|
10240
9509
|
/**
|
|
10241
9510
|
* Component default class name and class prefix.
|
|
10242
9511
|
*/
|
|
10243
|
-
const CLASSNAME$
|
|
9512
|
+
const CLASSNAME$O = getRootClassName(COMPONENT_NAME$R);
|
|
10244
9513
|
|
|
10245
9514
|
/**
|
|
10246
9515
|
* Component default props.
|
|
@@ -10263,7 +9532,7 @@ const ProgressTracker = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10263
9532
|
children,
|
|
10264
9533
|
className
|
|
10265
9534
|
} = props,
|
|
10266
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
9535
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$T);
|
|
10267
9536
|
const stepListRef = React.useRef(null);
|
|
10268
9537
|
useRovingTabIndex({
|
|
10269
9538
|
parentRef: stepListRef,
|
|
@@ -10279,20 +9548,20 @@ const ProgressTracker = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10279
9548
|
ref: mergeRefs(ref, stepListRef)
|
|
10280
9549
|
}, forwardedProps, {
|
|
10281
9550
|
className: classnames(className, handleBasicClasses({
|
|
10282
|
-
prefix: CLASSNAME$
|
|
9551
|
+
prefix: CLASSNAME$O
|
|
10283
9552
|
}))
|
|
10284
9553
|
}), /*#__PURE__*/React.createElement("div", {
|
|
10285
|
-
className: `${CLASSNAME$
|
|
9554
|
+
className: `${CLASSNAME$O}__steps`,
|
|
10286
9555
|
role: "tablist",
|
|
10287
9556
|
"aria-label": ariaLabel
|
|
10288
9557
|
}, children), /*#__PURE__*/React.createElement("div", {
|
|
10289
|
-
className: `${CLASSNAME$
|
|
9558
|
+
className: `${CLASSNAME$O}__background-bar`,
|
|
10290
9559
|
style: {
|
|
10291
9560
|
left: `${backgroundPosition}%`,
|
|
10292
9561
|
right: `${backgroundPosition}%`
|
|
10293
9562
|
}
|
|
10294
9563
|
}), /*#__PURE__*/React.createElement("div", {
|
|
10295
|
-
className: `${CLASSNAME$
|
|
9564
|
+
className: `${CLASSNAME$O}__foreground-bar`,
|
|
10296
9565
|
style: {
|
|
10297
9566
|
left: `${backgroundPosition}%`,
|
|
10298
9567
|
right: `${backgroundPosition}%`,
|
|
@@ -10300,11 +9569,11 @@ const ProgressTracker = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10300
9569
|
}
|
|
10301
9570
|
}));
|
|
10302
9571
|
});
|
|
10303
|
-
ProgressTracker.displayName = COMPONENT_NAME$
|
|
10304
|
-
ProgressTracker.className = CLASSNAME$
|
|
9572
|
+
ProgressTracker.displayName = COMPONENT_NAME$R;
|
|
9573
|
+
ProgressTracker.className = CLASSNAME$O;
|
|
10305
9574
|
ProgressTracker.defaultProps = DEFAULT_PROPS$D;
|
|
10306
9575
|
|
|
10307
|
-
const _excluded$
|
|
9576
|
+
const _excluded$U = ["className", "disabled", "hasError", "helper", "id", "isActive", "isComplete", "isDisabled", "label", "onFocus", "onKeyPress", "tabIndex"];
|
|
10308
9577
|
|
|
10309
9578
|
/**
|
|
10310
9579
|
* Defines the props of the component.
|
|
@@ -10313,12 +9582,12 @@ const _excluded$X = ["className", "disabled", "hasError", "helper", "id", "isAct
|
|
|
10313
9582
|
/**
|
|
10314
9583
|
* Component display name.
|
|
10315
9584
|
*/
|
|
10316
|
-
const COMPONENT_NAME$
|
|
9585
|
+
const COMPONENT_NAME$S = 'ProgressTrackerStep';
|
|
10317
9586
|
|
|
10318
9587
|
/**
|
|
10319
9588
|
* Component default class name and class prefix.
|
|
10320
9589
|
*/
|
|
10321
|
-
const CLASSNAME$
|
|
9590
|
+
const CLASSNAME$P = getRootClassName(COMPONENT_NAME$S);
|
|
10322
9591
|
|
|
10323
9592
|
/**
|
|
10324
9593
|
* Component default props.
|
|
@@ -10349,7 +9618,7 @@ const ProgressTrackerStep = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10349
9618
|
onKeyPress,
|
|
10350
9619
|
tabIndex = -1
|
|
10351
9620
|
} = props,
|
|
10352
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
9621
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$U);
|
|
10353
9622
|
const state = useTabProviderContext('tab', id);
|
|
10354
9623
|
const isActive = propIsActive || (state === null || state === void 0 ? void 0 : state.isActive);
|
|
10355
9624
|
const changeToCurrentTab = useCallback(() => {
|
|
@@ -10386,7 +9655,7 @@ const ProgressTrackerStep = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10386
9655
|
type: "button",
|
|
10387
9656
|
id: state === null || state === void 0 ? void 0 : state.tabId,
|
|
10388
9657
|
className: classnames(className, handleBasicClasses({
|
|
10389
|
-
prefix: CLASSNAME$
|
|
9658
|
+
prefix: CLASSNAME$P,
|
|
10390
9659
|
hasError,
|
|
10391
9660
|
isActive,
|
|
10392
9661
|
isClickable: state && !isDisabled,
|
|
@@ -10401,22 +9670,22 @@ const ProgressTrackerStep = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10401
9670
|
"aria-selected": isActive,
|
|
10402
9671
|
"aria-controls": state === null || state === void 0 ? void 0 : state.tabPanelId
|
|
10403
9672
|
}), /*#__PURE__*/React.createElement(Icon, {
|
|
10404
|
-
className: `${CLASSNAME$
|
|
9673
|
+
className: `${CLASSNAME$P}__state`,
|
|
10405
9674
|
icon: getIcon(),
|
|
10406
9675
|
size: Size.s
|
|
10407
9676
|
}), /*#__PURE__*/React.createElement(InputLabel, {
|
|
10408
9677
|
htmlFor: (state === null || state === void 0 ? void 0 : state.tabId) || '',
|
|
10409
|
-
className: `${CLASSNAME$
|
|
9678
|
+
className: `${CLASSNAME$P}__label`
|
|
10410
9679
|
}, label), helper && /*#__PURE__*/React.createElement(InputHelper, {
|
|
10411
9680
|
kind: hasError ? Kind.error : Kind.info,
|
|
10412
|
-
className: `${CLASSNAME$
|
|
9681
|
+
className: `${CLASSNAME$P}__helper`
|
|
10413
9682
|
}, helper));
|
|
10414
9683
|
});
|
|
10415
|
-
ProgressTrackerStep.displayName = COMPONENT_NAME$
|
|
10416
|
-
ProgressTrackerStep.className = CLASSNAME$
|
|
9684
|
+
ProgressTrackerStep.displayName = COMPONENT_NAME$S;
|
|
9685
|
+
ProgressTrackerStep.className = CLASSNAME$P;
|
|
10417
9686
|
ProgressTrackerStep.defaultProps = DEFAULT_PROPS$E;
|
|
10418
9687
|
|
|
10419
|
-
const _excluded$
|
|
9688
|
+
const _excluded$V = ["children", "id", "className", "isActive"];
|
|
10420
9689
|
|
|
10421
9690
|
/**
|
|
10422
9691
|
* Defines the props of the component.
|
|
@@ -10425,12 +9694,12 @@ const _excluded$Y = ["children", "id", "className", "isActive"];
|
|
|
10425
9694
|
/**
|
|
10426
9695
|
* Component display name.
|
|
10427
9696
|
*/
|
|
10428
|
-
const COMPONENT_NAME$
|
|
9697
|
+
const COMPONENT_NAME$T = 'ProgressTrackerStepPanel';
|
|
10429
9698
|
|
|
10430
9699
|
/**
|
|
10431
9700
|
* Component default class name and class prefix.
|
|
10432
9701
|
*/
|
|
10433
|
-
const CLASSNAME$
|
|
9702
|
+
const CLASSNAME$Q = `${CSS_PREFIX}-step-panel`;
|
|
10434
9703
|
|
|
10435
9704
|
/**
|
|
10436
9705
|
* Component default props.
|
|
@@ -10453,7 +9722,7 @@ const ProgressTrackerStepPanel = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10453
9722
|
className,
|
|
10454
9723
|
isActive: propIsActive
|
|
10455
9724
|
} = props,
|
|
10456
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
9725
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$V);
|
|
10457
9726
|
const state = useTabProviderContext('tabPanel', id);
|
|
10458
9727
|
const isActive = propIsActive || (state === null || state === void 0 ? void 0 : state.isActive);
|
|
10459
9728
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
@@ -10461,7 +9730,7 @@ const ProgressTrackerStepPanel = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10461
9730
|
}, forwardedProps, {
|
|
10462
9731
|
id: state === null || state === void 0 ? void 0 : state.tabPanelId,
|
|
10463
9732
|
className: classnames(className, handleBasicClasses({
|
|
10464
|
-
prefix: CLASSNAME$
|
|
9733
|
+
prefix: CLASSNAME$Q,
|
|
10465
9734
|
isActive
|
|
10466
9735
|
})),
|
|
10467
9736
|
role: "tabpanel",
|
|
@@ -10469,11 +9738,11 @@ const ProgressTrackerStepPanel = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10469
9738
|
"aria-labelledby": state === null || state === void 0 ? void 0 : state.tabId
|
|
10470
9739
|
}), (!(state !== null && state !== void 0 && state.isLazy) || isActive) && children);
|
|
10471
9740
|
});
|
|
10472
|
-
ProgressTrackerStepPanel.displayName = COMPONENT_NAME$
|
|
10473
|
-
ProgressTrackerStepPanel.className = CLASSNAME$
|
|
9741
|
+
ProgressTrackerStepPanel.displayName = COMPONENT_NAME$T;
|
|
9742
|
+
ProgressTrackerStepPanel.className = CLASSNAME$Q;
|
|
10474
9743
|
ProgressTrackerStepPanel.defaultProps = DEFAULT_PROPS$F;
|
|
10475
9744
|
|
|
10476
|
-
const _excluded$
|
|
9745
|
+
const _excluded$W = ["checked", "className", "disabled", "helper", "id", "inputRef", "isChecked", "isDisabled", "label", "name", "onChange", "theme", "value", "inputProps"];
|
|
10477
9746
|
|
|
10478
9747
|
/**
|
|
10479
9748
|
* Defines the props of the component.
|
|
@@ -10482,12 +9751,12 @@ const _excluded$Z = ["checked", "className", "disabled", "helper", "id", "inputR
|
|
|
10482
9751
|
/**
|
|
10483
9752
|
* Component display name.
|
|
10484
9753
|
*/
|
|
10485
|
-
const COMPONENT_NAME$
|
|
9754
|
+
const COMPONENT_NAME$U = 'RadioButton';
|
|
10486
9755
|
|
|
10487
9756
|
/**
|
|
10488
9757
|
* Component default class name and class prefix.
|
|
10489
9758
|
*/
|
|
10490
|
-
const CLASSNAME$
|
|
9759
|
+
const CLASSNAME$R = getRootClassName(COMPONENT_NAME$U);
|
|
10491
9760
|
|
|
10492
9761
|
/**
|
|
10493
9762
|
* Component default props.
|
|
@@ -10520,8 +9789,8 @@ const RadioButton = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10520
9789
|
value,
|
|
10521
9790
|
inputProps
|
|
10522
9791
|
} = props,
|
|
10523
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
10524
|
-
const inputId = useMemo(() => id || `${CLASSNAME$
|
|
9792
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$W);
|
|
9793
|
+
const inputId = useMemo(() => id || `${CLASSNAME$R.toLowerCase()}-${uid()}`, [id]);
|
|
10525
9794
|
const handleChange = event => {
|
|
10526
9795
|
if (onChange) {
|
|
10527
9796
|
onChange(value, name, event);
|
|
@@ -10534,14 +9803,14 @@ const RadioButton = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10534
9803
|
isChecked,
|
|
10535
9804
|
isDisabled,
|
|
10536
9805
|
isUnchecked: !isChecked,
|
|
10537
|
-
prefix: CLASSNAME$
|
|
9806
|
+
prefix: CLASSNAME$R,
|
|
10538
9807
|
theme
|
|
10539
9808
|
}))
|
|
10540
9809
|
}), /*#__PURE__*/React.createElement("div", {
|
|
10541
|
-
className: `${CLASSNAME$
|
|
9810
|
+
className: `${CLASSNAME$R}__input-wrapper`
|
|
10542
9811
|
}, /*#__PURE__*/React.createElement("input", _extends({
|
|
10543
9812
|
ref: inputRef,
|
|
10544
|
-
className: `${CLASSNAME$
|
|
9813
|
+
className: `${CLASSNAME$R}__input-native`,
|
|
10545
9814
|
disabled: isDisabled,
|
|
10546
9815
|
id: inputId,
|
|
10547
9816
|
tabIndex: isDisabled ? -1 : 0,
|
|
@@ -10552,28 +9821,28 @@ const RadioButton = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10552
9821
|
onChange: handleChange,
|
|
10553
9822
|
"aria-describedby": helper ? `${inputId}-helper` : undefined
|
|
10554
9823
|
}, inputProps)), /*#__PURE__*/React.createElement("div", {
|
|
10555
|
-
className: `${CLASSNAME$
|
|
9824
|
+
className: `${CLASSNAME$R}__input-placeholder`
|
|
10556
9825
|
}, /*#__PURE__*/React.createElement("div", {
|
|
10557
|
-
className: `${CLASSNAME$
|
|
9826
|
+
className: `${CLASSNAME$R}__input-background`
|
|
10558
9827
|
}), /*#__PURE__*/React.createElement("div", {
|
|
10559
|
-
className: `${CLASSNAME$
|
|
9828
|
+
className: `${CLASSNAME$R}__input-indicator`
|
|
10560
9829
|
}))), /*#__PURE__*/React.createElement("div", {
|
|
10561
|
-
className: `${CLASSNAME$
|
|
9830
|
+
className: `${CLASSNAME$R}__content`
|
|
10562
9831
|
}, label && /*#__PURE__*/React.createElement(InputLabel, {
|
|
10563
9832
|
htmlFor: inputId,
|
|
10564
9833
|
theme: theme,
|
|
10565
|
-
className: `${CLASSNAME$
|
|
9834
|
+
className: `${CLASSNAME$R}__label`
|
|
10566
9835
|
}, label), helper && /*#__PURE__*/React.createElement(InputHelper, {
|
|
10567
9836
|
id: `${inputId}-helper`,
|
|
10568
9837
|
theme: theme,
|
|
10569
|
-
className: `${CLASSNAME$
|
|
9838
|
+
className: `${CLASSNAME$R}__helper`
|
|
10570
9839
|
}, helper)));
|
|
10571
9840
|
});
|
|
10572
|
-
RadioButton.displayName = COMPONENT_NAME$
|
|
10573
|
-
RadioButton.className = CLASSNAME$
|
|
9841
|
+
RadioButton.displayName = COMPONENT_NAME$U;
|
|
9842
|
+
RadioButton.className = CLASSNAME$R;
|
|
10574
9843
|
RadioButton.defaultProps = DEFAULT_PROPS$G;
|
|
10575
9844
|
|
|
10576
|
-
const _excluded$
|
|
9845
|
+
const _excluded$X = ["children", "className"];
|
|
10577
9846
|
|
|
10578
9847
|
/**
|
|
10579
9848
|
* Defines the props of the component.
|
|
@@ -10582,12 +9851,12 @@ const _excluded$_ = ["children", "className"];
|
|
|
10582
9851
|
/**
|
|
10583
9852
|
* Component display name.
|
|
10584
9853
|
*/
|
|
10585
|
-
const COMPONENT_NAME$
|
|
9854
|
+
const COMPONENT_NAME$V = 'RadioGroup';
|
|
10586
9855
|
|
|
10587
9856
|
/**
|
|
10588
9857
|
* Component default class name and class prefix.
|
|
10589
9858
|
*/
|
|
10590
|
-
const CLASSNAME$
|
|
9859
|
+
const CLASSNAME$S = getRootClassName(COMPONENT_NAME$V);
|
|
10591
9860
|
|
|
10592
9861
|
/**
|
|
10593
9862
|
* RadioGroup component.
|
|
@@ -10601,17 +9870,17 @@ const RadioGroup = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10601
9870
|
children,
|
|
10602
9871
|
className
|
|
10603
9872
|
} = props,
|
|
10604
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
9873
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$X);
|
|
10605
9874
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
10606
9875
|
ref: ref
|
|
10607
9876
|
}, forwardedProps, {
|
|
10608
9877
|
className: classnames(className, handleBasicClasses({
|
|
10609
|
-
prefix: CLASSNAME$
|
|
9878
|
+
prefix: CLASSNAME$S
|
|
10610
9879
|
}))
|
|
10611
9880
|
}), children);
|
|
10612
9881
|
});
|
|
10613
|
-
RadioGroup.displayName = COMPONENT_NAME$
|
|
10614
|
-
RadioGroup.className = CLASSNAME$
|
|
9882
|
+
RadioGroup.displayName = COMPONENT_NAME$V;
|
|
9883
|
+
RadioGroup.className = CLASSNAME$S;
|
|
10615
9884
|
|
|
10616
9885
|
/**
|
|
10617
9886
|
* Listen on element focus to store the focus status.
|
|
@@ -10645,13 +9914,13 @@ const SelectVariant = {
|
|
|
10645
9914
|
chip: 'chip'
|
|
10646
9915
|
};
|
|
10647
9916
|
|
|
10648
|
-
const _excluded
|
|
9917
|
+
const _excluded$Y = ["children", "className", "focusElement", "isMultiple", "closeOnClick", "disabled", "error", "hasError", "helper", "id", "isDisabled", "isEmpty", "isOpen", "isRequired", "isValid", "label", "onClear", "onDropdownClose", "onInfiniteScroll", "onInputClick", "placeholder", "theme", "value", "variant"];
|
|
10649
9918
|
|
|
10650
9919
|
/** The display name of the component. */
|
|
10651
|
-
const COMPONENT_NAME$
|
|
9920
|
+
const COMPONENT_NAME$W = 'Select';
|
|
10652
9921
|
|
|
10653
9922
|
/** The default class name and classes prefix for this component. */
|
|
10654
|
-
const CLASSNAME$
|
|
9923
|
+
const CLASSNAME$T = getRootClassName(COMPONENT_NAME$W);
|
|
10655
9924
|
|
|
10656
9925
|
/** The default value of props. */
|
|
10657
9926
|
const DEFAULT_PROPS$H = {
|
|
@@ -10685,7 +9954,7 @@ const WithSelectContext = (SelectElement, _ref, ref) => {
|
|
|
10685
9954
|
value,
|
|
10686
9955
|
variant = DEFAULT_PROPS$H.variant
|
|
10687
9956
|
} = _ref,
|
|
10688
|
-
forwardedProps = _objectWithoutProperties(_ref, _excluded
|
|
9957
|
+
forwardedProps = _objectWithoutProperties(_ref, _excluded$Y);
|
|
10689
9958
|
const selectId = useMemo(() => id || `select-${uid()}`, [id]);
|
|
10690
9959
|
const anchorRef = useRef(null);
|
|
10691
9960
|
const selectRef = useRef(null);
|
|
@@ -10719,7 +9988,7 @@ const WithSelectContext = (SelectElement, _ref, ref) => {
|
|
|
10719
9988
|
isFocus,
|
|
10720
9989
|
isOpen,
|
|
10721
9990
|
isValid,
|
|
10722
|
-
prefix: CLASSNAME$
|
|
9991
|
+
prefix: CLASSNAME$T,
|
|
10723
9992
|
theme: theme === Theme.light ? Theme.light : Theme.dark
|
|
10724
9993
|
}))
|
|
10725
9994
|
}, /*#__PURE__*/React.createElement(SelectElement, _extends({}, forwardedProps, {
|
|
@@ -10750,22 +10019,22 @@ const WithSelectContext = (SelectElement, _ref, ref) => {
|
|
|
10750
10019
|
onInfiniteScroll: onInfiniteScroll,
|
|
10751
10020
|
ref: dropdownRef
|
|
10752
10021
|
}, children), hasError && error && /*#__PURE__*/React.createElement(InputHelper, {
|
|
10753
|
-
className: `${CLASSNAME$
|
|
10022
|
+
className: `${CLASSNAME$T}__helper`,
|
|
10754
10023
|
kind: Kind.error,
|
|
10755
10024
|
theme: theme
|
|
10756
10025
|
}, error), helper && /*#__PURE__*/React.createElement(InputHelper, {
|
|
10757
|
-
className: `${CLASSNAME$
|
|
10026
|
+
className: `${CLASSNAME$T}__helper`,
|
|
10758
10027
|
theme: theme
|
|
10759
10028
|
}, helper));
|
|
10760
10029
|
};
|
|
10761
10030
|
|
|
10762
|
-
const _excluded$
|
|
10031
|
+
const _excluded$Z = ["anchorRef", "clearButtonProps", "handleKeyboardNav", "hasError", "hasInputClear", "icon", "id", "isDisabled", "isEmpty", "isRequired", "isValid", "label", "onClear", "onInputClick", "placeholder", "selectedValueRender", "theme", "value", "variant", "selectElementRef"];
|
|
10763
10032
|
|
|
10764
10033
|
/** The display name of the component. */
|
|
10765
|
-
const COMPONENT_NAME$
|
|
10034
|
+
const COMPONENT_NAME$X = 'Select';
|
|
10766
10035
|
|
|
10767
10036
|
/** The default class name and classes prefix for this component. */
|
|
10768
|
-
const CLASSNAME$
|
|
10037
|
+
const CLASSNAME$U = getRootClassName(COMPONENT_NAME$X);
|
|
10769
10038
|
|
|
10770
10039
|
/** The default value of props. */
|
|
10771
10040
|
const DEFAULT_PROPS$I = {
|
|
@@ -10799,36 +10068,36 @@ const SelectField = _ref => {
|
|
|
10799
10068
|
variant,
|
|
10800
10069
|
selectElementRef
|
|
10801
10070
|
} = _ref,
|
|
10802
|
-
forwardedProps = _objectWithoutProperties(_ref, _excluded$
|
|
10071
|
+
forwardedProps = _objectWithoutProperties(_ref, _excluded$Z);
|
|
10803
10072
|
return /*#__PURE__*/React.createElement(React.Fragment, null, variant === SelectVariant.input && /*#__PURE__*/React.createElement(React.Fragment, null, label && /*#__PURE__*/React.createElement("div", {
|
|
10804
|
-
className: `${CLASSNAME$
|
|
10073
|
+
className: `${CLASSNAME$U}__header`
|
|
10805
10074
|
}, /*#__PURE__*/React.createElement(InputLabel, {
|
|
10806
10075
|
htmlFor: id,
|
|
10807
|
-
className: `${CLASSNAME$
|
|
10076
|
+
className: `${CLASSNAME$U}__label`,
|
|
10808
10077
|
isRequired: isRequired,
|
|
10809
10078
|
theme: theme
|
|
10810
10079
|
}, label)), /*#__PURE__*/React.createElement("div", _extends({
|
|
10811
10080
|
ref: mergeRefs(anchorRef, selectElementRef),
|
|
10812
10081
|
id: id,
|
|
10813
|
-
className: `${CLASSNAME$
|
|
10082
|
+
className: `${CLASSNAME$U}__wrapper`,
|
|
10814
10083
|
onClick: onInputClick,
|
|
10815
10084
|
onKeyDown: handleKeyboardNav,
|
|
10816
10085
|
tabIndex: isDisabled ? undefined : 0,
|
|
10817
10086
|
"aria-disabled": isDisabled || undefined
|
|
10818
10087
|
}, forwardedProps), icon && /*#__PURE__*/React.createElement(Icon, {
|
|
10819
|
-
className: `${CLASSNAME$
|
|
10088
|
+
className: `${CLASSNAME$U}__input-icon`,
|
|
10820
10089
|
color: theme === Theme.dark ? 'light' : undefined,
|
|
10821
10090
|
icon: icon,
|
|
10822
10091
|
size: Size.xs
|
|
10823
10092
|
}), /*#__PURE__*/React.createElement("div", {
|
|
10824
|
-
className: classnames([`${CLASSNAME$
|
|
10093
|
+
className: classnames([`${CLASSNAME$U}__input-native`, isEmpty && placeholder && `${CLASSNAME$U}__input-native--placeholder`])
|
|
10825
10094
|
}, !isEmpty && /*#__PURE__*/React.createElement("span", null, selectedValueRender === null || selectedValueRender === void 0 ? void 0 : selectedValueRender(value)), isEmpty && placeholder && /*#__PURE__*/React.createElement("span", null, placeholder)), (isValid || hasError) && /*#__PURE__*/React.createElement("div", {
|
|
10826
|
-
className: `${CLASSNAME$
|
|
10095
|
+
className: `${CLASSNAME$U}__input-validity`
|
|
10827
10096
|
}, /*#__PURE__*/React.createElement(Icon, {
|
|
10828
10097
|
icon: isValid ? mdiCheckCircle : mdiAlertCircle,
|
|
10829
10098
|
size: Size.xxs
|
|
10830
10099
|
})), hasInputClear && clearButtonProps && /*#__PURE__*/React.createElement(IconButton, _extends({}, clearButtonProps, {
|
|
10831
|
-
className: `${CLASSNAME$
|
|
10100
|
+
className: `${CLASSNAME$U}__input-clear`,
|
|
10832
10101
|
icon: mdiCloseCircle,
|
|
10833
10102
|
emphasis: Emphasis.low,
|
|
10834
10103
|
size: Size.s,
|
|
@@ -10836,7 +10105,7 @@ const SelectField = _ref => {
|
|
|
10836
10105
|
onClick: onClear,
|
|
10837
10106
|
onKeyDown: stopPropagation
|
|
10838
10107
|
})), /*#__PURE__*/React.createElement("div", {
|
|
10839
|
-
className: `${CLASSNAME$
|
|
10108
|
+
className: `${CLASSNAME$U}__input-indicator`
|
|
10840
10109
|
}, /*#__PURE__*/React.createElement(Icon, {
|
|
10841
10110
|
icon: mdiMenuDown,
|
|
10842
10111
|
size: Size.s
|
|
@@ -10868,26 +10137,26 @@ const Select = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10868
10137
|
className: classnames(props.className, handleBasicClasses({
|
|
10869
10138
|
hasInputClear,
|
|
10870
10139
|
hasUnique: !props.isEmpty,
|
|
10871
|
-
prefix: CLASSNAME$
|
|
10140
|
+
prefix: CLASSNAME$U
|
|
10872
10141
|
})),
|
|
10873
10142
|
hasInputClear,
|
|
10874
10143
|
isEmpty: isEmpty$1
|
|
10875
10144
|
}), ref);
|
|
10876
10145
|
});
|
|
10877
|
-
Select.displayName = COMPONENT_NAME$
|
|
10878
|
-
Select.className = CLASSNAME$
|
|
10146
|
+
Select.displayName = COMPONENT_NAME$X;
|
|
10147
|
+
Select.className = CLASSNAME$U;
|
|
10879
10148
|
Select.defaultProps = DEFAULT_PROPS$I;
|
|
10880
|
-
Select.className = CLASSNAME$
|
|
10149
|
+
Select.className = CLASSNAME$U;
|
|
10881
10150
|
|
|
10882
|
-
const _excluded$
|
|
10151
|
+
const _excluded$_ = ["anchorRef", "handleKeyboardNav", "hasError", "icon", "id", "isDisabled", "isEmpty", "isRequired", "isValid", "label", "onClear", "onInputClick", "placeholder", "selectedChipRender", "selectedValueRender", "theme", "value", "variant", "selectElementRef"];
|
|
10883
10152
|
|
|
10884
10153
|
/** Defines the props of the component. */
|
|
10885
10154
|
|
|
10886
10155
|
/** The display name of the component. */
|
|
10887
|
-
const COMPONENT_NAME$
|
|
10156
|
+
const COMPONENT_NAME$Y = 'Select';
|
|
10888
10157
|
|
|
10889
10158
|
/** The default class name and classes prefix for this component. */
|
|
10890
|
-
const CLASSNAME$
|
|
10159
|
+
const CLASSNAME$V = getRootClassName(COMPONENT_NAME$Y);
|
|
10891
10160
|
|
|
10892
10161
|
/** The default value of props. */
|
|
10893
10162
|
const DEFAULT_PROPS$J = {
|
|
@@ -10930,38 +10199,38 @@ const SelectMultipleField = _ref => {
|
|
|
10930
10199
|
variant,
|
|
10931
10200
|
selectElementRef
|
|
10932
10201
|
} = _ref,
|
|
10933
|
-
forwardedProps = _objectWithoutProperties(_ref, _excluded$
|
|
10202
|
+
forwardedProps = _objectWithoutProperties(_ref, _excluded$_);
|
|
10934
10203
|
return /*#__PURE__*/React.createElement(React.Fragment, null, variant === SelectVariant.input && /*#__PURE__*/React.createElement(React.Fragment, null, label && /*#__PURE__*/React.createElement("div", {
|
|
10935
|
-
className: `${CLASSNAME$
|
|
10204
|
+
className: `${CLASSNAME$V}__header`
|
|
10936
10205
|
}, /*#__PURE__*/React.createElement(InputLabel, {
|
|
10937
10206
|
htmlFor: id,
|
|
10938
|
-
className: `${CLASSNAME$
|
|
10207
|
+
className: `${CLASSNAME$V}__label`,
|
|
10939
10208
|
isRequired: isRequired,
|
|
10940
10209
|
theme: theme
|
|
10941
10210
|
}, label)), /*#__PURE__*/React.createElement("div", _extends({
|
|
10942
10211
|
ref: mergeRefs(anchorRef, selectElementRef),
|
|
10943
10212
|
id: id,
|
|
10944
|
-
className: `${CLASSNAME$
|
|
10213
|
+
className: `${CLASSNAME$V}__wrapper`,
|
|
10945
10214
|
onClick: onInputClick,
|
|
10946
10215
|
onKeyDown: handleKeyboardNav,
|
|
10947
10216
|
tabIndex: isDisabled ? undefined : 0,
|
|
10948
10217
|
"aria-disabled": isDisabled || undefined
|
|
10949
10218
|
}, forwardedProps), icon && /*#__PURE__*/React.createElement(Icon, {
|
|
10950
|
-
className: `${CLASSNAME$
|
|
10219
|
+
className: `${CLASSNAME$V}__input-icon`,
|
|
10951
10220
|
color: theme === Theme.dark ? 'light' : undefined,
|
|
10952
10221
|
icon: icon,
|
|
10953
10222
|
size: Size.xs
|
|
10954
10223
|
}), /*#__PURE__*/React.createElement("div", {
|
|
10955
|
-
className: `${CLASSNAME$
|
|
10224
|
+
className: `${CLASSNAME$V}__chips`
|
|
10956
10225
|
}, !isEmpty && value.map((val, index) => selectedChipRender === null || selectedChipRender === void 0 ? void 0 : selectedChipRender(val, index, onClear, isDisabled, theme))), isEmpty && placeholder && /*#__PURE__*/React.createElement("div", {
|
|
10957
|
-
className: classnames([`${CLASSNAME$
|
|
10226
|
+
className: classnames([`${CLASSNAME$V}__input-native`, `${CLASSNAME$V}__input-native--placeholder`])
|
|
10958
10227
|
}, /*#__PURE__*/React.createElement("span", null, placeholder)), (isValid || hasError) && /*#__PURE__*/React.createElement("div", {
|
|
10959
|
-
className: `${CLASSNAME$
|
|
10228
|
+
className: `${CLASSNAME$V}__input-validity`
|
|
10960
10229
|
}, /*#__PURE__*/React.createElement(Icon, {
|
|
10961
10230
|
icon: isValid ? mdiCheckCircle : mdiAlertCircle,
|
|
10962
10231
|
size: Size.xxs
|
|
10963
10232
|
})), /*#__PURE__*/React.createElement("div", {
|
|
10964
|
-
className: `${CLASSNAME$
|
|
10233
|
+
className: `${CLASSNAME$V}__input-indicator`
|
|
10965
10234
|
}, /*#__PURE__*/React.createElement(Icon, {
|
|
10966
10235
|
icon: mdiMenuDown,
|
|
10967
10236
|
size: Size.s
|
|
@@ -10990,17 +10259,17 @@ const SelectMultiple = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10990
10259
|
return WithSelectContext(SelectMultipleField, _objectSpread2(_objectSpread2({}, props), {}, {
|
|
10991
10260
|
className: classnames(props.className, handleBasicClasses({
|
|
10992
10261
|
hasMultiple: !props.isEmpty,
|
|
10993
|
-
prefix: CLASSNAME$
|
|
10262
|
+
prefix: CLASSNAME$V
|
|
10994
10263
|
})),
|
|
10995
10264
|
isEmpty: props.value.length === 0,
|
|
10996
10265
|
isMultiple: true
|
|
10997
10266
|
}), ref);
|
|
10998
10267
|
});
|
|
10999
|
-
SelectMultiple.displayName = COMPONENT_NAME$
|
|
11000
|
-
SelectMultiple.className = CLASSNAME$
|
|
10268
|
+
SelectMultiple.displayName = COMPONENT_NAME$Y;
|
|
10269
|
+
SelectMultiple.className = CLASSNAME$V;
|
|
11001
10270
|
SelectMultiple.defaultProps = DEFAULT_PROPS$J;
|
|
11002
10271
|
|
|
11003
|
-
const _excluded
|
|
10272
|
+
const _excluded$$ = ["children", "className", "theme"];
|
|
11004
10273
|
|
|
11005
10274
|
/**
|
|
11006
10275
|
* Defines the props of the component.
|
|
@@ -11009,12 +10278,12 @@ const _excluded$12 = ["children", "className", "theme"];
|
|
|
11009
10278
|
/**
|
|
11010
10279
|
* Component display name.
|
|
11011
10280
|
*/
|
|
11012
|
-
const COMPONENT_NAME$
|
|
10281
|
+
const COMPONENT_NAME$Z = 'SideNavigation';
|
|
11013
10282
|
|
|
11014
10283
|
/**
|
|
11015
10284
|
* Component default class name and class prefix.
|
|
11016
10285
|
*/
|
|
11017
|
-
const CLASSNAME$
|
|
10286
|
+
const CLASSNAME$W = getRootClassName(COMPONENT_NAME$Z);
|
|
11018
10287
|
|
|
11019
10288
|
/**
|
|
11020
10289
|
* SideNavigation component.
|
|
@@ -11029,20 +10298,20 @@ const SideNavigation = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11029
10298
|
className,
|
|
11030
10299
|
theme
|
|
11031
10300
|
} = props,
|
|
11032
|
-
forwardedProps = _objectWithoutProperties(props, _excluded
|
|
10301
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$$);
|
|
11033
10302
|
const content = Children.toArray(children).filter(isComponent(SideNavigationItem));
|
|
11034
10303
|
return /*#__PURE__*/React.createElement("ul", _extends({
|
|
11035
10304
|
ref: ref
|
|
11036
10305
|
}, forwardedProps, {
|
|
11037
10306
|
className: classnames(className, theme === Theme.dark && 'lumx-color-font-light-N', handleBasicClasses({
|
|
11038
|
-
prefix: CLASSNAME$
|
|
10307
|
+
prefix: CLASSNAME$W
|
|
11039
10308
|
}))
|
|
11040
10309
|
}), content);
|
|
11041
10310
|
});
|
|
11042
|
-
SideNavigation.displayName = COMPONENT_NAME$
|
|
11043
|
-
SideNavigation.className = CLASSNAME$
|
|
10311
|
+
SideNavigation.displayName = COMPONENT_NAME$Z;
|
|
10312
|
+
SideNavigation.className = CLASSNAME$W;
|
|
11044
10313
|
|
|
11045
|
-
const _excluded$
|
|
10314
|
+
const _excluded$10 = ["linkAs", "href"];
|
|
11046
10315
|
/**
|
|
11047
10316
|
* Render <button> HTML component, fallbacks to `<a>` when a `href` is provided or a custom component with `linkAs`.
|
|
11048
10317
|
*/
|
|
@@ -11051,7 +10320,7 @@ const renderButtonOrLink = function (props) {
|
|
|
11051
10320
|
linkAs,
|
|
11052
10321
|
href
|
|
11053
10322
|
} = props,
|
|
11054
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
10323
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$10);
|
|
11055
10324
|
for (var _len = arguments.length, children = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
|
|
11056
10325
|
children[_key - 1] = arguments[_key];
|
|
11057
10326
|
}
|
|
@@ -11061,7 +10330,7 @@ const renderButtonOrLink = function (props) {
|
|
|
11061
10330
|
}, forwardedProps), ...children);
|
|
11062
10331
|
};
|
|
11063
10332
|
|
|
11064
|
-
const _excluded$
|
|
10333
|
+
const _excluded$11 = ["children", "className", "emphasis", "icon", "isOpen", "isSelected", "label", "linkAs", "linkProps", "onActionClick", "onClick", "toggleButtonProps", "closeMode"];
|
|
11065
10334
|
|
|
11066
10335
|
/**
|
|
11067
10336
|
* Defines the props of the component.
|
|
@@ -11070,12 +10339,12 @@ const _excluded$14 = ["children", "className", "emphasis", "icon", "isOpen", "is
|
|
|
11070
10339
|
/**
|
|
11071
10340
|
* Component display name.
|
|
11072
10341
|
*/
|
|
11073
|
-
const COMPONENT_NAME
|
|
10342
|
+
const COMPONENT_NAME$_ = 'SideNavigationItem';
|
|
11074
10343
|
|
|
11075
10344
|
/**
|
|
11076
10345
|
* Component default class name and class prefix.
|
|
11077
10346
|
*/
|
|
11078
|
-
const CLASSNAME$
|
|
10347
|
+
const CLASSNAME$X = getRootClassName(COMPONENT_NAME$_);
|
|
11079
10348
|
|
|
11080
10349
|
/**
|
|
11081
10350
|
* Component default props.
|
|
@@ -11108,7 +10377,7 @@ const SideNavigationItem = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11108
10377
|
toggleButtonProps,
|
|
11109
10378
|
closeMode = 'unmount'
|
|
11110
10379
|
} = props,
|
|
11111
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
10380
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$11);
|
|
11112
10381
|
const content = children && Children.toArray(children).filter(isComponent(SideNavigationItem));
|
|
11113
10382
|
const hasContent = !isEmpty(content);
|
|
11114
10383
|
const shouldSplitActions = Boolean(onActionClick);
|
|
@@ -11127,22 +10396,22 @@ const SideNavigationItem = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11127
10396
|
emphasis,
|
|
11128
10397
|
isOpen: showChildren,
|
|
11129
10398
|
isSelected,
|
|
11130
|
-
prefix: CLASSNAME$
|
|
10399
|
+
prefix: CLASSNAME$X
|
|
11131
10400
|
}))
|
|
11132
10401
|
}), shouldSplitActions ? /*#__PURE__*/React.createElement("div", {
|
|
11133
|
-
className: `${CLASSNAME$
|
|
10402
|
+
className: `${CLASSNAME$X}__wrapper`
|
|
11134
10403
|
}, renderLink(_objectSpread2(_objectSpread2({
|
|
11135
10404
|
linkAs
|
|
11136
10405
|
}, linkProps), {}, {
|
|
11137
|
-
className: `${CLASSNAME$
|
|
10406
|
+
className: `${CLASSNAME$X}__link`,
|
|
11138
10407
|
onClick,
|
|
11139
10408
|
tabIndex: 0
|
|
11140
10409
|
}), icon && /*#__PURE__*/React.createElement(Icon, {
|
|
11141
|
-
className: `${CLASSNAME$
|
|
10410
|
+
className: `${CLASSNAME$X}__icon`,
|
|
11142
10411
|
icon: icon,
|
|
11143
10412
|
size: Size.xs
|
|
11144
10413
|
}), /*#__PURE__*/React.createElement("span", null, label)), /*#__PURE__*/React.createElement(IconButton, _extends({}, toggleButtonProps, {
|
|
11145
|
-
className: `${CLASSNAME$
|
|
10414
|
+
className: `${CLASSNAME$X}__toggle`,
|
|
11146
10415
|
icon: isOpen ? mdiChevronUp : mdiChevronDown,
|
|
11147
10416
|
size: Size.m,
|
|
11148
10417
|
emphasis: Emphasis.low,
|
|
@@ -11150,27 +10419,27 @@ const SideNavigationItem = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11150
10419
|
}, ariaProps))) : renderButtonOrLink(_objectSpread2(_objectSpread2({
|
|
11151
10420
|
linkAs
|
|
11152
10421
|
}, linkProps), {}, {
|
|
11153
|
-
className: `${CLASSNAME$
|
|
10422
|
+
className: `${CLASSNAME$X}__link`,
|
|
11154
10423
|
tabIndex: 0,
|
|
11155
10424
|
onClick
|
|
11156
10425
|
}, ariaProps), icon && /*#__PURE__*/React.createElement(Icon, {
|
|
11157
|
-
className: `${CLASSNAME$
|
|
10426
|
+
className: `${CLASSNAME$X}__icon`,
|
|
11158
10427
|
icon: icon,
|
|
11159
10428
|
size: Size.xs
|
|
11160
10429
|
}), /*#__PURE__*/React.createElement("span", null, label), hasContent && /*#__PURE__*/React.createElement(Icon, {
|
|
11161
|
-
className: `${CLASSNAME$
|
|
10430
|
+
className: `${CLASSNAME$X}__chevron`,
|
|
11162
10431
|
icon: isOpen ? mdiChevronUp : mdiChevronDown,
|
|
11163
10432
|
size: Size.xs
|
|
11164
10433
|
})), (closeMode === 'hide' || showChildren) && /*#__PURE__*/React.createElement("ul", {
|
|
11165
|
-
className: `${CLASSNAME$
|
|
10434
|
+
className: `${CLASSNAME$X}__children`,
|
|
11166
10435
|
id: contentId
|
|
11167
10436
|
}, content));
|
|
11168
10437
|
});
|
|
11169
|
-
SideNavigationItem.displayName = COMPONENT_NAME
|
|
11170
|
-
SideNavigationItem.className = CLASSNAME$
|
|
10438
|
+
SideNavigationItem.displayName = COMPONENT_NAME$_;
|
|
10439
|
+
SideNavigationItem.className = CLASSNAME$X;
|
|
11171
10440
|
SideNavigationItem.defaultProps = DEFAULT_PROPS$K;
|
|
11172
10441
|
|
|
11173
|
-
const _excluded$
|
|
10442
|
+
const _excluded$12 = ["className", "size", "color", "theme"];
|
|
11174
10443
|
|
|
11175
10444
|
/**
|
|
11176
10445
|
* Defines the props of the component.
|
|
@@ -11183,12 +10452,12 @@ const DEFAULT_PROPS$L = {
|
|
|
11183
10452
|
/**
|
|
11184
10453
|
* Component display name.
|
|
11185
10454
|
*/
|
|
11186
|
-
const COMPONENT_NAME
|
|
10455
|
+
const COMPONENT_NAME$$ = 'SkeletonCircle';
|
|
11187
10456
|
|
|
11188
10457
|
/**
|
|
11189
10458
|
* Component default class name and class prefix.
|
|
11190
10459
|
*/
|
|
11191
|
-
const CLASSNAME$
|
|
10460
|
+
const CLASSNAME$Y = getRootClassName(COMPONENT_NAME$$);
|
|
11192
10461
|
|
|
11193
10462
|
/**
|
|
11194
10463
|
* SkeletonCircle component.
|
|
@@ -11204,23 +10473,23 @@ const SkeletonCircle = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11204
10473
|
color,
|
|
11205
10474
|
theme
|
|
11206
10475
|
} = props,
|
|
11207
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
10476
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$12);
|
|
11208
10477
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
11209
10478
|
ref: ref
|
|
11210
10479
|
}, forwardedProps, {
|
|
11211
10480
|
className: classnames(className, handleBasicClasses({
|
|
11212
|
-
prefix: CLASSNAME$
|
|
10481
|
+
prefix: CLASSNAME$Y,
|
|
11213
10482
|
size,
|
|
11214
10483
|
color,
|
|
11215
10484
|
theme
|
|
11216
10485
|
}))
|
|
11217
10486
|
}));
|
|
11218
10487
|
});
|
|
11219
|
-
SkeletonCircle.displayName = COMPONENT_NAME
|
|
10488
|
+
SkeletonCircle.displayName = COMPONENT_NAME$$;
|
|
11220
10489
|
SkeletonCircle.defaultProps = DEFAULT_PROPS$L;
|
|
11221
|
-
SkeletonCircle.className = CLASSNAME$
|
|
10490
|
+
SkeletonCircle.className = CLASSNAME$Y;
|
|
11222
10491
|
|
|
11223
|
-
const _excluded$
|
|
10492
|
+
const _excluded$13 = ["aspectRatio", "className", "height", "theme", "variant", "width", "color"];
|
|
11224
10493
|
|
|
11225
10494
|
/**
|
|
11226
10495
|
* Skeleton variants.
|
|
@@ -11243,12 +10512,12 @@ const DEFAULT_PROPS$M = {
|
|
|
11243
10512
|
/**
|
|
11244
10513
|
* Component display name.
|
|
11245
10514
|
*/
|
|
11246
|
-
const COMPONENT_NAME$
|
|
10515
|
+
const COMPONENT_NAME$10 = 'SkeletonRectangle';
|
|
11247
10516
|
|
|
11248
10517
|
/**
|
|
11249
10518
|
* Component default class name and class prefix.
|
|
11250
10519
|
*/
|
|
11251
|
-
const CLASSNAME$
|
|
10520
|
+
const CLASSNAME$Z = getRootClassName(COMPONENT_NAME$10);
|
|
11252
10521
|
|
|
11253
10522
|
/**
|
|
11254
10523
|
* SkeletonRectangle component.
|
|
@@ -11267,12 +10536,12 @@ const SkeletonRectangle = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11267
10536
|
width,
|
|
11268
10537
|
color
|
|
11269
10538
|
} = props,
|
|
11270
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
10539
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$13);
|
|
11271
10540
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
11272
10541
|
ref: ref
|
|
11273
10542
|
}, forwardedProps, {
|
|
11274
10543
|
className: classnames(className, handleBasicClasses({
|
|
11275
|
-
prefix: CLASSNAME$
|
|
10544
|
+
prefix: CLASSNAME$Z,
|
|
11276
10545
|
aspectRatio,
|
|
11277
10546
|
height: aspectRatio ? undefined : height,
|
|
11278
10547
|
theme,
|
|
@@ -11281,14 +10550,14 @@ const SkeletonRectangle = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11281
10550
|
color
|
|
11282
10551
|
}))
|
|
11283
10552
|
}), /*#__PURE__*/React.createElement("div", {
|
|
11284
|
-
className: `${CLASSNAME$
|
|
10553
|
+
className: `${CLASSNAME$Z}__inner`
|
|
11285
10554
|
}));
|
|
11286
10555
|
});
|
|
11287
|
-
SkeletonRectangle.displayName = COMPONENT_NAME$
|
|
11288
|
-
SkeletonRectangle.className = CLASSNAME$
|
|
10556
|
+
SkeletonRectangle.displayName = COMPONENT_NAME$10;
|
|
10557
|
+
SkeletonRectangle.className = CLASSNAME$Z;
|
|
11289
10558
|
SkeletonRectangle.defaultProps = DEFAULT_PROPS$M;
|
|
11290
10559
|
|
|
11291
|
-
const _excluded$
|
|
10560
|
+
const _excluded$14 = ["className", "theme", "typography", "width", "color"];
|
|
11292
10561
|
|
|
11293
10562
|
/**
|
|
11294
10563
|
* Defines the props of the component.
|
|
@@ -11301,12 +10570,12 @@ const DEFAULT_PROPS$N = {
|
|
|
11301
10570
|
/**
|
|
11302
10571
|
* Component display name.
|
|
11303
10572
|
*/
|
|
11304
|
-
const COMPONENT_NAME$
|
|
10573
|
+
const COMPONENT_NAME$11 = 'SkeletonTypography';
|
|
11305
10574
|
|
|
11306
10575
|
/**
|
|
11307
10576
|
* Component default class name and class prefix.
|
|
11308
10577
|
*/
|
|
11309
|
-
const CLASSNAME
|
|
10578
|
+
const CLASSNAME$_ = getRootClassName(COMPONENT_NAME$11);
|
|
11310
10579
|
|
|
11311
10580
|
/**
|
|
11312
10581
|
* SkeletonTypography component.
|
|
@@ -11323,12 +10592,12 @@ const SkeletonTypography = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11323
10592
|
width,
|
|
11324
10593
|
color
|
|
11325
10594
|
} = props,
|
|
11326
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
10595
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$14);
|
|
11327
10596
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
11328
10597
|
ref: ref
|
|
11329
10598
|
}, forwardedProps, {
|
|
11330
10599
|
className: classnames(className, handleBasicClasses({
|
|
11331
|
-
prefix: CLASSNAME
|
|
10600
|
+
prefix: CLASSNAME$_,
|
|
11332
10601
|
theme,
|
|
11333
10602
|
typography,
|
|
11334
10603
|
color
|
|
@@ -11337,12 +10606,12 @@ const SkeletonTypography = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11337
10606
|
width
|
|
11338
10607
|
})
|
|
11339
10608
|
}), /*#__PURE__*/React.createElement("div", {
|
|
11340
|
-
className: `${CLASSNAME
|
|
10609
|
+
className: `${CLASSNAME$_}__inner`
|
|
11341
10610
|
}));
|
|
11342
10611
|
});
|
|
11343
|
-
SkeletonTypography.displayName = COMPONENT_NAME$
|
|
10612
|
+
SkeletonTypography.displayName = COMPONENT_NAME$11;
|
|
11344
10613
|
SkeletonTypography.defaultProps = DEFAULT_PROPS$N;
|
|
11345
|
-
SkeletonTypography.className = CLASSNAME
|
|
10614
|
+
SkeletonTypography.className = CLASSNAME$_;
|
|
11346
10615
|
|
|
11347
10616
|
const useEnhancedEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;
|
|
11348
10617
|
|
|
@@ -11378,7 +10647,7 @@ const clamp = (value, min, max) => {
|
|
|
11378
10647
|
return value;
|
|
11379
10648
|
};
|
|
11380
10649
|
|
|
11381
|
-
const _excluded$
|
|
10650
|
+
const _excluded$15 = ["className", "disabled", "helper", "hideMinMaxLabel", "id", "isDisabled", "label", "max", "min", "name", "onChange", "onMouseDown", "precision", "steps", "theme", "value"];
|
|
11382
10651
|
|
|
11383
10652
|
/**
|
|
11384
10653
|
* Defines the props of the component.
|
|
@@ -11387,12 +10656,12 @@ const _excluded$18 = ["className", "disabled", "helper", "hideMinMaxLabel", "id"
|
|
|
11387
10656
|
/**
|
|
11388
10657
|
* Component display name.
|
|
11389
10658
|
*/
|
|
11390
|
-
const COMPONENT_NAME$
|
|
10659
|
+
const COMPONENT_NAME$12 = 'Slider';
|
|
11391
10660
|
|
|
11392
10661
|
/**
|
|
11393
10662
|
* Component default class name and class prefix.
|
|
11394
10663
|
*/
|
|
11395
|
-
const CLASSNAME
|
|
10664
|
+
const CLASSNAME$$ = getRootClassName(COMPONENT_NAME$12);
|
|
11396
10665
|
|
|
11397
10666
|
/**
|
|
11398
10667
|
* Component default props.
|
|
@@ -11453,7 +10722,7 @@ const Slider = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11453
10722
|
theme,
|
|
11454
10723
|
value
|
|
11455
10724
|
} = props,
|
|
11456
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
10725
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$15);
|
|
11457
10726
|
const sliderId = useMemo(() => id || `slider-${uid()}`, [id]);
|
|
11458
10727
|
const sliderLabelId = useMemo(() => `label-${sliderId}`, [sliderId]);
|
|
11459
10728
|
const sliderRef = useRef(null);
|
|
@@ -11586,7 +10855,7 @@ const Slider = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11586
10855
|
ref: ref
|
|
11587
10856
|
}, forwardedProps, {
|
|
11588
10857
|
className: classnames(className, handleBasicClasses({
|
|
11589
|
-
prefix: CLASSNAME
|
|
10858
|
+
prefix: CLASSNAME$$,
|
|
11590
10859
|
theme,
|
|
11591
10860
|
hasLabel: Boolean(label)
|
|
11592
10861
|
})),
|
|
@@ -11595,30 +10864,30 @@ const Slider = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11595
10864
|
}), label && /*#__PURE__*/React.createElement(InputLabel, {
|
|
11596
10865
|
id: sliderLabelId,
|
|
11597
10866
|
htmlFor: sliderId,
|
|
11598
|
-
className: `${CLASSNAME
|
|
10867
|
+
className: `${CLASSNAME$$}__label`,
|
|
11599
10868
|
theme: theme
|
|
11600
10869
|
}, label), helper && /*#__PURE__*/React.createElement(InputHelper, {
|
|
11601
|
-
className: `${CLASSNAME
|
|
10870
|
+
className: `${CLASSNAME$$}__helper`,
|
|
11602
10871
|
theme: theme
|
|
11603
10872
|
}, helper), /*#__PURE__*/React.createElement("div", {
|
|
11604
|
-
className: `${CLASSNAME
|
|
10873
|
+
className: `${CLASSNAME$$}__ui-wrapper`
|
|
11605
10874
|
}, !hideMinMaxLabel && /*#__PURE__*/React.createElement("span", {
|
|
11606
|
-
className: `${CLASSNAME
|
|
10875
|
+
className: `${CLASSNAME$$}__value-label ${CLASSNAME$$}__value-label--min`
|
|
11607
10876
|
}, min), /*#__PURE__*/React.createElement("div", {
|
|
11608
|
-
className: `${CLASSNAME
|
|
10877
|
+
className: `${CLASSNAME$$}__wrapper`,
|
|
11609
10878
|
ref: sliderRef
|
|
11610
10879
|
}, /*#__PURE__*/React.createElement("div", {
|
|
11611
|
-
className: `${CLASSNAME
|
|
10880
|
+
className: `${CLASSNAME$$}__track ${CLASSNAME$$}__track--background`
|
|
11612
10881
|
}), /*#__PURE__*/React.createElement("div", {
|
|
11613
|
-
className: `${CLASSNAME
|
|
10882
|
+
className: `${CLASSNAME$$}__track ${CLASSNAME$$}__track--active`,
|
|
11614
10883
|
style: {
|
|
11615
10884
|
width: percentString
|
|
11616
10885
|
}
|
|
11617
10886
|
}), steps ? /*#__PURE__*/React.createElement("div", {
|
|
11618
|
-
className: `${CLASSNAME
|
|
10887
|
+
className: `${CLASSNAME$$}__ticks`
|
|
11619
10888
|
}, availableSteps.map((step, idx) => /*#__PURE__*/React.createElement("div", {
|
|
11620
10889
|
key: `tick_${idx}`,
|
|
11621
|
-
className: `${CLASSNAME
|
|
10890
|
+
className: `${CLASSNAME$$}__tick`,
|
|
11622
10891
|
style: {
|
|
11623
10892
|
left: `${step * 100}%`
|
|
11624
10893
|
}
|
|
@@ -11627,18 +10896,18 @@ const Slider = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11627
10896
|
"aria-labelledby": sliderLabelId,
|
|
11628
10897
|
name: name,
|
|
11629
10898
|
id: sliderId,
|
|
11630
|
-
className: `${CLASSNAME
|
|
10899
|
+
className: `${CLASSNAME$$}__handle`,
|
|
11631
10900
|
style: {
|
|
11632
10901
|
left: percentString
|
|
11633
10902
|
},
|
|
11634
10903
|
onKeyDown: handleKeyDown,
|
|
11635
10904
|
disabled: isDisabled
|
|
11636
10905
|
})), !hideMinMaxLabel && /*#__PURE__*/React.createElement("span", {
|
|
11637
|
-
className: `${CLASSNAME
|
|
10906
|
+
className: `${CLASSNAME$$}__value-label ${CLASSNAME$$}__value-label--max`
|
|
11638
10907
|
}, max)));
|
|
11639
10908
|
});
|
|
11640
|
-
Slider.displayName = COMPONENT_NAME$
|
|
11641
|
-
Slider.className = CLASSNAME
|
|
10909
|
+
Slider.displayName = COMPONENT_NAME$12;
|
|
10910
|
+
Slider.className = CLASSNAME$$;
|
|
11642
10911
|
Slider.defaultProps = DEFAULT_PROPS$O;
|
|
11643
10912
|
|
|
11644
10913
|
/**
|
|
@@ -11959,7 +11228,7 @@ const useSlideFocusManagement = _ref => {
|
|
|
11959
11228
|
}, [isSlideDisplayed, slideRef]);
|
|
11960
11229
|
};
|
|
11961
11230
|
|
|
11962
|
-
const _excluded$
|
|
11231
|
+
const _excluded$16 = ["className", "children", "role", "label", "isDisplayed"];
|
|
11963
11232
|
|
|
11964
11233
|
/**
|
|
11965
11234
|
* Defines the props of the component.
|
|
@@ -11968,12 +11237,12 @@ const _excluded$19 = ["className", "children", "role", "label", "isDisplayed"];
|
|
|
11968
11237
|
/**
|
|
11969
11238
|
* Component display name.
|
|
11970
11239
|
*/
|
|
11971
|
-
const COMPONENT_NAME$
|
|
11240
|
+
const COMPONENT_NAME$13 = 'SlideshowItemGroup';
|
|
11972
11241
|
|
|
11973
11242
|
/**
|
|
11974
11243
|
* Component default class name and class prefix.
|
|
11975
11244
|
*/
|
|
11976
|
-
const CLASSNAME$
|
|
11245
|
+
const CLASSNAME$10 = getRootClassName(COMPONENT_NAME$13);
|
|
11977
11246
|
const buildSlideShowGroupId = (slidesId, index) => `${slidesId}-slide-${index}`;
|
|
11978
11247
|
|
|
11979
11248
|
/**
|
|
@@ -11991,7 +11260,7 @@ const SlideshowItemGroup = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11991
11260
|
label,
|
|
11992
11261
|
isDisplayed
|
|
11993
11262
|
} = props,
|
|
11994
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
11263
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$16);
|
|
11995
11264
|
const groupRef = React.useRef(null);
|
|
11996
11265
|
useSlideFocusManagement({
|
|
11997
11266
|
isSlideDisplayed: isDisplayed,
|
|
@@ -12001,16 +11270,16 @@ const SlideshowItemGroup = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12001
11270
|
ref: mergeRefs(groupRef, ref),
|
|
12002
11271
|
role: role,
|
|
12003
11272
|
className: classnames(className, handleBasicClasses({
|
|
12004
|
-
prefix: CLASSNAME$
|
|
11273
|
+
prefix: CLASSNAME$10
|
|
12005
11274
|
})),
|
|
12006
11275
|
"aria-roledescription": "slide",
|
|
12007
11276
|
"aria-label": label
|
|
12008
11277
|
}, forwardedProps), children);
|
|
12009
11278
|
});
|
|
12010
|
-
SlideshowItemGroup.displayName = COMPONENT_NAME$
|
|
12011
|
-
SlideshowItemGroup.className = CLASSNAME$
|
|
11279
|
+
SlideshowItemGroup.displayName = COMPONENT_NAME$13;
|
|
11280
|
+
SlideshowItemGroup.className = CLASSNAME$10;
|
|
12012
11281
|
|
|
12013
|
-
const _excluded$
|
|
11282
|
+
const _excluded$17 = ["activeIndex", "autoPlay", "children", "className", "fillHeight", "groupBy", "interval", "onChange", "slideshowControlsProps", "theme", "id", "slidesId", "slideGroupLabel"];
|
|
12014
11283
|
|
|
12015
11284
|
/**
|
|
12016
11285
|
* Defines the props of the component.
|
|
@@ -12046,7 +11315,7 @@ const Slideshow = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12046
11315
|
slidesId,
|
|
12047
11316
|
slideGroupLabel
|
|
12048
11317
|
} = props,
|
|
12049
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
11318
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$17);
|
|
12050
11319
|
// Number of slideshow items.
|
|
12051
11320
|
const itemsCount = React.Children.count(children);
|
|
12052
11321
|
const {
|
|
@@ -12128,7 +11397,7 @@ const Slideshow = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12128
11397
|
Slideshow.displayName = 'Slideshow';
|
|
12129
11398
|
Slideshow.defaultProps = DEFAULT_PROPS$P;
|
|
12130
11399
|
|
|
12131
|
-
const _excluded$
|
|
11400
|
+
const _excluded$18 = ["className", "children"];
|
|
12132
11401
|
|
|
12133
11402
|
/**
|
|
12134
11403
|
* Defines the props of the component.
|
|
@@ -12137,12 +11406,12 @@ const _excluded$1b = ["className", "children"];
|
|
|
12137
11406
|
/**
|
|
12138
11407
|
* Component display name.
|
|
12139
11408
|
*/
|
|
12140
|
-
const COMPONENT_NAME$
|
|
11409
|
+
const COMPONENT_NAME$14 = 'SlideshowItem';
|
|
12141
11410
|
|
|
12142
11411
|
/**
|
|
12143
11412
|
* Component default class name and class prefix.
|
|
12144
11413
|
*/
|
|
12145
|
-
const CLASSNAME$
|
|
11414
|
+
const CLASSNAME$11 = getRootClassName(COMPONENT_NAME$14);
|
|
12146
11415
|
|
|
12147
11416
|
/**
|
|
12148
11417
|
* SlideshowItem component.
|
|
@@ -12156,16 +11425,16 @@ const SlideshowItem = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12156
11425
|
className,
|
|
12157
11426
|
children
|
|
12158
11427
|
} = props,
|
|
12159
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
11428
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$18);
|
|
12160
11429
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
12161
11430
|
ref: ref,
|
|
12162
11431
|
className: classnames(className, handleBasicClasses({
|
|
12163
|
-
prefix: CLASSNAME$
|
|
11432
|
+
prefix: CLASSNAME$11
|
|
12164
11433
|
}))
|
|
12165
11434
|
}, forwardedProps), children);
|
|
12166
11435
|
});
|
|
12167
|
-
SlideshowItem.displayName = COMPONENT_NAME$
|
|
12168
|
-
SlideshowItem.className = CLASSNAME$
|
|
11436
|
+
SlideshowItem.displayName = COMPONENT_NAME$14;
|
|
11437
|
+
SlideshowItem.className = CLASSNAME$11;
|
|
12169
11438
|
|
|
12170
11439
|
const isTouchDevice = () => 'ontouchstart' in window;
|
|
12171
11440
|
|
|
@@ -12224,7 +11493,7 @@ function usePaginationVisibleRange(activeIndex, slideCount) {
|
|
|
12224
11493
|
}, [activeIndex, slideCount]);
|
|
12225
11494
|
}
|
|
12226
11495
|
|
|
12227
|
-
const _excluded$
|
|
11496
|
+
const _excluded$19 = ["activeIndex", "className", "nextButtonProps", "onNextClick", "onPaginationClick", "onPreviousClick", "parentRef", "previousButtonProps", "paginationProps", "slidesCount", "theme", "isAutoPlaying", "playButtonProps", "paginationItemLabel", "paginationItemProps"],
|
|
12228
11497
|
_excluded2$2 = ["className", "label"];
|
|
12229
11498
|
|
|
12230
11499
|
/**
|
|
@@ -12234,12 +11503,12 @@ const _excluded$1c = ["activeIndex", "className", "nextButtonProps", "onNextClic
|
|
|
12234
11503
|
/**
|
|
12235
11504
|
* Component display name.
|
|
12236
11505
|
*/
|
|
12237
|
-
const COMPONENT_NAME$
|
|
11506
|
+
const COMPONENT_NAME$15 = 'SlideshowControls';
|
|
12238
11507
|
|
|
12239
11508
|
/**
|
|
12240
11509
|
* Component default class name and class prefix.
|
|
12241
11510
|
*/
|
|
12242
|
-
const CLASSNAME$
|
|
11511
|
+
const CLASSNAME$12 = getRootClassName(COMPONENT_NAME$15);
|
|
12243
11512
|
|
|
12244
11513
|
/**
|
|
12245
11514
|
* Component default props.
|
|
@@ -12274,7 +11543,7 @@ const InternalSlideshowControls = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12274
11543
|
paginationItemLabel,
|
|
12275
11544
|
paginationItemProps
|
|
12276
11545
|
} = props,
|
|
12277
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
11546
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$19);
|
|
12278
11547
|
let parent;
|
|
12279
11548
|
if (WINDOW) {
|
|
12280
11549
|
// Checking window object to avoid errors in SSR.
|
|
@@ -12311,22 +11580,22 @@ const InternalSlideshowControls = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12311
11580
|
ref: ref
|
|
12312
11581
|
}, forwardedProps, {
|
|
12313
11582
|
className: classnames(className, handleBasicClasses({
|
|
12314
|
-
prefix: CLASSNAME$
|
|
11583
|
+
prefix: CLASSNAME$12,
|
|
12315
11584
|
theme
|
|
12316
11585
|
}), {
|
|
12317
|
-
[`${CLASSNAME$
|
|
11586
|
+
[`${CLASSNAME$12}--has-infinite-pagination`]: slidesCount > PAGINATION_ITEMS_MAX
|
|
12318
11587
|
})
|
|
12319
11588
|
}), /*#__PURE__*/React.createElement(IconButton, _extends({}, previousButtonProps, {
|
|
12320
11589
|
icon: mdiChevronLeft,
|
|
12321
|
-
className: `${CLASSNAME$
|
|
11590
|
+
className: `${CLASSNAME$12}__navigation`,
|
|
12322
11591
|
color: theme === Theme.dark ? 'light' : 'dark',
|
|
12323
11592
|
emphasis: Emphasis.low,
|
|
12324
11593
|
onClick: onPreviousClick
|
|
12325
11594
|
})), /*#__PURE__*/React.createElement("div", {
|
|
12326
11595
|
ref: paginationRef,
|
|
12327
|
-
className: `${CLASSNAME$
|
|
11596
|
+
className: `${CLASSNAME$12}__pagination`
|
|
12328
11597
|
}, /*#__PURE__*/React.createElement("div", _extends({
|
|
12329
|
-
className: `${CLASSNAME$
|
|
11598
|
+
className: `${CLASSNAME$12}__pagination-items`,
|
|
12330
11599
|
style: wrapperStyle,
|
|
12331
11600
|
role: "tablist"
|
|
12332
11601
|
}, paginationProps), useMemo(() => range(slidesCount).map(index => {
|
|
@@ -12342,7 +11611,7 @@ const InternalSlideshowControls = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12342
11611
|
const ariaLabel = label || (paginationItemLabel === null || paginationItemLabel === void 0 ? void 0 : paginationItemLabel(index)) || `${index + 1} / ${slidesCount}`;
|
|
12343
11612
|
return /*#__PURE__*/React.createElement("button", _extends({
|
|
12344
11613
|
className: classnames(handleBasicClasses({
|
|
12345
|
-
prefix: `${CLASSNAME$
|
|
11614
|
+
prefix: `${CLASSNAME$12}__pagination-item`,
|
|
12346
11615
|
isActive,
|
|
12347
11616
|
isOnEdge,
|
|
12348
11617
|
isOutRange
|
|
@@ -12357,35 +11626,35 @@ const InternalSlideshowControls = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12357
11626
|
}, itemProps));
|
|
12358
11627
|
}), [slidesCount, visibleRange.min, visibleRange.max, activeIndex, paginationItemProps, paginationItemLabel, onPaginationClick]))), playButtonProps ? /*#__PURE__*/React.createElement(IconButton, _extends({}, playButtonProps, {
|
|
12359
11628
|
icon: isAutoPlaying ? mdiPauseCircleOutline : mdiPlayCircleOutline,
|
|
12360
|
-
className: `${CLASSNAME$
|
|
11629
|
+
className: `${CLASSNAME$12}__play`,
|
|
12361
11630
|
color: theme === Theme.dark ? 'light' : 'dark',
|
|
12362
11631
|
emphasis: Emphasis.low
|
|
12363
11632
|
})) : null, /*#__PURE__*/React.createElement(IconButton, _extends({}, nextButtonProps, {
|
|
12364
11633
|
icon: mdiChevronRight,
|
|
12365
|
-
className: `${CLASSNAME$
|
|
11634
|
+
className: `${CLASSNAME$12}__navigation`,
|
|
12366
11635
|
color: theme === Theme.dark ? 'light' : 'dark',
|
|
12367
11636
|
emphasis: Emphasis.low,
|
|
12368
11637
|
onClick: onNextClick
|
|
12369
11638
|
})));
|
|
12370
11639
|
});
|
|
12371
|
-
InternalSlideshowControls.displayName = COMPONENT_NAME$
|
|
12372
|
-
InternalSlideshowControls.className = CLASSNAME$
|
|
11640
|
+
InternalSlideshowControls.displayName = COMPONENT_NAME$15;
|
|
11641
|
+
InternalSlideshowControls.className = CLASSNAME$12;
|
|
12373
11642
|
InternalSlideshowControls.defaultProps = DEFAULT_PROPS$Q;
|
|
12374
11643
|
const SlideshowControls = Object.assign(InternalSlideshowControls, {
|
|
12375
11644
|
useSlideshowControls,
|
|
12376
11645
|
useSlideshowControlsDefaultOptions: DEFAULT_OPTIONS$1
|
|
12377
11646
|
});
|
|
12378
11647
|
|
|
12379
|
-
const _excluded$
|
|
11648
|
+
const _excluded$1a = ["activeIndex", "id", "className", "theme", "fillHeight", "groupBy", "isAutoPlaying", "toggleAutoPlay", "slidesId", "children", "afterSlides", "hasControls", "slideGroupLabel"];
|
|
12380
11649
|
/**
|
|
12381
11650
|
* Component display name.
|
|
12382
11651
|
*/
|
|
12383
|
-
const COMPONENT_NAME$
|
|
11652
|
+
const COMPONENT_NAME$16 = 'Slideshow';
|
|
12384
11653
|
|
|
12385
11654
|
/**
|
|
12386
11655
|
* Component default class name and class prefix.
|
|
12387
11656
|
*/
|
|
12388
|
-
const CLASSNAME$
|
|
11657
|
+
const CLASSNAME$13 = getRootClassName(COMPONENT_NAME$16);
|
|
12389
11658
|
|
|
12390
11659
|
/**
|
|
12391
11660
|
* Slides component.
|
|
@@ -12410,7 +11679,7 @@ const Slides = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12410
11679
|
hasControls,
|
|
12411
11680
|
slideGroupLabel
|
|
12412
11681
|
} = props,
|
|
12413
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
11682
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1a);
|
|
12414
11683
|
const wrapperRef = React.useRef(null);
|
|
12415
11684
|
const startIndexVisible = activeIndex;
|
|
12416
11685
|
const endIndexVisible = startIndexVisible + 1;
|
|
@@ -12428,22 +11697,22 @@ const Slides = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12428
11697
|
ref: ref
|
|
12429
11698
|
}, forwardedProps, {
|
|
12430
11699
|
className: classnames(className, handleBasicClasses({
|
|
12431
|
-
prefix: CLASSNAME$
|
|
11700
|
+
prefix: CLASSNAME$13,
|
|
12432
11701
|
theme
|
|
12433
11702
|
}), {
|
|
12434
|
-
[`${CLASSNAME$
|
|
12435
|
-
[`${CLASSNAME$
|
|
11703
|
+
[`${CLASSNAME$13}--fill-height`]: fillHeight,
|
|
11704
|
+
[`${CLASSNAME$13}--group-by-${groupBy}`]: Boolean(groupBy)
|
|
12436
11705
|
}),
|
|
12437
11706
|
"aria-roledescription": "carousel"
|
|
12438
11707
|
}), /*#__PURE__*/React.createElement("div", {
|
|
12439
11708
|
id: slidesId,
|
|
12440
|
-
className: `${CLASSNAME$
|
|
11709
|
+
className: `${CLASSNAME$13}__slides`,
|
|
12441
11710
|
onMouseEnter: toggleAutoPlay,
|
|
12442
11711
|
onMouseLeave: toggleAutoPlay,
|
|
12443
11712
|
"aria-live": isAutoPlaying ? 'off' : 'polite'
|
|
12444
11713
|
}, /*#__PURE__*/React.createElement("div", {
|
|
12445
11714
|
ref: wrapperRef,
|
|
12446
|
-
className: `${CLASSNAME$
|
|
11715
|
+
className: `${CLASSNAME$13}__wrapper`,
|
|
12447
11716
|
style: wrapperStyle
|
|
12448
11717
|
}, groups.map((group, index) => /*#__PURE__*/React.createElement(SlideshowItemGroup, {
|
|
12449
11718
|
key: index,
|
|
@@ -12453,10 +11722,10 @@ const Slides = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12453
11722
|
isDisplayed: index >= startIndexVisible && index < endIndexVisible
|
|
12454
11723
|
}, group)))), afterSlides);
|
|
12455
11724
|
});
|
|
12456
|
-
Slides.displayName = COMPONENT_NAME$
|
|
12457
|
-
Slides.className = CLASSNAME$
|
|
11725
|
+
Slides.displayName = COMPONENT_NAME$16;
|
|
11726
|
+
Slides.className = CLASSNAME$13;
|
|
12458
11727
|
|
|
12459
|
-
const _excluded$
|
|
11728
|
+
const _excluded$1b = ["checked", "children", "className", "disabled", "helper", "id", "isChecked", "isDisabled", "name", "onChange", "position", "theme", "value", "inputProps"];
|
|
12460
11729
|
|
|
12461
11730
|
/**
|
|
12462
11731
|
* Defines the props of the component.
|
|
@@ -12465,12 +11734,12 @@ const _excluded$1e = ["checked", "children", "className", "disabled", "helper",
|
|
|
12465
11734
|
/**
|
|
12466
11735
|
* Component display name.
|
|
12467
11736
|
*/
|
|
12468
|
-
const COMPONENT_NAME$
|
|
11737
|
+
const COMPONENT_NAME$17 = 'Switch';
|
|
12469
11738
|
|
|
12470
11739
|
/**
|
|
12471
11740
|
* Component default class name and class prefix.
|
|
12472
11741
|
*/
|
|
12473
|
-
const CLASSNAME$
|
|
11742
|
+
const CLASSNAME$14 = getRootClassName(COMPONENT_NAME$17);
|
|
12474
11743
|
|
|
12475
11744
|
/**
|
|
12476
11745
|
* Component default props.
|
|
@@ -12504,7 +11773,7 @@ const Switch = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12504
11773
|
value,
|
|
12505
11774
|
inputProps = {}
|
|
12506
11775
|
} = props,
|
|
12507
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
11776
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1b);
|
|
12508
11777
|
const inputId = useMemo(() => id || `switch-${uid()}`, [id]);
|
|
12509
11778
|
const handleChange = event => {
|
|
12510
11779
|
if (onChange) {
|
|
@@ -12515,7 +11784,7 @@ const Switch = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12515
11784
|
ref: ref
|
|
12516
11785
|
}, forwardedProps, {
|
|
12517
11786
|
className: classnames(className, handleBasicClasses({
|
|
12518
|
-
prefix: CLASSNAME$
|
|
11787
|
+
prefix: CLASSNAME$14,
|
|
12519
11788
|
isChecked,
|
|
12520
11789
|
isDisabled,
|
|
12521
11790
|
position,
|
|
@@ -12524,12 +11793,12 @@ const Switch = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12524
11793
|
})),
|
|
12525
11794
|
"aria-disabled": isDisabled
|
|
12526
11795
|
}), /*#__PURE__*/React.createElement("div", {
|
|
12527
|
-
className: `${CLASSNAME$
|
|
11796
|
+
className: `${CLASSNAME$14}__input-wrapper`
|
|
12528
11797
|
}, /*#__PURE__*/React.createElement("input", _extends({
|
|
12529
11798
|
type: "checkbox",
|
|
12530
11799
|
role: "switch",
|
|
12531
11800
|
id: inputId,
|
|
12532
|
-
className: `${CLASSNAME$
|
|
11801
|
+
className: `${CLASSNAME$14}__input-native`,
|
|
12533
11802
|
name: name,
|
|
12534
11803
|
value: value,
|
|
12535
11804
|
disabled: isDisabled,
|
|
@@ -12538,28 +11807,28 @@ const Switch = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12538
11807
|
onChange: handleChange,
|
|
12539
11808
|
"aria-describedby": helper ? `${inputId}-helper` : undefined
|
|
12540
11809
|
}, inputProps)), /*#__PURE__*/React.createElement("div", {
|
|
12541
|
-
className: `${CLASSNAME$
|
|
11810
|
+
className: `${CLASSNAME$14}__input-placeholder`
|
|
12542
11811
|
}, /*#__PURE__*/React.createElement("div", {
|
|
12543
|
-
className: `${CLASSNAME$
|
|
11812
|
+
className: `${CLASSNAME$14}__input-background`
|
|
12544
11813
|
}), /*#__PURE__*/React.createElement("div", {
|
|
12545
|
-
className: `${CLASSNAME$
|
|
11814
|
+
className: `${CLASSNAME$14}__input-indicator`
|
|
12546
11815
|
}))), Children.count(children) > 0 && /*#__PURE__*/React.createElement("div", {
|
|
12547
|
-
className: `${CLASSNAME$
|
|
11816
|
+
className: `${CLASSNAME$14}__content`
|
|
12548
11817
|
}, /*#__PURE__*/React.createElement(InputLabel, {
|
|
12549
11818
|
htmlFor: inputId,
|
|
12550
11819
|
theme: theme,
|
|
12551
|
-
className: `${CLASSNAME$
|
|
11820
|
+
className: `${CLASSNAME$14}__label`
|
|
12552
11821
|
}, children), !isEmpty(helper) && /*#__PURE__*/React.createElement(InputHelper, {
|
|
12553
11822
|
id: `${inputId}-helper`,
|
|
12554
11823
|
theme: theme,
|
|
12555
|
-
className: `${CLASSNAME$
|
|
11824
|
+
className: `${CLASSNAME$14}__helper`
|
|
12556
11825
|
}, helper)));
|
|
12557
11826
|
});
|
|
12558
|
-
Switch.displayName = COMPONENT_NAME$
|
|
12559
|
-
Switch.className = CLASSNAME$
|
|
11827
|
+
Switch.displayName = COMPONENT_NAME$17;
|
|
11828
|
+
Switch.className = CLASSNAME$14;
|
|
12560
11829
|
Switch.defaultProps = DEFAULT_PROPS$R;
|
|
12561
11830
|
|
|
12562
|
-
const _excluded$
|
|
11831
|
+
const _excluded$1c = ["children", "className", "hasBefore", "hasDividers", "theme"];
|
|
12563
11832
|
|
|
12564
11833
|
/**
|
|
12565
11834
|
* Defines the props of the component.
|
|
@@ -12568,12 +11837,12 @@ const _excluded$1f = ["children", "className", "hasBefore", "hasDividers", "them
|
|
|
12568
11837
|
/**
|
|
12569
11838
|
* Component display name.
|
|
12570
11839
|
*/
|
|
12571
|
-
const COMPONENT_NAME$
|
|
11840
|
+
const COMPONENT_NAME$18 = 'Table';
|
|
12572
11841
|
|
|
12573
11842
|
/**
|
|
12574
11843
|
* Component default class name and class prefix.
|
|
12575
11844
|
*/
|
|
12576
|
-
const CLASSNAME$
|
|
11845
|
+
const CLASSNAME$15 = getRootClassName(COMPONENT_NAME$18);
|
|
12577
11846
|
|
|
12578
11847
|
/**
|
|
12579
11848
|
* Component default props.
|
|
@@ -12597,23 +11866,23 @@ const Table = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12597
11866
|
hasDividers,
|
|
12598
11867
|
theme
|
|
12599
11868
|
} = props,
|
|
12600
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
11869
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1c);
|
|
12601
11870
|
return /*#__PURE__*/React.createElement("table", _extends({
|
|
12602
11871
|
ref: ref
|
|
12603
11872
|
}, forwardedProps, {
|
|
12604
11873
|
className: classnames(className, handleBasicClasses({
|
|
12605
|
-
prefix: CLASSNAME$
|
|
11874
|
+
prefix: CLASSNAME$15,
|
|
12606
11875
|
hasBefore,
|
|
12607
11876
|
hasDividers,
|
|
12608
11877
|
theme
|
|
12609
11878
|
}))
|
|
12610
11879
|
}), children);
|
|
12611
11880
|
});
|
|
12612
|
-
Table.displayName = COMPONENT_NAME$
|
|
12613
|
-
Table.className = CLASSNAME$
|
|
11881
|
+
Table.displayName = COMPONENT_NAME$18;
|
|
11882
|
+
Table.className = CLASSNAME$15;
|
|
12614
11883
|
Table.defaultProps = DEFAULT_PROPS$S;
|
|
12615
11884
|
|
|
12616
|
-
const _excluded$
|
|
11885
|
+
const _excluded$1d = ["children", "className"];
|
|
12617
11886
|
|
|
12618
11887
|
/**
|
|
12619
11888
|
* Defines the props of the component.
|
|
@@ -12622,12 +11891,12 @@ const _excluded$1g = ["children", "className"];
|
|
|
12622
11891
|
/**
|
|
12623
11892
|
* Component display name.
|
|
12624
11893
|
*/
|
|
12625
|
-
const COMPONENT_NAME$
|
|
11894
|
+
const COMPONENT_NAME$19 = 'TableBody';
|
|
12626
11895
|
|
|
12627
11896
|
/**
|
|
12628
11897
|
* Component default class name and class prefix.
|
|
12629
11898
|
*/
|
|
12630
|
-
const CLASSNAME$
|
|
11899
|
+
const CLASSNAME$16 = getRootClassName(COMPONENT_NAME$19, true);
|
|
12631
11900
|
|
|
12632
11901
|
/**
|
|
12633
11902
|
* TableBody component.
|
|
@@ -12641,19 +11910,19 @@ const TableBody = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12641
11910
|
children,
|
|
12642
11911
|
className
|
|
12643
11912
|
} = props,
|
|
12644
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
11913
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1d);
|
|
12645
11914
|
return /*#__PURE__*/React.createElement("tbody", _extends({
|
|
12646
11915
|
ref: ref
|
|
12647
11916
|
}, forwardedProps, {
|
|
12648
11917
|
className: classnames(className, handleBasicClasses({
|
|
12649
|
-
prefix: CLASSNAME$
|
|
11918
|
+
prefix: CLASSNAME$16
|
|
12650
11919
|
}))
|
|
12651
11920
|
}), children);
|
|
12652
11921
|
});
|
|
12653
|
-
TableBody.displayName = COMPONENT_NAME$
|
|
12654
|
-
TableBody.className = CLASSNAME$
|
|
11922
|
+
TableBody.displayName = COMPONENT_NAME$19;
|
|
11923
|
+
TableBody.className = CLASSNAME$16;
|
|
12655
11924
|
|
|
12656
|
-
const _excluded$
|
|
11925
|
+
const _excluded$1e = ["children", "className", "icon", "isSortable", "onHeaderClick", "sortOrder", "variant"];
|
|
12657
11926
|
|
|
12658
11927
|
/**
|
|
12659
11928
|
* Table head cell sort order.
|
|
@@ -12677,12 +11946,12 @@ const TableCellVariant = {
|
|
|
12677
11946
|
/**
|
|
12678
11947
|
* Component display name.
|
|
12679
11948
|
*/
|
|
12680
|
-
const COMPONENT_NAME$
|
|
11949
|
+
const COMPONENT_NAME$1a = 'TableCell';
|
|
12681
11950
|
|
|
12682
11951
|
/**
|
|
12683
11952
|
* Component default class name and class prefix.
|
|
12684
11953
|
*/
|
|
12685
|
-
const CLASSNAME$
|
|
11954
|
+
const CLASSNAME$17 = getRootClassName(COMPONENT_NAME$1a, true);
|
|
12686
11955
|
|
|
12687
11956
|
/**
|
|
12688
11957
|
* Component default props.
|
|
@@ -12708,7 +11977,7 @@ const TableCell = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12708
11977
|
sortOrder,
|
|
12709
11978
|
variant
|
|
12710
11979
|
} = props,
|
|
12711
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
11980
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1e);
|
|
12712
11981
|
|
|
12713
11982
|
// Use button if clickable
|
|
12714
11983
|
const Wrapper = onHeaderClick ? 'button' : 'div';
|
|
@@ -12728,40 +11997,40 @@ const TableCell = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12728
11997
|
ref: ref
|
|
12729
11998
|
}, forwardedProps, {
|
|
12730
11999
|
className: classnames(handleBasicClasses({
|
|
12731
|
-
prefix: CLASSNAME$
|
|
12000
|
+
prefix: CLASSNAME$17,
|
|
12732
12001
|
isSortable,
|
|
12733
12002
|
isSorted: isSortable && !!sortOrder
|
|
12734
|
-
}), className, `${CLASSNAME$
|
|
12003
|
+
}), className, `${CLASSNAME$17}--head`),
|
|
12735
12004
|
"aria-sort": ariaSort
|
|
12736
12005
|
}), /*#__PURE__*/React.createElement(Wrapper, _extends({
|
|
12737
|
-
className: `${CLASSNAME$
|
|
12006
|
+
className: `${CLASSNAME$17}-wrapper`
|
|
12738
12007
|
}, wrapperProps), icon && !isSortable && /*#__PURE__*/React.createElement(Icon, {
|
|
12739
|
-
className: `${CLASSNAME$
|
|
12008
|
+
className: `${CLASSNAME$17}-icon`,
|
|
12740
12009
|
icon: icon,
|
|
12741
12010
|
size: Size.xxs
|
|
12742
12011
|
}), isSortable && sortOrder === ThOrder.asc && /*#__PURE__*/React.createElement(Icon, {
|
|
12743
|
-
className: `${CLASSNAME$
|
|
12012
|
+
className: `${CLASSNAME$17}-icon`,
|
|
12744
12013
|
icon: mdiArrowUp,
|
|
12745
12014
|
size: Size.xxs
|
|
12746
12015
|
}), isSortable && sortOrder === ThOrder.desc && /*#__PURE__*/React.createElement(Icon, {
|
|
12747
|
-
className: `${CLASSNAME$
|
|
12016
|
+
className: `${CLASSNAME$17}-icon`,
|
|
12748
12017
|
icon: mdiArrowDown,
|
|
12749
12018
|
size: Size.xxs
|
|
12750
12019
|
}), /*#__PURE__*/React.createElement("div", {
|
|
12751
|
-
className: `${CLASSNAME$
|
|
12020
|
+
className: `${CLASSNAME$17}-content`
|
|
12752
12021
|
}, children))), variant === TableCellVariant.body && /*#__PURE__*/React.createElement("td", _extends({}, forwardedProps, {
|
|
12753
12022
|
className: classnames(className, handleBasicClasses({
|
|
12754
|
-
prefix: CLASSNAME$
|
|
12755
|
-
}), `${CLASSNAME$
|
|
12023
|
+
prefix: CLASSNAME$17
|
|
12024
|
+
}), `${CLASSNAME$17}--body`)
|
|
12756
12025
|
}), /*#__PURE__*/React.createElement("div", {
|
|
12757
|
-
className: `${CLASSNAME$
|
|
12026
|
+
className: `${CLASSNAME$17}-content`
|
|
12758
12027
|
}, children)));
|
|
12759
12028
|
});
|
|
12760
|
-
TableCell.displayName = COMPONENT_NAME$
|
|
12761
|
-
TableCell.className = CLASSNAME$
|
|
12029
|
+
TableCell.displayName = COMPONENT_NAME$1a;
|
|
12030
|
+
TableCell.className = CLASSNAME$17;
|
|
12762
12031
|
TableCell.defaultProps = DEFAULT_PROPS$T;
|
|
12763
12032
|
|
|
12764
|
-
const _excluded$
|
|
12033
|
+
const _excluded$1f = ["children", "className"];
|
|
12765
12034
|
|
|
12766
12035
|
/**
|
|
12767
12036
|
* Defines the props of the component.
|
|
@@ -12770,12 +12039,12 @@ const _excluded$1i = ["children", "className"];
|
|
|
12770
12039
|
/**
|
|
12771
12040
|
* Component display name.
|
|
12772
12041
|
*/
|
|
12773
|
-
const COMPONENT_NAME$
|
|
12042
|
+
const COMPONENT_NAME$1b = 'TableHeader';
|
|
12774
12043
|
|
|
12775
12044
|
/**
|
|
12776
12045
|
* Component default class name and class prefix.
|
|
12777
12046
|
*/
|
|
12778
|
-
const CLASSNAME$
|
|
12047
|
+
const CLASSNAME$18 = getRootClassName(COMPONENT_NAME$1b, true);
|
|
12779
12048
|
|
|
12780
12049
|
/**
|
|
12781
12050
|
* Component default props.
|
|
@@ -12794,20 +12063,20 @@ const TableHeader = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12794
12063
|
children,
|
|
12795
12064
|
className
|
|
12796
12065
|
} = props,
|
|
12797
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
12066
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1f);
|
|
12798
12067
|
return /*#__PURE__*/React.createElement("thead", _extends({
|
|
12799
12068
|
ref: ref
|
|
12800
12069
|
}, forwardedProps, {
|
|
12801
12070
|
className: classnames(className, handleBasicClasses({
|
|
12802
|
-
prefix: CLASSNAME$
|
|
12071
|
+
prefix: CLASSNAME$18
|
|
12803
12072
|
}))
|
|
12804
12073
|
}), children);
|
|
12805
12074
|
});
|
|
12806
|
-
TableHeader.displayName = COMPONENT_NAME$
|
|
12807
|
-
TableHeader.className = CLASSNAME$
|
|
12075
|
+
TableHeader.displayName = COMPONENT_NAME$1b;
|
|
12076
|
+
TableHeader.className = CLASSNAME$18;
|
|
12808
12077
|
TableHeader.defaultProps = DEFAULT_PROPS$U;
|
|
12809
12078
|
|
|
12810
|
-
const _excluded$
|
|
12079
|
+
const _excluded$1g = ["children", "className", "disabled", "isClickable", "isDisabled", "isSelected"];
|
|
12811
12080
|
|
|
12812
12081
|
/**
|
|
12813
12082
|
* Defines the props of the component.
|
|
@@ -12816,12 +12085,12 @@ const _excluded$1j = ["children", "className", "disabled", "isClickable", "isDis
|
|
|
12816
12085
|
/**
|
|
12817
12086
|
* Component display name.
|
|
12818
12087
|
*/
|
|
12819
|
-
const COMPONENT_NAME$
|
|
12088
|
+
const COMPONENT_NAME$1c = 'TableRow';
|
|
12820
12089
|
|
|
12821
12090
|
/**
|
|
12822
12091
|
* Component default class name and class prefix.
|
|
12823
12092
|
*/
|
|
12824
|
-
const CLASSNAME$
|
|
12093
|
+
const CLASSNAME$19 = getRootClassName(COMPONENT_NAME$1c, true);
|
|
12825
12094
|
|
|
12826
12095
|
/**
|
|
12827
12096
|
* Component default props.
|
|
@@ -12844,7 +12113,7 @@ const TableRow = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12844
12113
|
isDisabled = disabled,
|
|
12845
12114
|
isSelected
|
|
12846
12115
|
} = props,
|
|
12847
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
12116
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1g);
|
|
12848
12117
|
return /*#__PURE__*/React.createElement("tr", _extends({
|
|
12849
12118
|
ref: ref,
|
|
12850
12119
|
tabIndex: isClickable && !isDisabled ? 0 : -1
|
|
@@ -12853,16 +12122,16 @@ const TableRow = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12853
12122
|
isClickable: isClickable && !isDisabled,
|
|
12854
12123
|
isDisabled,
|
|
12855
12124
|
isSelected: isSelected && !isDisabled,
|
|
12856
|
-
prefix: CLASSNAME$
|
|
12125
|
+
prefix: CLASSNAME$19
|
|
12857
12126
|
})),
|
|
12858
12127
|
"aria-disabled": isDisabled
|
|
12859
12128
|
}), children);
|
|
12860
12129
|
});
|
|
12861
|
-
TableRow.displayName = COMPONENT_NAME$
|
|
12862
|
-
TableRow.className = CLASSNAME$
|
|
12130
|
+
TableRow.displayName = COMPONENT_NAME$1c;
|
|
12131
|
+
TableRow.className = CLASSNAME$19;
|
|
12863
12132
|
TableRow.defaultProps = DEFAULT_PROPS$V;
|
|
12864
12133
|
|
|
12865
|
-
const _excluded$
|
|
12134
|
+
const _excluded$1h = ["children", "onChange"];
|
|
12866
12135
|
const DEFAULT_PROPS$W = {
|
|
12867
12136
|
isLazy: INIT_STATE.isLazy,
|
|
12868
12137
|
shouldActivateOnFocus: INIT_STATE.shouldActivateOnFocus
|
|
@@ -12882,7 +12151,7 @@ const TabProvider = props => {
|
|
|
12882
12151
|
children,
|
|
12883
12152
|
onChange
|
|
12884
12153
|
} = props,
|
|
12885
|
-
propState = _objectWithoutProperties(props, _excluded$
|
|
12154
|
+
propState = _objectWithoutProperties(props, _excluded$1h);
|
|
12886
12155
|
const [state, dispatch] = useReducer(reducer, INIT_STATE);
|
|
12887
12156
|
|
|
12888
12157
|
// On prop state change => dispatch update.
|
|
@@ -12910,7 +12179,7 @@ const TabProvider = props => {
|
|
|
12910
12179
|
};
|
|
12911
12180
|
TabProvider.defaultProps = DEFAULT_PROPS$W;
|
|
12912
12181
|
|
|
12913
|
-
const _excluded$
|
|
12182
|
+
const _excluded$1i = ["aria-label", "children", "className", "layout", "position", "theme"];
|
|
12914
12183
|
let TabListLayout = /*#__PURE__*/function (TabListLayout) {
|
|
12915
12184
|
TabListLayout["clustered"] = "clustered";
|
|
12916
12185
|
TabListLayout["fixed"] = "fixed";
|
|
@@ -12924,12 +12193,12 @@ let TabListLayout = /*#__PURE__*/function (TabListLayout) {
|
|
|
12924
12193
|
/**
|
|
12925
12194
|
* Component display name.
|
|
12926
12195
|
*/
|
|
12927
|
-
const COMPONENT_NAME$
|
|
12196
|
+
const COMPONENT_NAME$1d = 'TabList';
|
|
12928
12197
|
|
|
12929
12198
|
/**
|
|
12930
12199
|
* Component default class name and class prefix.
|
|
12931
12200
|
*/
|
|
12932
|
-
const CLASSNAME$
|
|
12201
|
+
const CLASSNAME$1a = `${CSS_PREFIX}-tabs`;
|
|
12933
12202
|
|
|
12934
12203
|
/**
|
|
12935
12204
|
* Component default props.
|
|
@@ -12958,7 +12227,7 @@ const TabList = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12958
12227
|
position,
|
|
12959
12228
|
theme
|
|
12960
12229
|
} = props,
|
|
12961
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
12230
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1i);
|
|
12962
12231
|
const tabListRef = React.useRef(null);
|
|
12963
12232
|
useRovingTabIndex({
|
|
12964
12233
|
parentRef: tabListRef,
|
|
@@ -12970,22 +12239,22 @@ const TabList = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12970
12239
|
ref: mergeRefs(ref, tabListRef)
|
|
12971
12240
|
}, forwardedProps, {
|
|
12972
12241
|
className: classnames(className, handleBasicClasses({
|
|
12973
|
-
prefix: CLASSNAME$
|
|
12242
|
+
prefix: CLASSNAME$1a,
|
|
12974
12243
|
layout,
|
|
12975
12244
|
position,
|
|
12976
12245
|
theme
|
|
12977
12246
|
}))
|
|
12978
12247
|
}), /*#__PURE__*/React.createElement("div", {
|
|
12979
|
-
className: `${CLASSNAME$
|
|
12248
|
+
className: `${CLASSNAME$1a}__links`,
|
|
12980
12249
|
role: "tablist",
|
|
12981
12250
|
"aria-label": ariaLabel
|
|
12982
12251
|
}, children));
|
|
12983
12252
|
});
|
|
12984
|
-
TabList.displayName = COMPONENT_NAME$
|
|
12985
|
-
TabList.className = CLASSNAME$
|
|
12253
|
+
TabList.displayName = COMPONENT_NAME$1d;
|
|
12254
|
+
TabList.className = CLASSNAME$1a;
|
|
12986
12255
|
TabList.defaultProps = DEFAULT_PROPS$X;
|
|
12987
12256
|
|
|
12988
|
-
const _excluded$
|
|
12257
|
+
const _excluded$1j = ["className", "disabled", "icon", "iconProps", "id", "isActive", "isDisabled", "label", "onFocus", "onKeyPress", "tabIndex"];
|
|
12989
12258
|
|
|
12990
12259
|
/**
|
|
12991
12260
|
* Defines the props of the component.
|
|
@@ -12994,12 +12263,12 @@ const _excluded$1m = ["className", "disabled", "icon", "iconProps", "id", "isAct
|
|
|
12994
12263
|
/**
|
|
12995
12264
|
* Component display name.
|
|
12996
12265
|
*/
|
|
12997
|
-
const COMPONENT_NAME$
|
|
12266
|
+
const COMPONENT_NAME$1e = 'Tab';
|
|
12998
12267
|
|
|
12999
12268
|
/**
|
|
13000
12269
|
* Component default class name and class prefix.
|
|
13001
12270
|
*/
|
|
13002
|
-
const CLASSNAME$
|
|
12271
|
+
const CLASSNAME$1b = `${CSS_PREFIX}-tabs__link`;
|
|
13003
12272
|
|
|
13004
12273
|
/**
|
|
13005
12274
|
* Component default props.
|
|
@@ -13029,7 +12298,7 @@ const Tab = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13029
12298
|
onKeyPress,
|
|
13030
12299
|
tabIndex = -1
|
|
13031
12300
|
} = props,
|
|
13032
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
12301
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1j);
|
|
13033
12302
|
const state = useTabProviderContext('tab', id);
|
|
13034
12303
|
const isActive = propIsActive || (state === null || state === void 0 ? void 0 : state.isActive);
|
|
13035
12304
|
const changeToCurrentTab = useCallback(() => {
|
|
@@ -13057,7 +12326,7 @@ const Tab = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13057
12326
|
type: "button",
|
|
13058
12327
|
id: state === null || state === void 0 ? void 0 : state.tabId,
|
|
13059
12328
|
className: classnames(className, handleBasicClasses({
|
|
13060
|
-
prefix: CLASSNAME$
|
|
12329
|
+
prefix: CLASSNAME$1b,
|
|
13061
12330
|
isActive,
|
|
13062
12331
|
isDisabled
|
|
13063
12332
|
})),
|
|
@@ -13074,11 +12343,11 @@ const Tab = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13074
12343
|
size: Size.xs
|
|
13075
12344
|
}, iconProps)), label && /*#__PURE__*/React.createElement("span", null, label));
|
|
13076
12345
|
});
|
|
13077
|
-
Tab.displayName = COMPONENT_NAME$
|
|
13078
|
-
Tab.className = CLASSNAME$
|
|
12346
|
+
Tab.displayName = COMPONENT_NAME$1e;
|
|
12347
|
+
Tab.className = CLASSNAME$1b;
|
|
13079
12348
|
Tab.defaultProps = DEFAULT_PROPS$Y;
|
|
13080
12349
|
|
|
13081
|
-
const _excluded$
|
|
12350
|
+
const _excluded$1k = ["children", "id", "className", "isActive"];
|
|
13082
12351
|
|
|
13083
12352
|
/**
|
|
13084
12353
|
* Defines the props of the component.
|
|
@@ -13087,12 +12356,12 @@ const _excluded$1n = ["children", "id", "className", "isActive"];
|
|
|
13087
12356
|
/**
|
|
13088
12357
|
* Component display name.
|
|
13089
12358
|
*/
|
|
13090
|
-
const COMPONENT_NAME$
|
|
12359
|
+
const COMPONENT_NAME$1f = 'TabPanel';
|
|
13091
12360
|
|
|
13092
12361
|
/**
|
|
13093
12362
|
* Component default class name and class prefix.
|
|
13094
12363
|
*/
|
|
13095
|
-
const CLASSNAME$
|
|
12364
|
+
const CLASSNAME$1c = `${CSS_PREFIX}-tab-panel`;
|
|
13096
12365
|
|
|
13097
12366
|
/**
|
|
13098
12367
|
* Component default props.
|
|
@@ -13115,7 +12384,7 @@ const TabPanel = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13115
12384
|
className,
|
|
13116
12385
|
isActive: propIsActive
|
|
13117
12386
|
} = props,
|
|
13118
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
12387
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1k);
|
|
13119
12388
|
const state = useTabProviderContext('tabPanel', id);
|
|
13120
12389
|
const isActive = propIsActive || (state === null || state === void 0 ? void 0 : state.isActive);
|
|
13121
12390
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
@@ -13123,7 +12392,7 @@ const TabPanel = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13123
12392
|
}, forwardedProps, {
|
|
13124
12393
|
id: state === null || state === void 0 ? void 0 : state.tabPanelId,
|
|
13125
12394
|
className: classnames(className, handleBasicClasses({
|
|
13126
|
-
prefix: CLASSNAME$
|
|
12395
|
+
prefix: CLASSNAME$1c,
|
|
13127
12396
|
isActive
|
|
13128
12397
|
})),
|
|
13129
12398
|
role: "tabpanel",
|
|
@@ -13131,11 +12400,11 @@ const TabPanel = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13131
12400
|
"aria-labelledby": state === null || state === void 0 ? void 0 : state.tabId
|
|
13132
12401
|
}), (!(state !== null && state !== void 0 && state.isLazy) || isActive) && children);
|
|
13133
12402
|
});
|
|
13134
|
-
TabPanel.displayName = COMPONENT_NAME$
|
|
13135
|
-
TabPanel.className = CLASSNAME$
|
|
12403
|
+
TabPanel.displayName = COMPONENT_NAME$1f;
|
|
12404
|
+
TabPanel.className = CLASSNAME$1c;
|
|
13136
12405
|
TabPanel.defaultProps = DEFAULT_PROPS$Z;
|
|
13137
12406
|
|
|
13138
|
-
const _excluded$
|
|
12407
|
+
const _excluded$1l = ["id", "isDisabled", "isRequired", "placeholder", "multiline", "value", "setFocus", "onChange", "onFocus", "onBlur", "inputRef", "rows", "recomputeNumberOfRows", "type", "name", "hasError", "describedById"],
|
|
13139
12408
|
_excluded2$3 = ["chips", "className", "clearButtonProps", "disabled", "error", "forceFocusStyle", "hasError", "helper", "icon", "id", "inputRef", "isDisabled", "isRequired", "isValid", "label", "labelProps", "maxLength", "minimumRows", "multiline", "name", "onBlur", "onChange", "onClear", "onFocus", "placeholder", "textFieldRef", "theme", "type", "value", "afterElement"];
|
|
13140
12409
|
|
|
13141
12410
|
/**
|
|
@@ -13145,12 +12414,12 @@ const _excluded$1o = ["id", "isDisabled", "isRequired", "placeholder", "multilin
|
|
|
13145
12414
|
/**
|
|
13146
12415
|
* Component display name.
|
|
13147
12416
|
*/
|
|
13148
|
-
const COMPONENT_NAME$
|
|
12417
|
+
const COMPONENT_NAME$1g = 'TextField';
|
|
13149
12418
|
|
|
13150
12419
|
/**
|
|
13151
12420
|
* Component default class name and class prefix.
|
|
13152
12421
|
*/
|
|
13153
|
-
const CLASSNAME$
|
|
12422
|
+
const CLASSNAME$1d = getRootClassName(COMPONENT_NAME$1g);
|
|
13154
12423
|
|
|
13155
12424
|
/**
|
|
13156
12425
|
* Default minimum number of rows in the multiline mode.
|
|
@@ -13220,7 +12489,7 @@ const renderInputNative = props => {
|
|
|
13220
12489
|
hasError,
|
|
13221
12490
|
describedById
|
|
13222
12491
|
} = props,
|
|
13223
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
12492
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1l);
|
|
13224
12493
|
// eslint-disable-next-line react-hooks/rules-of-hooks
|
|
13225
12494
|
const ref = useRef(null);
|
|
13226
12495
|
|
|
@@ -13245,7 +12514,7 @@ const renderInputNative = props => {
|
|
|
13245
12514
|
const Component = multiline ? 'textarea' : 'input';
|
|
13246
12515
|
const inputProps = _objectSpread2(_objectSpread2({}, forwardedProps), {}, {
|
|
13247
12516
|
id,
|
|
13248
|
-
className: multiline ? `${CLASSNAME$
|
|
12517
|
+
className: multiline ? `${CLASSNAME$1d}__input-native ${CLASSNAME$1d}__input-native--textarea` : `${CLASSNAME$1d}__input-native ${CLASSNAME$1d}__input-native--text`,
|
|
13249
12518
|
placeholder,
|
|
13250
12519
|
value,
|
|
13251
12520
|
name,
|
|
@@ -13366,31 +12635,31 @@ const TextField = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13366
12635
|
isDisabled,
|
|
13367
12636
|
isFocus: isFocus || forceFocusStyle,
|
|
13368
12637
|
isValid,
|
|
13369
|
-
prefix: CLASSNAME$
|
|
12638
|
+
prefix: CLASSNAME$1d,
|
|
13370
12639
|
theme
|
|
13371
12640
|
}))
|
|
13372
12641
|
}, (label || maxLength) && /*#__PURE__*/React.createElement("div", {
|
|
13373
|
-
className: `${CLASSNAME$
|
|
12642
|
+
className: `${CLASSNAME$1d}__header`
|
|
13374
12643
|
}, label && /*#__PURE__*/React.createElement(InputLabel, _extends({}, labelProps, {
|
|
13375
12644
|
htmlFor: textFieldId,
|
|
13376
|
-
className: `${CLASSNAME$
|
|
12645
|
+
className: `${CLASSNAME$1d}__label`,
|
|
13377
12646
|
isRequired: isRequired,
|
|
13378
12647
|
theme: theme
|
|
13379
12648
|
}), label), maxLength && /*#__PURE__*/React.createElement("div", {
|
|
13380
|
-
className: `${CLASSNAME$
|
|
12649
|
+
className: `${CLASSNAME$1d}__char-counter`
|
|
13381
12650
|
}, /*#__PURE__*/React.createElement("span", null, maxLength - valueLength), maxLength - valueLength === 0 && /*#__PURE__*/React.createElement(Icon, {
|
|
13382
12651
|
icon: mdiAlertCircle,
|
|
13383
12652
|
size: Size.xxs
|
|
13384
12653
|
}))), /*#__PURE__*/React.createElement("div", {
|
|
13385
|
-
className: `${CLASSNAME$
|
|
12654
|
+
className: `${CLASSNAME$1d}__wrapper`,
|
|
13386
12655
|
ref: textFieldRef
|
|
13387
12656
|
}, icon && /*#__PURE__*/React.createElement(Icon, {
|
|
13388
|
-
className: `${CLASSNAME$
|
|
12657
|
+
className: `${CLASSNAME$1d}__input-icon`,
|
|
13389
12658
|
color: theme === Theme.dark ? 'light' : undefined,
|
|
13390
12659
|
icon: icon,
|
|
13391
12660
|
size: Size.xs
|
|
13392
12661
|
}), chips && /*#__PURE__*/React.createElement("div", {
|
|
13393
|
-
className: `${CLASSNAME$
|
|
12662
|
+
className: `${CLASSNAME$1d}__chips`
|
|
13394
12663
|
}, chips, renderInputNative(_objectSpread2({
|
|
13395
12664
|
id: textFieldId,
|
|
13396
12665
|
inputRef,
|
|
@@ -13411,7 +12680,7 @@ const TextField = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13411
12680
|
hasError,
|
|
13412
12681
|
describedById
|
|
13413
12682
|
}, forwardedProps))), !chips && /*#__PURE__*/React.createElement("div", {
|
|
13414
|
-
className: `${CLASSNAME$
|
|
12683
|
+
className: `${CLASSNAME$1d}__input-wrapper`
|
|
13415
12684
|
}, renderInputNative(_objectSpread2({
|
|
13416
12685
|
id: textFieldId,
|
|
13417
12686
|
inputRef,
|
|
@@ -13432,12 +12701,12 @@ const TextField = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13432
12701
|
hasError,
|
|
13433
12702
|
describedById
|
|
13434
12703
|
}, forwardedProps))), (isValid || hasError) && /*#__PURE__*/React.createElement(Icon, {
|
|
13435
|
-
className: `${CLASSNAME$
|
|
12704
|
+
className: `${CLASSNAME$1d}__input-validity`,
|
|
13436
12705
|
color: theme === Theme.dark ? 'light' : undefined,
|
|
13437
12706
|
icon: isValid ? mdiCheckCircle : mdiAlertCircle,
|
|
13438
12707
|
size: Size.xxs
|
|
13439
12708
|
}), clearButtonProps && isNotEmpty && /*#__PURE__*/React.createElement(IconButton, _extends({}, clearButtonProps, {
|
|
13440
|
-
className: `${CLASSNAME$
|
|
12709
|
+
className: `${CLASSNAME$1d}__input-clear`,
|
|
13441
12710
|
icon: mdiCloseCircle,
|
|
13442
12711
|
emphasis: Emphasis.low,
|
|
13443
12712
|
size: Size.s,
|
|
@@ -13445,20 +12714,20 @@ const TextField = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13445
12714
|
onClick: handleClear,
|
|
13446
12715
|
type: "button"
|
|
13447
12716
|
})), afterElement && /*#__PURE__*/React.createElement("div", {
|
|
13448
|
-
className: `${CLASSNAME$
|
|
12717
|
+
className: `${CLASSNAME$1d}__after-element`
|
|
13449
12718
|
}, afterElement)), hasError && error && /*#__PURE__*/React.createElement(InputHelper, {
|
|
13450
|
-
className: `${CLASSNAME$
|
|
12719
|
+
className: `${CLASSNAME$1d}__helper`,
|
|
13451
12720
|
kind: Kind.error,
|
|
13452
12721
|
theme: theme,
|
|
13453
12722
|
id: errorId
|
|
13454
12723
|
}, error), helper && /*#__PURE__*/React.createElement(InputHelper, {
|
|
13455
|
-
className: `${CLASSNAME$
|
|
12724
|
+
className: `${CLASSNAME$1d}__helper`,
|
|
13456
12725
|
theme: theme,
|
|
13457
12726
|
id: helperId
|
|
13458
12727
|
}, helper));
|
|
13459
12728
|
});
|
|
13460
|
-
TextField.displayName = COMPONENT_NAME$
|
|
13461
|
-
TextField.className = CLASSNAME$
|
|
12729
|
+
TextField.displayName = COMPONENT_NAME$1g;
|
|
12730
|
+
TextField.className = CLASSNAME$1d;
|
|
13462
12731
|
TextField.defaultProps = DEFAULT_PROPS$_;
|
|
13463
12732
|
|
|
13464
12733
|
function getState(img, event) {
|
|
@@ -13511,7 +12780,6 @@ function shiftPosition(_ref) {
|
|
|
13511
12780
|
const shift = startFocus / (scaledSize - containerSize);
|
|
13512
12781
|
return Math.floor(Math.max(Math.min(shift, 1), 0) * 100);
|
|
13513
12782
|
}
|
|
13514
|
-
|
|
13515
12783
|
// Compute CSS properties to apply the focus point.
|
|
13516
12784
|
const useFocusPointStyle = (_ref2, element, isLoaded) => {
|
|
13517
12785
|
let {
|
|
@@ -13604,7 +12872,7 @@ const useFocusPointStyle = (_ref2, element, isLoaded) => {
|
|
|
13604
12872
|
return style;
|
|
13605
12873
|
};
|
|
13606
12874
|
|
|
13607
|
-
const _excluded$
|
|
12875
|
+
const _excluded$1m = ["align", "alt", "aspectRatio", "badge", "className", "crossOrigin", "fallback", "fillHeight", "focusPoint", "image", "imgProps", "imgRef", "isLoading", "objectFit", "loading", "size", "theme", "variant", "linkProps", "linkAs"];
|
|
13608
12876
|
|
|
13609
12877
|
/**
|
|
13610
12878
|
* Defines the props of the component.
|
|
@@ -13613,12 +12881,12 @@ const _excluded$1p = ["align", "alt", "aspectRatio", "badge", "className", "cros
|
|
|
13613
12881
|
/**
|
|
13614
12882
|
* Component display name.
|
|
13615
12883
|
*/
|
|
13616
|
-
const COMPONENT_NAME$
|
|
12884
|
+
const COMPONENT_NAME$1h = 'Thumbnail';
|
|
13617
12885
|
|
|
13618
12886
|
/**
|
|
13619
12887
|
* Component default class name and class prefix.
|
|
13620
12888
|
*/
|
|
13621
|
-
const CLASSNAME$
|
|
12889
|
+
const CLASSNAME$1e = getRootClassName(COMPONENT_NAME$1h);
|
|
13622
12890
|
|
|
13623
12891
|
/**
|
|
13624
12892
|
* Component default props.
|
|
@@ -13637,7 +12905,6 @@ const DEFAULT_PROPS$$ = {
|
|
|
13637
12905
|
* @return React element.
|
|
13638
12906
|
*/
|
|
13639
12907
|
const Thumbnail = /*#__PURE__*/forwardRef((props, ref) => {
|
|
13640
|
-
var _loadingPlaceholderIm;
|
|
13641
12908
|
const {
|
|
13642
12909
|
align,
|
|
13643
12910
|
alt,
|
|
@@ -13656,14 +12923,13 @@ const Thumbnail = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13656
12923
|
isLoading: isLoadingProp,
|
|
13657
12924
|
objectFit,
|
|
13658
12925
|
loading,
|
|
13659
|
-
loadingPlaceholderImageRef,
|
|
13660
12926
|
size,
|
|
13661
12927
|
theme,
|
|
13662
12928
|
variant,
|
|
13663
12929
|
linkProps,
|
|
13664
12930
|
linkAs
|
|
13665
12931
|
} = props,
|
|
13666
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
12932
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1m);
|
|
13667
12933
|
const [imgElement, setImgElement] = useState();
|
|
13668
12934
|
|
|
13669
12935
|
// Image loading state.
|
|
@@ -13697,20 +12963,12 @@ const Thumbnail = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13697
12963
|
wrapperProps.type = forwardedProps.type || 'button';
|
|
13698
12964
|
wrapperProps['aria-label'] = forwardedProps['aria-label'] || alt;
|
|
13699
12965
|
}
|
|
13700
|
-
|
|
13701
|
-
// If we have a loading placeholder image that is really loaded (complete)
|
|
13702
|
-
const loadingPlaceholderImage = isLoading && (loadingPlaceholderImageRef === null || loadingPlaceholderImageRef === void 0 ? void 0 : (_loadingPlaceholderIm = loadingPlaceholderImageRef.current) === null || _loadingPlaceholderIm === void 0 ? void 0 : _loadingPlaceholderIm.complete) && (loadingPlaceholderImageRef === null || loadingPlaceholderImageRef === void 0 ? void 0 : loadingPlaceholderImageRef.current) || undefined;
|
|
13703
|
-
const loadingStyle = loadingPlaceholderImage ? {
|
|
13704
|
-
backgroundImage: `url(${loadingPlaceholderImage.src})`,
|
|
13705
|
-
minWidth: loadingPlaceholderImage.naturalWidth,
|
|
13706
|
-
minHeight: loadingPlaceholderImage.naturalHeight
|
|
13707
|
-
} : undefined;
|
|
13708
12966
|
return /*#__PURE__*/React.createElement(Wrapper, _extends({}, wrapperProps, {
|
|
13709
12967
|
ref: ref,
|
|
13710
12968
|
className: classnames(linkProps === null || linkProps === void 0 ? void 0 : linkProps.className, className, handleBasicClasses({
|
|
13711
12969
|
align,
|
|
13712
12970
|
aspectRatio,
|
|
13713
|
-
prefix: CLASSNAME$
|
|
12971
|
+
prefix: CLASSNAME$1e,
|
|
13714
12972
|
size,
|
|
13715
12973
|
theme,
|
|
13716
12974
|
variant,
|
|
@@ -13721,14 +12979,14 @@ const Thumbnail = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13721
12979
|
isLoading,
|
|
13722
12980
|
objectFit,
|
|
13723
12981
|
hasBadge: !!badge
|
|
13724
|
-
}), fillHeight && `${CLASSNAME$
|
|
12982
|
+
}), fillHeight && `${CLASSNAME$1e}--fill-height`)
|
|
13725
12983
|
}), /*#__PURE__*/React.createElement("span", {
|
|
13726
|
-
className: `${CLASSNAME$
|
|
12984
|
+
className: `${CLASSNAME$1e}__background`
|
|
13727
12985
|
}, /*#__PURE__*/React.createElement("img", _extends({}, imgProps, {
|
|
13728
|
-
style: _objectSpread2(_objectSpread2(_objectSpread2(
|
|
12986
|
+
style: _objectSpread2(_objectSpread2(_objectSpread2({}, imgProps === null || imgProps === void 0 ? void 0 : imgProps.style), imageErrorStyle), focusPointStyle),
|
|
13729
12987
|
ref: mergeRefs(setImgElement, propImgRef),
|
|
13730
12988
|
className: classnames(handleBasicClasses({
|
|
13731
|
-
prefix: `${CLASSNAME$
|
|
12989
|
+
prefix: `${CLASSNAME$1e}__image`,
|
|
13732
12990
|
isLoading,
|
|
13733
12991
|
hasDefinedSize: Boolean((imgProps === null || imgProps === void 0 ? void 0 : imgProps.height) && imgProps.width)
|
|
13734
12992
|
}), imgProps === null || imgProps === void 0 ? void 0 : imgProps.className),
|
|
@@ -13737,17 +12995,17 @@ const Thumbnail = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13737
12995
|
alt: alt,
|
|
13738
12996
|
loading: loading
|
|
13739
12997
|
})), !isLoading && hasError && /*#__PURE__*/React.createElement("span", {
|
|
13740
|
-
className: `${CLASSNAME$
|
|
12998
|
+
className: `${CLASSNAME$1e}__fallback`
|
|
13741
12999
|
}, hasIconErrorFallback ? /*#__PURE__*/React.createElement(Icon, {
|
|
13742
13000
|
icon: fallback,
|
|
13743
13001
|
size: Size.xxs,
|
|
13744
13002
|
theme: theme
|
|
13745
13003
|
}) : fallback)), badge && /*#__PURE__*/React.cloneElement(badge, {
|
|
13746
|
-
className: classnames(`${CLASSNAME$
|
|
13004
|
+
className: classnames(`${CLASSNAME$1e}__badge`, badge.props.className)
|
|
13747
13005
|
}));
|
|
13748
13006
|
});
|
|
13749
|
-
Thumbnail.displayName = COMPONENT_NAME$
|
|
13750
|
-
Thumbnail.className = CLASSNAME$
|
|
13007
|
+
Thumbnail.displayName = COMPONENT_NAME$1h;
|
|
13008
|
+
Thumbnail.className = CLASSNAME$1e;
|
|
13751
13009
|
Thumbnail.defaultProps = DEFAULT_PROPS$$;
|
|
13752
13010
|
|
|
13753
13011
|
/**
|
|
@@ -13785,7 +13043,7 @@ const ThumbnailObjectFit = {
|
|
|
13785
13043
|
contain: 'contain'
|
|
13786
13044
|
};
|
|
13787
13045
|
|
|
13788
|
-
const _excluded$
|
|
13046
|
+
const _excluded$1n = ["after", "before", "className", "label"];
|
|
13789
13047
|
|
|
13790
13048
|
/**
|
|
13791
13049
|
* Defines the props of the component.
|
|
@@ -13794,12 +13052,12 @@ const _excluded$1q = ["after", "before", "className", "label"];
|
|
|
13794
13052
|
/**
|
|
13795
13053
|
* Component display name.
|
|
13796
13054
|
*/
|
|
13797
|
-
const COMPONENT_NAME$
|
|
13055
|
+
const COMPONENT_NAME$1i = 'Toolbar';
|
|
13798
13056
|
|
|
13799
13057
|
/**
|
|
13800
13058
|
* Component default class name and class prefix.
|
|
13801
13059
|
*/
|
|
13802
|
-
const CLASSNAME$
|
|
13060
|
+
const CLASSNAME$1f = getRootClassName(COMPONENT_NAME$1i);
|
|
13803
13061
|
|
|
13804
13062
|
/**
|
|
13805
13063
|
* Component default props.
|
|
@@ -13820,7 +13078,7 @@ const Toolbar = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13820
13078
|
className,
|
|
13821
13079
|
label
|
|
13822
13080
|
} = props,
|
|
13823
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
13081
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1n);
|
|
13824
13082
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
13825
13083
|
ref: ref
|
|
13826
13084
|
}, forwardedProps, {
|
|
@@ -13828,18 +13086,18 @@ const Toolbar = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13828
13086
|
hasAfter: Boolean(after),
|
|
13829
13087
|
hasBefore: Boolean(before),
|
|
13830
13088
|
hasLabel: Boolean(label),
|
|
13831
|
-
prefix: CLASSNAME$
|
|
13089
|
+
prefix: CLASSNAME$1f
|
|
13832
13090
|
}))
|
|
13833
13091
|
}), before && /*#__PURE__*/React.createElement("div", {
|
|
13834
|
-
className: `${CLASSNAME$
|
|
13092
|
+
className: `${CLASSNAME$1f}__before`
|
|
13835
13093
|
}, before), label && /*#__PURE__*/React.createElement("div", {
|
|
13836
|
-
className: `${CLASSNAME$
|
|
13094
|
+
className: `${CLASSNAME$1f}__label`
|
|
13837
13095
|
}, label), after && /*#__PURE__*/React.createElement("div", {
|
|
13838
|
-
className: `${CLASSNAME$
|
|
13096
|
+
className: `${CLASSNAME$1f}__after`
|
|
13839
13097
|
}, after));
|
|
13840
13098
|
});
|
|
13841
|
-
Toolbar.displayName = COMPONENT_NAME$
|
|
13842
|
-
Toolbar.className = CLASSNAME$
|
|
13099
|
+
Toolbar.displayName = COMPONENT_NAME$1i;
|
|
13100
|
+
Toolbar.className = CLASSNAME$1f;
|
|
13843
13101
|
Toolbar.defaultProps = DEFAULT_PROPS$10;
|
|
13844
13102
|
|
|
13845
13103
|
/**
|
|
@@ -14017,7 +13275,7 @@ function useTooltipOpen(delay, anchorElement) {
|
|
|
14017
13275
|
};
|
|
14018
13276
|
}
|
|
14019
13277
|
|
|
14020
|
-
const _excluded$
|
|
13278
|
+
const _excluded$1o = ["label", "children", "className", "delay", "placement", "forceOpen"];
|
|
14021
13279
|
|
|
14022
13280
|
/** Position of the tooltip relative to the anchor element. */
|
|
14023
13281
|
|
|
@@ -14028,12 +13286,12 @@ const _excluded$1r = ["label", "children", "className", "delay", "placement", "f
|
|
|
14028
13286
|
/**
|
|
14029
13287
|
* Component display name.
|
|
14030
13288
|
*/
|
|
14031
|
-
const COMPONENT_NAME$
|
|
13289
|
+
const COMPONENT_NAME$1j = 'Tooltip';
|
|
14032
13290
|
|
|
14033
13291
|
/**
|
|
14034
13292
|
* Component default class name and class prefix.
|
|
14035
13293
|
*/
|
|
14036
|
-
const CLASSNAME$
|
|
13294
|
+
const CLASSNAME$1g = getRootClassName(COMPONENT_NAME$1j);
|
|
14037
13295
|
|
|
14038
13296
|
/**
|
|
14039
13297
|
* Component default props.
|
|
@@ -14064,7 +13322,7 @@ const Tooltip = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
14064
13322
|
placement,
|
|
14065
13323
|
forceOpen
|
|
14066
13324
|
} = props,
|
|
14067
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
13325
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1o);
|
|
14068
13326
|
// Disable in SSR or without a label.
|
|
14069
13327
|
if (!DOCUMENT || !label) {
|
|
14070
13328
|
return /*#__PURE__*/React.createElement(TooltipContextProvider, null, children);
|
|
@@ -14098,23 +13356,23 @@ const Tooltip = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
14098
13356
|
role: "tooltip",
|
|
14099
13357
|
"aria-label": label,
|
|
14100
13358
|
className: classnames(className, handleBasicClasses({
|
|
14101
|
-
prefix: CLASSNAME$
|
|
13359
|
+
prefix: CLASSNAME$1g,
|
|
14102
13360
|
position
|
|
14103
13361
|
})),
|
|
14104
13362
|
style: styles.popper
|
|
14105
13363
|
}, attributes.popper), /*#__PURE__*/React.createElement("div", {
|
|
14106
|
-
className: `${CLASSNAME$
|
|
13364
|
+
className: `${CLASSNAME$1g}__arrow`
|
|
14107
13365
|
}), /*#__PURE__*/React.createElement("div", {
|
|
14108
|
-
className: `${CLASSNAME$
|
|
13366
|
+
className: `${CLASSNAME$1g}__inner`
|
|
14109
13367
|
}, label.indexOf('\n') !== -1 ? label.split('\n').map(sentence => /*#__PURE__*/React.createElement("p", {
|
|
14110
13368
|
key: sentence
|
|
14111
13369
|
}, sentence)) : label)), document.body));
|
|
14112
13370
|
});
|
|
14113
|
-
Tooltip.displayName = COMPONENT_NAME$
|
|
14114
|
-
Tooltip.className = CLASSNAME$
|
|
13371
|
+
Tooltip.displayName = COMPONENT_NAME$1j;
|
|
13372
|
+
Tooltip.className = CLASSNAME$1g;
|
|
14115
13373
|
Tooltip.defaultProps = DEFAULT_PROPS$11;
|
|
14116
13374
|
|
|
14117
|
-
const _excluded$
|
|
13375
|
+
const _excluded$1p = ["aspectRatio", "className", "label", "icon", "size", "theme", "variant", "fileInputProps"];
|
|
14118
13376
|
|
|
14119
13377
|
/**
|
|
14120
13378
|
* Uploader variants.
|
|
@@ -14140,12 +13398,12 @@ const UploaderVariant = {
|
|
|
14140
13398
|
/**
|
|
14141
13399
|
* Component display name.
|
|
14142
13400
|
*/
|
|
14143
|
-
const COMPONENT_NAME$
|
|
13401
|
+
const COMPONENT_NAME$1k = 'Uploader';
|
|
14144
13402
|
|
|
14145
13403
|
/**
|
|
14146
13404
|
* Component default class name and class prefix.
|
|
14147
13405
|
*/
|
|
14148
|
-
const CLASSNAME$
|
|
13406
|
+
const CLASSNAME$1h = getRootClassName(COMPONENT_NAME$1k);
|
|
14149
13407
|
|
|
14150
13408
|
/**
|
|
14151
13409
|
* Component default props.
|
|
@@ -14175,7 +13433,7 @@ const Uploader = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
14175
13433
|
variant,
|
|
14176
13434
|
fileInputProps
|
|
14177
13435
|
} = props,
|
|
14178
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
13436
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1p);
|
|
14179
13437
|
// Adjust to square aspect ratio when using circle variants.
|
|
14180
13438
|
const adjustedAspectRatio = variant === UploaderVariant.circle ? AspectRatio.square : aspectRatio;
|
|
14181
13439
|
const inputId = React.useMemo(() => (fileInputProps === null || fileInputProps === void 0 ? void 0 : fileInputProps.id) || uniqueId('uploader-input-'), [fileInputProps === null || fileInputProps === void 0 ? void 0 : fileInputProps.id]);
|
|
@@ -14204,26 +13462,26 @@ const Uploader = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
14204
13462
|
}, wrapper.props, forwardedProps, {
|
|
14205
13463
|
className: classnames(className, handleBasicClasses({
|
|
14206
13464
|
aspectRatio: adjustedAspectRatio,
|
|
14207
|
-
prefix: CLASSNAME$
|
|
13465
|
+
prefix: CLASSNAME$1h,
|
|
14208
13466
|
size,
|
|
14209
13467
|
theme,
|
|
14210
13468
|
variant,
|
|
14211
13469
|
isDragHovering
|
|
14212
13470
|
}))
|
|
14213
13471
|
}), /*#__PURE__*/React.createElement("span", {
|
|
14214
|
-
className: `${CLASSNAME$
|
|
13472
|
+
className: `${CLASSNAME$1h}__background`
|
|
14215
13473
|
}), /*#__PURE__*/React.createElement("span", {
|
|
14216
|
-
className: `${CLASSNAME$
|
|
13474
|
+
className: `${CLASSNAME$1h}__wrapper`
|
|
14217
13475
|
}, icon && /*#__PURE__*/React.createElement(Icon, {
|
|
14218
|
-
className: `${CLASSNAME$
|
|
13476
|
+
className: `${CLASSNAME$1h}__icon`,
|
|
14219
13477
|
icon: icon,
|
|
14220
13478
|
size: Size.s
|
|
14221
13479
|
}), label && /*#__PURE__*/React.createElement("span", {
|
|
14222
|
-
className: `${CLASSNAME$
|
|
13480
|
+
className: `${CLASSNAME$1h}__label`
|
|
14223
13481
|
}, label)), fileInputProps && /*#__PURE__*/React.createElement("input", _extends({
|
|
14224
13482
|
type: "file",
|
|
14225
13483
|
id: inputId,
|
|
14226
|
-
className: `${CLASSNAME$
|
|
13484
|
+
className: `${CLASSNAME$1h}__input`
|
|
14227
13485
|
}, fileInputProps, {
|
|
14228
13486
|
onChange: onChange,
|
|
14229
13487
|
onDragEnter: setDragHovering,
|
|
@@ -14231,11 +13489,11 @@ const Uploader = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
14231
13489
|
onDrop: unsetDragHovering
|
|
14232
13490
|
})));
|
|
14233
13491
|
});
|
|
14234
|
-
Uploader.displayName = COMPONENT_NAME$
|
|
14235
|
-
Uploader.className = CLASSNAME$
|
|
13492
|
+
Uploader.displayName = COMPONENT_NAME$1k;
|
|
13493
|
+
Uploader.className = CLASSNAME$1h;
|
|
14236
13494
|
Uploader.defaultProps = DEFAULT_PROPS$12;
|
|
14237
13495
|
|
|
14238
|
-
const _excluded$
|
|
13496
|
+
const _excluded$1q = ["avatarProps", "className", "fields", "linkProps", "linkAs", "multipleActions", "name", "nameProps", "onClick", "onMouseEnter", "onMouseLeave", "orientation", "simpleAction", "size", "theme"];
|
|
14239
13497
|
|
|
14240
13498
|
/**
|
|
14241
13499
|
* User block sizes.
|
|
@@ -14248,12 +13506,12 @@ const _excluded$1t = ["avatarProps", "className", "fields", "linkProps", "linkAs
|
|
|
14248
13506
|
/**
|
|
14249
13507
|
* Component display name.
|
|
14250
13508
|
*/
|
|
14251
|
-
const COMPONENT_NAME$
|
|
13509
|
+
const COMPONENT_NAME$1l = 'UserBlock';
|
|
14252
13510
|
|
|
14253
13511
|
/**
|
|
14254
13512
|
* Component default class name and class prefix.
|
|
14255
13513
|
*/
|
|
14256
|
-
const CLASSNAME$
|
|
13514
|
+
const CLASSNAME$1i = getRootClassName(COMPONENT_NAME$1l);
|
|
14257
13515
|
|
|
14258
13516
|
/**
|
|
14259
13517
|
* Component default props.
|
|
@@ -14289,7 +13547,7 @@ const UserBlock = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
14289
13547
|
size,
|
|
14290
13548
|
theme
|
|
14291
13549
|
} = props,
|
|
14292
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
13550
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1q);
|
|
14293
13551
|
let componentSize = size;
|
|
14294
13552
|
|
|
14295
13553
|
// Special case - When using vertical orientation force the size to be Sizes.l.
|
|
@@ -14305,7 +13563,7 @@ const UserBlock = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
14305
13563
|
}
|
|
14306
13564
|
let NameComponent = 'span';
|
|
14307
13565
|
const nProps = _objectSpread2(_objectSpread2({}, nameProps), {}, {
|
|
14308
|
-
className: classnames(`${CLASSNAME$
|
|
13566
|
+
className: classnames(`${CLASSNAME$1i}__name`, linkProps === null || linkProps === void 0 ? void 0 : linkProps.className, nameProps === null || nameProps === void 0 ? void 0 : nameProps.className)
|
|
14309
13567
|
});
|
|
14310
13568
|
if (isClickable) {
|
|
14311
13569
|
NameComponent = Link;
|
|
@@ -14322,16 +13580,16 @@ const UserBlock = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
14322
13580
|
return /*#__PURE__*/React.createElement(NameComponent, nProps, name);
|
|
14323
13581
|
}, [avatarProps, isClickable, linkAs, linkProps, name, nameProps, onClick]);
|
|
14324
13582
|
const fieldsBlock = fields && componentSize !== Size.s && /*#__PURE__*/React.createElement("div", {
|
|
14325
|
-
className: `${CLASSNAME$
|
|
13583
|
+
className: `${CLASSNAME$1i}__fields`
|
|
14326
13584
|
}, fields.map((field, idx) => /*#__PURE__*/React.createElement("span", {
|
|
14327
13585
|
key: idx,
|
|
14328
|
-
className: `${CLASSNAME$
|
|
13586
|
+
className: `${CLASSNAME$1i}__field`
|
|
14329
13587
|
}, field)));
|
|
14330
13588
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
14331
13589
|
ref: ref
|
|
14332
13590
|
}, forwardedProps, {
|
|
14333
13591
|
className: classnames(className, handleBasicClasses({
|
|
14334
|
-
prefix: CLASSNAME$
|
|
13592
|
+
prefix: CLASSNAME$1i,
|
|
14335
13593
|
orientation,
|
|
14336
13594
|
size: componentSize,
|
|
14337
13595
|
theme,
|
|
@@ -14344,21 +13602,21 @@ const UserBlock = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
14344
13602
|
linkProps: linkProps,
|
|
14345
13603
|
alt: ""
|
|
14346
13604
|
}, avatarProps, {
|
|
14347
|
-
className: classnames(`${CLASSNAME$
|
|
13605
|
+
className: classnames(`${CLASSNAME$1i}__avatar`, avatarProps.className),
|
|
14348
13606
|
size: componentSize,
|
|
14349
13607
|
onClick: onClick,
|
|
14350
13608
|
theme: theme
|
|
14351
13609
|
})), (fields || name) && /*#__PURE__*/React.createElement("div", {
|
|
14352
|
-
className: `${CLASSNAME$
|
|
13610
|
+
className: `${CLASSNAME$1i}__wrapper`
|
|
14353
13611
|
}, nameBlock, fieldsBlock), shouldDisplayActions && simpleAction && /*#__PURE__*/React.createElement("div", {
|
|
14354
|
-
className: `${CLASSNAME$
|
|
13612
|
+
className: `${CLASSNAME$1i}__action`
|
|
14355
13613
|
}, simpleAction), shouldDisplayActions && multipleActions && /*#__PURE__*/React.createElement("div", {
|
|
14356
|
-
className: `${CLASSNAME$
|
|
13614
|
+
className: `${CLASSNAME$1i}__actions`
|
|
14357
13615
|
}, multipleActions));
|
|
14358
13616
|
});
|
|
14359
|
-
UserBlock.displayName = COMPONENT_NAME$
|
|
14360
|
-
UserBlock.className = CLASSNAME$
|
|
13617
|
+
UserBlock.displayName = COMPONENT_NAME$1l;
|
|
13618
|
+
UserBlock.className = CLASSNAME$1i;
|
|
14361
13619
|
UserBlock.defaultProps = DEFAULT_PROPS$13;
|
|
14362
13620
|
|
|
14363
|
-
export { AlertDialog, Alignment, AspectRatio, Autocomplete, AutocompleteMultiple, Avatar, Badge, Button, ButtonEmphasis, ButtonGroup, Checkbox, Chip, ChipGroup, ColorPalette, ColorVariant, CommentBlock, CommentBlockVariant, DatePicker, DatePickerControlled, DatePickerField, Dialog, Divider, DragHandle, Dropdown, Emphasis, ExpansionPanel, Flag, FlexBox, GenericBlock, GenericBlockGapSize, Grid, GridColumn, GridItem, Heading, HeadingLevelProvider, Icon, IconButton, ImageBlock, ImageBlockCaptionPosition,
|
|
13621
|
+
export { AlertDialog, Alignment, AspectRatio, Autocomplete, AutocompleteMultiple, Avatar, Badge, Button, ButtonEmphasis, ButtonGroup, Checkbox, Chip, ChipGroup, ColorPalette, ColorVariant, CommentBlock, CommentBlockVariant, DatePicker, DatePickerControlled, DatePickerField, Dialog, Divider, DragHandle, Dropdown, Emphasis, ExpansionPanel, Flag, FlexBox, GenericBlock, GenericBlockGapSize, Grid, GridColumn, GridItem, Heading, HeadingLevelProvider, Icon, IconButton, ImageBlock, ImageBlockCaptionPosition, InlineList, InputHelper, InputLabel, Kind, Lightbox, Link, LinkPreview, List, ListDivider, ListItem, ListSubheader, Message, Mosaic, Navigation, Notification, Orientation, Placement, Popover, PopoverDialog, PostBlock, Progress, ProgressCircular, ProgressLinear, ProgressTracker, ProgressTrackerProvider, ProgressTrackerStep, ProgressTrackerStepPanel, ProgressVariant, RadioButton, RadioGroup, Select, SelectMultiple, SelectMultipleField, SelectVariant, SideNavigation, SideNavigationItem, Size, SkeletonCircle, SkeletonRectangle, SkeletonRectangleVariant, SkeletonTypography, Slider, Slides, Slideshow, SlideshowControls, SlideshowItem, Switch, Tab, TabList, TabListLayout, TabPanel, TabProvider, Table, TableBody, TableCell, TableCellVariant, TableHeader, TableRow, Text, TextField, ThOrder, Theme, Thumbnail, ThumbnailAspectRatio, ThumbnailObjectFit, ThumbnailVariant, Toolbar, Tooltip, Typography, TypographyCustom, TypographyInterface, TypographyTitleCustom, Uploader, UploaderVariant, UserBlock, WhiteSpace, clamp, isClickable, useFocusPointStyle, useHeadingLevel };
|
|
14364
13622
|
//# sourceMappingURL=index.js.map
|