@lumx/react 3.8.1-alpha.0 → 3.8.1
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 +6 -63
- package/index.js +559 -1292
- package/index.js.map +1 -1
- package/package.json +3 -3
- package/src/components/image-block/ImageBlock.test.tsx +28 -0
- package/src/components/image-block/ImageBlock.tsx +5 -1
- package/src/components/image-block/ImageCaption.tsx +54 -8
- package/src/components/thumbnail/useFocusPointStyle.tsx +4 -3
- 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 -253
- 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 -107
- 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/DOM/findImage.tsx +0 -3
- package/src/utils/DOM/startViewTransition.ts +0 -56
- package/src/utils/browser/getPrefersReducedMotion.ts +0 -6
- package/src/utils/object/isEqual.test.ts +0 -25
- package/src/utils/object/isEqual.ts +0 -11
- package/src/utils/react/unref.ts +0 -7
- package/src/utils/unref.ts +0 -0
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,7 +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 throttle from 'lodash/throttle';
|
|
21
20
|
import take from 'lodash/take';
|
|
22
21
|
import uniqueId from 'lodash/uniqueId';
|
|
23
22
|
import isObject from 'lodash/isObject';
|
|
@@ -342,7 +341,7 @@ var classnames = createCommonjsModule(function (module) {
|
|
|
342
341
|
}());
|
|
343
342
|
});
|
|
344
343
|
|
|
345
|
-
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 mdiMinus='M19 13H5v-2h14z';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';
|
|
346
345
|
|
|
347
346
|
var IDX=256, HEX=[], SIZE=256, BUFFER;
|
|
348
347
|
while (IDX--) HEX[IDX] = (IDX + 256).toString(16).substring(1);
|
|
@@ -1256,18 +1255,6 @@ const isComponentType = type => node => /*#__PURE__*/React.isValidElement(node)
|
|
|
1256
1255
|
* @example ComponentRef<Button> => React.Ref<HTMLButtonElement
|
|
1257
1256
|
*/
|
|
1258
1257
|
|
|
1259
|
-
/**
|
|
1260
|
-
* Rectangle size
|
|
1261
|
-
*/
|
|
1262
|
-
|
|
1263
|
-
/**
|
|
1264
|
-
* Maybe a HTMLElement or a React ref of a HTMLElement
|
|
1265
|
-
*/
|
|
1266
|
-
|
|
1267
|
-
/**
|
|
1268
|
-
* A point coordinate in 2D space
|
|
1269
|
-
*/
|
|
1270
|
-
|
|
1271
1258
|
const _excluded$6 = ["linkAs"];
|
|
1272
1259
|
/**
|
|
1273
1260
|
* Render link with default <a> HTML component or a custom one provided by `linkAs`.
|
|
@@ -7671,11 +7658,13 @@ Icon.defaultProps = DEFAULT_PROPS$p;
|
|
|
7671
7658
|
/** Internal component used to render image captions */
|
|
7672
7659
|
const ImageCaption = props => {
|
|
7673
7660
|
const {
|
|
7674
|
-
|
|
7661
|
+
baseClassName,
|
|
7675
7662
|
theme,
|
|
7676
7663
|
as = 'figcaption',
|
|
7677
7664
|
title,
|
|
7665
|
+
titleProps,
|
|
7678
7666
|
description,
|
|
7667
|
+
descriptionProps,
|
|
7679
7668
|
tags,
|
|
7680
7669
|
captionStyle,
|
|
7681
7670
|
align,
|
|
@@ -7698,7 +7687,7 @@ const ImageCaption = props => {
|
|
|
7698
7687
|
};
|
|
7699
7688
|
return /*#__PURE__*/React.createElement(FlexBox, {
|
|
7700
7689
|
as: as,
|
|
7701
|
-
className:
|
|
7690
|
+
className: classnames(baseClassName && `${baseClassName}__wrapper`),
|
|
7702
7691
|
style: captionStyle,
|
|
7703
7692
|
orientation: "vertical",
|
|
7704
7693
|
vAlign: align,
|
|
@@ -7706,20 +7695,24 @@ const ImageCaption = props => {
|
|
|
7706
7695
|
gap: "regular"
|
|
7707
7696
|
}, (title || description) && /*#__PURE__*/React.createElement(Text, _extends({
|
|
7708
7697
|
as: "p",
|
|
7698
|
+
className: classnames(baseClassName && `${baseClassName}__caption`),
|
|
7709
7699
|
truncate: truncate
|
|
7710
|
-
}, baseColor), title && /*#__PURE__*/React.createElement(Text, _extends({
|
|
7700
|
+
}, baseColor), title && /*#__PURE__*/React.createElement(Text, _extends({}, titleProps, {
|
|
7711
7701
|
as: "span",
|
|
7702
|
+
className: classnames(titleProps === null || titleProps === void 0 ? void 0 : titleProps.className, baseClassName && `${baseClassName}__title`),
|
|
7712
7703
|
typography: "subtitle1"
|
|
7713
|
-
}, titleColor), title), ' ', description && /*#__PURE__*/React.createElement(Text, _extends({
|
|
7704
|
+
}, titleColor), title), ' ', description && /*#__PURE__*/React.createElement(Text, _extends({}, descriptionProps, {
|
|
7714
7705
|
as: "span",
|
|
7706
|
+
className: classnames(descriptionProps === null || descriptionProps === void 0 ? void 0 : descriptionProps.className, baseClassName && `${baseClassName}__description`),
|
|
7715
7707
|
typography: "body1"
|
|
7716
7708
|
}, descriptionContent))), tags && /*#__PURE__*/React.createElement(FlexBox, {
|
|
7709
|
+
className: classnames(baseClassName && `${baseClassName}__tags`),
|
|
7717
7710
|
orientation: "horizontal",
|
|
7718
7711
|
vAlign: align
|
|
7719
7712
|
}, tags));
|
|
7720
7713
|
};
|
|
7721
7714
|
|
|
7722
|
-
const _excluded$y = ["actions", "align", "alt", "captionPosition", "captionStyle", "className", "description", "fillHeight", "image", "size", "tags", "theme", "thumbnailProps", "title"];
|
|
7715
|
+
const _excluded$y = ["actions", "align", "alt", "captionPosition", "captionStyle", "className", "description", "descriptionProps", "fillHeight", "image", "size", "tags", "theme", "thumbnailProps", "title", "titleProps"];
|
|
7723
7716
|
|
|
7724
7717
|
/**
|
|
7725
7718
|
* Image block variants.
|
|
@@ -7772,13 +7765,15 @@ const ImageBlock = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
7772
7765
|
captionStyle,
|
|
7773
7766
|
className,
|
|
7774
7767
|
description,
|
|
7768
|
+
descriptionProps,
|
|
7775
7769
|
fillHeight,
|
|
7776
7770
|
image,
|
|
7777
7771
|
size,
|
|
7778
7772
|
tags,
|
|
7779
7773
|
theme,
|
|
7780
7774
|
thumbnailProps,
|
|
7781
|
-
title
|
|
7775
|
+
title,
|
|
7776
|
+
titleProps
|
|
7782
7777
|
} = props,
|
|
7783
7778
|
forwardedProps = _objectWithoutProperties(props, _excluded$y);
|
|
7784
7779
|
return /*#__PURE__*/React.createElement("figure", _extends({
|
|
@@ -7801,10 +7796,12 @@ const ImageBlock = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
7801
7796
|
alt: alt || title
|
|
7802
7797
|
})), /*#__PURE__*/React.createElement(ImageCaption, {
|
|
7803
7798
|
as: "figcaption",
|
|
7804
|
-
|
|
7799
|
+
baseClassName: CLASSNAME$u,
|
|
7805
7800
|
theme: theme,
|
|
7806
7801
|
title: title,
|
|
7802
|
+
titleProps: titleProps,
|
|
7807
7803
|
description: description,
|
|
7804
|
+
descriptionProps: descriptionProps,
|
|
7808
7805
|
tags: tags,
|
|
7809
7806
|
captionStyle: captionStyle,
|
|
7810
7807
|
align: align,
|
|
@@ -7817,736 +7814,7 @@ ImageBlock.displayName = COMPONENT_NAME$x;
|
|
|
7817
7814
|
ImageBlock.className = CLASSNAME$u;
|
|
7818
7815
|
ImageBlock.defaultProps = DEFAULT_PROPS$q;
|
|
7819
7816
|
|
|
7820
|
-
|
|
7821
|
-
* Component display name.
|
|
7822
|
-
*/
|
|
7823
|
-
const COMPONENT_NAME$y = 'ImageLightbox';
|
|
7824
|
-
|
|
7825
|
-
/**
|
|
7826
|
-
* Component default class name and class prefix.
|
|
7827
|
-
*/
|
|
7828
|
-
const CLASSNAME$v = getRootClassName(COMPONENT_NAME$y);
|
|
7829
|
-
|
|
7830
|
-
/**
|
|
7831
|
-
* Observe element size (only works if it's size depends on the window size).
|
|
7832
|
-
*
|
|
7833
|
-
* (Not using ResizeObserver for better browser backward compat)
|
|
7834
|
-
*
|
|
7835
|
-
* @param elementRef Element to observe
|
|
7836
|
-
* @return the size and a manual update callback
|
|
7837
|
-
*/
|
|
7838
|
-
function useElementSizeDependentOfWindowSize(elementRef) {
|
|
7839
|
-
const [size, setSize] = React.useState(null);
|
|
7840
|
-
const updateSize = React.useMemo(() => throttle(() => {
|
|
7841
|
-
var _elementRef$current;
|
|
7842
|
-
const newSize = (_elementRef$current = elementRef.current) === null || _elementRef$current === void 0 ? void 0 : _elementRef$current.getBoundingClientRect();
|
|
7843
|
-
if (newSize) setSize(newSize);
|
|
7844
|
-
}, 10), [elementRef]);
|
|
7845
|
-
React.useEffect(() => {
|
|
7846
|
-
updateSize();
|
|
7847
|
-
window.addEventListener('resize', updateSize);
|
|
7848
|
-
return () => window.removeEventListener('resize', updateSize);
|
|
7849
|
-
}, [updateSize]);
|
|
7850
|
-
return [size, updateSize];
|
|
7851
|
-
}
|
|
7852
|
-
|
|
7853
|
-
/** Get natural image size after load. */
|
|
7854
|
-
function useImageSize(imgRef, getInitialSize) {
|
|
7855
|
-
const [imageSize, setImageSize] = React.useState(getInitialSize || null);
|
|
7856
|
-
React.useEffect(() => {
|
|
7857
|
-
const {
|
|
7858
|
-
current: img
|
|
7859
|
-
} = imgRef;
|
|
7860
|
-
if (!img) {
|
|
7861
|
-
return undefined;
|
|
7862
|
-
}
|
|
7863
|
-
const onLoad = () => setImageSize({
|
|
7864
|
-
width: img.naturalWidth,
|
|
7865
|
-
height: img.naturalHeight
|
|
7866
|
-
});
|
|
7867
|
-
img.addEventListener('load', onLoad);
|
|
7868
|
-
return () => img.removeEventListener('load', onLoad);
|
|
7869
|
-
}, [imgRef]);
|
|
7870
|
-
return imageSize;
|
|
7871
|
-
}
|
|
7872
|
-
|
|
7873
|
-
/** Check if user prefers reduced motion */
|
|
7874
|
-
function getPrefersReducedMotion() {
|
|
7875
|
-
var _WINDOW$matchMedia;
|
|
7876
|
-
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;
|
|
7877
|
-
}
|
|
7878
|
-
|
|
7879
|
-
/** Minimal recursive deep equal of JS values */
|
|
7880
|
-
function isEqual(obj1, obj2) {
|
|
7881
|
-
if (obj1 === obj2) return true;
|
|
7882
|
-
if (typeof obj1 === 'object' && typeof obj2 === 'object') {
|
|
7883
|
-
const keys1 = Object.keys(obj1);
|
|
7884
|
-
const keys2 = Object.keys(obj2);
|
|
7885
|
-
if (keys1.length !== keys2.length) return false;
|
|
7886
|
-
return keys1.every(key1 => isEqual(obj1[key1], obj2[key1]));
|
|
7887
|
-
}
|
|
7888
|
-
return false;
|
|
7889
|
-
}
|
|
7890
|
-
|
|
7891
|
-
/**
|
|
7892
|
-
* Listen to mouse wheel + ctrl and multi-pointer pinch to zoom
|
|
7893
|
-
*/
|
|
7894
|
-
function usePointerZoom(scrollAreaRef, onScaleChange, animateScroll) {
|
|
7895
|
-
const [isPointerZooming, setPointerZooming] = React.useState(false);
|
|
7896
|
-
React.useEffect(() => {
|
|
7897
|
-
const scrollArea = scrollAreaRef.current;
|
|
7898
|
-
if (!scrollArea || !onScaleChange) {
|
|
7899
|
-
return undefined;
|
|
7900
|
-
}
|
|
7901
|
-
let animationFrame;
|
|
7902
|
-
let zoomStateTimeoutId;
|
|
7903
|
-
function updateScaleOnNextFrame(newScale, mousePosition) {
|
|
7904
|
-
// Cancel previously scheduled frame
|
|
7905
|
-
if (animationFrame) cancelAnimationFrame(animationFrame);
|
|
7906
|
-
|
|
7907
|
-
// Cancel previously scheduled zoom state change
|
|
7908
|
-
if (zoomStateTimeoutId) clearTimeout(zoomStateTimeoutId);
|
|
7909
|
-
function nextFrame() {
|
|
7910
|
-
setPointerZooming(true);
|
|
7911
|
-
onScaleChange === null || onScaleChange === void 0 ? void 0 : onScaleChange(newScale);
|
|
7912
|
-
animationFrame = null;
|
|
7913
|
-
// Wait a bit before indicating the pointer zooming is finished
|
|
7914
|
-
zoomStateTimeoutId = setTimeout(() => setPointerZooming(false), 100);
|
|
7915
|
-
}
|
|
7916
|
-
animationFrame = requestAnimationFrame(nextFrame);
|
|
7917
|
-
|
|
7918
|
-
// Animate scroll in parallel (centering on the current mouse position)
|
|
7919
|
-
animateScroll(mousePosition, {
|
|
7920
|
-
width: scrollArea.scrollWidth,
|
|
7921
|
-
height: scrollArea.scrollHeight
|
|
7922
|
-
});
|
|
7923
|
-
}
|
|
7924
|
-
function onWheel(event) {
|
|
7925
|
-
if (!event.ctrlKey) {
|
|
7926
|
-
return;
|
|
7927
|
-
}
|
|
7928
|
-
event.preventDefault();
|
|
7929
|
-
const newScale = Math.exp(-event.deltaY / 50);
|
|
7930
|
-
|
|
7931
|
-
// Update scale on next frame (focused on the mouse position)
|
|
7932
|
-
updateScaleOnNextFrame(newScale, {
|
|
7933
|
-
x: event.pageX,
|
|
7934
|
-
y: event.pageY
|
|
7935
|
-
});
|
|
7936
|
-
}
|
|
7937
|
-
const activePointers = {};
|
|
7938
|
-
let prevDistance = null;
|
|
7939
|
-
let previousCenterPoint = null;
|
|
7940
|
-
function onPointerDown(event) {
|
|
7941
|
-
activePointers[event.pointerId] = event;
|
|
7942
|
-
}
|
|
7943
|
-
function onPointerMove(event) {
|
|
7944
|
-
// Update pointer in cache
|
|
7945
|
-
if (activePointers[event.pointerId]) {
|
|
7946
|
-
activePointers[event.pointerId] = event;
|
|
7947
|
-
}
|
|
7948
|
-
const pointers = Object.values(activePointers);
|
|
7949
|
-
|
|
7950
|
-
// Make sure we run computation on one of the pointer in the group
|
|
7951
|
-
if (pointers[0].pointerId !== event.pointerId) {
|
|
7952
|
-
return;
|
|
7953
|
-
}
|
|
7954
|
-
|
|
7955
|
-
// Centered point between all pointers
|
|
7956
|
-
const centerPoint = {
|
|
7957
|
-
x: pointers.reduce((x, _ref) => {
|
|
7958
|
-
let {
|
|
7959
|
-
clientX
|
|
7960
|
-
} = _ref;
|
|
7961
|
-
return x + clientX;
|
|
7962
|
-
}, 0) / pointers.length,
|
|
7963
|
-
y: pointers.reduce((y, _ref2) => {
|
|
7964
|
-
let {
|
|
7965
|
-
clientY
|
|
7966
|
-
} = _ref2;
|
|
7967
|
-
return y + clientY;
|
|
7968
|
-
}, 0) / pointers.length
|
|
7969
|
-
};
|
|
7970
|
-
|
|
7971
|
-
// Movement of the center point
|
|
7972
|
-
const deltaCenterPoint = previousCenterPoint && {
|
|
7973
|
-
left: previousCenterPoint.x - centerPoint.x,
|
|
7974
|
-
top: previousCenterPoint.y - centerPoint.y
|
|
7975
|
-
};
|
|
7976
|
-
|
|
7977
|
-
// Pan X & Y
|
|
7978
|
-
if (deltaCenterPoint) {
|
|
7979
|
-
// Apply movement of the center point to the scroll
|
|
7980
|
-
scrollArea.scrollBy({
|
|
7981
|
-
top: deltaCenterPoint.top / 2,
|
|
7982
|
-
left: deltaCenterPoint.left / 2
|
|
7983
|
-
});
|
|
7984
|
-
}
|
|
7985
|
-
|
|
7986
|
-
// Pinch to zoom
|
|
7987
|
-
if (pointers.length === 2) {
|
|
7988
|
-
const [pointer1, pointer2] = pointers;
|
|
7989
|
-
const distance = Math.hypot(pointer2.clientX - pointer1.clientX, pointer2.clientY - pointer1.clientY);
|
|
7990
|
-
if (prevDistance && deltaCenterPoint) {
|
|
7991
|
-
const delta = prevDistance - distance;
|
|
7992
|
-
const absDelta = Math.abs(delta);
|
|
7993
|
-
|
|
7994
|
-
// Zoom only if we are "pinching" more than we are moving the pointers
|
|
7995
|
-
if (absDelta > Math.abs(deltaCenterPoint.left) && absDelta > Math.abs(deltaCenterPoint.top)) {
|
|
7996
|
-
// Update scale on next frame (focused on the center point between the two pointers)
|
|
7997
|
-
const newScale = Math.exp(-delta / 100);
|
|
7998
|
-
updateScaleOnNextFrame(newScale, centerPoint);
|
|
7999
|
-
}
|
|
8000
|
-
}
|
|
8001
|
-
prevDistance = distance;
|
|
8002
|
-
}
|
|
8003
|
-
previousCenterPoint = centerPoint;
|
|
8004
|
-
}
|
|
8005
|
-
function onPointerUp(event) {
|
|
8006
|
-
prevDistance = null;
|
|
8007
|
-
previousCenterPoint = null;
|
|
8008
|
-
delete activePointers[event.pointerId];
|
|
8009
|
-
}
|
|
8010
|
-
scrollArea.addEventListener('wheel', onWheel, {
|
|
8011
|
-
passive: false
|
|
8012
|
-
});
|
|
8013
|
-
const isMultiTouch = navigator.maxTouchPoints >= 2;
|
|
8014
|
-
if (isMultiTouch) {
|
|
8015
|
-
scrollArea.addEventListener('pointerdown', onPointerDown);
|
|
8016
|
-
scrollArea.addEventListener('pointermove', onPointerMove);
|
|
8017
|
-
scrollArea.addEventListener('pointerup', onPointerUp);
|
|
8018
|
-
}
|
|
8019
|
-
return () => {
|
|
8020
|
-
scrollArea.removeEventListener('wheel', onWheel);
|
|
8021
|
-
if (isMultiTouch) {
|
|
8022
|
-
scrollArea.removeEventListener('pointerdown', onPointerDown);
|
|
8023
|
-
scrollArea.removeEventListener('pointermove', onPointerMove);
|
|
8024
|
-
scrollArea.removeEventListener('pointerup', onPointerUp);
|
|
8025
|
-
}
|
|
8026
|
-
};
|
|
8027
|
-
}, [animateScroll, onScaleChange, scrollAreaRef]);
|
|
8028
|
-
return isPointerZooming;
|
|
8029
|
-
}
|
|
8030
|
-
|
|
8031
|
-
/** Maintains the scroll position centered relative to the original scroll area's dimensions when the content scales. */
|
|
8032
|
-
function useAnimateScroll(scrollAreaRef) {
|
|
8033
|
-
return React.useMemo(() => {
|
|
8034
|
-
let animationFrame = null;
|
|
8035
|
-
return function animate(centerPoint, initialScrollAreaSize) {
|
|
8036
|
-
const scrollArea = scrollAreaRef.current;
|
|
8037
|
-
if (!scrollArea) {
|
|
8038
|
-
return;
|
|
8039
|
-
}
|
|
8040
|
-
|
|
8041
|
-
// Cancel previously running animation
|
|
8042
|
-
if (animationFrame) cancelAnimationFrame(animationFrame);
|
|
8043
|
-
|
|
8044
|
-
// Center on the given point or else on the scroll area visual center
|
|
8045
|
-
const clientHeightRatio = centerPoint !== null && centerPoint !== void 0 && centerPoint.y ? centerPoint.y / scrollArea.clientHeight : 0.5;
|
|
8046
|
-
const clientWidthRatio = centerPoint !== null && centerPoint !== void 0 && centerPoint.x ? centerPoint.x / scrollArea.clientWidth : 0.5;
|
|
8047
|
-
const initialScrollHeight = (initialScrollAreaSize === null || initialScrollAreaSize === void 0 ? void 0 : initialScrollAreaSize.height) || scrollArea.scrollHeight;
|
|
8048
|
-
const initialScrollWidth = (initialScrollAreaSize === null || initialScrollAreaSize === void 0 ? void 0 : initialScrollAreaSize.width) || scrollArea.scrollWidth;
|
|
8049
|
-
const heightCenter = scrollArea.scrollTop + scrollArea.clientHeight * clientHeightRatio;
|
|
8050
|
-
const heightRatio = heightCenter / initialScrollHeight;
|
|
8051
|
-
const widthCenter = scrollArea.scrollLeft + scrollArea.clientWidth * clientWidthRatio;
|
|
8052
|
-
const widthRatio = widthCenter / initialScrollWidth;
|
|
8053
|
-
let prevScrollHeight = 0;
|
|
8054
|
-
let prevScrollWidth = 0;
|
|
8055
|
-
function nextFrame() {
|
|
8056
|
-
const {
|
|
8057
|
-
scrollHeight,
|
|
8058
|
-
scrollWidth,
|
|
8059
|
-
clientHeight,
|
|
8060
|
-
clientWidth
|
|
8061
|
-
} = scrollArea;
|
|
8062
|
-
|
|
8063
|
-
// Scroll area stopped expanding => stop animation
|
|
8064
|
-
if (scrollHeight === prevScrollHeight && scrollWidth === prevScrollWidth) {
|
|
8065
|
-
animationFrame = null;
|
|
8066
|
-
return;
|
|
8067
|
-
}
|
|
8068
|
-
|
|
8069
|
-
// Compute next scroll position
|
|
8070
|
-
const top = heightRatio * scrollHeight - clientHeight * clientHeightRatio;
|
|
8071
|
-
const left = widthRatio * scrollWidth - clientWidth * clientWidthRatio;
|
|
8072
|
-
scrollArea.scrollTo({
|
|
8073
|
-
top,
|
|
8074
|
-
left
|
|
8075
|
-
});
|
|
8076
|
-
prevScrollHeight = scrollHeight;
|
|
8077
|
-
prevScrollWidth = scrollWidth;
|
|
8078
|
-
animationFrame = requestAnimationFrame(nextFrame);
|
|
8079
|
-
}
|
|
8080
|
-
animationFrame = requestAnimationFrame(nextFrame);
|
|
8081
|
-
};
|
|
8082
|
-
}, [scrollAreaRef]);
|
|
8083
|
-
}
|
|
8084
|
-
|
|
8085
|
-
/** Internal image slide component for ImageLightbox */
|
|
8086
|
-
const ImageSlide = /*#__PURE__*/React.memo(props => {
|
|
8087
|
-
const {
|
|
8088
|
-
isActive,
|
|
8089
|
-
scale,
|
|
8090
|
-
onScaleChange,
|
|
8091
|
-
image: {
|
|
8092
|
-
image,
|
|
8093
|
-
imgRef: propImgRef,
|
|
8094
|
-
imgProps,
|
|
8095
|
-
alt,
|
|
8096
|
-
loadingPlaceholderImageRef
|
|
8097
|
-
}
|
|
8098
|
-
} = props;
|
|
8099
|
-
|
|
8100
|
-
// Get scroll area size
|
|
8101
|
-
const scrollAreaRef = React.useRef(null);
|
|
8102
|
-
const [scrollAreaSize, updateSize] = useElementSizeDependentOfWindowSize(scrollAreaRef);
|
|
8103
|
-
React.useEffect(() => {
|
|
8104
|
-
// Update size when active
|
|
8105
|
-
if (isActive) updateSize();
|
|
8106
|
-
}, [isActive, updateSize]);
|
|
8107
|
-
|
|
8108
|
-
// Get image size
|
|
8109
|
-
const imgRef = React.useRef(null);
|
|
8110
|
-
const imageSize = useImageSize(imgRef, () => {
|
|
8111
|
-
const width = Number.parseInt(imgProps === null || imgProps === void 0 ? void 0 : imgProps.width, 10);
|
|
8112
|
-
const height = Number.parseInt(imgProps === null || imgProps === void 0 ? void 0 : imgProps.height, 10);
|
|
8113
|
-
return width && height ? {
|
|
8114
|
-
width,
|
|
8115
|
-
height
|
|
8116
|
-
} : null;
|
|
8117
|
-
});
|
|
8118
|
-
|
|
8119
|
-
// Calculate new image size with scale
|
|
8120
|
-
const scaledImageSize = React.useMemo(() => {
|
|
8121
|
-
if (!scrollAreaSize || !imageSize) {
|
|
8122
|
-
return null;
|
|
8123
|
-
}
|
|
8124
|
-
const horizontalScale = scrollAreaSize.width / imageSize.width;
|
|
8125
|
-
const verticalScale = scrollAreaSize.height / imageSize.height;
|
|
8126
|
-
const baseScale = Math.min(1, Math.min(horizontalScale, verticalScale));
|
|
8127
|
-
return {
|
|
8128
|
-
width: imageSize.width * baseScale * (scale !== null && scale !== void 0 ? scale : 1),
|
|
8129
|
-
height: imageSize.height * baseScale * (scale !== null && scale !== void 0 ? scale : 1)
|
|
8130
|
-
};
|
|
8131
|
-
}, [scrollAreaSize, imageSize, scale]);
|
|
8132
|
-
|
|
8133
|
-
// Animate scroll to preserve the center of the current visible window in the scroll area
|
|
8134
|
-
const animateScroll = useAnimateScroll(scrollAreaRef);
|
|
8135
|
-
|
|
8136
|
-
// Zoom via mouse wheel or multi-touch pinch zoom
|
|
8137
|
-
const isPointerZooming = usePointerZoom(scrollAreaRef, onScaleChange, animateScroll);
|
|
8138
|
-
|
|
8139
|
-
// Animate scroll on scale change
|
|
8140
|
-
React.useLayoutEffect(() => {
|
|
8141
|
-
if (scale && !isPointerZooming) {
|
|
8142
|
-
animateScroll();
|
|
8143
|
-
}
|
|
8144
|
-
}, [isPointerZooming, scale, animateScroll]);
|
|
8145
|
-
const isScrollable = scaledImageSize && scrollAreaSize && (scaledImageSize.width > scrollAreaSize.width || scaledImageSize.height > scrollAreaSize.height);
|
|
8146
|
-
return /*#__PURE__*/React.createElement(SlideshowItem, {
|
|
8147
|
-
ref: scrollAreaRef
|
|
8148
|
-
// Make it accessible to keyboard nav when the zone is scrollable
|
|
8149
|
-
,
|
|
8150
|
-
tabIndex: isScrollable ? 0 : undefined,
|
|
8151
|
-
className: `${CLASSNAME$v}__image-slide`
|
|
8152
|
-
}, /*#__PURE__*/React.createElement(Thumbnail, {
|
|
8153
|
-
imgRef: useMergeRefs(imgRef, propImgRef),
|
|
8154
|
-
image: image,
|
|
8155
|
-
alt: alt,
|
|
8156
|
-
className: `${CLASSNAME$v}__thumbnail`,
|
|
8157
|
-
imgProps: _objectSpread2(_objectSpread2({}, imgProps), {}, {
|
|
8158
|
-
style: _objectSpread2(_objectSpread2(_objectSpread2({}, imgProps === null || imgProps === void 0 ? void 0 : imgProps.style), scaledImageSize || {
|
|
8159
|
-
maxHeight: scrollAreaSize === null || scrollAreaSize === void 0 ? void 0 : scrollAreaSize.height,
|
|
8160
|
-
maxWidth: scrollAreaSize === null || scrollAreaSize === void 0 ? void 0 : scrollAreaSize.width
|
|
8161
|
-
}), {}, {
|
|
8162
|
-
// Only animate when scale is set, and we are not pointer zooming and the user does not prefer reduced motion
|
|
8163
|
-
transition: scale && !isPointerZooming && !getPrefersReducedMotion() ? 'all 250ms' : undefined
|
|
8164
|
-
})
|
|
8165
|
-
}),
|
|
8166
|
-
loadingPlaceholderImageRef: loadingPlaceholderImageRef
|
|
8167
|
-
}));
|
|
8168
|
-
}, isEqual);
|
|
8169
|
-
|
|
8170
|
-
const _excluded$z = ["image", "imgRef"];
|
|
8171
|
-
/** Internal image slideshow component for ImageLightbox */
|
|
8172
|
-
const ImageSlideshow = _ref => {
|
|
8173
|
-
var _images$activeIndex, _images$activeIndex2, _images$activeIndex3;
|
|
8174
|
-
let {
|
|
8175
|
-
activeImageIndex,
|
|
8176
|
-
images,
|
|
8177
|
-
slideGroupLabel,
|
|
8178
|
-
zoomInButtonProps,
|
|
8179
|
-
zoomOutButtonProps,
|
|
8180
|
-
slideshowControlsProps,
|
|
8181
|
-
currentPaginationItemRef,
|
|
8182
|
-
footerRef,
|
|
8183
|
-
activeImageRef
|
|
8184
|
-
} = _ref;
|
|
8185
|
-
const {
|
|
8186
|
-
activeIndex,
|
|
8187
|
-
slideshowId,
|
|
8188
|
-
setSlideshow,
|
|
8189
|
-
slideshowSlidesId,
|
|
8190
|
-
slidesCount,
|
|
8191
|
-
onNextClick,
|
|
8192
|
-
onPaginationClick,
|
|
8193
|
-
onPreviousClick,
|
|
8194
|
-
toggleAutoPlay
|
|
8195
|
-
} = SlideshowControls.useSlideshowControls({
|
|
8196
|
-
itemsCount: images.length,
|
|
8197
|
-
activeIndex: activeImageIndex
|
|
8198
|
-
});
|
|
8199
|
-
|
|
8200
|
-
// Image metadata (caption)
|
|
8201
|
-
const title = (_images$activeIndex = images[activeIndex]) === null || _images$activeIndex === void 0 ? void 0 : _images$activeIndex.title;
|
|
8202
|
-
const description = (_images$activeIndex2 = images[activeIndex]) === null || _images$activeIndex2 === void 0 ? void 0 : _images$activeIndex2.description;
|
|
8203
|
-
const tags = (_images$activeIndex3 = images[activeIndex]) === null || _images$activeIndex3 === void 0 ? void 0 : _images$activeIndex3.tags;
|
|
8204
|
-
const metadata = title || description || tags ? /*#__PURE__*/React.createElement(ImageCaption, {
|
|
8205
|
-
theme: "dark",
|
|
8206
|
-
as: "div",
|
|
8207
|
-
title: title,
|
|
8208
|
-
description: description,
|
|
8209
|
-
tags: tags,
|
|
8210
|
-
align: "center"
|
|
8211
|
-
}) : null;
|
|
8212
|
-
|
|
8213
|
-
// Slideshow controls
|
|
8214
|
-
const slideShowControls = slidesCount > 1 && slideshowControlsProps ? /*#__PURE__*/React.createElement(SlideshowControls, _extends({
|
|
8215
|
-
theme: "dark",
|
|
8216
|
-
activeIndex: activeIndex,
|
|
8217
|
-
slidesCount: slidesCount,
|
|
8218
|
-
onNextClick: onNextClick,
|
|
8219
|
-
onPreviousClick: onPreviousClick,
|
|
8220
|
-
onPaginationClick: onPaginationClick
|
|
8221
|
-
}, slideshowControlsProps, {
|
|
8222
|
-
paginationItemProps: index => {
|
|
8223
|
-
var _slideshowControlsPro;
|
|
8224
|
-
const props = (slideshowControlsProps === null || slideshowControlsProps === void 0 ? void 0 : (_slideshowControlsPro = slideshowControlsProps.paginationItemProps) === null || _slideshowControlsPro === void 0 ? void 0 : _slideshowControlsPro.call(slideshowControlsProps, index)) || {};
|
|
8225
|
-
return _objectSpread2(_objectSpread2({}, props), {}, {
|
|
8226
|
-
ref: mergeRefs(props === null || props === void 0 ? void 0 : props.ref,
|
|
8227
|
-
// Focus the active pagination item once on mount
|
|
8228
|
-
activeIndex === index ? currentPaginationItemRef : undefined)
|
|
8229
|
-
});
|
|
8230
|
-
}
|
|
8231
|
-
})) : null;
|
|
8232
|
-
|
|
8233
|
-
// Zoom controls
|
|
8234
|
-
const [scale, setScale] = React.useState(undefined);
|
|
8235
|
-
const zoomEnabled = zoomInButtonProps && zoomOutButtonProps;
|
|
8236
|
-
const onScaleChange = React.useMemo(() => {
|
|
8237
|
-
if (!zoomEnabled) return undefined;
|
|
8238
|
-
return newScale => {
|
|
8239
|
-
setScale(function () {
|
|
8240
|
-
let prevScale = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
|
|
8241
|
-
return Math.max(1, newScale * prevScale);
|
|
8242
|
-
});
|
|
8243
|
-
};
|
|
8244
|
-
}, [zoomEnabled]);
|
|
8245
|
-
const zoomIn = React.useCallback(() => onScaleChange === null || onScaleChange === void 0 ? void 0 : onScaleChange(1.5), [onScaleChange]);
|
|
8246
|
-
const zoomOut = React.useCallback(() => onScaleChange === null || onScaleChange === void 0 ? void 0 : onScaleChange(0.5), [onScaleChange]);
|
|
8247
|
-
React.useEffect(() => {
|
|
8248
|
-
// Reset scale on slide change
|
|
8249
|
-
if (activeIndex) setScale(undefined);
|
|
8250
|
-
}, [activeIndex]);
|
|
8251
|
-
const zoomControls = zoomEnabled && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IconButton, _extends({}, zoomInButtonProps, {
|
|
8252
|
-
theme: "dark",
|
|
8253
|
-
emphasis: "low",
|
|
8254
|
-
icon: mdiMagnifyPlusOutline,
|
|
8255
|
-
onClick: zoomIn
|
|
8256
|
-
})), /*#__PURE__*/React.createElement(IconButton, _extends({}, zoomOutButtonProps, {
|
|
8257
|
-
theme: "dark",
|
|
8258
|
-
emphasis: "low",
|
|
8259
|
-
isDisabled: !scale || scale <= 1,
|
|
8260
|
-
icon: mdiMagnifyMinusOutline,
|
|
8261
|
-
onClick: zoomOut
|
|
8262
|
-
})));
|
|
8263
|
-
const getImgRef = React.useMemo(() => memoize((index, isActive) => {
|
|
8264
|
-
return mergeRefs(images === null || images === void 0 ? void 0 : images[index].imgRef, isActive ? activeImageRef : undefined);
|
|
8265
|
-
},
|
|
8266
|
-
// memoize based on both arguments
|
|
8267
|
-
function () {
|
|
8268
|
-
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
8269
|
-
args[_key] = arguments[_key];
|
|
8270
|
-
}
|
|
8271
|
-
return args.join();
|
|
8272
|
-
}), [images, activeImageRef]);
|
|
8273
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Slides, {
|
|
8274
|
-
activeIndex: activeIndex,
|
|
8275
|
-
theme: "dark",
|
|
8276
|
-
slideGroupLabel: slideGroupLabel,
|
|
8277
|
-
fillHeight: true,
|
|
8278
|
-
id: slideshowId,
|
|
8279
|
-
ref: setSlideshow,
|
|
8280
|
-
slidesId: slideshowSlidesId,
|
|
8281
|
-
toggleAutoPlay: toggleAutoPlay
|
|
8282
|
-
}, images.map((_ref2, index) => {
|
|
8283
|
-
let {
|
|
8284
|
-
image,
|
|
8285
|
-
imgRef
|
|
8286
|
-
} = _ref2,
|
|
8287
|
-
imageProps = _objectWithoutProperties(_ref2, _excluded$z);
|
|
8288
|
-
const isActive = index === activeIndex;
|
|
8289
|
-
return /*#__PURE__*/React.createElement(ImageSlide, {
|
|
8290
|
-
isActive: isActive,
|
|
8291
|
-
key: image,
|
|
8292
|
-
image: _objectSpread2(_objectSpread2({}, imageProps), {}, {
|
|
8293
|
-
image,
|
|
8294
|
-
imgRef: getImgRef(index, isActive)
|
|
8295
|
-
}),
|
|
8296
|
-
scale: isActive ? scale : undefined,
|
|
8297
|
-
onScaleChange: onScaleChange
|
|
8298
|
-
});
|
|
8299
|
-
})), (metadata || slideShowControls || zoomControls) && /*#__PURE__*/React.createElement(FlexBox, {
|
|
8300
|
-
ref: footerRef,
|
|
8301
|
-
className: `${CLASSNAME$v}__footer`,
|
|
8302
|
-
orientation: "vertical",
|
|
8303
|
-
vAlign: "center",
|
|
8304
|
-
gap: "big"
|
|
8305
|
-
}, metadata, /*#__PURE__*/React.createElement(FlexBox, {
|
|
8306
|
-
className: `${CLASSNAME$v}__footer-actions`,
|
|
8307
|
-
orientation: "horizontal",
|
|
8308
|
-
gap: "regular"
|
|
8309
|
-
}, slideShowControls, zoomControls)));
|
|
8310
|
-
};
|
|
8311
|
-
|
|
8312
|
-
/** Unref a react ref or element */
|
|
8313
|
-
function unref(maybeElement) {
|
|
8314
|
-
if (maybeElement instanceof HTMLElement) return maybeElement;
|
|
8315
|
-
return maybeElement === null || maybeElement === void 0 ? void 0 : maybeElement.current;
|
|
8316
|
-
}
|
|
8317
|
-
|
|
8318
|
-
function setTransitionViewName(elementRef, name) {
|
|
8319
|
-
const element = unref(elementRef);
|
|
8320
|
-
if (element) element.style.viewTransitionName = name;
|
|
8321
|
-
}
|
|
8322
|
-
|
|
8323
|
-
/**
|
|
8324
|
-
* Wrapper around the `document.startViewTransition` handling browser incompatibilities, react DOM flush and
|
|
8325
|
-
* user preference.
|
|
8326
|
-
*
|
|
8327
|
-
* @param changes callback containing the changes to apply within the view transition.
|
|
8328
|
-
* @param setViewTransitionName set the `viewTransitionName` style on a `source` & `target` to morph these elements.
|
|
8329
|
-
*/
|
|
8330
|
-
async function startViewTransition(_ref) {
|
|
8331
|
-
var _document, _document$startViewTr;
|
|
8332
|
-
let {
|
|
8333
|
-
changes,
|
|
8334
|
-
viewTransitionName
|
|
8335
|
-
} = _ref;
|
|
8336
|
-
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);
|
|
8337
|
-
const prefersReducedMotion = getPrefersReducedMotion();
|
|
8338
|
-
const {
|
|
8339
|
-
flushSync
|
|
8340
|
-
} = ReactDOM;
|
|
8341
|
-
if (prefersReducedMotion || !start || !flushSync || !(viewTransitionName !== null && viewTransitionName !== void 0 && viewTransitionName.source) || !(viewTransitionName !== null && viewTransitionName !== void 0 && viewTransitionName.target)) {
|
|
8342
|
-
// Skip, apply changes without a transition
|
|
8343
|
-
changes();
|
|
8344
|
-
return;
|
|
8345
|
-
}
|
|
8346
|
-
|
|
8347
|
-
// Set transition name on source element
|
|
8348
|
-
setTransitionViewName(viewTransitionName.source, viewTransitionName.name);
|
|
8349
|
-
|
|
8350
|
-
// Start view transition, apply changes & flush to DOM
|
|
8351
|
-
await start(() => {
|
|
8352
|
-
// Un-set transition name on source element
|
|
8353
|
-
setTransitionViewName(viewTransitionName.source, null);
|
|
8354
|
-
flushSync(changes);
|
|
8355
|
-
|
|
8356
|
-
// Set transition name on target element
|
|
8357
|
-
setTransitionViewName(viewTransitionName.target, viewTransitionName.name);
|
|
8358
|
-
}).updateCallbackDone;
|
|
8359
|
-
|
|
8360
|
-
// Un-set transition name on target element
|
|
8361
|
-
setTransitionViewName(viewTransitionName.target, null);
|
|
8362
|
-
}
|
|
8363
|
-
|
|
8364
|
-
/** Find image in element including the element */
|
|
8365
|
-
const findImage = element => element !== null && element !== void 0 && element.matches('img') ? element : (element === null || element === void 0 ? void 0 : element.querySelector('img')) || null;
|
|
8366
|
-
|
|
8367
|
-
const _excluded$A = ["images"];
|
|
8368
|
-
|
|
8369
|
-
/** Subset of the ImageLightboxProps managed by the useImageLightbox hook */
|
|
8370
|
-
|
|
8371
|
-
const EMPTY_PROPS = {
|
|
8372
|
-
isOpen: false,
|
|
8373
|
-
images: [],
|
|
8374
|
-
parentElement: /*#__PURE__*/React.createRef()
|
|
8375
|
-
};
|
|
8376
|
-
/**
|
|
8377
|
-
* Set up an ImageLightbox with images and triggers.
|
|
8378
|
-
*
|
|
8379
|
-
* - Associate a trigger with the lightbox to properly focus the trigger on close
|
|
8380
|
-
* - Associate a trigger with an image to display on open
|
|
8381
|
-
* - Automatically provide a view transition between an image trigger and the displayed image on open & close
|
|
8382
|
-
*
|
|
8383
|
-
* @param initialProps Images to display in the image lightbox
|
|
8384
|
-
*/
|
|
8385
|
-
function useImageLightbox(initialProps) {
|
|
8386
|
-
const {
|
|
8387
|
-
images = []
|
|
8388
|
-
} = initialProps,
|
|
8389
|
-
otherProps = _objectWithoutProperties(initialProps, _excluded$A);
|
|
8390
|
-
const imagesPropsRef = React.useRef(images);
|
|
8391
|
-
React.useEffect(() => {
|
|
8392
|
-
imagesPropsRef.current = images.map(props => _objectSpread2({
|
|
8393
|
-
imgRef: /*#__PURE__*/React.createRef()
|
|
8394
|
-
}, props));
|
|
8395
|
-
}, [images]);
|
|
8396
|
-
const currentImageRef = React.useRef(null);
|
|
8397
|
-
const [imageLightboxProps, setImageLightboxProps] = React.useState(() => _objectSpread2(_objectSpread2({}, EMPTY_PROPS), otherProps));
|
|
8398
|
-
const getTriggerProps = React.useMemo(() => {
|
|
8399
|
-
const triggerImageRefs = {};
|
|
8400
|
-
async function close() {
|
|
8401
|
-
const currentImage = currentImageRef.current;
|
|
8402
|
-
if (!currentImage) {
|
|
8403
|
-
return;
|
|
8404
|
-
}
|
|
8405
|
-
const currentIndex = imagesPropsRef.current.findIndex(_ref => {
|
|
8406
|
-
let {
|
|
8407
|
-
imgRef
|
|
8408
|
-
} = _ref;
|
|
8409
|
-
return (imgRef === null || imgRef === void 0 ? void 0 : imgRef.current) === currentImage;
|
|
8410
|
-
});
|
|
8411
|
-
await startViewTransition({
|
|
8412
|
-
changes() {
|
|
8413
|
-
// Close lightbox
|
|
8414
|
-
setImageLightboxProps(prevProps => _objectSpread2(_objectSpread2({}, prevProps), {}, {
|
|
8415
|
-
isOpen: false
|
|
8416
|
-
}));
|
|
8417
|
-
},
|
|
8418
|
-
// Morph from the image in lightbox to the image in trigger
|
|
8419
|
-
viewTransitionName: {
|
|
8420
|
-
source: currentImageRef,
|
|
8421
|
-
target: triggerImageRefs[currentIndex],
|
|
8422
|
-
name: CLASSNAME$v
|
|
8423
|
-
}
|
|
8424
|
-
});
|
|
8425
|
-
}
|
|
8426
|
-
async function open(triggerElement) {
|
|
8427
|
-
var _triggerImageRefs;
|
|
8428
|
-
let {
|
|
8429
|
-
activeImageIndex
|
|
8430
|
-
} = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
8431
|
-
// If we find an image inside the trigger, animate it in transition with the opening image
|
|
8432
|
-
const triggerImage = ((_triggerImageRefs = triggerImageRefs[activeImageIndex]) === null || _triggerImageRefs === void 0 ? void 0 : _triggerImageRefs.current) || findImage(triggerElement);
|
|
8433
|
-
|
|
8434
|
-
// Inject the trigger image as loading placeholder for better loading state
|
|
8435
|
-
const imagesWithFallbackSize = imagesPropsRef.current.map((image, idx) => {
|
|
8436
|
-
if (triggerImage && idx === activeImageIndex && !image.loadingPlaceholderImageRef) {
|
|
8437
|
-
return _objectSpread2(_objectSpread2({}, image), {}, {
|
|
8438
|
-
loadingPlaceholderImageRef: {
|
|
8439
|
-
current: triggerImage
|
|
8440
|
-
}
|
|
8441
|
-
});
|
|
8442
|
-
}
|
|
8443
|
-
return image;
|
|
8444
|
-
});
|
|
8445
|
-
await startViewTransition({
|
|
8446
|
-
changes: () => {
|
|
8447
|
-
// Open lightbox with setup props
|
|
8448
|
-
setImageLightboxProps(prevProps => _objectSpread2(_objectSpread2({}, prevProps), {}, {
|
|
8449
|
-
activeImageRef: currentImageRef,
|
|
8450
|
-
parentElement: {
|
|
8451
|
-
current: triggerElement
|
|
8452
|
-
},
|
|
8453
|
-
isOpen: true,
|
|
8454
|
-
onClose: () => {
|
|
8455
|
-
var _prevProps$onClose;
|
|
8456
|
-
close();
|
|
8457
|
-
prevProps === null || prevProps === void 0 ? void 0 : (_prevProps$onClose = prevProps.onClose) === null || _prevProps$onClose === void 0 ? void 0 : _prevProps$onClose.call(prevProps);
|
|
8458
|
-
},
|
|
8459
|
-
images: imagesWithFallbackSize,
|
|
8460
|
-
activeImageIndex: activeImageIndex || 0
|
|
8461
|
-
}));
|
|
8462
|
-
},
|
|
8463
|
-
// Morph from the image in trigger to the image in lightbox
|
|
8464
|
-
viewTransitionName: {
|
|
8465
|
-
source: triggerImage,
|
|
8466
|
-
target: currentImageRef,
|
|
8467
|
-
name: CLASSNAME$v
|
|
8468
|
-
}
|
|
8469
|
-
});
|
|
8470
|
-
}
|
|
8471
|
-
return memoize(options => ({
|
|
8472
|
-
ref(element) {
|
|
8473
|
-
// Track trigger image ref if any
|
|
8474
|
-
if ((options === null || options === void 0 ? void 0 : options.activeImageIndex) !== undefined && element) {
|
|
8475
|
-
triggerImageRefs[options.activeImageIndex] = {
|
|
8476
|
-
current: findImage(element)
|
|
8477
|
-
};
|
|
8478
|
-
}
|
|
8479
|
-
},
|
|
8480
|
-
onClick(e) {
|
|
8481
|
-
open(e.target, options);
|
|
8482
|
-
}
|
|
8483
|
-
}));
|
|
8484
|
-
}, []);
|
|
8485
|
-
return {
|
|
8486
|
-
getTriggerProps,
|
|
8487
|
-
imageLightboxProps
|
|
8488
|
-
};
|
|
8489
|
-
}
|
|
8490
|
-
|
|
8491
|
-
const _excluded$B = ["className", "isOpen", "closeButtonProps", "onClose", "parentElement", "activeImageIndex", "slideshowControlsProps", "slideGroupLabel", "images", "zoomOutButtonProps", "zoomInButtonProps", "activeImageRef"];
|
|
8492
|
-
const Inner = /*#__PURE__*/forwardRef((props, ref) => {
|
|
8493
|
-
const {
|
|
8494
|
-
className,
|
|
8495
|
-
isOpen,
|
|
8496
|
-
closeButtonProps,
|
|
8497
|
-
onClose,
|
|
8498
|
-
parentElement,
|
|
8499
|
-
activeImageIndex,
|
|
8500
|
-
slideshowControlsProps,
|
|
8501
|
-
slideGroupLabel,
|
|
8502
|
-
images,
|
|
8503
|
-
zoomOutButtonProps,
|
|
8504
|
-
zoomInButtonProps,
|
|
8505
|
-
activeImageRef: propImageRef
|
|
8506
|
-
} = props,
|
|
8507
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$B);
|
|
8508
|
-
const currentPaginationItemRef = React.useRef(null);
|
|
8509
|
-
const footerRef = React.useRef(null);
|
|
8510
|
-
const imageRef = React.useRef(null);
|
|
8511
|
-
const clickAwayChildrenRefs = React.useRef([imageRef, footerRef]);
|
|
8512
|
-
return /*#__PURE__*/React.createElement(Lightbox, _extends({
|
|
8513
|
-
ref: ref,
|
|
8514
|
-
className: classnames(className, CLASSNAME$v),
|
|
8515
|
-
parentElement: parentElement,
|
|
8516
|
-
isOpen: isOpen,
|
|
8517
|
-
onClose: onClose,
|
|
8518
|
-
closeButtonProps: closeButtonProps,
|
|
8519
|
-
focusElement: currentPaginationItemRef
|
|
8520
|
-
}, forwardedProps), /*#__PURE__*/React.createElement(ClickAwayProvider, {
|
|
8521
|
-
childrenRefs: clickAwayChildrenRefs,
|
|
8522
|
-
callback: onClose
|
|
8523
|
-
}, /*#__PURE__*/React.createElement(ImageSlideshow, {
|
|
8524
|
-
activeImageIndex: activeImageIndex,
|
|
8525
|
-
slideGroupLabel: slideGroupLabel,
|
|
8526
|
-
slideshowControlsProps: slideshowControlsProps,
|
|
8527
|
-
images: images,
|
|
8528
|
-
zoomInButtonProps: zoomInButtonProps,
|
|
8529
|
-
zoomOutButtonProps: zoomOutButtonProps,
|
|
8530
|
-
footerRef: footerRef,
|
|
8531
|
-
activeImageRef: mergeRefs(propImageRef, imageRef),
|
|
8532
|
-
currentPaginationItemRef: currentPaginationItemRef
|
|
8533
|
-
})));
|
|
8534
|
-
});
|
|
8535
|
-
Inner.displayName = COMPONENT_NAME$y;
|
|
8536
|
-
Inner.className = CLASSNAME$v;
|
|
8537
|
-
|
|
8538
|
-
/**
|
|
8539
|
-
* ImageLightbox component.
|
|
8540
|
-
*
|
|
8541
|
-
* @param props Component props.
|
|
8542
|
-
* @param ref Component ref.
|
|
8543
|
-
* @return React element.
|
|
8544
|
-
*/
|
|
8545
|
-
const ImageLightbox = Object.assign(Inner, {
|
|
8546
|
-
useImageLightbox
|
|
8547
|
-
});
|
|
8548
|
-
|
|
8549
|
-
const _excluded$C = ["className", "color", "colorVariant", "typography", "children", "wrap"];
|
|
7817
|
+
const _excluded$z = ["className", "color", "colorVariant", "typography", "children", "wrap"];
|
|
8550
7818
|
|
|
8551
7819
|
/**
|
|
8552
7820
|
* Defines the props of the component.
|
|
@@ -8555,12 +7823,12 @@ const _excluded$C = ["className", "color", "colorVariant", "typography", "childr
|
|
|
8555
7823
|
/**
|
|
8556
7824
|
* Component display name.
|
|
8557
7825
|
*/
|
|
8558
|
-
const COMPONENT_NAME$
|
|
7826
|
+
const COMPONENT_NAME$y = 'InlineList';
|
|
8559
7827
|
|
|
8560
7828
|
/**
|
|
8561
7829
|
* Component default class name and class prefix.
|
|
8562
7830
|
*/
|
|
8563
|
-
const CLASSNAME$
|
|
7831
|
+
const CLASSNAME$v = getRootClassName(COMPONENT_NAME$y);
|
|
8564
7832
|
|
|
8565
7833
|
/**
|
|
8566
7834
|
* Component default props.
|
|
@@ -8583,7 +7851,7 @@ const InlineList = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8583
7851
|
children,
|
|
8584
7852
|
wrap
|
|
8585
7853
|
} = props,
|
|
8586
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
7854
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$z);
|
|
8587
7855
|
const fontColorClassName = color && getFontColorClassName(color, colorVariant);
|
|
8588
7856
|
const typographyClassName = typography && getTypographyClassName(typography);
|
|
8589
7857
|
return (
|
|
@@ -8591,7 +7859,7 @@ const InlineList = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8591
7859
|
// eslint-disable-next-line jsx-a11y/no-redundant-roles
|
|
8592
7860
|
React.createElement("ul", _extends({}, forwardedProps, {
|
|
8593
7861
|
ref: ref,
|
|
8594
|
-
className: classnames(className, CLASSNAME$
|
|
7862
|
+
className: classnames(className, CLASSNAME$v, wrap && `${CLASSNAME$v}--wrap`, fontColorClassName, typographyClassName)
|
|
8595
7863
|
// Lists with removed bullet style can lose their a11y list role on some browsers
|
|
8596
7864
|
,
|
|
8597
7865
|
role: "list"
|
|
@@ -8604,17 +7872,17 @@ const InlineList = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8604
7872
|
React.createElement("li", {
|
|
8605
7873
|
key: key,
|
|
8606
7874
|
role: "listitem",
|
|
8607
|
-
className: `${CLASSNAME$
|
|
7875
|
+
className: `${CLASSNAME$v}__item`
|
|
8608
7876
|
}, index !== 0 && /*#__PURE__*/React.createElement("span", {
|
|
8609
|
-
className: `${CLASSNAME$
|
|
7877
|
+
className: `${CLASSNAME$v}__item-separator`,
|
|
8610
7878
|
"aria-hidden": "true"
|
|
8611
7879
|
}, '\u00A0•\u00A0'), child)
|
|
8612
7880
|
);
|
|
8613
7881
|
}))
|
|
8614
7882
|
);
|
|
8615
7883
|
});
|
|
8616
|
-
InlineList.displayName = COMPONENT_NAME$
|
|
8617
|
-
InlineList.className = CLASSNAME$
|
|
7884
|
+
InlineList.displayName = COMPONENT_NAME$y;
|
|
7885
|
+
InlineList.className = CLASSNAME$v;
|
|
8618
7886
|
InlineList.defaultProps = DEFAULT_PROPS$r;
|
|
8619
7887
|
|
|
8620
7888
|
const INPUT_HELPER_CONFIGURATION = {
|
|
@@ -8629,7 +7897,7 @@ const INPUT_HELPER_CONFIGURATION = {
|
|
|
8629
7897
|
}
|
|
8630
7898
|
};
|
|
8631
7899
|
|
|
8632
|
-
const _excluded$
|
|
7900
|
+
const _excluded$A = ["children", "className", "kind", "theme"];
|
|
8633
7901
|
|
|
8634
7902
|
/**
|
|
8635
7903
|
* Defines the props of the component.
|
|
@@ -8638,12 +7906,12 @@ const _excluded$D = ["children", "className", "kind", "theme"];
|
|
|
8638
7906
|
/**
|
|
8639
7907
|
* Component display name.
|
|
8640
7908
|
*/
|
|
8641
|
-
const COMPONENT_NAME$
|
|
7909
|
+
const COMPONENT_NAME$z = 'InputHelper';
|
|
8642
7910
|
|
|
8643
7911
|
/**
|
|
8644
7912
|
* Component default class name and class prefix.
|
|
8645
7913
|
*/
|
|
8646
|
-
const CLASSNAME$
|
|
7914
|
+
const CLASSNAME$w = getRootClassName(COMPONENT_NAME$z);
|
|
8647
7915
|
|
|
8648
7916
|
/**
|
|
8649
7917
|
* Component default props.
|
|
@@ -8667,7 +7935,7 @@ const InputHelper = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8667
7935
|
kind,
|
|
8668
7936
|
theme
|
|
8669
7937
|
} = props,
|
|
8670
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
7938
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$A);
|
|
8671
7939
|
const {
|
|
8672
7940
|
color
|
|
8673
7941
|
} = INPUT_HELPER_CONFIGURATION[kind] || {};
|
|
@@ -8675,17 +7943,17 @@ const InputHelper = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8675
7943
|
ref: ref
|
|
8676
7944
|
}, forwardedProps, {
|
|
8677
7945
|
className: classnames(className, handleBasicClasses({
|
|
8678
|
-
prefix: CLASSNAME$
|
|
7946
|
+
prefix: CLASSNAME$w,
|
|
8679
7947
|
color,
|
|
8680
7948
|
theme
|
|
8681
7949
|
}))
|
|
8682
7950
|
}), children);
|
|
8683
7951
|
});
|
|
8684
|
-
InputHelper.displayName = COMPONENT_NAME$
|
|
8685
|
-
InputHelper.className = CLASSNAME$
|
|
7952
|
+
InputHelper.displayName = COMPONENT_NAME$z;
|
|
7953
|
+
InputHelper.className = CLASSNAME$w;
|
|
8686
7954
|
InputHelper.defaultProps = DEFAULT_PROPS$s;
|
|
8687
7955
|
|
|
8688
|
-
const _excluded$
|
|
7956
|
+
const _excluded$B = ["children", "className", "htmlFor", "isRequired", "theme"];
|
|
8689
7957
|
|
|
8690
7958
|
/**
|
|
8691
7959
|
* Defines the props of the component.
|
|
@@ -8694,12 +7962,12 @@ const _excluded$E = ["children", "className", "htmlFor", "isRequired", "theme"];
|
|
|
8694
7962
|
/**
|
|
8695
7963
|
* Component display name.
|
|
8696
7964
|
*/
|
|
8697
|
-
const COMPONENT_NAME$
|
|
7965
|
+
const COMPONENT_NAME$A = 'InputLabel';
|
|
8698
7966
|
|
|
8699
7967
|
/**
|
|
8700
7968
|
* Component default class name and class prefix.
|
|
8701
7969
|
*/
|
|
8702
|
-
const CLASSNAME$
|
|
7970
|
+
const CLASSNAME$x = getRootClassName(COMPONENT_NAME$A);
|
|
8703
7971
|
|
|
8704
7972
|
/**
|
|
8705
7973
|
* Component default props.
|
|
@@ -8723,23 +7991,23 @@ const InputLabel = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8723
7991
|
isRequired,
|
|
8724
7992
|
theme
|
|
8725
7993
|
} = props,
|
|
8726
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
7994
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$B);
|
|
8727
7995
|
return /*#__PURE__*/React.createElement("label", _extends({
|
|
8728
7996
|
ref: ref
|
|
8729
7997
|
}, forwardedProps, {
|
|
8730
7998
|
htmlFor: htmlFor,
|
|
8731
7999
|
className: classnames(className, handleBasicClasses({
|
|
8732
|
-
prefix: CLASSNAME$
|
|
8000
|
+
prefix: CLASSNAME$x,
|
|
8733
8001
|
isRequired,
|
|
8734
8002
|
theme
|
|
8735
8003
|
}))
|
|
8736
8004
|
}), children);
|
|
8737
8005
|
});
|
|
8738
|
-
InputLabel.displayName = COMPONENT_NAME$
|
|
8739
|
-
InputLabel.className = CLASSNAME$
|
|
8006
|
+
InputLabel.displayName = COMPONENT_NAME$A;
|
|
8007
|
+
InputLabel.className = CLASSNAME$x;
|
|
8740
8008
|
InputLabel.defaultProps = DEFAULT_PROPS$t;
|
|
8741
8009
|
|
|
8742
|
-
const _excluded$
|
|
8010
|
+
const _excluded$C = ["aria-labelledby", "ariaLabelledBy", "aria-label", "ariaLabel", "children", "className", "closeButtonProps", "isOpen", "onClose", "parentElement", "focusElement", "preventAutoClose", "theme", "zIndex"];
|
|
8743
8011
|
|
|
8744
8012
|
/**
|
|
8745
8013
|
* Defines the props of the component.
|
|
@@ -8748,12 +8016,12 @@ const _excluded$F = ["aria-labelledby", "ariaLabelledBy", "aria-label", "ariaLab
|
|
|
8748
8016
|
/**
|
|
8749
8017
|
* Component display name.
|
|
8750
8018
|
*/
|
|
8751
|
-
const COMPONENT_NAME$
|
|
8019
|
+
const COMPONENT_NAME$B = 'Lightbox';
|
|
8752
8020
|
|
|
8753
8021
|
/**
|
|
8754
8022
|
* Component default class name and class prefix.
|
|
8755
8023
|
*/
|
|
8756
|
-
const CLASSNAME$
|
|
8024
|
+
const CLASSNAME$y = getRootClassName(COMPONENT_NAME$B);
|
|
8757
8025
|
|
|
8758
8026
|
/**
|
|
8759
8027
|
* Lightbox component.
|
|
@@ -8779,7 +8047,7 @@ const Lightbox = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8779
8047
|
theme,
|
|
8780
8048
|
zIndex
|
|
8781
8049
|
} = props,
|
|
8782
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8050
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$C);
|
|
8783
8051
|
if (!DOCUMENT) {
|
|
8784
8052
|
// Can't render in SSR.
|
|
8785
8053
|
return null;
|
|
@@ -8840,7 +8108,7 @@ const Lightbox = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8840
8108
|
role: "dialog",
|
|
8841
8109
|
tabIndex: -1,
|
|
8842
8110
|
className: classnames(className, handleBasicClasses({
|
|
8843
|
-
prefix: CLASSNAME$
|
|
8111
|
+
prefix: CLASSNAME$y,
|
|
8844
8112
|
isHidden: !isOpen,
|
|
8845
8113
|
isShown: isOpen || isVisible,
|
|
8846
8114
|
theme
|
|
@@ -8849,7 +8117,7 @@ const Lightbox = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8849
8117
|
zIndex
|
|
8850
8118
|
}
|
|
8851
8119
|
}), closeButtonProps && /*#__PURE__*/React.createElement("div", {
|
|
8852
|
-
className: `${CLASSNAME$
|
|
8120
|
+
className: `${CLASSNAME$y}__close`
|
|
8853
8121
|
}, /*#__PURE__*/React.createElement(IconButton, _extends({}, closeButtonProps, {
|
|
8854
8122
|
ref: closeButtonRef,
|
|
8855
8123
|
emphasis: "low",
|
|
@@ -8863,14 +8131,14 @@ const Lightbox = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8863
8131
|
childrenRefs: clickAwayRefs
|
|
8864
8132
|
}, /*#__PURE__*/React.createElement("div", {
|
|
8865
8133
|
ref: childrenRef,
|
|
8866
|
-
className: `${CLASSNAME$
|
|
8134
|
+
className: `${CLASSNAME$y}__wrapper`,
|
|
8867
8135
|
role: "presentation"
|
|
8868
8136
|
}, children))), document.body);
|
|
8869
8137
|
});
|
|
8870
|
-
Lightbox.displayName = COMPONENT_NAME$
|
|
8871
|
-
Lightbox.className = CLASSNAME$
|
|
8138
|
+
Lightbox.displayName = COMPONENT_NAME$B;
|
|
8139
|
+
Lightbox.className = CLASSNAME$y;
|
|
8872
8140
|
|
|
8873
|
-
const _excluded$
|
|
8141
|
+
const _excluded$D = ["children", "className", "color", "colorVariant", "disabled", "isDisabled", "href", "leftIcon", "linkAs", "rightIcon", "target", "typography"];
|
|
8874
8142
|
|
|
8875
8143
|
/**
|
|
8876
8144
|
* Defines the props of the component.
|
|
@@ -8879,12 +8147,12 @@ const _excluded$G = ["children", "className", "color", "colorVariant", "disabled
|
|
|
8879
8147
|
/**
|
|
8880
8148
|
* Component display name.
|
|
8881
8149
|
*/
|
|
8882
|
-
const COMPONENT_NAME$
|
|
8150
|
+
const COMPONENT_NAME$C = 'Link';
|
|
8883
8151
|
|
|
8884
8152
|
/**
|
|
8885
8153
|
* Component default class name and class prefix.
|
|
8886
8154
|
*/
|
|
8887
|
-
const CLASSNAME$
|
|
8155
|
+
const CLASSNAME$z = getRootClassName(COMPONENT_NAME$C);
|
|
8888
8156
|
const getIconSize = typography => {
|
|
8889
8157
|
switch (typography) {
|
|
8890
8158
|
case Typography.display1:
|
|
@@ -8933,18 +8201,18 @@ const Link = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8933
8201
|
target,
|
|
8934
8202
|
typography
|
|
8935
8203
|
} = props,
|
|
8936
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8204
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$D);
|
|
8937
8205
|
const renderedChildren = useMemo(() => /*#__PURE__*/React.createElement(React.Fragment, null, leftIcon && !isEmpty(leftIcon) && /*#__PURE__*/React.createElement(Icon, {
|
|
8938
8206
|
icon: leftIcon,
|
|
8939
|
-
className: `${CLASSNAME$
|
|
8207
|
+
className: `${CLASSNAME$z}__left-icon`,
|
|
8940
8208
|
size: getIconSize(typography)
|
|
8941
8209
|
}), children && /*#__PURE__*/React.createElement("span", {
|
|
8942
|
-
className: classnames(`${CLASSNAME$
|
|
8210
|
+
className: classnames(`${CLASSNAME$z}__content`, {
|
|
8943
8211
|
[`lumx-typography-${typography}`]: typography
|
|
8944
8212
|
})
|
|
8945
8213
|
}, children), rightIcon && !isEmpty(rightIcon) && /*#__PURE__*/React.createElement(Icon, {
|
|
8946
8214
|
icon: rightIcon,
|
|
8947
|
-
className: `${CLASSNAME$
|
|
8215
|
+
className: `${CLASSNAME$z}__right-icon`,
|
|
8948
8216
|
size: getIconSize(typography)
|
|
8949
8217
|
})), [leftIcon, typography, children, rightIcon]);
|
|
8950
8218
|
|
|
@@ -8959,7 +8227,7 @@ const Link = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8959
8227
|
ref: ref,
|
|
8960
8228
|
disabled: isDisabled,
|
|
8961
8229
|
className: classnames(className, handleBasicClasses({
|
|
8962
|
-
prefix: CLASSNAME$
|
|
8230
|
+
prefix: CLASSNAME$z,
|
|
8963
8231
|
color,
|
|
8964
8232
|
colorVariant
|
|
8965
8233
|
}))
|
|
@@ -8971,17 +8239,17 @@ const Link = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
8971
8239
|
href,
|
|
8972
8240
|
target,
|
|
8973
8241
|
className: classnames(className, handleBasicClasses({
|
|
8974
|
-
prefix: CLASSNAME$
|
|
8242
|
+
prefix: CLASSNAME$z,
|
|
8975
8243
|
color,
|
|
8976
8244
|
colorVariant
|
|
8977
8245
|
})),
|
|
8978
8246
|
ref: ref
|
|
8979
8247
|
}), renderedChildren);
|
|
8980
8248
|
});
|
|
8981
|
-
Link.displayName = COMPONENT_NAME$
|
|
8982
|
-
Link.className = CLASSNAME$
|
|
8249
|
+
Link.displayName = COMPONENT_NAME$C;
|
|
8250
|
+
Link.className = CLASSNAME$z;
|
|
8983
8251
|
|
|
8984
|
-
const _excluded$
|
|
8252
|
+
const _excluded$E = ["className", "description", "link", "linkAs", "linkProps", "size", "theme", "thumbnailProps", "title", "titleHeading"];
|
|
8985
8253
|
|
|
8986
8254
|
/**
|
|
8987
8255
|
* Defines the props of the component.
|
|
@@ -8990,12 +8258,12 @@ const _excluded$H = ["className", "description", "link", "linkAs", "linkProps",
|
|
|
8990
8258
|
/**
|
|
8991
8259
|
* Component display name.
|
|
8992
8260
|
*/
|
|
8993
|
-
const COMPONENT_NAME$
|
|
8261
|
+
const COMPONENT_NAME$D = 'LinkPreview';
|
|
8994
8262
|
|
|
8995
8263
|
/**
|
|
8996
8264
|
* Component default class name and class prefix.
|
|
8997
8265
|
*/
|
|
8998
|
-
const CLASSNAME$
|
|
8266
|
+
const CLASSNAME$A = getRootClassName(COMPONENT_NAME$D);
|
|
8999
8267
|
|
|
9000
8268
|
/**
|
|
9001
8269
|
* Component default props.
|
|
@@ -9026,21 +8294,21 @@ const LinkPreview = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9026
8294
|
title,
|
|
9027
8295
|
titleHeading
|
|
9028
8296
|
} = props,
|
|
9029
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8297
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$E);
|
|
9030
8298
|
// Use title heading as title wrapper (see DEFAULT_PROPS for the default value).
|
|
9031
8299
|
const TitleHeading = titleHeading;
|
|
9032
8300
|
return /*#__PURE__*/React.createElement("article", _extends({
|
|
9033
8301
|
ref: ref
|
|
9034
8302
|
}, forwardedProps, {
|
|
9035
8303
|
className: classnames(className, handleBasicClasses({
|
|
9036
|
-
prefix: CLASSNAME$
|
|
8304
|
+
prefix: CLASSNAME$A,
|
|
9037
8305
|
size: size === Size.big && thumbnailProps ? Size.big : Size.regular,
|
|
9038
8306
|
theme
|
|
9039
8307
|
}))
|
|
9040
8308
|
}), /*#__PURE__*/React.createElement("div", {
|
|
9041
|
-
className: `${CLASSNAME$
|
|
8309
|
+
className: `${CLASSNAME$A}__wrapper`
|
|
9042
8310
|
}, thumbnailProps && /*#__PURE__*/React.createElement("div", {
|
|
9043
|
-
className: `${CLASSNAME$
|
|
8311
|
+
className: `${CLASSNAME$A}__thumbnail`
|
|
9044
8312
|
}, /*#__PURE__*/React.createElement(Thumbnail, _extends({}, thumbnailProps, {
|
|
9045
8313
|
linkAs: linkAs,
|
|
9046
8314
|
linkProps: _objectSpread2(_objectSpread2({}, linkProps), {}, {
|
|
@@ -9052,9 +8320,9 @@ const LinkPreview = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9052
8320
|
aspectRatio: AspectRatio.free,
|
|
9053
8321
|
fillHeight: true
|
|
9054
8322
|
}))), /*#__PURE__*/React.createElement("div", {
|
|
9055
|
-
className: `${CLASSNAME$
|
|
8323
|
+
className: `${CLASSNAME$A}__container`
|
|
9056
8324
|
}, title && /*#__PURE__*/React.createElement(TitleHeading, {
|
|
9057
|
-
className: `${CLASSNAME$
|
|
8325
|
+
className: `${CLASSNAME$A}__title`
|
|
9058
8326
|
}, /*#__PURE__*/React.createElement(Link, _extends({}, linkProps, {
|
|
9059
8327
|
linkAs: linkAs,
|
|
9060
8328
|
target: "_blank",
|
|
@@ -9062,12 +8330,12 @@ const LinkPreview = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9062
8330
|
color: theme === Theme.light ? ColorPalette.dark : ColorPalette.light,
|
|
9063
8331
|
colorVariant: ColorVariant.N
|
|
9064
8332
|
}), title)), description && /*#__PURE__*/React.createElement("p", {
|
|
9065
|
-
className: `${CLASSNAME$
|
|
8333
|
+
className: `${CLASSNAME$A}__description`
|
|
9066
8334
|
}, description), /*#__PURE__*/React.createElement("div", {
|
|
9067
|
-
className: `${CLASSNAME$
|
|
8335
|
+
className: `${CLASSNAME$A}__link`
|
|
9068
8336
|
}, /*#__PURE__*/React.createElement(Link, _extends({}, linkProps, {
|
|
9069
8337
|
linkAs: linkAs,
|
|
9070
|
-
className: classnames(`${CLASSNAME$
|
|
8338
|
+
className: classnames(`${CLASSNAME$A}__link`, linkProps === null || linkProps === void 0 ? void 0 : linkProps.className),
|
|
9071
8339
|
target: "_blank",
|
|
9072
8340
|
href: link,
|
|
9073
8341
|
color: theme === Theme.light ? ColorPalette.primary : ColorPalette.light,
|
|
@@ -9077,11 +8345,11 @@ const LinkPreview = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9077
8345
|
tabIndex: title ? '-1' : undefined
|
|
9078
8346
|
}), link)))));
|
|
9079
8347
|
});
|
|
9080
|
-
LinkPreview.displayName = COMPONENT_NAME$
|
|
9081
|
-
LinkPreview.className = CLASSNAME$
|
|
8348
|
+
LinkPreview.displayName = COMPONENT_NAME$D;
|
|
8349
|
+
LinkPreview.className = CLASSNAME$A;
|
|
9082
8350
|
LinkPreview.defaultProps = DEFAULT_PROPS$u;
|
|
9083
8351
|
|
|
9084
|
-
const _excluded$
|
|
8352
|
+
const _excluded$F = ["className"];
|
|
9085
8353
|
|
|
9086
8354
|
/**
|
|
9087
8355
|
* Defines the props of the component.
|
|
@@ -9090,12 +8358,12 @@ const _excluded$I = ["className"];
|
|
|
9090
8358
|
/**
|
|
9091
8359
|
* Component display name.
|
|
9092
8360
|
*/
|
|
9093
|
-
const COMPONENT_NAME$
|
|
8361
|
+
const COMPONENT_NAME$E = 'ListDivider';
|
|
9094
8362
|
|
|
9095
8363
|
/**
|
|
9096
8364
|
* Component default class name and class prefix.
|
|
9097
8365
|
*/
|
|
9098
|
-
const CLASSNAME$
|
|
8366
|
+
const CLASSNAME$B = getRootClassName(COMPONENT_NAME$E);
|
|
9099
8367
|
|
|
9100
8368
|
/**
|
|
9101
8369
|
* ListDivider component.
|
|
@@ -9108,19 +8376,19 @@ const ListDivider = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9108
8376
|
const {
|
|
9109
8377
|
className
|
|
9110
8378
|
} = props,
|
|
9111
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8379
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$F);
|
|
9112
8380
|
return /*#__PURE__*/React.createElement("li", _extends({
|
|
9113
8381
|
ref: ref
|
|
9114
8382
|
}, forwardedProps, {
|
|
9115
8383
|
className: classnames(className, handleBasicClasses({
|
|
9116
|
-
prefix: CLASSNAME$
|
|
8384
|
+
prefix: CLASSNAME$B
|
|
9117
8385
|
}))
|
|
9118
8386
|
}));
|
|
9119
8387
|
});
|
|
9120
|
-
ListDivider.displayName = COMPONENT_NAME$
|
|
9121
|
-
ListDivider.className = CLASSNAME$
|
|
8388
|
+
ListDivider.displayName = COMPONENT_NAME$E;
|
|
8389
|
+
ListDivider.className = CLASSNAME$B;
|
|
9122
8390
|
|
|
9123
|
-
const _excluded$
|
|
8391
|
+
const _excluded$G = ["children", "className"];
|
|
9124
8392
|
|
|
9125
8393
|
/**
|
|
9126
8394
|
* Defines the props of the component.
|
|
@@ -9129,12 +8397,12 @@ const _excluded$J = ["children", "className"];
|
|
|
9129
8397
|
/**
|
|
9130
8398
|
* Component display name.
|
|
9131
8399
|
*/
|
|
9132
|
-
const COMPONENT_NAME$
|
|
8400
|
+
const COMPONENT_NAME$F = 'ListSubheader';
|
|
9133
8401
|
|
|
9134
8402
|
/**
|
|
9135
8403
|
* Component default class name and class prefix.
|
|
9136
8404
|
*/
|
|
9137
|
-
const CLASSNAME$
|
|
8405
|
+
const CLASSNAME$C = getRootClassName(COMPONENT_NAME$F);
|
|
9138
8406
|
|
|
9139
8407
|
/**
|
|
9140
8408
|
* ListSubheader component.
|
|
@@ -9148,19 +8416,19 @@ const ListSubheader = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9148
8416
|
children,
|
|
9149
8417
|
className
|
|
9150
8418
|
} = props,
|
|
9151
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8419
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$G);
|
|
9152
8420
|
return /*#__PURE__*/React.createElement("li", _extends({
|
|
9153
8421
|
ref: ref
|
|
9154
8422
|
}, forwardedProps, {
|
|
9155
8423
|
className: classnames(className, handleBasicClasses({
|
|
9156
|
-
prefix: CLASSNAME$
|
|
8424
|
+
prefix: CLASSNAME$C
|
|
9157
8425
|
}))
|
|
9158
8426
|
}), children);
|
|
9159
8427
|
});
|
|
9160
|
-
ListSubheader.displayName = COMPONENT_NAME$
|
|
9161
|
-
ListSubheader.className = CLASSNAME$
|
|
8428
|
+
ListSubheader.displayName = COMPONENT_NAME$F;
|
|
8429
|
+
ListSubheader.className = CLASSNAME$C;
|
|
9162
8430
|
|
|
9163
|
-
const _excluded$
|
|
8431
|
+
const _excluded$H = ["children", "className", "hasBackground", "kind", "icon", "closeButtonProps"];
|
|
9164
8432
|
|
|
9165
8433
|
/**
|
|
9166
8434
|
* Defines the props of the component.
|
|
@@ -9169,12 +8437,12 @@ const _excluded$K = ["children", "className", "hasBackground", "kind", "icon", "
|
|
|
9169
8437
|
/**
|
|
9170
8438
|
* Component display name.
|
|
9171
8439
|
*/
|
|
9172
|
-
const COMPONENT_NAME$
|
|
8440
|
+
const COMPONENT_NAME$G = 'Message';
|
|
9173
8441
|
|
|
9174
8442
|
/**
|
|
9175
8443
|
* Component default class name and class prefix.
|
|
9176
8444
|
*/
|
|
9177
|
-
const CLASSNAME$
|
|
8445
|
+
const CLASSNAME$D = getRootClassName(COMPONENT_NAME$G);
|
|
9178
8446
|
|
|
9179
8447
|
/**
|
|
9180
8448
|
* Associative map from message kind to color and icon.
|
|
@@ -9214,7 +8482,7 @@ const Message = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9214
8482
|
icon: customIcon,
|
|
9215
8483
|
closeButtonProps
|
|
9216
8484
|
} = props,
|
|
9217
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8485
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$H);
|
|
9218
8486
|
const {
|
|
9219
8487
|
color,
|
|
9220
8488
|
icon
|
|
@@ -9229,27 +8497,27 @@ const Message = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9229
8497
|
className: classnames(className, handleBasicClasses({
|
|
9230
8498
|
color,
|
|
9231
8499
|
hasBackground,
|
|
9232
|
-
prefix: CLASSNAME$
|
|
8500
|
+
prefix: CLASSNAME$D
|
|
9233
8501
|
}))
|
|
9234
8502
|
}, forwardedProps), (customIcon || icon) && /*#__PURE__*/React.createElement(Icon, {
|
|
9235
|
-
className: `${CLASSNAME$
|
|
8503
|
+
className: `${CLASSNAME$D}__icon`,
|
|
9236
8504
|
icon: customIcon || icon,
|
|
9237
8505
|
size: Size.xs,
|
|
9238
8506
|
color: color
|
|
9239
8507
|
}), /*#__PURE__*/React.createElement("div", {
|
|
9240
|
-
className: `${CLASSNAME$
|
|
8508
|
+
className: `${CLASSNAME$D}__text`
|
|
9241
8509
|
}, children), isCloseButtonDisplayed && /*#__PURE__*/React.createElement(IconButton, {
|
|
9242
|
-
className: `${CLASSNAME$
|
|
8510
|
+
className: `${CLASSNAME$D}__close-button`,
|
|
9243
8511
|
icon: mdiClose,
|
|
9244
8512
|
onClick: onClick,
|
|
9245
8513
|
label: closeButtonLabel,
|
|
9246
8514
|
emphasis: Emphasis.low
|
|
9247
8515
|
}));
|
|
9248
8516
|
});
|
|
9249
|
-
Message.displayName = COMPONENT_NAME$
|
|
9250
|
-
Message.className = CLASSNAME$
|
|
8517
|
+
Message.displayName = COMPONENT_NAME$G;
|
|
8518
|
+
Message.className = CLASSNAME$D;
|
|
9251
8519
|
|
|
9252
|
-
const _excluded$
|
|
8520
|
+
const _excluded$I = ["className", "theme", "thumbnails", "onImageClick"],
|
|
9253
8521
|
_excluded2$1 = ["image", "onClick", "align"];
|
|
9254
8522
|
|
|
9255
8523
|
/**
|
|
@@ -9259,12 +8527,12 @@ const _excluded$L = ["className", "theme", "thumbnails", "onImageClick"],
|
|
|
9259
8527
|
/**
|
|
9260
8528
|
* Component display name.
|
|
9261
8529
|
*/
|
|
9262
|
-
const COMPONENT_NAME$
|
|
8530
|
+
const COMPONENT_NAME$H = 'Mosaic';
|
|
9263
8531
|
|
|
9264
8532
|
/**
|
|
9265
8533
|
* Component default class name and class prefix.
|
|
9266
8534
|
*/
|
|
9267
|
-
const CLASSNAME$
|
|
8535
|
+
const CLASSNAME$E = getRootClassName(COMPONENT_NAME$H);
|
|
9268
8536
|
|
|
9269
8537
|
/**
|
|
9270
8538
|
* Component default props.
|
|
@@ -9287,7 +8555,7 @@ const Mosaic = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9287
8555
|
thumbnails,
|
|
9288
8556
|
onImageClick
|
|
9289
8557
|
} = props,
|
|
9290
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8558
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$I);
|
|
9291
8559
|
const handleImageClick = useMemo(() => {
|
|
9292
8560
|
if (!onImageClick) return undefined;
|
|
9293
8561
|
return (index, onClick) => event => {
|
|
@@ -9299,16 +8567,16 @@ const Mosaic = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9299
8567
|
ref: ref
|
|
9300
8568
|
}, forwardedProps, {
|
|
9301
8569
|
className: classnames(className, handleBasicClasses({
|
|
9302
|
-
prefix: CLASSNAME$
|
|
8570
|
+
prefix: CLASSNAME$E,
|
|
9303
8571
|
theme
|
|
9304
8572
|
}), {
|
|
9305
|
-
[`${CLASSNAME$
|
|
9306
|
-
[`${CLASSNAME$
|
|
9307
|
-
[`${CLASSNAME$
|
|
9308
|
-
[`${CLASSNAME$
|
|
8573
|
+
[`${CLASSNAME$E}--has-1-thumbnail`]: (thumbnails === null || thumbnails === void 0 ? void 0 : thumbnails.length) === 1,
|
|
8574
|
+
[`${CLASSNAME$E}--has-2-thumbnails`]: (thumbnails === null || thumbnails === void 0 ? void 0 : thumbnails.length) === 2,
|
|
8575
|
+
[`${CLASSNAME$E}--has-3-thumbnails`]: (thumbnails === null || thumbnails === void 0 ? void 0 : thumbnails.length) === 3,
|
|
8576
|
+
[`${CLASSNAME$E}--has-4-thumbnails`]: (thumbnails === null || thumbnails === void 0 ? void 0 : thumbnails.length) >= 4
|
|
9309
8577
|
})
|
|
9310
8578
|
}), /*#__PURE__*/React.createElement("div", {
|
|
9311
|
-
className: `${CLASSNAME$
|
|
8579
|
+
className: `${CLASSNAME$E}__wrapper`
|
|
9312
8580
|
}, take(thumbnails, 4).map((thumbnail, index) => {
|
|
9313
8581
|
const {
|
|
9314
8582
|
image,
|
|
@@ -9318,7 +8586,7 @@ const Mosaic = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9318
8586
|
thumbnailProps = _objectWithoutProperties(thumbnail, _excluded2$1);
|
|
9319
8587
|
return /*#__PURE__*/React.createElement("div", {
|
|
9320
8588
|
key: index,
|
|
9321
|
-
className: `${CLASSNAME$
|
|
8589
|
+
className: `${CLASSNAME$E}__thumbnail`
|
|
9322
8590
|
}, /*#__PURE__*/React.createElement(Thumbnail, _extends({}, thumbnailProps, {
|
|
9323
8591
|
align: align || Alignment.left,
|
|
9324
8592
|
image: image,
|
|
@@ -9327,12 +8595,12 @@ const Mosaic = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9327
8595
|
fillHeight: true,
|
|
9328
8596
|
onClick: (handleImageClick === null || handleImageClick === void 0 ? void 0 : handleImageClick(index, onClick)) || onClick
|
|
9329
8597
|
})), thumbnails.length > 4 && index === 3 && /*#__PURE__*/React.createElement("div", {
|
|
9330
|
-
className: `${CLASSNAME$
|
|
8598
|
+
className: `${CLASSNAME$E}__overlay`
|
|
9331
8599
|
}, /*#__PURE__*/React.createElement("span", null, "+", thumbnails.length - 4)));
|
|
9332
8600
|
})));
|
|
9333
8601
|
});
|
|
9334
|
-
Mosaic.displayName = COMPONENT_NAME$
|
|
9335
|
-
Mosaic.className = CLASSNAME$
|
|
8602
|
+
Mosaic.displayName = COMPONENT_NAME$H;
|
|
8603
|
+
Mosaic.className = CLASSNAME$E;
|
|
9336
8604
|
Mosaic.defaultProps = DEFAULT_PROPS$v;
|
|
9337
8605
|
|
|
9338
8606
|
const ThemeContext = /*#__PURE__*/createContext(undefined);
|
|
@@ -9342,7 +8610,7 @@ function forwardRefPolymorphic(render) {
|
|
|
9342
8610
|
return /*#__PURE__*/React.forwardRef(render);
|
|
9343
8611
|
}
|
|
9344
8612
|
|
|
9345
|
-
const _excluded$
|
|
8613
|
+
const _excluded$J = ["className", "icon", "label", "isCurrentPage", "as"];
|
|
9346
8614
|
|
|
9347
8615
|
/** Make `href` required when `as` is `a` */
|
|
9348
8616
|
|
|
@@ -9353,12 +8621,12 @@ const _excluded$M = ["className", "icon", "label", "isCurrentPage", "as"];
|
|
|
9353
8621
|
/**
|
|
9354
8622
|
* Component display name.
|
|
9355
8623
|
*/
|
|
9356
|
-
const COMPONENT_NAME$
|
|
8624
|
+
const COMPONENT_NAME$I = 'NavigationItem';
|
|
9357
8625
|
|
|
9358
8626
|
/**
|
|
9359
8627
|
* Component default class name and class prefix.
|
|
9360
8628
|
*/
|
|
9361
|
-
const CLASSNAME$
|
|
8629
|
+
const CLASSNAME$F = getRootClassName(COMPONENT_NAME$I);
|
|
9362
8630
|
const NavigationItem = Object.assign(forwardRefPolymorphic((props, ref) => {
|
|
9363
8631
|
const {
|
|
9364
8632
|
className,
|
|
@@ -9367,7 +8635,7 @@ const NavigationItem = Object.assign(forwardRefPolymorphic((props, ref) => {
|
|
|
9367
8635
|
isCurrentPage,
|
|
9368
8636
|
as: Element = 'a'
|
|
9369
8637
|
} = props,
|
|
9370
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8638
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$J);
|
|
9371
8639
|
const theme = useContext(ThemeContext);
|
|
9372
8640
|
const {
|
|
9373
8641
|
tooltipLabel,
|
|
@@ -9378,7 +8646,7 @@ const NavigationItem = Object.assign(forwardRefPolymorphic((props, ref) => {
|
|
|
9378
8646
|
} : {};
|
|
9379
8647
|
return /*#__PURE__*/React.createElement("li", {
|
|
9380
8648
|
className: classnames(className, handleBasicClasses({
|
|
9381
|
-
prefix: CLASSNAME$
|
|
8649
|
+
prefix: CLASSNAME$F,
|
|
9382
8650
|
theme
|
|
9383
8651
|
}))
|
|
9384
8652
|
}, /*#__PURE__*/React.createElement(Tooltip, {
|
|
@@ -9386,41 +8654,41 @@ const NavigationItem = Object.assign(forwardRefPolymorphic((props, ref) => {
|
|
|
9386
8654
|
placement: Placement.TOP
|
|
9387
8655
|
}, /*#__PURE__*/React.createElement(Element, _extends({
|
|
9388
8656
|
className: handleBasicClasses({
|
|
9389
|
-
prefix: `${CLASSNAME$
|
|
8657
|
+
prefix: `${CLASSNAME$F}__link`,
|
|
9390
8658
|
isSelected: isCurrentPage
|
|
9391
8659
|
}),
|
|
9392
8660
|
ref: ref,
|
|
9393
8661
|
"aria-current": isCurrentPage ? 'page' : undefined
|
|
9394
8662
|
}, buttonProps, forwardedProps), icon ? /*#__PURE__*/React.createElement(Icon, {
|
|
9395
|
-
className: `${CLASSNAME$
|
|
8663
|
+
className: `${CLASSNAME$F}__icon`,
|
|
9396
8664
|
icon: icon,
|
|
9397
8665
|
size: Size.xs,
|
|
9398
8666
|
theme: theme
|
|
9399
8667
|
}) : null, /*#__PURE__*/React.createElement(Text, {
|
|
9400
8668
|
as: "span",
|
|
9401
8669
|
truncate: true,
|
|
9402
|
-
className: `${CLASSNAME$
|
|
8670
|
+
className: `${CLASSNAME$F}__label`,
|
|
9403
8671
|
ref: labelRef
|
|
9404
8672
|
}, label))));
|
|
9405
8673
|
}), {
|
|
9406
|
-
displayName: COMPONENT_NAME$
|
|
9407
|
-
className: CLASSNAME$
|
|
8674
|
+
displayName: COMPONENT_NAME$I,
|
|
8675
|
+
className: CLASSNAME$F
|
|
9408
8676
|
});
|
|
9409
8677
|
|
|
9410
8678
|
const NavigationContext = /*#__PURE__*/createContext({
|
|
9411
8679
|
orientation: Orientation.vertical
|
|
9412
8680
|
});
|
|
9413
8681
|
|
|
9414
|
-
const _excluded$
|
|
8682
|
+
const _excluded$K = ["children", "className", "label", "icon"];
|
|
9415
8683
|
/**
|
|
9416
8684
|
* Component display name.
|
|
9417
8685
|
*/
|
|
9418
|
-
const COMPONENT_NAME$
|
|
8686
|
+
const COMPONENT_NAME$J = 'NavigationSection';
|
|
9419
8687
|
|
|
9420
8688
|
/**
|
|
9421
8689
|
* Component default class name and class prefix.
|
|
9422
8690
|
*/
|
|
9423
|
-
const CLASSNAME$
|
|
8691
|
+
const CLASSNAME$G = getRootClassName(COMPONENT_NAME$J);
|
|
9424
8692
|
const NavigationSection = Object.assign( /*#__PURE__*/forwardRef((props, ref) => {
|
|
9425
8693
|
const {
|
|
9426
8694
|
children,
|
|
@@ -9428,7 +8696,7 @@ const NavigationSection = Object.assign( /*#__PURE__*/forwardRef((props, ref) =>
|
|
|
9428
8696
|
label,
|
|
9429
8697
|
icon
|
|
9430
8698
|
} = props,
|
|
9431
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8699
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$K);
|
|
9432
8700
|
const [isOpen, setIsOpen] = useState(false);
|
|
9433
8701
|
const buttonRef = useRef(null);
|
|
9434
8702
|
const sectionId = useMemo(() => uniqueId('section'), []);
|
|
@@ -9438,15 +8706,15 @@ const NavigationSection = Object.assign( /*#__PURE__*/forwardRef((props, ref) =>
|
|
|
9438
8706
|
const theme = useContext(ThemeContext);
|
|
9439
8707
|
const isDropdown = orientation === Orientation.horizontal;
|
|
9440
8708
|
return /*#__PURE__*/React.createElement("li", _extends({
|
|
9441
|
-
className: classnames(className, CLASSNAME$
|
|
9442
|
-
prefix: CLASSNAME$
|
|
8709
|
+
className: classnames(className, CLASSNAME$G, CLASSNAME$F, handleBasicClasses({
|
|
8710
|
+
prefix: CLASSNAME$F,
|
|
9443
8711
|
theme
|
|
9444
8712
|
})),
|
|
9445
8713
|
ref: ref
|
|
9446
8714
|
}, forwardedProps), /*#__PURE__*/React.createElement("button", {
|
|
9447
8715
|
"aria-controls": sectionId,
|
|
9448
8716
|
"aria-expanded": isOpen,
|
|
9449
|
-
className: classnames(`${CLASSNAME$
|
|
8717
|
+
className: classnames(`${CLASSNAME$F}__link`),
|
|
9450
8718
|
ref: buttonRef,
|
|
9451
8719
|
onClick: event => {
|
|
9452
8720
|
setIsOpen(!isOpen);
|
|
@@ -9454,16 +8722,16 @@ const NavigationSection = Object.assign( /*#__PURE__*/forwardRef((props, ref) =>
|
|
|
9454
8722
|
},
|
|
9455
8723
|
type: "button"
|
|
9456
8724
|
}, icon ? /*#__PURE__*/React.createElement(Icon, {
|
|
9457
|
-
className: `${CLASSNAME$
|
|
8725
|
+
className: `${CLASSNAME$F}__icon`,
|
|
9458
8726
|
icon: icon,
|
|
9459
8727
|
size: Size.xs
|
|
9460
8728
|
}) : null, /*#__PURE__*/React.createElement(Text, {
|
|
9461
8729
|
as: "span",
|
|
9462
8730
|
truncate: true,
|
|
9463
|
-
className: `${CLASSNAME$
|
|
8731
|
+
className: `${CLASSNAME$F}__label`,
|
|
9464
8732
|
ref: ref
|
|
9465
8733
|
}, label), /*#__PURE__*/React.createElement(Icon, {
|
|
9466
|
-
className: classnames(`${CLASSNAME$
|
|
8734
|
+
className: classnames(`${CLASSNAME$F}__icon`, `${CLASSNAME$G}__chevron`),
|
|
9467
8735
|
icon: isOpen ? mdiChevronUp : mdiChevronDown
|
|
9468
8736
|
})), isOpen && (isDropdown ? /*#__PURE__*/React.createElement(Popover, {
|
|
9469
8737
|
anchorRef: buttonRef,
|
|
@@ -9478,31 +8746,31 @@ const NavigationSection = Object.assign( /*#__PURE__*/forwardRef((props, ref) =>
|
|
|
9478
8746
|
}, /*#__PURE__*/React.createElement(ThemeContext.Provider, {
|
|
9479
8747
|
value: Theme.light
|
|
9480
8748
|
}, /*#__PURE__*/React.createElement("ul", {
|
|
9481
|
-
className: `${CLASSNAME$
|
|
8749
|
+
className: `${CLASSNAME$G}__drawer--popover`,
|
|
9482
8750
|
id: sectionId
|
|
9483
8751
|
}, /*#__PURE__*/React.createElement(NavigationContext.Provider, {
|
|
9484
8752
|
value: {
|
|
9485
8753
|
orientation: Orientation.vertical
|
|
9486
8754
|
}
|
|
9487
8755
|
}, children)))) : /*#__PURE__*/React.createElement("ul", {
|
|
9488
|
-
className: `${CLASSNAME$
|
|
8756
|
+
className: `${CLASSNAME$G}__drawer`,
|
|
9489
8757
|
id: sectionId
|
|
9490
8758
|
}, children)));
|
|
9491
8759
|
}), {
|
|
9492
|
-
displayName: COMPONENT_NAME$
|
|
9493
|
-
className: CLASSNAME$
|
|
8760
|
+
displayName: COMPONENT_NAME$J,
|
|
8761
|
+
className: CLASSNAME$G
|
|
9494
8762
|
});
|
|
9495
8763
|
|
|
9496
|
-
const _excluded$
|
|
8764
|
+
const _excluded$L = ["children", "className", "theme", "orientation"];
|
|
9497
8765
|
/**
|
|
9498
8766
|
* Component display name.
|
|
9499
8767
|
*/
|
|
9500
|
-
const COMPONENT_NAME$
|
|
8768
|
+
const COMPONENT_NAME$K = 'Navigation';
|
|
9501
8769
|
|
|
9502
8770
|
/**
|
|
9503
8771
|
* Component default class name and class prefix.
|
|
9504
8772
|
*/
|
|
9505
|
-
const CLASSNAME$
|
|
8773
|
+
const CLASSNAME$H = getRootClassName(COMPONENT_NAME$K);
|
|
9506
8774
|
const Navigation = Object.assign(
|
|
9507
8775
|
/*#__PURE__*/
|
|
9508
8776
|
// eslint-disable-next-line react/display-name
|
|
@@ -9513,12 +8781,12 @@ forwardRef((props, ref) => {
|
|
|
9513
8781
|
theme,
|
|
9514
8782
|
orientation
|
|
9515
8783
|
} = props,
|
|
9516
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8784
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$L);
|
|
9517
8785
|
return /*#__PURE__*/React.createElement(ThemeContext.Provider, {
|
|
9518
8786
|
value: theme
|
|
9519
8787
|
}, /*#__PURE__*/React.createElement("nav", _extends({
|
|
9520
8788
|
className: classnames(className, handleBasicClasses({
|
|
9521
|
-
prefix: CLASSNAME$
|
|
8789
|
+
prefix: CLASSNAME$H,
|
|
9522
8790
|
theme,
|
|
9523
8791
|
orientation
|
|
9524
8792
|
})),
|
|
@@ -9528,11 +8796,11 @@ forwardRef((props, ref) => {
|
|
|
9528
8796
|
orientation
|
|
9529
8797
|
}
|
|
9530
8798
|
}, /*#__PURE__*/React.createElement("ul", {
|
|
9531
|
-
className: `${CLASSNAME$
|
|
8799
|
+
className: `${CLASSNAME$H}__list`
|
|
9532
8800
|
}, children))));
|
|
9533
8801
|
}), {
|
|
9534
|
-
displayName: COMPONENT_NAME$
|
|
9535
|
-
className: CLASSNAME$
|
|
8802
|
+
displayName: COMPONENT_NAME$K,
|
|
8803
|
+
className: CLASSNAME$H,
|
|
9536
8804
|
defaultProps: {
|
|
9537
8805
|
theme: Theme.light,
|
|
9538
8806
|
orientation: Orientation.vertical
|
|
@@ -9564,7 +8832,7 @@ const NOTIFICATION_CONFIGURATION = {
|
|
|
9564
8832
|
}
|
|
9565
8833
|
};
|
|
9566
8834
|
|
|
9567
|
-
const _excluded$
|
|
8835
|
+
const _excluded$M = ["actionLabel", "className", "content", "isOpen", "onActionClick", "onClick", "theme", "type", "zIndex", "usePortal", "style"];
|
|
9568
8836
|
|
|
9569
8837
|
/**
|
|
9570
8838
|
* Defines the props of the component.
|
|
@@ -9573,12 +8841,12 @@ const _excluded$P = ["actionLabel", "className", "content", "isOpen", "onActionC
|
|
|
9573
8841
|
/**
|
|
9574
8842
|
* Component display name.
|
|
9575
8843
|
*/
|
|
9576
|
-
const COMPONENT_NAME$
|
|
8844
|
+
const COMPONENT_NAME$L = 'Notification';
|
|
9577
8845
|
|
|
9578
8846
|
/**
|
|
9579
8847
|
* Component default class name and class prefix.
|
|
9580
8848
|
*/
|
|
9581
|
-
const CLASSNAME$
|
|
8849
|
+
const CLASSNAME$I = getRootClassName(COMPONENT_NAME$L);
|
|
9582
8850
|
|
|
9583
8851
|
/**
|
|
9584
8852
|
* Component default props.
|
|
@@ -9611,7 +8879,7 @@ const Notification = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9611
8879
|
usePortal,
|
|
9612
8880
|
style
|
|
9613
8881
|
} = props,
|
|
9614
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8882
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$M);
|
|
9615
8883
|
if (!DOCUMENT) {
|
|
9616
8884
|
// Can't render in SSR.
|
|
9617
8885
|
return null;
|
|
@@ -9643,21 +8911,21 @@ const Notification = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9643
8911
|
color,
|
|
9644
8912
|
hasAction,
|
|
9645
8913
|
isHidden: !isOpen,
|
|
9646
|
-
prefix: CLASSNAME$
|
|
8914
|
+
prefix: CLASSNAME$I
|
|
9647
8915
|
})),
|
|
9648
8916
|
onClick: onClick,
|
|
9649
8917
|
style: _objectSpread2(_objectSpread2({}, style), {}, {
|
|
9650
8918
|
zIndex
|
|
9651
8919
|
})
|
|
9652
8920
|
}), /*#__PURE__*/React.createElement("div", {
|
|
9653
|
-
className: `${CLASSNAME$
|
|
8921
|
+
className: `${CLASSNAME$I}__icon`
|
|
9654
8922
|
}, /*#__PURE__*/React.createElement(Icon, {
|
|
9655
8923
|
icon: icon,
|
|
9656
8924
|
size: Size.s
|
|
9657
8925
|
})), /*#__PURE__*/React.createElement("div", {
|
|
9658
|
-
className: `${CLASSNAME$
|
|
8926
|
+
className: `${CLASSNAME$I}__content`
|
|
9659
8927
|
}, content), hasAction && /*#__PURE__*/React.createElement("div", {
|
|
9660
|
-
className: `${CLASSNAME$
|
|
8928
|
+
className: `${CLASSNAME$I}__action`
|
|
9661
8929
|
}, /*#__PURE__*/React.createElement(Button, {
|
|
9662
8930
|
emphasis: Emphasis.medium,
|
|
9663
8931
|
theme: theme,
|
|
@@ -9665,11 +8933,11 @@ const Notification = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9665
8933
|
}, /*#__PURE__*/React.createElement("span", null, actionLabel))));
|
|
9666
8934
|
return usePortal ? /*#__PURE__*/createPortal(notification, document.body) : notification;
|
|
9667
8935
|
});
|
|
9668
|
-
Notification.displayName = COMPONENT_NAME$
|
|
9669
|
-
Notification.className = CLASSNAME$
|
|
8936
|
+
Notification.displayName = COMPONENT_NAME$L;
|
|
8937
|
+
Notification.className = CLASSNAME$I;
|
|
9670
8938
|
Notification.defaultProps = DEFAULT_PROPS$w;
|
|
9671
8939
|
|
|
9672
|
-
const _excluded$
|
|
8940
|
+
const _excluded$N = ["children", "isOpen", "focusElement", "aria-label", "label", "className"];
|
|
9673
8941
|
|
|
9674
8942
|
/**
|
|
9675
8943
|
* PopoverDialog props.
|
|
@@ -9679,12 +8947,12 @@ const _excluded$Q = ["children", "isOpen", "focusElement", "aria-label", "label"
|
|
|
9679
8947
|
/**
|
|
9680
8948
|
* Component display name.
|
|
9681
8949
|
*/
|
|
9682
|
-
const COMPONENT_NAME$
|
|
8950
|
+
const COMPONENT_NAME$M = 'PopoverDialog';
|
|
9683
8951
|
|
|
9684
8952
|
/**
|
|
9685
8953
|
* Component default class name and class prefix.
|
|
9686
8954
|
*/
|
|
9687
|
-
const CLASSNAME$
|
|
8955
|
+
const CLASSNAME$J = getRootClassName(COMPONENT_NAME$M);
|
|
9688
8956
|
|
|
9689
8957
|
/**
|
|
9690
8958
|
* Component default props.
|
|
@@ -9707,11 +8975,11 @@ const PopoverDialog = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9707
8975
|
label = ariaLabel,
|
|
9708
8976
|
className
|
|
9709
8977
|
} = props,
|
|
9710
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
8978
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$N);
|
|
9711
8979
|
return /*#__PURE__*/React.createElement(Popover, _extends({}, forwardedProps, {
|
|
9712
8980
|
ref: ref,
|
|
9713
8981
|
className: classnames(className, handleBasicClasses({
|
|
9714
|
-
prefix: CLASSNAME$
|
|
8982
|
+
prefix: CLASSNAME$J
|
|
9715
8983
|
})),
|
|
9716
8984
|
role: "dialog",
|
|
9717
8985
|
"aria-modal": "true"
|
|
@@ -9727,11 +8995,11 @@ const PopoverDialog = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9727
8995
|
withFocusTrap: true
|
|
9728
8996
|
}), children);
|
|
9729
8997
|
});
|
|
9730
|
-
PopoverDialog.displayName = COMPONENT_NAME$
|
|
9731
|
-
PopoverDialog.className = CLASSNAME$
|
|
8998
|
+
PopoverDialog.displayName = COMPONENT_NAME$M;
|
|
8999
|
+
PopoverDialog.className = CLASSNAME$J;
|
|
9732
9000
|
PopoverDialog.defaultProps = DEFAULT_PROPS$x;
|
|
9733
9001
|
|
|
9734
|
-
const _excluded$
|
|
9002
|
+
const _excluded$O = ["actions", "attachments", "author", "className", "meta", "onClick", "orientation", "tags", "text", "theme", "thumbnailProps", "title"];
|
|
9735
9003
|
|
|
9736
9004
|
/**
|
|
9737
9005
|
* Defines the props of the component.
|
|
@@ -9740,12 +9008,12 @@ const _excluded$R = ["actions", "attachments", "author", "className", "meta", "o
|
|
|
9740
9008
|
/**
|
|
9741
9009
|
* Component display name.
|
|
9742
9010
|
*/
|
|
9743
|
-
const COMPONENT_NAME$
|
|
9011
|
+
const COMPONENT_NAME$N = 'PostBlock';
|
|
9744
9012
|
|
|
9745
9013
|
/**
|
|
9746
9014
|
* Component default class name and class prefix.
|
|
9747
9015
|
*/
|
|
9748
|
-
const CLASSNAME$
|
|
9016
|
+
const CLASSNAME$K = getRootClassName(COMPONENT_NAME$N);
|
|
9749
9017
|
|
|
9750
9018
|
/**
|
|
9751
9019
|
* Component default props.
|
|
@@ -9777,61 +9045,61 @@ const PostBlock = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9777
9045
|
thumbnailProps,
|
|
9778
9046
|
title
|
|
9779
9047
|
} = props,
|
|
9780
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
9048
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$O);
|
|
9781
9049
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
9782
9050
|
ref: ref,
|
|
9783
9051
|
className: classnames(className, handleBasicClasses({
|
|
9784
|
-
prefix: CLASSNAME$
|
|
9052
|
+
prefix: CLASSNAME$K,
|
|
9785
9053
|
orientation,
|
|
9786
9054
|
theme
|
|
9787
9055
|
}))
|
|
9788
9056
|
}, forwardedProps), thumbnailProps && /*#__PURE__*/React.createElement("div", {
|
|
9789
|
-
className: `${CLASSNAME$
|
|
9057
|
+
className: `${CLASSNAME$K}__thumbnail`
|
|
9790
9058
|
}, /*#__PURE__*/React.createElement(Thumbnail, _extends({}, thumbnailProps, {
|
|
9791
9059
|
theme: theme,
|
|
9792
9060
|
variant: ThumbnailVariant.rounded
|
|
9793
9061
|
}))), /*#__PURE__*/React.createElement("div", {
|
|
9794
|
-
className: `${CLASSNAME$
|
|
9062
|
+
className: `${CLASSNAME$K}__wrapper`
|
|
9795
9063
|
}, author && /*#__PURE__*/React.createElement("div", {
|
|
9796
|
-
className: `${CLASSNAME$
|
|
9064
|
+
className: `${CLASSNAME$K}__author`
|
|
9797
9065
|
}, author), title && /*#__PURE__*/React.createElement("button", {
|
|
9798
9066
|
type: "button",
|
|
9799
|
-
className: `${CLASSNAME$
|
|
9067
|
+
className: `${CLASSNAME$K}__title`,
|
|
9800
9068
|
onClick: onClick
|
|
9801
9069
|
}, title), meta && /*#__PURE__*/React.createElement("span", {
|
|
9802
|
-
className: `${CLASSNAME$
|
|
9070
|
+
className: `${CLASSNAME$K}__meta`
|
|
9803
9071
|
}, meta), isObject(text) && text.__html ?
|
|
9804
9072
|
/*#__PURE__*/
|
|
9805
9073
|
// eslint-disable-next-line react/no-danger
|
|
9806
9074
|
React.createElement("p", {
|
|
9807
9075
|
dangerouslySetInnerHTML: text,
|
|
9808
|
-
className: `${CLASSNAME$
|
|
9076
|
+
className: `${CLASSNAME$K}__text`
|
|
9809
9077
|
}) : /*#__PURE__*/React.createElement("p", {
|
|
9810
|
-
className: `${CLASSNAME$
|
|
9078
|
+
className: `${CLASSNAME$K}__text`
|
|
9811
9079
|
}, text), attachments && /*#__PURE__*/React.createElement("div", {
|
|
9812
|
-
className: `${CLASSNAME$
|
|
9080
|
+
className: `${CLASSNAME$K}__attachments`
|
|
9813
9081
|
}, attachments), (tags || actions) && /*#__PURE__*/React.createElement("div", {
|
|
9814
|
-
className: `${CLASSNAME$
|
|
9082
|
+
className: `${CLASSNAME$K}__toolbar`
|
|
9815
9083
|
}, tags && /*#__PURE__*/React.createElement("div", {
|
|
9816
|
-
className: `${CLASSNAME$
|
|
9084
|
+
className: `${CLASSNAME$K}__tags`
|
|
9817
9085
|
}, tags), actions && /*#__PURE__*/React.createElement("div", {
|
|
9818
|
-
className: `${CLASSNAME$
|
|
9086
|
+
className: `${CLASSNAME$K}__actions`
|
|
9819
9087
|
}, actions))));
|
|
9820
9088
|
});
|
|
9821
|
-
PostBlock.displayName = COMPONENT_NAME$
|
|
9822
|
-
PostBlock.className = CLASSNAME$
|
|
9089
|
+
PostBlock.displayName = COMPONENT_NAME$N;
|
|
9090
|
+
PostBlock.className = CLASSNAME$K;
|
|
9823
9091
|
PostBlock.defaultProps = DEFAULT_PROPS$y;
|
|
9824
9092
|
|
|
9825
|
-
const _excluded$
|
|
9093
|
+
const _excluded$P = ["className", "theme"];
|
|
9826
9094
|
/**
|
|
9827
9095
|
* Component display name.
|
|
9828
9096
|
*/
|
|
9829
|
-
const COMPONENT_NAME$
|
|
9097
|
+
const COMPONENT_NAME$O = 'ProgressLinear';
|
|
9830
9098
|
|
|
9831
9099
|
/**
|
|
9832
9100
|
* Component default class name and class prefix.
|
|
9833
9101
|
*/
|
|
9834
|
-
const CLASSNAME$
|
|
9102
|
+
const CLASSNAME$L = getRootClassName(COMPONENT_NAME$O);
|
|
9835
9103
|
|
|
9836
9104
|
/**
|
|
9837
9105
|
* Component default props.
|
|
@@ -9852,12 +9120,12 @@ const ProgressLinear = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9852
9120
|
className,
|
|
9853
9121
|
theme
|
|
9854
9122
|
} = props,
|
|
9855
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
9123
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$P);
|
|
9856
9124
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
9857
9125
|
ref: ref
|
|
9858
9126
|
}, forwardedProps, {
|
|
9859
9127
|
className: classnames(className, handleBasicClasses({
|
|
9860
|
-
prefix: CLASSNAME$
|
|
9128
|
+
prefix: CLASSNAME$L,
|
|
9861
9129
|
theme
|
|
9862
9130
|
}))
|
|
9863
9131
|
}), /*#__PURE__*/React.createElement("div", {
|
|
@@ -9866,11 +9134,11 @@ const ProgressLinear = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9866
9134
|
className: "lumx-progress-linear__line2"
|
|
9867
9135
|
}));
|
|
9868
9136
|
});
|
|
9869
|
-
ProgressLinear.displayName = COMPONENT_NAME$
|
|
9870
|
-
ProgressLinear.className = CLASSNAME$
|
|
9137
|
+
ProgressLinear.displayName = COMPONENT_NAME$O;
|
|
9138
|
+
ProgressLinear.className = CLASSNAME$L;
|
|
9871
9139
|
ProgressLinear.defaultProps = DEFAULT_PROPS$z;
|
|
9872
9140
|
|
|
9873
|
-
const _excluded$
|
|
9141
|
+
const _excluded$Q = ["className", "theme", "size"];
|
|
9874
9142
|
|
|
9875
9143
|
/**
|
|
9876
9144
|
* Progress sizes.
|
|
@@ -9883,12 +9151,12 @@ const _excluded$T = ["className", "theme", "size"];
|
|
|
9883
9151
|
/**
|
|
9884
9152
|
* Component display name.
|
|
9885
9153
|
*/
|
|
9886
|
-
const COMPONENT_NAME$
|
|
9154
|
+
const COMPONENT_NAME$P = 'ProgressCircular';
|
|
9887
9155
|
|
|
9888
9156
|
/**
|
|
9889
9157
|
* Component default class name and class prefix.
|
|
9890
9158
|
*/
|
|
9891
|
-
const CLASSNAME$
|
|
9159
|
+
const CLASSNAME$M = getRootClassName(COMPONENT_NAME$P);
|
|
9892
9160
|
|
|
9893
9161
|
/**
|
|
9894
9162
|
* Component default props.
|
|
@@ -9911,12 +9179,12 @@ const ProgressCircular = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9911
9179
|
theme,
|
|
9912
9180
|
size
|
|
9913
9181
|
} = props,
|
|
9914
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
9182
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$Q);
|
|
9915
9183
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
9916
9184
|
ref: ref
|
|
9917
9185
|
}, forwardedProps, {
|
|
9918
9186
|
className: classnames(className, handleBasicClasses({
|
|
9919
|
-
prefix: CLASSNAME$
|
|
9187
|
+
prefix: CLASSNAME$M,
|
|
9920
9188
|
theme,
|
|
9921
9189
|
size
|
|
9922
9190
|
}))
|
|
@@ -9936,11 +9204,11 @@ const ProgressCircular = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9936
9204
|
strokeWidth: "5"
|
|
9937
9205
|
})));
|
|
9938
9206
|
});
|
|
9939
|
-
ProgressCircular.displayName = COMPONENT_NAME$
|
|
9940
|
-
ProgressCircular.className = CLASSNAME$
|
|
9207
|
+
ProgressCircular.displayName = COMPONENT_NAME$P;
|
|
9208
|
+
ProgressCircular.className = CLASSNAME$M;
|
|
9941
9209
|
ProgressCircular.defaultProps = DEFAULT_PROPS$A;
|
|
9942
9210
|
|
|
9943
|
-
const _excluded$
|
|
9211
|
+
const _excluded$R = ["className", "theme", "variant"];
|
|
9944
9212
|
|
|
9945
9213
|
/**
|
|
9946
9214
|
* Progress variants.
|
|
@@ -9957,12 +9225,12 @@ const ProgressVariant = {
|
|
|
9957
9225
|
/**
|
|
9958
9226
|
* Component display name.
|
|
9959
9227
|
*/
|
|
9960
|
-
const COMPONENT_NAME$
|
|
9228
|
+
const COMPONENT_NAME$Q = 'Progress';
|
|
9961
9229
|
|
|
9962
9230
|
/**
|
|
9963
9231
|
* Component default class name and class prefix.
|
|
9964
9232
|
*/
|
|
9965
|
-
const CLASSNAME$
|
|
9233
|
+
const CLASSNAME$N = getRootClassName(COMPONENT_NAME$Q);
|
|
9966
9234
|
|
|
9967
9235
|
/**
|
|
9968
9236
|
* Component default props.
|
|
@@ -9986,12 +9254,12 @@ const Progress = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9986
9254
|
theme,
|
|
9987
9255
|
variant
|
|
9988
9256
|
} = props,
|
|
9989
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
9257
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$R);
|
|
9990
9258
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
9991
9259
|
ref: ref
|
|
9992
9260
|
}, forwardedProps, {
|
|
9993
9261
|
className: classnames(className, handleBasicClasses({
|
|
9994
|
-
prefix: CLASSNAME$
|
|
9262
|
+
prefix: CLASSNAME$N,
|
|
9995
9263
|
theme,
|
|
9996
9264
|
variant
|
|
9997
9265
|
}))
|
|
@@ -10001,8 +9269,8 @@ const Progress = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10001
9269
|
theme: theme
|
|
10002
9270
|
}));
|
|
10003
9271
|
});
|
|
10004
|
-
Progress.displayName = COMPONENT_NAME$
|
|
10005
|
-
Progress.className = CLASSNAME$
|
|
9272
|
+
Progress.displayName = COMPONENT_NAME$Q;
|
|
9273
|
+
Progress.className = CLASSNAME$N;
|
|
10006
9274
|
Progress.defaultProps = DEFAULT_PROPS$B;
|
|
10007
9275
|
|
|
10008
9276
|
const INIT_STATE = {
|
|
@@ -10124,7 +9392,7 @@ const useTabProviderContextState = () => {
|
|
|
10124
9392
|
return context === null || context === void 0 ? void 0 : context[0];
|
|
10125
9393
|
};
|
|
10126
9394
|
|
|
10127
|
-
const _excluded$
|
|
9395
|
+
const _excluded$S = ["children", "onChange"];
|
|
10128
9396
|
const DEFAULT_PROPS$C = {
|
|
10129
9397
|
isLazy: INIT_STATE.isLazy,
|
|
10130
9398
|
shouldActivateOnFocus: INIT_STATE.shouldActivateOnFocus
|
|
@@ -10146,7 +9414,7 @@ const ProgressTrackerProvider = props => {
|
|
|
10146
9414
|
children,
|
|
10147
9415
|
onChange
|
|
10148
9416
|
} = props,
|
|
10149
|
-
propState = _objectWithoutProperties(props, _excluded$
|
|
9417
|
+
propState = _objectWithoutProperties(props, _excluded$S);
|
|
10150
9418
|
const [state, dispatch] = useReducer(reducer, INIT_STATE);
|
|
10151
9419
|
|
|
10152
9420
|
// On prop state change => dispatch update.
|
|
@@ -10250,7 +9518,7 @@ const useRovingTabIndex = _ref => {
|
|
|
10250
9518
|
[parentRef, ...extraDependencies]);
|
|
10251
9519
|
};
|
|
10252
9520
|
|
|
10253
|
-
const _excluded$
|
|
9521
|
+
const _excluded$T = ["aria-label", "children", "className"];
|
|
10254
9522
|
|
|
10255
9523
|
/**
|
|
10256
9524
|
* Defines the props of the component.
|
|
@@ -10259,12 +9527,12 @@ const _excluded$W = ["aria-label", "children", "className"];
|
|
|
10259
9527
|
/**
|
|
10260
9528
|
* Component display name.
|
|
10261
9529
|
*/
|
|
10262
|
-
const COMPONENT_NAME$
|
|
9530
|
+
const COMPONENT_NAME$R = 'ProgressTracker';
|
|
10263
9531
|
|
|
10264
9532
|
/**
|
|
10265
9533
|
* Component default class name and class prefix.
|
|
10266
9534
|
*/
|
|
10267
|
-
const CLASSNAME$
|
|
9535
|
+
const CLASSNAME$O = getRootClassName(COMPONENT_NAME$R);
|
|
10268
9536
|
|
|
10269
9537
|
/**
|
|
10270
9538
|
* Component default props.
|
|
@@ -10287,7 +9555,7 @@ const ProgressTracker = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10287
9555
|
children,
|
|
10288
9556
|
className
|
|
10289
9557
|
} = props,
|
|
10290
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
9558
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$T);
|
|
10291
9559
|
const stepListRef = React.useRef(null);
|
|
10292
9560
|
useRovingTabIndex({
|
|
10293
9561
|
parentRef: stepListRef,
|
|
@@ -10303,20 +9571,20 @@ const ProgressTracker = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10303
9571
|
ref: mergeRefs(ref, stepListRef)
|
|
10304
9572
|
}, forwardedProps, {
|
|
10305
9573
|
className: classnames(className, handleBasicClasses({
|
|
10306
|
-
prefix: CLASSNAME$
|
|
9574
|
+
prefix: CLASSNAME$O
|
|
10307
9575
|
}))
|
|
10308
9576
|
}), /*#__PURE__*/React.createElement("div", {
|
|
10309
|
-
className: `${CLASSNAME$
|
|
9577
|
+
className: `${CLASSNAME$O}__steps`,
|
|
10310
9578
|
role: "tablist",
|
|
10311
9579
|
"aria-label": ariaLabel
|
|
10312
9580
|
}, children), /*#__PURE__*/React.createElement("div", {
|
|
10313
|
-
className: `${CLASSNAME$
|
|
9581
|
+
className: `${CLASSNAME$O}__background-bar`,
|
|
10314
9582
|
style: {
|
|
10315
9583
|
left: `${backgroundPosition}%`,
|
|
10316
9584
|
right: `${backgroundPosition}%`
|
|
10317
9585
|
}
|
|
10318
9586
|
}), /*#__PURE__*/React.createElement("div", {
|
|
10319
|
-
className: `${CLASSNAME$
|
|
9587
|
+
className: `${CLASSNAME$O}__foreground-bar`,
|
|
10320
9588
|
style: {
|
|
10321
9589
|
left: `${backgroundPosition}%`,
|
|
10322
9590
|
right: `${backgroundPosition}%`,
|
|
@@ -10324,11 +9592,11 @@ const ProgressTracker = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10324
9592
|
}
|
|
10325
9593
|
}));
|
|
10326
9594
|
});
|
|
10327
|
-
ProgressTracker.displayName = COMPONENT_NAME$
|
|
10328
|
-
ProgressTracker.className = CLASSNAME$
|
|
9595
|
+
ProgressTracker.displayName = COMPONENT_NAME$R;
|
|
9596
|
+
ProgressTracker.className = CLASSNAME$O;
|
|
10329
9597
|
ProgressTracker.defaultProps = DEFAULT_PROPS$D;
|
|
10330
9598
|
|
|
10331
|
-
const _excluded$
|
|
9599
|
+
const _excluded$U = ["className", "disabled", "hasError", "helper", "id", "isActive", "isComplete", "isDisabled", "label", "onFocus", "onKeyPress", "tabIndex"];
|
|
10332
9600
|
|
|
10333
9601
|
/**
|
|
10334
9602
|
* Defines the props of the component.
|
|
@@ -10337,12 +9605,12 @@ const _excluded$X = ["className", "disabled", "hasError", "helper", "id", "isAct
|
|
|
10337
9605
|
/**
|
|
10338
9606
|
* Component display name.
|
|
10339
9607
|
*/
|
|
10340
|
-
const COMPONENT_NAME$
|
|
9608
|
+
const COMPONENT_NAME$S = 'ProgressTrackerStep';
|
|
10341
9609
|
|
|
10342
9610
|
/**
|
|
10343
9611
|
* Component default class name and class prefix.
|
|
10344
9612
|
*/
|
|
10345
|
-
const CLASSNAME$
|
|
9613
|
+
const CLASSNAME$P = getRootClassName(COMPONENT_NAME$S);
|
|
10346
9614
|
|
|
10347
9615
|
/**
|
|
10348
9616
|
* Component default props.
|
|
@@ -10373,7 +9641,7 @@ const ProgressTrackerStep = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10373
9641
|
onKeyPress,
|
|
10374
9642
|
tabIndex = -1
|
|
10375
9643
|
} = props,
|
|
10376
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
9644
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$U);
|
|
10377
9645
|
const state = useTabProviderContext('tab', id);
|
|
10378
9646
|
const isActive = propIsActive || (state === null || state === void 0 ? void 0 : state.isActive);
|
|
10379
9647
|
const changeToCurrentTab = useCallback(() => {
|
|
@@ -10410,7 +9678,7 @@ const ProgressTrackerStep = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10410
9678
|
type: "button",
|
|
10411
9679
|
id: state === null || state === void 0 ? void 0 : state.tabId,
|
|
10412
9680
|
className: classnames(className, handleBasicClasses({
|
|
10413
|
-
prefix: CLASSNAME$
|
|
9681
|
+
prefix: CLASSNAME$P,
|
|
10414
9682
|
hasError,
|
|
10415
9683
|
isActive,
|
|
10416
9684
|
isClickable: state && !isDisabled,
|
|
@@ -10425,22 +9693,22 @@ const ProgressTrackerStep = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10425
9693
|
"aria-selected": isActive,
|
|
10426
9694
|
"aria-controls": state === null || state === void 0 ? void 0 : state.tabPanelId
|
|
10427
9695
|
}), /*#__PURE__*/React.createElement(Icon, {
|
|
10428
|
-
className: `${CLASSNAME$
|
|
9696
|
+
className: `${CLASSNAME$P}__state`,
|
|
10429
9697
|
icon: getIcon(),
|
|
10430
9698
|
size: Size.s
|
|
10431
9699
|
}), /*#__PURE__*/React.createElement(InputLabel, {
|
|
10432
9700
|
htmlFor: (state === null || state === void 0 ? void 0 : state.tabId) || '',
|
|
10433
|
-
className: `${CLASSNAME$
|
|
9701
|
+
className: `${CLASSNAME$P}__label`
|
|
10434
9702
|
}, label), helper && /*#__PURE__*/React.createElement(InputHelper, {
|
|
10435
9703
|
kind: hasError ? Kind.error : Kind.info,
|
|
10436
|
-
className: `${CLASSNAME$
|
|
9704
|
+
className: `${CLASSNAME$P}__helper`
|
|
10437
9705
|
}, helper));
|
|
10438
9706
|
});
|
|
10439
|
-
ProgressTrackerStep.displayName = COMPONENT_NAME$
|
|
10440
|
-
ProgressTrackerStep.className = CLASSNAME$
|
|
9707
|
+
ProgressTrackerStep.displayName = COMPONENT_NAME$S;
|
|
9708
|
+
ProgressTrackerStep.className = CLASSNAME$P;
|
|
10441
9709
|
ProgressTrackerStep.defaultProps = DEFAULT_PROPS$E;
|
|
10442
9710
|
|
|
10443
|
-
const _excluded$
|
|
9711
|
+
const _excluded$V = ["children", "id", "className", "isActive"];
|
|
10444
9712
|
|
|
10445
9713
|
/**
|
|
10446
9714
|
* Defines the props of the component.
|
|
@@ -10449,12 +9717,12 @@ const _excluded$Y = ["children", "id", "className", "isActive"];
|
|
|
10449
9717
|
/**
|
|
10450
9718
|
* Component display name.
|
|
10451
9719
|
*/
|
|
10452
|
-
const COMPONENT_NAME$
|
|
9720
|
+
const COMPONENT_NAME$T = 'ProgressTrackerStepPanel';
|
|
10453
9721
|
|
|
10454
9722
|
/**
|
|
10455
9723
|
* Component default class name and class prefix.
|
|
10456
9724
|
*/
|
|
10457
|
-
const CLASSNAME$
|
|
9725
|
+
const CLASSNAME$Q = `${CSS_PREFIX}-step-panel`;
|
|
10458
9726
|
|
|
10459
9727
|
/**
|
|
10460
9728
|
* Component default props.
|
|
@@ -10477,7 +9745,7 @@ const ProgressTrackerStepPanel = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10477
9745
|
className,
|
|
10478
9746
|
isActive: propIsActive
|
|
10479
9747
|
} = props,
|
|
10480
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
9748
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$V);
|
|
10481
9749
|
const state = useTabProviderContext('tabPanel', id);
|
|
10482
9750
|
const isActive = propIsActive || (state === null || state === void 0 ? void 0 : state.isActive);
|
|
10483
9751
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
@@ -10485,7 +9753,7 @@ const ProgressTrackerStepPanel = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10485
9753
|
}, forwardedProps, {
|
|
10486
9754
|
id: state === null || state === void 0 ? void 0 : state.tabPanelId,
|
|
10487
9755
|
className: classnames(className, handleBasicClasses({
|
|
10488
|
-
prefix: CLASSNAME$
|
|
9756
|
+
prefix: CLASSNAME$Q,
|
|
10489
9757
|
isActive
|
|
10490
9758
|
})),
|
|
10491
9759
|
role: "tabpanel",
|
|
@@ -10493,11 +9761,11 @@ const ProgressTrackerStepPanel = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10493
9761
|
"aria-labelledby": state === null || state === void 0 ? void 0 : state.tabId
|
|
10494
9762
|
}), (!(state !== null && state !== void 0 && state.isLazy) || isActive) && children);
|
|
10495
9763
|
});
|
|
10496
|
-
ProgressTrackerStepPanel.displayName = COMPONENT_NAME$
|
|
10497
|
-
ProgressTrackerStepPanel.className = CLASSNAME$
|
|
9764
|
+
ProgressTrackerStepPanel.displayName = COMPONENT_NAME$T;
|
|
9765
|
+
ProgressTrackerStepPanel.className = CLASSNAME$Q;
|
|
10498
9766
|
ProgressTrackerStepPanel.defaultProps = DEFAULT_PROPS$F;
|
|
10499
9767
|
|
|
10500
|
-
const _excluded$
|
|
9768
|
+
const _excluded$W = ["checked", "className", "disabled", "helper", "id", "inputRef", "isChecked", "isDisabled", "label", "name", "onChange", "theme", "value", "inputProps"];
|
|
10501
9769
|
|
|
10502
9770
|
/**
|
|
10503
9771
|
* Defines the props of the component.
|
|
@@ -10506,12 +9774,12 @@ const _excluded$Z = ["checked", "className", "disabled", "helper", "id", "inputR
|
|
|
10506
9774
|
/**
|
|
10507
9775
|
* Component display name.
|
|
10508
9776
|
*/
|
|
10509
|
-
const COMPONENT_NAME$
|
|
9777
|
+
const COMPONENT_NAME$U = 'RadioButton';
|
|
10510
9778
|
|
|
10511
9779
|
/**
|
|
10512
9780
|
* Component default class name and class prefix.
|
|
10513
9781
|
*/
|
|
10514
|
-
const CLASSNAME$
|
|
9782
|
+
const CLASSNAME$R = getRootClassName(COMPONENT_NAME$U);
|
|
10515
9783
|
|
|
10516
9784
|
/**
|
|
10517
9785
|
* Component default props.
|
|
@@ -10544,8 +9812,8 @@ const RadioButton = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10544
9812
|
value,
|
|
10545
9813
|
inputProps
|
|
10546
9814
|
} = props,
|
|
10547
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
10548
|
-
const inputId = useMemo(() => id || `${CLASSNAME$
|
|
9815
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$W);
|
|
9816
|
+
const inputId = useMemo(() => id || `${CLASSNAME$R.toLowerCase()}-${uid()}`, [id]);
|
|
10549
9817
|
const handleChange = event => {
|
|
10550
9818
|
if (onChange) {
|
|
10551
9819
|
onChange(value, name, event);
|
|
@@ -10558,14 +9826,14 @@ const RadioButton = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10558
9826
|
isChecked,
|
|
10559
9827
|
isDisabled,
|
|
10560
9828
|
isUnchecked: !isChecked,
|
|
10561
|
-
prefix: CLASSNAME$
|
|
9829
|
+
prefix: CLASSNAME$R,
|
|
10562
9830
|
theme
|
|
10563
9831
|
}))
|
|
10564
9832
|
}), /*#__PURE__*/React.createElement("div", {
|
|
10565
|
-
className: `${CLASSNAME$
|
|
9833
|
+
className: `${CLASSNAME$R}__input-wrapper`
|
|
10566
9834
|
}, /*#__PURE__*/React.createElement("input", _extends({
|
|
10567
9835
|
ref: inputRef,
|
|
10568
|
-
className: `${CLASSNAME$
|
|
9836
|
+
className: `${CLASSNAME$R}__input-native`,
|
|
10569
9837
|
disabled: isDisabled,
|
|
10570
9838
|
id: inputId,
|
|
10571
9839
|
tabIndex: isDisabled ? -1 : 0,
|
|
@@ -10576,28 +9844,28 @@ const RadioButton = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10576
9844
|
onChange: handleChange,
|
|
10577
9845
|
"aria-describedby": helper ? `${inputId}-helper` : undefined
|
|
10578
9846
|
}, inputProps)), /*#__PURE__*/React.createElement("div", {
|
|
10579
|
-
className: `${CLASSNAME$
|
|
9847
|
+
className: `${CLASSNAME$R}__input-placeholder`
|
|
10580
9848
|
}, /*#__PURE__*/React.createElement("div", {
|
|
10581
|
-
className: `${CLASSNAME$
|
|
9849
|
+
className: `${CLASSNAME$R}__input-background`
|
|
10582
9850
|
}), /*#__PURE__*/React.createElement("div", {
|
|
10583
|
-
className: `${CLASSNAME$
|
|
9851
|
+
className: `${CLASSNAME$R}__input-indicator`
|
|
10584
9852
|
}))), /*#__PURE__*/React.createElement("div", {
|
|
10585
|
-
className: `${CLASSNAME$
|
|
9853
|
+
className: `${CLASSNAME$R}__content`
|
|
10586
9854
|
}, label && /*#__PURE__*/React.createElement(InputLabel, {
|
|
10587
9855
|
htmlFor: inputId,
|
|
10588
9856
|
theme: theme,
|
|
10589
|
-
className: `${CLASSNAME$
|
|
9857
|
+
className: `${CLASSNAME$R}__label`
|
|
10590
9858
|
}, label), helper && /*#__PURE__*/React.createElement(InputHelper, {
|
|
10591
9859
|
id: `${inputId}-helper`,
|
|
10592
9860
|
theme: theme,
|
|
10593
|
-
className: `${CLASSNAME$
|
|
9861
|
+
className: `${CLASSNAME$R}__helper`
|
|
10594
9862
|
}, helper)));
|
|
10595
9863
|
});
|
|
10596
|
-
RadioButton.displayName = COMPONENT_NAME$
|
|
10597
|
-
RadioButton.className = CLASSNAME$
|
|
9864
|
+
RadioButton.displayName = COMPONENT_NAME$U;
|
|
9865
|
+
RadioButton.className = CLASSNAME$R;
|
|
10598
9866
|
RadioButton.defaultProps = DEFAULT_PROPS$G;
|
|
10599
9867
|
|
|
10600
|
-
const _excluded$
|
|
9868
|
+
const _excluded$X = ["children", "className"];
|
|
10601
9869
|
|
|
10602
9870
|
/**
|
|
10603
9871
|
* Defines the props of the component.
|
|
@@ -10606,12 +9874,12 @@ const _excluded$_ = ["children", "className"];
|
|
|
10606
9874
|
/**
|
|
10607
9875
|
* Component display name.
|
|
10608
9876
|
*/
|
|
10609
|
-
const COMPONENT_NAME$
|
|
9877
|
+
const COMPONENT_NAME$V = 'RadioGroup';
|
|
10610
9878
|
|
|
10611
9879
|
/**
|
|
10612
9880
|
* Component default class name and class prefix.
|
|
10613
9881
|
*/
|
|
10614
|
-
const CLASSNAME$
|
|
9882
|
+
const CLASSNAME$S = getRootClassName(COMPONENT_NAME$V);
|
|
10615
9883
|
|
|
10616
9884
|
/**
|
|
10617
9885
|
* RadioGroup component.
|
|
@@ -10625,17 +9893,17 @@ const RadioGroup = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10625
9893
|
children,
|
|
10626
9894
|
className
|
|
10627
9895
|
} = props,
|
|
10628
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
9896
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$X);
|
|
10629
9897
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
10630
9898
|
ref: ref
|
|
10631
9899
|
}, forwardedProps, {
|
|
10632
9900
|
className: classnames(className, handleBasicClasses({
|
|
10633
|
-
prefix: CLASSNAME$
|
|
9901
|
+
prefix: CLASSNAME$S
|
|
10634
9902
|
}))
|
|
10635
9903
|
}), children);
|
|
10636
9904
|
});
|
|
10637
|
-
RadioGroup.displayName = COMPONENT_NAME$
|
|
10638
|
-
RadioGroup.className = CLASSNAME$
|
|
9905
|
+
RadioGroup.displayName = COMPONENT_NAME$V;
|
|
9906
|
+
RadioGroup.className = CLASSNAME$S;
|
|
10639
9907
|
|
|
10640
9908
|
/**
|
|
10641
9909
|
* Listen on element focus to store the focus status.
|
|
@@ -10669,13 +9937,13 @@ const SelectVariant = {
|
|
|
10669
9937
|
chip: 'chip'
|
|
10670
9938
|
};
|
|
10671
9939
|
|
|
10672
|
-
const _excluded
|
|
9940
|
+
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"];
|
|
10673
9941
|
|
|
10674
9942
|
/** The display name of the component. */
|
|
10675
|
-
const COMPONENT_NAME$
|
|
9943
|
+
const COMPONENT_NAME$W = 'Select';
|
|
10676
9944
|
|
|
10677
9945
|
/** The default class name and classes prefix for this component. */
|
|
10678
|
-
const CLASSNAME$
|
|
9946
|
+
const CLASSNAME$T = getRootClassName(COMPONENT_NAME$W);
|
|
10679
9947
|
|
|
10680
9948
|
/** The default value of props. */
|
|
10681
9949
|
const DEFAULT_PROPS$H = {
|
|
@@ -10709,7 +9977,7 @@ const WithSelectContext = (SelectElement, _ref, ref) => {
|
|
|
10709
9977
|
value,
|
|
10710
9978
|
variant = DEFAULT_PROPS$H.variant
|
|
10711
9979
|
} = _ref,
|
|
10712
|
-
forwardedProps = _objectWithoutProperties(_ref, _excluded
|
|
9980
|
+
forwardedProps = _objectWithoutProperties(_ref, _excluded$Y);
|
|
10713
9981
|
const selectId = useMemo(() => id || `select-${uid()}`, [id]);
|
|
10714
9982
|
const anchorRef = useRef(null);
|
|
10715
9983
|
const selectRef = useRef(null);
|
|
@@ -10743,7 +10011,7 @@ const WithSelectContext = (SelectElement, _ref, ref) => {
|
|
|
10743
10011
|
isFocus,
|
|
10744
10012
|
isOpen,
|
|
10745
10013
|
isValid,
|
|
10746
|
-
prefix: CLASSNAME$
|
|
10014
|
+
prefix: CLASSNAME$T,
|
|
10747
10015
|
theme: theme === Theme.light ? Theme.light : Theme.dark
|
|
10748
10016
|
}))
|
|
10749
10017
|
}, /*#__PURE__*/React.createElement(SelectElement, _extends({}, forwardedProps, {
|
|
@@ -10774,22 +10042,22 @@ const WithSelectContext = (SelectElement, _ref, ref) => {
|
|
|
10774
10042
|
onInfiniteScroll: onInfiniteScroll,
|
|
10775
10043
|
ref: dropdownRef
|
|
10776
10044
|
}, children), hasError && error && /*#__PURE__*/React.createElement(InputHelper, {
|
|
10777
|
-
className: `${CLASSNAME$
|
|
10045
|
+
className: `${CLASSNAME$T}__helper`,
|
|
10778
10046
|
kind: Kind.error,
|
|
10779
10047
|
theme: theme
|
|
10780
10048
|
}, error), helper && /*#__PURE__*/React.createElement(InputHelper, {
|
|
10781
|
-
className: `${CLASSNAME$
|
|
10049
|
+
className: `${CLASSNAME$T}__helper`,
|
|
10782
10050
|
theme: theme
|
|
10783
10051
|
}, helper));
|
|
10784
10052
|
};
|
|
10785
10053
|
|
|
10786
|
-
const _excluded$
|
|
10054
|
+
const _excluded$Z = ["anchorRef", "clearButtonProps", "handleKeyboardNav", "hasError", "hasInputClear", "icon", "id", "isDisabled", "isEmpty", "isRequired", "isValid", "label", "onClear", "onInputClick", "placeholder", "selectedValueRender", "theme", "value", "variant", "selectElementRef"];
|
|
10787
10055
|
|
|
10788
10056
|
/** The display name of the component. */
|
|
10789
|
-
const COMPONENT_NAME$
|
|
10057
|
+
const COMPONENT_NAME$X = 'Select';
|
|
10790
10058
|
|
|
10791
10059
|
/** The default class name and classes prefix for this component. */
|
|
10792
|
-
const CLASSNAME$
|
|
10060
|
+
const CLASSNAME$U = getRootClassName(COMPONENT_NAME$X);
|
|
10793
10061
|
|
|
10794
10062
|
/** The default value of props. */
|
|
10795
10063
|
const DEFAULT_PROPS$I = {
|
|
@@ -10823,36 +10091,36 @@ const SelectField = _ref => {
|
|
|
10823
10091
|
variant,
|
|
10824
10092
|
selectElementRef
|
|
10825
10093
|
} = _ref,
|
|
10826
|
-
forwardedProps = _objectWithoutProperties(_ref, _excluded$
|
|
10094
|
+
forwardedProps = _objectWithoutProperties(_ref, _excluded$Z);
|
|
10827
10095
|
return /*#__PURE__*/React.createElement(React.Fragment, null, variant === SelectVariant.input && /*#__PURE__*/React.createElement(React.Fragment, null, label && /*#__PURE__*/React.createElement("div", {
|
|
10828
|
-
className: `${CLASSNAME$
|
|
10096
|
+
className: `${CLASSNAME$U}__header`
|
|
10829
10097
|
}, /*#__PURE__*/React.createElement(InputLabel, {
|
|
10830
10098
|
htmlFor: id,
|
|
10831
|
-
className: `${CLASSNAME$
|
|
10099
|
+
className: `${CLASSNAME$U}__label`,
|
|
10832
10100
|
isRequired: isRequired,
|
|
10833
10101
|
theme: theme
|
|
10834
10102
|
}, label)), /*#__PURE__*/React.createElement("div", _extends({
|
|
10835
10103
|
ref: mergeRefs(anchorRef, selectElementRef),
|
|
10836
10104
|
id: id,
|
|
10837
|
-
className: `${CLASSNAME$
|
|
10105
|
+
className: `${CLASSNAME$U}__wrapper`,
|
|
10838
10106
|
onClick: onInputClick,
|
|
10839
10107
|
onKeyDown: handleKeyboardNav,
|
|
10840
10108
|
tabIndex: isDisabled ? undefined : 0,
|
|
10841
10109
|
"aria-disabled": isDisabled || undefined
|
|
10842
10110
|
}, forwardedProps), icon && /*#__PURE__*/React.createElement(Icon, {
|
|
10843
|
-
className: `${CLASSNAME$
|
|
10111
|
+
className: `${CLASSNAME$U}__input-icon`,
|
|
10844
10112
|
color: theme === Theme.dark ? 'light' : undefined,
|
|
10845
10113
|
icon: icon,
|
|
10846
10114
|
size: Size.xs
|
|
10847
10115
|
}), /*#__PURE__*/React.createElement("div", {
|
|
10848
|
-
className: classnames([`${CLASSNAME$
|
|
10116
|
+
className: classnames([`${CLASSNAME$U}__input-native`, isEmpty && placeholder && `${CLASSNAME$U}__input-native--placeholder`])
|
|
10849
10117
|
}, !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", {
|
|
10850
|
-
className: `${CLASSNAME$
|
|
10118
|
+
className: `${CLASSNAME$U}__input-validity`
|
|
10851
10119
|
}, /*#__PURE__*/React.createElement(Icon, {
|
|
10852
10120
|
icon: isValid ? mdiCheckCircle : mdiAlertCircle,
|
|
10853
10121
|
size: Size.xxs
|
|
10854
10122
|
})), hasInputClear && clearButtonProps && /*#__PURE__*/React.createElement(IconButton, _extends({}, clearButtonProps, {
|
|
10855
|
-
className: `${CLASSNAME$
|
|
10123
|
+
className: `${CLASSNAME$U}__input-clear`,
|
|
10856
10124
|
icon: mdiCloseCircle,
|
|
10857
10125
|
emphasis: Emphasis.low,
|
|
10858
10126
|
size: Size.s,
|
|
@@ -10860,7 +10128,7 @@ const SelectField = _ref => {
|
|
|
10860
10128
|
onClick: onClear,
|
|
10861
10129
|
onKeyDown: stopPropagation
|
|
10862
10130
|
})), /*#__PURE__*/React.createElement("div", {
|
|
10863
|
-
className: `${CLASSNAME$
|
|
10131
|
+
className: `${CLASSNAME$U}__input-indicator`
|
|
10864
10132
|
}, /*#__PURE__*/React.createElement(Icon, {
|
|
10865
10133
|
icon: mdiMenuDown,
|
|
10866
10134
|
size: Size.s
|
|
@@ -10892,26 +10160,26 @@ const Select = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
10892
10160
|
className: classnames(props.className, handleBasicClasses({
|
|
10893
10161
|
hasInputClear,
|
|
10894
10162
|
hasUnique: !props.isEmpty,
|
|
10895
|
-
prefix: CLASSNAME$
|
|
10163
|
+
prefix: CLASSNAME$U
|
|
10896
10164
|
})),
|
|
10897
10165
|
hasInputClear,
|
|
10898
10166
|
isEmpty: isEmpty$1
|
|
10899
10167
|
}), ref);
|
|
10900
10168
|
});
|
|
10901
|
-
Select.displayName = COMPONENT_NAME$
|
|
10902
|
-
Select.className = CLASSNAME$
|
|
10169
|
+
Select.displayName = COMPONENT_NAME$X;
|
|
10170
|
+
Select.className = CLASSNAME$U;
|
|
10903
10171
|
Select.defaultProps = DEFAULT_PROPS$I;
|
|
10904
|
-
Select.className = CLASSNAME$
|
|
10172
|
+
Select.className = CLASSNAME$U;
|
|
10905
10173
|
|
|
10906
|
-
const _excluded$
|
|
10174
|
+
const _excluded$_ = ["anchorRef", "handleKeyboardNav", "hasError", "icon", "id", "isDisabled", "isEmpty", "isRequired", "isValid", "label", "onClear", "onInputClick", "placeholder", "selectedChipRender", "selectedValueRender", "theme", "value", "variant", "selectElementRef"];
|
|
10907
10175
|
|
|
10908
10176
|
/** Defines the props of the component. */
|
|
10909
10177
|
|
|
10910
10178
|
/** The display name of the component. */
|
|
10911
|
-
const COMPONENT_NAME$
|
|
10179
|
+
const COMPONENT_NAME$Y = 'Select';
|
|
10912
10180
|
|
|
10913
10181
|
/** The default class name and classes prefix for this component. */
|
|
10914
|
-
const CLASSNAME$
|
|
10182
|
+
const CLASSNAME$V = getRootClassName(COMPONENT_NAME$Y);
|
|
10915
10183
|
|
|
10916
10184
|
/** The default value of props. */
|
|
10917
10185
|
const DEFAULT_PROPS$J = {
|
|
@@ -10954,38 +10222,38 @@ const SelectMultipleField = _ref => {
|
|
|
10954
10222
|
variant,
|
|
10955
10223
|
selectElementRef
|
|
10956
10224
|
} = _ref,
|
|
10957
|
-
forwardedProps = _objectWithoutProperties(_ref, _excluded$
|
|
10225
|
+
forwardedProps = _objectWithoutProperties(_ref, _excluded$_);
|
|
10958
10226
|
return /*#__PURE__*/React.createElement(React.Fragment, null, variant === SelectVariant.input && /*#__PURE__*/React.createElement(React.Fragment, null, label && /*#__PURE__*/React.createElement("div", {
|
|
10959
|
-
className: `${CLASSNAME$
|
|
10227
|
+
className: `${CLASSNAME$V}__header`
|
|
10960
10228
|
}, /*#__PURE__*/React.createElement(InputLabel, {
|
|
10961
10229
|
htmlFor: id,
|
|
10962
|
-
className: `${CLASSNAME$
|
|
10230
|
+
className: `${CLASSNAME$V}__label`,
|
|
10963
10231
|
isRequired: isRequired,
|
|
10964
10232
|
theme: theme
|
|
10965
10233
|
}, label)), /*#__PURE__*/React.createElement("div", _extends({
|
|
10966
10234
|
ref: mergeRefs(anchorRef, selectElementRef),
|
|
10967
10235
|
id: id,
|
|
10968
|
-
className: `${CLASSNAME$
|
|
10236
|
+
className: `${CLASSNAME$V}__wrapper`,
|
|
10969
10237
|
onClick: onInputClick,
|
|
10970
10238
|
onKeyDown: handleKeyboardNav,
|
|
10971
10239
|
tabIndex: isDisabled ? undefined : 0,
|
|
10972
10240
|
"aria-disabled": isDisabled || undefined
|
|
10973
10241
|
}, forwardedProps), icon && /*#__PURE__*/React.createElement(Icon, {
|
|
10974
|
-
className: `${CLASSNAME$
|
|
10242
|
+
className: `${CLASSNAME$V}__input-icon`,
|
|
10975
10243
|
color: theme === Theme.dark ? 'light' : undefined,
|
|
10976
10244
|
icon: icon,
|
|
10977
10245
|
size: Size.xs
|
|
10978
10246
|
}), /*#__PURE__*/React.createElement("div", {
|
|
10979
|
-
className: `${CLASSNAME$
|
|
10247
|
+
className: `${CLASSNAME$V}__chips`
|
|
10980
10248
|
}, !isEmpty && value.map((val, index) => selectedChipRender === null || selectedChipRender === void 0 ? void 0 : selectedChipRender(val, index, onClear, isDisabled, theme))), isEmpty && placeholder && /*#__PURE__*/React.createElement("div", {
|
|
10981
|
-
className: classnames([`${CLASSNAME$
|
|
10249
|
+
className: classnames([`${CLASSNAME$V}__input-native`, `${CLASSNAME$V}__input-native--placeholder`])
|
|
10982
10250
|
}, /*#__PURE__*/React.createElement("span", null, placeholder)), (isValid || hasError) && /*#__PURE__*/React.createElement("div", {
|
|
10983
|
-
className: `${CLASSNAME$
|
|
10251
|
+
className: `${CLASSNAME$V}__input-validity`
|
|
10984
10252
|
}, /*#__PURE__*/React.createElement(Icon, {
|
|
10985
10253
|
icon: isValid ? mdiCheckCircle : mdiAlertCircle,
|
|
10986
10254
|
size: Size.xxs
|
|
10987
10255
|
})), /*#__PURE__*/React.createElement("div", {
|
|
10988
|
-
className: `${CLASSNAME$
|
|
10256
|
+
className: `${CLASSNAME$V}__input-indicator`
|
|
10989
10257
|
}, /*#__PURE__*/React.createElement(Icon, {
|
|
10990
10258
|
icon: mdiMenuDown,
|
|
10991
10259
|
size: Size.s
|
|
@@ -11014,17 +10282,17 @@ const SelectMultiple = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11014
10282
|
return WithSelectContext(SelectMultipleField, _objectSpread2(_objectSpread2({}, props), {}, {
|
|
11015
10283
|
className: classnames(props.className, handleBasicClasses({
|
|
11016
10284
|
hasMultiple: !props.isEmpty,
|
|
11017
|
-
prefix: CLASSNAME$
|
|
10285
|
+
prefix: CLASSNAME$V
|
|
11018
10286
|
})),
|
|
11019
10287
|
isEmpty: props.value.length === 0,
|
|
11020
10288
|
isMultiple: true
|
|
11021
10289
|
}), ref);
|
|
11022
10290
|
});
|
|
11023
|
-
SelectMultiple.displayName = COMPONENT_NAME$
|
|
11024
|
-
SelectMultiple.className = CLASSNAME$
|
|
10291
|
+
SelectMultiple.displayName = COMPONENT_NAME$Y;
|
|
10292
|
+
SelectMultiple.className = CLASSNAME$V;
|
|
11025
10293
|
SelectMultiple.defaultProps = DEFAULT_PROPS$J;
|
|
11026
10294
|
|
|
11027
|
-
const _excluded
|
|
10295
|
+
const _excluded$$ = ["children", "className", "theme"];
|
|
11028
10296
|
|
|
11029
10297
|
/**
|
|
11030
10298
|
* Defines the props of the component.
|
|
@@ -11033,12 +10301,12 @@ const _excluded$12 = ["children", "className", "theme"];
|
|
|
11033
10301
|
/**
|
|
11034
10302
|
* Component display name.
|
|
11035
10303
|
*/
|
|
11036
|
-
const COMPONENT_NAME$
|
|
10304
|
+
const COMPONENT_NAME$Z = 'SideNavigation';
|
|
11037
10305
|
|
|
11038
10306
|
/**
|
|
11039
10307
|
* Component default class name and class prefix.
|
|
11040
10308
|
*/
|
|
11041
|
-
const CLASSNAME$
|
|
10309
|
+
const CLASSNAME$W = getRootClassName(COMPONENT_NAME$Z);
|
|
11042
10310
|
|
|
11043
10311
|
/**
|
|
11044
10312
|
* SideNavigation component.
|
|
@@ -11053,20 +10321,20 @@ const SideNavigation = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11053
10321
|
className,
|
|
11054
10322
|
theme
|
|
11055
10323
|
} = props,
|
|
11056
|
-
forwardedProps = _objectWithoutProperties(props, _excluded
|
|
10324
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$$);
|
|
11057
10325
|
const content = Children.toArray(children).filter(isComponent(SideNavigationItem));
|
|
11058
10326
|
return /*#__PURE__*/React.createElement("ul", _extends({
|
|
11059
10327
|
ref: ref
|
|
11060
10328
|
}, forwardedProps, {
|
|
11061
10329
|
className: classnames(className, theme === Theme.dark && 'lumx-color-font-light-N', handleBasicClasses({
|
|
11062
|
-
prefix: CLASSNAME$
|
|
10330
|
+
prefix: CLASSNAME$W
|
|
11063
10331
|
}))
|
|
11064
10332
|
}), content);
|
|
11065
10333
|
});
|
|
11066
|
-
SideNavigation.displayName = COMPONENT_NAME$
|
|
11067
|
-
SideNavigation.className = CLASSNAME$
|
|
10334
|
+
SideNavigation.displayName = COMPONENT_NAME$Z;
|
|
10335
|
+
SideNavigation.className = CLASSNAME$W;
|
|
11068
10336
|
|
|
11069
|
-
const _excluded$
|
|
10337
|
+
const _excluded$10 = ["linkAs", "href"];
|
|
11070
10338
|
/**
|
|
11071
10339
|
* Render <button> HTML component, fallbacks to `<a>` when a `href` is provided or a custom component with `linkAs`.
|
|
11072
10340
|
*/
|
|
@@ -11075,7 +10343,7 @@ const renderButtonOrLink = function (props) {
|
|
|
11075
10343
|
linkAs,
|
|
11076
10344
|
href
|
|
11077
10345
|
} = props,
|
|
11078
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
10346
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$10);
|
|
11079
10347
|
for (var _len = arguments.length, children = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
|
|
11080
10348
|
children[_key - 1] = arguments[_key];
|
|
11081
10349
|
}
|
|
@@ -11085,7 +10353,7 @@ const renderButtonOrLink = function (props) {
|
|
|
11085
10353
|
}, forwardedProps), ...children);
|
|
11086
10354
|
};
|
|
11087
10355
|
|
|
11088
|
-
const _excluded$
|
|
10356
|
+
const _excluded$11 = ["children", "className", "emphasis", "icon", "isOpen", "isSelected", "label", "linkAs", "linkProps", "onActionClick", "onClick", "toggleButtonProps", "closeMode"];
|
|
11089
10357
|
|
|
11090
10358
|
/**
|
|
11091
10359
|
* Defines the props of the component.
|
|
@@ -11094,12 +10362,12 @@ const _excluded$14 = ["children", "className", "emphasis", "icon", "isOpen", "is
|
|
|
11094
10362
|
/**
|
|
11095
10363
|
* Component display name.
|
|
11096
10364
|
*/
|
|
11097
|
-
const COMPONENT_NAME
|
|
10365
|
+
const COMPONENT_NAME$_ = 'SideNavigationItem';
|
|
11098
10366
|
|
|
11099
10367
|
/**
|
|
11100
10368
|
* Component default class name and class prefix.
|
|
11101
10369
|
*/
|
|
11102
|
-
const CLASSNAME$
|
|
10370
|
+
const CLASSNAME$X = getRootClassName(COMPONENT_NAME$_);
|
|
11103
10371
|
|
|
11104
10372
|
/**
|
|
11105
10373
|
* Component default props.
|
|
@@ -11132,7 +10400,7 @@ const SideNavigationItem = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11132
10400
|
toggleButtonProps,
|
|
11133
10401
|
closeMode = 'unmount'
|
|
11134
10402
|
} = props,
|
|
11135
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
10403
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$11);
|
|
11136
10404
|
const content = children && Children.toArray(children).filter(isComponent(SideNavigationItem));
|
|
11137
10405
|
const hasContent = !isEmpty(content);
|
|
11138
10406
|
const shouldSplitActions = Boolean(onActionClick);
|
|
@@ -11151,22 +10419,22 @@ const SideNavigationItem = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11151
10419
|
emphasis,
|
|
11152
10420
|
isOpen: showChildren,
|
|
11153
10421
|
isSelected,
|
|
11154
|
-
prefix: CLASSNAME$
|
|
10422
|
+
prefix: CLASSNAME$X
|
|
11155
10423
|
}))
|
|
11156
10424
|
}), shouldSplitActions ? /*#__PURE__*/React.createElement("div", {
|
|
11157
|
-
className: `${CLASSNAME$
|
|
10425
|
+
className: `${CLASSNAME$X}__wrapper`
|
|
11158
10426
|
}, renderLink(_objectSpread2(_objectSpread2({
|
|
11159
10427
|
linkAs
|
|
11160
10428
|
}, linkProps), {}, {
|
|
11161
|
-
className: `${CLASSNAME$
|
|
10429
|
+
className: `${CLASSNAME$X}__link`,
|
|
11162
10430
|
onClick,
|
|
11163
10431
|
tabIndex: 0
|
|
11164
10432
|
}), icon && /*#__PURE__*/React.createElement(Icon, {
|
|
11165
|
-
className: `${CLASSNAME$
|
|
10433
|
+
className: `${CLASSNAME$X}__icon`,
|
|
11166
10434
|
icon: icon,
|
|
11167
10435
|
size: Size.xs
|
|
11168
10436
|
}), /*#__PURE__*/React.createElement("span", null, label)), /*#__PURE__*/React.createElement(IconButton, _extends({}, toggleButtonProps, {
|
|
11169
|
-
className: `${CLASSNAME$
|
|
10437
|
+
className: `${CLASSNAME$X}__toggle`,
|
|
11170
10438
|
icon: isOpen ? mdiChevronUp : mdiChevronDown,
|
|
11171
10439
|
size: Size.m,
|
|
11172
10440
|
emphasis: Emphasis.low,
|
|
@@ -11174,27 +10442,27 @@ const SideNavigationItem = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11174
10442
|
}, ariaProps))) : renderButtonOrLink(_objectSpread2(_objectSpread2({
|
|
11175
10443
|
linkAs
|
|
11176
10444
|
}, linkProps), {}, {
|
|
11177
|
-
className: `${CLASSNAME$
|
|
10445
|
+
className: `${CLASSNAME$X}__link`,
|
|
11178
10446
|
tabIndex: 0,
|
|
11179
10447
|
onClick
|
|
11180
10448
|
}, ariaProps), icon && /*#__PURE__*/React.createElement(Icon, {
|
|
11181
|
-
className: `${CLASSNAME$
|
|
10449
|
+
className: `${CLASSNAME$X}__icon`,
|
|
11182
10450
|
icon: icon,
|
|
11183
10451
|
size: Size.xs
|
|
11184
10452
|
}), /*#__PURE__*/React.createElement("span", null, label), hasContent && /*#__PURE__*/React.createElement(Icon, {
|
|
11185
|
-
className: `${CLASSNAME$
|
|
10453
|
+
className: `${CLASSNAME$X}__chevron`,
|
|
11186
10454
|
icon: isOpen ? mdiChevronUp : mdiChevronDown,
|
|
11187
10455
|
size: Size.xs
|
|
11188
10456
|
})), (closeMode === 'hide' || showChildren) && /*#__PURE__*/React.createElement("ul", {
|
|
11189
|
-
className: `${CLASSNAME$
|
|
10457
|
+
className: `${CLASSNAME$X}__children`,
|
|
11190
10458
|
id: contentId
|
|
11191
10459
|
}, content));
|
|
11192
10460
|
});
|
|
11193
|
-
SideNavigationItem.displayName = COMPONENT_NAME
|
|
11194
|
-
SideNavigationItem.className = CLASSNAME$
|
|
10461
|
+
SideNavigationItem.displayName = COMPONENT_NAME$_;
|
|
10462
|
+
SideNavigationItem.className = CLASSNAME$X;
|
|
11195
10463
|
SideNavigationItem.defaultProps = DEFAULT_PROPS$K;
|
|
11196
10464
|
|
|
11197
|
-
const _excluded$
|
|
10465
|
+
const _excluded$12 = ["className", "size", "color", "theme"];
|
|
11198
10466
|
|
|
11199
10467
|
/**
|
|
11200
10468
|
* Defines the props of the component.
|
|
@@ -11207,12 +10475,12 @@ const DEFAULT_PROPS$L = {
|
|
|
11207
10475
|
/**
|
|
11208
10476
|
* Component display name.
|
|
11209
10477
|
*/
|
|
11210
|
-
const COMPONENT_NAME
|
|
10478
|
+
const COMPONENT_NAME$$ = 'SkeletonCircle';
|
|
11211
10479
|
|
|
11212
10480
|
/**
|
|
11213
10481
|
* Component default class name and class prefix.
|
|
11214
10482
|
*/
|
|
11215
|
-
const CLASSNAME$
|
|
10483
|
+
const CLASSNAME$Y = getRootClassName(COMPONENT_NAME$$);
|
|
11216
10484
|
|
|
11217
10485
|
/**
|
|
11218
10486
|
* SkeletonCircle component.
|
|
@@ -11228,23 +10496,23 @@ const SkeletonCircle = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11228
10496
|
color,
|
|
11229
10497
|
theme
|
|
11230
10498
|
} = props,
|
|
11231
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
10499
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$12);
|
|
11232
10500
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
11233
10501
|
ref: ref
|
|
11234
10502
|
}, forwardedProps, {
|
|
11235
10503
|
className: classnames(className, handleBasicClasses({
|
|
11236
|
-
prefix: CLASSNAME$
|
|
10504
|
+
prefix: CLASSNAME$Y,
|
|
11237
10505
|
size,
|
|
11238
10506
|
color,
|
|
11239
10507
|
theme
|
|
11240
10508
|
}))
|
|
11241
10509
|
}));
|
|
11242
10510
|
});
|
|
11243
|
-
SkeletonCircle.displayName = COMPONENT_NAME
|
|
10511
|
+
SkeletonCircle.displayName = COMPONENT_NAME$$;
|
|
11244
10512
|
SkeletonCircle.defaultProps = DEFAULT_PROPS$L;
|
|
11245
|
-
SkeletonCircle.className = CLASSNAME$
|
|
10513
|
+
SkeletonCircle.className = CLASSNAME$Y;
|
|
11246
10514
|
|
|
11247
|
-
const _excluded$
|
|
10515
|
+
const _excluded$13 = ["aspectRatio", "className", "height", "theme", "variant", "width", "color"];
|
|
11248
10516
|
|
|
11249
10517
|
/**
|
|
11250
10518
|
* Skeleton variants.
|
|
@@ -11267,12 +10535,12 @@ const DEFAULT_PROPS$M = {
|
|
|
11267
10535
|
/**
|
|
11268
10536
|
* Component display name.
|
|
11269
10537
|
*/
|
|
11270
|
-
const COMPONENT_NAME$
|
|
10538
|
+
const COMPONENT_NAME$10 = 'SkeletonRectangle';
|
|
11271
10539
|
|
|
11272
10540
|
/**
|
|
11273
10541
|
* Component default class name and class prefix.
|
|
11274
10542
|
*/
|
|
11275
|
-
const CLASSNAME$
|
|
10543
|
+
const CLASSNAME$Z = getRootClassName(COMPONENT_NAME$10);
|
|
11276
10544
|
|
|
11277
10545
|
/**
|
|
11278
10546
|
* SkeletonRectangle component.
|
|
@@ -11291,12 +10559,12 @@ const SkeletonRectangle = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11291
10559
|
width,
|
|
11292
10560
|
color
|
|
11293
10561
|
} = props,
|
|
11294
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
10562
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$13);
|
|
11295
10563
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
11296
10564
|
ref: ref
|
|
11297
10565
|
}, forwardedProps, {
|
|
11298
10566
|
className: classnames(className, handleBasicClasses({
|
|
11299
|
-
prefix: CLASSNAME$
|
|
10567
|
+
prefix: CLASSNAME$Z,
|
|
11300
10568
|
aspectRatio,
|
|
11301
10569
|
height: aspectRatio ? undefined : height,
|
|
11302
10570
|
theme,
|
|
@@ -11305,14 +10573,14 @@ const SkeletonRectangle = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11305
10573
|
color
|
|
11306
10574
|
}))
|
|
11307
10575
|
}), /*#__PURE__*/React.createElement("div", {
|
|
11308
|
-
className: `${CLASSNAME$
|
|
10576
|
+
className: `${CLASSNAME$Z}__inner`
|
|
11309
10577
|
}));
|
|
11310
10578
|
});
|
|
11311
|
-
SkeletonRectangle.displayName = COMPONENT_NAME$
|
|
11312
|
-
SkeletonRectangle.className = CLASSNAME$
|
|
10579
|
+
SkeletonRectangle.displayName = COMPONENT_NAME$10;
|
|
10580
|
+
SkeletonRectangle.className = CLASSNAME$Z;
|
|
11313
10581
|
SkeletonRectangle.defaultProps = DEFAULT_PROPS$M;
|
|
11314
10582
|
|
|
11315
|
-
const _excluded$
|
|
10583
|
+
const _excluded$14 = ["className", "theme", "typography", "width", "color"];
|
|
11316
10584
|
|
|
11317
10585
|
/**
|
|
11318
10586
|
* Defines the props of the component.
|
|
@@ -11325,12 +10593,12 @@ const DEFAULT_PROPS$N = {
|
|
|
11325
10593
|
/**
|
|
11326
10594
|
* Component display name.
|
|
11327
10595
|
*/
|
|
11328
|
-
const COMPONENT_NAME$
|
|
10596
|
+
const COMPONENT_NAME$11 = 'SkeletonTypography';
|
|
11329
10597
|
|
|
11330
10598
|
/**
|
|
11331
10599
|
* Component default class name and class prefix.
|
|
11332
10600
|
*/
|
|
11333
|
-
const CLASSNAME
|
|
10601
|
+
const CLASSNAME$_ = getRootClassName(COMPONENT_NAME$11);
|
|
11334
10602
|
|
|
11335
10603
|
/**
|
|
11336
10604
|
* SkeletonTypography component.
|
|
@@ -11347,12 +10615,12 @@ const SkeletonTypography = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11347
10615
|
width,
|
|
11348
10616
|
color
|
|
11349
10617
|
} = props,
|
|
11350
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
10618
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$14);
|
|
11351
10619
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
11352
10620
|
ref: ref
|
|
11353
10621
|
}, forwardedProps, {
|
|
11354
10622
|
className: classnames(className, handleBasicClasses({
|
|
11355
|
-
prefix: CLASSNAME
|
|
10623
|
+
prefix: CLASSNAME$_,
|
|
11356
10624
|
theme,
|
|
11357
10625
|
typography,
|
|
11358
10626
|
color
|
|
@@ -11361,12 +10629,12 @@ const SkeletonTypography = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11361
10629
|
width
|
|
11362
10630
|
})
|
|
11363
10631
|
}), /*#__PURE__*/React.createElement("div", {
|
|
11364
|
-
className: `${CLASSNAME
|
|
10632
|
+
className: `${CLASSNAME$_}__inner`
|
|
11365
10633
|
}));
|
|
11366
10634
|
});
|
|
11367
|
-
SkeletonTypography.displayName = COMPONENT_NAME$
|
|
10635
|
+
SkeletonTypography.displayName = COMPONENT_NAME$11;
|
|
11368
10636
|
SkeletonTypography.defaultProps = DEFAULT_PROPS$N;
|
|
11369
|
-
SkeletonTypography.className = CLASSNAME
|
|
10637
|
+
SkeletonTypography.className = CLASSNAME$_;
|
|
11370
10638
|
|
|
11371
10639
|
const useEnhancedEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;
|
|
11372
10640
|
|
|
@@ -11402,7 +10670,7 @@ const clamp = (value, min, max) => {
|
|
|
11402
10670
|
return value;
|
|
11403
10671
|
};
|
|
11404
10672
|
|
|
11405
|
-
const _excluded$
|
|
10673
|
+
const _excluded$15 = ["className", "disabled", "helper", "hideMinMaxLabel", "id", "isDisabled", "label", "max", "min", "name", "onChange", "onMouseDown", "precision", "steps", "theme", "value"];
|
|
11406
10674
|
|
|
11407
10675
|
/**
|
|
11408
10676
|
* Defines the props of the component.
|
|
@@ -11411,12 +10679,12 @@ const _excluded$18 = ["className", "disabled", "helper", "hideMinMaxLabel", "id"
|
|
|
11411
10679
|
/**
|
|
11412
10680
|
* Component display name.
|
|
11413
10681
|
*/
|
|
11414
|
-
const COMPONENT_NAME$
|
|
10682
|
+
const COMPONENT_NAME$12 = 'Slider';
|
|
11415
10683
|
|
|
11416
10684
|
/**
|
|
11417
10685
|
* Component default class name and class prefix.
|
|
11418
10686
|
*/
|
|
11419
|
-
const CLASSNAME
|
|
10687
|
+
const CLASSNAME$$ = getRootClassName(COMPONENT_NAME$12);
|
|
11420
10688
|
|
|
11421
10689
|
/**
|
|
11422
10690
|
* Component default props.
|
|
@@ -11477,7 +10745,7 @@ const Slider = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11477
10745
|
theme,
|
|
11478
10746
|
value
|
|
11479
10747
|
} = props,
|
|
11480
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
10748
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$15);
|
|
11481
10749
|
const sliderId = useMemo(() => id || `slider-${uid()}`, [id]);
|
|
11482
10750
|
const sliderLabelId = useMemo(() => `label-${sliderId}`, [sliderId]);
|
|
11483
10751
|
const sliderRef = useRef(null);
|
|
@@ -11610,7 +10878,7 @@ const Slider = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11610
10878
|
ref: ref
|
|
11611
10879
|
}, forwardedProps, {
|
|
11612
10880
|
className: classnames(className, handleBasicClasses({
|
|
11613
|
-
prefix: CLASSNAME
|
|
10881
|
+
prefix: CLASSNAME$$,
|
|
11614
10882
|
theme,
|
|
11615
10883
|
hasLabel: Boolean(label)
|
|
11616
10884
|
})),
|
|
@@ -11619,30 +10887,30 @@ const Slider = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11619
10887
|
}), label && /*#__PURE__*/React.createElement(InputLabel, {
|
|
11620
10888
|
id: sliderLabelId,
|
|
11621
10889
|
htmlFor: sliderId,
|
|
11622
|
-
className: `${CLASSNAME
|
|
10890
|
+
className: `${CLASSNAME$$}__label`,
|
|
11623
10891
|
theme: theme
|
|
11624
10892
|
}, label), helper && /*#__PURE__*/React.createElement(InputHelper, {
|
|
11625
|
-
className: `${CLASSNAME
|
|
10893
|
+
className: `${CLASSNAME$$}__helper`,
|
|
11626
10894
|
theme: theme
|
|
11627
10895
|
}, helper), /*#__PURE__*/React.createElement("div", {
|
|
11628
|
-
className: `${CLASSNAME
|
|
10896
|
+
className: `${CLASSNAME$$}__ui-wrapper`
|
|
11629
10897
|
}, !hideMinMaxLabel && /*#__PURE__*/React.createElement("span", {
|
|
11630
|
-
className: `${CLASSNAME
|
|
10898
|
+
className: `${CLASSNAME$$}__value-label ${CLASSNAME$$}__value-label--min`
|
|
11631
10899
|
}, min), /*#__PURE__*/React.createElement("div", {
|
|
11632
|
-
className: `${CLASSNAME
|
|
10900
|
+
className: `${CLASSNAME$$}__wrapper`,
|
|
11633
10901
|
ref: sliderRef
|
|
11634
10902
|
}, /*#__PURE__*/React.createElement("div", {
|
|
11635
|
-
className: `${CLASSNAME
|
|
10903
|
+
className: `${CLASSNAME$$}__track ${CLASSNAME$$}__track--background`
|
|
11636
10904
|
}), /*#__PURE__*/React.createElement("div", {
|
|
11637
|
-
className: `${CLASSNAME
|
|
10905
|
+
className: `${CLASSNAME$$}__track ${CLASSNAME$$}__track--active`,
|
|
11638
10906
|
style: {
|
|
11639
10907
|
width: percentString
|
|
11640
10908
|
}
|
|
11641
10909
|
}), steps ? /*#__PURE__*/React.createElement("div", {
|
|
11642
|
-
className: `${CLASSNAME
|
|
10910
|
+
className: `${CLASSNAME$$}__ticks`
|
|
11643
10911
|
}, availableSteps.map((step, idx) => /*#__PURE__*/React.createElement("div", {
|
|
11644
10912
|
key: `tick_${idx}`,
|
|
11645
|
-
className: `${CLASSNAME
|
|
10913
|
+
className: `${CLASSNAME$$}__tick`,
|
|
11646
10914
|
style: {
|
|
11647
10915
|
left: `${step * 100}%`
|
|
11648
10916
|
}
|
|
@@ -11651,18 +10919,18 @@ const Slider = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
11651
10919
|
"aria-labelledby": sliderLabelId,
|
|
11652
10920
|
name: name,
|
|
11653
10921
|
id: sliderId,
|
|
11654
|
-
className: `${CLASSNAME
|
|
10922
|
+
className: `${CLASSNAME$$}__handle`,
|
|
11655
10923
|
style: {
|
|
11656
10924
|
left: percentString
|
|
11657
10925
|
},
|
|
11658
10926
|
onKeyDown: handleKeyDown,
|
|
11659
10927
|
disabled: isDisabled
|
|
11660
10928
|
})), !hideMinMaxLabel && /*#__PURE__*/React.createElement("span", {
|
|
11661
|
-
className: `${CLASSNAME
|
|
10929
|
+
className: `${CLASSNAME$$}__value-label ${CLASSNAME$$}__value-label--max`
|
|
11662
10930
|
}, max)));
|
|
11663
10931
|
});
|
|
11664
|
-
Slider.displayName = COMPONENT_NAME$
|
|
11665
|
-
Slider.className = CLASSNAME
|
|
10932
|
+
Slider.displayName = COMPONENT_NAME$12;
|
|
10933
|
+
Slider.className = CLASSNAME$$;
|
|
11666
10934
|
Slider.defaultProps = DEFAULT_PROPS$O;
|
|
11667
10935
|
|
|
11668
10936
|
/**
|
|
@@ -11983,7 +11251,7 @@ const useSlideFocusManagement = _ref => {
|
|
|
11983
11251
|
}, [isSlideDisplayed, slideRef]);
|
|
11984
11252
|
};
|
|
11985
11253
|
|
|
11986
|
-
const _excluded$
|
|
11254
|
+
const _excluded$16 = ["className", "children", "role", "label", "isDisplayed"];
|
|
11987
11255
|
|
|
11988
11256
|
/**
|
|
11989
11257
|
* Defines the props of the component.
|
|
@@ -11992,12 +11260,12 @@ const _excluded$19 = ["className", "children", "role", "label", "isDisplayed"];
|
|
|
11992
11260
|
/**
|
|
11993
11261
|
* Component display name.
|
|
11994
11262
|
*/
|
|
11995
|
-
const COMPONENT_NAME$
|
|
11263
|
+
const COMPONENT_NAME$13 = 'SlideshowItemGroup';
|
|
11996
11264
|
|
|
11997
11265
|
/**
|
|
11998
11266
|
* Component default class name and class prefix.
|
|
11999
11267
|
*/
|
|
12000
|
-
const CLASSNAME$
|
|
11268
|
+
const CLASSNAME$10 = getRootClassName(COMPONENT_NAME$13);
|
|
12001
11269
|
const buildSlideShowGroupId = (slidesId, index) => `${slidesId}-slide-${index}`;
|
|
12002
11270
|
|
|
12003
11271
|
/**
|
|
@@ -12015,7 +11283,7 @@ const SlideshowItemGroup = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12015
11283
|
label,
|
|
12016
11284
|
isDisplayed
|
|
12017
11285
|
} = props,
|
|
12018
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
11286
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$16);
|
|
12019
11287
|
const groupRef = React.useRef(null);
|
|
12020
11288
|
useSlideFocusManagement({
|
|
12021
11289
|
isSlideDisplayed: isDisplayed,
|
|
@@ -12025,16 +11293,16 @@ const SlideshowItemGroup = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12025
11293
|
ref: mergeRefs(groupRef, ref),
|
|
12026
11294
|
role: role,
|
|
12027
11295
|
className: classnames(className, handleBasicClasses({
|
|
12028
|
-
prefix: CLASSNAME$
|
|
11296
|
+
prefix: CLASSNAME$10
|
|
12029
11297
|
})),
|
|
12030
11298
|
"aria-roledescription": "slide",
|
|
12031
11299
|
"aria-label": label
|
|
12032
11300
|
}, forwardedProps), children);
|
|
12033
11301
|
});
|
|
12034
|
-
SlideshowItemGroup.displayName = COMPONENT_NAME$
|
|
12035
|
-
SlideshowItemGroup.className = CLASSNAME$
|
|
11302
|
+
SlideshowItemGroup.displayName = COMPONENT_NAME$13;
|
|
11303
|
+
SlideshowItemGroup.className = CLASSNAME$10;
|
|
12036
11304
|
|
|
12037
|
-
const _excluded$
|
|
11305
|
+
const _excluded$17 = ["activeIndex", "autoPlay", "children", "className", "fillHeight", "groupBy", "interval", "onChange", "slideshowControlsProps", "theme", "id", "slidesId", "slideGroupLabel"];
|
|
12038
11306
|
|
|
12039
11307
|
/**
|
|
12040
11308
|
* Defines the props of the component.
|
|
@@ -12070,7 +11338,7 @@ const Slideshow = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12070
11338
|
slidesId,
|
|
12071
11339
|
slideGroupLabel
|
|
12072
11340
|
} = props,
|
|
12073
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
11341
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$17);
|
|
12074
11342
|
// Number of slideshow items.
|
|
12075
11343
|
const itemsCount = React.Children.count(children);
|
|
12076
11344
|
const {
|
|
@@ -12152,7 +11420,7 @@ const Slideshow = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12152
11420
|
Slideshow.displayName = 'Slideshow';
|
|
12153
11421
|
Slideshow.defaultProps = DEFAULT_PROPS$P;
|
|
12154
11422
|
|
|
12155
|
-
const _excluded$
|
|
11423
|
+
const _excluded$18 = ["className", "children"];
|
|
12156
11424
|
|
|
12157
11425
|
/**
|
|
12158
11426
|
* Defines the props of the component.
|
|
@@ -12161,12 +11429,12 @@ const _excluded$1b = ["className", "children"];
|
|
|
12161
11429
|
/**
|
|
12162
11430
|
* Component display name.
|
|
12163
11431
|
*/
|
|
12164
|
-
const COMPONENT_NAME$
|
|
11432
|
+
const COMPONENT_NAME$14 = 'SlideshowItem';
|
|
12165
11433
|
|
|
12166
11434
|
/**
|
|
12167
11435
|
* Component default class name and class prefix.
|
|
12168
11436
|
*/
|
|
12169
|
-
const CLASSNAME$
|
|
11437
|
+
const CLASSNAME$11 = getRootClassName(COMPONENT_NAME$14);
|
|
12170
11438
|
|
|
12171
11439
|
/**
|
|
12172
11440
|
* SlideshowItem component.
|
|
@@ -12180,16 +11448,16 @@ const SlideshowItem = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12180
11448
|
className,
|
|
12181
11449
|
children
|
|
12182
11450
|
} = props,
|
|
12183
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
11451
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$18);
|
|
12184
11452
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
12185
11453
|
ref: ref,
|
|
12186
11454
|
className: classnames(className, handleBasicClasses({
|
|
12187
|
-
prefix: CLASSNAME$
|
|
11455
|
+
prefix: CLASSNAME$11
|
|
12188
11456
|
}))
|
|
12189
11457
|
}, forwardedProps), children);
|
|
12190
11458
|
});
|
|
12191
|
-
SlideshowItem.displayName = COMPONENT_NAME$
|
|
12192
|
-
SlideshowItem.className = CLASSNAME$
|
|
11459
|
+
SlideshowItem.displayName = COMPONENT_NAME$14;
|
|
11460
|
+
SlideshowItem.className = CLASSNAME$11;
|
|
12193
11461
|
|
|
12194
11462
|
const isTouchDevice = () => 'ontouchstart' in window;
|
|
12195
11463
|
|
|
@@ -12248,7 +11516,7 @@ function usePaginationVisibleRange(activeIndex, slideCount) {
|
|
|
12248
11516
|
}, [activeIndex, slideCount]);
|
|
12249
11517
|
}
|
|
12250
11518
|
|
|
12251
|
-
const _excluded$
|
|
11519
|
+
const _excluded$19 = ["activeIndex", "className", "nextButtonProps", "onNextClick", "onPaginationClick", "onPreviousClick", "parentRef", "previousButtonProps", "paginationProps", "slidesCount", "theme", "isAutoPlaying", "playButtonProps", "paginationItemLabel", "paginationItemProps"],
|
|
12252
11520
|
_excluded2$2 = ["className", "label"];
|
|
12253
11521
|
|
|
12254
11522
|
/**
|
|
@@ -12258,12 +11526,12 @@ const _excluded$1c = ["activeIndex", "className", "nextButtonProps", "onNextClic
|
|
|
12258
11526
|
/**
|
|
12259
11527
|
* Component display name.
|
|
12260
11528
|
*/
|
|
12261
|
-
const COMPONENT_NAME$
|
|
11529
|
+
const COMPONENT_NAME$15 = 'SlideshowControls';
|
|
12262
11530
|
|
|
12263
11531
|
/**
|
|
12264
11532
|
* Component default class name and class prefix.
|
|
12265
11533
|
*/
|
|
12266
|
-
const CLASSNAME$
|
|
11534
|
+
const CLASSNAME$12 = getRootClassName(COMPONENT_NAME$15);
|
|
12267
11535
|
|
|
12268
11536
|
/**
|
|
12269
11537
|
* Component default props.
|
|
@@ -12298,7 +11566,7 @@ const InternalSlideshowControls = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12298
11566
|
paginationItemLabel,
|
|
12299
11567
|
paginationItemProps
|
|
12300
11568
|
} = props,
|
|
12301
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
11569
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$19);
|
|
12302
11570
|
let parent;
|
|
12303
11571
|
if (WINDOW) {
|
|
12304
11572
|
// Checking window object to avoid errors in SSR.
|
|
@@ -12335,22 +11603,22 @@ const InternalSlideshowControls = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12335
11603
|
ref: ref
|
|
12336
11604
|
}, forwardedProps, {
|
|
12337
11605
|
className: classnames(className, handleBasicClasses({
|
|
12338
|
-
prefix: CLASSNAME$
|
|
11606
|
+
prefix: CLASSNAME$12,
|
|
12339
11607
|
theme
|
|
12340
11608
|
}), {
|
|
12341
|
-
[`${CLASSNAME$
|
|
11609
|
+
[`${CLASSNAME$12}--has-infinite-pagination`]: slidesCount > PAGINATION_ITEMS_MAX
|
|
12342
11610
|
})
|
|
12343
11611
|
}), /*#__PURE__*/React.createElement(IconButton, _extends({}, previousButtonProps, {
|
|
12344
11612
|
icon: mdiChevronLeft,
|
|
12345
|
-
className: `${CLASSNAME$
|
|
11613
|
+
className: `${CLASSNAME$12}__navigation`,
|
|
12346
11614
|
color: theme === Theme.dark ? 'light' : 'dark',
|
|
12347
11615
|
emphasis: Emphasis.low,
|
|
12348
11616
|
onClick: onPreviousClick
|
|
12349
11617
|
})), /*#__PURE__*/React.createElement("div", {
|
|
12350
11618
|
ref: paginationRef,
|
|
12351
|
-
className: `${CLASSNAME$
|
|
11619
|
+
className: `${CLASSNAME$12}__pagination`
|
|
12352
11620
|
}, /*#__PURE__*/React.createElement("div", _extends({
|
|
12353
|
-
className: `${CLASSNAME$
|
|
11621
|
+
className: `${CLASSNAME$12}__pagination-items`,
|
|
12354
11622
|
style: wrapperStyle,
|
|
12355
11623
|
role: "tablist"
|
|
12356
11624
|
}, paginationProps), useMemo(() => range(slidesCount).map(index => {
|
|
@@ -12366,7 +11634,7 @@ const InternalSlideshowControls = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12366
11634
|
const ariaLabel = label || (paginationItemLabel === null || paginationItemLabel === void 0 ? void 0 : paginationItemLabel(index)) || `${index + 1} / ${slidesCount}`;
|
|
12367
11635
|
return /*#__PURE__*/React.createElement("button", _extends({
|
|
12368
11636
|
className: classnames(handleBasicClasses({
|
|
12369
|
-
prefix: `${CLASSNAME$
|
|
11637
|
+
prefix: `${CLASSNAME$12}__pagination-item`,
|
|
12370
11638
|
isActive,
|
|
12371
11639
|
isOnEdge,
|
|
12372
11640
|
isOutRange
|
|
@@ -12381,35 +11649,35 @@ const InternalSlideshowControls = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12381
11649
|
}, itemProps));
|
|
12382
11650
|
}), [slidesCount, visibleRange.min, visibleRange.max, activeIndex, paginationItemProps, paginationItemLabel, onPaginationClick]))), playButtonProps ? /*#__PURE__*/React.createElement(IconButton, _extends({}, playButtonProps, {
|
|
12383
11651
|
icon: isAutoPlaying ? mdiPauseCircleOutline : mdiPlayCircleOutline,
|
|
12384
|
-
className: `${CLASSNAME$
|
|
11652
|
+
className: `${CLASSNAME$12}__play`,
|
|
12385
11653
|
color: theme === Theme.dark ? 'light' : 'dark',
|
|
12386
11654
|
emphasis: Emphasis.low
|
|
12387
11655
|
})) : null, /*#__PURE__*/React.createElement(IconButton, _extends({}, nextButtonProps, {
|
|
12388
11656
|
icon: mdiChevronRight,
|
|
12389
|
-
className: `${CLASSNAME$
|
|
11657
|
+
className: `${CLASSNAME$12}__navigation`,
|
|
12390
11658
|
color: theme === Theme.dark ? 'light' : 'dark',
|
|
12391
11659
|
emphasis: Emphasis.low,
|
|
12392
11660
|
onClick: onNextClick
|
|
12393
11661
|
})));
|
|
12394
11662
|
});
|
|
12395
|
-
InternalSlideshowControls.displayName = COMPONENT_NAME$
|
|
12396
|
-
InternalSlideshowControls.className = CLASSNAME$
|
|
11663
|
+
InternalSlideshowControls.displayName = COMPONENT_NAME$15;
|
|
11664
|
+
InternalSlideshowControls.className = CLASSNAME$12;
|
|
12397
11665
|
InternalSlideshowControls.defaultProps = DEFAULT_PROPS$Q;
|
|
12398
11666
|
const SlideshowControls = Object.assign(InternalSlideshowControls, {
|
|
12399
11667
|
useSlideshowControls,
|
|
12400
11668
|
useSlideshowControlsDefaultOptions: DEFAULT_OPTIONS$1
|
|
12401
11669
|
});
|
|
12402
11670
|
|
|
12403
|
-
const _excluded$
|
|
11671
|
+
const _excluded$1a = ["activeIndex", "id", "className", "theme", "fillHeight", "groupBy", "isAutoPlaying", "toggleAutoPlay", "slidesId", "children", "afterSlides", "hasControls", "slideGroupLabel"];
|
|
12404
11672
|
/**
|
|
12405
11673
|
* Component display name.
|
|
12406
11674
|
*/
|
|
12407
|
-
const COMPONENT_NAME$
|
|
11675
|
+
const COMPONENT_NAME$16 = 'Slideshow';
|
|
12408
11676
|
|
|
12409
11677
|
/**
|
|
12410
11678
|
* Component default class name and class prefix.
|
|
12411
11679
|
*/
|
|
12412
|
-
const CLASSNAME$
|
|
11680
|
+
const CLASSNAME$13 = getRootClassName(COMPONENT_NAME$16);
|
|
12413
11681
|
|
|
12414
11682
|
/**
|
|
12415
11683
|
* Slides component.
|
|
@@ -12434,7 +11702,7 @@ const Slides = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12434
11702
|
hasControls,
|
|
12435
11703
|
slideGroupLabel
|
|
12436
11704
|
} = props,
|
|
12437
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
11705
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1a);
|
|
12438
11706
|
const wrapperRef = React.useRef(null);
|
|
12439
11707
|
const startIndexVisible = activeIndex;
|
|
12440
11708
|
const endIndexVisible = startIndexVisible + 1;
|
|
@@ -12452,22 +11720,22 @@ const Slides = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12452
11720
|
ref: ref
|
|
12453
11721
|
}, forwardedProps, {
|
|
12454
11722
|
className: classnames(className, handleBasicClasses({
|
|
12455
|
-
prefix: CLASSNAME$
|
|
11723
|
+
prefix: CLASSNAME$13,
|
|
12456
11724
|
theme
|
|
12457
11725
|
}), {
|
|
12458
|
-
[`${CLASSNAME$
|
|
12459
|
-
[`${CLASSNAME$
|
|
11726
|
+
[`${CLASSNAME$13}--fill-height`]: fillHeight,
|
|
11727
|
+
[`${CLASSNAME$13}--group-by-${groupBy}`]: Boolean(groupBy)
|
|
12460
11728
|
}),
|
|
12461
11729
|
"aria-roledescription": "carousel"
|
|
12462
11730
|
}), /*#__PURE__*/React.createElement("div", {
|
|
12463
11731
|
id: slidesId,
|
|
12464
|
-
className: `${CLASSNAME$
|
|
11732
|
+
className: `${CLASSNAME$13}__slides`,
|
|
12465
11733
|
onMouseEnter: toggleAutoPlay,
|
|
12466
11734
|
onMouseLeave: toggleAutoPlay,
|
|
12467
11735
|
"aria-live": isAutoPlaying ? 'off' : 'polite'
|
|
12468
11736
|
}, /*#__PURE__*/React.createElement("div", {
|
|
12469
11737
|
ref: wrapperRef,
|
|
12470
|
-
className: `${CLASSNAME$
|
|
11738
|
+
className: `${CLASSNAME$13}__wrapper`,
|
|
12471
11739
|
style: wrapperStyle
|
|
12472
11740
|
}, groups.map((group, index) => /*#__PURE__*/React.createElement(SlideshowItemGroup, {
|
|
12473
11741
|
key: index,
|
|
@@ -12477,10 +11745,10 @@ const Slides = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12477
11745
|
isDisplayed: index >= startIndexVisible && index < endIndexVisible
|
|
12478
11746
|
}, group)))), afterSlides);
|
|
12479
11747
|
});
|
|
12480
|
-
Slides.displayName = COMPONENT_NAME$
|
|
12481
|
-
Slides.className = CLASSNAME$
|
|
11748
|
+
Slides.displayName = COMPONENT_NAME$16;
|
|
11749
|
+
Slides.className = CLASSNAME$13;
|
|
12482
11750
|
|
|
12483
|
-
const _excluded$
|
|
11751
|
+
const _excluded$1b = ["checked", "children", "className", "disabled", "helper", "id", "isChecked", "isDisabled", "name", "onChange", "position", "theme", "value", "inputProps"];
|
|
12484
11752
|
|
|
12485
11753
|
/**
|
|
12486
11754
|
* Defines the props of the component.
|
|
@@ -12489,12 +11757,12 @@ const _excluded$1e = ["checked", "children", "className", "disabled", "helper",
|
|
|
12489
11757
|
/**
|
|
12490
11758
|
* Component display name.
|
|
12491
11759
|
*/
|
|
12492
|
-
const COMPONENT_NAME$
|
|
11760
|
+
const COMPONENT_NAME$17 = 'Switch';
|
|
12493
11761
|
|
|
12494
11762
|
/**
|
|
12495
11763
|
* Component default class name and class prefix.
|
|
12496
11764
|
*/
|
|
12497
|
-
const CLASSNAME$
|
|
11765
|
+
const CLASSNAME$14 = getRootClassName(COMPONENT_NAME$17);
|
|
12498
11766
|
|
|
12499
11767
|
/**
|
|
12500
11768
|
* Component default props.
|
|
@@ -12528,7 +11796,7 @@ const Switch = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12528
11796
|
value,
|
|
12529
11797
|
inputProps = {}
|
|
12530
11798
|
} = props,
|
|
12531
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
11799
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1b);
|
|
12532
11800
|
const inputId = useMemo(() => id || `switch-${uid()}`, [id]);
|
|
12533
11801
|
const handleChange = event => {
|
|
12534
11802
|
if (onChange) {
|
|
@@ -12539,7 +11807,7 @@ const Switch = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12539
11807
|
ref: ref
|
|
12540
11808
|
}, forwardedProps, {
|
|
12541
11809
|
className: classnames(className, handleBasicClasses({
|
|
12542
|
-
prefix: CLASSNAME$
|
|
11810
|
+
prefix: CLASSNAME$14,
|
|
12543
11811
|
isChecked,
|
|
12544
11812
|
isDisabled,
|
|
12545
11813
|
position,
|
|
@@ -12548,12 +11816,12 @@ const Switch = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12548
11816
|
})),
|
|
12549
11817
|
"aria-disabled": isDisabled
|
|
12550
11818
|
}), /*#__PURE__*/React.createElement("div", {
|
|
12551
|
-
className: `${CLASSNAME$
|
|
11819
|
+
className: `${CLASSNAME$14}__input-wrapper`
|
|
12552
11820
|
}, /*#__PURE__*/React.createElement("input", _extends({
|
|
12553
11821
|
type: "checkbox",
|
|
12554
11822
|
role: "switch",
|
|
12555
11823
|
id: inputId,
|
|
12556
|
-
className: `${CLASSNAME$
|
|
11824
|
+
className: `${CLASSNAME$14}__input-native`,
|
|
12557
11825
|
name: name,
|
|
12558
11826
|
value: value,
|
|
12559
11827
|
disabled: isDisabled,
|
|
@@ -12562,28 +11830,28 @@ const Switch = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12562
11830
|
onChange: handleChange,
|
|
12563
11831
|
"aria-describedby": helper ? `${inputId}-helper` : undefined
|
|
12564
11832
|
}, inputProps)), /*#__PURE__*/React.createElement("div", {
|
|
12565
|
-
className: `${CLASSNAME$
|
|
11833
|
+
className: `${CLASSNAME$14}__input-placeholder`
|
|
12566
11834
|
}, /*#__PURE__*/React.createElement("div", {
|
|
12567
|
-
className: `${CLASSNAME$
|
|
11835
|
+
className: `${CLASSNAME$14}__input-background`
|
|
12568
11836
|
}), /*#__PURE__*/React.createElement("div", {
|
|
12569
|
-
className: `${CLASSNAME$
|
|
11837
|
+
className: `${CLASSNAME$14}__input-indicator`
|
|
12570
11838
|
}))), Children.count(children) > 0 && /*#__PURE__*/React.createElement("div", {
|
|
12571
|
-
className: `${CLASSNAME$
|
|
11839
|
+
className: `${CLASSNAME$14}__content`
|
|
12572
11840
|
}, /*#__PURE__*/React.createElement(InputLabel, {
|
|
12573
11841
|
htmlFor: inputId,
|
|
12574
11842
|
theme: theme,
|
|
12575
|
-
className: `${CLASSNAME$
|
|
11843
|
+
className: `${CLASSNAME$14}__label`
|
|
12576
11844
|
}, children), !isEmpty(helper) && /*#__PURE__*/React.createElement(InputHelper, {
|
|
12577
11845
|
id: `${inputId}-helper`,
|
|
12578
11846
|
theme: theme,
|
|
12579
|
-
className: `${CLASSNAME$
|
|
11847
|
+
className: `${CLASSNAME$14}__helper`
|
|
12580
11848
|
}, helper)));
|
|
12581
11849
|
});
|
|
12582
|
-
Switch.displayName = COMPONENT_NAME$
|
|
12583
|
-
Switch.className = CLASSNAME$
|
|
11850
|
+
Switch.displayName = COMPONENT_NAME$17;
|
|
11851
|
+
Switch.className = CLASSNAME$14;
|
|
12584
11852
|
Switch.defaultProps = DEFAULT_PROPS$R;
|
|
12585
11853
|
|
|
12586
|
-
const _excluded$
|
|
11854
|
+
const _excluded$1c = ["children", "className", "hasBefore", "hasDividers", "theme"];
|
|
12587
11855
|
|
|
12588
11856
|
/**
|
|
12589
11857
|
* Defines the props of the component.
|
|
@@ -12592,12 +11860,12 @@ const _excluded$1f = ["children", "className", "hasBefore", "hasDividers", "them
|
|
|
12592
11860
|
/**
|
|
12593
11861
|
* Component display name.
|
|
12594
11862
|
*/
|
|
12595
|
-
const COMPONENT_NAME$
|
|
11863
|
+
const COMPONENT_NAME$18 = 'Table';
|
|
12596
11864
|
|
|
12597
11865
|
/**
|
|
12598
11866
|
* Component default class name and class prefix.
|
|
12599
11867
|
*/
|
|
12600
|
-
const CLASSNAME$
|
|
11868
|
+
const CLASSNAME$15 = getRootClassName(COMPONENT_NAME$18);
|
|
12601
11869
|
|
|
12602
11870
|
/**
|
|
12603
11871
|
* Component default props.
|
|
@@ -12621,23 +11889,23 @@ const Table = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12621
11889
|
hasDividers,
|
|
12622
11890
|
theme
|
|
12623
11891
|
} = props,
|
|
12624
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
11892
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1c);
|
|
12625
11893
|
return /*#__PURE__*/React.createElement("table", _extends({
|
|
12626
11894
|
ref: ref
|
|
12627
11895
|
}, forwardedProps, {
|
|
12628
11896
|
className: classnames(className, handleBasicClasses({
|
|
12629
|
-
prefix: CLASSNAME$
|
|
11897
|
+
prefix: CLASSNAME$15,
|
|
12630
11898
|
hasBefore,
|
|
12631
11899
|
hasDividers,
|
|
12632
11900
|
theme
|
|
12633
11901
|
}))
|
|
12634
11902
|
}), children);
|
|
12635
11903
|
});
|
|
12636
|
-
Table.displayName = COMPONENT_NAME$
|
|
12637
|
-
Table.className = CLASSNAME$
|
|
11904
|
+
Table.displayName = COMPONENT_NAME$18;
|
|
11905
|
+
Table.className = CLASSNAME$15;
|
|
12638
11906
|
Table.defaultProps = DEFAULT_PROPS$S;
|
|
12639
11907
|
|
|
12640
|
-
const _excluded$
|
|
11908
|
+
const _excluded$1d = ["children", "className"];
|
|
12641
11909
|
|
|
12642
11910
|
/**
|
|
12643
11911
|
* Defines the props of the component.
|
|
@@ -12646,12 +11914,12 @@ const _excluded$1g = ["children", "className"];
|
|
|
12646
11914
|
/**
|
|
12647
11915
|
* Component display name.
|
|
12648
11916
|
*/
|
|
12649
|
-
const COMPONENT_NAME$
|
|
11917
|
+
const COMPONENT_NAME$19 = 'TableBody';
|
|
12650
11918
|
|
|
12651
11919
|
/**
|
|
12652
11920
|
* Component default class name and class prefix.
|
|
12653
11921
|
*/
|
|
12654
|
-
const CLASSNAME$
|
|
11922
|
+
const CLASSNAME$16 = getRootClassName(COMPONENT_NAME$19, true);
|
|
12655
11923
|
|
|
12656
11924
|
/**
|
|
12657
11925
|
* TableBody component.
|
|
@@ -12665,19 +11933,19 @@ const TableBody = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12665
11933
|
children,
|
|
12666
11934
|
className
|
|
12667
11935
|
} = props,
|
|
12668
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
11936
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1d);
|
|
12669
11937
|
return /*#__PURE__*/React.createElement("tbody", _extends({
|
|
12670
11938
|
ref: ref
|
|
12671
11939
|
}, forwardedProps, {
|
|
12672
11940
|
className: classnames(className, handleBasicClasses({
|
|
12673
|
-
prefix: CLASSNAME$
|
|
11941
|
+
prefix: CLASSNAME$16
|
|
12674
11942
|
}))
|
|
12675
11943
|
}), children);
|
|
12676
11944
|
});
|
|
12677
|
-
TableBody.displayName = COMPONENT_NAME$
|
|
12678
|
-
TableBody.className = CLASSNAME$
|
|
11945
|
+
TableBody.displayName = COMPONENT_NAME$19;
|
|
11946
|
+
TableBody.className = CLASSNAME$16;
|
|
12679
11947
|
|
|
12680
|
-
const _excluded$
|
|
11948
|
+
const _excluded$1e = ["children", "className", "icon", "isSortable", "onHeaderClick", "sortOrder", "variant"];
|
|
12681
11949
|
|
|
12682
11950
|
/**
|
|
12683
11951
|
* Table head cell sort order.
|
|
@@ -12701,12 +11969,12 @@ const TableCellVariant = {
|
|
|
12701
11969
|
/**
|
|
12702
11970
|
* Component display name.
|
|
12703
11971
|
*/
|
|
12704
|
-
const COMPONENT_NAME$
|
|
11972
|
+
const COMPONENT_NAME$1a = 'TableCell';
|
|
12705
11973
|
|
|
12706
11974
|
/**
|
|
12707
11975
|
* Component default class name and class prefix.
|
|
12708
11976
|
*/
|
|
12709
|
-
const CLASSNAME$
|
|
11977
|
+
const CLASSNAME$17 = getRootClassName(COMPONENT_NAME$1a, true);
|
|
12710
11978
|
|
|
12711
11979
|
/**
|
|
12712
11980
|
* Component default props.
|
|
@@ -12732,7 +12000,7 @@ const TableCell = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12732
12000
|
sortOrder,
|
|
12733
12001
|
variant
|
|
12734
12002
|
} = props,
|
|
12735
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
12003
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1e);
|
|
12736
12004
|
|
|
12737
12005
|
// Use button if clickable
|
|
12738
12006
|
const Wrapper = onHeaderClick ? 'button' : 'div';
|
|
@@ -12752,40 +12020,40 @@ const TableCell = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12752
12020
|
ref: ref
|
|
12753
12021
|
}, forwardedProps, {
|
|
12754
12022
|
className: classnames(handleBasicClasses({
|
|
12755
|
-
prefix: CLASSNAME$
|
|
12023
|
+
prefix: CLASSNAME$17,
|
|
12756
12024
|
isSortable,
|
|
12757
12025
|
isSorted: isSortable && !!sortOrder
|
|
12758
|
-
}), className, `${CLASSNAME$
|
|
12026
|
+
}), className, `${CLASSNAME$17}--head`),
|
|
12759
12027
|
"aria-sort": ariaSort
|
|
12760
12028
|
}), /*#__PURE__*/React.createElement(Wrapper, _extends({
|
|
12761
|
-
className: `${CLASSNAME$
|
|
12029
|
+
className: `${CLASSNAME$17}-wrapper`
|
|
12762
12030
|
}, wrapperProps), icon && !isSortable && /*#__PURE__*/React.createElement(Icon, {
|
|
12763
|
-
className: `${CLASSNAME$
|
|
12031
|
+
className: `${CLASSNAME$17}-icon`,
|
|
12764
12032
|
icon: icon,
|
|
12765
12033
|
size: Size.xxs
|
|
12766
12034
|
}), isSortable && sortOrder === ThOrder.asc && /*#__PURE__*/React.createElement(Icon, {
|
|
12767
|
-
className: `${CLASSNAME$
|
|
12035
|
+
className: `${CLASSNAME$17}-icon`,
|
|
12768
12036
|
icon: mdiArrowUp,
|
|
12769
12037
|
size: Size.xxs
|
|
12770
12038
|
}), isSortable && sortOrder === ThOrder.desc && /*#__PURE__*/React.createElement(Icon, {
|
|
12771
|
-
className: `${CLASSNAME$
|
|
12039
|
+
className: `${CLASSNAME$17}-icon`,
|
|
12772
12040
|
icon: mdiArrowDown,
|
|
12773
12041
|
size: Size.xxs
|
|
12774
12042
|
}), /*#__PURE__*/React.createElement("div", {
|
|
12775
|
-
className: `${CLASSNAME$
|
|
12043
|
+
className: `${CLASSNAME$17}-content`
|
|
12776
12044
|
}, children))), variant === TableCellVariant.body && /*#__PURE__*/React.createElement("td", _extends({}, forwardedProps, {
|
|
12777
12045
|
className: classnames(className, handleBasicClasses({
|
|
12778
|
-
prefix: CLASSNAME$
|
|
12779
|
-
}), `${CLASSNAME$
|
|
12046
|
+
prefix: CLASSNAME$17
|
|
12047
|
+
}), `${CLASSNAME$17}--body`)
|
|
12780
12048
|
}), /*#__PURE__*/React.createElement("div", {
|
|
12781
|
-
className: `${CLASSNAME$
|
|
12049
|
+
className: `${CLASSNAME$17}-content`
|
|
12782
12050
|
}, children)));
|
|
12783
12051
|
});
|
|
12784
|
-
TableCell.displayName = COMPONENT_NAME$
|
|
12785
|
-
TableCell.className = CLASSNAME$
|
|
12052
|
+
TableCell.displayName = COMPONENT_NAME$1a;
|
|
12053
|
+
TableCell.className = CLASSNAME$17;
|
|
12786
12054
|
TableCell.defaultProps = DEFAULT_PROPS$T;
|
|
12787
12055
|
|
|
12788
|
-
const _excluded$
|
|
12056
|
+
const _excluded$1f = ["children", "className"];
|
|
12789
12057
|
|
|
12790
12058
|
/**
|
|
12791
12059
|
* Defines the props of the component.
|
|
@@ -12794,12 +12062,12 @@ const _excluded$1i = ["children", "className"];
|
|
|
12794
12062
|
/**
|
|
12795
12063
|
* Component display name.
|
|
12796
12064
|
*/
|
|
12797
|
-
const COMPONENT_NAME$
|
|
12065
|
+
const COMPONENT_NAME$1b = 'TableHeader';
|
|
12798
12066
|
|
|
12799
12067
|
/**
|
|
12800
12068
|
* Component default class name and class prefix.
|
|
12801
12069
|
*/
|
|
12802
|
-
const CLASSNAME$
|
|
12070
|
+
const CLASSNAME$18 = getRootClassName(COMPONENT_NAME$1b, true);
|
|
12803
12071
|
|
|
12804
12072
|
/**
|
|
12805
12073
|
* Component default props.
|
|
@@ -12818,20 +12086,20 @@ const TableHeader = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12818
12086
|
children,
|
|
12819
12087
|
className
|
|
12820
12088
|
} = props,
|
|
12821
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
12089
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1f);
|
|
12822
12090
|
return /*#__PURE__*/React.createElement("thead", _extends({
|
|
12823
12091
|
ref: ref
|
|
12824
12092
|
}, forwardedProps, {
|
|
12825
12093
|
className: classnames(className, handleBasicClasses({
|
|
12826
|
-
prefix: CLASSNAME$
|
|
12094
|
+
prefix: CLASSNAME$18
|
|
12827
12095
|
}))
|
|
12828
12096
|
}), children);
|
|
12829
12097
|
});
|
|
12830
|
-
TableHeader.displayName = COMPONENT_NAME$
|
|
12831
|
-
TableHeader.className = CLASSNAME$
|
|
12098
|
+
TableHeader.displayName = COMPONENT_NAME$1b;
|
|
12099
|
+
TableHeader.className = CLASSNAME$18;
|
|
12832
12100
|
TableHeader.defaultProps = DEFAULT_PROPS$U;
|
|
12833
12101
|
|
|
12834
|
-
const _excluded$
|
|
12102
|
+
const _excluded$1g = ["children", "className", "disabled", "isClickable", "isDisabled", "isSelected"];
|
|
12835
12103
|
|
|
12836
12104
|
/**
|
|
12837
12105
|
* Defines the props of the component.
|
|
@@ -12840,12 +12108,12 @@ const _excluded$1j = ["children", "className", "disabled", "isClickable", "isDis
|
|
|
12840
12108
|
/**
|
|
12841
12109
|
* Component display name.
|
|
12842
12110
|
*/
|
|
12843
|
-
const COMPONENT_NAME$
|
|
12111
|
+
const COMPONENT_NAME$1c = 'TableRow';
|
|
12844
12112
|
|
|
12845
12113
|
/**
|
|
12846
12114
|
* Component default class name and class prefix.
|
|
12847
12115
|
*/
|
|
12848
|
-
const CLASSNAME$
|
|
12116
|
+
const CLASSNAME$19 = getRootClassName(COMPONENT_NAME$1c, true);
|
|
12849
12117
|
|
|
12850
12118
|
/**
|
|
12851
12119
|
* Component default props.
|
|
@@ -12868,7 +12136,7 @@ const TableRow = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12868
12136
|
isDisabled = disabled,
|
|
12869
12137
|
isSelected
|
|
12870
12138
|
} = props,
|
|
12871
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
12139
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1g);
|
|
12872
12140
|
return /*#__PURE__*/React.createElement("tr", _extends({
|
|
12873
12141
|
ref: ref,
|
|
12874
12142
|
tabIndex: isClickable && !isDisabled ? 0 : -1
|
|
@@ -12877,16 +12145,16 @@ const TableRow = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12877
12145
|
isClickable: isClickable && !isDisabled,
|
|
12878
12146
|
isDisabled,
|
|
12879
12147
|
isSelected: isSelected && !isDisabled,
|
|
12880
|
-
prefix: CLASSNAME$
|
|
12148
|
+
prefix: CLASSNAME$19
|
|
12881
12149
|
})),
|
|
12882
12150
|
"aria-disabled": isDisabled
|
|
12883
12151
|
}), children);
|
|
12884
12152
|
});
|
|
12885
|
-
TableRow.displayName = COMPONENT_NAME$
|
|
12886
|
-
TableRow.className = CLASSNAME$
|
|
12153
|
+
TableRow.displayName = COMPONENT_NAME$1c;
|
|
12154
|
+
TableRow.className = CLASSNAME$19;
|
|
12887
12155
|
TableRow.defaultProps = DEFAULT_PROPS$V;
|
|
12888
12156
|
|
|
12889
|
-
const _excluded$
|
|
12157
|
+
const _excluded$1h = ["children", "onChange"];
|
|
12890
12158
|
const DEFAULT_PROPS$W = {
|
|
12891
12159
|
isLazy: INIT_STATE.isLazy,
|
|
12892
12160
|
shouldActivateOnFocus: INIT_STATE.shouldActivateOnFocus
|
|
@@ -12906,7 +12174,7 @@ const TabProvider = props => {
|
|
|
12906
12174
|
children,
|
|
12907
12175
|
onChange
|
|
12908
12176
|
} = props,
|
|
12909
|
-
propState = _objectWithoutProperties(props, _excluded$
|
|
12177
|
+
propState = _objectWithoutProperties(props, _excluded$1h);
|
|
12910
12178
|
const [state, dispatch] = useReducer(reducer, INIT_STATE);
|
|
12911
12179
|
|
|
12912
12180
|
// On prop state change => dispatch update.
|
|
@@ -12934,7 +12202,7 @@ const TabProvider = props => {
|
|
|
12934
12202
|
};
|
|
12935
12203
|
TabProvider.defaultProps = DEFAULT_PROPS$W;
|
|
12936
12204
|
|
|
12937
|
-
const _excluded$
|
|
12205
|
+
const _excluded$1i = ["aria-label", "children", "className", "layout", "position", "theme"];
|
|
12938
12206
|
let TabListLayout = /*#__PURE__*/function (TabListLayout) {
|
|
12939
12207
|
TabListLayout["clustered"] = "clustered";
|
|
12940
12208
|
TabListLayout["fixed"] = "fixed";
|
|
@@ -12948,12 +12216,12 @@ let TabListLayout = /*#__PURE__*/function (TabListLayout) {
|
|
|
12948
12216
|
/**
|
|
12949
12217
|
* Component display name.
|
|
12950
12218
|
*/
|
|
12951
|
-
const COMPONENT_NAME$
|
|
12219
|
+
const COMPONENT_NAME$1d = 'TabList';
|
|
12952
12220
|
|
|
12953
12221
|
/**
|
|
12954
12222
|
* Component default class name and class prefix.
|
|
12955
12223
|
*/
|
|
12956
|
-
const CLASSNAME$
|
|
12224
|
+
const CLASSNAME$1a = `${CSS_PREFIX}-tabs`;
|
|
12957
12225
|
|
|
12958
12226
|
/**
|
|
12959
12227
|
* Component default props.
|
|
@@ -12982,7 +12250,7 @@ const TabList = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12982
12250
|
position,
|
|
12983
12251
|
theme
|
|
12984
12252
|
} = props,
|
|
12985
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
12253
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1i);
|
|
12986
12254
|
const tabListRef = React.useRef(null);
|
|
12987
12255
|
useRovingTabIndex({
|
|
12988
12256
|
parentRef: tabListRef,
|
|
@@ -12994,22 +12262,22 @@ const TabList = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
12994
12262
|
ref: mergeRefs(ref, tabListRef)
|
|
12995
12263
|
}, forwardedProps, {
|
|
12996
12264
|
className: classnames(className, handleBasicClasses({
|
|
12997
|
-
prefix: CLASSNAME$
|
|
12265
|
+
prefix: CLASSNAME$1a,
|
|
12998
12266
|
layout,
|
|
12999
12267
|
position,
|
|
13000
12268
|
theme
|
|
13001
12269
|
}))
|
|
13002
12270
|
}), /*#__PURE__*/React.createElement("div", {
|
|
13003
|
-
className: `${CLASSNAME$
|
|
12271
|
+
className: `${CLASSNAME$1a}__links`,
|
|
13004
12272
|
role: "tablist",
|
|
13005
12273
|
"aria-label": ariaLabel
|
|
13006
12274
|
}, children));
|
|
13007
12275
|
});
|
|
13008
|
-
TabList.displayName = COMPONENT_NAME$
|
|
13009
|
-
TabList.className = CLASSNAME$
|
|
12276
|
+
TabList.displayName = COMPONENT_NAME$1d;
|
|
12277
|
+
TabList.className = CLASSNAME$1a;
|
|
13010
12278
|
TabList.defaultProps = DEFAULT_PROPS$X;
|
|
13011
12279
|
|
|
13012
|
-
const _excluded$
|
|
12280
|
+
const _excluded$1j = ["className", "disabled", "icon", "iconProps", "id", "isActive", "isDisabled", "label", "onFocus", "onKeyPress", "tabIndex"];
|
|
13013
12281
|
|
|
13014
12282
|
/**
|
|
13015
12283
|
* Defines the props of the component.
|
|
@@ -13018,12 +12286,12 @@ const _excluded$1m = ["className", "disabled", "icon", "iconProps", "id", "isAct
|
|
|
13018
12286
|
/**
|
|
13019
12287
|
* Component display name.
|
|
13020
12288
|
*/
|
|
13021
|
-
const COMPONENT_NAME$
|
|
12289
|
+
const COMPONENT_NAME$1e = 'Tab';
|
|
13022
12290
|
|
|
13023
12291
|
/**
|
|
13024
12292
|
* Component default class name and class prefix.
|
|
13025
12293
|
*/
|
|
13026
|
-
const CLASSNAME$
|
|
12294
|
+
const CLASSNAME$1b = `${CSS_PREFIX}-tabs__link`;
|
|
13027
12295
|
|
|
13028
12296
|
/**
|
|
13029
12297
|
* Component default props.
|
|
@@ -13053,7 +12321,7 @@ const Tab = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13053
12321
|
onKeyPress,
|
|
13054
12322
|
tabIndex = -1
|
|
13055
12323
|
} = props,
|
|
13056
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
12324
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1j);
|
|
13057
12325
|
const state = useTabProviderContext('tab', id);
|
|
13058
12326
|
const isActive = propIsActive || (state === null || state === void 0 ? void 0 : state.isActive);
|
|
13059
12327
|
const changeToCurrentTab = useCallback(() => {
|
|
@@ -13081,7 +12349,7 @@ const Tab = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13081
12349
|
type: "button",
|
|
13082
12350
|
id: state === null || state === void 0 ? void 0 : state.tabId,
|
|
13083
12351
|
className: classnames(className, handleBasicClasses({
|
|
13084
|
-
prefix: CLASSNAME$
|
|
12352
|
+
prefix: CLASSNAME$1b,
|
|
13085
12353
|
isActive,
|
|
13086
12354
|
isDisabled
|
|
13087
12355
|
})),
|
|
@@ -13098,11 +12366,11 @@ const Tab = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13098
12366
|
size: Size.xs
|
|
13099
12367
|
}, iconProps)), label && /*#__PURE__*/React.createElement("span", null, label));
|
|
13100
12368
|
});
|
|
13101
|
-
Tab.displayName = COMPONENT_NAME$
|
|
13102
|
-
Tab.className = CLASSNAME$
|
|
12369
|
+
Tab.displayName = COMPONENT_NAME$1e;
|
|
12370
|
+
Tab.className = CLASSNAME$1b;
|
|
13103
12371
|
Tab.defaultProps = DEFAULT_PROPS$Y;
|
|
13104
12372
|
|
|
13105
|
-
const _excluded$
|
|
12373
|
+
const _excluded$1k = ["children", "id", "className", "isActive"];
|
|
13106
12374
|
|
|
13107
12375
|
/**
|
|
13108
12376
|
* Defines the props of the component.
|
|
@@ -13111,12 +12379,12 @@ const _excluded$1n = ["children", "id", "className", "isActive"];
|
|
|
13111
12379
|
/**
|
|
13112
12380
|
* Component display name.
|
|
13113
12381
|
*/
|
|
13114
|
-
const COMPONENT_NAME$
|
|
12382
|
+
const COMPONENT_NAME$1f = 'TabPanel';
|
|
13115
12383
|
|
|
13116
12384
|
/**
|
|
13117
12385
|
* Component default class name and class prefix.
|
|
13118
12386
|
*/
|
|
13119
|
-
const CLASSNAME$
|
|
12387
|
+
const CLASSNAME$1c = `${CSS_PREFIX}-tab-panel`;
|
|
13120
12388
|
|
|
13121
12389
|
/**
|
|
13122
12390
|
* Component default props.
|
|
@@ -13139,7 +12407,7 @@ const TabPanel = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13139
12407
|
className,
|
|
13140
12408
|
isActive: propIsActive
|
|
13141
12409
|
} = props,
|
|
13142
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
12410
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1k);
|
|
13143
12411
|
const state = useTabProviderContext('tabPanel', id);
|
|
13144
12412
|
const isActive = propIsActive || (state === null || state === void 0 ? void 0 : state.isActive);
|
|
13145
12413
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
@@ -13147,7 +12415,7 @@ const TabPanel = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13147
12415
|
}, forwardedProps, {
|
|
13148
12416
|
id: state === null || state === void 0 ? void 0 : state.tabPanelId,
|
|
13149
12417
|
className: classnames(className, handleBasicClasses({
|
|
13150
|
-
prefix: CLASSNAME$
|
|
12418
|
+
prefix: CLASSNAME$1c,
|
|
13151
12419
|
isActive
|
|
13152
12420
|
})),
|
|
13153
12421
|
role: "tabpanel",
|
|
@@ -13155,11 +12423,11 @@ const TabPanel = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13155
12423
|
"aria-labelledby": state === null || state === void 0 ? void 0 : state.tabId
|
|
13156
12424
|
}), (!(state !== null && state !== void 0 && state.isLazy) || isActive) && children);
|
|
13157
12425
|
});
|
|
13158
|
-
TabPanel.displayName = COMPONENT_NAME$
|
|
13159
|
-
TabPanel.className = CLASSNAME$
|
|
12426
|
+
TabPanel.displayName = COMPONENT_NAME$1f;
|
|
12427
|
+
TabPanel.className = CLASSNAME$1c;
|
|
13160
12428
|
TabPanel.defaultProps = DEFAULT_PROPS$Z;
|
|
13161
12429
|
|
|
13162
|
-
const _excluded$
|
|
12430
|
+
const _excluded$1l = ["id", "isDisabled", "isRequired", "placeholder", "multiline", "value", "setFocus", "onChange", "onFocus", "onBlur", "inputRef", "rows", "recomputeNumberOfRows", "type", "name", "hasError", "describedById"],
|
|
13163
12431
|
_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"];
|
|
13164
12432
|
|
|
13165
12433
|
/**
|
|
@@ -13169,12 +12437,12 @@ const _excluded$1o = ["id", "isDisabled", "isRequired", "placeholder", "multilin
|
|
|
13169
12437
|
/**
|
|
13170
12438
|
* Component display name.
|
|
13171
12439
|
*/
|
|
13172
|
-
const COMPONENT_NAME$
|
|
12440
|
+
const COMPONENT_NAME$1g = 'TextField';
|
|
13173
12441
|
|
|
13174
12442
|
/**
|
|
13175
12443
|
* Component default class name and class prefix.
|
|
13176
12444
|
*/
|
|
13177
|
-
const CLASSNAME$
|
|
12445
|
+
const CLASSNAME$1d = getRootClassName(COMPONENT_NAME$1g);
|
|
13178
12446
|
|
|
13179
12447
|
/**
|
|
13180
12448
|
* Default minimum number of rows in the multiline mode.
|
|
@@ -13244,7 +12512,7 @@ const renderInputNative = props => {
|
|
|
13244
12512
|
hasError,
|
|
13245
12513
|
describedById
|
|
13246
12514
|
} = props,
|
|
13247
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
12515
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1l);
|
|
13248
12516
|
// eslint-disable-next-line react-hooks/rules-of-hooks
|
|
13249
12517
|
const ref = useRef(null);
|
|
13250
12518
|
|
|
@@ -13269,7 +12537,7 @@ const renderInputNative = props => {
|
|
|
13269
12537
|
const Component = multiline ? 'textarea' : 'input';
|
|
13270
12538
|
const inputProps = _objectSpread2(_objectSpread2({}, forwardedProps), {}, {
|
|
13271
12539
|
id,
|
|
13272
|
-
className: multiline ? `${CLASSNAME$
|
|
12540
|
+
className: multiline ? `${CLASSNAME$1d}__input-native ${CLASSNAME$1d}__input-native--textarea` : `${CLASSNAME$1d}__input-native ${CLASSNAME$1d}__input-native--text`,
|
|
13273
12541
|
placeholder,
|
|
13274
12542
|
value,
|
|
13275
12543
|
name,
|
|
@@ -13390,31 +12658,31 @@ const TextField = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13390
12658
|
isDisabled,
|
|
13391
12659
|
isFocus: isFocus || forceFocusStyle,
|
|
13392
12660
|
isValid,
|
|
13393
|
-
prefix: CLASSNAME$
|
|
12661
|
+
prefix: CLASSNAME$1d,
|
|
13394
12662
|
theme
|
|
13395
12663
|
}))
|
|
13396
12664
|
}, (label || maxLength) && /*#__PURE__*/React.createElement("div", {
|
|
13397
|
-
className: `${CLASSNAME$
|
|
12665
|
+
className: `${CLASSNAME$1d}__header`
|
|
13398
12666
|
}, label && /*#__PURE__*/React.createElement(InputLabel, _extends({}, labelProps, {
|
|
13399
12667
|
htmlFor: textFieldId,
|
|
13400
|
-
className: `${CLASSNAME$
|
|
12668
|
+
className: `${CLASSNAME$1d}__label`,
|
|
13401
12669
|
isRequired: isRequired,
|
|
13402
12670
|
theme: theme
|
|
13403
12671
|
}), label), maxLength && /*#__PURE__*/React.createElement("div", {
|
|
13404
|
-
className: `${CLASSNAME$
|
|
12672
|
+
className: `${CLASSNAME$1d}__char-counter`
|
|
13405
12673
|
}, /*#__PURE__*/React.createElement("span", null, maxLength - valueLength), maxLength - valueLength === 0 && /*#__PURE__*/React.createElement(Icon, {
|
|
13406
12674
|
icon: mdiAlertCircle,
|
|
13407
12675
|
size: Size.xxs
|
|
13408
12676
|
}))), /*#__PURE__*/React.createElement("div", {
|
|
13409
|
-
className: `${CLASSNAME$
|
|
12677
|
+
className: `${CLASSNAME$1d}__wrapper`,
|
|
13410
12678
|
ref: textFieldRef
|
|
13411
12679
|
}, icon && /*#__PURE__*/React.createElement(Icon, {
|
|
13412
|
-
className: `${CLASSNAME$
|
|
12680
|
+
className: `${CLASSNAME$1d}__input-icon`,
|
|
13413
12681
|
color: theme === Theme.dark ? 'light' : undefined,
|
|
13414
12682
|
icon: icon,
|
|
13415
12683
|
size: Size.xs
|
|
13416
12684
|
}), chips && /*#__PURE__*/React.createElement("div", {
|
|
13417
|
-
className: `${CLASSNAME$
|
|
12685
|
+
className: `${CLASSNAME$1d}__chips`
|
|
13418
12686
|
}, chips, renderInputNative(_objectSpread2({
|
|
13419
12687
|
id: textFieldId,
|
|
13420
12688
|
inputRef,
|
|
@@ -13435,7 +12703,7 @@ const TextField = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13435
12703
|
hasError,
|
|
13436
12704
|
describedById
|
|
13437
12705
|
}, forwardedProps))), !chips && /*#__PURE__*/React.createElement("div", {
|
|
13438
|
-
className: `${CLASSNAME$
|
|
12706
|
+
className: `${CLASSNAME$1d}__input-wrapper`
|
|
13439
12707
|
}, renderInputNative(_objectSpread2({
|
|
13440
12708
|
id: textFieldId,
|
|
13441
12709
|
inputRef,
|
|
@@ -13456,12 +12724,12 @@ const TextField = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13456
12724
|
hasError,
|
|
13457
12725
|
describedById
|
|
13458
12726
|
}, forwardedProps))), (isValid || hasError) && /*#__PURE__*/React.createElement(Icon, {
|
|
13459
|
-
className: `${CLASSNAME$
|
|
12727
|
+
className: `${CLASSNAME$1d}__input-validity`,
|
|
13460
12728
|
color: theme === Theme.dark ? 'light' : undefined,
|
|
13461
12729
|
icon: isValid ? mdiCheckCircle : mdiAlertCircle,
|
|
13462
12730
|
size: Size.xxs
|
|
13463
12731
|
}), clearButtonProps && isNotEmpty && /*#__PURE__*/React.createElement(IconButton, _extends({}, clearButtonProps, {
|
|
13464
|
-
className: `${CLASSNAME$
|
|
12732
|
+
className: `${CLASSNAME$1d}__input-clear`,
|
|
13465
12733
|
icon: mdiCloseCircle,
|
|
13466
12734
|
emphasis: Emphasis.low,
|
|
13467
12735
|
size: Size.s,
|
|
@@ -13469,20 +12737,20 @@ const TextField = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13469
12737
|
onClick: handleClear,
|
|
13470
12738
|
type: "button"
|
|
13471
12739
|
})), afterElement && /*#__PURE__*/React.createElement("div", {
|
|
13472
|
-
className: `${CLASSNAME$
|
|
12740
|
+
className: `${CLASSNAME$1d}__after-element`
|
|
13473
12741
|
}, afterElement)), hasError && error && /*#__PURE__*/React.createElement(InputHelper, {
|
|
13474
|
-
className: `${CLASSNAME$
|
|
12742
|
+
className: `${CLASSNAME$1d}__helper`,
|
|
13475
12743
|
kind: Kind.error,
|
|
13476
12744
|
theme: theme,
|
|
13477
12745
|
id: errorId
|
|
13478
12746
|
}, error), helper && /*#__PURE__*/React.createElement(InputHelper, {
|
|
13479
|
-
className: `${CLASSNAME$
|
|
12747
|
+
className: `${CLASSNAME$1d}__helper`,
|
|
13480
12748
|
theme: theme,
|
|
13481
12749
|
id: helperId
|
|
13482
12750
|
}, helper));
|
|
13483
12751
|
});
|
|
13484
|
-
TextField.displayName = COMPONENT_NAME$
|
|
13485
|
-
TextField.className = CLASSNAME$
|
|
12752
|
+
TextField.displayName = COMPONENT_NAME$1g;
|
|
12753
|
+
TextField.className = CLASSNAME$1d;
|
|
13486
12754
|
TextField.defaultProps = DEFAULT_PROPS$_;
|
|
13487
12755
|
|
|
13488
12756
|
function getState(img, event) {
|
|
@@ -13535,7 +12803,6 @@ function shiftPosition(_ref) {
|
|
|
13535
12803
|
const shift = startFocus / (scaledSize - containerSize);
|
|
13536
12804
|
return Math.floor(Math.max(Math.min(shift, 1), 0) * 100);
|
|
13537
12805
|
}
|
|
13538
|
-
|
|
13539
12806
|
// Compute CSS properties to apply the focus point.
|
|
13540
12807
|
const useFocusPointStyle = (_ref2, element, isLoaded) => {
|
|
13541
12808
|
let {
|
|
@@ -13628,7 +12895,7 @@ const useFocusPointStyle = (_ref2, element, isLoaded) => {
|
|
|
13628
12895
|
return style;
|
|
13629
12896
|
};
|
|
13630
12897
|
|
|
13631
|
-
const _excluded$
|
|
12898
|
+
const _excluded$1m = ["align", "alt", "aspectRatio", "badge", "className", "crossOrigin", "fallback", "fillHeight", "focusPoint", "image", "imgProps", "imgRef", "isLoading", "objectFit", "loading", "loadingPlaceholderImageRef", "size", "theme", "variant", "linkProps", "linkAs"];
|
|
13632
12899
|
|
|
13633
12900
|
/**
|
|
13634
12901
|
* Defines the props of the component.
|
|
@@ -13637,12 +12904,12 @@ const _excluded$1p = ["align", "alt", "aspectRatio", "badge", "className", "cros
|
|
|
13637
12904
|
/**
|
|
13638
12905
|
* Component display name.
|
|
13639
12906
|
*/
|
|
13640
|
-
const COMPONENT_NAME$
|
|
12907
|
+
const COMPONENT_NAME$1h = 'Thumbnail';
|
|
13641
12908
|
|
|
13642
12909
|
/**
|
|
13643
12910
|
* Component default class name and class prefix.
|
|
13644
12911
|
*/
|
|
13645
|
-
const CLASSNAME$
|
|
12912
|
+
const CLASSNAME$1e = getRootClassName(COMPONENT_NAME$1h);
|
|
13646
12913
|
|
|
13647
12914
|
/**
|
|
13648
12915
|
* Component default props.
|
|
@@ -13687,7 +12954,7 @@ const Thumbnail = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13687
12954
|
linkProps,
|
|
13688
12955
|
linkAs
|
|
13689
12956
|
} = props,
|
|
13690
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
12957
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1m);
|
|
13691
12958
|
const [imgElement, setImgElement] = useState();
|
|
13692
12959
|
|
|
13693
12960
|
// Image loading state.
|
|
@@ -13734,7 +13001,7 @@ const Thumbnail = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13734
13001
|
className: classnames(linkProps === null || linkProps === void 0 ? void 0 : linkProps.className, className, handleBasicClasses({
|
|
13735
13002
|
align,
|
|
13736
13003
|
aspectRatio,
|
|
13737
|
-
prefix: CLASSNAME$
|
|
13004
|
+
prefix: CLASSNAME$1e,
|
|
13738
13005
|
size,
|
|
13739
13006
|
theme,
|
|
13740
13007
|
variant,
|
|
@@ -13745,9 +13012,9 @@ const Thumbnail = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13745
13012
|
isLoading,
|
|
13746
13013
|
objectFit,
|
|
13747
13014
|
hasBadge: !!badge
|
|
13748
|
-
}), fillHeight && `${CLASSNAME$
|
|
13015
|
+
}), fillHeight && `${CLASSNAME$1e}--fill-height`)
|
|
13749
13016
|
}), /*#__PURE__*/React.createElement("span", {
|
|
13750
|
-
className: `${CLASSNAME$
|
|
13017
|
+
className: `${CLASSNAME$1e}__background`
|
|
13751
13018
|
}, /*#__PURE__*/React.createElement("img", _extends({
|
|
13752
13019
|
// Use placeholder image size
|
|
13753
13020
|
width: loadingPlaceholderImage === null || loadingPlaceholderImage === void 0 ? void 0 : loadingPlaceholderImage.naturalWidth,
|
|
@@ -13759,7 +13026,7 @@ const Thumbnail = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13759
13026
|
}, imgProps === null || imgProps === void 0 ? void 0 : imgProps.style), imageErrorStyle), focusPointStyle), loadingStyle),
|
|
13760
13027
|
ref: useMergeRefs(setImgElement, propImgRef),
|
|
13761
13028
|
className: classnames(handleBasicClasses({
|
|
13762
|
-
prefix: `${CLASSNAME$
|
|
13029
|
+
prefix: `${CLASSNAME$1e}__image`,
|
|
13763
13030
|
isLoading,
|
|
13764
13031
|
hasDefinedSize: Boolean((imgProps === null || imgProps === void 0 ? void 0 : imgProps.height) && imgProps.width)
|
|
13765
13032
|
}), imgProps === null || imgProps === void 0 ? void 0 : imgProps.className),
|
|
@@ -13768,17 +13035,17 @@ const Thumbnail = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13768
13035
|
alt: alt,
|
|
13769
13036
|
loading: loading
|
|
13770
13037
|
})), !isLoading && hasError && /*#__PURE__*/React.createElement("span", {
|
|
13771
|
-
className: `${CLASSNAME$
|
|
13038
|
+
className: `${CLASSNAME$1e}__fallback`
|
|
13772
13039
|
}, hasIconErrorFallback ? /*#__PURE__*/React.createElement(Icon, {
|
|
13773
13040
|
icon: fallback,
|
|
13774
13041
|
size: Size.xxs,
|
|
13775
13042
|
theme: theme
|
|
13776
13043
|
}) : fallback)), badge && /*#__PURE__*/React.cloneElement(badge, {
|
|
13777
|
-
className: classnames(`${CLASSNAME$
|
|
13044
|
+
className: classnames(`${CLASSNAME$1e}__badge`, badge.props.className)
|
|
13778
13045
|
}));
|
|
13779
13046
|
});
|
|
13780
|
-
Thumbnail.displayName = COMPONENT_NAME$
|
|
13781
|
-
Thumbnail.className = CLASSNAME$
|
|
13047
|
+
Thumbnail.displayName = COMPONENT_NAME$1h;
|
|
13048
|
+
Thumbnail.className = CLASSNAME$1e;
|
|
13782
13049
|
Thumbnail.defaultProps = DEFAULT_PROPS$$;
|
|
13783
13050
|
|
|
13784
13051
|
/**
|
|
@@ -13816,7 +13083,7 @@ const ThumbnailObjectFit = {
|
|
|
13816
13083
|
contain: 'contain'
|
|
13817
13084
|
};
|
|
13818
13085
|
|
|
13819
|
-
const _excluded$
|
|
13086
|
+
const _excluded$1n = ["after", "before", "className", "label"];
|
|
13820
13087
|
|
|
13821
13088
|
/**
|
|
13822
13089
|
* Defines the props of the component.
|
|
@@ -13825,12 +13092,12 @@ const _excluded$1q = ["after", "before", "className", "label"];
|
|
|
13825
13092
|
/**
|
|
13826
13093
|
* Component display name.
|
|
13827
13094
|
*/
|
|
13828
|
-
const COMPONENT_NAME$
|
|
13095
|
+
const COMPONENT_NAME$1i = 'Toolbar';
|
|
13829
13096
|
|
|
13830
13097
|
/**
|
|
13831
13098
|
* Component default class name and class prefix.
|
|
13832
13099
|
*/
|
|
13833
|
-
const CLASSNAME$
|
|
13100
|
+
const CLASSNAME$1f = getRootClassName(COMPONENT_NAME$1i);
|
|
13834
13101
|
|
|
13835
13102
|
/**
|
|
13836
13103
|
* Component default props.
|
|
@@ -13851,7 +13118,7 @@ const Toolbar = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13851
13118
|
className,
|
|
13852
13119
|
label
|
|
13853
13120
|
} = props,
|
|
13854
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
13121
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1n);
|
|
13855
13122
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
13856
13123
|
ref: ref
|
|
13857
13124
|
}, forwardedProps, {
|
|
@@ -13859,18 +13126,18 @@ const Toolbar = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
13859
13126
|
hasAfter: Boolean(after),
|
|
13860
13127
|
hasBefore: Boolean(before),
|
|
13861
13128
|
hasLabel: Boolean(label),
|
|
13862
|
-
prefix: CLASSNAME$
|
|
13129
|
+
prefix: CLASSNAME$1f
|
|
13863
13130
|
}))
|
|
13864
13131
|
}), before && /*#__PURE__*/React.createElement("div", {
|
|
13865
|
-
className: `${CLASSNAME$
|
|
13132
|
+
className: `${CLASSNAME$1f}__before`
|
|
13866
13133
|
}, before), label && /*#__PURE__*/React.createElement("div", {
|
|
13867
|
-
className: `${CLASSNAME$
|
|
13134
|
+
className: `${CLASSNAME$1f}__label`
|
|
13868
13135
|
}, label), after && /*#__PURE__*/React.createElement("div", {
|
|
13869
|
-
className: `${CLASSNAME$
|
|
13136
|
+
className: `${CLASSNAME$1f}__after`
|
|
13870
13137
|
}, after));
|
|
13871
13138
|
});
|
|
13872
|
-
Toolbar.displayName = COMPONENT_NAME$
|
|
13873
|
-
Toolbar.className = CLASSNAME$
|
|
13139
|
+
Toolbar.displayName = COMPONENT_NAME$1i;
|
|
13140
|
+
Toolbar.className = CLASSNAME$1f;
|
|
13874
13141
|
Toolbar.defaultProps = DEFAULT_PROPS$10;
|
|
13875
13142
|
|
|
13876
13143
|
/**
|
|
@@ -14048,7 +13315,7 @@ function useTooltipOpen(delay, anchorElement) {
|
|
|
14048
13315
|
};
|
|
14049
13316
|
}
|
|
14050
13317
|
|
|
14051
|
-
const _excluded$
|
|
13318
|
+
const _excluded$1o = ["label", "children", "className", "delay", "placement", "forceOpen"];
|
|
14052
13319
|
|
|
14053
13320
|
/** Position of the tooltip relative to the anchor element. */
|
|
14054
13321
|
|
|
@@ -14059,12 +13326,12 @@ const _excluded$1r = ["label", "children", "className", "delay", "placement", "f
|
|
|
14059
13326
|
/**
|
|
14060
13327
|
* Component display name.
|
|
14061
13328
|
*/
|
|
14062
|
-
const COMPONENT_NAME$
|
|
13329
|
+
const COMPONENT_NAME$1j = 'Tooltip';
|
|
14063
13330
|
|
|
14064
13331
|
/**
|
|
14065
13332
|
* Component default class name and class prefix.
|
|
14066
13333
|
*/
|
|
14067
|
-
const CLASSNAME$
|
|
13334
|
+
const CLASSNAME$1g = getRootClassName(COMPONENT_NAME$1j);
|
|
14068
13335
|
|
|
14069
13336
|
/**
|
|
14070
13337
|
* Component default props.
|
|
@@ -14095,7 +13362,7 @@ const Tooltip = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
14095
13362
|
placement,
|
|
14096
13363
|
forceOpen
|
|
14097
13364
|
} = props,
|
|
14098
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
13365
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1o);
|
|
14099
13366
|
// Disable in SSR or without a label.
|
|
14100
13367
|
if (!DOCUMENT || !label) {
|
|
14101
13368
|
return /*#__PURE__*/React.createElement(TooltipContextProvider, null, children);
|
|
@@ -14129,23 +13396,23 @@ const Tooltip = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
14129
13396
|
role: "tooltip",
|
|
14130
13397
|
"aria-label": label,
|
|
14131
13398
|
className: classnames(className, handleBasicClasses({
|
|
14132
|
-
prefix: CLASSNAME$
|
|
13399
|
+
prefix: CLASSNAME$1g,
|
|
14133
13400
|
position
|
|
14134
13401
|
})),
|
|
14135
13402
|
style: styles.popper
|
|
14136
13403
|
}, attributes.popper), /*#__PURE__*/React.createElement("div", {
|
|
14137
|
-
className: `${CLASSNAME$
|
|
13404
|
+
className: `${CLASSNAME$1g}__arrow`
|
|
14138
13405
|
}), /*#__PURE__*/React.createElement("div", {
|
|
14139
|
-
className: `${CLASSNAME$
|
|
13406
|
+
className: `${CLASSNAME$1g}__inner`
|
|
14140
13407
|
}, label.indexOf('\n') !== -1 ? label.split('\n').map(sentence => /*#__PURE__*/React.createElement("p", {
|
|
14141
13408
|
key: sentence
|
|
14142
13409
|
}, sentence)) : label)), document.body));
|
|
14143
13410
|
});
|
|
14144
|
-
Tooltip.displayName = COMPONENT_NAME$
|
|
14145
|
-
Tooltip.className = CLASSNAME$
|
|
13411
|
+
Tooltip.displayName = COMPONENT_NAME$1j;
|
|
13412
|
+
Tooltip.className = CLASSNAME$1g;
|
|
14146
13413
|
Tooltip.defaultProps = DEFAULT_PROPS$11;
|
|
14147
13414
|
|
|
14148
|
-
const _excluded$
|
|
13415
|
+
const _excluded$1p = ["aspectRatio", "className", "label", "icon", "size", "theme", "variant", "fileInputProps"];
|
|
14149
13416
|
|
|
14150
13417
|
/**
|
|
14151
13418
|
* Uploader variants.
|
|
@@ -14171,12 +13438,12 @@ const UploaderVariant = {
|
|
|
14171
13438
|
/**
|
|
14172
13439
|
* Component display name.
|
|
14173
13440
|
*/
|
|
14174
|
-
const COMPONENT_NAME$
|
|
13441
|
+
const COMPONENT_NAME$1k = 'Uploader';
|
|
14175
13442
|
|
|
14176
13443
|
/**
|
|
14177
13444
|
* Component default class name and class prefix.
|
|
14178
13445
|
*/
|
|
14179
|
-
const CLASSNAME$
|
|
13446
|
+
const CLASSNAME$1h = getRootClassName(COMPONENT_NAME$1k);
|
|
14180
13447
|
|
|
14181
13448
|
/**
|
|
14182
13449
|
* Component default props.
|
|
@@ -14206,7 +13473,7 @@ const Uploader = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
14206
13473
|
variant,
|
|
14207
13474
|
fileInputProps
|
|
14208
13475
|
} = props,
|
|
14209
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
13476
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1p);
|
|
14210
13477
|
// Adjust to square aspect ratio when using circle variants.
|
|
14211
13478
|
const adjustedAspectRatio = variant === UploaderVariant.circle ? AspectRatio.square : aspectRatio;
|
|
14212
13479
|
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]);
|
|
@@ -14235,26 +13502,26 @@ const Uploader = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
14235
13502
|
}, wrapper.props, forwardedProps, {
|
|
14236
13503
|
className: classnames(className, handleBasicClasses({
|
|
14237
13504
|
aspectRatio: adjustedAspectRatio,
|
|
14238
|
-
prefix: CLASSNAME$
|
|
13505
|
+
prefix: CLASSNAME$1h,
|
|
14239
13506
|
size,
|
|
14240
13507
|
theme,
|
|
14241
13508
|
variant,
|
|
14242
13509
|
isDragHovering
|
|
14243
13510
|
}))
|
|
14244
13511
|
}), /*#__PURE__*/React.createElement("span", {
|
|
14245
|
-
className: `${CLASSNAME$
|
|
13512
|
+
className: `${CLASSNAME$1h}__background`
|
|
14246
13513
|
}), /*#__PURE__*/React.createElement("span", {
|
|
14247
|
-
className: `${CLASSNAME$
|
|
13514
|
+
className: `${CLASSNAME$1h}__wrapper`
|
|
14248
13515
|
}, icon && /*#__PURE__*/React.createElement(Icon, {
|
|
14249
|
-
className: `${CLASSNAME$
|
|
13516
|
+
className: `${CLASSNAME$1h}__icon`,
|
|
14250
13517
|
icon: icon,
|
|
14251
13518
|
size: Size.s
|
|
14252
13519
|
}), label && /*#__PURE__*/React.createElement("span", {
|
|
14253
|
-
className: `${CLASSNAME$
|
|
13520
|
+
className: `${CLASSNAME$1h}__label`
|
|
14254
13521
|
}, label)), fileInputProps && /*#__PURE__*/React.createElement("input", _extends({
|
|
14255
13522
|
type: "file",
|
|
14256
13523
|
id: inputId,
|
|
14257
|
-
className: `${CLASSNAME$
|
|
13524
|
+
className: `${CLASSNAME$1h}__input`
|
|
14258
13525
|
}, fileInputProps, {
|
|
14259
13526
|
onChange: onChange,
|
|
14260
13527
|
onDragEnter: setDragHovering,
|
|
@@ -14262,11 +13529,11 @@ const Uploader = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
14262
13529
|
onDrop: unsetDragHovering
|
|
14263
13530
|
})));
|
|
14264
13531
|
});
|
|
14265
|
-
Uploader.displayName = COMPONENT_NAME$
|
|
14266
|
-
Uploader.className = CLASSNAME$
|
|
13532
|
+
Uploader.displayName = COMPONENT_NAME$1k;
|
|
13533
|
+
Uploader.className = CLASSNAME$1h;
|
|
14267
13534
|
Uploader.defaultProps = DEFAULT_PROPS$12;
|
|
14268
13535
|
|
|
14269
|
-
const _excluded$
|
|
13536
|
+
const _excluded$1q = ["avatarProps", "className", "fields", "linkProps", "linkAs", "multipleActions", "name", "nameProps", "onClick", "onMouseEnter", "onMouseLeave", "orientation", "simpleAction", "size", "theme"];
|
|
14270
13537
|
|
|
14271
13538
|
/**
|
|
14272
13539
|
* User block sizes.
|
|
@@ -14279,12 +13546,12 @@ const _excluded$1t = ["avatarProps", "className", "fields", "linkProps", "linkAs
|
|
|
14279
13546
|
/**
|
|
14280
13547
|
* Component display name.
|
|
14281
13548
|
*/
|
|
14282
|
-
const COMPONENT_NAME$
|
|
13549
|
+
const COMPONENT_NAME$1l = 'UserBlock';
|
|
14283
13550
|
|
|
14284
13551
|
/**
|
|
14285
13552
|
* Component default class name and class prefix.
|
|
14286
13553
|
*/
|
|
14287
|
-
const CLASSNAME$
|
|
13554
|
+
const CLASSNAME$1i = getRootClassName(COMPONENT_NAME$1l);
|
|
14288
13555
|
|
|
14289
13556
|
/**
|
|
14290
13557
|
* Component default props.
|
|
@@ -14320,7 +13587,7 @@ const UserBlock = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
14320
13587
|
size,
|
|
14321
13588
|
theme
|
|
14322
13589
|
} = props,
|
|
14323
|
-
forwardedProps = _objectWithoutProperties(props, _excluded$
|
|
13590
|
+
forwardedProps = _objectWithoutProperties(props, _excluded$1q);
|
|
14324
13591
|
let componentSize = size;
|
|
14325
13592
|
|
|
14326
13593
|
// Special case - When using vertical orientation force the size to be Sizes.l.
|
|
@@ -14336,7 +13603,7 @@ const UserBlock = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
14336
13603
|
}
|
|
14337
13604
|
let NameComponent = 'span';
|
|
14338
13605
|
const nProps = _objectSpread2(_objectSpread2({}, nameProps), {}, {
|
|
14339
|
-
className: classnames(`${CLASSNAME$
|
|
13606
|
+
className: classnames(`${CLASSNAME$1i}__name`, linkProps === null || linkProps === void 0 ? void 0 : linkProps.className, nameProps === null || nameProps === void 0 ? void 0 : nameProps.className)
|
|
14340
13607
|
});
|
|
14341
13608
|
if (isClickable) {
|
|
14342
13609
|
NameComponent = Link;
|
|
@@ -14353,16 +13620,16 @@ const UserBlock = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
14353
13620
|
return /*#__PURE__*/React.createElement(NameComponent, nProps, name);
|
|
14354
13621
|
}, [avatarProps, isClickable, linkAs, linkProps, name, nameProps, onClick]);
|
|
14355
13622
|
const fieldsBlock = fields && componentSize !== Size.s && /*#__PURE__*/React.createElement("div", {
|
|
14356
|
-
className: `${CLASSNAME$
|
|
13623
|
+
className: `${CLASSNAME$1i}__fields`
|
|
14357
13624
|
}, fields.map((field, idx) => /*#__PURE__*/React.createElement("span", {
|
|
14358
13625
|
key: idx,
|
|
14359
|
-
className: `${CLASSNAME$
|
|
13626
|
+
className: `${CLASSNAME$1i}__field`
|
|
14360
13627
|
}, field)));
|
|
14361
13628
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
14362
13629
|
ref: ref
|
|
14363
13630
|
}, forwardedProps, {
|
|
14364
13631
|
className: classnames(className, handleBasicClasses({
|
|
14365
|
-
prefix: CLASSNAME$
|
|
13632
|
+
prefix: CLASSNAME$1i,
|
|
14366
13633
|
orientation,
|
|
14367
13634
|
size: componentSize,
|
|
14368
13635
|
theme,
|
|
@@ -14375,21 +13642,21 @@ const UserBlock = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
14375
13642
|
linkProps: linkProps,
|
|
14376
13643
|
alt: ""
|
|
14377
13644
|
}, avatarProps, {
|
|
14378
|
-
className: classnames(`${CLASSNAME$
|
|
13645
|
+
className: classnames(`${CLASSNAME$1i}__avatar`, avatarProps.className),
|
|
14379
13646
|
size: componentSize,
|
|
14380
13647
|
onClick: onClick,
|
|
14381
13648
|
theme: theme
|
|
14382
13649
|
})), (fields || name) && /*#__PURE__*/React.createElement("div", {
|
|
14383
|
-
className: `${CLASSNAME$
|
|
13650
|
+
className: `${CLASSNAME$1i}__wrapper`
|
|
14384
13651
|
}, nameBlock, fieldsBlock), shouldDisplayActions && simpleAction && /*#__PURE__*/React.createElement("div", {
|
|
14385
|
-
className: `${CLASSNAME$
|
|
13652
|
+
className: `${CLASSNAME$1i}__action`
|
|
14386
13653
|
}, simpleAction), shouldDisplayActions && multipleActions && /*#__PURE__*/React.createElement("div", {
|
|
14387
|
-
className: `${CLASSNAME$
|
|
13654
|
+
className: `${CLASSNAME$1i}__actions`
|
|
14388
13655
|
}, multipleActions));
|
|
14389
13656
|
});
|
|
14390
|
-
UserBlock.displayName = COMPONENT_NAME$
|
|
14391
|
-
UserBlock.className = CLASSNAME$
|
|
13657
|
+
UserBlock.displayName = COMPONENT_NAME$1l;
|
|
13658
|
+
UserBlock.className = CLASSNAME$1i;
|
|
14392
13659
|
UserBlock.defaultProps = DEFAULT_PROPS$13;
|
|
14393
13660
|
|
|
14394
|
-
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,
|
|
13661
|
+
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 };
|
|
14395
13662
|
//# sourceMappingURL=index.js.map
|