@memobit/libs 3.0.0 → 3.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Accordion/Accordion.css +1 -0
- package/dist/components/Accordion/Accordion2.js +79 -0
- package/dist/components/AlertDialog/AlertDialog.css +1 -0
- package/dist/components/AlertDialog/AlertDialog2.js +26 -0
- package/dist/components/AnalogClock/AnalogClock.css +1 -0
- package/dist/components/AnalogClock/AnalogClock2.js +293 -0
- package/dist/components/AngleSlider/AngleSlider.css +1 -0
- package/dist/components/AngleSlider/AngleSlider2.js +135 -0
- package/dist/components/AppHeader/AppHeader.css +1 -0
- package/dist/components/AppHeader/AppHeader2.js +44 -0
- package/dist/components/Auth/ChangePasswordModal/ChangePasswordModal.css +1 -0
- package/dist/components/Auth/ChangePasswordModal/ChangePasswordModal2.js +138 -0
- package/dist/components/Auth/Login/Login.css +1 -0
- package/dist/components/Auth/Login/Login2.js +155 -0
- package/dist/components/Auth/MfaSetupModal/MfaSetupModal.css +1 -0
- package/dist/components/Auth/MfaSetupModal/MfaSetupModal2.js +327 -0
- package/dist/components/AvatarInitials/AvatarInitials.css +1 -0
- package/dist/components/AvatarInitials/AvatarInitials2.js +73 -0
- package/dist/components/BMI/BMI.css +1 -0
- package/dist/components/BMI/BMI2.js +53 -0
- package/dist/components/BMI/bmiUtils.js +265 -0
- package/dist/components/Badge/Badge.css +1 -0
- package/dist/components/Badge/Badge2.js +30 -0
- package/dist/components/Banner/Banner.css +1 -0
- package/dist/components/Banner/Banner2.js +57 -0
- package/dist/components/Blockquote/Blockquote.css +1 -0
- package/dist/components/Blockquote/Blockquote2.js +55 -0
- package/dist/components/Breadcrumb/Breadcrumb.css +1 -0
- package/dist/components/Breadcrumb/Breadcrumb2.js +36 -0
- package/dist/components/BulkActionBar/BulkActionBar.css +1 -0
- package/dist/components/BulkActionBar/BulkActionBar2.js +39 -0
- package/dist/components/Button/Button.css +1 -0
- package/dist/components/Button/Button2.js +32 -0
- package/dist/components/Calendar/Calendar.css +1 -0
- package/dist/components/Calendar/Calendar2.js +279 -0
- package/dist/components/CalendarHeatmap/CalendarHeatmap.css +1 -0
- package/dist/components/CalendarHeatmap/CalendarHeatmap2.js +91 -0
- package/dist/components/Card/Card.css +1 -0
- package/dist/components/Card/Card2.js +47 -0
- package/dist/components/Checkbox/Checkbox.css +1 -0
- package/dist/components/Checkbox/Checkbox2.js +35 -0
- package/dist/components/Chip/Chip.css +1 -0
- package/dist/components/Chip/Chip2.js +31 -0
- package/dist/components/CollapsibleSection/CollapsibleSection.css +1 -0
- package/dist/components/CollapsibleSection/CollapsibleSection2.js +68 -0
- package/dist/components/ColorPicker/ColorPicker.css +1 -0
- package/dist/components/ColorPicker/ColorPicker2.js +257 -0
- package/dist/components/CommandPalette/CommandPalette.css +1 -0
- package/dist/components/CommandPalette/CommandPalette2.js +97 -0
- package/dist/components/Confetti/Confetti.css +1 -0
- package/dist/components/Confetti/Confetti2.js +175 -0
- package/dist/components/ConfirmDialog/ConfirmDialog.css +1 -0
- package/dist/components/ConfirmDialog/ConfirmDialog2.js +37 -0
- package/dist/components/ConfirmPopover/ConfirmPopover.css +1 -0
- package/dist/components/ConfirmPopover/ConfirmPopover2.js +55 -0
- package/dist/components/ContextMenu/ContextMenu.css +1 -0
- package/dist/components/ContextMenu/ContextMenu2.js +53 -0
- package/dist/components/ContextToast/ContextToast.css +1 -0
- package/dist/components/ContextToast/ContextToast2.js +96 -0
- package/dist/components/ControlPanel/ControlPanel.css +1 -0
- package/dist/components/ControlPanel/ControlPanel.types.js +21 -0
- package/dist/components/ControlPanel/ControlPanel2.js +137 -0
- package/dist/components/ControlPanel/ControlPanelContext.js +31 -0
- package/dist/components/ControlPanel/ControlPanelFilter.js +386 -0
- package/dist/components/ControlPanel/ControlPanelNav.js +74 -0
- package/dist/components/ControlPanel/ControlPanelOptions.js +197 -0
- package/dist/components/CopyButton/CopyButton.css +1 -0
- package/dist/components/CopyButton/CopyButton2.js +48 -0
- package/dist/components/CountryWithFlag/CountryWithFlag.css +1 -0
- package/dist/components/CountryWithFlag/CountryWithFlag2.js +21 -0
- package/dist/components/DataView/DataView.CardView.js +189 -0
- package/dist/components/DataView/DataView.ColumnSelector.js +51 -0
- package/dist/components/DataView/DataView.MiniSort.js +25 -0
- package/dist/components/DataView/DataView.css +1 -0
- package/dist/components/DataView/DataView2.js +433 -0
- package/dist/components/DatePicker/DatePicker.css +1 -0
- package/dist/components/DatePicker/DatePicker2.js +151 -0
- package/dist/components/DateRangePicker/DateRangePicker.css +1 -0
- package/dist/components/DateRangePicker/DateRangePicker2.js +223 -0
- package/dist/components/DayAgenda/DayAgenda.css +1 -0
- package/dist/components/DayAgenda/DayAgenda2.js +120 -0
- package/dist/components/DiffViewer/DiffViewer.css +1 -0
- package/dist/components/DiffViewer/DiffViewer2.js +270 -0
- package/dist/components/Drawer/Drawer.css +1 -0
- package/dist/components/Drawer/Drawer2.js +119 -0
- package/dist/components/Dropdown/Dropdown.css +1 -0
- package/dist/components/Dropdown/Dropdown2.js +413 -0
- package/dist/components/EmojiPicker/EmojiPicker.css +1 -0
- package/dist/components/EmojiPicker/EmojiPicker2.js +789 -0
- package/dist/components/EmojiPicker/emojiKeywords/activities.js +508 -0
- package/dist/components/EmojiPicker/emojiKeywords/animals.js +501 -0
- package/dist/components/EmojiPicker/emojiKeywords/food.js +540 -0
- package/dist/components/EmojiPicker/emojiKeywords/index.js +21 -0
- package/dist/components/EmojiPicker/emojiKeywords/objects.js +652 -0
- package/dist/components/EmojiPicker/emojiKeywords/people.js +488 -0
- package/dist/components/EmojiPicker/emojiKeywords/smileys.js +538 -0
- package/dist/components/EmojiPicker/emojiKeywords/symbols.js +597 -0
- package/dist/components/EmojiPicker/emojiKeywords/travel.js +507 -0
- package/dist/components/EmptyState/EmptyState.css +1 -0
- package/dist/components/EmptyState/EmptyState2.js +47 -0
- package/dist/components/ErrorBoundary/ErrorBoundary.css +1 -0
- package/dist/components/ErrorBoundary/ErrorBoundary2.js +37 -0
- package/dist/components/EventCalendar/EventCalendar.Chip.js +45 -0
- package/dist/components/EventCalendar/EventCalendar.Month.js +118 -0
- package/dist/components/EventCalendar/EventCalendar.Week.js +131 -0
- package/dist/components/EventCalendar/EventCalendar.css +1 -0
- package/dist/components/EventCalendar/EventCalendar.helpers.js +72 -0
- package/dist/components/EventCalendar/EventCalendar2.js +157 -0
- package/dist/components/FileDropzone/FileDropzone.css +1 -0
- package/dist/components/FileDropzone/FileDropzone2.js +71 -0
- package/dist/components/Flag/Flag.css +1 -0
- package/dist/components/Flag/Flag2.js +36 -0
- package/dist/components/FloatButton/FloatButton.css +1 -0
- package/dist/components/FloatButton/FloatButton2.js +68 -0
- package/dist/components/FloatingWindow/FloatingWindow.css +1 -0
- package/dist/components/FloatingWindow/FloatingWindow2.js +203 -0
- package/dist/components/FolderBrowserModal/FolderBrowserModal.css +1 -0
- package/dist/components/FolderBrowserModal/FolderBrowserModal2.js +144 -0
- package/dist/components/Grid/Col.js +17 -0
- package/dist/components/Grid/Grid.css +1 -0
- package/dist/components/Grid/Grid2.js +28 -0
- package/dist/components/Icon/Icon.css +1 -0
- package/dist/components/Icon/Icon2.js +23 -0
- package/dist/components/IconPicker/IconPicker.css +1 -0
- package/dist/components/IconPicker/IconPicker2.js +51 -0
- package/dist/components/InfiniteScroll/InfiniteScroll.css +1 -0
- package/dist/components/InfiniteScroll/InfiniteScroll2.js +66 -0
- package/dist/components/InputDate/InputDate.css +1 -0
- package/dist/components/InputDate/InputDate2.js +87 -0
- package/dist/components/InputEmail/InputEmail.css +1 -0
- package/dist/components/InputEmail/InputEmail2.js +73 -0
- package/dist/components/InputFile/InputFile.css +1 -0
- package/dist/components/InputFile/InputFile2.js +41 -0
- package/dist/components/InputMask/InputMask.css +1 -0
- package/dist/components/InputMask/InputMask2.js +163 -0
- package/dist/components/InputNumber/InputNumber.css +1 -0
- package/dist/components/InputNumber/InputNumber2.js +60 -0
- package/dist/components/InputPIN/InputPIN.css +1 -0
- package/dist/components/InputPIN/InputPIN2.js +121 -0
- package/dist/components/InputPassword/InputPassword.css +1 -0
- package/dist/components/InputPassword/InputPassword2.js +47 -0
- package/dist/components/InputPhone/InputPhone.css +1 -0
- package/dist/components/InputPhone/InputPhone2.js +82 -0
- package/dist/components/InputSearch/InputSearch.css +1 -0
- package/dist/components/InputSearch/InputSearch2.js +53 -0
- package/dist/components/InputText/InputText.css +1 -0
- package/dist/components/InputText/InputText2.js +47 -0
- package/dist/components/InputTextarea/InputTextarea.css +1 -0
- package/dist/components/InputTextarea/InputTextarea2.js +46 -0
- package/dist/components/InputTime/InputTime.css +1 -0
- package/dist/components/InputTime/InputTime2.js +85 -0
- package/dist/components/InputUrl/InputUrl.css +1 -0
- package/dist/components/InputUrl/InputUrl2.js +65 -0
- package/dist/components/JourneyWizard/JourneyWizard.css +1 -0
- package/dist/components/JourneyWizard/JourneyWizard2.js +147 -0
- package/dist/components/List/List.css +1 -0
- package/dist/components/List/List2.js +28 -0
- package/dist/components/Loading/Loading.css +1 -0
- package/dist/components/Loading/Loading2.js +11 -0
- package/dist/components/MenuHamburger/MenuHamburger.css +1 -0
- package/dist/components/MenuHamburger/MenuHamburger2.js +65 -0
- package/dist/components/MiniSort/MiniSort.css +1 -0
- package/dist/components/MiniSort/MiniSort2.js +52 -0
- package/dist/components/MiniStatsCard/MiniStatsCard.css +1 -0
- package/dist/components/MiniStatsCard/MiniStatsCard2.js +67 -0
- package/dist/components/Minimap/Minimap.css +1 -0
- package/dist/components/Minimap/Minimap2.js +62 -0
- package/dist/components/Modal/Modal.css +1 -0
- package/dist/components/Modal/Modal2.js +87 -0
- package/dist/components/NavBar/NavBar.css +1 -0
- package/dist/components/NavBar/NavBar2.js +64 -0
- package/dist/components/NotificationPanel/NotificationPanel.css +1 -0
- package/dist/components/NotificationPanel/NotificationPanel2.js +66 -0
- package/dist/components/Pagination/Pagination.css +1 -0
- package/dist/components/Pagination/Pagination2.js +92 -0
- package/dist/components/PieChart/PieChart.css +1 -0
- package/dist/components/PieChart/PieChart2.js +142 -0
- package/dist/components/Popover/Popover.css +1 -0
- package/dist/components/Popover/Popover2.js +109 -0
- package/dist/components/Popover/hooks/Popover.hook.js +33 -0
- package/dist/components/ProgressBar/ProgressBar.css +1 -0
- package/dist/components/ProgressBar/ProgressBar2.js +48 -0
- package/dist/components/ProgressRing/ProgressRing.css +1 -0
- package/dist/components/ProgressRing/ProgressRing2.js +54 -0
- package/dist/components/QuantitySelector/QuantitySelector.css +1 -0
- package/dist/components/QuantitySelector/QuantitySelector2.js +94 -0
- package/dist/components/QuickAdd/QuickAdd.css +1 -0
- package/dist/components/QuickAdd/QuickAdd2.js +56 -0
- package/dist/components/QuickNumberUpdate/QuickNumberUpdate.css +1 -0
- package/dist/components/QuickNumberUpdate/QuickNumberUpdate2.js +52 -0
- package/dist/components/QuickOptionUpdate/QuickOptionUpdate.css +1 -0
- package/dist/components/QuickOptionUpdate/QuickOptionUpdate2.js +67 -0
- package/dist/components/Radio/Radio.css +1 -0
- package/dist/components/Radio/Radio2.js +36 -0
- package/dist/components/RangeSlider/RangeSlider.css +1 -0
- package/dist/components/RangeSlider/RangeSlider2.js +157 -0
- package/dist/components/Rating/Rating.css +1 -0
- package/dist/components/Rating/Rating2.js +148 -0
- package/dist/components/Rating/RatingIcon.js +102 -0
- package/dist/components/RichTextEditor/RichTextEditor.css +1 -0
- package/dist/components/RichTextEditor/RichTextEditor2.js +212 -0
- package/dist/components/RichTextEditor/RteLinkPrompt.js +42 -0
- package/dist/components/RichTextEditor/RteTableToolbar.js +95 -0
- package/dist/components/RichTextEditor/RteToolbar.js +106 -0
- package/dist/components/RichTextEditor/helpers.js +73 -0
- package/dist/components/RichTextEditor/hooks/useEditorHistory.js +39 -0
- package/dist/components/RichTextEditor/hooks/useLinkPrompt.js +61 -0
- package/dist/components/RichTextEditor/hooks/useTableOps.js +134 -0
- package/dist/components/RollingNumber/RollingNumber.css +1 -0
- package/dist/components/RollingNumber/RollingNumber2.js +71 -0
- package/dist/components/ScrollToTop/ScrollToTop.css +1 -0
- package/dist/components/ScrollToTop/ScrollToTop2.js +40 -0
- package/dist/components/Separator/Separator.css +1 -0
- package/dist/components/Separator/Separator2.js +39 -0
- package/dist/components/Sidebar/Sidebar.css +1 -0
- package/dist/components/Sidebar/Sidebar2.js +115 -0
- package/dist/components/Sidebar/SidebarContext.js +31 -0
- package/dist/components/SignalStrength/SignalStrength.css +1 -0
- package/dist/components/SignalStrength/SignalStrength2.js +56 -0
- package/dist/components/Skeleton/Skeleton.css +1 -0
- package/dist/components/Skeleton/Skeleton2.js +50 -0
- package/dist/components/Slider/Slider.css +1 -0
- package/dist/components/Slider/Slider2.js +39 -0
- package/dist/components/SplitPanel/SplitPanel.css +1 -0
- package/dist/components/SplitPanel/SplitPanel2.js +69 -0
- package/dist/components/Splitter/Splitter.css +1 -0
- package/dist/components/Splitter/Splitter2.js +89 -0
- package/dist/components/StackedBar/StackedBar.css +1 -0
- package/dist/components/StackedBar/StackedBar2.js +50 -0
- package/dist/components/Stats/Stats.css +1 -0
- package/dist/components/Stats/Stats2.js +26 -0
- package/dist/components/StickyBar/StickyBar.css +1 -0
- package/dist/components/StickyBar/StickyBar2.js +29 -0
- package/dist/components/SuggestionsList/SuggestionsList.css +1 -0
- package/dist/components/SuggestionsList/SuggestionsList2.js +121 -0
- package/dist/components/ThemeSettings/ThemeContext.js +138 -0
- package/dist/components/ThemeSettings/ThemeContextValue.js +5 -0
- package/dist/components/ThemeSettings/ThemeSettings.css +1 -0
- package/dist/components/ThemeSettings/ThemeSettings2.js +245 -0
- package/dist/components/ThemeSettings/themeConfig.js +7 -0
- package/dist/components/ThemeSettings/useTheme.js +10 -0
- package/dist/components/TimePicker/TimePicker.css +1 -0
- package/dist/components/TimePicker/TimePicker2.js +118 -0
- package/dist/components/TimePicker/TimeSpinner.js +59 -0
- package/dist/components/Timeline/Timeline.css +1 -0
- package/dist/components/Timeline/Timeline2.js +57 -0
- package/dist/components/TimelineMarkers/TimelineMarkers.css +1 -0
- package/dist/components/TimelineMarkers/TimelineMarkers2.js +73 -0
- package/dist/components/TipsOfTheDay/TipsOfTheDay.css +1 -0
- package/dist/components/TipsOfTheDay/TipsOfTheDay2.js +24 -0
- package/dist/components/Toast/Toast.css +1 -0
- package/dist/components/Toast/Toast2.js +39 -0
- package/dist/components/ToggleButtons/ToggleButtons.css +1 -0
- package/dist/components/ToggleButtons/ToggleButtons2.js +47 -0
- package/dist/components/ToggleSwitch/ToggleSwitch.css +1 -0
- package/dist/components/ToggleSwitch/ToggleSwitch2.js +27 -0
- package/dist/components/Toolbar/Toolbar.css +1 -0
- package/dist/components/Toolbar/Toolbar2.js +129 -0
- package/dist/components/Tooltip/Tooltip.css +1 -0
- package/dist/components/Tooltip/Tooltip2.js +93 -0
- package/dist/components/TourHud/TourHud.css +1 -0
- package/dist/components/TourHud/TourHud2.js +70 -0
- package/dist/components/Transition/Transition.css +1 -0
- package/dist/components/Transition/Transition2.js +68 -0
- package/dist/components/Tree/Tree.css +1 -0
- package/dist/components/Tree/Tree2.js +95 -0
- package/dist/components/VirtualList/VirtualList.css +1 -0
- package/dist/components/VirtualList/VirtualList2.js +64 -0
- package/dist/components/WHtR/WHtR.css +1 -0
- package/dist/components/WHtR/WHtR2.js +115 -0
- package/dist/contexts/AuthContext/AuthContext.js +113 -0
- package/dist/helpers/AppPersistenceStorage.js +50 -0
- package/dist/helpers/Datetime.js +114 -0
- package/dist/helpers/Format.js +21 -0
- package/dist/helpers/Highlight.js +36 -0
- package/dist/helpers/HtmlContent.js +118 -0
- package/dist/helpers/LogicalOperators.js +15 -0
- package/dist/helpers/Numbers.js +15 -0
- package/dist/helpers/Pagination.js +7 -0
- package/dist/helpers/Search.js +15 -0
- package/dist/helpers/Strings.js +10 -0
- package/dist/helpers/Urls.js +68 -0
- package/dist/helpers/VersionInfo.js +36 -0
- package/dist/hooks/useAppPersistence.js +51 -0
- package/dist/hooks/useAuth/useAuth.js +10 -0
- package/dist/hooks/useBodyScrollLock.js +31 -0
- package/dist/hooks/useBreakpoint.js +65 -0
- package/dist/hooks/useComponentEffect.js +8 -0
- package/dist/hooks/useSwipe.js +45 -0
- package/dist/index.css +1 -2
- package/dist/index.esm.js +1 -17211
- package/dist/index.js +348 -0
- package/dist/mfa.js +4 -0
- package/dist/node_modules/qrcode.react/lib/esm/index.js +979 -0
- package/dist/validators/Vin.js +69 -0
- package/dist/version.js +8 -0
- package/dist/version.json +4 -4
- package/package.json +8 -7
- package/dist/mfa.esm.js +0 -1293
- package/dist/useAuth-BBqdDG2z.js +0 -467
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
import './InputPhone.css';
|
|
2
|
+
/* empty css */
|
|
3
|
+
import { forwardRef as V, useState as b } from "react";
|
|
4
|
+
import { jsx as l, jsxs as r } from "react/jsx-runtime";
|
|
5
|
+
var R = "+## (###) ###-####";
|
|
6
|
+
function h(n, t) {
|
|
7
|
+
let i = 0, e = "";
|
|
8
|
+
for (let a = 0; a < t.length && !(i >= n.length); a++)
|
|
9
|
+
t[a] === "#" ? (e += n[i], i++) : i < n.length && (e += t[a]);
|
|
10
|
+
return e;
|
|
11
|
+
}
|
|
12
|
+
function c(n) {
|
|
13
|
+
return n.replace(/\D/g, "");
|
|
14
|
+
}
|
|
15
|
+
function T(n) {
|
|
16
|
+
return n.split("").filter((t) => t === "#").length;
|
|
17
|
+
}
|
|
18
|
+
var z = V(({ autoFocus: n, disabled: t, error: i, format: e = R, highlighted: a, id: d, label: u, onBlur: N, onChange: v, onClick: D, onKeyDown: L, placeholder: k, readOnly: F = !1, required: g = !1, success: o, value: s }, w) => {
|
|
19
|
+
const m = s !== void 0, [y, A] = b(() => s ? h(c(s), e) : ""), I = m ? h(c(s ?? ""), e) : y, $ = k ?? e.replace(/#/g, "0"), j = e.length, C = (p) => {
|
|
20
|
+
const M = c(p), P = T(e), f = M.slice(0, P), x = h(f, e);
|
|
21
|
+
m || A(x), v?.(x, f);
|
|
22
|
+
};
|
|
23
|
+
return /* @__PURE__ */ r("div", {
|
|
24
|
+
className: "input-phone-wrapper",
|
|
25
|
+
children: [
|
|
26
|
+
u && /* @__PURE__ */ r("label", {
|
|
27
|
+
htmlFor: d,
|
|
28
|
+
className: "input-phone-label",
|
|
29
|
+
children: [u, g && /* @__PURE__ */ l("span", {
|
|
30
|
+
className: "input-phone-required",
|
|
31
|
+
children: "*"
|
|
32
|
+
})]
|
|
33
|
+
}),
|
|
34
|
+
/* @__PURE__ */ r("div", {
|
|
35
|
+
className: `input-phone-field${i ? " input-phone-field--error" : ""}${o ? " input-phone-field--success" : ""}${a ? " input-phone-field--highlighted" : ""}${t ? " input-phone-field--disabled" : ""}`,
|
|
36
|
+
children: [/* @__PURE__ */ l("span", {
|
|
37
|
+
className: "input-phone-icon",
|
|
38
|
+
children: /* @__PURE__ */ l("svg", {
|
|
39
|
+
width: "14",
|
|
40
|
+
height: "14",
|
|
41
|
+
viewBox: "0 0 24 24",
|
|
42
|
+
fill: "none",
|
|
43
|
+
stroke: "currentColor",
|
|
44
|
+
strokeWidth: "2",
|
|
45
|
+
strokeLinecap: "round",
|
|
46
|
+
strokeLinejoin: "round",
|
|
47
|
+
children: /* @__PURE__ */ l("path", { d: "M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07A19.5 19.5 0 0 1 4.69 12 19.79 19.79 0 0 1 1.61 3.4 2 2 0 0 1 3.6 1.22h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L7.91 8.77a16 16 0 0 0 6.29 6.29l.95-.95a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z" })
|
|
48
|
+
})
|
|
49
|
+
}), /* @__PURE__ */ l("input", {
|
|
50
|
+
autoFocus: n,
|
|
51
|
+
className: "input-phone",
|
|
52
|
+
disabled: t,
|
|
53
|
+
id: d,
|
|
54
|
+
inputMode: "tel",
|
|
55
|
+
maxLength: j,
|
|
56
|
+
placeholder: $,
|
|
57
|
+
readOnly: F,
|
|
58
|
+
ref: w,
|
|
59
|
+
required: g,
|
|
60
|
+
type: "tel",
|
|
61
|
+
value: I,
|
|
62
|
+
onBlur: N,
|
|
63
|
+
onChange: (p) => C(p.target.value),
|
|
64
|
+
onClick: D,
|
|
65
|
+
onKeyDown: L
|
|
66
|
+
})]
|
|
67
|
+
}),
|
|
68
|
+
i && /* @__PURE__ */ l("span", {
|
|
69
|
+
className: "input-phone-error-message",
|
|
70
|
+
children: i
|
|
71
|
+
}),
|
|
72
|
+
o && /* @__PURE__ */ l("span", {
|
|
73
|
+
className: "input-phone-success-message",
|
|
74
|
+
children: o
|
|
75
|
+
})
|
|
76
|
+
]
|
|
77
|
+
});
|
|
78
|
+
});
|
|
79
|
+
z.displayName = "InputPhone";
|
|
80
|
+
export {
|
|
81
|
+
z as InputPhone
|
|
82
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.input-search{--input-search-line-offset:var(--spacing-12);--input-search-line-height:calc(var(--font-size-sm) * var(--line-height-normal));width:100%;position:relative}.input-search__icon{height:var(--input-search-line-height);color:var(--form-control-placeholder-color);z-index:2;left:var(--spacing-12);bottom:var(--input-search-line-offset);pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute}.input-search__icon .icon{font-size:18px}.input-search__clear{height:var(--input-search-line-height);color:var(--form-control-placeholder-color);z-index:2;right:var(--spacing-8);bottom:var(--input-search-line-offset);padding:var(--spacing-4);cursor:pointer;border-radius:var(--radius-sm);background:0 0;border:none;justify-content:center;align-items:center;transition:color .15s;display:flex;position:absolute}.input-search__clear:hover{color:var(--form-control-color)}.input-search__clear:focus{color:var(--form-control-focus-border-color);outline:none}.input-search .input-text{padding-left:var(--spacing-40)}.input-search:has(.input-search__clear) .input-text{padding-right:var(--spacing-40)}
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
import './InputSearch.css';
|
|
2
|
+
import { Icon as a } from "../Icon/Icon2.js";
|
|
3
|
+
import { Tooltip as N } from "../Tooltip/Tooltip2.js";
|
|
4
|
+
import { InputText as j } from "../InputText/InputText2.js";
|
|
5
|
+
/* empty css */
|
|
6
|
+
import { forwardRef as w } from "react";
|
|
7
|
+
import { jsx as r, jsxs as S } from "react/jsx-runtime";
|
|
8
|
+
var R = w(({ autoComplete: s = "off", autoFocus: i, disabled: t, id: n, label: m, onBlur: l, onChange: o, onClick: p, onKeyDown: h, onKeyUp: f, placeholder: u = "Search...", readOnly: c = !1, required: d = !1, value: e, className: x = "" }, _) => {
|
|
9
|
+
const C = () => {
|
|
10
|
+
o?.("");
|
|
11
|
+
}, I = e && e.length > 0 && !t && !c;
|
|
12
|
+
return /* @__PURE__ */ S("div", {
|
|
13
|
+
className: `input-search ${x}`,
|
|
14
|
+
children: [
|
|
15
|
+
/* @__PURE__ */ r("div", {
|
|
16
|
+
className: "input-search__icon",
|
|
17
|
+
children: /* @__PURE__ */ r(a, { name: "search" })
|
|
18
|
+
}),
|
|
19
|
+
/* @__PURE__ */ r(j, {
|
|
20
|
+
autoComplete: s,
|
|
21
|
+
autoFocus: i,
|
|
22
|
+
disabled: t,
|
|
23
|
+
id: n,
|
|
24
|
+
label: m,
|
|
25
|
+
onBlur: l,
|
|
26
|
+
onChange: o,
|
|
27
|
+
onClick: p,
|
|
28
|
+
onKeyDown: h,
|
|
29
|
+
onKeyUp: f,
|
|
30
|
+
placeholder: u,
|
|
31
|
+
readOnly: c,
|
|
32
|
+
required: d,
|
|
33
|
+
value: e,
|
|
34
|
+
ref: _
|
|
35
|
+
}),
|
|
36
|
+
I && /* @__PURE__ */ r(N, {
|
|
37
|
+
title: "Clear search",
|
|
38
|
+
children: /* @__PURE__ */ r("button", {
|
|
39
|
+
type: "button",
|
|
40
|
+
className: "input-search__clear",
|
|
41
|
+
onClick: C,
|
|
42
|
+
children: /* @__PURE__ */ r(a, {
|
|
43
|
+
name: "clear",
|
|
44
|
+
size: "sm"
|
|
45
|
+
})
|
|
46
|
+
})
|
|
47
|
+
})
|
|
48
|
+
]
|
|
49
|
+
});
|
|
50
|
+
});
|
|
51
|
+
export {
|
|
52
|
+
R as InputSearch
|
|
53
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.input-text-wrapper{gap:var(--spacing-8);flex-direction:column;width:100%;display:flex}.input-text-wrapper .input-text-label{color:var(--form-control-label-color,var(--form-control-color));font-size:var(--form-control-label-font-size,var(--font-size-sm));font-weight:var(--form-control-label-font-weight,var(--font-weight-medium));letter-spacing:var(--form-control-label-letter-spacing,normal);text-transform:var(--form-control-label-text-transform,none)}.input-text-wrapper .input-text-label .input-text-required{color:var(--body-danger-color,#dc2626);margin-left:var(--spacing-2)}.input-text-wrapper .input-text{background-color:var(--form-control-background-color);color:var(--form-control-color);border:var(--spacing-1) solid var(--form-control-border-color);border-radius:var(--radius-sm);padding:var(--spacing-12);font-family:var(--form-control-font-family);font-size:var(--font-size-sm);line-height:var(--line-height-normal);box-sizing:border-box;width:100%}.input-text-wrapper .input-text:focus{background-color:var(--form-control-focus-background-color);border-color:var(--form-control-focus-border-color);color:var(--form-control-focus-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow);outline:none}.input-text-wrapper .input-text::placeholder{color:var(--form-control-placeholder-color)}.input-text-wrapper .input-text.input-text-error{background-color:var(--form-control-error-background-color);border-color:var(--form-control-error-border-color);color:var(--form-control-error-color)}.input-text-wrapper .input-text.input-text-error:focus{background-color:var(--form-control-error-background-color);border-color:var(--form-control-error-border-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow)}.input-text-wrapper .input-text.input-text-success{background-color:var(--form-control-success-background-color);border-color:var(--form-control-success-border-color);color:var(--form-control-success-color)}.input-text-wrapper .input-text.input-text-success:focus{background-color:var(--form-control-success-background-color);border-color:var(--form-control-success-border-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow)}.input-text-wrapper.input-text-highlighted .input-text{border-color:var(--form-control-focus-border-color)}.input-text-wrapper .input-text-error-message{font-size:var(--font-size-xs);color:var(--form-control-error-color)}.input-text-wrapper .input-text-success-message{font-size:var(--font-size-xs);color:var(--form-control-success-color)}
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import './InputText.css';
|
|
2
|
+
/* empty css */
|
|
3
|
+
import { forwardRef as w } from "react";
|
|
4
|
+
import { jsx as t, jsxs as i } from "react/jsx-runtime";
|
|
5
|
+
var F = w(({ autoComplete: r = "on", autoFocus: l, disabled: m, error: e, highlighted: x, id: s, label: n, maxLength: u, onBlur: c, onChange: h, onClick: o, onKeyDown: d, onKeyUp: f, placeholder: g, readOnly: N = !1, required: p = !1, success: a, value: v }, $) => /* @__PURE__ */ i("div", {
|
|
6
|
+
className: `input-text-wrapper${x ? " input-text-highlighted" : ""}`,
|
|
7
|
+
children: [
|
|
8
|
+
n && /* @__PURE__ */ i("label", {
|
|
9
|
+
htmlFor: s,
|
|
10
|
+
className: "input-text-label",
|
|
11
|
+
children: [n, p && /* @__PURE__ */ t("span", {
|
|
12
|
+
className: "input-text-required",
|
|
13
|
+
children: "*"
|
|
14
|
+
})]
|
|
15
|
+
}),
|
|
16
|
+
/* @__PURE__ */ t("input", {
|
|
17
|
+
autoComplete: r,
|
|
18
|
+
autoFocus: l,
|
|
19
|
+
disabled: m,
|
|
20
|
+
type: "text",
|
|
21
|
+
className: `input-text ${e ? "input-text-error" : ""} ${a ? "input-text-success" : ""}`,
|
|
22
|
+
id: s,
|
|
23
|
+
maxLength: u,
|
|
24
|
+
placeholder: g,
|
|
25
|
+
ref: $,
|
|
26
|
+
value: v,
|
|
27
|
+
onBlur: c,
|
|
28
|
+
onChange: (j) => h?.(j.target.value),
|
|
29
|
+
onClick: o,
|
|
30
|
+
onKeyDown: d,
|
|
31
|
+
onKeyUp: f,
|
|
32
|
+
readOnly: N,
|
|
33
|
+
required: p
|
|
34
|
+
}),
|
|
35
|
+
e && /* @__PURE__ */ t("span", {
|
|
36
|
+
className: "input-text-error-message",
|
|
37
|
+
children: e
|
|
38
|
+
}),
|
|
39
|
+
a && /* @__PURE__ */ t("span", {
|
|
40
|
+
className: "input-text-success-message",
|
|
41
|
+
children: a
|
|
42
|
+
})
|
|
43
|
+
]
|
|
44
|
+
}));
|
|
45
|
+
export {
|
|
46
|
+
F as InputText
|
|
47
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.input-textarea-wrapper{gap:var(--spacing-8);flex-direction:column;display:flex}.input-textarea-wrapper .input-textarea-label{color:var(--form-control-label-color,var(--form-control-color));font-size:var(--form-control-label-font-size,var(--font-size-sm));font-weight:var(--form-control-label-font-weight,var(--font-weight-medium));letter-spacing:var(--form-control-label-letter-spacing,normal);text-transform:var(--form-control-label-text-transform,none)}.input-textarea-wrapper .input-textarea-label .input-textarea-required{color:var(--body-danger-color,#dc2626);margin-left:var(--spacing-2)}.input-textarea-wrapper .input-textarea{background-color:var(--form-control-background-color);color:var(--form-control-color);border:var(--spacing-1) solid var(--form-control-border-color);border-radius:var(--radius-sm);padding:var(--spacing-12);font-family:var(--form-control-font-family);font-size:var(--font-size-sm);line-height:var(--line-height-normal);box-sizing:border-box;width:100%}.input-textarea-wrapper .input-textarea:focus{background-color:var(--form-control-focus-background-color);border-color:var(--form-control-focus-border-color);color:var(--form-control-focus-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow);outline:none}.input-textarea-wrapper .input-textarea::placeholder{color:var(--form-control-placeholder-color)}.input-textarea-wrapper .input-textarea.input-textarea-error{background-color:var(--form-control-error-background-color);border-color:var(--form-control-error-border-color);color:var(--form-control-error-color)}.input-textarea-wrapper .input-textarea.input-textarea-error:focus{background-color:var(--form-control-error-background-color);border-color:var(--form-control-error-border-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow)}.input-textarea-wrapper .input-textarea.input-textarea-success{background-color:var(--form-control-success-background-color);border-color:var(--form-control-success-border-color);color:var(--form-control-success-color)}.input-textarea-wrapper .input-textarea.input-textarea-success:focus{background-color:var(--form-control-success-background-color);border-color:var(--form-control-success-border-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow)}.input-textarea-wrapper.input-textarea-highlighted .input-textarea{border-color:var(--form-control-focus-border-color)}.input-textarea-wrapper .input-textarea-error-message{font-size:var(--font-size-xs);color:var(--form-control-error-color)}.input-textarea-wrapper .input-textarea-success-message{font-size:var(--font-size-xs);color:var(--form-control-success-color)}
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import './InputTextarea.css';
|
|
2
|
+
/* empty css */
|
|
3
|
+
import { forwardRef as $ } from "react";
|
|
4
|
+
import { jsx as e, jsxs as n } from "react/jsx-runtime";
|
|
5
|
+
var F = $(({ autoComplete: p = "on", autoFocus: i, cols: l, disabled: m, error: a, id: r, label: s, maxLength: x, onBlur: u, onChange: c, onClick: o, onKeyDown: d, onKeyUp: h, placeholder: N, required: f, rows: g, success: t, value: v }, j) => /* @__PURE__ */ n("div", {
|
|
6
|
+
className: "input-textarea-wrapper",
|
|
7
|
+
children: [
|
|
8
|
+
s && /* @__PURE__ */ n("label", {
|
|
9
|
+
htmlFor: r,
|
|
10
|
+
className: "input-textarea-label",
|
|
11
|
+
children: [s, f && /* @__PURE__ */ e("span", {
|
|
12
|
+
className: "input-textarea-required",
|
|
13
|
+
children: "*"
|
|
14
|
+
})]
|
|
15
|
+
}),
|
|
16
|
+
/* @__PURE__ */ e("textarea", {
|
|
17
|
+
autoComplete: p,
|
|
18
|
+
autoFocus: i,
|
|
19
|
+
className: `input-textarea${a ? " input-textarea-error" : ""}${t ? " input-textarea-success" : ""}`,
|
|
20
|
+
cols: l,
|
|
21
|
+
disabled: m,
|
|
22
|
+
id: r,
|
|
23
|
+
maxLength: x,
|
|
24
|
+
onBlur: u,
|
|
25
|
+
onChange: (w) => c?.(w.target.value),
|
|
26
|
+
onClick: o,
|
|
27
|
+
onKeyDown: d,
|
|
28
|
+
onKeyUp: h,
|
|
29
|
+
placeholder: N,
|
|
30
|
+
ref: j,
|
|
31
|
+
rows: g,
|
|
32
|
+
value: v
|
|
33
|
+
}),
|
|
34
|
+
a && /* @__PURE__ */ e("span", {
|
|
35
|
+
className: "input-textarea-error-message",
|
|
36
|
+
children: a
|
|
37
|
+
}),
|
|
38
|
+
t && /* @__PURE__ */ e("span", {
|
|
39
|
+
className: "input-textarea-success-message",
|
|
40
|
+
children: t
|
|
41
|
+
})
|
|
42
|
+
]
|
|
43
|
+
}));
|
|
44
|
+
export {
|
|
45
|
+
F as InputTextarea
|
|
46
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.input-time-wrapper{gap:var(--spacing-8);flex-direction:column;display:flex}.input-time-wrapper .input-time-label{color:var(--form-control-label-color,var(--form-control-color));font-size:var(--form-control-label-font-size,var(--font-size-sm));font-weight:var(--form-control-label-font-weight,var(--font-weight-medium));letter-spacing:var(--form-control-label-letter-spacing,normal);text-transform:var(--form-control-label-text-transform,none)}.input-time-wrapper .input-time-label .input-time-required{color:var(--body-danger-color,#dc2626);margin-left:var(--spacing-2)}.input-time-wrapper .input-time{background-color:var(--form-control-background-color);color:var(--form-control-color);border:var(--spacing-1) solid var(--form-control-border-color);border-radius:var(--radius-sm);padding:var(--spacing-12);font-family:var(--form-control-font-family);font-size:var(--font-size-sm);line-height:var(--line-height-normal);box-sizing:border-box;width:100%}.input-time-wrapper .input-time:focus{background-color:var(--form-control-focus-background-color);border-color:var(--form-control-focus-border-color);color:var(--form-control-focus-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow);outline:none}.input-time-wrapper .input-time::placeholder{color:var(--form-control-placeholder-color)}.input-time-wrapper .input-time::-webkit-calendar-picker-indicator{filter:invert(.5);cursor:pointer;opacity:.7}.input-time-wrapper .input-time::-webkit-calendar-picker-indicator:hover{opacity:1}.input-time-wrapper .input-time.input-time-error{background-color:var(--form-control-error-background-color);border-color:var(--form-control-error-border-color);color:var(--form-control-error-color)}.input-time-wrapper .input-time.input-time-error:focus{background-color:var(--form-control-error-background-color);border-color:var(--form-control-error-border-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow)}.input-time-wrapper .input-time.input-time-success{background-color:var(--form-control-success-background-color);border-color:var(--form-control-success-border-color);color:var(--form-control-success-color)}.input-time-wrapper .input-time.input-time-success:focus{background-color:var(--form-control-success-background-color);border-color:var(--form-control-success-border-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow)}.input-time-wrapper.input-time-highlighted .input-time{border-color:var(--form-control-focus-border-color)}.input-time-wrapper .input-time-error-message{font-size:var(--font-size-xs);color:var(--form-control-error-color)}.input-time-wrapper .input-time-success-message{font-size:var(--font-size-xs);color:var(--form-control-success-color)}.input-time-field{align-items:center;display:flex;position:relative}.input-time-field--with-clock .input-time{padding-right:var(--spacing-40)}.input-time-field--with-clock .input-time::-webkit-calendar-picker-indicator{display:none}.input-time-clock-button{border-radius:var(--radius-sm);color:var(--form-control-color);cursor:pointer;font-size:var(--font-size-md);padding:var(--spacing-4);right:var(--spacing-8);transition:background-color var(--transition-fast), color var(--transition-fast);background-color:#0000;border:none;justify-content:center;align-items:center;line-height:1;display:flex;position:absolute}.input-time-clock-button:hover:not(:disabled){background-color:var(--calendar-day-hover-background-color)}.input-time-clock-button--active{background-color:var(--calendar-day-selected-background-color);color:var(--calendar-day-selected-color)}.input-time-clock-button:disabled{cursor:not-allowed;opacity:.5}
|
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
import './InputTime.css';
|
|
2
|
+
import { Icon as S } from "../Icon/Icon2.js";
|
|
3
|
+
import { Popover as T } from "../Popover/Popover2.js";
|
|
4
|
+
import { TimePicker as j } from "../TimePicker/TimePicker2.js";
|
|
5
|
+
/* empty css */
|
|
6
|
+
import { forwardRef as w, useRef as y, useState as E } from "react";
|
|
7
|
+
import { jsx as e, jsxs as m } from "react/jsx-runtime";
|
|
8
|
+
var v = (i) => i.toString().padStart(2, "0"), O = (i) => {
|
|
9
|
+
const [n, t] = (i ?? "").split(":").map(Number);
|
|
10
|
+
return {
|
|
11
|
+
hours: Number.isFinite(n) ? n : 0,
|
|
12
|
+
minutes: Number.isFinite(t) ? t : 0,
|
|
13
|
+
seconds: 0
|
|
14
|
+
};
|
|
15
|
+
}, H = w(({ autoFocus: i, disabled: n, error: t, highlighted: N, id: o, label: c, max: k, min: g, minuteStep: C = 1, onBlur: $, onChange: p, onClick: x, onKeyDown: F, onKeyUp: I, readOnly: u = !1, required: f = !1, success: l, value: h, withClock: a = !1 }, P) => {
|
|
16
|
+
const [r, d] = E(!1), b = y(null), R = (s) => {
|
|
17
|
+
p?.(`${v(s.hours)}:${v(s.minutes)}`);
|
|
18
|
+
};
|
|
19
|
+
return /* @__PURE__ */ m("div", {
|
|
20
|
+
className: `input-time-wrapper${N ? " input-time-highlighted" : ""}`,
|
|
21
|
+
children: [
|
|
22
|
+
c && /* @__PURE__ */ m("label", {
|
|
23
|
+
htmlFor: o,
|
|
24
|
+
className: "input-time-label",
|
|
25
|
+
children: [c, f && /* @__PURE__ */ e("span", {
|
|
26
|
+
className: "input-time-required",
|
|
27
|
+
children: "*"
|
|
28
|
+
})]
|
|
29
|
+
}),
|
|
30
|
+
/* @__PURE__ */ m("div", {
|
|
31
|
+
ref: b,
|
|
32
|
+
className: `input-time-field${a ? " input-time-field--with-clock" : ""}`,
|
|
33
|
+
children: [/* @__PURE__ */ e("input", {
|
|
34
|
+
autoFocus: i,
|
|
35
|
+
disabled: n,
|
|
36
|
+
type: "time",
|
|
37
|
+
className: `input-time${t ? " input-time-error" : ""}${l ? " input-time-success" : ""}`,
|
|
38
|
+
id: o,
|
|
39
|
+
max: k,
|
|
40
|
+
min: g,
|
|
41
|
+
ref: P,
|
|
42
|
+
value: h ?? "",
|
|
43
|
+
onBlur: $,
|
|
44
|
+
onChange: (s) => p?.(s.target.value || void 0),
|
|
45
|
+
onClick: x,
|
|
46
|
+
onKeyDown: F,
|
|
47
|
+
onKeyUp: I,
|
|
48
|
+
readOnly: u,
|
|
49
|
+
required: f
|
|
50
|
+
}), a && /* @__PURE__ */ e("button", {
|
|
51
|
+
className: `input-time-clock-button${r ? " input-time-clock-button--active" : ""}`,
|
|
52
|
+
disabled: n || u,
|
|
53
|
+
onClick: () => d(!r),
|
|
54
|
+
title: "Pick on a clock",
|
|
55
|
+
type: "button",
|
|
56
|
+
children: /* @__PURE__ */ e(S, { name: "time" })
|
|
57
|
+
})]
|
|
58
|
+
}),
|
|
59
|
+
t && /* @__PURE__ */ e("span", {
|
|
60
|
+
className: "input-time-error-message",
|
|
61
|
+
children: t
|
|
62
|
+
}),
|
|
63
|
+
l && /* @__PURE__ */ e("span", {
|
|
64
|
+
className: "input-time-success-message",
|
|
65
|
+
children: l
|
|
66
|
+
}),
|
|
67
|
+
a && /* @__PURE__ */ e(T, {
|
|
68
|
+
visible: r,
|
|
69
|
+
onClose: () => d(!1),
|
|
70
|
+
anchorEl: b.current,
|
|
71
|
+
children: /* @__PURE__ */ e(j, {
|
|
72
|
+
collapsibleClock: !1,
|
|
73
|
+
label: "",
|
|
74
|
+
minuteStep: C,
|
|
75
|
+
onChange: R,
|
|
76
|
+
value: O(h),
|
|
77
|
+
withClock: !0
|
|
78
|
+
})
|
|
79
|
+
})
|
|
80
|
+
]
|
|
81
|
+
});
|
|
82
|
+
});
|
|
83
|
+
export {
|
|
84
|
+
H as InputTime
|
|
85
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.input-url-wrapper{gap:var(--spacing-8);flex-direction:column;width:100%;display:flex}.input-url-wrapper .input-url-label{color:var(--form-control-label-color,var(--form-control-color));font-size:var(--form-control-label-font-size,var(--font-size-sm));font-weight:var(--form-control-label-font-weight,var(--font-weight-medium));letter-spacing:var(--form-control-label-letter-spacing,normal);text-transform:var(--form-control-label-text-transform,none)}.input-url-wrapper .input-url-label .input-url-required{color:var(--body-danger-color,#dc2626);margin-left:var(--spacing-2)}.input-url-wrapper .input-url{background-color:var(--form-control-background-color);color:var(--form-control-color);border:var(--spacing-1) solid var(--form-control-border-color);border-radius:var(--radius-sm);padding:var(--spacing-12);font-family:var(--form-control-font-family);font-size:var(--font-size-sm);line-height:var(--line-height-normal);box-sizing:border-box;width:100%}.input-url-wrapper .input-url:focus{background-color:var(--form-control-focus-background-color);border-color:var(--form-control-focus-border-color);color:var(--form-control-focus-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow);outline:none}.input-url-wrapper .input-url::placeholder{color:var(--form-control-placeholder-color)}.input-url-wrapper .input-url.input-url-error{background-color:var(--form-control-error-background-color);border-color:var(--form-control-error-border-color);color:var(--form-control-error-color)}.input-url-wrapper .input-url.input-url-error:focus{background-color:var(--form-control-error-background-color);border-color:var(--form-control-error-border-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow)}.input-url-wrapper .input-url.input-url-success{background-color:var(--form-control-success-background-color);border-color:var(--form-control-success-border-color);color:var(--form-control-success-color)}.input-url-wrapper .input-url.input-url-success:focus{background-color:var(--form-control-success-background-color);border-color:var(--form-control-success-border-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow)}.input-url-wrapper.input-url-highlighted .input-url{border-color:var(--form-control-focus-border-color)}.input-url-wrapper .input-url-error-message{font-size:var(--font-size-xs);color:var(--form-control-error-color)}.input-url-wrapper .input-url-success-message{font-size:var(--font-size-xs);color:var(--form-control-success-color)}
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
import './InputUrl.css';
|
|
2
|
+
/* empty css */
|
|
3
|
+
import { forwardRef as A, useState as B } from "react";
|
|
4
|
+
import { jsx as t, jsxs as m } from "react/jsx-runtime";
|
|
5
|
+
var F = "Please enter a valid URL (e.g. https://example.com)", I = (l) => {
|
|
6
|
+
try {
|
|
7
|
+
const e = new URL(l);
|
|
8
|
+
return e.protocol === "http:" || e.protocol === "https:";
|
|
9
|
+
} catch {
|
|
10
|
+
return !1;
|
|
11
|
+
}
|
|
12
|
+
}, G = A(({ autoFocus: l, disabled: e, error: f, highlighted: v, id: u, label: i, maxLength: g, onBlur: E, onChange: R, onClick: N, onKeyDown: U, onKeyUp: x, onValidationChange: o, placeholder: L = "https://...", readOnly: w = !1, required: p = !1, success: a, validationErrorMessage: y, value: S }, _) => {
|
|
13
|
+
const [c, d] = B(void 0), h = (r) => {
|
|
14
|
+
if (!r)
|
|
15
|
+
return d(void 0), o?.(!0), !0;
|
|
16
|
+
const n = I(r);
|
|
17
|
+
return d(n ? void 0 : y ?? F), o?.(n), n;
|
|
18
|
+
}, $ = (r) => {
|
|
19
|
+
R?.(r), c && h(r);
|
|
20
|
+
}, j = (r) => {
|
|
21
|
+
h(r.target.value), E?.(r);
|
|
22
|
+
}, s = f ?? c;
|
|
23
|
+
return /* @__PURE__ */ m("div", {
|
|
24
|
+
className: `input-url-wrapper${v ? " input-url-highlighted" : ""}`,
|
|
25
|
+
children: [
|
|
26
|
+
i && /* @__PURE__ */ m("label", {
|
|
27
|
+
htmlFor: u,
|
|
28
|
+
className: "input-url-label",
|
|
29
|
+
children: [i, p && /* @__PURE__ */ t("span", {
|
|
30
|
+
className: "input-url-required",
|
|
31
|
+
children: "*"
|
|
32
|
+
})]
|
|
33
|
+
}),
|
|
34
|
+
/* @__PURE__ */ t("input", {
|
|
35
|
+
autoFocus: l,
|
|
36
|
+
disabled: e,
|
|
37
|
+
type: "url",
|
|
38
|
+
className: `input-url${s ? " input-url-error" : ""}${a ? " input-url-success" : ""}`,
|
|
39
|
+
id: u,
|
|
40
|
+
maxLength: g,
|
|
41
|
+
placeholder: L,
|
|
42
|
+
ref: _,
|
|
43
|
+
value: S,
|
|
44
|
+
onBlur: j,
|
|
45
|
+
onChange: (r) => $(r.target.value),
|
|
46
|
+
onClick: N,
|
|
47
|
+
onKeyDown: U,
|
|
48
|
+
onKeyUp: x,
|
|
49
|
+
readOnly: w,
|
|
50
|
+
required: p
|
|
51
|
+
}),
|
|
52
|
+
s && /* @__PURE__ */ t("span", {
|
|
53
|
+
className: "input-url-error-message",
|
|
54
|
+
children: s
|
|
55
|
+
}),
|
|
56
|
+
a && /* @__PURE__ */ t("span", {
|
|
57
|
+
className: "input-url-success-message",
|
|
58
|
+
children: a
|
|
59
|
+
})
|
|
60
|
+
]
|
|
61
|
+
});
|
|
62
|
+
});
|
|
63
|
+
export {
|
|
64
|
+
G as InputUrl
|
|
65
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.journey-wizard{gap:var(--spacing-24);flex-direction:column;display:flex}.journey-wizard--modal{padding:var(--spacing-4) var(--spacing-24) var(--spacing-24)}.journey-wizard--drawer{padding:var(--spacing-4) 0 var(--spacing-8)}.journey-wizard__progress{gap:var(--spacing-8);padding-top:var(--spacing-12);justify-content:center;align-items:center;display:flex}.journey-wizard__dot{border-radius:var(--radius-full);background-color:var(--border-color);width:8px;height:8px;transition:width var(--transition-moderate), background-color var(--transition-moderate)}.journey-wizard__dot--done{background-color:var(--body-accent-color);opacity:.5}.journey-wizard__dot--active{background-color:var(--body-accent-color);width:24px}.journey-wizard__step{gap:var(--spacing-20);flex-direction:column;display:flex}.journey-wizard__step-header{gap:var(--spacing-6);flex-direction:column;display:flex}.journey-wizard__step-title{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--body-title-color);line-height:var(--line-height-tight);margin:0}.journey-wizard__step-subtitle{font-size:var(--font-size-sm);color:var(--body-color-muted);line-height:var(--line-height-normal);margin:0}.journey-wizard__step-content{gap:var(--spacing-16);flex-direction:column;display:flex}.journey-wizard__nav{padding-top:var(--spacing-16);border-top:1px solid var(--border-color);margin-top:var(--spacing-8);justify-content:space-between;align-items:center;display:flex}.journey-wizard__nav-side{min-width:90px;display:flex}.journey-wizard__nav-side--right{justify-content:flex-end}.journey-wizard__nav-counter{font-size:var(--font-size-sm);color:var(--body-color-muted);font-weight:var(--font-weight-medium)}
|
|
@@ -0,0 +1,147 @@
|
|
|
1
|
+
import './JourneyWizard.css';
|
|
2
|
+
import { Icon as C } from "../Icon/Icon2.js";
|
|
3
|
+
import { Button as c } from "../Button/Button2.js";
|
|
4
|
+
import { Modal as k } from "../Modal/Modal2.js";
|
|
5
|
+
import { Drawer as x } from "../Drawer/Drawer2.js";
|
|
6
|
+
/* empty css */
|
|
7
|
+
import { useEffect as S, useState as B } from "react";
|
|
8
|
+
import { jsx as e, jsxs as a } from "react/jsx-runtime";
|
|
9
|
+
var M = ({ isOpen: n, onClose: z, onComplete: j, steps: t, title: u, presentation: _ = "drawer", width: y = "480px" }) => {
|
|
10
|
+
const [i, s] = B(0);
|
|
11
|
+
S(() => {
|
|
12
|
+
n && s(0);
|
|
13
|
+
}, [n]);
|
|
14
|
+
const r = t[i], p = i === t.length - 1, v = i === 0, h = r?.canProceed !== !1, N = r?.canGoBack !== !1, f = () => {
|
|
15
|
+
i < t.length - 1 && s((d) => d + 1);
|
|
16
|
+
}, b = () => {
|
|
17
|
+
i > 0 && s((d) => d - 1);
|
|
18
|
+
}, m = () => {
|
|
19
|
+
s(0), z();
|
|
20
|
+
}, g = () => {
|
|
21
|
+
s(0), j();
|
|
22
|
+
}, o = /* @__PURE__ */ e("div", {
|
|
23
|
+
className: "journey-wizard__progress",
|
|
24
|
+
children: t.map((d, w) => /* @__PURE__ */ e("span", { className: `journey-wizard__dot${w === i ? " journey-wizard__dot--active" : w < i ? " journey-wizard__dot--done" : ""}` }, d.id))
|
|
25
|
+
}), l = /* @__PURE__ */ a("div", {
|
|
26
|
+
className: "journey-wizard__nav",
|
|
27
|
+
children: [
|
|
28
|
+
/* @__PURE__ */ e("div", {
|
|
29
|
+
className: "journey-wizard__nav-side",
|
|
30
|
+
children: !v && /* @__PURE__ */ e(c, {
|
|
31
|
+
variant: "ghost",
|
|
32
|
+
icon: "previous",
|
|
33
|
+
disabled: !N,
|
|
34
|
+
onClick: b,
|
|
35
|
+
children: "Back"
|
|
36
|
+
})
|
|
37
|
+
}),
|
|
38
|
+
/* @__PURE__ */ a("span", {
|
|
39
|
+
className: "journey-wizard__nav-counter",
|
|
40
|
+
children: [
|
|
41
|
+
i + 1,
|
|
42
|
+
" / ",
|
|
43
|
+
t.length
|
|
44
|
+
]
|
|
45
|
+
}),
|
|
46
|
+
/* @__PURE__ */ e("div", {
|
|
47
|
+
className: "journey-wizard__nav-side journey-wizard__nav-side--right",
|
|
48
|
+
children: p ? /* @__PURE__ */ e(c, {
|
|
49
|
+
variant: "success",
|
|
50
|
+
icon: "save",
|
|
51
|
+
disabled: !h,
|
|
52
|
+
onClick: g,
|
|
53
|
+
children: "Save"
|
|
54
|
+
}) : /* @__PURE__ */ a(c, {
|
|
55
|
+
variant: "info",
|
|
56
|
+
disabled: !h,
|
|
57
|
+
onClick: f,
|
|
58
|
+
children: ["Next ", /* @__PURE__ */ e(C, {
|
|
59
|
+
name: "next",
|
|
60
|
+
size: "sm"
|
|
61
|
+
})]
|
|
62
|
+
})
|
|
63
|
+
})
|
|
64
|
+
]
|
|
65
|
+
});
|
|
66
|
+
return _ === "inline" ? n ? /* @__PURE__ */ a("div", {
|
|
67
|
+
className: "journey-wizard journey-wizard--inline",
|
|
68
|
+
children: [
|
|
69
|
+
o,
|
|
70
|
+
/* @__PURE__ */ a("div", {
|
|
71
|
+
className: "journey-wizard__step",
|
|
72
|
+
children: [/* @__PURE__ */ a("div", {
|
|
73
|
+
className: "journey-wizard__step-header",
|
|
74
|
+
children: [/* @__PURE__ */ e("h2", {
|
|
75
|
+
className: "journey-wizard__step-title",
|
|
76
|
+
children: r?.title
|
|
77
|
+
}), r?.subtitle && /* @__PURE__ */ e("p", {
|
|
78
|
+
className: "journey-wizard__step-subtitle",
|
|
79
|
+
children: r.subtitle
|
|
80
|
+
})]
|
|
81
|
+
}), /* @__PURE__ */ e("div", {
|
|
82
|
+
className: "journey-wizard__step-content",
|
|
83
|
+
children: r?.content
|
|
84
|
+
})]
|
|
85
|
+
}),
|
|
86
|
+
l
|
|
87
|
+
]
|
|
88
|
+
}) : null : _ === "modal" ? /* @__PURE__ */ e(k, {
|
|
89
|
+
isOpen: n,
|
|
90
|
+
onClose: m,
|
|
91
|
+
title: u,
|
|
92
|
+
size: "large",
|
|
93
|
+
usePortal: !0,
|
|
94
|
+
children: /* @__PURE__ */ a("div", {
|
|
95
|
+
className: "journey-wizard journey-wizard--modal",
|
|
96
|
+
children: [
|
|
97
|
+
o,
|
|
98
|
+
/* @__PURE__ */ a("div", {
|
|
99
|
+
className: "journey-wizard__step",
|
|
100
|
+
children: [/* @__PURE__ */ a("div", {
|
|
101
|
+
className: "journey-wizard__step-header",
|
|
102
|
+
children: [/* @__PURE__ */ e("h2", {
|
|
103
|
+
className: "journey-wizard__step-title",
|
|
104
|
+
children: r?.title
|
|
105
|
+
}), r?.subtitle && /* @__PURE__ */ e("p", {
|
|
106
|
+
className: "journey-wizard__step-subtitle",
|
|
107
|
+
children: r.subtitle
|
|
108
|
+
})]
|
|
109
|
+
}), /* @__PURE__ */ e("div", {
|
|
110
|
+
className: "journey-wizard__step-content",
|
|
111
|
+
children: r?.content
|
|
112
|
+
})]
|
|
113
|
+
}),
|
|
114
|
+
l
|
|
115
|
+
]
|
|
116
|
+
})
|
|
117
|
+
}) : /* @__PURE__ */ e(x, {
|
|
118
|
+
isOpen: n,
|
|
119
|
+
onClose: m,
|
|
120
|
+
title: u,
|
|
121
|
+
width: y,
|
|
122
|
+
position: "right",
|
|
123
|
+
footer: l,
|
|
124
|
+
children: /* @__PURE__ */ a("div", {
|
|
125
|
+
className: "journey-wizard journey-wizard--drawer",
|
|
126
|
+
children: [o, /* @__PURE__ */ a("div", {
|
|
127
|
+
className: "journey-wizard__step",
|
|
128
|
+
children: [/* @__PURE__ */ a("div", {
|
|
129
|
+
className: "journey-wizard__step-header",
|
|
130
|
+
children: [/* @__PURE__ */ e("h2", {
|
|
131
|
+
className: "journey-wizard__step-title",
|
|
132
|
+
children: r?.title
|
|
133
|
+
}), r?.subtitle && /* @__PURE__ */ e("p", {
|
|
134
|
+
className: "journey-wizard__step-subtitle",
|
|
135
|
+
children: r.subtitle
|
|
136
|
+
})]
|
|
137
|
+
}), /* @__PURE__ */ e("div", {
|
|
138
|
+
className: "journey-wizard__step-content",
|
|
139
|
+
children: r?.content
|
|
140
|
+
})]
|
|
141
|
+
})]
|
|
142
|
+
})
|
|
143
|
+
});
|
|
144
|
+
};
|
|
145
|
+
export {
|
|
146
|
+
M as JourneyWizard
|
|
147
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.list{margin:0;padding:0;list-style:none}.list--vertical{flex-direction:column;display:flex}.list--horizontal{flex-flow:wrap;display:flex}.list__item{padding:var(--spacing-8) var(--spacing-12);color:var(--body-color);font-size:var(--font-size-sm);line-height:var(--line-height-normal);transition:background-color var(--transition-fast), color var(--transition-fast);border-radius:var(--radius-sm);align-items:center;display:flex}.list__item--alternate{background-color:var(--list-alternate-background-color)}.list__item--disabled{opacity:.45;pointer-events:none;cursor:not-allowed}.list--selectable .list__item{cursor:pointer;-webkit-user-select:none;user-select:none}.list--selectable .list__item:hover:not(.list--selectable .list__item--disabled){background-color:var(--list-hover-background-color);color:var(--body-color-accent)}.list--selectable .list__item--active{background-color:var(--list-hover-background-color);color:var(--body-color-accent);border-left:3px solid var(--card-border-accent-color);padding-left:calc(var(--spacing-12) - 3px)}.list--horizontal .list--selectable .list__item--active{border-left:none;border-bottom:3px solid var(--card-border-accent-color);padding-left:var(--spacing-12);padding-bottom:calc(var(--spacing-8) - 3px)}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import './List.css';
|
|
2
|
+
/* empty css */
|
|
3
|
+
import { useState as f } from "react";
|
|
4
|
+
import { jsx as e } from "react/jsx-runtime";
|
|
5
|
+
var h = ({ items: l, direction: s = "vertical", selectable: t = !1, defaultSelectedId: a, onSelect: r, className: d = "" }) => {
|
|
6
|
+
const [c, n] = f(a), o = (i) => {
|
|
7
|
+
!t || i.disabled || (n(i.id), r?.(i));
|
|
8
|
+
};
|
|
9
|
+
return /* @__PURE__ */ e("ul", {
|
|
10
|
+
className: `list list--${s} ${t ? "list--selectable" : ""} ${d}`,
|
|
11
|
+
children: l.map((i, _) => {
|
|
12
|
+
const m = t && c === i.id;
|
|
13
|
+
return /* @__PURE__ */ e("li", {
|
|
14
|
+
className: [
|
|
15
|
+
"list__item",
|
|
16
|
+
_ % 2 === 1 ? "list__item--alternate" : "",
|
|
17
|
+
m ? "list__item--active" : "",
|
|
18
|
+
i.disabled ? "list__item--disabled" : ""
|
|
19
|
+
].filter(Boolean).join(" "),
|
|
20
|
+
onClick: () => o(i),
|
|
21
|
+
children: i.label
|
|
22
|
+
}, i.id);
|
|
23
|
+
})
|
|
24
|
+
});
|
|
25
|
+
};
|
|
26
|
+
export {
|
|
27
|
+
h as List
|
|
28
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.loading{padding:var(--spacing-32);justify-content:center;align-items:center;display:flex}.loading__spinner{width:var(--spacing-40);height:var(--spacing-40);border:var(--spacing-4) solid var(--loader-border-color);border-top:var(--spacing-4) solid var(--loader-border-top-color);border-radius:50%;animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import './Loading.css';
|
|
2
|
+
/* empty css */
|
|
3
|
+
import "react";
|
|
4
|
+
import { jsx as r } from "react/jsx-runtime";
|
|
5
|
+
var m = () => /* @__PURE__ */ r("div", {
|
|
6
|
+
className: "loading",
|
|
7
|
+
children: /* @__PURE__ */ r("div", { className: "loading__spinner" })
|
|
8
|
+
});
|
|
9
|
+
export {
|
|
10
|
+
m as Loading
|
|
11
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.MenuHamburger{--MenuHamburger-icon-button-size:calc(var(--spacing-12) + var(--spacing-12) + 1.3125rem + var(--spacing-1) + var(--spacing-1));position:relative}.MenuHamburger_opener--icon-only,.MenuHamburger_single-item--icon-only{box-sizing:border-box;width:var(--MenuHamburger-icon-button-size);height:var(--MenuHamburger-icon-button-size);justify-content:center;padding:0!important}.MenuHamburger_dropdown{flex-direction:column;min-width:200px;display:flex}.MenuHamburger_dropdown button{border-radius:0!important}.MenuHamburger_entry:not(:last-child) .MenuHamburger_item{border-bottom:var(--spacing-1) solid var(--delimiter-color)}.MenuHamburger_separator{height:var(--spacing-4);background-color:var(--delimiter-color);opacity:.5}.MenuHamburger_item{cursor:pointer;text-align:left;width:100%;padding:var(--spacing-12) var(--spacing-16)!important;color:var(--card-color)!important;background-color:#0000!important;align-items:flex-start!important;transition:background-color .2s!important;display:flex!important}.MenuHamburger_item span{gap:var(--spacing-12);align-items:center;display:flex}.MenuHamburger_item span span:first-child{width:var(--spacing-32)}.MenuHamburger_item:hover{background-color:var(--list-hover-background-color)!important}.MenuHamburger_item--active{background-color:var(--card-background-accent-color)!important;border-left:4px solid var(--card-border-accent-color)!important;font-weight:var(--font-weight-semibold)!important}.MenuHamburger_item--active:hover{background-color:var(--card-background-accent-color)}.MenuHamburger_item__icon{font-size:var(--font-size-lg);line-height:1}.MenuHamburger_item__label{font-size:var(--font-size-sm);font-weight:inherit;white-space:nowrap}
|