@arc-ui/components 12.0.0-beta.21 → 12.0.0-beta.23
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/lib/Alert/Alert.cjs +41 -14
- package/lib/Alert/Alert.mjs +42 -15
- package/lib/Alert/styles.css +1 -1
- package/lib/Align/styles.css +1 -1
- package/lib/AppButton/styles.css +1 -1
- package/lib/Avatar/styles.css +1 -1
- package/lib/AvatarGroup/styles.css +1 -1
- package/lib/Badge/styles.css +1 -1
- package/lib/Banner/Banner.cjs +1 -1
- package/lib/Banner/Banner.mjs +1 -1
- package/lib/Box/styles.css +1 -1
- package/lib/BrandLogo/styles.css +1 -1
- package/lib/Breadcrumbs/Breadcrumbs.cjs +12 -3
- package/lib/Breadcrumbs/Breadcrumbs.mjs +12 -3
- package/lib/Breadcrumbs/styles.css +1 -1
- package/lib/Button/styles.css +1 -1
- package/lib/ButtonGroup/styles.css +1 -1
- package/lib/ButtonV2/styles.css +1 -1
- package/lib/Calendar/Calendar.cjs +2 -2
- package/lib/Calendar/Calendar.mjs +2 -2
- package/lib/Calendar/styles.css +1 -1
- package/lib/CardFooter/styles.css +1 -1
- package/lib/CardHeading/styles.css +1 -1
- package/lib/Carousel/Carousel.cjs +11 -5
- package/lib/Carousel/Carousel.mjs +8 -2
- package/lib/Carousel/styles.css +1 -1
- package/lib/Checkbox/Checkbox.cjs +85 -11
- package/lib/Checkbox/Checkbox.mjs +87 -9
- package/lib/Checkbox/styles.css +1 -1
- package/lib/Columns/styles.css +1 -1
- package/lib/ComboBox/ComboBox.cjs +276 -11
- package/lib/ComboBox/ComboBox.mjs +279 -10
- package/lib/ComboBox/styles.css +1 -1
- package/lib/ContentSwitcher/ContentSwitcher.cjs +5 -6
- package/lib/ContentSwitcher/ContentSwitcher.mjs +5 -6
- package/lib/ContentSwitcher/styles.css +1 -1
- package/lib/ContentSwitcherDropdown/styles.css +1 -1
- package/lib/DatePicker/DatePicker.cjs +351 -38
- package/lib/DatePicker/DatePicker.mjs +329 -17
- package/lib/DatePicker/styles.css +1 -1
- package/lib/Disclosure/styles.css +1 -1
- package/lib/DisclosureMini/styles.css +1 -1
- package/lib/Download/styles.css +1 -1
- package/lib/Drawer/Drawer.cjs +58 -10
- package/lib/Drawer/Drawer.mjs +55 -7
- package/lib/Drawer/styles.css +1 -1
- package/lib/Elevation/styles.css +1 -1
- package/lib/Filter/styles.css +1 -1
- package/lib/FormControl/styles.css +1 -1
- package/lib/GhostedHeroBanner/styles.css +1 -1
- package/lib/GradientPageBackground/GradientPageBackground.cjs +55 -43
- package/lib/GradientPageBackground/GradientPageBackground.mjs +55 -43
- package/lib/GradientPageBackground/styles.css +1 -1
- package/lib/Grid/styles.css +1 -1
- package/lib/Group/styles.css +1 -1
- package/lib/Heading/styles.css +1 -1
- package/lib/HeroBanner/HeroBanner.cjs +1 -1
- package/lib/HeroBanner/HeroBanner.mjs +1 -1
- package/lib/HeroBanner/styles.css +1 -1
- package/lib/HeroButton/HeroButton.cjs +77 -9
- package/lib/HeroButton/HeroButton.mjs +80 -8
- package/lib/HeroButton/styles.css +1 -1
- package/lib/Hidden/styles.css +1 -1
- package/lib/HorizontalCard/styles.css +1 -1
- package/lib/Icon/styles.css +1 -1
- package/lib/Image/styles.css +1 -1
- package/lib/ImpactCard/ImpactCard.cjs +3 -3
- package/lib/ImpactCard/ImpactCard.mjs +3 -3
- package/lib/ImpactCard/styles.css +1 -1
- package/lib/InformationCard/InformationCard.cjs +6 -6
- package/lib/InformationCard/InformationCard.mjs +6 -6
- package/lib/InformationCard/styles.css +1 -1
- package/lib/Link/Link.cjs +8 -51
- package/lib/Link/Link.mjs +7 -54
- package/lib/Link/styles.css +1 -1
- package/lib/Markup/styles.css +1 -1
- package/lib/MediaCard/MediaCard.cjs +53 -14
- package/lib/MediaCard/MediaCard.mjs +55 -12
- package/lib/MediaCard/styles.css +1 -1
- package/lib/Menu/Menu.cjs +1327 -25
- package/lib/Menu/Menu.mjs +1293 -10
- package/lib/Menu/styles.css +1 -1
- package/lib/Modal/styles.css +1 -1
- package/lib/NavigationHeader/NavigationHeader.cjs +854 -62
- package/lib/NavigationHeader/NavigationHeader.mjs +842 -50
- package/lib/NavigationHeader/styles.css +1 -1
- package/lib/Pagination/styles.css +1 -1
- package/lib/PaginationSimple/styles.css +1 -1
- package/lib/Popover/styles.css +1 -1
- package/lib/Poster/styles.css +1 -1
- package/lib/ProgressBar/styles.css +1 -1
- package/lib/ProgressStepper/styles.css +1 -1
- package/lib/ProgressStepperOverflow/ProgressStepperOverflow.cjs +138 -7
- package/lib/ProgressStepperOverflow/ProgressStepperOverflow.mjs +140 -5
- package/lib/ProgressStepperOverflow/styles.css +1 -1
- package/lib/RadioCardGroup/RadioCardGroup.cjs +48 -7
- package/lib/RadioCardGroup/RadioCardGroup.mjs +48 -8
- package/lib/RadioCardGroup/styles.css +1 -1
- package/lib/RadioGroup/RadioGroup.cjs +50 -8
- package/lib/RadioGroup/RadioGroup.mjs +49 -8
- package/lib/RadioGroup/styles.css +1 -1
- package/lib/Rule/styles.css +1 -1
- package/lib/ScrollToTop/styles.css +1 -1
- package/lib/Section/Section.cjs +1 -1
- package/lib/Section/Section.mjs +1 -1
- package/lib/Section/styles.css +1 -1
- package/lib/Select/styles.css +1 -1
- package/lib/SiteFooter/SiteFooter.cjs +2 -2
- package/lib/SiteFooter/SiteFooter.mjs +2 -2
- package/lib/SiteFooter/styles.css +1 -1
- package/lib/SiteFooterV2/SiteFooterV2.cjs +7 -6
- package/lib/SiteFooterV2/SiteFooterV2.mjs +7 -6
- package/lib/SiteFooterV2/styles.css +1 -1
- package/lib/SiteHeaderV2/SiteHeaderV2.cjs +440 -15
- package/lib/SiteHeaderV2/SiteHeaderV2.mjs +435 -11
- package/lib/SiteHeaderV2/styles.css +1 -1
- package/lib/Skeleton/styles.css +1 -1
- package/lib/SkipLink/styles.css +1 -1
- package/lib/Spinner/styles.css +1 -1
- package/lib/Surface/styles.css +1 -1
- package/lib/Switch/styles.css +1 -1
- package/lib/TabbedBanner/TabbedBanner.cjs +22 -35
- package/lib/TabbedBanner/TabbedBanner.mjs +25 -38
- package/lib/TabbedBanner/styles.css +1 -1
- package/lib/Tabs/Tabs.cjs +2 -2
- package/lib/Tabs/Tabs.mjs +3 -3
- package/lib/Tabs/styles.css +1 -1
- package/lib/Tag/Tag.cjs +9 -9
- package/lib/Tag/Tag.mjs +9 -9
- package/lib/Tag/styles.css +1 -1
- package/lib/TemplateBanner/TemplateBanner.cjs +1 -1
- package/lib/TemplateBanner/TemplateBanner.mjs +1 -1
- package/lib/TemplateBanner/styles.css +1 -1
- package/lib/Text/styles.css +1 -1
- package/lib/TextArea/TextArea.cjs +2 -53
- package/lib/TextArea/TextArea.mjs +2 -53
- package/lib/TextArea/styles.css +1 -1
- package/lib/TextInput/styles.css +1 -1
- package/lib/Theme/Theme.cjs +1 -1
- package/lib/Theme/Theme.mjs +1 -1
- package/lib/Theme/styles.css +1 -1
- package/lib/ThemeIcon/styles.css +1 -1
- package/lib/ThumbnailSignpost/styles.css +1 -1
- package/lib/Toast/styles.css +1 -1
- package/lib/Tooltip/styles.css +1 -1
- package/lib/Truncate/styles.css +1 -1
- package/lib/TypographyCard/TypographyCard.cjs +3 -3
- package/lib/TypographyCard/TypographyCard.mjs +3 -3
- package/lib/TypographyCard/styles.css +1 -1
- package/lib/UniversalHeader/styles.css +1 -1
- package/lib/VerticalSpace/styles.css +1 -1
- package/lib/VideoPlayer/styles.css +1 -1
- package/lib/Visible/styles.css +1 -1
- package/lib/VisuallyHidden/styles.css +1 -1
- package/lib/_shared/cjs/{Calendar-BcNtpbeY.cjs → Calendar-Bfdgf5q1.cjs} +1 -1
- package/lib/_shared/cjs/{ContentSwitcherList-NJN4H2Z-.cjs → ContentSwitcherList-pcYtuT6L.cjs} +10 -2
- package/lib/_shared/cjs/Link-C3OSQIIk.cjs +50 -0
- package/lib/_shared/cjs/{Section-wUVdzmGA.cjs → Section-Bz2fwj8Z.cjs} +2 -2
- package/lib/_shared/cjs/{TemplateBanner-D2y2XmR2.cjs → TemplateBanner-COymAI91.cjs} +14 -3
- package/lib/_shared/cjs/{arc-breakpoints--lzoExiR.cjs → arc-breakpoints-CS8JVk5T.cjs} +1 -1
- package/lib/_shared/cjs/{index.es-Th2hutNO.cjs → index.es-fkulh7qu.cjs} +1 -1
- package/lib/_shared/esm/{Calendar-ugZV8KxD.mjs → Calendar-Drh_NJ9I.mjs} +1 -1
- package/lib/_shared/esm/{ContentSwitcherList-BN2jzXel.mjs → ContentSwitcherList-DwHfU3no.mjs} +12 -5
- package/lib/_shared/esm/Link-DxjGH_7f.mjs +48 -0
- package/lib/_shared/esm/{Section-DDygQ5Az.mjs → Section-7InCvzfh.mjs} +2 -2
- package/lib/_shared/esm/{TemplateBanner-C_mDNU5j.mjs → TemplateBanner-Dkgzu3A5.mjs} +14 -3
- package/lib/_shared/esm/{arc-breakpoints-DnWZ2-TX.mjs → arc-breakpoints-D7Ie4kBt.mjs} +1 -1
- package/lib/_shared/esm/{index-BDWwJ5x2.mjs → index-BWkI4Dwz.mjs} +1 -1
- package/lib/_shared/esm/{index.es-Bo660IGW.mjs → index.es-CtRkzfKP.mjs} +1 -1
- package/lib/index.cjs +374 -272
- package/lib/index.cjs.map +1 -1
- package/lib/index.d.cts +223 -128
- package/lib/index.d.mts +223 -128
- package/lib/index.js.map +1 -1
- package/lib/index.mjs +375 -273
- package/lib/index.mjs.map +1 -1
- package/lib/styles.css +12 -8
- package/package.json +8 -8
- package/lib/_shared/cjs/BreadcrumbsLink-CDmk3Y3m.cjs +0 -18
- package/lib/_shared/cjs/Checkbox-DfZMjO1Y.cjs +0 -88
- package/lib/_shared/cjs/ComboBox-BGUhlqx1.cjs +0 -281
- package/lib/_shared/cjs/ContentSwitcherTab-B387Qs3I.cjs +0 -14
- package/lib/_shared/cjs/DatePicker-Bdw9VFZ4.cjs +0 -334
- package/lib/_shared/cjs/DrawerContent-DifTc6g9.cjs +0 -62
- package/lib/_shared/cjs/HeroButton-CrzkTUwP.cjs +0 -82
- package/lib/_shared/cjs/MediaCard-BEZFbiYO.cjs +0 -57
- package/lib/_shared/cjs/MenuItemMultiLevelContent-vLr6hSBm.cjs +0 -1328
- package/lib/_shared/cjs/ProgressStepperOverflow-BAGZNC26.cjs +0 -142
- package/lib/_shared/cjs/RadioCardGroupInput-CeUM3yPS.cjs +0 -53
- package/lib/_shared/cjs/RadioGroupInput-w2qkfsnG.cjs +0 -54
- package/lib/_shared/cjs/SiteHeaderV2NavItemWithSubNav-Cd0f-Yof.cjs +0 -445
- package/lib/_shared/cjs/kebabCase-CThj4IzG.cjs +0 -735
- package/lib/_shared/cjs/keynames-Cx13-hWr.cjs +0 -8
- package/lib/_shared/esm/BreadcrumbsLink-BxTurGNa.mjs +0 -16
- package/lib/_shared/esm/Checkbox-CwOHzlQF.mjs +0 -86
- package/lib/_shared/esm/ComboBox-CRlJjeev.mjs +0 -279
- package/lib/_shared/esm/ContentSwitcherTab-CfC3PGeZ.mjs +0 -12
- package/lib/_shared/esm/DatePicker-CCctia-s.mjs +0 -324
- package/lib/_shared/esm/DrawerContent-D6bAU8EQ.mjs +0 -58
- package/lib/_shared/esm/HeroButton-jdjjV_Gf.mjs +0 -80
- package/lib/_shared/esm/MediaCard-DqMaNWsE.mjs +0 -55
- package/lib/_shared/esm/MenuItemMultiLevelContent-JTOHqpzg.mjs +0 -1296
- package/lib/_shared/esm/ProgressStepperOverflow-fPkLltVO.mjs +0 -140
- package/lib/_shared/esm/RadioCardGroupInput-D7W28geB.mjs +0 -50
- package/lib/_shared/esm/RadioGroupInput-zAWSV29m.mjs +0 -50
- package/lib/_shared/esm/SiteHeaderV2NavItemWithSubNav-XbvJNiSo.mjs +0 -439
- package/lib/_shared/esm/kebabCase-CHRdSZ4y.mjs +0 -730
- package/lib/_shared/esm/keynames-B5whqsjh.mjs +0 -8
|
@@ -1,324 +0,0 @@
|
|
|
1
|
-
import { b as __spreadArray, _ as __rest, a as __assign, f as filterAttrs } from './filter-attrs-B6CM-NUr.mjs';
|
|
2
|
-
import React__default, { forwardRef, useState, useRef, useEffect } from 'react';
|
|
3
|
-
import { c as classNames } from './index-5C0-U8cc.mjs';
|
|
4
|
-
import { R as Root2, A as Anchor2, P as Portal, C as Content2 } from './index-CxrL7jIX.mjs';
|
|
5
|
-
import { i as isBefore, a as isAfter, c as compareAsc, C as Calendar } from './Calendar-ugZV8KxD.mjs';
|
|
6
|
-
import { r as requiredArgs, t as toDate, a as isValid, f as format } from './index-Cr6KeQLU.mjs';
|
|
7
|
-
import { e as useThemeElement } from './index-Bz2JQq34.mjs';
|
|
8
|
-
import { a as TextInputWithPlaceHolder } from './TextInput-Dk7qNGoh.mjs';
|
|
9
|
-
|
|
10
|
-
/**
|
|
11
|
-
* @name startOfDay
|
|
12
|
-
* @category Day Helpers
|
|
13
|
-
* @summary Return the start of a day for the given date.
|
|
14
|
-
*
|
|
15
|
-
* @description
|
|
16
|
-
* Return the start of a day for the given date.
|
|
17
|
-
* The result will be in the local timezone.
|
|
18
|
-
*
|
|
19
|
-
* @param {Date|Number} date - the original date
|
|
20
|
-
* @returns {Date} the start of a day
|
|
21
|
-
* @throws {TypeError} 1 argument required
|
|
22
|
-
*
|
|
23
|
-
* @example
|
|
24
|
-
* // The start of a day for 2 September 2014 11:55:00:
|
|
25
|
-
* const result = startOfDay(new Date(2014, 8, 2, 11, 55, 0))
|
|
26
|
-
* //=> Tue Sep 02 2014 00:00:00
|
|
27
|
-
*/
|
|
28
|
-
function startOfDay(dirtyDate) {
|
|
29
|
-
requiredArgs(1, arguments);
|
|
30
|
-
var date = toDate(dirtyDate);
|
|
31
|
-
date.setHours(0, 0, 0, 0);
|
|
32
|
-
return date;
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
/**
|
|
36
|
-
* @name isSameDay
|
|
37
|
-
* @category Day Helpers
|
|
38
|
-
* @summary Are the given dates in the same day (and year and month)?
|
|
39
|
-
*
|
|
40
|
-
* @description
|
|
41
|
-
* Are the given dates in the same day (and year and month)?
|
|
42
|
-
*
|
|
43
|
-
* @param {Date|Number} dateLeft - the first date to check
|
|
44
|
-
* @param {Date|Number} dateRight - the second date to check
|
|
45
|
-
* @returns {Boolean} the dates are in the same day (and year and month)
|
|
46
|
-
* @throws {TypeError} 2 arguments required
|
|
47
|
-
*
|
|
48
|
-
* @example
|
|
49
|
-
* // Are 4 September 06:00:00 and 4 September 18:00:00 in the same day?
|
|
50
|
-
* const result = isSameDay(new Date(2014, 8, 4, 6, 0), new Date(2014, 8, 4, 18, 0))
|
|
51
|
-
* //=> true
|
|
52
|
-
*
|
|
53
|
-
* @example
|
|
54
|
-
* // Are 4 September and 4 October in the same day?
|
|
55
|
-
* const result = isSameDay(new Date(2014, 8, 4), new Date(2014, 9, 4))
|
|
56
|
-
* //=> false
|
|
57
|
-
*
|
|
58
|
-
* @example
|
|
59
|
-
* // Are 4 September, 2014 and 4 September, 2015 in the same day?
|
|
60
|
-
* const result = isSameDay(new Date(2014, 8, 4), new Date(2015, 8, 4))
|
|
61
|
-
* //=> false
|
|
62
|
-
*/
|
|
63
|
-
function isSameDay(dirtyDateLeft, dirtyDateRight) {
|
|
64
|
-
requiredArgs(2, arguments);
|
|
65
|
-
var dateLeftStartOfDay = startOfDay(dirtyDateLeft);
|
|
66
|
-
var dateRightStartOfDay = startOfDay(dirtyDateRight);
|
|
67
|
-
return dateLeftStartOfDay.getTime() === dateRightStartOfDay.getTime();
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
var parseRangeString = function (value) {
|
|
71
|
-
if (value === void 0) { value = ""; }
|
|
72
|
-
var _a = value.replace(/\s/g, "").split("-"), _b = _a[0], start = _b === void 0 ? "" : _b, _c = _a[1], end = _c === void 0 ? "" : _c;
|
|
73
|
-
var _d = start.split("/"), startDay = _d[0], startMonth = _d[1], startYear = _d[2];
|
|
74
|
-
var _e = end.split("/"), endDay = _e[0], endMonth = _e[1], endYear = _e[2];
|
|
75
|
-
return {
|
|
76
|
-
start: {
|
|
77
|
-
date: start,
|
|
78
|
-
day: startDay,
|
|
79
|
-
month: startMonth,
|
|
80
|
-
year: startYear,
|
|
81
|
-
},
|
|
82
|
-
end: {
|
|
83
|
-
date: end,
|
|
84
|
-
day: endDay,
|
|
85
|
-
month: endMonth,
|
|
86
|
-
year: endYear,
|
|
87
|
-
},
|
|
88
|
-
};
|
|
89
|
-
};
|
|
90
|
-
|
|
91
|
-
var parseDateString = function (value) {
|
|
92
|
-
var _a = value.split("/"), day = _a[0], month = _a[1], year = _a[2];
|
|
93
|
-
return {
|
|
94
|
-
day: day,
|
|
95
|
-
month: month,
|
|
96
|
-
year: year,
|
|
97
|
-
};
|
|
98
|
-
};
|
|
99
|
-
|
|
100
|
-
var isDateValid = function (value) {
|
|
101
|
-
if (value === void 0) { value = ""; }
|
|
102
|
-
var _a = value.split("/"), day = _a[0], month = _a[1], year = _a[2];
|
|
103
|
-
return (/^\d{2}\/\d{2}\/\d{4}$/.test(value) &&
|
|
104
|
-
isValid(new Date("".concat(year, "-").concat(month, "-").concat(day))));
|
|
105
|
-
};
|
|
106
|
-
|
|
107
|
-
var isRangeValid = function (value) {
|
|
108
|
-
if (value === void 0) { value = ""; }
|
|
109
|
-
var _a = value.replace(/\s/g, "").split("-"), _b = _a[0], start = _b === void 0 ? "" : _b, _c = _a[1], end = _c === void 0 ? "" : _c;
|
|
110
|
-
return isDateValid(start) && isDateValid(end);
|
|
111
|
-
};
|
|
112
|
-
|
|
113
|
-
var DATE_FORMAT = "dd/MM/yyyy";
|
|
114
|
-
|
|
115
|
-
var formatDate = function (value) {
|
|
116
|
-
return format(value, DATE_FORMAT);
|
|
117
|
-
};
|
|
118
|
-
|
|
119
|
-
var isDisabledDate = function (disabledDates, date) {
|
|
120
|
-
return Boolean(disabledDates &&
|
|
121
|
-
disabledDates.find(function (disabledDate) { return isSameDay(date, disabledDate); }));
|
|
122
|
-
};
|
|
123
|
-
|
|
124
|
-
var convertDateStringToDate = function (value) {
|
|
125
|
-
if (value === void 0) { value = ""; }
|
|
126
|
-
var _a = parseDateString(value), day = _a.day, month = _a.month, year = _a.year;
|
|
127
|
-
var isValidDate = isDateValid(value);
|
|
128
|
-
return isValidDate ? new Date("".concat(year, "-").concat(month, "-").concat(day)) : new Date();
|
|
129
|
-
};
|
|
130
|
-
|
|
131
|
-
var convertRangeStringToDates = function (value) {
|
|
132
|
-
if (value === void 0) { value = ""; }
|
|
133
|
-
var _a = parseRangeString(value), start = _a.start, end = _a.end;
|
|
134
|
-
return __spreadArray(__spreadArray([], (isDateValid(start.date)
|
|
135
|
-
? [new Date("".concat(start.year, "-").concat(start.month, "-").concat(start.day))]
|
|
136
|
-
: []), true), (isDateValid(end.date)
|
|
137
|
-
? [new Date("".concat(end.year, "-").concat(end.month, "-").concat(end.day))]
|
|
138
|
-
: []), true);
|
|
139
|
-
};
|
|
140
|
-
|
|
141
|
-
function validateRangeOnBlur(_a) {
|
|
142
|
-
var value = _a.value, minDate = _a.minDate, maxDate = _a.maxDate, disabledDates = _a.disabledDates, previousValidValue = _a.previousValidValue, dispatchChangeEvent = _a.dispatchChangeEvent, blurEvent = _a.blurEvent;
|
|
143
|
-
if (!isRangeValid(value))
|
|
144
|
-
return;
|
|
145
|
-
var _b = convertRangeStringToDates(value), start = _b[0], end = _b[1];
|
|
146
|
-
var isStartBeforeMin = minDate && isBefore(start, minDate);
|
|
147
|
-
var isEndAfterMax = maxDate && isAfter(end, maxDate);
|
|
148
|
-
var isStartDisabled = isDisabledDate(disabledDates, start);
|
|
149
|
-
var isEndDisabled = isDisabledDate(disabledDates, end);
|
|
150
|
-
if (isStartBeforeMin && isEndAfterMax) {
|
|
151
|
-
return dispatchChangeEvent(blurEvent, "".concat(formatDate(minDate), " - ").concat(formatDate(maxDate)));
|
|
152
|
-
}
|
|
153
|
-
if (isStartBeforeMin) {
|
|
154
|
-
return dispatchChangeEvent(blurEvent, "".concat(formatDate(minDate), " - ").concat(formatDate(end)));
|
|
155
|
-
}
|
|
156
|
-
if (isEndAfterMax) {
|
|
157
|
-
return dispatchChangeEvent(blurEvent, "".concat(formatDate(start), " - ").concat(formatDate(maxDate)));
|
|
158
|
-
}
|
|
159
|
-
if (isStartDisabled || isEndDisabled) {
|
|
160
|
-
var _c = previousValidValue
|
|
161
|
-
? convertRangeStringToDates(previousValidValue)
|
|
162
|
-
: [], prevStart = _c[0], prevEnd = _c[1];
|
|
163
|
-
return dispatchChangeEvent(blurEvent, prevStart && prevEnd
|
|
164
|
-
? "".concat(formatDate(prevStart), " - ").concat(formatDate(prevEnd))
|
|
165
|
-
: "");
|
|
166
|
-
}
|
|
167
|
-
if (isAfter(start, end)) {
|
|
168
|
-
var _d = [start, end].sort(compareAsc), orderedStart = _d[0], orderedEnd = _d[1];
|
|
169
|
-
return dispatchChangeEvent(blurEvent, "".concat(formatDate(orderedStart), " - ").concat(formatDate(orderedEnd)));
|
|
170
|
-
}
|
|
171
|
-
}
|
|
172
|
-
|
|
173
|
-
/**
|
|
174
|
-
* Use `DatePicker` to clearly present available dates and allow users to choose a way to enter information.
|
|
175
|
-
*/
|
|
176
|
-
var DatePicker = forwardRef(function (_a, ref) {
|
|
177
|
-
var errorMessage = _a.errorMessage, helper = _a.helper, id = _a.id, label = _a.label, isDisabled = _a.isDisabled, isReadOnly = _a.isReadOnly, isRequired = _a.isRequired, size = _a.size, _b = _a.value, value = _b === void 0 ? "" : _b, name = _a.name, onBlur = _a.onBlur, onChange = _a.onChange, onDateSelect = _a.onDateSelect, onRangeSelect = _a.onRangeSelect, onClickDisclosure = _a.onClickDisclosure, disclosureTitle = _a.disclosureTitle, disclosureText = _a.disclosureText, type = _a.type, _c = _a.isFluid, isFluid = _c === void 0 ? false : _c, _d = _a.selectionType, selectionType = _d === void 0 ? "single" : _d, disabledDates = _a.disabledDates, minDate = _a.minDate, maxDate = _a.maxDate, props = __rest(_a, ["errorMessage", "helper", "id", "label", "isDisabled", "isReadOnly", "isRequired", "size", "value", "name", "onBlur", "onChange", "onDateSelect", "onRangeSelect", "onClickDisclosure", "disclosureTitle", "disclosureText", "type", "isFluid", "selectionType", "disabledDates", "minDate", "maxDate"]);
|
|
178
|
-
var _e = useThemeElement(), themeElement = _e[0], setThemeElement = _e[1];
|
|
179
|
-
var _f = useState("Choose date"), ariaLabel = _f[0], setAriaLabel = _f[1];
|
|
180
|
-
var _g = useState(false), showCalendar = _g[0], setShowCalendar = _g[1];
|
|
181
|
-
var buttonRef = useRef(null);
|
|
182
|
-
var ourRef = useRef(null);
|
|
183
|
-
var previousValidValue = useRef(value);
|
|
184
|
-
var lowerCaseDateFormat = DATE_FORMAT.toLowerCase();
|
|
185
|
-
var placeHolder = selectionType === "range"
|
|
186
|
-
? "".concat(lowerCaseDateFormat, " - ").concat(lowerCaseDateFormat)
|
|
187
|
-
: lowerCaseDateFormat;
|
|
188
|
-
useEffect(function () {
|
|
189
|
-
if (selectionType === "single" &&
|
|
190
|
-
isDateValid(value) &&
|
|
191
|
-
!isDisabledDate(disabledDates, convertDateStringToDate(value))) {
|
|
192
|
-
previousValidValue.current = value;
|
|
193
|
-
}
|
|
194
|
-
if (selectionType === "range" && isRangeValid(value)) {
|
|
195
|
-
var rangeHasDisabledDates = convertRangeStringToDates(value).some(function (rangeValue) { return isDisabledDate(disabledDates, rangeValue); });
|
|
196
|
-
if (!rangeHasDisabledDates) {
|
|
197
|
-
previousValidValue.current = value;
|
|
198
|
-
}
|
|
199
|
-
}
|
|
200
|
-
}, [value, disabledDates, selectionType]);
|
|
201
|
-
var getDatePickerRef = function (elementRef) {
|
|
202
|
-
ourRef.current = elementRef;
|
|
203
|
-
if (ref && typeof ref === "object") {
|
|
204
|
-
ref.current = elementRef;
|
|
205
|
-
}
|
|
206
|
-
if (ref && typeof ref === "function") {
|
|
207
|
-
ref(elementRef);
|
|
208
|
-
}
|
|
209
|
-
};
|
|
210
|
-
var dispatchChangeEvent = function (e, value) {
|
|
211
|
-
onChange &&
|
|
212
|
-
onChange(__assign(__assign({}, e), { target: __assign(__assign({}, e.target), { value: value }) }));
|
|
213
|
-
};
|
|
214
|
-
var handleRangeSelect = function (rangeSelection) {
|
|
215
|
-
var start = formatDate(rangeSelection.start);
|
|
216
|
-
var end = rangeSelection.end ? formatDate(rangeSelection.end) : null;
|
|
217
|
-
onRangeSelect &&
|
|
218
|
-
onRangeSelect(__assign(__assign({}, rangeSelection), { formattedRange: "".concat(start).concat(end ? " - ".concat(end) : "") }));
|
|
219
|
-
rangeSelection.isSelectionComplete && setShowCalendar(false);
|
|
220
|
-
};
|
|
221
|
-
var handleDateSelect = function (value) {
|
|
222
|
-
onDateSelect &&
|
|
223
|
-
onDateSelect({
|
|
224
|
-
date: value,
|
|
225
|
-
formattedDate: formatDate(value),
|
|
226
|
-
});
|
|
227
|
-
setShowCalendar(false);
|
|
228
|
-
};
|
|
229
|
-
var handleSingleSelectionBlur = function (e) {
|
|
230
|
-
if (value && isDateValid(value) && selectionType === "single") {
|
|
231
|
-
var _a = parseDateString(value), day = _a.day, month = _a.month, year = _a.year;
|
|
232
|
-
var date = new Date("".concat(year, "-").concat(month, "-").concat(day));
|
|
233
|
-
var isDateBeforeMinDate = minDate && isBefore(date, minDate);
|
|
234
|
-
var isDateAfterMaxDate = maxDate && isAfter(date, maxDate);
|
|
235
|
-
var isDisabledValue = isDisabledDate(disabledDates, date);
|
|
236
|
-
if (isDateBeforeMinDate) {
|
|
237
|
-
return dispatchChangeEvent(e, "".concat(formatDate(minDate)));
|
|
238
|
-
}
|
|
239
|
-
if (isDateAfterMaxDate) {
|
|
240
|
-
return dispatchChangeEvent(e, "".concat(formatDate(maxDate)));
|
|
241
|
-
}
|
|
242
|
-
if (isDisabledValue) {
|
|
243
|
-
var date_1 = previousValidValue.current
|
|
244
|
-
? convertDateStringToDate(previousValidValue.current)
|
|
245
|
-
: new Date();
|
|
246
|
-
return dispatchChangeEvent(e, "".concat(formatDate(date_1)));
|
|
247
|
-
}
|
|
248
|
-
}
|
|
249
|
-
};
|
|
250
|
-
var handleRangeSelectionBlur = function (e) {
|
|
251
|
-
validateRangeOnBlur({
|
|
252
|
-
value: value,
|
|
253
|
-
minDate: minDate,
|
|
254
|
-
maxDate: maxDate,
|
|
255
|
-
disabledDates: disabledDates,
|
|
256
|
-
previousValidValue: previousValidValue.current,
|
|
257
|
-
dispatchChangeEvent: dispatchChangeEvent,
|
|
258
|
-
blurEvent: e,
|
|
259
|
-
});
|
|
260
|
-
};
|
|
261
|
-
var handleBlur = function (e) {
|
|
262
|
-
onBlur && onBlur(e);
|
|
263
|
-
if (selectionType === "single") {
|
|
264
|
-
handleSingleSelectionBlur(e);
|
|
265
|
-
}
|
|
266
|
-
if (selectionType === "range") {
|
|
267
|
-
handleRangeSelectionBlur(e);
|
|
268
|
-
}
|
|
269
|
-
};
|
|
270
|
-
var handleChange = function (e) {
|
|
271
|
-
onChange && onChange(e);
|
|
272
|
-
};
|
|
273
|
-
var handleCalendarOpenChange = function (isOpen) {
|
|
274
|
-
if (document.activeElement)
|
|
275
|
-
setShowCalendar(isOpen);
|
|
276
|
-
};
|
|
277
|
-
var handleIconClick = function () {
|
|
278
|
-
var _a;
|
|
279
|
-
!((_a = ourRef.current) === null || _a === void 0 ? void 0 : _a.contains(document.activeElement)) &&
|
|
280
|
-
!isDisabled &&
|
|
281
|
-
!isReadOnly &&
|
|
282
|
-
setShowCalendar(true);
|
|
283
|
-
};
|
|
284
|
-
var handleIconFocus = function () {
|
|
285
|
-
if (selectionType === "range" && isRangeValid(value)) {
|
|
286
|
-
var _a = convertRangeStringToDates(value), start = _a[0], end = _a[1];
|
|
287
|
-
return setAriaLabel("Change dates, currently selected dates are ".concat(format(start, "EEEE do MMMM, yyyy"), " to ").concat(format(end, "EEEE do MMMM, yyyy")));
|
|
288
|
-
}
|
|
289
|
-
if (selectionType === "single" && isDateValid(value)) {
|
|
290
|
-
var date = convertDateStringToDate(value);
|
|
291
|
-
return setAriaLabel("Change date, currently selected date is ".concat(format(date, "EEEE do MMMM, yyyy")));
|
|
292
|
-
}
|
|
293
|
-
setAriaLabel("Choose Date");
|
|
294
|
-
};
|
|
295
|
-
var handleCalendarClose = function () {
|
|
296
|
-
var _a, _b;
|
|
297
|
-
if (((_a = document.activeElement) === null || _a === void 0 ? void 0 : _a.tagName) === "BODY") {
|
|
298
|
-
(_b = buttonRef.current) === null || _b === void 0 ? void 0 : _b.focus();
|
|
299
|
-
}
|
|
300
|
-
};
|
|
301
|
-
var onCancelClick = function () {
|
|
302
|
-
setShowCalendar(false);
|
|
303
|
-
};
|
|
304
|
-
var handleAutoFocus = function (e) {
|
|
305
|
-
e.preventDefault();
|
|
306
|
-
};
|
|
307
|
-
return (React__default.createElement("div", { ref: setThemeElement, className: classNames({
|
|
308
|
-
"arc-DatePicker--constrained": !isFluid,
|
|
309
|
-
}) },
|
|
310
|
-
React__default.createElement(TextInputWithPlaceHolder, __assign({ ref: getDatePickerRef, iconButton: {
|
|
311
|
-
onClick: handleIconClick,
|
|
312
|
-
onFocus: handleIconFocus,
|
|
313
|
-
icon: "datePickerCalendar",
|
|
314
|
-
label: ariaLabel,
|
|
315
|
-
ref: buttonRef,
|
|
316
|
-
}, placeholder: placeHolder, errorMessage: errorMessage, helper: helper, id: id, isDisabled: isDisabled, isReadOnly: isReadOnly, isRequired: isRequired, label: label, maxLength: selectionType === "range" ? 23 : 10, name: name, onBlur: handleBlur, onChange: handleChange, onClickDisclosure: onClickDisclosure, type: "text", value: value, disclosureTitle: disclosureTitle, disclosureText: disclosureText, size: size }, props, filterAttrs(props))),
|
|
317
|
-
React__default.createElement(Root2, __assign({ open: showCalendar, onOpenChange: handleCalendarOpenChange }, filterAttrs(props)),
|
|
318
|
-
React__default.createElement(Anchor2, null),
|
|
319
|
-
React__default.createElement(Portal, { container: themeElement },
|
|
320
|
-
React__default.createElement(Content2, { align: "start", "aria-modal": "true", "aria-label": "Choose Date", className: "arc-DatePicker-modal", onOpenAutoFocus: handleAutoFocus, onCloseAutoFocus: handleCalendarClose },
|
|
321
|
-
React__default.createElement(Calendar, { autoFocusOnMount: true, type: type, onCancelClick: onCancelClick, selectionType: selectionType, selectedDate: convertDateStringToDate(value), selectedRange: convertRangeStringToDates(value), disabledDates: disabledDates, minDate: minDate, maxDate: maxDate, onDateSelect: handleDateSelect, onRangeSelect: handleRangeSelect }))))));
|
|
322
|
-
});
|
|
323
|
-
|
|
324
|
-
export { DATE_FORMAT as D, isRangeValid as a, parseDateString as b, convertRangeStringToDates as c, DatePicker as d, formatDate as f, isDateValid as i, parseRangeString as p, validateRangeOnBlur as v };
|
|
@@ -1,58 +0,0 @@
|
|
|
1
|
-
import { _ as __rest, a as __assign, f as filterAttrs } from './filter-attrs-B6CM-NUr.mjs';
|
|
2
|
-
import React__default, { useRef } from 'react';
|
|
3
|
-
import { c as classNames } from './index-5C0-U8cc.mjs';
|
|
4
|
-
import { R as Root, P as Portal, O as Overlay, C as Content, T as Title } from './index-J5IHetgg.mjs';
|
|
5
|
-
import { e as useThemeElement } from './index-Bz2JQq34.mjs';
|
|
6
|
-
import { T as ThemeIcon } from './ThemeIcon-CN_Ed5b1.mjs';
|
|
7
|
-
import { R as Rule } from './Rule-3gdMHH-R.mjs';
|
|
8
|
-
|
|
9
|
-
var Drawer = function (_a) {
|
|
10
|
-
var isOpen = _a.isOpen, children = _a.children, onRequestClose = _a.onRequestClose, _b = _a.noOverlay, noOverlay = _b === void 0 ? false : _b, _c = _a.shouldReturnFocus, shouldReturnFocus = _c === void 0 ? true : _c, _d = _a.size, size = _d === void 0 ? "m" : _d, height = _a.height, width = _a.width, _e = _a.position, position = _e === void 0 ? "right" : _e, props = __rest(_a, ["isOpen", "children", "onRequestClose", "noOverlay", "shouldReturnFocus", "size", "height", "width", "position"]);
|
|
11
|
-
var _f = useThemeElement(), themeElement = _f[0], setThemeElement = _f[1];
|
|
12
|
-
var triggerRef = useRef(null);
|
|
13
|
-
var setTriggerElement = function () {
|
|
14
|
-
return shouldReturnFocus &&
|
|
15
|
-
(triggerRef.current = document.activeElement);
|
|
16
|
-
};
|
|
17
|
-
var focusTriggerElement = function () {
|
|
18
|
-
if (triggerRef.current) {
|
|
19
|
-
triggerRef.current.focus();
|
|
20
|
-
}
|
|
21
|
-
};
|
|
22
|
-
var sizingProperties = __assign(__assign({}, (position !== "bottom" && { width: width })), (position === "bottom" && { height: height }));
|
|
23
|
-
return (React__default.createElement("div", { ref: setThemeElement },
|
|
24
|
-
React__default.createElement(Root, { open: isOpen },
|
|
25
|
-
React__default.createElement(Portal, { container: themeElement },
|
|
26
|
-
React__default.createElement(Overlay, { className: classNames("arc-Drawer-overlay", {
|
|
27
|
-
"arc-Drawer-overlay--visible": !noOverlay,
|
|
28
|
-
}) },
|
|
29
|
-
React__default.createElement(Content, __assign({ className: classNames("arc-Drawer-slider", "arc-Drawer-slider--".concat(size), "arc-Drawer-slider--".concat(position)), style: __assign({}, sizingProperties), onOpenAutoFocus: setTriggerElement, onCloseAutoFocus: focusTriggerElement, onEscapeKeyDown: onRequestClose, onInteractOutside: onRequestClose, "aria-modal": "true" }, filterAttrs(props)),
|
|
30
|
-
children,
|
|
31
|
-
React__default.createElement("div", { className: "arc-Drawer-closeButtonContainer" },
|
|
32
|
-
React__default.createElement("button", { "aria-label": "close", onClick: onRequestClose, className: "arc-Drawer-closeButton" },
|
|
33
|
-
React__default.createElement(ThemeIcon, { size: 32, icon: "drawerClose" })))))))));
|
|
34
|
-
};
|
|
35
|
-
|
|
36
|
-
var DrawerHeader = function (_a) {
|
|
37
|
-
var title = _a.title, _b = _a.isFixed, isFixed = _b === void 0 ? false : _b, props = __rest(_a, ["title", "isFixed"]);
|
|
38
|
-
return (React__default.createElement(React__default.Fragment, null,
|
|
39
|
-
React__default.createElement("div", __assign({ className: classNames("arc-DrawerHeader", {
|
|
40
|
-
"arc-DrawerHeader--isFixed": isFixed,
|
|
41
|
-
}) }, filterAttrs(props)),
|
|
42
|
-
React__default.createElement("div", { className: "arc-DrawerHeader-content" },
|
|
43
|
-
React__default.createElement("div", { className: "arc-DrawerHeader-titleContainer" },
|
|
44
|
-
React__default.createElement(Title, { asChild: true },
|
|
45
|
-
React__default.createElement("h1", { className: "arc-DrawerHeader-title" }, title)))),
|
|
46
|
-
isFixed && (React__default.createElement("div", { className: "arc-DrawerHeader-divider" },
|
|
47
|
-
React__default.createElement(Rule, null))))));
|
|
48
|
-
};
|
|
49
|
-
|
|
50
|
-
var DrawerContent = function (_a) {
|
|
51
|
-
var isFullBleed = _a.isFullBleed, children = _a.children;
|
|
52
|
-
return (React__default.createElement("div", { className: classNames("arc-DrawerContent", {
|
|
53
|
-
"arc-DrawerContent--isFullBleed": isFullBleed,
|
|
54
|
-
}) },
|
|
55
|
-
React__default.createElement("div", { className: "arc-Drawer-section" }, children)));
|
|
56
|
-
};
|
|
57
|
-
|
|
58
|
-
export { Drawer as D, DrawerHeader as a, DrawerContent as b };
|
|
@@ -1,80 +0,0 @@
|
|
|
1
|
-
import { _ as __rest, a as __assign, f as filterAttrs } from './filter-attrs-B6CM-NUr.mjs';
|
|
2
|
-
import React__default, { forwardRef, useContext } from 'react';
|
|
3
|
-
import { c as classNames } from './index-5C0-U8cc.mjs';
|
|
4
|
-
import { c as camelcase } from './index-Spae4j7j.mjs';
|
|
5
|
-
import { I as Icon } from './Icon-CcPOJcQm.mjs';
|
|
6
|
-
import { C as Context } from './Surface-Colbp3Zx.mjs';
|
|
7
|
-
import { S as Spinner } from './Spinner-Cd7LiPTy.mjs';
|
|
8
|
-
|
|
9
|
-
/**
|
|
10
|
-
* Do not edit directly
|
|
11
|
-
* Generated file
|
|
12
|
-
*/
|
|
13
|
-
|
|
14
|
-
const BtIconArrowAltRight =
|
|
15
|
-
"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='currentColor' d='M18.854 11.646a.5.5 0 0 0-.707.707l3.146 3.147H9.5a.5.5 0 0 0 0 1h11.793l-3.146 3.146a.5.5 0 1 0 .707.707L23.207 16Z'/%3e%3c/svg%3e";
|
|
16
|
-
|
|
17
|
-
/**
|
|
18
|
-
* Do not edit directly
|
|
19
|
-
* Generated file
|
|
20
|
-
*/
|
|
21
|
-
|
|
22
|
-
const BtIconArrowAltDown =
|
|
23
|
-
"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='currentColor' d='M20.354 18.146a.5.5 0 0 0-.707 0L16.5 21.293V9.5a.5.5 0 0 0-1 0v11.793l-3.146-3.146a.5.5 0 1 0-.707.707L16 23.207l4.354-4.354a.5.5 0 0 0 0-.707'/%3e%3c/svg%3e";
|
|
24
|
-
|
|
25
|
-
/**
|
|
26
|
-
* Do not edit directly
|
|
27
|
-
* Generated file
|
|
28
|
-
*/
|
|
29
|
-
|
|
30
|
-
const ArcIconPlay =
|
|
31
|
-
"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 56 56'%3e%3cpath fill='currentColor' d='M36.468 26.32 23.907 19.07A1.938 1.938 0 0 0 21 20.745V35.25a1.935 1.935 0 0 0 2.907 1.68l12.561-7.254a1.938 1.938 0 0 0 0-3.354m-.875 1.84-12.561 7.254a.18.18 0 0 1-.187 0 .18.18 0 0 1-.095-.165V20.745a.18.18 0 0 1 .095-.16.18.18 0 0 1 .187 0l12.561 7.25a.18.18 0 0 1 .095.164.18.18 0 0 1-.095.16'/%3e%3c/svg%3e";
|
|
32
|
-
|
|
33
|
-
/**
|
|
34
|
-
* Do not edit directly
|
|
35
|
-
* Generated file
|
|
36
|
-
*/
|
|
37
|
-
|
|
38
|
-
const ArcIconWarn =
|
|
39
|
-
"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='currentColor' d='M16 20.993a1 1 0 1 0 0 2 1 1 0 1 0 0-2M16.005 19.01a.5.5 0 0 0 .5-.5l.002-9.01a.5.5 0 0 0-1 0l-.002 9.01a.5.5 0 0 0 .5.5'/%3e%3c/svg%3e";
|
|
40
|
-
|
|
41
|
-
var HeroButton = forwardRef(function (_a, ref) {
|
|
42
|
-
var label = _a.label, _b = _a.buttonStyle, buttonStyle = _b === void 0 ? "primary" : _b, icon = _a.icon, ariaLabel = _a.ariaLabel, _c = _a.isLoading, isLoading = _c === void 0 ? false : _c, onClick = _a.onClick, href = _a.href, id = _a.id, rel = _a.rel, target = _a.target, type = _a.type, form = _a.form, props = __rest(_a, ["label", "buttonStyle", "icon", "ariaLabel", "isLoading", "onClick", "href", "id", "rel", "target", "type", "form"]);
|
|
43
|
-
var surface = useContext(Context).surface;
|
|
44
|
-
var HeroButtonClasses = classNames("arc-HeroButton", ["arc-HeroButton--".concat(camelcase(buttonStyle))], {
|
|
45
|
-
"arc-HeroButton--onDarkSurface": surface === "dark",
|
|
46
|
-
"arc-HeroButton--emptyLabel": !label,
|
|
47
|
-
"arc-HeroButton--isLoading": isLoading,
|
|
48
|
-
"arc-HeroButton--withIcon": icon,
|
|
49
|
-
"arc-HeroButton--hasGradient": buttonStyle.includes("-gradient"),
|
|
50
|
-
});
|
|
51
|
-
var HeroButtonIcons = {
|
|
52
|
-
"arrow-right": BtIconArrowAltRight,
|
|
53
|
-
"arrow-down": BtIconArrowAltDown,
|
|
54
|
-
play: ArcIconPlay,
|
|
55
|
-
warning: ArcIconWarn,
|
|
56
|
-
};
|
|
57
|
-
var commonProps = __assign({ id: id, onClick: onClick, ref: ref }, filterAttrs(props));
|
|
58
|
-
if (href && !isLoading) {
|
|
59
|
-
return (React__default.createElement("a", __assign({}, commonProps, { className: HeroButtonClasses, href: href, rel: rel, "aria-label": ariaLabel, target: target }),
|
|
60
|
-
React__default.createElement("span", { className: classNames("arc-HeroButton-inner") },
|
|
61
|
-
label && React__default.createElement("span", { className: "arc-HeroButton-label" }, label),
|
|
62
|
-
isLoading && (React__default.createElement("span", { className: "arc-HeroButton-icon" },
|
|
63
|
-
React__default.createElement(Spinner, { size: "xxl" }))),
|
|
64
|
-
icon && !isLoading && (React__default.createElement("span", { className: "arc-HeroButton-icon" },
|
|
65
|
-
React__default.createElement(Icon, { testId: "hero-button-icon", size: 48, icon: buttonStyle === "warning"
|
|
66
|
-
? HeroButtonIcons["warning"]
|
|
67
|
-
: HeroButtonIcons[icon] }))))));
|
|
68
|
-
}
|
|
69
|
-
return (React__default.createElement("button", __assign({}, commonProps, { className: HeroButtonClasses, "aria-label": ariaLabel, disabled: isLoading, type: type, form: form }),
|
|
70
|
-
React__default.createElement("span", { className: classNames("arc-HeroButton-inner") },
|
|
71
|
-
label && React__default.createElement("span", { className: "arc-HeroButton-label" }, label),
|
|
72
|
-
icon && !isLoading && (React__default.createElement("span", { className: "arc-HeroButton-icon" },
|
|
73
|
-
React__default.createElement(Icon, { testId: "hero-button-icon", size: 48, icon: buttonStyle === "warning"
|
|
74
|
-
? HeroButtonIcons["warning"]
|
|
75
|
-
: HeroButtonIcons[icon] }))),
|
|
76
|
-
isLoading && (React__default.createElement("span", { className: "arc-HeroButton-icon" },
|
|
77
|
-
React__default.createElement(Spinner, { size: "xxl" }))))));
|
|
78
|
-
});
|
|
79
|
-
|
|
80
|
-
export { HeroButton as H };
|
|
@@ -1,55 +0,0 @@
|
|
|
1
|
-
import { _ as __rest, a as __assign, f as filterAttrs } from './filter-attrs-B6CM-NUr.mjs';
|
|
2
|
-
import React__default, { useContext, useState, useEffect, Suspense } from 'react';
|
|
3
|
-
import { c as classNames } from './index-5C0-U8cc.mjs';
|
|
4
|
-
import { I as Image } from './Image-Dl8oH1Rn.mjs';
|
|
5
|
-
import { H as Heading } from './Heading-CxHWefi7.mjs';
|
|
6
|
-
import { C as Context, S as Surface } from './Surface-Colbp3Zx.mjs';
|
|
7
|
-
import { T as Text } from './Text-CBlnm5CT.mjs';
|
|
8
|
-
import { V as VerticalSpace } from './VerticalSpace-Duhm0zXP.mjs';
|
|
9
|
-
import { C as CardHeading } from './CardHeading-_setRRjq.mjs';
|
|
10
|
-
import { C as CardFooter } from './CardFooter-fsAY4cc6.mjs';
|
|
11
|
-
import { C as ConditionalWrapper } from './ConditionalWrapper-WoJxFYwS.mjs';
|
|
12
|
-
|
|
13
|
-
var VideoPlayer = React__default.lazy(function () {
|
|
14
|
-
return import('../../VideoPlayer/VideoPlayer.mjs').then(function (_a) {
|
|
15
|
-
var VideoPlayer = _a.VideoPlayer;
|
|
16
|
-
return ({
|
|
17
|
-
default: VideoPlayer,
|
|
18
|
-
});
|
|
19
|
-
});
|
|
20
|
-
});
|
|
21
|
-
/**
|
|
22
|
-
* Use `MediaCard` to contain content and an image about a single subject.
|
|
23
|
-
*/
|
|
24
|
-
var MediaCard = function (_a) {
|
|
25
|
-
var media = _a.media, url = _a.url, onClick = _a.onClick, heading = _a.heading, label = _a.label, text = _a.text, metaText = _a.metaText, minHeight = _a.minHeight, _b = _a.buttonIcon, buttonIcon = _b === void 0 ? "arrow" : _b, _c = _a.isContained, isContained = _c === void 0 ? true : _c, _d = _a.headingLevel, headingLevel = _d === void 0 ? "2" : _d, props = __rest(_a, ["media", "url", "onClick", "heading", "label", "text", "metaText", "minHeight", "buttonIcon", "isContained", "headingLevel"]);
|
|
26
|
-
var surface = useContext(Context).surface;
|
|
27
|
-
var _e = useState(false), isClient = _e[0], setIsClient = _e[1];
|
|
28
|
-
var _f = useState(false), showHoverState = _f[0], setShowHoverState = _f[1];
|
|
29
|
-
var handleShowHoverState = function (show) { return function () { return setShowHoverState(show); }; };
|
|
30
|
-
useEffect(function () {
|
|
31
|
-
setIsClient(true);
|
|
32
|
-
}, []);
|
|
33
|
-
return (React__default.createElement("div", __assign({ style: { minHeight: minHeight }, className: classNames("arc-MediaCard", {
|
|
34
|
-
"arc-MediaCard--outlined": url && isContained && showHoverState,
|
|
35
|
-
"arc-MediaCard--contained": isContained,
|
|
36
|
-
"arc-MediaCard--onDarkSurface": surface === "dark",
|
|
37
|
-
}) }, filterAttrs(props)),
|
|
38
|
-
React__default.createElement(ConditionalWrapper, { condition: isContained, wrapper: function (children) { return (React__default.createElement(Surface, { growVertically: true, background: "light-white" }, children)); } },
|
|
39
|
-
media.type === "img" && (React__default.createElement("div", { className: "arc-MediaCard-imgContainer" },
|
|
40
|
-
React__default.createElement(Image, __assign({}, media)))),
|
|
41
|
-
media.type === "video" && isClient && (React__default.createElement(Suspense, { fallback: null },
|
|
42
|
-
React__default.createElement(VideoPlayer, __assign({ isSupportingTextHidden: true }, media)))),
|
|
43
|
-
React__default.createElement("div", { className: "arc-MediaCard-content" },
|
|
44
|
-
label && (React__default.createElement("div", { className: "arc-MediaCard-label" },
|
|
45
|
-
React__default.createElement(Heading, { level: "3", fontStyle: "overline" }, label),
|
|
46
|
-
React__default.createElement(VerticalSpace, { size: "16" }))),
|
|
47
|
-
React__default.createElement(CardHeading, { heading: heading, headingLevel: headingLevel, href: media.type !== "video" ? url : undefined, onClick: media.type !== "video" ? onClick : undefined, onMouseEnter: handleShowHoverState(true), onMouseLeave: handleShowHoverState(false), onFocus: handleShowHoverState(true), onBlur: handleShowHoverState(false) }),
|
|
48
|
-
React__default.createElement("div", { className: "arc-MediaCard-textContainer" }, text && (React__default.createElement(React__default.Fragment, null,
|
|
49
|
-
React__default.createElement(VerticalSpace, { size: "16" }),
|
|
50
|
-
React__default.createElement(Text, null, text),
|
|
51
|
-
(url || metaText) && React__default.createElement(VerticalSpace, { size: "24" })))),
|
|
52
|
-
React__default.createElement(CardFooter, { buttonIcon: buttonIcon, metaText: metaText, showButton: Boolean(url) && media.type !== "video", isHovered: showHoverState })))));
|
|
53
|
-
};
|
|
54
|
-
|
|
55
|
-
export { MediaCard as M };
|