@linzjs/windows 14.0.0 → 16.0.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/index.js +1004 -1302
- package/dist/index.js.map +1 -1
- package/package.json +15 -16
package/dist/index.js
CHANGED
|
@@ -2,7 +2,7 @@ import * as React from 'react';
|
|
|
2
2
|
import React__default, { useRef, useEffect, useState, createContext, useContext, forwardRef, createRef, useLayoutEffect, useCallback, memo, useMemo, PureComponent, createElement, Fragment as Fragment$1 } from 'react';
|
|
3
3
|
import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
|
|
4
4
|
import { LuiButton, LuiIcon, LuiMiniSpinner, LuiCheckboxInput, LuiFileInputBox } from '@linzjs/lui';
|
|
5
|
-
import
|
|
5
|
+
import ReactDOM, { createPortal, flushSync } from 'react-dom';
|
|
6
6
|
|
|
7
7
|
const VoidFn = () => {
|
|
8
8
|
};
|
|
@@ -42,45 +42,7 @@ const tabToSiblingElement = (direction) => {
|
|
|
42
42
|
}
|
|
43
43
|
};
|
|
44
44
|
|
|
45
|
-
function
|
|
46
|
-
if (ref === void 0) ref = {};
|
|
47
|
-
var insertAt = ref.insertAt;
|
|
48
|
-
if (typeof document === "undefined") {
|
|
49
|
-
return;
|
|
50
|
-
}
|
|
51
|
-
var head = document.head || document.getElementsByTagName("head")[0];
|
|
52
|
-
var style = document.createElement("style");
|
|
53
|
-
style.type = "text/css";
|
|
54
|
-
if (insertAt === "top") {
|
|
55
|
-
if (head.firstChild) {
|
|
56
|
-
head.insertBefore(style, head.firstChild);
|
|
57
|
-
} else {
|
|
58
|
-
head.appendChild(style);
|
|
59
|
-
}
|
|
60
|
-
} else {
|
|
61
|
-
head.appendChild(style);
|
|
62
|
-
}
|
|
63
|
-
if (style.styleSheet) {
|
|
64
|
-
style.styleSheet.cssText = css;
|
|
65
|
-
} else {
|
|
66
|
-
style.appendChild(document.createTextNode(css));
|
|
67
|
-
}
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
var css_248z = ".WindowPanel-blue .WindowPanel-header,.WindowPanel-blue.WindowPanel-header{background:linear-gradient(270deg,#007198,#00425b 100%);color:#fff}.WindowPanel-blue .WindowPanel-header svg *,.WindowPanel-blue.WindowPanel-header svg *{fill:#fff}.WindowPanel-blue .LuiTab{color:#dcf5f0}.WindowPanel-blue .LuiTab.LuiTab--active{color:#73cdc8}.PopoutWindowContainer,.WindowPanel{color:#2a292c;font-family:Open Sans,system-ui,sans-serif;font-size:16px;font-style:normal;font-weight:400;line-height:1.5}.LuiCheckboxInput--nomargin{margin:0}.panelDock>.panelDock-content:not(:empty)+.panelDock-empty{display:none}.WindowPanel-children{display:flex;flex:1;overflow:hidden;text-overflow:ellipsis}.WindowPanel-header{align-items:center;border-bottom:2px solid #eaeaea;color:#2a292c;display:flex;flex-direction:row;font-size:1em;font-weight:600;height:48px;justify-content:space-between;line-height:48px;overflow:hidden;padding:0 16px;user-select:none;white-space:nowrap}.WindowPanel-header .LuiTabsGroup{line-height:16px;margin-top:4px}.WindowPanel-header .LuiTabsGroup .LuiTab{min-width:0;padding-bottom:11px;padding-left:8px;padding-right:8px}.WindowPanel-header .LuiTabsGroup .LuiTab:not(.LuiTab--active):focus{padding-bottom:8px;padding-top:8px}.WindowPanel-header .LuiTabsGroup .LuiTab--active{padding-left:7px;padding-right:7px}.WindowPanel-header .LuiTabsGroup .LuiTab--active:after,.WindowPanel-header .LuiTabsGroup .LuiTab--active:focus:after{padding:0}.WindowPanel-header .lui-button+.lui-button,.WindowPanel-header a.lui-button+.lui-button{margin-left:0!important}.WindowPanel-footer{background-color:#fff;border-top:2px solid #eaeaea;display:flex;flex-direction:row;padding:12px;width:100%}.WindowPanel-footer .WindowPanel-footer-left{flex:1}.WindowPanel-footer:where(:not(:has(.WindowPanel-footer-left))){justify-content:right}.WindowPanel{background-color:#fff;border-radius:9px;box-shadow:0 1px 6px 0 rgba(0,0,0,.149),0 6px 10px 0 rgba(0,0,0,.251);box-sizing:border-box;display:flex;flex-direction:column}.WindowPanel .WindowPanel-header{border-radius:9px 9px 0 0}.WindowPanel .WindowPanel-footer{border-radius:0 0 9px 9px}.WindowPanel:where(:has(.WindowPanel-header)) .WindowPanel-content:where(:last-child){border-radius:0 0 9px 9px}.WindowPanel-divider-left,.WindowPanel-divider-right{background-color:#eaeaea;border-left:2px solid #eaeaea;height:19px;width:0}.WindowPanel-divider-left{margin-left:19px;margin-right:15px}.WindowPanel-divider-right{margin-left:8px;margin-right:8px}.WindowPanel-buttons,.WindowPanel-buttons a.lui-button,.WindowPanel-buttons button.lui-button{align-items:center;display:flex}.WindowPanel-buttons a.lui-button span.LuiIcon,.WindowPanel-buttons button.lui-button span.LuiIcon{margin-left:auto;margin-right:auto}.WindowPanel-header-title{align-items:center;display:flex;overflow:hidden;white-space:nowrap}.WindowPanel-header-title-icon{fill:#6b6966!important;margin-right:8px}.WindowPanel-content{display:flex;flex:1;flex-direction:column;overflow:auto}.RibbonMenuSeparator{background-color:#dad7d6;height:1px;margin:4px}.RibbonMenuOption{color:#2a292c;font-family:Open Sans,system-ui,sans-serif}.RibbonMenuOption path{fill:#6b6966}.RibbonMenuOption{align-items:center;background-color:initial;border:1px #0000;box-sizing:border-box;display:flex;font-size:16px;font-weight:400;gap:8px;line-height:24px;min-width:180px;outline:none;padding:6px 12px}.RibbonMenuOption:focus,.RibbonMenuOption:hover{background-color:#e2f3f7}.RibbonMenuOption:disabled{color:#989189}.RibbonMenuOption:disabled path{fill:#989189}.RibbonDemoContent{gap:12px;padding:20px 24px 24px 16px}.RibbonDemoSwitch{align-items:start;display:flex;flex-direction:row;gap:12px;padding:12px 0 0}.RibbonDemoSwitch div:first-child{display:flex}.RibbonDemoSwitch-textHeader{font-size:16px;font-weight:600;line-height:20px}.RibbonDemoSwitch-textDescription{color:#6b6966;font-size:14px;font-weight:400}.RibbonButton{box-sizing:border-box}.RibbonButton img{max-width:100%}.RibbonButton{fill:#007198;background-color:initial;border:2px solid #fff;border-radius:5px;color:#007198;height:40px;margin:2px;padding:4px;position:relative;width:40px}.RibbonButton:hover{background-color:#e2f3f7}.RibbonButton .RibbonButton-disabled,.RibbonButton:disabled{fill:#6b6966;background-color:#eaeaea;cursor:not-allowed}.RibbonButton .RibbonButton-disabled svg *,.RibbonButton:disabled svg *{fill:#6b6966}.RibbonButton span.LuiIcon{display:block;margin:auto}.RibbonButtonProcessing{align-items:center;display:flex;height:44px;justify-content:center;width:44px}.RibbonButtonSkeleton{line-height:1px;margin:0;padding:4px}.RibbonButtonSkeleton>div{border:2px solid #0000;margin:0;padding:0}.RibbonButton-selected,.RibbonButton:has(+:popover-open){background-color:#007198!important;box-shadow:inset 0 2px 4px #295c82;color:#fff!important;cursor:pointer}.RibbonButton-selected svg path,.RibbonButton:has(+:popover-open) svg path{fill:#fff!important;color:#fff!important}.RibbonButton-horizontalGroup,.RibbonButton-verticalGroup,.RibbonButtonContent{align-items:center;background-color:#fff;border-radius:5px;box-shadow:0 0 10px #0003;display:inline-flex;padding:0}.RibbonButton-separator{background-color:#eaeaea}.RibbonButton-verticalGroup{flex-direction:column}.RibbonButton-verticalGroup .RibbonButton-separator{height:2px;margin-bottom:1px;margin-top:1px;width:44px}.RibbonButton-horizontalGroup{flex-direction:row}.RibbonButton-horizontalGroup .RibbonButton-separator{height:44px;margin-left:1px;margin-right:1px;width:2px}.RibbonSliderMenu[popover]{background:#0000;border:0;inset:auto;margin:0;position:fixed}.RibbonSliderMenu:popover-open{display:flex;flex-direction:row}.RibbonSliderMenu-right,.RibbonSliderMenu-right-down{translate:2px -6px}.RibbonSliderMenu-left-center,.RibbonSliderMenu-right-center{translate:2px 20px}.RibbonSliderMenu-left,.RibbonSliderMenu-left-down{translate:-2px -6px}.RibbonSliderMenu-right-up{translate:2px 6px}.RibbonSliderMenu-left-up{translate:-2px 6px}.RibbonSliderMenu-up,.RibbonSliderMenu-up-right{translate:-6px -2px}.RibbonSliderMenu-down,.RibbonSliderMenu-down-right{translate:-6px 2px}.RibbonSliderMenu-down-left{translate:6px 2px}.CopyToClipboard{cursor:pointer}.windows_tooltip{box-sizing:border-box;cursor:pointer;position:relative}.windows_tooltip .windows_tooltiptext{background-color:#fff;box-shadow:0 2px 3px rgba(0,0,0,.251),0 0 3px rgba(0,0,0,.149);color:#2e3438;font-size:13px;left:calc(100% + 8px);line-height:18px;opacity:0;overflow:hidden;padding:4px 8px;pointer-events:none;position:absolute;text-align:left;transform:translateY(42%);transition:opacity .3s ease,width .3s ease;z-index:1}.windows_tooltip:hover .windows_tooltiptext{opacity:1;visibility:visible}dialog.LuiModalAsync,div.LuiModalAsync{color:#2a292c;font-family:Open Sans,system-ui,sans-serif;font-size:16px;font-style:normal;font-weight:400;line-height:1.5}dialog.LuiModalAsync .LuiModalAsync-header h4,div.LuiModalAsync .LuiModalAsync-header h4{color:#017a76;font-family:Open Sans,system-ui,sans-serif;font-size:1.375rem;font-style:normal;font-weight:400;line-height:1.5;margin-bottom:0}dialog.LuiModalAsync::backdrop{background:#0000001a}dialog.LuiModalAsync,div.LuiModalAsync{border:none;border-radius:9px;box-shadow:0 2px 3px 0 rgba(0,0,0,.251),0 0 3px 0 rgba(0,0,0,.149);box-sizing:border-box;display:flex;flex-direction:column;gap:1.5rem;max-height:80vh;max-width:80vw;min-width:400px;padding:1.5rem}dialog.LuiModalAsync:focus-visible,div.LuiModalAsync:focus-visible{outline:none}dialog.LuiModalAsync .LuiModalAsync-header-icon,div.LuiModalAsync .LuiModalAsync-header-icon{fill:#3a7cdf}dialog.LuiModalAsync .LuiModalAsync-help-icon *,div.LuiModalAsync .LuiModalAsync-help-icon *{fill:#989189}dialog.LuiModalAsync.LuiModalPrefab-success .LuiModalAsync-header .LuiModalAsync-header-icon,div.LuiModalAsync.LuiModalPrefab-success .LuiModalAsync-header .LuiModalAsync-header-icon{fill:#0aa245}dialog.LuiModalAsync.LuiModalPrefab-success,div.LuiModalAsync.LuiModalPrefab-success{border-left:.5rem solid #0aa245}dialog.LuiModalAsync.LuiModalPrefab-info .LuiModalAsync-header .LuiModalAsync-header-icon,div.LuiModalAsync.LuiModalPrefab-info .LuiModalAsync-header .LuiModalAsync-header-icon{fill:#3a7cdf}dialog.LuiModalAsync.LuiModalPrefab-info,div.LuiModalAsync.LuiModalPrefab-info{border-left:0}dialog.LuiModalAsync.LuiModalPrefab-warning .LuiModalAsync-header .LuiModalAsync-header-icon,div.LuiModalAsync.LuiModalPrefab-warning .LuiModalAsync-header .LuiModalAsync-header-icon{fill:#ea6a2e}dialog.LuiModalAsync.LuiModalPrefab-warning,div.LuiModalAsync.LuiModalPrefab-warning{border-left:.5rem solid #ea6a2e}dialog.LuiModalAsync.LuiModalPrefab-error .LuiModalAsync-header .LuiModalAsync-header-icon,div.LuiModalAsync.LuiModalPrefab-error .LuiModalAsync-header .LuiModalAsync-header-icon{fill:#c00}dialog.LuiModalAsync.LuiModalPrefab-error,div.LuiModalAsync.LuiModalPrefab-error{border-left:.75rem solid #c00}dialog.LuiModalAsync.LuiModalPrefab-blocked .LuiModalAsync-header .LuiModalAsync-header-icon,div.LuiModalAsync.LuiModalPrefab-blocked .LuiModalAsync-header .LuiModalAsync-header-icon{fill:#6b6966}dialog.LuiModalAsync.LuiModalPrefab-blocked,dialog.LuiModalAsync.LuiModalPrefab-progress,div.LuiModalAsync.LuiModalPrefab-blocked,div.LuiModalAsync.LuiModalPrefab-progress{border-left:0}dialog.LuiModalAsync h4,div.LuiModalAsync h4{margin-top:0}dialog.LuiModalAsync .LuiModalAsync-ButtonGroup,div.LuiModalAsync .LuiModalAsync-ButtonGroup{display:flex}dialog.LuiModalAsync .LuiModalAsync-ButtonGroup button,div.LuiModalAsync .LuiModalAsync-ButtonGroup button{border-color:#0000;flex:1}dialog.LuiModalAsync .LuiModalAsync-header,div.LuiModalAsync .LuiModalAsync-header{align-items:center;display:flex;flex-direction:row;gap:.5rem}dialog.LuiModalAsync .LuiModalAsync-header h4,div.LuiModalAsync .LuiModalAsync-header h4{color:#2a292c;flex:1}dialog.LuiModalAsync .LuiModalAsync-main,div.LuiModalAsync .LuiModalAsync-main{display:flex;flex:1 1 auto;flex-direction:column;gap:1rem;overflow:hidden}dialog.LuiModalAsync .LuiModalAsync-content,div.LuiModalAsync .LuiModalAsync-content{flex:1;font-weight:400;overflow:auto}dialog.LuiModalAsync .lui-button:focus,div.LuiModalAsync .lui-button:focus{outline:.06rem solid #00425d}dialog.LuiModalPrefab-file{gap:.75rem;padding:1.5rem}dialog.LuiModalPrefab-file .LuiModalAsync-content{padding-bottom:.5rem}button{border:none;border-radius:3px;font-family:Open Sans,system-ui,sans-serif;font-size:1rem;font-style:normal;font-weight:700;line-height:24px;margin:0;padding:.4375rem 1rem;transition:background-color .3s,height .3s,border .3s,fill .3s}button i,button svg *{transition:color .3s,fill .3s}button:hover{cursor:pointer}a.lui-button{border:none;border-radius:3px;font-family:Open Sans,system-ui,sans-serif;font-size:1rem;font-style:normal;font-weight:700;line-height:24px;margin:0;padding:.4375rem 1rem;transition:background-color .3s,height .3s,border .3s,fill .3s}a.lui-button i,a.lui-button svg *{transition:color .3s,fill .3s}a.lui-button:hover{cursor:pointer}a.lui-button{display:inline-block;text-decoration:none}.lui-button,a.lui-button{text-align:center}.lui-button.lui-button-icon-right,a.lui-button.lui-button-icon-right{padding:.25rem .5rem .5rem .75rem}.lui-button.lui-button-icon-right .LuiIcon,a.lui-button.lui-button-icon-right .LuiIcon{margin:3px 0 -7px 11px}.lui-button.lui-button-icon-right i,a.lui-button.lui-button-icon-right i{margin:0 0 0 12px;position:relative;top:6px}.lui-button.lui-button-icon,a.lui-button.lui-button-icon{padding:.4375rem 1rem .4375rem .4375rem}.lui-button.lui-button-icon .LuiIcon,a.lui-button.lui-button-icon .LuiIcon{margin:0 8px -7px 0}.lui-button.lui-button-icon i,a.lui-button.lui-button-icon i{margin:0 12px 0 0;position:relative;top:6px}.lui-button-primary,a.lui-button-primary{background-color:#007198;border:1px solid #007198;color:#fff;font-weight:600;line-height:24px}.lui-button-primary i,.lui-button-primary svg *,a.lui-button-primary i,a.lui-button-primary svg *{fill:#fff;color:#fff}.lui-button-primary:visited,a.lui-button-primary:visited{color:#fff}.lui-button-primary:hover:where(:not([aria-busy])),a.lui-button-primary:hover:where(:not([aria-busy])){background-color:#005678;border:1px solid #005678;color:#fff;cursor:pointer}.lui-button-primary:hover:where(:not([aria-busy])) i,.lui-button-primary:hover:where(:not([aria-busy])) svg *,a.lui-button-primary:hover:where(:not([aria-busy])) i,a.lui-button-primary:hover:where(:not([aria-busy])) svg *{fill:#fff;color:#fff}.lui-button-primary:disabled:where(:not([aria-busy])),a.lui-button-primary:disabled:where(:not([aria-busy])){background:#eaeaea;border-color:#6b6966;color:#989189}.lui-button-primary:disabled:where(:not([aria-busy])) i,.lui-button-primary:disabled:where(:not([aria-busy])) svg *,a.lui-button-primary:disabled:where(:not([aria-busy])) i,a.lui-button-primary:disabled:where(:not([aria-busy])) svg *{fill:#6b6966;color:#6b6966}.lui-button-primary:disabled:where(:not([aria-busy])):hover,a.lui-button-primary:disabled:where(:not([aria-busy])):hover{cursor:not-allowed}.lui-button-primary[aria-busy]:hover,a.lui-button-primary[aria-busy]:hover{cursor:progress}.lui-button-primary[aria-busy]:not(:active),.lui-button-primary[aria-busy]:not(:active) i,.lui-button-primary[aria-busy]:not(:active) svg *,a.lui-button-primary[aria-busy]:not(:active),a.lui-button-primary[aria-busy]:not(:active) i,a.lui-button-primary[aria-busy]:not(:active) svg *{transition:none}.lui-button-primary:active:enabled,a.lui-button-primary:active:enabled{background-color:#00425d;border:1px solid #00425d;color:#ffffffe6;cursor:pointer}.lui-button-primary:active:enabled i,.lui-button-primary:active:enabled svg *,a.lui-button-primary:active:enabled i,a.lui-button-primary:active:enabled svg *{fill:#fff9;color:#fff9}.lui-button-secondary,a.lui-button-secondary{background-color:#fff;border:1px solid #007198;color:#007198;font-weight:600;line-height:24px}.lui-button-secondary i,.lui-button-secondary svg *,a.lui-button-secondary i,a.lui-button-secondary svg *{fill:#007198}.lui-button-secondary:visited,a.lui-button-secondary:visited{color:#007198}.lui-button-secondary:hover:where(:not([aria-busy])),a.lui-button-secondary:hover:where(:not([aria-busy])){background-color:#e2f3f7;border:1px solid #007198;color:#007198;cursor:pointer}.lui-button-secondary:hover:where(:not([aria-busy])) i,.lui-button-secondary:hover:where(:not([aria-busy])) svg *,a.lui-button-secondary:hover:where(:not([aria-busy])) i,a.lui-button-secondary:hover:where(:not([aria-busy])) svg *{fill:#007198;color:#007198}.lui-button-secondary:disabled:where(:not([aria-busy])),a.lui-button-secondary:disabled:where(:not([aria-busy])){background:#eaeaea;border-color:#6b6966;color:#989189}.lui-button-secondary:disabled:where(:not([aria-busy])) i,.lui-button-secondary:disabled:where(:not([aria-busy])) svg *,a.lui-button-secondary:disabled:where(:not([aria-busy])) i,a.lui-button-secondary:disabled:where(:not([aria-busy])) svg *{fill:#6b6966;color:#6b6966}.lui-button-secondary:disabled:where(:not([aria-busy])):hover,a.lui-button-secondary:disabled:where(:not([aria-busy])):hover{cursor:not-allowed}.lui-button-secondary[aria-busy]:hover,a.lui-button-secondary[aria-busy]:hover{cursor:progress}.lui-button-secondary[aria-busy]:not(:active),.lui-button-secondary[aria-busy]:not(:active) i,.lui-button-secondary[aria-busy]:not(:active) svg *,a.lui-button-secondary[aria-busy]:not(:active),a.lui-button-secondary[aria-busy]:not(:active) i,a.lui-button-secondary[aria-busy]:not(:active) svg *{transition:none}.lui-button-secondary:active:enabled,a.lui-button-secondary:active:enabled{background-color:#007198;border:1px solid #007198;color:#ffffffe6;cursor:pointer}.lui-button-secondary:active:enabled i,.lui-button-secondary:active:enabled svg *,a.lui-button-secondary:active:enabled i,a.lui-button-secondary:active:enabled svg *{fill:#fff9;color:#fff9}.lui-button-secondary.lui-button-danger:not(:disabled),a.lui-button-secondary.lui-button-danger:not(:disabled){color:#c00}.lui-button-secondary.lui-button-danger:where([aria-busy]),a.lui-button-secondary.lui-button-danger:where([aria-busy]){color:#c00}.lui-button-secondary.lui-button-danger:not(:disabled),.lui-button-secondary.lui-button-danger[aria-busy],a.lui-button-secondary.lui-button-danger:not(:disabled),a.lui-button-secondary.lui-button-danger[aria-busy]{background-color:#fff;border-color:#c00}.lui-button-secondary.lui-button-danger:not(:disabled) i,.lui-button-secondary.lui-button-danger:not(:disabled) svg *,.lui-button-secondary.lui-button-danger[aria-busy] i,.lui-button-secondary.lui-button-danger[aria-busy] svg *,a.lui-button-secondary.lui-button-danger:not(:disabled) i,a.lui-button-secondary.lui-button-danger:not(:disabled) svg *,a.lui-button-secondary.lui-button-danger[aria-busy] i,a.lui-button-secondary.lui-button-danger[aria-busy] svg *{fill:#c00;color:#c00}.lui-button-secondary.lui-button-danger:hover:enabled,a.lui-button-secondary.lui-button-danger:hover:enabled{background-color:#f5cccc;border-color:#c00;color:#c00}.lui-button-secondary.lui-button-danger:hover:enabled i,.lui-button-secondary.lui-button-danger:hover:enabled svg *,a.lui-button-secondary.lui-button-danger:hover:enabled i,a.lui-button-secondary.lui-button-danger:hover:enabled svg *{fill:#c00;color:#c00}.lui-button-secondary.lui-button-danger:active:enabled,a.lui-button-secondary.lui-button-danger:active:enabled{background-color:#c00;border-color:#c00;color:#f5cccce6}.lui-button-secondary.lui-button-danger:active:enabled i,.lui-button-secondary.lui-button-danger:active:enabled svg *,a.lui-button-secondary.lui-button-danger:active:enabled i,a.lui-button-secondary.lui-button-danger:active:enabled svg *{fill:#f5cccce6;color:#f5cccce6}.lui-button-secondary i,.lui-button-secondary svg *,a.lui-button-secondary i,a.lui-button-secondary svg *{color:#007198}.lui-button-secondary:hover:where(:not([aria-busy])) i,a.lui-button-secondary:hover:where(:not([aria-busy])) i{color:#007198}.lui-button-tertiary,a.lui-button-tertiary{background-color:initial;border:0 solid #0000;color:#007198;font-weight:600;line-height:22px}.lui-button-tertiary i,.lui-button-tertiary svg *,a.lui-button-tertiary i,a.lui-button-tertiary svg *{fill:#007198;color:#007198}.lui-button-tertiary:visited,a.lui-button-tertiary:visited{color:#007198}.lui-button-tertiary:hover:where(:not([aria-busy])),a.lui-button-tertiary:hover:where(:not([aria-busy])){background-color:#e2f3f7;border:1px solid #fff;color:#007198;cursor:pointer}.lui-button-tertiary:hover:where(:not([aria-busy])) i,.lui-button-tertiary:hover:where(:not([aria-busy])) svg *,a.lui-button-tertiary:hover:where(:not([aria-busy])) i,a.lui-button-tertiary:hover:where(:not([aria-busy])) svg *{fill:#007198;color:#007198}.lui-button-tertiary:disabled:where(:not([aria-busy])),a.lui-button-tertiary:disabled:where(:not([aria-busy])){background:#eaeaea;border-color:#6b6966}.lui-button-tertiary:disabled:where(:not([aria-busy])) i,.lui-button-tertiary:disabled:where(:not([aria-busy])) svg *,a.lui-button-tertiary:disabled:where(:not([aria-busy])) i,a.lui-button-tertiary:disabled:where(:not([aria-busy])) svg *{fill:#6b6966;color:#6b6966}.lui-button-tertiary[aria-busy]:hover,a.lui-button-tertiary[aria-busy]:hover{cursor:progress}.lui-button-tertiary[aria-busy]:not(:active),.lui-button-tertiary[aria-busy]:not(:active) i,.lui-button-tertiary[aria-busy]:not(:active) svg *,a.lui-button-tertiary[aria-busy]:not(:active),a.lui-button-tertiary[aria-busy]:not(:active) i,a.lui-button-tertiary[aria-busy]:not(:active) svg *{transition:none}.lui-button-tertiary:active:enabled,a.lui-button-tertiary:active:enabled{background-color:#007198;border:1px solid #fff;color:#ffffffe6;cursor:pointer}.lui-button-tertiary:active:enabled i,.lui-button-tertiary:active:enabled svg *,a.lui-button-tertiary:active:enabled i,a.lui-button-tertiary:active:enabled svg *{fill:#fff9;color:#fff9}.lui-button-tertiary.lui-button-danger:not(:disabled),a.lui-button-tertiary.lui-button-danger:not(:disabled){color:#c00}.lui-button-tertiary.lui-button-danger:where([aria-busy]),a.lui-button-tertiary.lui-button-danger:where([aria-busy]){color:#c00}.lui-button-tertiary.lui-button-danger:not(:disabled),.lui-button-tertiary.lui-button-danger[aria-busy],a.lui-button-tertiary.lui-button-danger:not(:disabled),a.lui-button-tertiary.lui-button-danger[aria-busy]{background-color:initial;border-color:#0000}.lui-button-tertiary.lui-button-danger:not(:disabled) i,.lui-button-tertiary.lui-button-danger:not(:disabled) svg *,.lui-button-tertiary.lui-button-danger[aria-busy] i,.lui-button-tertiary.lui-button-danger[aria-busy] svg *,a.lui-button-tertiary.lui-button-danger:not(:disabled) i,a.lui-button-tertiary.lui-button-danger:not(:disabled) svg *,a.lui-button-tertiary.lui-button-danger[aria-busy] i,a.lui-button-tertiary.lui-button-danger[aria-busy] svg *{fill:#c00;color:#c00}.lui-button-tertiary.lui-button-danger:hover:enabled,a.lui-button-tertiary.lui-button-danger:hover:enabled{background-color:#f5cccc;border-color:#f5cccc;color:#c00}.lui-button-tertiary.lui-button-danger:hover:enabled i,.lui-button-tertiary.lui-button-danger:hover:enabled svg *,a.lui-button-tertiary.lui-button-danger:hover:enabled i,a.lui-button-tertiary.lui-button-danger:hover:enabled svg *{fill:#c00;color:#c00}.lui-button-tertiary.lui-button-danger:active:enabled,a.lui-button-tertiary.lui-button-danger:active:enabled{background-color:#c00;border-color:#c00;color:#f5cccce6}.lui-button-tertiary.lui-button-danger:active:enabled i,.lui-button-tertiary.lui-button-danger:active:enabled svg *,a.lui-button-tertiary.lui-button-danger:active:enabled i,a.lui-button-tertiary.lui-button-danger:active:enabled svg *{fill:#f5cccce6;color:#f5cccce6}.lui-button-tertiary,a.lui-button-tertiary{border:none;font-family:Open Sans,system-ui,sans-serif;font-style:normal;font-weight:400;margin:2px}.lui-button-tertiary:hover:where(:not([aria-busy])),a.lui-button-tertiary:hover:where(:not([aria-busy])){border:none}.lui-button-tertiary:active:enabled:where(:not([aria-busy])),a.lui-button-tertiary:active:enabled:where(:not([aria-busy])){border:none}.lui-button-tertiary:disabled:where(:not([aria-busy])),a.lui-button-tertiary:disabled:where(:not([aria-busy])){background:none;border:none;color:#989189;text-decoration:none}.lui-button-tertiary:disabled:where(:not([aria-busy])):hover,a.lui-button-tertiary:disabled:where(:not([aria-busy])):hover{cursor:not-allowed}.lui-button-tertiary:disabled:where(:not([aria-busy])) i,.lui-button-tertiary:disabled:where(:not([aria-busy])) svg *,a.lui-button-tertiary:disabled:where(:not([aria-busy])) i,a.lui-button-tertiary:disabled:where(:not([aria-busy])) svg *{fill:#989189;color:#989189}.lui-button-success:not(:disabled),a.lui-button-success:not(:disabled){color:#fff}.lui-button-success:where([aria-busy]),a.lui-button-success:where([aria-busy]){color:#fff}.lui-button-success:not(:disabled),.lui-button-success[aria-busy],a.lui-button-success:not(:disabled),a.lui-button-success[aria-busy]{background-color:#0aa245;border-color:#0aa245}.lui-button-success:not(:disabled) i,.lui-button-success:not(:disabled) svg *,.lui-button-success[aria-busy] i,.lui-button-success[aria-busy] svg *,a.lui-button-success:not(:disabled) i,a.lui-button-success:not(:disabled) svg *,a.lui-button-success[aria-busy] i,a.lui-button-success[aria-busy] svg *{fill:#fff;color:#fff}.lui-button-success:hover:enabled,a.lui-button-success:hover:enabled{background-color:#107c3a;border-color:#107c3a;color:#fff}.lui-button-success:hover:enabled i,.lui-button-success:hover:enabled svg *,a.lui-button-success:hover:enabled i,a.lui-button-success:hover:enabled svg *{fill:#fff;color:#fff}.lui-button-success:active:enabled,a.lui-button-success:active:enabled{background-color:#094a22;border-color:#094a22;color:#ffffffe6}.lui-button-success:active:enabled i,.lui-button-success:active:enabled svg *,a.lui-button-success:active:enabled i,a.lui-button-success:active:enabled svg *{fill:#ffffffe6;color:#ffffffe6}.lui-button-error:not(:disabled),.lui-button.lui-button-primary.lui-button-danger:not(:disabled),a.lui-button-error:not(:disabled),a.lui-button.lui-button-primary.lui-button-danger:not(:disabled){color:#fff}.lui-button-error:where([aria-busy]),.lui-button.lui-button-primary.lui-button-danger:where([aria-busy]),a.lui-button-error:where([aria-busy]),a.lui-button.lui-button-primary.lui-button-danger:where([aria-busy]){color:#fff}.lui-button-error:not(:disabled),.lui-button-error[aria-busy],.lui-button.lui-button-primary.lui-button-danger:not(:disabled),.lui-button.lui-button-primary.lui-button-danger[aria-busy],a.lui-button-error:not(:disabled),a.lui-button-error[aria-busy],a.lui-button.lui-button-primary.lui-button-danger:not(:disabled),a.lui-button.lui-button-primary.lui-button-danger[aria-busy]{background-color:#c00;border-color:#c00}.lui-button-error:not(:disabled) i,.lui-button-error:not(:disabled) svg *,.lui-button-error[aria-busy] i,.lui-button-error[aria-busy] svg *,.lui-button.lui-button-primary.lui-button-danger:not(:disabled) i,.lui-button.lui-button-primary.lui-button-danger:not(:disabled) svg *,.lui-button.lui-button-primary.lui-button-danger[aria-busy] i,.lui-button.lui-button-primary.lui-button-danger[aria-busy] svg *,a.lui-button-error:not(:disabled) i,a.lui-button-error:not(:disabled) svg *,a.lui-button-error[aria-busy] i,a.lui-button-error[aria-busy] svg *,a.lui-button.lui-button-primary.lui-button-danger:not(:disabled) i,a.lui-button.lui-button-primary.lui-button-danger:not(:disabled) svg *,a.lui-button.lui-button-primary.lui-button-danger[aria-busy] i,a.lui-button.lui-button-primary.lui-button-danger[aria-busy] svg *{fill:#fff;color:#fff}.lui-button-error:hover:enabled,.lui-button.lui-button-primary.lui-button-danger:hover:enabled,a.lui-button-error:hover:enabled,a.lui-button.lui-button-primary.lui-button-danger:hover:enabled{background-color:#8f0000;border-color:#8f0000;color:#fff}.lui-button-error:hover:enabled i,.lui-button-error:hover:enabled svg *,.lui-button.lui-button-primary.lui-button-danger:hover:enabled i,.lui-button.lui-button-primary.lui-button-danger:hover:enabled svg *,a.lui-button-error:hover:enabled i,a.lui-button-error:hover:enabled svg *,a.lui-button.lui-button-primary.lui-button-danger:hover:enabled i,a.lui-button.lui-button-primary.lui-button-danger:hover:enabled svg *{fill:#fff;color:#fff}.lui-button-error:active:enabled,.lui-button.lui-button-primary.lui-button-danger:active:enabled,a.lui-button-error:active:enabled,a.lui-button.lui-button-primary.lui-button-danger:active:enabled{background-color:#5a0000;border-color:#5a0000;color:#ffffffe6}.lui-button-error:active:enabled i,.lui-button-error:active:enabled svg *,.lui-button.lui-button-primary.lui-button-danger:active:enabled i,.lui-button.lui-button-primary.lui-button-danger:active:enabled svg *,a.lui-button-error:active:enabled i,a.lui-button-error:active:enabled svg *,a.lui-button.lui-button-primary.lui-button-danger:active:enabled i,a.lui-button.lui-button-primary.lui-button-danger:active:enabled svg *{fill:#ffffffe6;color:#ffffffe6}.lui-button-error,.lui-button-success,a.lui-button-error,a.lui-button-success{font-weight:600;line-height:24px}.lui-button-reversed-no-bg,a.lui-button-reversed-no-bg{background-color:initial;border:1px solid #0000;color:#fff;font-weight:600;line-height:24px}.lui-button-reversed-no-bg i,.lui-button-reversed-no-bg svg *,a.lui-button-reversed-no-bg i,a.lui-button-reversed-no-bg svg *{fill:#fff;color:#fff}.lui-button-reversed-no-bg:visited,a.lui-button-reversed-no-bg:visited{color:#fff}.lui-button-reversed-no-bg:hover:where(:not([aria-busy])),a.lui-button-reversed-no-bg:hover:where(:not([aria-busy])){background-color:initial;border:1px solid #0000;color:#fffc;cursor:pointer}.lui-button-reversed-no-bg:hover:where(:not([aria-busy])) i,.lui-button-reversed-no-bg:hover:where(:not([aria-busy])) svg *,a.lui-button-reversed-no-bg:hover:where(:not([aria-busy])) i,a.lui-button-reversed-no-bg:hover:where(:not([aria-busy])) svg *{fill:#fffc;color:#fffc}.lui-button-reversed-no-bg:disabled:where(:not([aria-busy])),a.lui-button-reversed-no-bg:disabled:where(:not([aria-busy])){background:#eaeaea;border-color:#6b6966;color:#989189}.lui-button-reversed-no-bg:disabled:where(:not([aria-busy])) i,.lui-button-reversed-no-bg:disabled:where(:not([aria-busy])) svg *,a.lui-button-reversed-no-bg:disabled:where(:not([aria-busy])) i,a.lui-button-reversed-no-bg:disabled:where(:not([aria-busy])) svg *{fill:#6b6966;color:#6b6966}.lui-button-reversed-no-bg:disabled:where(:not([aria-busy])):hover,a.lui-button-reversed-no-bg:disabled:where(:not([aria-busy])):hover{cursor:not-allowed}.lui-button-reversed-no-bg[aria-busy]:hover,a.lui-button-reversed-no-bg[aria-busy]:hover{cursor:progress}.lui-button-reversed-no-bg[aria-busy]:not(:active),.lui-button-reversed-no-bg[aria-busy]:not(:active) i,.lui-button-reversed-no-bg[aria-busy]:not(:active) svg *,a.lui-button-reversed-no-bg[aria-busy]:not(:active),a.lui-button-reversed-no-bg[aria-busy]:not(:active) i,a.lui-button-reversed-no-bg[aria-busy]:not(:active) svg *{transition:none}.lui-button-reversed-no-bg:active:enabled,a.lui-button-reversed-no-bg:active:enabled{background-color:initial;border:1px solid #0000;color:#ffffffe6;cursor:pointer}.lui-button-reversed-no-bg:active:enabled i,.lui-button-reversed-no-bg:active:enabled svg *,a.lui-button-reversed-no-bg:active:enabled i,a.lui-button-reversed-no-bg:active:enabled svg *{fill:#fff9;color:#fff9}.lui-button-reversed-no-bg i,a.lui-button-reversed-no-bg i{font-size:2.5rem;top:13px!important}.lui-button-reversed-no-bg:disabled:where(:not([aria-busy])),a.lui-button-reversed-no-bg:disabled:where(:not([aria-busy])){background:none;border:0;color:#fff6}.lui-button-reversed-no-bg:disabled:where(:not([aria-busy])) i,.lui-button-reversed-no-bg:disabled:where(:not([aria-busy])) svg *,a.lui-button-reversed-no-bg:disabled:where(:not([aria-busy])) i,a.lui-button-reversed-no-bg:disabled:where(:not([aria-busy])) svg *{fill:#fff6;color:#fff6}.lui-button-reversed-no-bg:disabled:hover,a.lui-button-reversed-no-bg:disabled:hover{cursor:not-allowed}.lui-button-text,a.lui-button-text{background-color:initial;border:0 solid #fff;color:#1f69c3;font-weight:600;line-height:24px}.lui-button-text i,.lui-button-text svg *,a.lui-button-text i,a.lui-button-text svg *{fill:#1f69c3;color:#1f69c3}.lui-button-text:visited,a.lui-button-text:visited{color:#1f69c3}.lui-button-text:hover:where(:not([aria-busy])),a.lui-button-text:hover:where(:not([aria-busy])){background-color:initial;border:1px;color:#00425d;cursor:pointer}.lui-button-text:hover:where(:not([aria-busy])) i,.lui-button-text:hover:where(:not([aria-busy])) svg *,a.lui-button-text:hover:where(:not([aria-busy])) i,a.lui-button-text:hover:where(:not([aria-busy])) svg *{fill:#00425d;color:#00425d}.lui-button-text:disabled:where(:not([aria-busy])),a.lui-button-text:disabled:where(:not([aria-busy])){background:#eaeaea;border-color:#6b6966}.lui-button-text:disabled:where(:not([aria-busy])) i,.lui-button-text:disabled:where(:not([aria-busy])) svg *,a.lui-button-text:disabled:where(:not([aria-busy])) i,a.lui-button-text:disabled:where(:not([aria-busy])) svg *{fill:#6b6966;color:#6b6966}.lui-button-text[aria-busy]:not(:active),.lui-button-text[aria-busy]:not(:active) i,.lui-button-text[aria-busy]:not(:active) svg *,a.lui-button-text[aria-busy]:not(:active),a.lui-button-text[aria-busy]:not(:active) i,a.lui-button-text[aria-busy]:not(:active) svg *{transition:none}.lui-button-text:active:enabled,a.lui-button-text:active:enabled{background-color:none;border:1px;color:#00425de6}.lui-button-text:active:enabled i,.lui-button-text:active:enabled svg *,a.lui-button-text:active:enabled i,a.lui-button-text:active:enabled svg *{fill:#00425d;color:#00425d}.lui-button-text.lui-button-danger:not(:disabled),a.lui-button-text.lui-button-danger:not(:disabled){color:#c00}.lui-button-text.lui-button-danger:where([aria-busy]),a.lui-button-text.lui-button-danger:where([aria-busy]){color:#c00}.lui-button-text.lui-button-danger:not(:disabled),.lui-button-text.lui-button-danger[aria-busy],a.lui-button-text.lui-button-danger:not(:disabled),a.lui-button-text.lui-button-danger[aria-busy]{background-color:initial;border-color:#c00}.lui-button-text.lui-button-danger:not(:disabled) i,.lui-button-text.lui-button-danger:not(:disabled) svg *,.lui-button-text.lui-button-danger[aria-busy] i,.lui-button-text.lui-button-danger[aria-busy] svg *,a.lui-button-text.lui-button-danger:not(:disabled) i,a.lui-button-text.lui-button-danger:not(:disabled) svg *,a.lui-button-text.lui-button-danger[aria-busy] i,a.lui-button-text.lui-button-danger[aria-busy] svg *{fill:#c00;color:#c00}.lui-button-text.lui-button-danger:hover:enabled,a.lui-button-text.lui-button-danger:hover:enabled{background-color:initial;border-color:#8f0000;color:#8f0000}.lui-button-text.lui-button-danger:hover:enabled i,.lui-button-text.lui-button-danger:hover:enabled svg *,a.lui-button-text.lui-button-danger:hover:enabled i,a.lui-button-text.lui-button-danger:hover:enabled svg *{fill:#8f0000;color:#8f0000}.lui-button-text.lui-button-danger:active:enabled,a.lui-button-text.lui-button-danger:active:enabled{background-color:initial;border-color:#5a0000;color:#5a0000e6}.lui-button-text.lui-button-danger:active:enabled i,.lui-button-text.lui-button-danger:active:enabled svg *,a.lui-button-text.lui-button-danger:active:enabled i,a.lui-button-text.lui-button-danger:active:enabled svg *{fill:#5a0000e6;color:#5a0000e6}.lui-button-text,a.lui-button-text{border-radius:0;font-family:Open Sans,system-ui,sans-serif;font-style:normal;font-weight:400;margin:0;padding:0;text-decoration:underline}.lui-button-text:active:enabled,a.lui-button-text:active:enabled{background-color:#fff;-moz-box-shadow:none;-webkit-box-shadow:none;box-shadow:none;cursor:pointer}.lui-button-text:active:enabled i,.lui-button-text:active:enabled svg *,a.lui-button-text:active:enabled i,a.lui-button-text:active:enabled svg *{fill:#fff;color:#fff}.lui-button-text:disabled:where(:not([aria-busy])),a.lui-button-text:disabled:where(:not([aria-busy])){background:none;color:#989189;text-decoration:underline}.lui-button-text:disabled:where(:not([aria-busy])):hover,a.lui-button-text:disabled:where(:not([aria-busy])):hover{cursor:not-allowed}.lui-button-text:disabled:where(:not([aria-busy])) i,.lui-button-text:disabled:where(:not([aria-busy])) svg *,a.lui-button-text:disabled:where(:not([aria-busy])) i,a.lui-button-text:disabled:where(:not([aria-busy])) svg *{fill:#989189;color:#989189}.lui-button-text[aria-busy]:hover,a.lui-button-text[aria-busy]:hover{cursor:progress}.lui-button-plain-text,a.lui-button-plain-text{background-color:initial;border:0 solid #fff;font-weight:600;line-height:24px}.lui-button-plain-text i,.lui-button-plain-text svg *,a.lui-button-plain-text i,a.lui-button-plain-text svg *{fill:inherit;color:inherit}.lui-button-plain-text:visited,a.lui-button-plain-text:visited{color:inherit}.lui-button-plain-text.lui-button-danger:not(:disabled),a.lui-button-plain-text.lui-button-danger:not(:disabled){color:#c00}.lui-button-plain-text.lui-button-danger:where([aria-busy]),a.lui-button-plain-text.lui-button-danger:where([aria-busy]){color:#c00}.lui-button-plain-text.lui-button-danger:not(:disabled),.lui-button-plain-text.lui-button-danger[aria-busy],a.lui-button-plain-text.lui-button-danger:not(:disabled),a.lui-button-plain-text.lui-button-danger[aria-busy]{background-color:initial;border-color:#c00}.lui-button-plain-text.lui-button-danger:not(:disabled) i,.lui-button-plain-text.lui-button-danger:not(:disabled) svg *,.lui-button-plain-text.lui-button-danger[aria-busy] i,.lui-button-plain-text.lui-button-danger[aria-busy] svg *,a.lui-button-plain-text.lui-button-danger:not(:disabled) i,a.lui-button-plain-text.lui-button-danger:not(:disabled) svg *,a.lui-button-plain-text.lui-button-danger[aria-busy] i,a.lui-button-plain-text.lui-button-danger[aria-busy] svg *{fill:#c00;color:#c00}.lui-button-plain-text.lui-button-danger:hover:enabled,a.lui-button-plain-text.lui-button-danger:hover:enabled{background-color:initial;border-color:#c00;color:#c00}.lui-button-plain-text.lui-button-danger:hover:enabled i,.lui-button-plain-text.lui-button-danger:hover:enabled svg *,a.lui-button-plain-text.lui-button-danger:hover:enabled i,a.lui-button-plain-text.lui-button-danger:hover:enabled svg *{fill:#c00;color:#c00}.lui-button-plain-text.lui-button-danger:active:enabled,a.lui-button-plain-text.lui-button-danger:active:enabled{background-color:initial;border-color:#c00;color:#cc0000e6}.lui-button-plain-text.lui-button-danger:active:enabled i,.lui-button-plain-text.lui-button-danger:active:enabled svg *,a.lui-button-plain-text.lui-button-danger:active:enabled i,a.lui-button-plain-text.lui-button-danger:active:enabled svg *{fill:#cc0000e6;color:#cc0000e6}.lui-button-plain-text,a.lui-button-plain-text{color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;margin:0;padding:0}.lui-button-plain-text i,.lui-button-plain-text svg *,a.lui-button-plain-text i,a.lui-button-plain-text svg *{fill:#6b6966;color:#6b6966}.lui-button-plain-text:disabled:where(:not([aria-busy])),a.lui-button-plain-text:disabled:where(:not([aria-busy])){background:none;border:0;color:#989189;text-decoration:none}.lui-button-plain-text:disabled:where(:not([aria-busy])):hover,a.lui-button-plain-text:disabled:where(:not([aria-busy])):hover{cursor:not-allowed}.lui-button-plain-text:disabled:where(:not([aria-busy])) i,.lui-button-plain-text:disabled:where(:not([aria-busy])) svg *,a.lui-button-plain-text:disabled:where(:not([aria-busy])) i,a.lui-button-plain-text:disabled:where(:not([aria-busy])) svg *{fill:#989189;color:#989189}.lui-button-plain-text[aria-busy]:hover,a.lui-button-plain-text[aria-busy]:hover{cursor:progress}.lui-button-icon-only,a.lui-button-icon-only{height:40px;padding:0;width:40px}.lui-button-icon-only .LuiIcon,a.lui-button-icon-only .LuiIcon{vertical-align:top}.lui-button-icon-only i,a.lui-button-icon-only i{margin:0 12px 0 0;position:relative;top:6px}.lui-button-icon-only-link,.lui-button-icon-only-rev,a.lui-button-icon-only-link,a.lui-button-icon-only-rev{background-color:initial;border:1px solid #0000;color:#007198;font-weight:600;line-height:24px}.lui-button-icon-only-link i,.lui-button-icon-only-link svg *,.lui-button-icon-only-rev i,.lui-button-icon-only-rev svg *,a.lui-button-icon-only-link i,a.lui-button-icon-only-link svg *,a.lui-button-icon-only-rev i,a.lui-button-icon-only-rev svg *{fill:#007198;color:#007198}.lui-button-icon-only-link:visited,.lui-button-icon-only-rev:visited,a.lui-button-icon-only-link:visited,a.lui-button-icon-only-rev:visited{color:#007198}.lui-button-icon-only-link:hover:where(:not([aria-busy])),.lui-button-icon-only-rev:hover:where(:not([aria-busy])),a.lui-button-icon-only-link:hover:where(:not([aria-busy])),a.lui-button-icon-only-rev:hover:where(:not([aria-busy])){background-color:initial;border:1px solid #0000;color:#005678;cursor:pointer}.lui-button-icon-only-link:hover:where(:not([aria-busy])) i,.lui-button-icon-only-link:hover:where(:not([aria-busy])) svg *,.lui-button-icon-only-rev:hover:where(:not([aria-busy])) i,.lui-button-icon-only-rev:hover:where(:not([aria-busy])) svg *,a.lui-button-icon-only-link:hover:where(:not([aria-busy])) i,a.lui-button-icon-only-link:hover:where(:not([aria-busy])) svg *,a.lui-button-icon-only-rev:hover:where(:not([aria-busy])) i,a.lui-button-icon-only-rev:hover:where(:not([aria-busy])) svg *{fill:#005678;color:#005678}.lui-button-icon-only-link:disabled:where(:not([aria-busy])),.lui-button-icon-only-rev:disabled:where(:not([aria-busy])),a.lui-button-icon-only-link:disabled:where(:not([aria-busy])),a.lui-button-icon-only-rev:disabled:where(:not([aria-busy])){background:#eaeaea;border-color:#6b6966;color:#989189}.lui-button-icon-only-link:disabled:where(:not([aria-busy])) i,.lui-button-icon-only-link:disabled:where(:not([aria-busy])) svg *,.lui-button-icon-only-rev:disabled:where(:not([aria-busy])) i,.lui-button-icon-only-rev:disabled:where(:not([aria-busy])) svg *,a.lui-button-icon-only-link:disabled:where(:not([aria-busy])) i,a.lui-button-icon-only-link:disabled:where(:not([aria-busy])) svg *,a.lui-button-icon-only-rev:disabled:where(:not([aria-busy])) i,a.lui-button-icon-only-rev:disabled:where(:not([aria-busy])) svg *{fill:#6b6966;color:#6b6966}.lui-button-icon-only-link:disabled:where(:not([aria-busy])):hover,.lui-button-icon-only-rev:disabled:where(:not([aria-busy])):hover,a.lui-button-icon-only-link:disabled:where(:not([aria-busy])):hover,a.lui-button-icon-only-rev:disabled:where(:not([aria-busy])):hover{cursor:not-allowed}.lui-button-icon-only-link[aria-busy]:hover,.lui-button-icon-only-rev[aria-busy]:hover,a.lui-button-icon-only-link[aria-busy]:hover,a.lui-button-icon-only-rev[aria-busy]:hover{cursor:progress}.lui-button-icon-only-link[aria-busy]:not(:active),.lui-button-icon-only-link[aria-busy]:not(:active) i,.lui-button-icon-only-link[aria-busy]:not(:active) svg *,.lui-button-icon-only-rev[aria-busy]:not(:active),.lui-button-icon-only-rev[aria-busy]:not(:active) i,.lui-button-icon-only-rev[aria-busy]:not(:active) svg *,a.lui-button-icon-only-link[aria-busy]:not(:active),a.lui-button-icon-only-link[aria-busy]:not(:active) i,a.lui-button-icon-only-link[aria-busy]:not(:active) svg *,a.lui-button-icon-only-rev[aria-busy]:not(:active),a.lui-button-icon-only-rev[aria-busy]:not(:active) i,a.lui-button-icon-only-rev[aria-busy]:not(:active) svg *{transition:none}.lui-button-icon-only-link:active:enabled,.lui-button-icon-only-rev:active:enabled,a.lui-button-icon-only-link:active:enabled,a.lui-button-icon-only-rev:active:enabled{background-color:initial;border:1px solid #0000;color:#1f69c3e6;cursor:pointer}.lui-button-icon-only-link:active:enabled i,.lui-button-icon-only-link:active:enabled svg *,.lui-button-icon-only-rev:active:enabled i,.lui-button-icon-only-rev:active:enabled svg *,a.lui-button-icon-only-link:active:enabled i,a.lui-button-icon-only-link:active:enabled svg *,a.lui-button-icon-only-rev:active:enabled i,a.lui-button-icon-only-rev:active:enabled svg *{fill:#1f69c3;color:#1f69c3}.lui-button-icon-only-link,.lui-button-icon-only-rev,a.lui-button-icon-only-link,a.lui-button-icon-only-rev{height:36px;line-height:44px;padding:0;width:36px}.lui-button-icon-only-link:disabled,.lui-button-icon-only-rev:disabled,a.lui-button-icon-only-link:disabled,a.lui-button-icon-only-rev:disabled{background-color:initial;border:0}.lui-button-icon-only-rev,.lui-button-icon-only-rev i,.lui-button-icon-only-rev svg *,a.lui-button-icon-only-rev,a.lui-button-icon-only-rev i,a.lui-button-icon-only-rev svg *{color:#fff}.lui-button-icon-only-rev:disabled:hover:where(:not([aria-busy])),.lui-button-icon-only-rev:disabled:where(:not([aria-busy])),a.lui-button-icon-only-rev:disabled:hover:where(:not([aria-busy])),a.lui-button-icon-only-rev:disabled:where(:not([aria-busy])){background-color:initial;border:0;color:#fff6}.lui-button-icon-only-rev:disabled:hover:where(:not([aria-busy])) i,.lui-button-icon-only-rev:disabled:hover:where(:not([aria-busy])) svg *,.lui-button-icon-only-rev:disabled:where(:not([aria-busy])) i,.lui-button-icon-only-rev:disabled:where(:not([aria-busy])) svg *,a.lui-button-icon-only-rev:disabled:hover:where(:not([aria-busy])) i,a.lui-button-icon-only-rev:disabled:hover:where(:not([aria-busy])) svg *,a.lui-button-icon-only-rev:disabled:where(:not([aria-busy])) i,a.lui-button-icon-only-rev:disabled:where(:not([aria-busy])) svg *{fill:#fff6;color:#fff6}.lui-button-icon-only-rev:hover:where(:not([aria-busy])) i,.lui-button-icon-only-rev:hover:where(:not([aria-busy])) svg *,a.lui-button-icon-only-rev:hover:where(:not([aria-busy])) i,a.lui-button-icon-only-rev:hover:where(:not([aria-busy])) svg *{fill:#73c8e1;color:#73c8e1}.lui-button-icon-only-link,a.lui-button-icon-only-link{color:#1f69c3}.lui-button[aria-busy],a.lui-button[aria-busy]{position:relative}.lui-button[aria-busy]:has(.lui-button-loading-spinner),a.lui-button[aria-busy]:has(.lui-button-loading-spinner){color:#0000}.lui-button[aria-busy]:has(.lui-button-loading-spinner)>:not(.lui-button-loading-spinner),a.lui-button[aria-busy]:has(.lui-button-loading-spinner)>:not(.lui-button-loading-spinner){visibility:hidden}.lui-button-loading-spinner,a.lui-button-loading-spinner{align-items:center;display:flex;inset:0;justify-content:center;position:absolute}.lui-button.lui-button-sm,a.lui-button.lui-button-sm{padding:.1875rem .5rem}.lui-button.lui-button-sm.lui-button-plain-text,.lui-button.lui-button-sm.lui-button-text,a.lui-button.lui-button-sm.lui-button-plain-text,a.lui-button.lui-button-sm.lui-button-text{padding:0}.lui-button.lui-button-sm.lui-button-icon,a.lui-button.lui-button-sm.lui-button-icon{padding:.125rem .5rem .125rem .25rem}.lui-button.lui-button-sm.lui-button-icon .LuiIcon,a.lui-button.lui-button-sm.lui-button-icon .LuiIcon{margin:1px 4px -5px 0}.lui-button.lui-button-sm.lui-button-icon i,a.lui-button.lui-button-sm.lui-button-icon i{margin:0 12px 0 0;position:relative;top:6px}.lui-button.lui-button-sm.lui-button-icon-only,a.lui-button.lui-button-sm.lui-button-icon-only{height:32px;padding:0;width:32px}.lui-button.lui-button-sm.lui-button-icon-only .LuiIcon,a.lui-button.lui-button-sm.lui-button-icon-only .LuiIcon{vertical-align:top}.lui-button.lui-button-sm.lui-button-icon-only i,a.lui-button.lui-button-sm.lui-button-icon-only i{margin:0 12px 0 0;position:relative;top:6px}.lui-button.lui-button-sm.lui-button-icon-right,a.lui-button.lui-button-sm.lui-button-icon-right{padding:.125rem .25rem .125rem .5rem}.lui-button.lui-button-sm.lui-button-icon-right .LuiIcon,a.lui-button.lui-button-sm.lui-button-icon-right .LuiIcon{margin:1px 0 -5px .25rem}.lui-button.lui-button-sm.lui-button-icon-right i,a.lui-button.lui-button-sm.lui-button-icon-right i{margin:0 0 0 12px;position:relative;top:6px}.lui-button.lui-button-sm.lui-button-reversed-no-bg .LuiIcon,.lui-button.lui-button-sm.lui-button-reversed-no-bg i,a.lui-button.lui-button-sm.lui-button-reversed-no-bg .LuiIcon,a.lui-button.lui-button-sm.lui-button-reversed-no-bg i{top:9px!important}.lui-button.lui-button-lg,a.lui-button.lui-button-lg{padding:.6875rem 1.125rem}.lui-button.lui-button-lg.lui-button-plain-text,.lui-button.lui-button-lg.lui-button-text,a.lui-button.lui-button-lg.lui-button-plain-text,a.lui-button.lui-button-lg.lui-button-text{padding:0}.lui-button.lui-button-lg.lui-button-icon,a.lui-button.lui-button-lg.lui-button-icon{padding:.6875rem 16px .6875rem .75rem}.lui-button.lui-button-lg.lui-button-icon i,a.lui-button.lui-button-lg.lui-button-icon i{margin:0 .5rem 0 0;position:relative;top:6px}.lui-button.lui-button-lg.lui-button-icon-only,a.lui-button.lui-button-lg.lui-button-icon-only{height:48px;padding:0;width:48px}.lui-button.lui-button-lg.lui-button-icon-only .LuiIcon,a.lui-button.lui-button-lg.lui-button-icon-only .LuiIcon{vertical-align:top}.lui-button.lui-button-lg.lui-button-icon-only i,a.lui-button.lui-button-lg.lui-button-icon-only i{margin:0 .5rem 0 0;position:relative;top:6px}.lui-button.lui-button-lg.lui-button-icon-right,a.lui-button.lui-button-lg.lui-button-icon-right{padding:.6875rem .75rem .6875rem 1rem}.lui-button.lui-button-lg.lui-button-icon-right .LuiIcon,a.lui-button.lui-button-lg.lui-button-icon-right .LuiIcon{margin:0 0 -.4375rem .5rem}.lui-button.lui-button-lg.lui-button-icon-right i,a.lui-button.lui-button-lg.lui-button-icon-right i{margin:0 0 0 .5rem;position:relative;top:6px}.lui-button+.lui-button,.lui-button+a.lui-button,a.lui-button+.lui-button,a.lui-button+a.lui-button{margin-left:.5rem}.lui-button-group{align-content:stretch;display:flex;flex-direction:row}.lui-button-group .lui-button-wrapper{flex:1 1 0}.lui-button-group .lui-button-wrapper:first-child button{border-bottom-left-radius:3px;border-left:1px solid #004b50;border-top-left-radius:3px}.lui-button-group .lui-button-wrapper:last-child button{border-bottom-right-radius:3px;border-top-right-radius:3px}.lui-button-group.lui-input-error{border-radius:4.5px}.lui-button-group-text-sizing{display:inline-block;font-size:0}.lui-button-group-text-sizing .lui-button-wrapper{float:left;width:auto}@media screen and (min-width:768px){.lui-button-group-text-sizing .lui-button-wrapper .lui-button{padding:0 .75rem}}@media screen and (min-width:1024px){.lui-button-group-text-sizing .lui-button-wrapper .lui-button{padding:0 2rem}}.lui-button-group .lui-button{background-color:#fff;border:1px solid #007198;border-left:none;border-radius:0;color:#004b50;width:100%}.lui-button-group .lui-button svg *{fill:#007198}.lui-button-group .lui-button.lui-button-active{background-color:#007198;-moz-box-shadow:inset 0 3px 6px #0006;-webkit-box-shadow:inset 0 3px 6px #0006;box-shadow:inset 0 3px 6px #0006;color:#fff;text-shadow:0 3px 6px #0006}.lui-button-group .lui-button.lui-button-active svg *{fill:#fff}.lui-button-group .lui-button.lui-button-active:disabled:where(:not([aria-busy])){background-color:#989189;color:#fff}.lui-button-group .lui-button.lui-button-active:disabled:where(:not([aria-busy])).lui-button-icon-only svg *{fill:#fff}.lui-button-group .lui-button:hover:where(:not([aria-busy])){background:#007198;color:#fff;cursor:pointer}.lui-button-group .lui-button:focus{outline:2px solid #004b50;position:relative}.lui-button-group .lui-button:disabled:where(:not([aria-busy])){background-color:#eaeaea;border:1px solid #6b6966;color:#989189}.lui-button-group .lui-button:disabled:where(:not([aria-busy])):disabled:hover{cursor:not-allowed}.lui-button-group .lui-button:disabled:where(:not([aria-busy])).lui-button-icon-only svg *{fill:#989189}.lui-button-group .lui-button.lui-button-icon-only{width:100%}.lui-button-group--radio{margin-top:1.5rem}.lui-button-group--radio .lui-radio-container{margin-top:.75rem}@media screen and (min-width:768px){.LuiDeprecatedForms .lui-button-group--radio{display:grid}.lui-button-group--radio{display:grid;font-size:0!important;grid-template-columns:repeat(24,1fr)}.lui-button-group--radio input{clip:rect(0 0 0 0)!important;border:0!important;-webkit-clip-path:inset(50%)!important;clip-path:inset(50%)!important;height:1px!important;margin:0!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important}.lui-button-group--radio input:checked+label{background-color:#007198;box-shadow:inset 0 2px 3px #00000080;color:#fff;text-shadow:0 2px 3px #00000080}.LuiDeprecatedForms .lui-button-group--radio input:checked+label{color:#fff}.lui-button-group--radio input:checked:disabled+label,.lui-button-group--radio input:disabled:checked+label:hover{background-color:#989189;color:#fff}.LuiDeprecatedForms .lui-button-group--radio input:checked:disabled+label,.LuiDeprecatedForms .lui-button-group--radio input:disabled:checked+label:hover{color:#fff}.lui-button-group--radio input:focus:not([disabled])+label{background:#007198;color:#fff;cursor:pointer}.lui-button-group--radio input:disabled+label{border-color:#989189!important}.lui-button-group--radio input:disabled+label:hover{background-color:#fff;cursor:default}}.lui-button-group--radio label{margin-left:.5rem}@media screen and (min-width:768px){.lui-button-group--radio label{border:2px solid #007198;border-radius:0;border-right:none;color:#007198;display:inline-block;font-family:Open Sans,system-ui,sans-serif;font-weight:700!important;line-height:40px;margin:0;text-align:center;transition:background-color .3s,color .3s,height .3s,border .3s;width:100%}.lui-button-group--radio label:hover{background:#007198;color:#fff;cursor:pointer}}.LuiDeprecatedForms .radio-btn-group-pair{display:grid;font-size:0!important;grid-template-columns:repeat(24,1fr)}.LuiDeprecatedForms .radio-btn-group-pair input{clip:rect(0 0 0 0)!important;border:0!important;-webkit-clip-path:inset(50%)!important;clip-path:inset(50%)!important;height:1px!important;margin:0!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important}.LuiDeprecatedForms .radio-btn-group-pair input:checked+label{background-color:#007198;box-shadow:inset 0 2px 3px #00000080;color:#fff;text-shadow:0 2px 3px #00000080}.LuiDeprecatedForms .radio-btn-group-pair input:focus+label{background:#007198;color:#fff;cursor:pointer}.LuiDeprecatedForms .radio-btn-group-pair label{border:2px solid #007198;border-radius:0;border-right:none;color:#007198;display:inline-block;font-family:Open Sans,system-ui,sans-serif;font-style:normal;font-weight:700;line-height:40px;margin:0;text-align:center;transition:background-color .3s,color .3s,height .3s,border .3s;width:100%}.LuiDeprecatedForms .radio-btn-group-pair label:hover{background:#007198;color:#fff;cursor:pointer}.LuiDeprecatedForms .radio-btn-group-pair .grid-cell-1{grid-column:span 12}.LuiDeprecatedForms .radio-btn-group-pair .grid-cell-1 label{border-radius:.5rem 0 0 .5rem}.LuiDeprecatedForms .radio-btn-group-pair .grid-cell-2{grid-column:span 12}.LuiDeprecatedForms .radio-btn-group-pair .grid-cell-2 label{border-radius:0 .5rem .5rem 0;border-right:2px solid #007198}@media screen and (min-width:768px){.LuiDeprecatedForms .radio-btn-group-pair .grid-cell-1,.LuiDeprecatedForms .radio-btn-group-pair .grid-cell-2{grid-column:span 6}}@media screen and (min-width:1024px){.LuiDeprecatedForms .radio-btn-group-pair .grid-cell-1,.LuiDeprecatedForms .radio-btn-group-pair .grid-cell-2{grid-column:span 5}}@media screen and (min-width:1280px){.LuiDeprecatedForms .radio-btn-group-pair .grid-cell-1,.LuiDeprecatedForms .radio-btn-group-pair .grid-cell-2{grid-column:span 4}}@media screen and (min-width:768px){.exampleOfGridForButtons .grid-cell-1{grid-column:span 3}.exampleOfGridForButtons .grid-cell-1 label{border-radius:.5rem 0 0 .5rem}.exampleOfGridForButtons .grid-cell-2{grid-column:span 5}.exampleOfGridForButtons .grid-cell-3,.exampleOfGridForButtons .grid-cell-4{grid-column:span 8}.exampleOfGridForButtons .grid-cell-4 label{border-radius:0 .5rem .5rem 0;border-right:2px solid #007198}}@media screen and (min-width:1024px){.exampleOfGridForButtons .grid-cell-1{grid-column:span 4}.exampleOfGridForButtons .grid-cell-2,.exampleOfGridForButtons .grid-cell-3,.exampleOfGridForButtons .grid-cell-4{grid-column:span 5}}@media screen and (min-width:1280px){.exampleOfGridForButtons .grid-cell-1{grid-column:span 3}.exampleOfGridForButtons .grid-cell-2,.exampleOfGridForButtons .grid-cell-3,.exampleOfGridForButtons .grid-cell-4{grid-column:span 4}}.linz-button-primary{background-color:#023d48;border:1px solid #023d48;color:#fff}.linz-button-primary:hover{background-color:#01818a;border-color:#01818a;cursor:pointer}.linz-button-secondary{border:1px solid #023d48;color:#023d48}.linz-button-secondary:hover{background-color:#01818a;border-color:#01818a;color:#fff;cursor:pointer}.linz-button-tertiary{background-color:#e1e44a;border:1px solid #e1e44a;color:#023d48}.linz-button-tertiary:hover{background-color:#cdcf59;border-color:#cdcf59;cursor:pointer}.lui-icon{display:inline-block;height:24px;width:24px}.lui-icon-lg{font-size:3rem;height:48px;width:48px}.lui-icon-maori-land{background-size:cover}:not[button] .lui-link-icon,:not[button] i[class^=material-icons]{color:#007198;transition:color .3s cubic-bezier(1,0,0,1)}:not[button] .lui-link-icon:hover,:not[button] i[class^=material-icons]:hover{color:#004b50;cursor:pointer}:not[button] .lui-link-icon:visited,:not[button] i[class^=material-icons]:visited{color:#00425d}:not[button] .lui-link-icon-disabled i{color:#989189}:not[button] .lui-link-icon-disabled i:hover{cursor:not-allowed}.lui-inactive-icon{color:#989189}.tippy-box{border-radius:0;box-shadow:0 2px 3px 0 rgba(0,0,0,.251),0 0 3px 0 rgba(0,0,0,.149);padding:.25rem .5rem;text-align:left}.tippy-box[data-theme*=-withDelay]{animation:fadeInToolTip 1.5s}.tippy-box .tippy-content{padding:0}.tippy-box .tippy-content,.tippy-box .tippy-content p{font-family:Open Sans,system-ui,sans-serif;font-size:.75rem;font-style:normal;font-weight:600}.tippy-box .tippy-content p{margin-top:1em}.tippy-box .tippy-content p:first-child{margin-top:0}@keyframes fadeInToolTip{0%{opacity:0}66%{opacity:0}to{opacity:1}}.tippy-box[data-theme*=default]{background:#fff}.tippy-box[data-theme*=default] .tippy-content{color:#2a292c}.tippy-box[data-theme*=info]{background:#00425d}.tippy-box[data-theme*=info] .tippy-content{color:#fff}.tippy-box[data-theme*=error]{background:#c00}.tippy-box[data-theme*=error] .tippy-content{color:#fff}.LuiCheckboxInput{box-sizing:border-box;margin-bottom:24px;position:relative}.LuiCheckboxInput-group{cursor:pointer;display:inline-block;line-height:28px;user-select:none}.LuiCheckboxInput-label{align-items:flex-start;display:flex;flex-direction:row;margin-bottom:0;padding:2px;position:relative}.LuiCheckboxInput--isDisabled .LuiCheckboxInput-label{color:#989189;cursor:not-allowed}.LuiCheckboxInput-input{height:.1px;opacity:0;overflow:hidden;position:absolute;width:.1px;z-index:-1}.LuiCheckboxInput-error{margin-top:2px;text-align:left}.LuiCheckboxInput-errorText{color:#c00}.LuiCheckboxInput-errorIcon{margin-left:2rem}.LuiCheckboxInput-mandatory{color:#c00;font-family:Open Sans,system-ui,sans-serif;font-size:.875rem;font-style:normal;font-weight:600;left:-12px;position:absolute;top:-4px}.LuiCheckboxInput-labelCheck{fill:#fff0;background-color:#fff;border:2px solid #007198;border-radius:3px;margin-right:.5rem;order:-1;transition:background-color .3s ease-in-out}.LuiCheckboxInput-labelCheck svg{left:-2px;position:relative;top:-2px}.LuiCheckboxInput--isChecked .LuiCheckboxInput-labelCheck,.LuiCheckboxInput-input:checked .LuiCheckboxInput-labelCheck{fill:#fff;background-color:#007198}.LuiCheckboxInput-input:focus-visible+span .LuiCheckboxInput-labelCheck{outline:3px solid #007198}.LuiCheckboxInput--hasError .LuiCheckboxInput-labelCheck{border-color:#c00}.LuiCheckboxInput--isChecked.LuiCheckboxInput--hasError .LuiCheckboxInput-labelCheck{background-color:#c00;border-color:#c00}.LuiCheckboxInput--isDisabled .LuiCheckboxInput-labelCheck,.LuiCheckboxInput-input:disabled+.LuiCheckboxInput-label .LuiCheckboxInput-labelCheck{background-color:#eaeaea;border-color:#989189}.LuiCheckboxInput--isChecked.LuiCheckboxInput--isDisabled .LuiCheckboxInput-labelCheck,.LuiCheckboxInput-input:checked:disabled+.LuiCheckboxInput-label .LuiCheckboxInput-labelCheck{background-color:#989189;border-color:#989189}.LuiCheckboxInput--inline{display:inline-block}.LuiCheckboxInput--inline:not(:last-child){margin-bottom:0;margin-right:24px}.LuiTab{align-items:center;background:#0000;border-radius:0;color:#2a292c;column-gap:.75rem;display:flex;font-family:Open Sans,system-ui,sans-serif;font-style:normal;font-weight:400;justify-content:center;min-width:10rem;position:relative}.LuiTab:focus{background-color:#00a59933}.LuiTabsGroup--justified .LuiTab{width:100%}.LuiTab--error:after,.LuiTab--warning:after{bottom:-1px;content:\"\";display:block;height:1px;left:0;position:absolute;right:0}.LuiTab--error:after{background-color:#c00}.LuiTab--warning:after{background-color:#ea6a2e}.LuiTab:disabled{background:#eaeaea;border-color:#6b6966;color:#989189;cursor:not-allowed}.LuiTab--active,.LuiTab--active:focus{background:#0000;font-family:Open Sans,system-ui,sans-serif;font-style:normal;font-weight:600;outline:none;position:relative}.LuiTab--active:after,.LuiTab--active:focus:after{background:linear-gradient(270deg,#73cdc8 1%,#00a599);border-top-left-radius:3px;border-top-right-radius:3px;bottom:-1px;box-sizing:border-box;content:\"\";display:block;height:4px;left:0;padding:0 32px;position:absolute;right:0;width:100%}.tabErrorIcon{fill:#c00}.tabWarningIcon{fill:#ea6a2e}.LuiTabsGroup{border-bottom:1px solid #beb9b4;display:flex}.LuiTabsGroup--justified{display:flex;justify-content:space-between}.LuiTabsPanel{display:none}.LuiTabsPanel--active{display:block;overflow:auto}.LuiIcon{display:inline-block;height:100%;width:100%}.LuiIcon>svg{display:block}.LuiIcon--xl{max-height:48px;max-width:48px}.LuiIcon--xl>svg{height:48px;width:48px}.LuiIcon--lg{max-height:32px;max-width:32px}.LuiIcon--lg>svg{height:32px;width:32px}.LuiIcon--md{max-height:24px;max-width:24px}.LuiIcon--md,.LuiIcon--md>svg{height:24px;width:24px}.LuiIcon--sm{max-height:16px;max-width:16px}.LuiIcon--sm>svg{height:16px;width:16px}.LuiIcon--xs{max-height:12px;max-width:12px}.LuiIcon--xs>svg{height:12px;width:12px}.LuiIcon--warning{fill:#ea6a2e}.LuiIcon--error{fill:#c00}.LuiIcon--success{fill:#0aa245}.LuiIcon--interactive{fill:#007198}.LuiIcon--disabled{fill:#989189}.LuiStatusSpinner p{margin-top:.5rem}.LuiLoadingSpinnerBase{left:50%;margin-left:-74px;margin-top:-74px;position:absolute;top:50%;z-index:1000}.LuiLoadingSpinner-SupportText-container{align-items:center;bottom:0;display:flex;justify-content:center;left:0;position:absolute;right:0;top:0}.LuiLoadingSpinner-SupportText-container .LuiLoadingSpinner-SupportText{align-items:center;color:#007198;display:flex;flex-direction:column;font-family:Open Sans,system-ui,sans-serif;font-style:normal;font-weight:400;width:300px}.LuiLoadingSpinner-SupportText-container .LuiLoadingSpinner-SupportText .LuiLoadingSpinnerBase{display:inline-block;margin:0;position:static}.LuiLoadingSpinner-SupportText-container .LuiLoadingSpinner-SupportText p{font-family:Open Sans,system-ui,sans-serif;font-style:normal;font-weight:400}.LuiFileInputBox-upload{align-items:center;border-radius:5px;cursor:pointer;display:flex;flex-direction:column;justify-content:center;outline:2px dashed #beb9b4;padding:24px;position:relative}.LuiFileInputBox-upload:hover{background:#eef1f5}.LuiFileInputBox-upload-input{cursor:pointer;display:block;height:100%;left:0;opacity:0;position:absolute;top:0;width:100%}.LuiFileInputBox-upload-container{align-items:center;display:flex;flex-direction:column;gap:8px;justify-content:center;text-align:center}.LuiFileInputBox-upload-error{border-radius:5px;outline:2px dashed #c00}.LuiFileInputBox-upload-icon-success{fill:#0aa245;margin-left:auto;margin-right:auto;width:120px}.LuiFileInputBox-upload-icon-upload{fill:#007198;margin-left:auto;margin-right:auto;width:120px}.LuiFileInputBox-upload-icon-error{fill:#c00;margin-left:auto;margin-right:auto;width:168px}.LuiFileInputBox-upload-text{color:#2a292c;font-size:16px;line-height:24px;margin-top:0}.LuiFileInputBox-upload-text .LuiFileInputBox-upload-text-span{color:#3a7cdf;text-decoration-line:underline;text-decoration-skip-ink:auto;text-decoration-style:solid;text-decoration-thickness:7.5%;text-underline-offset:2.6px}.LuiFileInputBox-upload-text-no-padding{color:#6b6966;font-size:14px;padding:0}.LuiFileInputBox-upload-file-name{font-weight:600;margin-top:0;padding-bottom:12px}.LuiCheckboxInput.LuiCheckboxInput--nomargin{margin-bottom:0}*,:after,:before{box-sizing:inherit}";
|
|
71
|
-
styleInject(css_248z);
|
|
72
|
-
|
|
73
|
-
function r(e) {
|
|
74
|
-
var t, f, n = "";
|
|
75
|
-
if ("string" == typeof e || "number" == typeof e) n += e;
|
|
76
|
-
else if ("object" == typeof e) if (Array.isArray(e)) for (t = 0; t < e.length; t++) e[t] && (f = r(e[t])) && (n && (n += " "), n += f);
|
|
77
|
-
else for (t in e) e[t] && (n && (n += " "), n += t);
|
|
78
|
-
return n;
|
|
79
|
-
}
|
|
80
|
-
function clsx$1() {
|
|
81
|
-
for (var e, t, f = 0, n = ""; f < arguments.length; ) (e = arguments[f++]) && (t = r(e)) && (n && (n += " "), n += t);
|
|
82
|
-
return n;
|
|
83
|
-
}
|
|
45
|
+
function r(e){var t,f,n="";if("string"==typeof e||"number"==typeof e)n+=e;else if("object"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=" "),n+=f);}else for(f in e)e[f]&&(n&&(n+=" "),n+=f);return n}function clsx(){for(var e,t,f=0,n="",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=" "),n+=t);return n}
|
|
84
46
|
|
|
85
47
|
const CopyableText = (props) => {
|
|
86
48
|
const [copied, setCopied] = useState(false);
|
|
@@ -112,7 +74,7 @@ const CopyableText = (props) => {
|
|
|
112
74
|
{
|
|
113
75
|
"data-testid": dataTestId,
|
|
114
76
|
style,
|
|
115
|
-
className: clsx
|
|
77
|
+
className: clsx("windows_tooltip", className),
|
|
116
78
|
onClick: (event) => {
|
|
117
79
|
event.stopPropagation();
|
|
118
80
|
copy(event);
|
|
@@ -250,7 +212,7 @@ function identity(value) {
|
|
|
250
212
|
}
|
|
251
213
|
|
|
252
214
|
var asyncTag = "[object AsyncFunction]", funcTag$2 = "[object Function]", genTag$1 = "[object GeneratorFunction]", proxyTag = "[object Proxy]";
|
|
253
|
-
function isFunction(value) {
|
|
215
|
+
function isFunction$1(value) {
|
|
254
216
|
if (!isObject(value)) {
|
|
255
217
|
return false;
|
|
256
218
|
}
|
|
@@ -296,7 +258,7 @@ function baseIsNative(value) {
|
|
|
296
258
|
if (!isObject(value) || isMasked(value)) {
|
|
297
259
|
return false;
|
|
298
260
|
}
|
|
299
|
-
var pattern = isFunction(value) ? reIsNative : reIsHostCtor;
|
|
261
|
+
var pattern = isFunction$1(value) ? reIsNative : reIsHostCtor;
|
|
300
262
|
return pattern.test(toSource(value));
|
|
301
263
|
}
|
|
302
264
|
|
|
@@ -460,7 +422,7 @@ function isLength(value) {
|
|
|
460
422
|
}
|
|
461
423
|
|
|
462
424
|
function isArrayLike(value) {
|
|
463
|
-
return value != null && isLength(value.length) && !isFunction(value);
|
|
425
|
+
return value != null && isLength(value.length) && !isFunction$1(value);
|
|
464
426
|
}
|
|
465
427
|
|
|
466
428
|
function isIterateeCall(value, index, object) {
|
|
@@ -2092,11 +2054,11 @@ const LuiModalAsync = ({
|
|
|
2092
2054
|
}
|
|
2093
2055
|
}, 100);
|
|
2094
2056
|
}, []);
|
|
2095
|
-
return className?.includes("storybook") ? /* @__PURE__ */ jsx("div", { className: clsx
|
|
2057
|
+
return className?.includes("storybook") ? /* @__PURE__ */ jsx("div", { className: clsx("LuiModalAsync", className), style, children }) : /* @__PURE__ */ jsx(
|
|
2096
2058
|
"dialog",
|
|
2097
2059
|
{
|
|
2098
2060
|
role: "dialog",
|
|
2099
|
-
className: clsx
|
|
2061
|
+
className: clsx("LuiModalAsync", className),
|
|
2100
2062
|
style,
|
|
2101
2063
|
ref: dialogRef,
|
|
2102
2064
|
onCancel: (e) => {
|
|
@@ -2357,10 +2319,6 @@ function getDefaultExportFromCjs (x) {
|
|
|
2357
2319
|
return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
|
|
2358
2320
|
}
|
|
2359
2321
|
|
|
2360
|
-
var cjs = {exports: {}};
|
|
2361
|
-
|
|
2362
|
-
var Draggable$1 = {};
|
|
2363
|
-
|
|
2364
2322
|
var propTypes = {exports: {}};
|
|
2365
2323
|
|
|
2366
2324
|
var reactIs = {exports: {}};
|
|
@@ -3328,1251 +3286,995 @@ function requirePropTypes () {
|
|
|
3328
3286
|
return propTypes.exports;
|
|
3329
3287
|
}
|
|
3330
3288
|
|
|
3331
|
-
var
|
|
3289
|
+
var propTypesExports = /*@__PURE__*/ requirePropTypes();
|
|
3290
|
+
var PropTypes2 = /*@__PURE__*/getDefaultExportFromCjs(propTypesExports);
|
|
3332
3291
|
|
|
3333
|
-
|
|
3292
|
+
// lib/Draggable.tsx
|
|
3334
3293
|
|
|
3335
|
-
|
|
3336
|
-
|
|
3337
|
-
|
|
3338
|
-
|
|
3339
|
-
|
|
3340
|
-
|
|
3341
|
-
|
|
3342
|
-
|
|
3343
|
-
|
|
3344
|
-
|
|
3345
|
-
|
|
3346
|
-
|
|
3347
|
-
|
|
3348
|
-
|
|
3349
|
-
|
|
3350
|
-
|
|
3351
|
-
|
|
3352
|
-
|
|
3353
|
-
}
|
|
3354
|
-
|
|
3355
|
-
var domFns = {};
|
|
3356
|
-
|
|
3357
|
-
var shims = {};
|
|
3358
|
-
|
|
3359
|
-
var hasRequiredShims;
|
|
3360
|
-
|
|
3361
|
-
function requireShims () {
|
|
3362
|
-
if (hasRequiredShims) return shims;
|
|
3363
|
-
hasRequiredShims = 1;
|
|
3364
|
-
Object.defineProperty(shims, "__esModule", {
|
|
3365
|
-
value: true
|
|
3366
|
-
});
|
|
3367
|
-
shims.dontSetMe = dontSetMe;
|
|
3368
|
-
shims.findInArray = findInArray;
|
|
3369
|
-
shims.int = int;
|
|
3370
|
-
shims.isFunction = isFunction;
|
|
3371
|
-
shims.isNum = isNum;
|
|
3372
|
-
function findInArray(array, callback) {
|
|
3373
|
-
for (let i = 0, length = array.length; i < length; i++) {
|
|
3374
|
-
if (callback.apply(callback, [array[i], i, array])) return array[i];
|
|
3375
|
-
}
|
|
3376
|
-
}
|
|
3377
|
-
function isFunction(func) {
|
|
3378
|
-
return typeof func === "function" || Object.prototype.toString.call(func) === "[object Function]";
|
|
3379
|
-
}
|
|
3380
|
-
function isNum(num) {
|
|
3381
|
-
return typeof num === "number" && !isNaN(num);
|
|
3382
|
-
}
|
|
3383
|
-
function int(a) {
|
|
3384
|
-
return parseInt(a, 10);
|
|
3385
|
-
}
|
|
3386
|
-
function dontSetMe(props, propName, componentName) {
|
|
3387
|
-
if (props[propName]) {
|
|
3388
|
-
return new Error(`Invalid prop ${propName} passed to ${componentName} - do not set this, set it on the child.`);
|
|
3389
|
-
}
|
|
3390
|
-
}
|
|
3391
|
-
return shims;
|
|
3392
|
-
}
|
|
3393
|
-
|
|
3394
|
-
var getPrefix = {};
|
|
3395
|
-
|
|
3396
|
-
var hasRequiredGetPrefix;
|
|
3397
|
-
|
|
3398
|
-
function requireGetPrefix () {
|
|
3399
|
-
if (hasRequiredGetPrefix) return getPrefix;
|
|
3400
|
-
hasRequiredGetPrefix = 1;
|
|
3401
|
-
Object.defineProperty(getPrefix, "__esModule", {
|
|
3402
|
-
value: true
|
|
3403
|
-
});
|
|
3404
|
-
getPrefix.browserPrefixToKey = browserPrefixToKey;
|
|
3405
|
-
getPrefix.browserPrefixToStyle = browserPrefixToStyle;
|
|
3406
|
-
getPrefix.default = void 0;
|
|
3407
|
-
getPrefix.getPrefix = getPrefix$1;
|
|
3408
|
-
const prefixes = ["Moz", "Webkit", "O", "ms"];
|
|
3409
|
-
function getPrefix$1() {
|
|
3410
|
-
let prop = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "transform";
|
|
3411
|
-
if (typeof window === "undefined") return "";
|
|
3412
|
-
const style = window.document?.documentElement?.style;
|
|
3413
|
-
if (!style) return "";
|
|
3414
|
-
if (prop in style) return "";
|
|
3415
|
-
for (let i = 0; i < prefixes.length; i++) {
|
|
3416
|
-
if (browserPrefixToKey(prop, prefixes[i]) in style) return prefixes[i];
|
|
3417
|
-
}
|
|
3418
|
-
return "";
|
|
3419
|
-
}
|
|
3420
|
-
function browserPrefixToKey(prop, prefix) {
|
|
3421
|
-
return prefix ? `${prefix}${kebabToTitleCase(prop)}` : prop;
|
|
3422
|
-
}
|
|
3423
|
-
function browserPrefixToStyle(prop, prefix) {
|
|
3424
|
-
return prefix ? `-${prefix.toLowerCase()}-${prop}` : prop;
|
|
3425
|
-
}
|
|
3426
|
-
function kebabToTitleCase(str) {
|
|
3427
|
-
let out = "";
|
|
3428
|
-
let shouldCapitalize = true;
|
|
3429
|
-
for (let i = 0; i < str.length; i++) {
|
|
3430
|
-
if (shouldCapitalize) {
|
|
3431
|
-
out += str[i].toUpperCase();
|
|
3432
|
-
shouldCapitalize = false;
|
|
3433
|
-
} else if (str[i] === "-") {
|
|
3434
|
-
shouldCapitalize = true;
|
|
3435
|
-
} else {
|
|
3436
|
-
out += str[i];
|
|
3437
|
-
}
|
|
3438
|
-
}
|
|
3439
|
-
return out;
|
|
3440
|
-
}
|
|
3441
|
-
getPrefix.default = getPrefix$1();
|
|
3442
|
-
return getPrefix;
|
|
3443
|
-
}
|
|
3444
|
-
|
|
3445
|
-
var hasRequiredDomFns;
|
|
3446
|
-
|
|
3447
|
-
function requireDomFns () {
|
|
3448
|
-
if (hasRequiredDomFns) return domFns;
|
|
3449
|
-
hasRequiredDomFns = 1;
|
|
3450
|
-
Object.defineProperty(domFns, "__esModule", {
|
|
3451
|
-
value: true
|
|
3452
|
-
});
|
|
3453
|
-
domFns.addClassName = addClassName;
|
|
3454
|
-
domFns.addEvent = addEvent;
|
|
3455
|
-
domFns.addUserSelectStyles = addUserSelectStyles;
|
|
3456
|
-
domFns.createCSSTransform = createCSSTransform;
|
|
3457
|
-
domFns.createSVGTransform = createSVGTransform;
|
|
3458
|
-
domFns.getTouch = getTouch;
|
|
3459
|
-
domFns.getTouchIdentifier = getTouchIdentifier;
|
|
3460
|
-
domFns.getTranslation = getTranslation;
|
|
3461
|
-
domFns.innerHeight = innerHeight;
|
|
3462
|
-
domFns.innerWidth = innerWidth;
|
|
3463
|
-
domFns.matchesSelector = matchesSelector;
|
|
3464
|
-
domFns.matchesSelectorAndParentsTo = matchesSelectorAndParentsTo;
|
|
3465
|
-
domFns.offsetXYFromParent = offsetXYFromParent;
|
|
3466
|
-
domFns.outerHeight = outerHeight;
|
|
3467
|
-
domFns.outerWidth = outerWidth;
|
|
3468
|
-
domFns.removeClassName = removeClassName;
|
|
3469
|
-
domFns.removeEvent = removeEvent;
|
|
3470
|
-
domFns.scheduleRemoveUserSelectStyles = scheduleRemoveUserSelectStyles;
|
|
3471
|
-
var _shims = requireShims();
|
|
3472
|
-
var _getPrefix = _interopRequireWildcard(requireGetPrefix());
|
|
3473
|
-
function _interopRequireWildcard(e, t) {
|
|
3474
|
-
if ("function" == typeof WeakMap) var r = /* @__PURE__ */ new WeakMap(), n = /* @__PURE__ */ new WeakMap();
|
|
3475
|
-
return (_interopRequireWildcard = function(e2, t2) {
|
|
3476
|
-
if (!t2 && e2 && e2.__esModule) return e2;
|
|
3477
|
-
var o, i, f = { __proto__: null, default: e2 };
|
|
3478
|
-
if (null === e2 || "object" != typeof e2 && "function" != typeof e2) return f;
|
|
3479
|
-
if (o = t2 ? n : r) {
|
|
3480
|
-
if (o.has(e2)) return o.get(e2);
|
|
3481
|
-
o.set(e2, f);
|
|
3482
|
-
}
|
|
3483
|
-
for (const t3 in e2) "default" !== t3 && {}.hasOwnProperty.call(e2, t3) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e2, t3)) && (i.get || i.set) ? o(f, t3, i) : f[t3] = e2[t3]);
|
|
3484
|
-
return f;
|
|
3485
|
-
})(e, t);
|
|
3486
|
-
}
|
|
3487
|
-
let matchesSelectorFunc = "";
|
|
3488
|
-
function matchesSelector(el, selector) {
|
|
3489
|
-
if (!matchesSelectorFunc) {
|
|
3490
|
-
matchesSelectorFunc = (0, _shims.findInArray)(["matches", "webkitMatchesSelector", "mozMatchesSelector", "msMatchesSelector", "oMatchesSelector"], function(method) {
|
|
3491
|
-
return (0, _shims.isFunction)(el[method]);
|
|
3492
|
-
});
|
|
3493
|
-
}
|
|
3494
|
-
if (!(0, _shims.isFunction)(el[matchesSelectorFunc])) return false;
|
|
3495
|
-
return el[matchesSelectorFunc](selector);
|
|
3496
|
-
}
|
|
3497
|
-
function matchesSelectorAndParentsTo(el, selector, baseNode) {
|
|
3498
|
-
let node = el;
|
|
3499
|
-
do {
|
|
3500
|
-
if (matchesSelector(node, selector)) return true;
|
|
3501
|
-
if (node === baseNode) return false;
|
|
3502
|
-
node = node.parentNode;
|
|
3503
|
-
} while (node);
|
|
3504
|
-
return false;
|
|
3505
|
-
}
|
|
3506
|
-
function addEvent(el, event, handler, inputOptions) {
|
|
3507
|
-
if (!el) return;
|
|
3508
|
-
const options = {
|
|
3509
|
-
capture: true,
|
|
3510
|
-
...inputOptions
|
|
3511
|
-
};
|
|
3512
|
-
if (el.addEventListener) {
|
|
3513
|
-
el.addEventListener(event, handler, options);
|
|
3514
|
-
} else if (el.attachEvent) {
|
|
3515
|
-
el.attachEvent("on" + event, handler);
|
|
3516
|
-
} else {
|
|
3517
|
-
el["on" + event] = handler;
|
|
3518
|
-
}
|
|
3519
|
-
}
|
|
3520
|
-
function removeEvent(el, event, handler, inputOptions) {
|
|
3521
|
-
if (!el) return;
|
|
3522
|
-
const options = {
|
|
3523
|
-
capture: true,
|
|
3524
|
-
...inputOptions
|
|
3525
|
-
};
|
|
3526
|
-
if (el.removeEventListener) {
|
|
3527
|
-
el.removeEventListener(event, handler, options);
|
|
3528
|
-
} else if (el.detachEvent) {
|
|
3529
|
-
el.detachEvent("on" + event, handler);
|
|
3530
|
-
} else {
|
|
3531
|
-
el["on" + event] = null;
|
|
3532
|
-
}
|
|
3533
|
-
}
|
|
3534
|
-
function outerHeight(node) {
|
|
3535
|
-
let height = node.clientHeight;
|
|
3536
|
-
const computedStyle = node.ownerDocument.defaultView.getComputedStyle(node);
|
|
3537
|
-
height += (0, _shims.int)(computedStyle.borderTopWidth);
|
|
3538
|
-
height += (0, _shims.int)(computedStyle.borderBottomWidth);
|
|
3539
|
-
return height;
|
|
3540
|
-
}
|
|
3541
|
-
function outerWidth(node) {
|
|
3542
|
-
let width = node.clientWidth;
|
|
3543
|
-
const computedStyle = node.ownerDocument.defaultView.getComputedStyle(node);
|
|
3544
|
-
width += (0, _shims.int)(computedStyle.borderLeftWidth);
|
|
3545
|
-
width += (0, _shims.int)(computedStyle.borderRightWidth);
|
|
3546
|
-
return width;
|
|
3547
|
-
}
|
|
3548
|
-
function innerHeight(node) {
|
|
3549
|
-
let height = node.clientHeight;
|
|
3550
|
-
const computedStyle = node.ownerDocument.defaultView.getComputedStyle(node);
|
|
3551
|
-
height -= (0, _shims.int)(computedStyle.paddingTop);
|
|
3552
|
-
height -= (0, _shims.int)(computedStyle.paddingBottom);
|
|
3553
|
-
return height;
|
|
3554
|
-
}
|
|
3555
|
-
function innerWidth(node) {
|
|
3556
|
-
let width = node.clientWidth;
|
|
3557
|
-
const computedStyle = node.ownerDocument.defaultView.getComputedStyle(node);
|
|
3558
|
-
width -= (0, _shims.int)(computedStyle.paddingLeft);
|
|
3559
|
-
width -= (0, _shims.int)(computedStyle.paddingRight);
|
|
3560
|
-
return width;
|
|
3561
|
-
}
|
|
3562
|
-
function offsetXYFromParent(evt, offsetParent, scale) {
|
|
3563
|
-
const isBody = offsetParent === offsetParent.ownerDocument.body;
|
|
3564
|
-
const offsetParentRect = isBody ? {
|
|
3565
|
-
left: 0,
|
|
3566
|
-
top: 0
|
|
3567
|
-
} : offsetParent.getBoundingClientRect();
|
|
3568
|
-
const x = (evt.clientX + offsetParent.scrollLeft - offsetParentRect.left) / scale;
|
|
3569
|
-
const y = (evt.clientY + offsetParent.scrollTop - offsetParentRect.top) / scale;
|
|
3570
|
-
return {
|
|
3571
|
-
x,
|
|
3572
|
-
y
|
|
3573
|
-
};
|
|
3574
|
-
}
|
|
3575
|
-
function createCSSTransform(controlPos, positionOffset) {
|
|
3576
|
-
const translation = getTranslation(controlPos, positionOffset, "px");
|
|
3577
|
-
return {
|
|
3578
|
-
[(0, _getPrefix.browserPrefixToKey)("transform", _getPrefix.default)]: translation
|
|
3579
|
-
};
|
|
3580
|
-
}
|
|
3581
|
-
function createSVGTransform(controlPos, positionOffset) {
|
|
3582
|
-
const translation = getTranslation(controlPos, positionOffset, "");
|
|
3583
|
-
return translation;
|
|
3584
|
-
}
|
|
3585
|
-
function getTranslation(_ref, positionOffset, unitSuffix) {
|
|
3586
|
-
let {
|
|
3587
|
-
x,
|
|
3588
|
-
y
|
|
3589
|
-
} = _ref;
|
|
3590
|
-
let translation = `translate(${x}${unitSuffix},${y}${unitSuffix})`;
|
|
3591
|
-
if (positionOffset) {
|
|
3592
|
-
const defaultX = `${typeof positionOffset.x === "string" ? positionOffset.x : positionOffset.x + unitSuffix}`;
|
|
3593
|
-
const defaultY = `${typeof positionOffset.y === "string" ? positionOffset.y : positionOffset.y + unitSuffix}`;
|
|
3594
|
-
translation = `translate(${defaultX}, ${defaultY})` + translation;
|
|
3595
|
-
}
|
|
3596
|
-
return translation;
|
|
3597
|
-
}
|
|
3598
|
-
function getTouch(e, identifier) {
|
|
3599
|
-
return e.targetTouches && (0, _shims.findInArray)(e.targetTouches, (t) => identifier === t.identifier) || e.changedTouches && (0, _shims.findInArray)(e.changedTouches, (t) => identifier === t.identifier);
|
|
3600
|
-
}
|
|
3601
|
-
function getTouchIdentifier(e) {
|
|
3602
|
-
if (e.targetTouches && e.targetTouches[0]) return e.targetTouches[0].identifier;
|
|
3603
|
-
if (e.changedTouches && e.changedTouches[0]) return e.changedTouches[0].identifier;
|
|
3604
|
-
}
|
|
3605
|
-
function addUserSelectStyles(doc) {
|
|
3606
|
-
if (!doc) return;
|
|
3607
|
-
let styleEl = doc.getElementById("react-draggable-style-el");
|
|
3608
|
-
if (!styleEl) {
|
|
3609
|
-
styleEl = doc.createElement("style");
|
|
3610
|
-
styleEl.type = "text/css";
|
|
3611
|
-
styleEl.id = "react-draggable-style-el";
|
|
3612
|
-
styleEl.innerHTML = ".react-draggable-transparent-selection *::-moz-selection {all: inherit;}\n";
|
|
3613
|
-
styleEl.innerHTML += ".react-draggable-transparent-selection *::selection {all: inherit;}\n";
|
|
3614
|
-
doc.getElementsByTagName("head")[0].appendChild(styleEl);
|
|
3615
|
-
}
|
|
3616
|
-
if (doc.body) addClassName(doc.body, "react-draggable-transparent-selection");
|
|
3617
|
-
}
|
|
3618
|
-
function scheduleRemoveUserSelectStyles(doc) {
|
|
3619
|
-
if (window.requestAnimationFrame) {
|
|
3620
|
-
window.requestAnimationFrame(() => {
|
|
3621
|
-
removeUserSelectStyles(doc);
|
|
3622
|
-
});
|
|
3623
|
-
} else {
|
|
3624
|
-
removeUserSelectStyles(doc);
|
|
3625
|
-
}
|
|
3626
|
-
}
|
|
3627
|
-
function removeUserSelectStyles(doc) {
|
|
3628
|
-
if (!doc) return;
|
|
3629
|
-
try {
|
|
3630
|
-
if (doc.body) removeClassName(doc.body, "react-draggable-transparent-selection");
|
|
3631
|
-
if (doc.selection) {
|
|
3632
|
-
doc.selection.empty();
|
|
3633
|
-
} else {
|
|
3634
|
-
const selection = (doc.defaultView || window).getSelection();
|
|
3635
|
-
if (selection && selection.type !== "Caret") {
|
|
3636
|
-
selection.removeAllRanges();
|
|
3637
|
-
}
|
|
3638
|
-
}
|
|
3639
|
-
} catch (e) {
|
|
3640
|
-
}
|
|
3641
|
-
}
|
|
3642
|
-
function addClassName(el, className) {
|
|
3643
|
-
if (el.classList) {
|
|
3644
|
-
el.classList.add(className);
|
|
3645
|
-
} else {
|
|
3646
|
-
if (!el.className.match(new RegExp(`(?:^|\\s)${className}(?!\\S)`))) {
|
|
3647
|
-
el.className += ` ${className}`;
|
|
3648
|
-
}
|
|
3649
|
-
}
|
|
3650
|
-
}
|
|
3651
|
-
function removeClassName(el, className) {
|
|
3652
|
-
if (el.classList) {
|
|
3653
|
-
el.classList.remove(className);
|
|
3654
|
-
} else {
|
|
3655
|
-
el.className = el.className.replace(new RegExp(`(?:^|\\s)${className}(?!\\S)`, "g"), "");
|
|
3656
|
-
}
|
|
3657
|
-
}
|
|
3658
|
-
return domFns;
|
|
3659
|
-
}
|
|
3660
|
-
|
|
3661
|
-
var positionFns = {};
|
|
3662
|
-
|
|
3663
|
-
var hasRequiredPositionFns;
|
|
3664
|
-
|
|
3665
|
-
function requirePositionFns () {
|
|
3666
|
-
if (hasRequiredPositionFns) return positionFns;
|
|
3667
|
-
hasRequiredPositionFns = 1;
|
|
3668
|
-
Object.defineProperty(positionFns, "__esModule", {
|
|
3669
|
-
value: true
|
|
3670
|
-
});
|
|
3671
|
-
positionFns.canDragX = canDragX;
|
|
3672
|
-
positionFns.canDragY = canDragY;
|
|
3673
|
-
positionFns.createCoreData = createCoreData;
|
|
3674
|
-
positionFns.createDraggableData = createDraggableData;
|
|
3675
|
-
positionFns.getBoundPosition = getBoundPosition;
|
|
3676
|
-
positionFns.getControlPosition = getControlPosition;
|
|
3677
|
-
positionFns.snapToGrid = snapToGrid;
|
|
3678
|
-
var _shims = requireShims();
|
|
3679
|
-
var _domFns = requireDomFns();
|
|
3680
|
-
function getBoundPosition(draggable, x, y) {
|
|
3681
|
-
if (!draggable.props.bounds) return [x, y];
|
|
3682
|
-
let {
|
|
3683
|
-
bounds
|
|
3684
|
-
} = draggable.props;
|
|
3685
|
-
bounds = typeof bounds === "string" ? bounds : cloneBounds(bounds);
|
|
3686
|
-
const node = findDOMNode(draggable);
|
|
3687
|
-
if (typeof bounds === "string") {
|
|
3688
|
-
const {
|
|
3689
|
-
ownerDocument
|
|
3690
|
-
} = node;
|
|
3691
|
-
const ownerWindow = ownerDocument.defaultView;
|
|
3692
|
-
let boundNode;
|
|
3693
|
-
if (bounds === "parent") {
|
|
3694
|
-
boundNode = node.parentNode;
|
|
3695
|
-
} else {
|
|
3696
|
-
const rootNode = node.getRootNode();
|
|
3697
|
-
boundNode = rootNode.querySelector(bounds);
|
|
3698
|
-
}
|
|
3699
|
-
if (!(boundNode instanceof ownerWindow.HTMLElement)) {
|
|
3700
|
-
throw new Error('Bounds selector "' + bounds + '" could not find an element.');
|
|
3701
|
-
}
|
|
3702
|
-
const boundNodeEl = boundNode;
|
|
3703
|
-
const nodeStyle = ownerWindow.getComputedStyle(node);
|
|
3704
|
-
const boundNodeStyle = ownerWindow.getComputedStyle(boundNodeEl);
|
|
3705
|
-
bounds = {
|
|
3706
|
-
left: -node.offsetLeft + (0, _shims.int)(boundNodeStyle.paddingLeft) + (0, _shims.int)(nodeStyle.marginLeft),
|
|
3707
|
-
top: -node.offsetTop + (0, _shims.int)(boundNodeStyle.paddingTop) + (0, _shims.int)(nodeStyle.marginTop),
|
|
3708
|
-
right: (0, _domFns.innerWidth)(boundNodeEl) - (0, _domFns.outerWidth)(node) - node.offsetLeft + (0, _shims.int)(boundNodeStyle.paddingRight) - (0, _shims.int)(nodeStyle.marginRight),
|
|
3709
|
-
bottom: (0, _domFns.innerHeight)(boundNodeEl) - (0, _domFns.outerHeight)(node) - node.offsetTop + (0, _shims.int)(boundNodeStyle.paddingBottom) - (0, _shims.int)(nodeStyle.marginBottom)
|
|
3710
|
-
};
|
|
3711
|
-
}
|
|
3712
|
-
if ((0, _shims.isNum)(bounds.right)) x = Math.min(x, bounds.right);
|
|
3713
|
-
if ((0, _shims.isNum)(bounds.bottom)) y = Math.min(y, bounds.bottom);
|
|
3714
|
-
if ((0, _shims.isNum)(bounds.left)) x = Math.max(x, bounds.left);
|
|
3715
|
-
if ((0, _shims.isNum)(bounds.top)) y = Math.max(y, bounds.top);
|
|
3716
|
-
return [x, y];
|
|
3717
|
-
}
|
|
3718
|
-
function snapToGrid(grid, pendingX, pendingY) {
|
|
3719
|
-
const x = Math.round(pendingX / grid[0]) * grid[0];
|
|
3720
|
-
const y = Math.round(pendingY / grid[1]) * grid[1];
|
|
3721
|
-
return [x, y];
|
|
3722
|
-
}
|
|
3723
|
-
function canDragX(draggable) {
|
|
3724
|
-
return draggable.props.axis === "both" || draggable.props.axis === "x";
|
|
3725
|
-
}
|
|
3726
|
-
function canDragY(draggable) {
|
|
3727
|
-
return draggable.props.axis === "both" || draggable.props.axis === "y";
|
|
3728
|
-
}
|
|
3729
|
-
function getControlPosition(e, touchIdentifier, draggableCore) {
|
|
3730
|
-
const touchObj = typeof touchIdentifier === "number" ? (0, _domFns.getTouch)(e, touchIdentifier) : null;
|
|
3731
|
-
if (typeof touchIdentifier === "number" && !touchObj) return null;
|
|
3732
|
-
const node = findDOMNode(draggableCore);
|
|
3733
|
-
const offsetParent = draggableCore.props.offsetParent || node.offsetParent || node.ownerDocument.body;
|
|
3734
|
-
return (0, _domFns.offsetXYFromParent)(touchObj || e, offsetParent, draggableCore.props.scale);
|
|
3735
|
-
}
|
|
3736
|
-
function createCoreData(draggable, x, y) {
|
|
3737
|
-
const isStart = !(0, _shims.isNum)(draggable.lastX);
|
|
3738
|
-
const node = findDOMNode(draggable);
|
|
3739
|
-
if (isStart) {
|
|
3740
|
-
return {
|
|
3741
|
-
node,
|
|
3742
|
-
deltaX: 0,
|
|
3743
|
-
deltaY: 0,
|
|
3744
|
-
lastX: x,
|
|
3745
|
-
lastY: y,
|
|
3746
|
-
x,
|
|
3747
|
-
y
|
|
3748
|
-
};
|
|
3749
|
-
} else {
|
|
3750
|
-
return {
|
|
3751
|
-
node,
|
|
3752
|
-
deltaX: x - draggable.lastX,
|
|
3753
|
-
deltaY: y - draggable.lastY,
|
|
3754
|
-
lastX: draggable.lastX,
|
|
3755
|
-
lastY: draggable.lastY,
|
|
3756
|
-
x,
|
|
3757
|
-
y
|
|
3758
|
-
};
|
|
3759
|
-
}
|
|
3760
|
-
}
|
|
3761
|
-
function createDraggableData(draggable, coreData) {
|
|
3762
|
-
const scale = draggable.props.scale;
|
|
3763
|
-
return {
|
|
3764
|
-
node: coreData.node,
|
|
3765
|
-
x: draggable.state.x + coreData.deltaX / scale,
|
|
3766
|
-
y: draggable.state.y + coreData.deltaY / scale,
|
|
3767
|
-
deltaX: coreData.deltaX / scale,
|
|
3768
|
-
deltaY: coreData.deltaY / scale,
|
|
3769
|
-
lastX: draggable.state.x,
|
|
3770
|
-
lastY: draggable.state.y
|
|
3771
|
-
};
|
|
3772
|
-
}
|
|
3773
|
-
function cloneBounds(bounds) {
|
|
3774
|
-
return {
|
|
3775
|
-
left: bounds.left,
|
|
3776
|
-
top: bounds.top,
|
|
3777
|
-
right: bounds.right,
|
|
3778
|
-
bottom: bounds.bottom
|
|
3779
|
-
};
|
|
3780
|
-
}
|
|
3781
|
-
function findDOMNode(draggable) {
|
|
3782
|
-
const node = draggable.findDOMNode();
|
|
3783
|
-
if (!node) {
|
|
3784
|
-
throw new Error("<DraggableCore>: Unmounted during event!");
|
|
3785
|
-
}
|
|
3786
|
-
return node;
|
|
3787
|
-
}
|
|
3788
|
-
return positionFns;
|
|
3294
|
+
// lib/utils/shims.ts
|
|
3295
|
+
function findInArray(array, callback) {
|
|
3296
|
+
for (let i = 0, length = array.length; i < length; i++) {
|
|
3297
|
+
if (callback.apply(callback, [array[i], i, array])) return array[i];
|
|
3298
|
+
}
|
|
3299
|
+
}
|
|
3300
|
+
function isFunction(func) {
|
|
3301
|
+
return typeof func === "function" || Object.prototype.toString.call(func) === "[object Function]";
|
|
3302
|
+
}
|
|
3303
|
+
function isNum(num) {
|
|
3304
|
+
return typeof num === "number" && !isNaN(num);
|
|
3305
|
+
}
|
|
3306
|
+
function int(a) {
|
|
3307
|
+
return parseInt(a, 10);
|
|
3308
|
+
}
|
|
3309
|
+
function dontSetMe(props, propName, componentName) {
|
|
3310
|
+
if (props[propName]) {
|
|
3311
|
+
return new Error(`Invalid prop ${propName} passed to ${componentName} - do not set this, set it on the child.`);
|
|
3312
|
+
}
|
|
3789
3313
|
}
|
|
3790
3314
|
|
|
3791
|
-
|
|
3315
|
+
// lib/utils/getPrefix.ts
|
|
3316
|
+
var prefixes = ["Moz", "Webkit", "O", "ms"];
|
|
3317
|
+
function getPrefix(prop = "transform") {
|
|
3318
|
+
var _a, _b;
|
|
3319
|
+
if (typeof window === "undefined") return "";
|
|
3320
|
+
const style = (_b = (_a = window.document) == null ? void 0 : _a.documentElement) == null ? void 0 : _b.style;
|
|
3321
|
+
if (!style) return "";
|
|
3322
|
+
if (prop in style) return "";
|
|
3323
|
+
for (let i = 0; i < prefixes.length; i++) {
|
|
3324
|
+
if (browserPrefixToKey(prop, prefixes[i]) in style) return prefixes[i];
|
|
3325
|
+
}
|
|
3326
|
+
return "";
|
|
3327
|
+
}
|
|
3328
|
+
function browserPrefixToKey(prop, prefix) {
|
|
3329
|
+
return prefix ? `${prefix}${kebabToTitleCase(prop)}` : prop;
|
|
3330
|
+
}
|
|
3331
|
+
function kebabToTitleCase(str) {
|
|
3332
|
+
let out = "";
|
|
3333
|
+
let shouldCapitalize = true;
|
|
3334
|
+
for (let i = 0; i < str.length; i++) {
|
|
3335
|
+
if (shouldCapitalize) {
|
|
3336
|
+
out += str[i].toUpperCase();
|
|
3337
|
+
shouldCapitalize = false;
|
|
3338
|
+
} else if (str[i] === "-") {
|
|
3339
|
+
shouldCapitalize = true;
|
|
3340
|
+
} else {
|
|
3341
|
+
out += str[i];
|
|
3342
|
+
}
|
|
3343
|
+
}
|
|
3344
|
+
return out;
|
|
3345
|
+
}
|
|
3346
|
+
var getPrefix_default = getPrefix();
|
|
3347
|
+
|
|
3348
|
+
// lib/utils/domFns.ts
|
|
3349
|
+
var matchesSelectorFunc = "";
|
|
3350
|
+
function matchesSelector(el, selector) {
|
|
3351
|
+
var _a;
|
|
3352
|
+
if (!matchesSelectorFunc) {
|
|
3353
|
+
matchesSelectorFunc = (_a = findInArray([
|
|
3354
|
+
"matches",
|
|
3355
|
+
"webkitMatchesSelector",
|
|
3356
|
+
"mozMatchesSelector",
|
|
3357
|
+
"msMatchesSelector",
|
|
3358
|
+
"oMatchesSelector"
|
|
3359
|
+
], function(method) {
|
|
3360
|
+
return isFunction(el[method]);
|
|
3361
|
+
})) != null ? _a : "";
|
|
3362
|
+
}
|
|
3363
|
+
const matchFn = el[matchesSelectorFunc];
|
|
3364
|
+
if (!isFunction(matchFn)) return false;
|
|
3365
|
+
return Boolean(matchFn.call(el, selector));
|
|
3366
|
+
}
|
|
3367
|
+
function matchesSelectorAndParentsTo(el, selector, baseNode) {
|
|
3368
|
+
let node = el;
|
|
3369
|
+
do {
|
|
3370
|
+
if (matchesSelector(node, selector)) return true;
|
|
3371
|
+
if (node === baseNode) return false;
|
|
3372
|
+
node = node.parentNode;
|
|
3373
|
+
} while (node);
|
|
3374
|
+
return false;
|
|
3375
|
+
}
|
|
3376
|
+
function addEvent(el, event, handler, inputOptions) {
|
|
3377
|
+
if (!el) return;
|
|
3378
|
+
const options = { capture: true, ...inputOptions };
|
|
3379
|
+
const listener = handler;
|
|
3380
|
+
if (el.addEventListener) {
|
|
3381
|
+
el.addEventListener(event, listener, options);
|
|
3382
|
+
} else if (el.attachEvent) {
|
|
3383
|
+
el.attachEvent("on" + event, listener);
|
|
3384
|
+
} else {
|
|
3385
|
+
el["on" + event] = listener;
|
|
3386
|
+
}
|
|
3387
|
+
}
|
|
3388
|
+
function removeEvent(el, event, handler, inputOptions) {
|
|
3389
|
+
if (!el) return;
|
|
3390
|
+
const options = { capture: true, ...inputOptions };
|
|
3391
|
+
const listener = handler;
|
|
3392
|
+
if (el.removeEventListener) {
|
|
3393
|
+
el.removeEventListener(event, listener, options);
|
|
3394
|
+
} else if (el.detachEvent) {
|
|
3395
|
+
el.detachEvent("on" + event, listener);
|
|
3396
|
+
} else {
|
|
3397
|
+
el["on" + event] = null;
|
|
3398
|
+
}
|
|
3399
|
+
}
|
|
3400
|
+
function outerHeight(node) {
|
|
3401
|
+
let height = node.clientHeight;
|
|
3402
|
+
const computedStyle = node.ownerDocument.defaultView.getComputedStyle(node);
|
|
3403
|
+
height += int(computedStyle.borderTopWidth);
|
|
3404
|
+
height += int(computedStyle.borderBottomWidth);
|
|
3405
|
+
return height;
|
|
3406
|
+
}
|
|
3407
|
+
function outerWidth(node) {
|
|
3408
|
+
let width = node.clientWidth;
|
|
3409
|
+
const computedStyle = node.ownerDocument.defaultView.getComputedStyle(node);
|
|
3410
|
+
width += int(computedStyle.borderLeftWidth);
|
|
3411
|
+
width += int(computedStyle.borderRightWidth);
|
|
3412
|
+
return width;
|
|
3413
|
+
}
|
|
3414
|
+
function innerHeight(node) {
|
|
3415
|
+
let height = node.clientHeight;
|
|
3416
|
+
const computedStyle = node.ownerDocument.defaultView.getComputedStyle(node);
|
|
3417
|
+
height -= int(computedStyle.paddingTop);
|
|
3418
|
+
height -= int(computedStyle.paddingBottom);
|
|
3419
|
+
return height;
|
|
3420
|
+
}
|
|
3421
|
+
function innerWidth(node) {
|
|
3422
|
+
let width = node.clientWidth;
|
|
3423
|
+
const computedStyle = node.ownerDocument.defaultView.getComputedStyle(node);
|
|
3424
|
+
width -= int(computedStyle.paddingLeft);
|
|
3425
|
+
width -= int(computedStyle.paddingRight);
|
|
3426
|
+
return width;
|
|
3427
|
+
}
|
|
3428
|
+
function offsetXYFromParent(evt, offsetParent, scale) {
|
|
3429
|
+
const isBody = offsetParent === offsetParent.ownerDocument.body;
|
|
3430
|
+
const offsetParentRect = isBody ? { left: 0, top: 0 } : offsetParent.getBoundingClientRect();
|
|
3431
|
+
const x = (evt.clientX + offsetParent.scrollLeft - offsetParentRect.left) / scale;
|
|
3432
|
+
const y = (evt.clientY + offsetParent.scrollTop - offsetParentRect.top) / scale;
|
|
3433
|
+
return { x, y };
|
|
3434
|
+
}
|
|
3435
|
+
function createCSSTransform(controlPos, positionOffset) {
|
|
3436
|
+
const translation = getTranslation(controlPos, positionOffset, "px");
|
|
3437
|
+
return { [browserPrefixToKey("transform", getPrefix_default)]: translation };
|
|
3438
|
+
}
|
|
3439
|
+
function createSVGTransform(controlPos, positionOffset) {
|
|
3440
|
+
const translation = getTranslation(controlPos, positionOffset, "");
|
|
3441
|
+
return translation;
|
|
3442
|
+
}
|
|
3443
|
+
function getTranslation({ x, y }, positionOffset, unitSuffix) {
|
|
3444
|
+
let translation = `translate(${x}${unitSuffix},${y}${unitSuffix})`;
|
|
3445
|
+
if (positionOffset) {
|
|
3446
|
+
const defaultX = `${typeof positionOffset.x === "string" ? positionOffset.x : positionOffset.x + unitSuffix}`;
|
|
3447
|
+
const defaultY = `${typeof positionOffset.y === "string" ? positionOffset.y : positionOffset.y + unitSuffix}`;
|
|
3448
|
+
translation = `translate(${defaultX}, ${defaultY})` + translation;
|
|
3449
|
+
}
|
|
3450
|
+
return translation;
|
|
3451
|
+
}
|
|
3452
|
+
function getTouch(e, identifier) {
|
|
3453
|
+
return e.targetTouches && findInArray(e.targetTouches, (t) => identifier === t.identifier) || e.changedTouches && findInArray(e.changedTouches, (t) => identifier === t.identifier);
|
|
3454
|
+
}
|
|
3455
|
+
function getTouchIdentifier(e) {
|
|
3456
|
+
if (e.targetTouches && e.targetTouches[0]) return e.targetTouches[0].identifier;
|
|
3457
|
+
if (e.changedTouches && e.changedTouches[0]) return e.changedTouches[0].identifier;
|
|
3458
|
+
}
|
|
3459
|
+
function getDefaultNonce() {
|
|
3460
|
+
return typeof __webpack_nonce__ !== "undefined" ? __webpack_nonce__ : void 0;
|
|
3461
|
+
}
|
|
3462
|
+
function addUserSelectStyles(doc, nonce) {
|
|
3463
|
+
if (!doc) return;
|
|
3464
|
+
let styleEl = doc.getElementById("react-draggable-style-el");
|
|
3465
|
+
if (!styleEl) {
|
|
3466
|
+
styleEl = doc.createElement("style");
|
|
3467
|
+
styleEl.type = "text/css";
|
|
3468
|
+
styleEl.id = "react-draggable-style-el";
|
|
3469
|
+
const resolvedNonce = nonce != null ? nonce : getDefaultNonce();
|
|
3470
|
+
if (resolvedNonce) styleEl.setAttribute("nonce", resolvedNonce);
|
|
3471
|
+
styleEl.innerHTML = ".react-draggable-transparent-selection *::-moz-selection {all: inherit;}\n";
|
|
3472
|
+
styleEl.innerHTML += ".react-draggable-transparent-selection *::selection {all: inherit;}\n";
|
|
3473
|
+
doc.getElementsByTagName("head")[0].appendChild(styleEl);
|
|
3474
|
+
}
|
|
3475
|
+
if (doc.body) addClassName(doc.body, "react-draggable-transparent-selection");
|
|
3476
|
+
}
|
|
3477
|
+
function scheduleRemoveUserSelectStyles(doc) {
|
|
3478
|
+
if (window.requestAnimationFrame) {
|
|
3479
|
+
window.requestAnimationFrame(() => {
|
|
3480
|
+
removeUserSelectStyles(doc);
|
|
3481
|
+
});
|
|
3482
|
+
} else {
|
|
3483
|
+
removeUserSelectStyles(doc);
|
|
3484
|
+
}
|
|
3485
|
+
}
|
|
3486
|
+
function removeUserSelectStyles(doc) {
|
|
3487
|
+
if (!doc) return;
|
|
3488
|
+
try {
|
|
3489
|
+
if (doc.body) removeClassName(doc.body, "react-draggable-transparent-selection");
|
|
3490
|
+
const ieSelection = doc.selection;
|
|
3491
|
+
if (ieSelection) {
|
|
3492
|
+
ieSelection.empty();
|
|
3493
|
+
} else {
|
|
3494
|
+
const selection = (doc.defaultView || window).getSelection();
|
|
3495
|
+
if (selection && selection.type !== "Caret") {
|
|
3496
|
+
selection.removeAllRanges();
|
|
3497
|
+
}
|
|
3498
|
+
}
|
|
3499
|
+
} catch {
|
|
3500
|
+
}
|
|
3501
|
+
}
|
|
3502
|
+
function addClassName(el, className) {
|
|
3503
|
+
if (el.classList) {
|
|
3504
|
+
el.classList.add(className);
|
|
3505
|
+
} else {
|
|
3506
|
+
if (!el.className.match(new RegExp(`(?:^|\\s)${className}(?!\\S)`))) {
|
|
3507
|
+
el.className += ` ${className}`;
|
|
3508
|
+
}
|
|
3509
|
+
}
|
|
3510
|
+
}
|
|
3511
|
+
function removeClassName(el, className) {
|
|
3512
|
+
if (el.classList) {
|
|
3513
|
+
el.classList.remove(className);
|
|
3514
|
+
} else {
|
|
3515
|
+
el.className = el.className.replace(new RegExp(`(?:^|\\s)${className}(?!\\S)`, "g"), "");
|
|
3516
|
+
}
|
|
3517
|
+
}
|
|
3792
3518
|
|
|
3793
|
-
|
|
3519
|
+
// lib/utils/positionFns.ts
|
|
3520
|
+
function getBoundPosition(draggable, x, y) {
|
|
3521
|
+
if (!draggable.props.bounds) return [x, y];
|
|
3522
|
+
let { bounds } = draggable.props;
|
|
3523
|
+
bounds = typeof bounds === "string" ? bounds : cloneBounds(bounds);
|
|
3524
|
+
const node = findDOMNode(draggable);
|
|
3525
|
+
if (typeof bounds === "string") {
|
|
3526
|
+
const { ownerDocument } = node;
|
|
3527
|
+
const ownerWindow = ownerDocument.defaultView;
|
|
3528
|
+
if (!ownerWindow) {
|
|
3529
|
+
throw new Error("Cannot resolve the owner window of the draggable node.");
|
|
3530
|
+
}
|
|
3531
|
+
let boundNode;
|
|
3532
|
+
if (bounds === "parent") {
|
|
3533
|
+
boundNode = node.parentNode;
|
|
3534
|
+
} else {
|
|
3535
|
+
const rootNode = node.getRootNode();
|
|
3536
|
+
boundNode = rootNode.querySelector(bounds);
|
|
3537
|
+
}
|
|
3538
|
+
if (!(boundNode instanceof ownerWindow.HTMLElement)) {
|
|
3539
|
+
throw new Error('Bounds selector "' + bounds + '" could not find an element.');
|
|
3540
|
+
}
|
|
3541
|
+
const boundNodeEl = boundNode;
|
|
3542
|
+
const nodeStyle = ownerWindow.getComputedStyle(node);
|
|
3543
|
+
const boundNodeStyle = ownerWindow.getComputedStyle(boundNodeEl);
|
|
3544
|
+
bounds = {
|
|
3545
|
+
left: -node.offsetLeft + int(boundNodeStyle.paddingLeft) + int(nodeStyle.marginLeft),
|
|
3546
|
+
top: -node.offsetTop + int(boundNodeStyle.paddingTop) + int(nodeStyle.marginTop),
|
|
3547
|
+
right: innerWidth(boundNodeEl) - outerWidth(node) - node.offsetLeft + int(boundNodeStyle.paddingRight) - int(nodeStyle.marginRight),
|
|
3548
|
+
bottom: innerHeight(boundNodeEl) - outerHeight(node) - node.offsetTop + int(boundNodeStyle.paddingBottom) - int(nodeStyle.marginBottom)
|
|
3549
|
+
};
|
|
3550
|
+
}
|
|
3551
|
+
if (isNum(bounds.right)) x = Math.min(x, bounds.right);
|
|
3552
|
+
if (isNum(bounds.bottom)) y = Math.min(y, bounds.bottom);
|
|
3553
|
+
if (isNum(bounds.left)) x = Math.max(x, bounds.left);
|
|
3554
|
+
if (isNum(bounds.top)) y = Math.max(y, bounds.top);
|
|
3555
|
+
return [x, y];
|
|
3556
|
+
}
|
|
3557
|
+
function snapToGrid(grid, pendingX, pendingY) {
|
|
3558
|
+
const x = Math.round(pendingX / grid[0]) * grid[0];
|
|
3559
|
+
const y = Math.round(pendingY / grid[1]) * grid[1];
|
|
3560
|
+
return [x, y];
|
|
3561
|
+
}
|
|
3562
|
+
function canDragX(draggable) {
|
|
3563
|
+
return draggable.props.axis === "both" || draggable.props.axis === "x";
|
|
3564
|
+
}
|
|
3565
|
+
function canDragY(draggable) {
|
|
3566
|
+
return draggable.props.axis === "both" || draggable.props.axis === "y";
|
|
3567
|
+
}
|
|
3568
|
+
function getControlPosition(e, touchIdentifier, draggableCore) {
|
|
3569
|
+
const touchObj = typeof touchIdentifier === "number" ? getTouch(e, touchIdentifier) : null;
|
|
3570
|
+
if (typeof touchIdentifier === "number" && !touchObj) return null;
|
|
3571
|
+
const node = findDOMNode(draggableCore);
|
|
3572
|
+
const offsetParent = draggableCore.props.offsetParent || node.offsetParent || node.ownerDocument.body;
|
|
3573
|
+
return offsetXYFromParent(touchObj || e, offsetParent, draggableCore.props.scale);
|
|
3574
|
+
}
|
|
3575
|
+
function createCoreData(draggable, x, y) {
|
|
3576
|
+
const isStart = !isNum(draggable.lastX);
|
|
3577
|
+
const node = findDOMNode(draggable);
|
|
3578
|
+
if (isStart) {
|
|
3579
|
+
return {
|
|
3580
|
+
node,
|
|
3581
|
+
deltaX: 0,
|
|
3582
|
+
deltaY: 0,
|
|
3583
|
+
lastX: x,
|
|
3584
|
+
lastY: y,
|
|
3585
|
+
x,
|
|
3586
|
+
y
|
|
3587
|
+
};
|
|
3588
|
+
} else {
|
|
3589
|
+
return {
|
|
3590
|
+
node,
|
|
3591
|
+
deltaX: x - draggable.lastX,
|
|
3592
|
+
deltaY: y - draggable.lastY,
|
|
3593
|
+
lastX: draggable.lastX,
|
|
3594
|
+
lastY: draggable.lastY,
|
|
3595
|
+
x,
|
|
3596
|
+
y
|
|
3597
|
+
};
|
|
3598
|
+
}
|
|
3599
|
+
}
|
|
3600
|
+
function createDraggableData(draggable, coreData) {
|
|
3601
|
+
const scale = draggable.props.scale;
|
|
3602
|
+
return {
|
|
3603
|
+
node: coreData.node,
|
|
3604
|
+
x: draggable.state.x + coreData.deltaX / scale,
|
|
3605
|
+
y: draggable.state.y + coreData.deltaY / scale,
|
|
3606
|
+
deltaX: coreData.deltaX / scale,
|
|
3607
|
+
deltaY: coreData.deltaY / scale,
|
|
3608
|
+
lastX: draggable.state.x,
|
|
3609
|
+
lastY: draggable.state.y
|
|
3610
|
+
};
|
|
3611
|
+
}
|
|
3612
|
+
function cloneBounds(bounds) {
|
|
3613
|
+
return {
|
|
3614
|
+
left: bounds.left,
|
|
3615
|
+
top: bounds.top,
|
|
3616
|
+
right: bounds.right,
|
|
3617
|
+
bottom: bounds.bottom
|
|
3618
|
+
};
|
|
3619
|
+
}
|
|
3620
|
+
function findDOMNode(draggable) {
|
|
3621
|
+
const node = draggable.findDOMNode();
|
|
3622
|
+
if (!node) {
|
|
3623
|
+
throw new Error("<DraggableCore>: Unmounted during event!");
|
|
3624
|
+
}
|
|
3625
|
+
return node;
|
|
3626
|
+
}
|
|
3794
3627
|
|
|
3795
|
-
|
|
3628
|
+
// lib/utils/log.ts
|
|
3629
|
+
var log = typeof process !== "undefined" && process.env.DRAGGABLE_DEBUG ? console.log.bind(console) : function noop() {
|
|
3630
|
+
};
|
|
3631
|
+
var log_default = log;
|
|
3632
|
+
|
|
3633
|
+
// lib/DraggableCore.tsx
|
|
3634
|
+
var eventsFor = {
|
|
3635
|
+
touch: {
|
|
3636
|
+
start: "touchstart",
|
|
3637
|
+
move: "touchmove",
|
|
3638
|
+
stop: "touchend"
|
|
3639
|
+
},
|
|
3640
|
+
mouse: {
|
|
3641
|
+
start: "mousedown",
|
|
3642
|
+
move: "mousemove",
|
|
3643
|
+
stop: "mouseup"
|
|
3644
|
+
}
|
|
3645
|
+
};
|
|
3646
|
+
var dragEventFor = eventsFor.mouse;
|
|
3647
|
+
var DraggableCore = class extends React.Component {
|
|
3648
|
+
constructor() {
|
|
3649
|
+
super(...arguments);
|
|
3650
|
+
this.dragging = false;
|
|
3651
|
+
// Used while dragging to determine deltas.
|
|
3652
|
+
this.lastX = NaN;
|
|
3653
|
+
this.lastY = NaN;
|
|
3654
|
+
this.touchIdentifier = null;
|
|
3655
|
+
this.mounted = false;
|
|
3656
|
+
this.handleDragStart = (e) => {
|
|
3657
|
+
this.props.onMouseDown(e);
|
|
3658
|
+
if (!this.props.allowAnyClick && (typeof e.button === "number" && e.button !== 0 || e.ctrlKey)) return false;
|
|
3659
|
+
const thisNode = this.findDOMNode();
|
|
3660
|
+
if (!thisNode || !thisNode.ownerDocument || !thisNode.ownerDocument.body) {
|
|
3661
|
+
throw new Error("<DraggableCore> not mounted on DragStart!");
|
|
3662
|
+
}
|
|
3663
|
+
const { ownerDocument } = thisNode;
|
|
3664
|
+
if (this.props.disabled || !(e.target instanceof ownerDocument.defaultView.Node) || this.props.handle && !matchesSelectorAndParentsTo(e.target, this.props.handle, thisNode) || this.props.cancel && matchesSelectorAndParentsTo(e.target, this.props.cancel, thisNode)) {
|
|
3665
|
+
return;
|
|
3666
|
+
}
|
|
3667
|
+
if (e.type === "touchstart" && !this.props.allowMobileScroll) e.preventDefault();
|
|
3668
|
+
const touchIdentifier = getTouchIdentifier(e);
|
|
3669
|
+
this.touchIdentifier = touchIdentifier;
|
|
3670
|
+
const position = getControlPosition(e, touchIdentifier, this);
|
|
3671
|
+
if (position == null) return;
|
|
3672
|
+
const { x, y } = position;
|
|
3673
|
+
const coreEvent = createCoreData(this, x, y);
|
|
3674
|
+
log_default("DraggableCore: handleDragStart: %j", coreEvent);
|
|
3675
|
+
log_default("calling", this.props.onStart);
|
|
3676
|
+
const shouldUpdate = this.props.onStart(e, coreEvent);
|
|
3677
|
+
if (shouldUpdate === false || this.mounted === false) return;
|
|
3678
|
+
if (this.props.enableUserSelectHack) addUserSelectStyles(ownerDocument, this.props.nonce);
|
|
3679
|
+
this.dragging = true;
|
|
3680
|
+
this.lastX = x;
|
|
3681
|
+
this.lastY = y;
|
|
3682
|
+
addEvent(ownerDocument, dragEventFor.move, this.handleDrag);
|
|
3683
|
+
addEvent(ownerDocument, dragEventFor.stop, this.handleDragStop);
|
|
3684
|
+
};
|
|
3685
|
+
this.handleDrag = (e) => {
|
|
3686
|
+
const position = getControlPosition(e, this.touchIdentifier, this);
|
|
3687
|
+
if (position == null) return;
|
|
3688
|
+
let { x, y } = position;
|
|
3689
|
+
if (Array.isArray(this.props.grid)) {
|
|
3690
|
+
let deltaX = x - this.lastX, deltaY = y - this.lastY;
|
|
3691
|
+
[deltaX, deltaY] = snapToGrid(this.props.grid, deltaX, deltaY);
|
|
3692
|
+
if (!deltaX && !deltaY) return;
|
|
3693
|
+
x = this.lastX + deltaX;
|
|
3694
|
+
y = this.lastY + deltaY;
|
|
3695
|
+
}
|
|
3696
|
+
const coreEvent = createCoreData(this, x, y);
|
|
3697
|
+
log_default("DraggableCore: handleDrag: %j", coreEvent);
|
|
3698
|
+
const shouldUpdate = this.props.onDrag(e, coreEvent);
|
|
3699
|
+
if (shouldUpdate === false || this.mounted === false) {
|
|
3700
|
+
try {
|
|
3701
|
+
this.handleDragStop(new MouseEvent("mouseup"));
|
|
3702
|
+
} catch {
|
|
3703
|
+
const event = document.createEvent("MouseEvents");
|
|
3704
|
+
event.initMouseEvent("mouseup", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
|
|
3705
|
+
this.handleDragStop(event);
|
|
3706
|
+
}
|
|
3707
|
+
return;
|
|
3708
|
+
}
|
|
3709
|
+
this.lastX = x;
|
|
3710
|
+
this.lastY = y;
|
|
3711
|
+
};
|
|
3712
|
+
this.handleDragStop = (e) => {
|
|
3713
|
+
if (!this.dragging) return;
|
|
3714
|
+
const position = getControlPosition(e, this.touchIdentifier, this);
|
|
3715
|
+
if (position == null) return;
|
|
3716
|
+
let { x, y } = position;
|
|
3717
|
+
if (Array.isArray(this.props.grid)) {
|
|
3718
|
+
let deltaX = x - this.lastX || 0;
|
|
3719
|
+
let deltaY = y - this.lastY || 0;
|
|
3720
|
+
[deltaX, deltaY] = snapToGrid(this.props.grid, deltaX, deltaY);
|
|
3721
|
+
x = this.lastX + deltaX;
|
|
3722
|
+
y = this.lastY + deltaY;
|
|
3723
|
+
}
|
|
3724
|
+
const coreEvent = createCoreData(this, x, y);
|
|
3725
|
+
const shouldContinue = this.props.onStop(e, coreEvent);
|
|
3726
|
+
if (shouldContinue === false || this.mounted === false) return false;
|
|
3727
|
+
const thisNode = this.findDOMNode();
|
|
3728
|
+
if (thisNode) {
|
|
3729
|
+
if (this.props.enableUserSelectHack) scheduleRemoveUserSelectStyles(thisNode.ownerDocument);
|
|
3730
|
+
}
|
|
3731
|
+
log_default("DraggableCore: handleDragStop: %j", coreEvent);
|
|
3732
|
+
this.dragging = false;
|
|
3733
|
+
this.lastX = NaN;
|
|
3734
|
+
this.lastY = NaN;
|
|
3735
|
+
if (thisNode) {
|
|
3736
|
+
log_default("DraggableCore: Removing handlers");
|
|
3737
|
+
removeEvent(thisNode.ownerDocument, dragEventFor.move, this.handleDrag);
|
|
3738
|
+
removeEvent(thisNode.ownerDocument, dragEventFor.stop, this.handleDragStop);
|
|
3739
|
+
}
|
|
3740
|
+
};
|
|
3741
|
+
this.onMouseDown = (e) => {
|
|
3742
|
+
dragEventFor = eventsFor.mouse;
|
|
3743
|
+
return this.handleDragStart(e);
|
|
3744
|
+
};
|
|
3745
|
+
this.onMouseUp = (e) => {
|
|
3746
|
+
dragEventFor = eventsFor.mouse;
|
|
3747
|
+
return this.handleDragStop(e);
|
|
3748
|
+
};
|
|
3749
|
+
// Same as onMouseDown (start drag), but now consider this a touch device.
|
|
3750
|
+
this.onTouchStart = (e) => {
|
|
3751
|
+
dragEventFor = eventsFor.touch;
|
|
3752
|
+
return this.handleDragStart(e);
|
|
3753
|
+
};
|
|
3754
|
+
this.onTouchEnd = (e) => {
|
|
3755
|
+
dragEventFor = eventsFor.touch;
|
|
3756
|
+
return this.handleDragStop(e);
|
|
3757
|
+
};
|
|
3758
|
+
}
|
|
3759
|
+
componentDidMount() {
|
|
3760
|
+
this.mounted = true;
|
|
3761
|
+
const thisNode = this.findDOMNode();
|
|
3762
|
+
if (thisNode) {
|
|
3763
|
+
addEvent(thisNode, eventsFor.touch.start, this.onTouchStart, { passive: false });
|
|
3764
|
+
}
|
|
3765
|
+
}
|
|
3766
|
+
componentWillUnmount() {
|
|
3767
|
+
this.mounted = false;
|
|
3768
|
+
const thisNode = this.findDOMNode();
|
|
3769
|
+
if (thisNode) {
|
|
3770
|
+
const { ownerDocument } = thisNode;
|
|
3771
|
+
removeEvent(ownerDocument, eventsFor.mouse.move, this.handleDrag);
|
|
3772
|
+
removeEvent(ownerDocument, eventsFor.touch.move, this.handleDrag);
|
|
3773
|
+
removeEvent(ownerDocument, eventsFor.mouse.stop, this.handleDragStop);
|
|
3774
|
+
removeEvent(ownerDocument, eventsFor.touch.stop, this.handleDragStop);
|
|
3775
|
+
removeEvent(thisNode, eventsFor.touch.start, this.onTouchStart, { passive: false });
|
|
3776
|
+
if (this.props.enableUserSelectHack) scheduleRemoveUserSelectStyles(ownerDocument);
|
|
3777
|
+
}
|
|
3778
|
+
}
|
|
3779
|
+
// React 19 removed ReactDOM.findDOMNode, so nodeRef is now required.
|
|
3780
|
+
// For backward compatibility with React 18 and earlier, we still support findDOMNode if available.
|
|
3781
|
+
findDOMNode() {
|
|
3782
|
+
var _a;
|
|
3783
|
+
if ((_a = this.props) == null ? void 0 : _a.nodeRef) {
|
|
3784
|
+
return this.props.nodeRef.current;
|
|
3785
|
+
}
|
|
3786
|
+
const legacyReactDOM = ReactDOM;
|
|
3787
|
+
if (typeof legacyReactDOM.findDOMNode === "function") {
|
|
3788
|
+
return legacyReactDOM.findDOMNode(this);
|
|
3789
|
+
}
|
|
3790
|
+
log_default(
|
|
3791
|
+
"react-draggable: ReactDOM.findDOMNode is not available in React 19+. You must provide a nodeRef prop. See: https://github.com/react-grid-layout/react-draggable#noderef"
|
|
3792
|
+
);
|
|
3793
|
+
return null;
|
|
3794
|
+
}
|
|
3795
|
+
render() {
|
|
3796
|
+
return React.cloneElement(React.Children.only(this.props.children), {
|
|
3797
|
+
// Note: mouseMove handler is attached to document so it will still function
|
|
3798
|
+
// when the user drags quickly and leaves the bounds of the element.
|
|
3799
|
+
onMouseDown: this.onMouseDown,
|
|
3800
|
+
onMouseUp: this.onMouseUp,
|
|
3801
|
+
// onTouchStart is added on `componentDidMount` so they can be added with
|
|
3802
|
+
// {passive: false}, which allows it to cancel. See
|
|
3803
|
+
// https://developers.google.com/web/updates/2017/01/scrolling-intervention
|
|
3804
|
+
onTouchEnd: this.onTouchEnd
|
|
3805
|
+
});
|
|
3806
|
+
}
|
|
3807
|
+
};
|
|
3808
|
+
DraggableCore.displayName = "DraggableCore";
|
|
3809
|
+
// Both the annotation and the `?` are load-bearing:
|
|
3810
|
+
// - The index-signature annotation stops tsc from inferring the
|
|
3811
|
+
// PropTypes.Requireable<...> types and emitting `import PropTypes from
|
|
3812
|
+
// 'prop-types'` into the generated public .d.ts, which would force consumers
|
|
3813
|
+
// to install @types/prop-types (the v4.5.0 hand-written typings had none).
|
|
3814
|
+
// - The `?` keeps `propTypes` from being a *required* member of the public
|
|
3815
|
+
// type. React <= 18's JSX LibraryManagedAttributes only consults a
|
|
3816
|
+
// component's `propTypes` when it is required (`C extends {propTypes: ...}`);
|
|
3817
|
+
// when it does, this index-signature `propTypes` makes `defaultProps` stop
|
|
3818
|
+
// marking props optional, so consumers are forced to pass every prop.
|
|
3819
|
+
// Optional dodges that branch; React 19 ignores `propTypes` entirely. The
|
|
3820
|
+
// typings/tsconfig.react18.json check guards against a regression here.
|
|
3821
|
+
// Do not remove. See lib/Draggable.tsx for the same guard.
|
|
3822
|
+
DraggableCore.propTypes = {
|
|
3823
|
+
/**
|
|
3824
|
+
* `allowAnyClick` allows dragging using any mouse button.
|
|
3825
|
+
* By default, we only accept the left button.
|
|
3826
|
+
*
|
|
3827
|
+
* Defaults to `false`.
|
|
3828
|
+
*/
|
|
3829
|
+
allowAnyClick: PropTypes2.bool,
|
|
3830
|
+
/**
|
|
3831
|
+
* `allowMobileScroll` turns off cancellation of the 'touchstart' event
|
|
3832
|
+
* on mobile devices. Only enable this if you are having trouble with click
|
|
3833
|
+
* events. Prefer using 'handle' / 'cancel' instead.
|
|
3834
|
+
*
|
|
3835
|
+
* Defaults to `false`.
|
|
3836
|
+
*/
|
|
3837
|
+
allowMobileScroll: PropTypes2.bool,
|
|
3838
|
+
children: PropTypes2.node.isRequired,
|
|
3839
|
+
/**
|
|
3840
|
+
* `disabled`, if true, stops the <Draggable> from dragging. All handlers,
|
|
3841
|
+
* with the exception of `onMouseDown`, will not fire.
|
|
3842
|
+
*/
|
|
3843
|
+
disabled: PropTypes2.bool,
|
|
3844
|
+
/**
|
|
3845
|
+
* By default, we add 'user-select:none' attributes to the document body
|
|
3846
|
+
* to prevent ugly text selection during drag. If this is causing problems
|
|
3847
|
+
* for your app, set this to `false`.
|
|
3848
|
+
*/
|
|
3849
|
+
enableUserSelectHack: PropTypes2.bool,
|
|
3850
|
+
/**
|
|
3851
|
+
* `offsetParent`, if set, uses the passed DOM node to compute drag offsets
|
|
3852
|
+
* instead of using the parent node.
|
|
3853
|
+
*/
|
|
3854
|
+
offsetParent: function(props, propName) {
|
|
3855
|
+
if (props[propName] && props[propName].nodeType !== 1) {
|
|
3856
|
+
throw new Error("Draggable's offsetParent must be a DOM Node.");
|
|
3857
|
+
}
|
|
3858
|
+
},
|
|
3859
|
+
/**
|
|
3860
|
+
* `grid` specifies the x and y that dragging should snap to.
|
|
3861
|
+
*/
|
|
3862
|
+
grid: PropTypes2.arrayOf(PropTypes2.number),
|
|
3863
|
+
/**
|
|
3864
|
+
* `handle` specifies a selector to be used as the handle that initiates drag.
|
|
3865
|
+
*
|
|
3866
|
+
* Example:
|
|
3867
|
+
*
|
|
3868
|
+
* ```jsx
|
|
3869
|
+
* let App = React.createClass({
|
|
3870
|
+
* render: function () {
|
|
3871
|
+
* return (
|
|
3872
|
+
* <Draggable handle=".handle">
|
|
3873
|
+
* <div>
|
|
3874
|
+
* <div className="handle">Click me to drag</div>
|
|
3875
|
+
* <div>This is some other content</div>
|
|
3876
|
+
* </div>
|
|
3877
|
+
* </Draggable>
|
|
3878
|
+
* );
|
|
3879
|
+
* }
|
|
3880
|
+
* });
|
|
3881
|
+
* ```
|
|
3882
|
+
*/
|
|
3883
|
+
handle: PropTypes2.string,
|
|
3884
|
+
/**
|
|
3885
|
+
* `cancel` specifies a selector to be used to prevent drag initialization.
|
|
3886
|
+
*
|
|
3887
|
+
* Example:
|
|
3888
|
+
*
|
|
3889
|
+
* ```jsx
|
|
3890
|
+
* let App = React.createClass({
|
|
3891
|
+
* render: function () {
|
|
3892
|
+
* return(
|
|
3893
|
+
* <Draggable cancel=".cancel">
|
|
3894
|
+
* <div>
|
|
3895
|
+
* <div className="cancel">You can't drag from here</div>
|
|
3896
|
+
* <div>Dragging here works fine</div>
|
|
3897
|
+
* </div>
|
|
3898
|
+
* </Draggable>
|
|
3899
|
+
* );
|
|
3900
|
+
* }
|
|
3901
|
+
* });
|
|
3902
|
+
* ```
|
|
3903
|
+
*/
|
|
3904
|
+
cancel: PropTypes2.string,
|
|
3905
|
+
/* If running in React Strict mode, ReactDOM.findDOMNode() is deprecated.
|
|
3906
|
+
* Unfortunately, in order for <Draggable> to work properly, we need raw access
|
|
3907
|
+
* to the underlying DOM node. If you want to avoid the warning, pass a `nodeRef`
|
|
3908
|
+
* as in this example:
|
|
3909
|
+
*
|
|
3910
|
+
* function MyComponent() {
|
|
3911
|
+
* const nodeRef = React.useRef(null);
|
|
3912
|
+
* return (
|
|
3913
|
+
* <Draggable nodeRef={nodeRef}>
|
|
3914
|
+
* <div ref={nodeRef}>Example Target</div>
|
|
3915
|
+
* </Draggable>
|
|
3916
|
+
* );
|
|
3917
|
+
* }
|
|
3918
|
+
*
|
|
3919
|
+
* This can be used for arbitrarily nested components, so long as the ref ends up
|
|
3920
|
+
* pointing to the actual child DOM node and not a custom component.
|
|
3921
|
+
*/
|
|
3922
|
+
nodeRef: PropTypes2.object,
|
|
3923
|
+
/**
|
|
3924
|
+
* `nonce` is applied to the dynamically-injected <style> element used by the
|
|
3925
|
+
* user-select hack, so it isn't blocked under a strict Content Security
|
|
3926
|
+
* Policy (`style-src` without `'unsafe-inline'`). If omitted, webpack's
|
|
3927
|
+
* `__webpack_nonce__` global is used when available.
|
|
3928
|
+
*/
|
|
3929
|
+
nonce: PropTypes2.string,
|
|
3930
|
+
/**
|
|
3931
|
+
* Called when dragging starts.
|
|
3932
|
+
* If this function returns the boolean false, dragging will be canceled.
|
|
3933
|
+
*/
|
|
3934
|
+
onStart: PropTypes2.func,
|
|
3935
|
+
/**
|
|
3936
|
+
* Called while dragging.
|
|
3937
|
+
* If this function returns the boolean false, dragging will be canceled.
|
|
3938
|
+
*/
|
|
3939
|
+
onDrag: PropTypes2.func,
|
|
3940
|
+
/**
|
|
3941
|
+
* Called when dragging stops.
|
|
3942
|
+
* If this function returns the boolean false, the drag will remain active.
|
|
3943
|
+
*/
|
|
3944
|
+
onStop: PropTypes2.func,
|
|
3945
|
+
/**
|
|
3946
|
+
* A workaround option which can be passed if onMouseDown needs to be accessed,
|
|
3947
|
+
* since it'll always be blocked (as there is internal use of onMouseDown)
|
|
3948
|
+
*/
|
|
3949
|
+
onMouseDown: PropTypes2.func,
|
|
3950
|
+
/**
|
|
3951
|
+
* `scale`, if set, applies scaling while dragging an element
|
|
3952
|
+
*/
|
|
3953
|
+
scale: PropTypes2.number,
|
|
3954
|
+
/**
|
|
3955
|
+
* These properties should be defined on the child, not here.
|
|
3956
|
+
*/
|
|
3957
|
+
className: dontSetMe,
|
|
3958
|
+
style: dontSetMe,
|
|
3959
|
+
transform: dontSetMe
|
|
3960
|
+
};
|
|
3961
|
+
// Typed as the full `DraggableCoreProps` (not just the default-provided subset)
|
|
3962
|
+
// so React's JSX LibraryManagedAttributes treats EVERY prop as optional for
|
|
3963
|
+
// consumers, matching the historical hand-written typings. At runtime only the
|
|
3964
|
+
// default-able props are actually populated.
|
|
3965
|
+
DraggableCore.defaultProps = {
|
|
3966
|
+
allowAnyClick: false,
|
|
3967
|
+
// by default only accept left click
|
|
3968
|
+
allowMobileScroll: false,
|
|
3969
|
+
disabled: false,
|
|
3970
|
+
enableUserSelectHack: true,
|
|
3971
|
+
onStart: function() {
|
|
3972
|
+
},
|
|
3973
|
+
onDrag: function() {
|
|
3974
|
+
},
|
|
3975
|
+
onStop: function() {
|
|
3976
|
+
},
|
|
3977
|
+
onMouseDown: function() {
|
|
3978
|
+
},
|
|
3979
|
+
scale: 1
|
|
3980
|
+
};
|
|
3796
3981
|
|
|
3797
|
-
|
|
3798
|
-
|
|
3799
|
-
|
|
3800
|
-
|
|
3801
|
-
|
|
3802
|
-
|
|
3803
|
-
|
|
3804
|
-
|
|
3805
|
-
|
|
3806
|
-
|
|
3807
|
-
|
|
3808
|
-
|
|
3809
|
-
|
|
3810
|
-
|
|
3811
|
-
|
|
3812
|
-
|
|
3813
|
-
|
|
3814
|
-
|
|
3815
|
-
|
|
3816
|
-
|
|
3817
|
-
|
|
3818
|
-
|
|
3819
|
-
|
|
3820
|
-
|
|
3821
|
-
|
|
3822
|
-
|
|
3823
|
-
|
|
3824
|
-
|
|
3825
|
-
|
|
3826
|
-
|
|
3827
|
-
|
|
3828
|
-
|
|
3829
|
-
|
|
3830
|
-
|
|
3831
|
-
|
|
3832
|
-
|
|
3833
|
-
|
|
3834
|
-
|
|
3835
|
-
|
|
3836
|
-
|
|
3837
|
-
|
|
3838
|
-
|
|
3839
|
-
|
|
3840
|
-
|
|
3841
|
-
|
|
3842
|
-
|
|
3843
|
-
|
|
3844
|
-
|
|
3845
|
-
|
|
3846
|
-
|
|
3847
|
-
|
|
3848
|
-
|
|
3849
|
-
|
|
3850
|
-
|
|
3851
|
-
|
|
3852
|
-
|
|
3853
|
-
|
|
3854
|
-
|
|
3855
|
-
|
|
3856
|
-
|
|
3857
|
-
|
|
3858
|
-
|
|
3859
|
-
|
|
3860
|
-
|
|
3861
|
-
|
|
3862
|
-
|
|
3863
|
-
|
|
3864
|
-
|
|
3865
|
-
|
|
3866
|
-
|
|
3867
|
-
|
|
3868
|
-
|
|
3869
|
-
|
|
3870
|
-
|
|
3871
|
-
|
|
3872
|
-
|
|
3873
|
-
|
|
3874
|
-
|
|
3875
|
-
|
|
3876
|
-
|
|
3877
|
-
|
|
3878
|
-
|
|
3879
|
-
|
|
3880
|
-
|
|
3881
|
-
|
|
3882
|
-
|
|
3883
|
-
|
|
3884
|
-
|
|
3885
|
-
|
|
3886
|
-
|
|
3887
|
-
|
|
3888
|
-
|
|
3889
|
-
|
|
3890
|
-
|
|
3891
|
-
|
|
3892
|
-
|
|
3893
|
-
|
|
3894
|
-
|
|
3895
|
-
|
|
3896
|
-
|
|
3897
|
-
|
|
3898
|
-
|
|
3899
|
-
|
|
3900
|
-
|
|
3901
|
-
|
|
3902
|
-
|
|
3903
|
-
|
|
3904
|
-
|
|
3905
|
-
|
|
3906
|
-
|
|
3907
|
-
|
|
3908
|
-
|
|
3909
|
-
|
|
3910
|
-
|
|
3911
|
-
|
|
3912
|
-
|
|
3913
|
-
|
|
3914
|
-
|
|
3915
|
-
|
|
3916
|
-
|
|
3917
|
-
|
|
3918
|
-
|
|
3919
|
-
|
|
3920
|
-
|
|
3921
|
-
|
|
3922
|
-
|
|
3923
|
-
|
|
3924
|
-
|
|
3925
|
-
|
|
3926
|
-
|
|
3927
|
-
|
|
3928
|
-
|
|
3929
|
-
|
|
3930
|
-
|
|
3931
|
-
|
|
3932
|
-
|
|
3933
|
-
|
|
3934
|
-
|
|
3935
|
-
|
|
3936
|
-
|
|
3937
|
-
|
|
3938
|
-
|
|
3939
|
-
|
|
3940
|
-
|
|
3941
|
-
|
|
3942
|
-
|
|
3943
|
-
|
|
3944
|
-
|
|
3945
|
-
|
|
3946
|
-
|
|
3947
|
-
|
|
3948
|
-
|
|
3949
|
-
|
|
3950
|
-
|
|
3951
|
-
|
|
3952
|
-
|
|
3953
|
-
|
|
3954
|
-
|
|
3955
|
-
|
|
3956
|
-
|
|
3957
|
-
|
|
3958
|
-
|
|
3959
|
-
|
|
3960
|
-
|
|
3961
|
-
|
|
3962
|
-
|
|
3963
|
-
|
|
3964
|
-
|
|
3965
|
-
|
|
3966
|
-
|
|
3967
|
-
|
|
3968
|
-
|
|
3969
|
-
|
|
3970
|
-
|
|
3971
|
-
|
|
3972
|
-
|
|
3973
|
-
|
|
3974
|
-
|
|
3975
|
-
|
|
3976
|
-
|
|
3977
|
-
|
|
3978
|
-
|
|
3979
|
-
|
|
3980
|
-
|
|
3981
|
-
|
|
3982
|
-
|
|
3983
|
-
|
|
3984
|
-
|
|
3985
|
-
|
|
3986
|
-
|
|
3987
|
-
|
|
3988
|
-
|
|
3989
|
-
|
|
3990
|
-
|
|
3991
|
-
|
|
3992
|
-
|
|
3993
|
-
|
|
3994
|
-
|
|
3995
|
-
|
|
3996
|
-
|
|
3997
|
-
|
|
3998
|
-
|
|
3999
|
-
|
|
4000
|
-
|
|
4001
|
-
|
|
4002
|
-
|
|
4003
|
-
|
|
4004
|
-
|
|
4005
|
-
|
|
4006
|
-
|
|
4007
|
-
|
|
4008
|
-
|
|
4009
|
-
|
|
4010
|
-
|
|
4011
|
-
|
|
4012
|
-
|
|
4013
|
-
|
|
4014
|
-
|
|
4015
|
-
|
|
4016
|
-
|
|
4017
|
-
|
|
4018
|
-
|
|
4019
|
-
|
|
4020
|
-
|
|
4021
|
-
|
|
4022
|
-
|
|
4023
|
-
|
|
4024
|
-
|
|
4025
|
-
|
|
4026
|
-
|
|
4027
|
-
|
|
4028
|
-
|
|
4029
|
-
|
|
4030
|
-
|
|
4031
|
-
|
|
4032
|
-
|
|
4033
|
-
|
|
4034
|
-
|
|
4035
|
-
|
|
4036
|
-
|
|
4037
|
-
|
|
4038
|
-
|
|
4039
|
-
|
|
4040
|
-
|
|
4041
|
-
|
|
4042
|
-
|
|
4043
|
-
|
|
4044
|
-
|
|
4045
|
-
|
|
4046
|
-
|
|
4047
|
-
|
|
4048
|
-
|
|
4049
|
-
|
|
4050
|
-
|
|
4051
|
-
|
|
4052
|
-
|
|
4053
|
-
|
|
4054
|
-
|
|
4055
|
-
|
|
4056
|
-
|
|
4057
|
-
|
|
4058
|
-
|
|
4059
|
-
|
|
4060
|
-
|
|
4061
|
-
|
|
4062
|
-
|
|
4063
|
-
|
|
4064
|
-
|
|
4065
|
-
|
|
4066
|
-
|
|
4067
|
-
|
|
4068
|
-
|
|
4069
|
-
|
|
4070
|
-
|
|
4071
|
-
|
|
4072
|
-
|
|
4073
|
-
|
|
4074
|
-
|
|
4075
|
-
|
|
4076
|
-
|
|
4077
|
-
|
|
4078
|
-
|
|
4079
|
-
|
|
4080
|
-
|
|
4081
|
-
|
|
4082
|
-
|
|
4083
|
-
|
|
4084
|
-
|
|
4085
|
-
|
|
4086
|
-
|
|
4087
|
-
|
|
4088
|
-
|
|
4089
|
-
|
|
4090
|
-
|
|
4091
|
-
|
|
4092
|
-
|
|
4093
|
-
* );
|
|
4094
|
-
* }
|
|
4095
|
-
* });
|
|
4096
|
-
* ```
|
|
4097
|
-
*/
|
|
4098
|
-
handle: _propTypes.default.string,
|
|
4099
|
-
/**
|
|
4100
|
-
* `cancel` specifies a selector to be used to prevent drag initialization.
|
|
4101
|
-
*
|
|
4102
|
-
* Example:
|
|
4103
|
-
*
|
|
4104
|
-
* ```jsx
|
|
4105
|
-
* let App = React.createClass({
|
|
4106
|
-
* render: function () {
|
|
4107
|
-
* return(
|
|
4108
|
-
* <Draggable cancel=".cancel">
|
|
4109
|
-
* <div>
|
|
4110
|
-
* <div className="cancel">You can't drag from here</div>
|
|
4111
|
-
* <div>Dragging here works fine</div>
|
|
4112
|
-
* </div>
|
|
4113
|
-
* </Draggable>
|
|
4114
|
-
* );
|
|
4115
|
-
* }
|
|
4116
|
-
* });
|
|
4117
|
-
* ```
|
|
4118
|
-
*/
|
|
4119
|
-
cancel: _propTypes.default.string,
|
|
4120
|
-
/* If running in React Strict mode, ReactDOM.findDOMNode() is deprecated.
|
|
4121
|
-
* Unfortunately, in order for <Draggable> to work properly, we need raw access
|
|
4122
|
-
* to the underlying DOM node. If you want to avoid the warning, pass a `nodeRef`
|
|
4123
|
-
* as in this example:
|
|
4124
|
-
*
|
|
4125
|
-
* function MyComponent() {
|
|
4126
|
-
* const nodeRef = React.useRef(null);
|
|
4127
|
-
* return (
|
|
4128
|
-
* <Draggable nodeRef={nodeRef}>
|
|
4129
|
-
* <div ref={nodeRef}>Example Target</div>
|
|
4130
|
-
* </Draggable>
|
|
4131
|
-
* );
|
|
4132
|
-
* }
|
|
4133
|
-
*
|
|
4134
|
-
* This can be used for arbitrarily nested components, so long as the ref ends up
|
|
4135
|
-
* pointing to the actual child DOM node and not a custom component.
|
|
4136
|
-
*/
|
|
4137
|
-
nodeRef: _propTypes.default.object,
|
|
4138
|
-
/**
|
|
4139
|
-
* Called when dragging starts.
|
|
4140
|
-
* If this function returns the boolean false, dragging will be canceled.
|
|
4141
|
-
*/
|
|
4142
|
-
onStart: _propTypes.default.func,
|
|
4143
|
-
/**
|
|
4144
|
-
* Called while dragging.
|
|
4145
|
-
* If this function returns the boolean false, dragging will be canceled.
|
|
4146
|
-
*/
|
|
4147
|
-
onDrag: _propTypes.default.func,
|
|
4148
|
-
/**
|
|
4149
|
-
* Called when dragging stops.
|
|
4150
|
-
* If this function returns the boolean false, the drag will remain active.
|
|
4151
|
-
*/
|
|
4152
|
-
onStop: _propTypes.default.func,
|
|
4153
|
-
/**
|
|
4154
|
-
* A workaround option which can be passed if onMouseDown needs to be accessed,
|
|
4155
|
-
* since it'll always be blocked (as there is internal use of onMouseDown)
|
|
4156
|
-
*/
|
|
4157
|
-
onMouseDown: _propTypes.default.func,
|
|
4158
|
-
/**
|
|
4159
|
-
* `scale`, if set, applies scaling while dragging an element
|
|
4160
|
-
*/
|
|
4161
|
-
scale: _propTypes.default.number,
|
|
4162
|
-
/**
|
|
4163
|
-
* These properties should be defined on the child, not here.
|
|
4164
|
-
*/
|
|
4165
|
-
className: _shims.dontSetMe,
|
|
4166
|
-
style: _shims.dontSetMe,
|
|
4167
|
-
transform: _shims.dontSetMe
|
|
4168
|
-
});
|
|
4169
|
-
_defineProperty(DraggableCore$1, "defaultProps", {
|
|
4170
|
-
allowAnyClick: false,
|
|
4171
|
-
// by default only accept left click
|
|
4172
|
-
allowMobileScroll: false,
|
|
4173
|
-
disabled: false,
|
|
4174
|
-
enableUserSelectHack: true,
|
|
4175
|
-
onStart: function() {
|
|
4176
|
-
},
|
|
4177
|
-
onDrag: function() {
|
|
4178
|
-
},
|
|
4179
|
-
onStop: function() {
|
|
4180
|
-
},
|
|
4181
|
-
onMouseDown: function() {
|
|
4182
|
-
},
|
|
4183
|
-
scale: 1
|
|
4184
|
-
});
|
|
4185
|
-
return DraggableCore;
|
|
4186
|
-
}
|
|
4187
|
-
|
|
4188
|
-
var hasRequiredDraggable;
|
|
4189
|
-
|
|
4190
|
-
function requireDraggable () {
|
|
4191
|
-
if (hasRequiredDraggable) return Draggable$1;
|
|
4192
|
-
hasRequiredDraggable = 1;
|
|
4193
|
-
(function (exports) {
|
|
4194
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4195
|
-
value: true
|
|
4196
|
-
});
|
|
4197
|
-
Object.defineProperty(exports, "DraggableCore", {
|
|
4198
|
-
enumerable: true,
|
|
4199
|
-
get: function() {
|
|
4200
|
-
return _DraggableCore.default;
|
|
4201
|
-
}
|
|
4202
|
-
});
|
|
4203
|
-
exports.default = void 0;
|
|
4204
|
-
var React = _interopRequireWildcard(React__default);
|
|
4205
|
-
var _propTypes = _interopRequireDefault(/*@__PURE__*/ requirePropTypes());
|
|
4206
|
-
var _reactDom = _interopRequireDefault(require$$2);
|
|
4207
|
-
var _clsx = requireClsx();
|
|
4208
|
-
var _domFns = requireDomFns();
|
|
4209
|
-
var _positionFns = requirePositionFns();
|
|
4210
|
-
var _shims = requireShims();
|
|
4211
|
-
var _DraggableCore = _interopRequireDefault(requireDraggableCore());
|
|
4212
|
-
var _log = _interopRequireDefault(requireLog());
|
|
4213
|
-
function _interopRequireDefault(e) {
|
|
4214
|
-
return e && e.__esModule ? e : { default: e };
|
|
4215
|
-
}
|
|
4216
|
-
function _interopRequireWildcard(e, t) {
|
|
4217
|
-
if ("function" == typeof WeakMap) var r = /* @__PURE__ */ new WeakMap(), n = /* @__PURE__ */ new WeakMap();
|
|
4218
|
-
return (_interopRequireWildcard = function(e2, t2) {
|
|
4219
|
-
if (!t2 && e2 && e2.__esModule) return e2;
|
|
4220
|
-
var o, i, f = { __proto__: null, default: e2 };
|
|
4221
|
-
if (null === e2 || "object" != typeof e2 && "function" != typeof e2) return f;
|
|
4222
|
-
if (o = t2 ? n : r) {
|
|
4223
|
-
if (o.has(e2)) return o.get(e2);
|
|
4224
|
-
o.set(e2, f);
|
|
4225
|
-
}
|
|
4226
|
-
for (const t3 in e2) "default" !== t3 && {}.hasOwnProperty.call(e2, t3) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e2, t3)) && (i.get || i.set) ? o(f, t3, i) : f[t3] = e2[t3]);
|
|
4227
|
-
return f;
|
|
4228
|
-
})(e, t);
|
|
4229
|
-
}
|
|
4230
|
-
function _extends() {
|
|
4231
|
-
return _extends = Object.assign ? Object.assign.bind() : function(n) {
|
|
4232
|
-
for (var e = 1; e < arguments.length; e++) {
|
|
4233
|
-
var t = arguments[e];
|
|
4234
|
-
for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
|
|
4235
|
-
}
|
|
4236
|
-
return n;
|
|
4237
|
-
}, _extends.apply(null, arguments);
|
|
4238
|
-
}
|
|
4239
|
-
function _defineProperty(e, r, t) {
|
|
4240
|
-
return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
4241
|
-
}
|
|
4242
|
-
function _toPropertyKey(t) {
|
|
4243
|
-
var i = _toPrimitive(t, "string");
|
|
4244
|
-
return "symbol" == typeof i ? i : i + "";
|
|
4245
|
-
}
|
|
4246
|
-
function _toPrimitive(t, r) {
|
|
4247
|
-
if ("object" != typeof t || !t) return t;
|
|
4248
|
-
var e = t[Symbol.toPrimitive];
|
|
4249
|
-
if (void 0 !== e) {
|
|
4250
|
-
var i = e.call(t, r);
|
|
4251
|
-
if ("object" != typeof i) return i;
|
|
4252
|
-
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
4253
|
-
}
|
|
4254
|
-
return ("string" === r ? String : Number)(t);
|
|
4255
|
-
}
|
|
4256
|
-
class Draggable extends React.Component {
|
|
4257
|
-
// React 16.3+
|
|
4258
|
-
// Arity (props, state)
|
|
4259
|
-
static getDerivedStateFromProps(_ref, _ref2) {
|
|
4260
|
-
let {
|
|
4261
|
-
position
|
|
4262
|
-
} = _ref;
|
|
4263
|
-
let {
|
|
4264
|
-
prevPropsPosition
|
|
4265
|
-
} = _ref2;
|
|
4266
|
-
if (position && (!prevPropsPosition || position.x !== prevPropsPosition.x || position.y !== prevPropsPosition.y)) {
|
|
4267
|
-
(0, _log.default)("Draggable: getDerivedStateFromProps %j", {
|
|
4268
|
-
position,
|
|
4269
|
-
prevPropsPosition
|
|
4270
|
-
});
|
|
4271
|
-
return {
|
|
4272
|
-
x: position.x,
|
|
4273
|
-
y: position.y,
|
|
4274
|
-
prevPropsPosition: {
|
|
4275
|
-
...position
|
|
4276
|
-
}
|
|
4277
|
-
};
|
|
4278
|
-
}
|
|
4279
|
-
return null;
|
|
4280
|
-
}
|
|
4281
|
-
constructor(props) {
|
|
4282
|
-
super(props);
|
|
4283
|
-
_defineProperty(this, "onDragStart", (e, coreData) => {
|
|
4284
|
-
(0, _log.default)("Draggable: onDragStart: %j", coreData);
|
|
4285
|
-
const shouldStart = this.props.onStart(e, (0, _positionFns.createDraggableData)(this, coreData));
|
|
4286
|
-
if (shouldStart === false) return false;
|
|
4287
|
-
this.setState({
|
|
4288
|
-
dragging: true,
|
|
4289
|
-
dragged: true
|
|
4290
|
-
});
|
|
4291
|
-
});
|
|
4292
|
-
_defineProperty(this, "onDrag", (e, coreData) => {
|
|
4293
|
-
if (!this.state.dragging) return false;
|
|
4294
|
-
(0, _log.default)("Draggable: onDrag: %j", coreData);
|
|
4295
|
-
const uiData = (0, _positionFns.createDraggableData)(this, coreData);
|
|
4296
|
-
const newState = {
|
|
4297
|
-
x: uiData.x,
|
|
4298
|
-
y: uiData.y,
|
|
4299
|
-
slackX: 0,
|
|
4300
|
-
slackY: 0
|
|
4301
|
-
};
|
|
4302
|
-
if (this.props.bounds) {
|
|
4303
|
-
const {
|
|
4304
|
-
x,
|
|
4305
|
-
y
|
|
4306
|
-
} = newState;
|
|
4307
|
-
newState.x += this.state.slackX;
|
|
4308
|
-
newState.y += this.state.slackY;
|
|
4309
|
-
const [newStateX, newStateY] = (0, _positionFns.getBoundPosition)(this, newState.x, newState.y);
|
|
4310
|
-
newState.x = newStateX;
|
|
4311
|
-
newState.y = newStateY;
|
|
4312
|
-
newState.slackX = this.state.slackX + (x - newState.x);
|
|
4313
|
-
newState.slackY = this.state.slackY + (y - newState.y);
|
|
4314
|
-
uiData.x = newState.x;
|
|
4315
|
-
uiData.y = newState.y;
|
|
4316
|
-
uiData.deltaX = newState.x - this.state.x;
|
|
4317
|
-
uiData.deltaY = newState.y - this.state.y;
|
|
4318
|
-
}
|
|
4319
|
-
const shouldUpdate = this.props.onDrag(e, uiData);
|
|
4320
|
-
if (shouldUpdate === false) return false;
|
|
4321
|
-
this.setState(newState);
|
|
4322
|
-
});
|
|
4323
|
-
_defineProperty(this, "onDragStop", (e, coreData) => {
|
|
4324
|
-
if (!this.state.dragging) return false;
|
|
4325
|
-
const shouldContinue = this.props.onStop(e, (0, _positionFns.createDraggableData)(this, coreData));
|
|
4326
|
-
if (shouldContinue === false) return false;
|
|
4327
|
-
(0, _log.default)("Draggable: onDragStop: %j", coreData);
|
|
4328
|
-
const newState = {
|
|
4329
|
-
dragging: false,
|
|
4330
|
-
slackX: 0,
|
|
4331
|
-
slackY: 0
|
|
4332
|
-
};
|
|
4333
|
-
const controlled = Boolean(this.props.position);
|
|
4334
|
-
if (controlled) {
|
|
4335
|
-
const {
|
|
4336
|
-
x,
|
|
4337
|
-
y
|
|
4338
|
-
} = this.props.position;
|
|
4339
|
-
newState.x = x;
|
|
4340
|
-
newState.y = y;
|
|
4341
|
-
}
|
|
4342
|
-
this.setState(newState);
|
|
4343
|
-
});
|
|
4344
|
-
this.state = {
|
|
4345
|
-
// Whether or not we are currently dragging.
|
|
4346
|
-
dragging: false,
|
|
4347
|
-
// Whether or not we have been dragged before.
|
|
4348
|
-
dragged: false,
|
|
4349
|
-
// Current transform x and y.
|
|
4350
|
-
x: props.position ? props.position.x : props.defaultPosition.x,
|
|
4351
|
-
y: props.position ? props.position.y : props.defaultPosition.y,
|
|
4352
|
-
prevPropsPosition: {
|
|
4353
|
-
...props.position
|
|
4354
|
-
},
|
|
4355
|
-
// Used for compensating for out-of-bounds drags
|
|
4356
|
-
slackX: 0,
|
|
4357
|
-
slackY: 0,
|
|
4358
|
-
// Can only determine if SVG after mounting
|
|
4359
|
-
isElementSVG: false
|
|
4360
|
-
};
|
|
4361
|
-
if (props.position && !(props.onDrag || props.onStop)) {
|
|
4362
|
-
console.warn("A `position` was applied to this <Draggable>, without drag handlers. This will make this component effectively undraggable. Please attach `onDrag` or `onStop` handlers so you can adjust the `position` of this element.");
|
|
4363
|
-
}
|
|
4364
|
-
}
|
|
4365
|
-
componentDidMount() {
|
|
4366
|
-
if (typeof window.SVGElement !== "undefined" && this.findDOMNode() instanceof window.SVGElement) {
|
|
4367
|
-
this.setState({
|
|
4368
|
-
isElementSVG: true
|
|
4369
|
-
});
|
|
4370
|
-
}
|
|
4371
|
-
}
|
|
4372
|
-
componentWillUnmount() {
|
|
4373
|
-
if (this.state.dragging) {
|
|
4374
|
-
this.setState({
|
|
4375
|
-
dragging: false
|
|
4376
|
-
});
|
|
4377
|
-
}
|
|
4378
|
-
}
|
|
4379
|
-
// React Strict Mode compatibility: if `nodeRef` is passed, we will use it instead of trying to find
|
|
4380
|
-
// the underlying DOM node ourselves. See the README for more information.
|
|
4381
|
-
findDOMNode() {
|
|
4382
|
-
return this.props?.nodeRef?.current ?? _reactDom.default.findDOMNode(this);
|
|
4383
|
-
}
|
|
4384
|
-
render() {
|
|
4385
|
-
const {
|
|
4386
|
-
axis,
|
|
4387
|
-
bounds,
|
|
4388
|
-
children,
|
|
4389
|
-
defaultPosition,
|
|
4390
|
-
defaultClassName,
|
|
4391
|
-
defaultClassNameDragging,
|
|
4392
|
-
defaultClassNameDragged,
|
|
4393
|
-
position,
|
|
4394
|
-
positionOffset,
|
|
4395
|
-
scale,
|
|
4396
|
-
...draggableCoreProps
|
|
4397
|
-
} = this.props;
|
|
4398
|
-
let style = {};
|
|
4399
|
-
let svgTransform = null;
|
|
4400
|
-
const controlled = Boolean(position);
|
|
4401
|
-
const draggable = !controlled || this.state.dragging;
|
|
4402
|
-
const validPosition = position || defaultPosition;
|
|
4403
|
-
const transformOpts = {
|
|
4404
|
-
// Set left if horizontal drag is enabled
|
|
4405
|
-
x: (0, _positionFns.canDragX)(this) && draggable ? this.state.x : validPosition.x,
|
|
4406
|
-
// Set top if vertical drag is enabled
|
|
4407
|
-
y: (0, _positionFns.canDragY)(this) && draggable ? this.state.y : validPosition.y
|
|
4408
|
-
};
|
|
4409
|
-
if (this.state.isElementSVG) {
|
|
4410
|
-
svgTransform = (0, _domFns.createSVGTransform)(transformOpts, positionOffset);
|
|
4411
|
-
} else {
|
|
4412
|
-
style = (0, _domFns.createCSSTransform)(transformOpts, positionOffset);
|
|
4413
|
-
}
|
|
4414
|
-
const className = (0, _clsx.clsx)(children.props.className || "", defaultClassName, {
|
|
4415
|
-
[defaultClassNameDragging]: this.state.dragging,
|
|
4416
|
-
[defaultClassNameDragged]: this.state.dragged
|
|
4417
|
-
});
|
|
4418
|
-
return /* @__PURE__ */ React.createElement(_DraggableCore.default, _extends({}, draggableCoreProps, {
|
|
4419
|
-
onStart: this.onDragStart,
|
|
4420
|
-
onDrag: this.onDrag,
|
|
4421
|
-
onStop: this.onDragStop
|
|
4422
|
-
}), /* @__PURE__ */ React.cloneElement(React.Children.only(children), {
|
|
4423
|
-
className,
|
|
4424
|
-
style: {
|
|
4425
|
-
...children.props.style,
|
|
4426
|
-
...style
|
|
4427
|
-
},
|
|
4428
|
-
transform: svgTransform
|
|
4429
|
-
}));
|
|
4430
|
-
}
|
|
4431
|
-
}
|
|
4432
|
-
exports.default = Draggable;
|
|
4433
|
-
_defineProperty(Draggable, "displayName", "Draggable");
|
|
4434
|
-
_defineProperty(Draggable, "propTypes", {
|
|
4435
|
-
// Accepts all props <DraggableCore> accepts.
|
|
4436
|
-
..._DraggableCore.default.propTypes,
|
|
4437
|
-
/**
|
|
4438
|
-
* `axis` determines which axis the draggable can move.
|
|
4439
|
-
*
|
|
4440
|
-
* Note that all callbacks will still return data as normal. This only
|
|
4441
|
-
* controls flushing to the DOM.
|
|
4442
|
-
*
|
|
4443
|
-
* 'both' allows movement horizontally and vertically.
|
|
4444
|
-
* 'x' limits movement to horizontal axis.
|
|
4445
|
-
* 'y' limits movement to vertical axis.
|
|
4446
|
-
* 'none' limits all movement.
|
|
4447
|
-
*
|
|
4448
|
-
* Defaults to 'both'.
|
|
4449
|
-
*/
|
|
4450
|
-
axis: _propTypes.default.oneOf(["both", "x", "y", "none"]),
|
|
4451
|
-
/**
|
|
4452
|
-
* `bounds` determines the range of movement available to the element.
|
|
4453
|
-
* Available values are:
|
|
4454
|
-
*
|
|
4455
|
-
* 'parent' restricts movement within the Draggable's parent node.
|
|
4456
|
-
*
|
|
4457
|
-
* Alternatively, pass an object with the following properties, all of which are optional:
|
|
4458
|
-
*
|
|
4459
|
-
* {left: LEFT_BOUND, right: RIGHT_BOUND, bottom: BOTTOM_BOUND, top: TOP_BOUND}
|
|
4460
|
-
*
|
|
4461
|
-
* All values are in px.
|
|
4462
|
-
*
|
|
4463
|
-
* Example:
|
|
4464
|
-
*
|
|
4465
|
-
* ```jsx
|
|
4466
|
-
* let App = React.createClass({
|
|
4467
|
-
* render: function () {
|
|
4468
|
-
* return (
|
|
4469
|
-
* <Draggable bounds={{right: 300, bottom: 300}}>
|
|
4470
|
-
* <div>Content</div>
|
|
4471
|
-
* </Draggable>
|
|
4472
|
-
* );
|
|
4473
|
-
* }
|
|
4474
|
-
* });
|
|
4475
|
-
* ```
|
|
4476
|
-
*/
|
|
4477
|
-
bounds: _propTypes.default.oneOfType([_propTypes.default.shape({
|
|
4478
|
-
left: _propTypes.default.number,
|
|
4479
|
-
right: _propTypes.default.number,
|
|
4480
|
-
top: _propTypes.default.number,
|
|
4481
|
-
bottom: _propTypes.default.number
|
|
4482
|
-
}), _propTypes.default.string, _propTypes.default.oneOf([false])]),
|
|
4483
|
-
defaultClassName: _propTypes.default.string,
|
|
4484
|
-
defaultClassNameDragging: _propTypes.default.string,
|
|
4485
|
-
defaultClassNameDragged: _propTypes.default.string,
|
|
4486
|
-
/**
|
|
4487
|
-
* `defaultPosition` specifies the x and y that the dragged item should start at
|
|
4488
|
-
*
|
|
4489
|
-
* Example:
|
|
4490
|
-
*
|
|
4491
|
-
* ```jsx
|
|
4492
|
-
* let App = React.createClass({
|
|
4493
|
-
* render: function () {
|
|
4494
|
-
* return (
|
|
4495
|
-
* <Draggable defaultPosition={{x: 25, y: 25}}>
|
|
4496
|
-
* <div>I start with transformX: 25px and transformY: 25px;</div>
|
|
4497
|
-
* </Draggable>
|
|
4498
|
-
* );
|
|
4499
|
-
* }
|
|
4500
|
-
* });
|
|
4501
|
-
* ```
|
|
4502
|
-
*/
|
|
4503
|
-
defaultPosition: _propTypes.default.shape({
|
|
4504
|
-
x: _propTypes.default.number,
|
|
4505
|
-
y: _propTypes.default.number
|
|
4506
|
-
}),
|
|
4507
|
-
positionOffset: _propTypes.default.shape({
|
|
4508
|
-
x: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
|
|
4509
|
-
y: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string])
|
|
4510
|
-
}),
|
|
4511
|
-
/**
|
|
4512
|
-
* `position`, if present, defines the current position of the element.
|
|
4513
|
-
*
|
|
4514
|
-
* This is similar to how form elements in React work - if no `position` is supplied, the component
|
|
4515
|
-
* is uncontrolled.
|
|
4516
|
-
*
|
|
4517
|
-
* Example:
|
|
4518
|
-
*
|
|
4519
|
-
* ```jsx
|
|
4520
|
-
* let App = React.createClass({
|
|
4521
|
-
* render: function () {
|
|
4522
|
-
* return (
|
|
4523
|
-
* <Draggable position={{x: 25, y: 25}}>
|
|
4524
|
-
* <div>I start with transformX: 25px and transformY: 25px;</div>
|
|
4525
|
-
* </Draggable>
|
|
4526
|
-
* );
|
|
4527
|
-
* }
|
|
4528
|
-
* });
|
|
4529
|
-
* ```
|
|
4530
|
-
*/
|
|
4531
|
-
position: _propTypes.default.shape({
|
|
4532
|
-
x: _propTypes.default.number,
|
|
4533
|
-
y: _propTypes.default.number
|
|
4534
|
-
}),
|
|
4535
|
-
/**
|
|
4536
|
-
* These properties should be defined on the child, not here.
|
|
4537
|
-
*/
|
|
4538
|
-
className: _shims.dontSetMe,
|
|
4539
|
-
style: _shims.dontSetMe,
|
|
4540
|
-
transform: _shims.dontSetMe
|
|
4541
|
-
});
|
|
4542
|
-
_defineProperty(Draggable, "defaultProps", {
|
|
4543
|
-
..._DraggableCore.default.defaultProps,
|
|
4544
|
-
axis: "both",
|
|
4545
|
-
bounds: false,
|
|
4546
|
-
defaultClassName: "react-draggable",
|
|
4547
|
-
defaultClassNameDragging: "react-draggable-dragging",
|
|
4548
|
-
defaultClassNameDragged: "react-draggable-dragged",
|
|
4549
|
-
defaultPosition: {
|
|
4550
|
-
x: 0,
|
|
4551
|
-
y: 0
|
|
4552
|
-
},
|
|
4553
|
-
scale: 1
|
|
4554
|
-
});
|
|
4555
|
-
} (Draggable$1));
|
|
4556
|
-
return Draggable$1;
|
|
4557
|
-
}
|
|
4558
|
-
|
|
4559
|
-
var hasRequiredCjs;
|
|
4560
|
-
|
|
4561
|
-
function requireCjs () {
|
|
4562
|
-
if (hasRequiredCjs) return cjs.exports;
|
|
4563
|
-
hasRequiredCjs = 1;
|
|
4564
|
-
const {
|
|
4565
|
-
default: Draggable,
|
|
4566
|
-
DraggableCore
|
|
4567
|
-
} = requireDraggable();
|
|
4568
|
-
cjs.exports = Draggable;
|
|
4569
|
-
cjs.exports.default = Draggable;
|
|
4570
|
-
cjs.exports.DraggableCore = DraggableCore;
|
|
4571
|
-
return cjs.exports;
|
|
4572
|
-
}
|
|
4573
|
-
|
|
4574
|
-
var cjsExports = requireCjs();
|
|
4575
|
-
var Draggable = /*@__PURE__*/getDefaultExportFromCjs(cjsExports);
|
|
3982
|
+
// lib/Draggable.tsx
|
|
3983
|
+
var Draggable = class extends React.Component {
|
|
3984
|
+
constructor(props) {
|
|
3985
|
+
super(props);
|
|
3986
|
+
this.onDragStart = (e, coreData) => {
|
|
3987
|
+
log_default("Draggable: onDragStart: %j", coreData);
|
|
3988
|
+
const shouldStart = this.props.onStart(e, createDraggableData(this, coreData));
|
|
3989
|
+
if (shouldStart === false) return false;
|
|
3990
|
+
this.setState({ dragging: true, dragged: true });
|
|
3991
|
+
};
|
|
3992
|
+
this.onDrag = (e, coreData) => {
|
|
3993
|
+
if (!this.state.dragging) return false;
|
|
3994
|
+
log_default("Draggable: onDrag: %j", coreData);
|
|
3995
|
+
const uiData = createDraggableData(this, coreData);
|
|
3996
|
+
const newState = {
|
|
3997
|
+
x: uiData.x,
|
|
3998
|
+
y: uiData.y,
|
|
3999
|
+
slackX: 0,
|
|
4000
|
+
slackY: 0
|
|
4001
|
+
};
|
|
4002
|
+
if (this.props.bounds) {
|
|
4003
|
+
const { x, y } = newState;
|
|
4004
|
+
newState.x += this.state.slackX;
|
|
4005
|
+
newState.y += this.state.slackY;
|
|
4006
|
+
const [newStateX, newStateY] = getBoundPosition(this, newState.x, newState.y);
|
|
4007
|
+
newState.x = newStateX;
|
|
4008
|
+
newState.y = newStateY;
|
|
4009
|
+
newState.slackX = this.state.slackX + (x - newState.x);
|
|
4010
|
+
newState.slackY = this.state.slackY + (y - newState.y);
|
|
4011
|
+
uiData.x = newState.x;
|
|
4012
|
+
uiData.y = newState.y;
|
|
4013
|
+
uiData.deltaX = newState.x - this.state.x;
|
|
4014
|
+
uiData.deltaY = newState.y - this.state.y;
|
|
4015
|
+
}
|
|
4016
|
+
const shouldUpdate = this.props.onDrag(e, uiData);
|
|
4017
|
+
if (shouldUpdate === false) return false;
|
|
4018
|
+
this.setState(newState);
|
|
4019
|
+
};
|
|
4020
|
+
this.onDragStop = (e, coreData) => {
|
|
4021
|
+
if (!this.state.dragging) return false;
|
|
4022
|
+
const shouldContinue = this.props.onStop(e, createDraggableData(this, coreData));
|
|
4023
|
+
if (shouldContinue === false) return false;
|
|
4024
|
+
log_default("Draggable: onDragStop: %j", coreData);
|
|
4025
|
+
const newState = {
|
|
4026
|
+
dragging: false,
|
|
4027
|
+
slackX: 0,
|
|
4028
|
+
slackY: 0
|
|
4029
|
+
};
|
|
4030
|
+
const controlled = Boolean(this.props.position);
|
|
4031
|
+
if (controlled) {
|
|
4032
|
+
const { x, y } = this.props.position;
|
|
4033
|
+
newState.x = x;
|
|
4034
|
+
newState.y = y;
|
|
4035
|
+
}
|
|
4036
|
+
this.setState(newState);
|
|
4037
|
+
};
|
|
4038
|
+
this.state = {
|
|
4039
|
+
// Whether or not we are currently dragging.
|
|
4040
|
+
dragging: false,
|
|
4041
|
+
// Whether or not we have been dragged before.
|
|
4042
|
+
dragged: false,
|
|
4043
|
+
// Current transform x and y.
|
|
4044
|
+
x: props.position ? props.position.x : props.defaultPosition.x,
|
|
4045
|
+
y: props.position ? props.position.y : props.defaultPosition.y,
|
|
4046
|
+
prevPropsPosition: { ...props.position },
|
|
4047
|
+
// Used for compensating for out-of-bounds drags
|
|
4048
|
+
slackX: 0,
|
|
4049
|
+
slackY: 0,
|
|
4050
|
+
// Can only determine if SVG after mounting
|
|
4051
|
+
isElementSVG: false
|
|
4052
|
+
};
|
|
4053
|
+
if (props.position && !(props.onDrag || props.onStop)) {
|
|
4054
|
+
console.warn("A `position` was applied to this <Draggable>, without drag handlers. This will make this component effectively undraggable. Please attach `onDrag` or `onStop` handlers so you can adjust the `position` of this element.");
|
|
4055
|
+
}
|
|
4056
|
+
}
|
|
4057
|
+
// React 16.3+
|
|
4058
|
+
// Arity (props, state)
|
|
4059
|
+
static getDerivedStateFromProps({ position }, { prevPropsPosition }) {
|
|
4060
|
+
if (position && (!prevPropsPosition || position.x !== prevPropsPosition.x || position.y !== prevPropsPosition.y)) {
|
|
4061
|
+
log_default("Draggable: getDerivedStateFromProps %j", { position, prevPropsPosition });
|
|
4062
|
+
return {
|
|
4063
|
+
x: position.x,
|
|
4064
|
+
y: position.y,
|
|
4065
|
+
prevPropsPosition: { ...position }
|
|
4066
|
+
};
|
|
4067
|
+
}
|
|
4068
|
+
return null;
|
|
4069
|
+
}
|
|
4070
|
+
componentDidMount() {
|
|
4071
|
+
if (typeof window.SVGElement !== "undefined" && this.findDOMNode() instanceof window.SVGElement) {
|
|
4072
|
+
this.setState({ isElementSVG: true });
|
|
4073
|
+
}
|
|
4074
|
+
}
|
|
4075
|
+
componentWillUnmount() {
|
|
4076
|
+
if (this.state.dragging) {
|
|
4077
|
+
this.setState({ dragging: false });
|
|
4078
|
+
}
|
|
4079
|
+
}
|
|
4080
|
+
// React 19 removed ReactDOM.findDOMNode, so nodeRef is now required.
|
|
4081
|
+
// For backward compatibility with React 18 and earlier, we still support findDOMNode if available.
|
|
4082
|
+
findDOMNode() {
|
|
4083
|
+
var _a;
|
|
4084
|
+
if ((_a = this.props) == null ? void 0 : _a.nodeRef) {
|
|
4085
|
+
return this.props.nodeRef.current;
|
|
4086
|
+
}
|
|
4087
|
+
const legacyReactDOM = ReactDOM;
|
|
4088
|
+
if (typeof legacyReactDOM.findDOMNode === "function") {
|
|
4089
|
+
return legacyReactDOM.findDOMNode(this);
|
|
4090
|
+
}
|
|
4091
|
+
return null;
|
|
4092
|
+
}
|
|
4093
|
+
render() {
|
|
4094
|
+
const {
|
|
4095
|
+
axis,
|
|
4096
|
+
bounds,
|
|
4097
|
+
children,
|
|
4098
|
+
defaultPosition,
|
|
4099
|
+
defaultClassName,
|
|
4100
|
+
defaultClassNameDragging,
|
|
4101
|
+
defaultClassNameDragged,
|
|
4102
|
+
position,
|
|
4103
|
+
positionOffset,
|
|
4104
|
+
scale,
|
|
4105
|
+
...draggableCoreProps
|
|
4106
|
+
} = this.props;
|
|
4107
|
+
let style = {};
|
|
4108
|
+
let svgTransform = null;
|
|
4109
|
+
const controlled = Boolean(position);
|
|
4110
|
+
const draggable = !controlled || this.state.dragging;
|
|
4111
|
+
const validPosition = position || defaultPosition;
|
|
4112
|
+
const transformOpts = {
|
|
4113
|
+
// Set left if horizontal drag is enabled
|
|
4114
|
+
x: canDragX(this) && draggable ? this.state.x : validPosition.x,
|
|
4115
|
+
// Set top if vertical drag is enabled
|
|
4116
|
+
y: canDragY(this) && draggable ? this.state.y : validPosition.y
|
|
4117
|
+
};
|
|
4118
|
+
if (this.state.isElementSVG) {
|
|
4119
|
+
svgTransform = createSVGTransform(transformOpts, positionOffset);
|
|
4120
|
+
} else {
|
|
4121
|
+
style = createCSSTransform(transformOpts, positionOffset);
|
|
4122
|
+
}
|
|
4123
|
+
const onlyChild = React.Children.only(children);
|
|
4124
|
+
const className = clsx(onlyChild.props.className || "", defaultClassName, {
|
|
4125
|
+
[defaultClassNameDragging]: this.state.dragging,
|
|
4126
|
+
[defaultClassNameDragged]: this.state.dragged
|
|
4127
|
+
});
|
|
4128
|
+
return /* @__PURE__ */ React.createElement(DraggableCore, { ...draggableCoreProps, onStart: this.onDragStart, onDrag: this.onDrag, onStop: this.onDragStop }, React.cloneElement(onlyChild, {
|
|
4129
|
+
className,
|
|
4130
|
+
style: { ...onlyChild.props.style, ...style },
|
|
4131
|
+
transform: svgTransform
|
|
4132
|
+
}));
|
|
4133
|
+
}
|
|
4134
|
+
};
|
|
4135
|
+
Draggable.displayName = "Draggable";
|
|
4136
|
+
// Both the annotation and the `?` are load-bearing:
|
|
4137
|
+
// - The index-signature annotation stops tsc from inferring the
|
|
4138
|
+
// PropTypes.Requireable<...> types and emitting `import PropTypes from
|
|
4139
|
+
// 'prop-types'` into the generated public .d.ts, which would force consumers
|
|
4140
|
+
// to install @types/prop-types (the v4.5.0 hand-written typings had none).
|
|
4141
|
+
// - The `?` keeps `propTypes` from being a *required* member of the public
|
|
4142
|
+
// type. React <= 18's JSX LibraryManagedAttributes only consults a
|
|
4143
|
+
// component's `propTypes` when it is required (`C extends {propTypes: ...}`);
|
|
4144
|
+
// when it does, this index-signature `propTypes` makes `defaultProps` stop
|
|
4145
|
+
// marking props optional, so consumers are forced to pass every prop.
|
|
4146
|
+
// Optional dodges that branch; React 19 ignores `propTypes` entirely. The
|
|
4147
|
+
// typings/tsconfig.react18.json check guards against a regression here.
|
|
4148
|
+
// Do not remove. See lib/DraggableCore.tsx for the same guard.
|
|
4149
|
+
Draggable.propTypes = {
|
|
4150
|
+
// Accepts all props <DraggableCore> accepts.
|
|
4151
|
+
...DraggableCore.propTypes,
|
|
4152
|
+
/**
|
|
4153
|
+
* `axis` determines which axis the draggable can move.
|
|
4154
|
+
*
|
|
4155
|
+
* Note that all callbacks will still return data as normal. This only
|
|
4156
|
+
* controls flushing to the DOM.
|
|
4157
|
+
*
|
|
4158
|
+
* 'both' allows movement horizontally and vertically.
|
|
4159
|
+
* 'x' limits movement to horizontal axis.
|
|
4160
|
+
* 'y' limits movement to vertical axis.
|
|
4161
|
+
* 'none' limits all movement.
|
|
4162
|
+
*
|
|
4163
|
+
* Defaults to 'both'.
|
|
4164
|
+
*/
|
|
4165
|
+
axis: PropTypes2.oneOf(["both", "x", "y", "none"]),
|
|
4166
|
+
/**
|
|
4167
|
+
* `bounds` determines the range of movement available to the element.
|
|
4168
|
+
* Available values are:
|
|
4169
|
+
*
|
|
4170
|
+
* 'parent' restricts movement within the Draggable's parent node.
|
|
4171
|
+
*
|
|
4172
|
+
* Alternatively, pass an object with the following properties, all of which are optional:
|
|
4173
|
+
*
|
|
4174
|
+
* {left: LEFT_BOUND, right: RIGHT_BOUND, bottom: BOTTOM_BOUND, top: TOP_BOUND}
|
|
4175
|
+
*
|
|
4176
|
+
* All values are in px.
|
|
4177
|
+
*
|
|
4178
|
+
* Example:
|
|
4179
|
+
*
|
|
4180
|
+
* ```jsx
|
|
4181
|
+
* let App = React.createClass({
|
|
4182
|
+
* render: function () {
|
|
4183
|
+
* return (
|
|
4184
|
+
* <Draggable bounds={{right: 300, bottom: 300}}>
|
|
4185
|
+
* <div>Content</div>
|
|
4186
|
+
* </Draggable>
|
|
4187
|
+
* );
|
|
4188
|
+
* }
|
|
4189
|
+
* });
|
|
4190
|
+
* ```
|
|
4191
|
+
*/
|
|
4192
|
+
bounds: PropTypes2.oneOfType([
|
|
4193
|
+
PropTypes2.shape({
|
|
4194
|
+
left: PropTypes2.number,
|
|
4195
|
+
right: PropTypes2.number,
|
|
4196
|
+
top: PropTypes2.number,
|
|
4197
|
+
bottom: PropTypes2.number
|
|
4198
|
+
}),
|
|
4199
|
+
PropTypes2.string,
|
|
4200
|
+
PropTypes2.oneOf([false])
|
|
4201
|
+
]),
|
|
4202
|
+
defaultClassName: PropTypes2.string,
|
|
4203
|
+
defaultClassNameDragging: PropTypes2.string,
|
|
4204
|
+
defaultClassNameDragged: PropTypes2.string,
|
|
4205
|
+
/**
|
|
4206
|
+
* `defaultPosition` specifies the x and y that the dragged item should start at
|
|
4207
|
+
*
|
|
4208
|
+
* Example:
|
|
4209
|
+
*
|
|
4210
|
+
* ```jsx
|
|
4211
|
+
* let App = React.createClass({
|
|
4212
|
+
* render: function () {
|
|
4213
|
+
* return (
|
|
4214
|
+
* <Draggable defaultPosition={{x: 25, y: 25}}>
|
|
4215
|
+
* <div>I start with transformX: 25px and transformY: 25px;</div>
|
|
4216
|
+
* </Draggable>
|
|
4217
|
+
* );
|
|
4218
|
+
* }
|
|
4219
|
+
* });
|
|
4220
|
+
* ```
|
|
4221
|
+
*/
|
|
4222
|
+
defaultPosition: PropTypes2.shape({
|
|
4223
|
+
x: PropTypes2.number,
|
|
4224
|
+
y: PropTypes2.number
|
|
4225
|
+
}),
|
|
4226
|
+
positionOffset: PropTypes2.shape({
|
|
4227
|
+
x: PropTypes2.oneOfType([PropTypes2.number, PropTypes2.string]),
|
|
4228
|
+
y: PropTypes2.oneOfType([PropTypes2.number, PropTypes2.string])
|
|
4229
|
+
}),
|
|
4230
|
+
/**
|
|
4231
|
+
* `position`, if present, defines the current position of the element.
|
|
4232
|
+
*
|
|
4233
|
+
* This is similar to how form elements in React work - if no `position` is supplied, the component
|
|
4234
|
+
* is uncontrolled.
|
|
4235
|
+
*
|
|
4236
|
+
* Example:
|
|
4237
|
+
*
|
|
4238
|
+
* ```jsx
|
|
4239
|
+
* let App = React.createClass({
|
|
4240
|
+
* render: function () {
|
|
4241
|
+
* return (
|
|
4242
|
+
* <Draggable position={{x: 25, y: 25}}>
|
|
4243
|
+
* <div>I start with transformX: 25px and transformY: 25px;</div>
|
|
4244
|
+
* </Draggable>
|
|
4245
|
+
* );
|
|
4246
|
+
* }
|
|
4247
|
+
* });
|
|
4248
|
+
* ```
|
|
4249
|
+
*/
|
|
4250
|
+
position: PropTypes2.shape({
|
|
4251
|
+
x: PropTypes2.number,
|
|
4252
|
+
y: PropTypes2.number
|
|
4253
|
+
}),
|
|
4254
|
+
/**
|
|
4255
|
+
* These properties should be defined on the child, not here.
|
|
4256
|
+
*/
|
|
4257
|
+
className: dontSetMe,
|
|
4258
|
+
style: dontSetMe,
|
|
4259
|
+
transform: dontSetMe
|
|
4260
|
+
};
|
|
4261
|
+
// Typed as the full `DraggableProps` (not just the default-provided subset) so
|
|
4262
|
+
// React's JSX LibraryManagedAttributes treats EVERY prop as optional for
|
|
4263
|
+
// consumers, matching the historical hand-written typings. At runtime only the
|
|
4264
|
+
// default-able props are actually populated.
|
|
4265
|
+
Draggable.defaultProps = {
|
|
4266
|
+
...DraggableCore.defaultProps,
|
|
4267
|
+
axis: "both",
|
|
4268
|
+
bounds: false,
|
|
4269
|
+
defaultClassName: "react-draggable",
|
|
4270
|
+
defaultClassNameDragging: "react-draggable-dragging",
|
|
4271
|
+
defaultClassNameDragged: "react-draggable-dragged",
|
|
4272
|
+
defaultPosition: { x: 0, y: 0 },
|
|
4273
|
+
scale: 1
|
|
4274
|
+
};
|
|
4275
|
+
|
|
4276
|
+
// lib/cjs.ts
|
|
4277
|
+
var cjs_default = Draggable;
|
|
4576
4278
|
|
|
4577
4279
|
var __assign$2 = function() {
|
|
4578
4280
|
__assign$2 = Object.assign || function(t) {
|
|
@@ -5786,7 +5488,7 @@ var Rnd = (
|
|
|
5786
5488
|
var pos = this.state.resizing ? void 0 : draggablePosition;
|
|
5787
5489
|
var dragAxisOrUndefined = this.state.resizing ? "both" : dragAxis;
|
|
5788
5490
|
return createElement(
|
|
5789
|
-
|
|
5491
|
+
cjs_default,
|
|
5790
5492
|
{
|
|
5791
5493
|
ref: function(c) {
|
|
5792
5494
|
if (!c)
|
|
@@ -6010,7 +5712,7 @@ function PopinWindow({
|
|
|
6010
5712
|
Rnd,
|
|
6011
5713
|
{
|
|
6012
5714
|
ref: panelRef,
|
|
6013
|
-
className: clsx
|
|
5715
|
+
className: clsx("WindowPanel", className),
|
|
6014
5716
|
dragHandleClassName: "draggable-handle",
|
|
6015
5717
|
maxHeight,
|
|
6016
5718
|
maxWidth,
|
|
@@ -7323,7 +7025,7 @@ const Panel = (props) => {
|
|
|
7323
7025
|
) });
|
|
7324
7026
|
};
|
|
7325
7027
|
const PanelContent = forwardRef(function PanelContentFr({ children, className }, ref) {
|
|
7326
|
-
return /* @__PURE__ */ jsx("div", { className: clsx
|
|
7028
|
+
return /* @__PURE__ */ jsx("div", { className: clsx(`WindowPanel-content`, className), ref, children });
|
|
7327
7029
|
});
|
|
7328
7030
|
|
|
7329
7031
|
const PanelDock = ({ id, children }) => {
|
|
@@ -7336,7 +7038,7 @@ const PanelDock = ({ id, children }) => {
|
|
|
7336
7038
|
};
|
|
7337
7039
|
|
|
7338
7040
|
const PanelFooter = forwardRef(function PanelFooterFr({ children, className }, ref) {
|
|
7339
|
-
return /* @__PURE__ */ jsx("div", { className: clsx
|
|
7041
|
+
return /* @__PURE__ */ jsx("div", { className: clsx(`WindowPanel-footer`, className), ref, children });
|
|
7340
7042
|
});
|
|
7341
7043
|
|
|
7342
7044
|
const PanelHeaderButton = ({ "aria-label": ariaLabel, href, icon, onClick }) => {
|
|
@@ -7387,7 +7089,7 @@ const PanelHeader = ({
|
|
|
7387
7089
|
return /* @__PURE__ */ jsxs(
|
|
7388
7090
|
"div",
|
|
7389
7091
|
{
|
|
7390
|
-
className: clsx
|
|
7092
|
+
className: clsx("WindowPanel-header", resizeable && "draggable-handle"),
|
|
7391
7093
|
onMouseDown: headerMouseDown,
|
|
7392
7094
|
onMouseUp: () => !panelPoppedOut && setCursor("grab"),
|
|
7393
7095
|
style: resizeable ? { cursor } : {},
|
|
@@ -7469,7 +7171,7 @@ const PanelInline = forwardRef(function PanelInline2({ title, className, width,
|
|
|
7469
7171
|
panelPoppedOut: false,
|
|
7470
7172
|
bounds: void 0
|
|
7471
7173
|
},
|
|
7472
|
-
children: /* @__PURE__ */ jsx("div", { ref, className: clsx
|
|
7174
|
+
children: /* @__PURE__ */ jsx("div", { ref, className: clsx("WindowPanel", className), title, style: { width, height }, children })
|
|
7473
7175
|
}
|
|
7474
7176
|
) });
|
|
7475
7177
|
});
|
|
@@ -7831,7 +7533,7 @@ const LuiModalPrefab = (props) => {
|
|
|
7831
7533
|
return /* @__PURE__ */ jsxs(
|
|
7832
7534
|
LuiModalAsync,
|
|
7833
7535
|
{
|
|
7834
|
-
className: clsx
|
|
7536
|
+
className: clsx("LuiModalPrefab", `LuiModalPrefab-${level}`, className),
|
|
7835
7537
|
style,
|
|
7836
7538
|
closeOnOverlayClick,
|
|
7837
7539
|
children: [
|
|
@@ -7864,7 +7566,7 @@ const LuiModalPrefab = (props) => {
|
|
|
7864
7566
|
intent: pf.intent,
|
|
7865
7567
|
disabled: pf.disabled,
|
|
7866
7568
|
loading: pf.loading,
|
|
7867
|
-
className: clsx
|
|
7569
|
+
className: clsx(pf.className, pf.icon && "lui-button-icon", pf.iconRight && "lui-button-icon-right"),
|
|
7868
7570
|
onClick: () => {
|
|
7869
7571
|
setDontShow();
|
|
7870
7572
|
resolve(pf.value);
|
|
@@ -7938,7 +7640,7 @@ const LuiModalUpload = ({
|
|
|
7938
7640
|
return /* @__PURE__ */ jsxs(
|
|
7939
7641
|
LuiModalAsync,
|
|
7940
7642
|
{
|
|
7941
|
-
className: clsx
|
|
7643
|
+
className: clsx("LuiModalPrefab", `LuiModalPrefab-file`),
|
|
7942
7644
|
closeOnOverlayClick: true,
|
|
7943
7645
|
style: { width: width ?? 512, minHeight: height, height },
|
|
7944
7646
|
children: [
|
|
@@ -8094,7 +7796,7 @@ const RibbonButton = forwardRef(function RibbonButton2({
|
|
|
8094
7796
|
return /* @__PURE__ */ jsx("div", { className: "RibbonButtonSkeleton", children: /* @__PURE__ */ jsx(
|
|
8095
7797
|
Skeleton,
|
|
8096
7798
|
{
|
|
8097
|
-
className: clsx
|
|
7799
|
+
className: clsx(
|
|
8098
7800
|
disabled && "disabled"
|
|
8099
7801
|
// disabled to style cursor
|
|
8100
7802
|
),
|
|
@@ -8130,7 +7832,7 @@ const RibbonButton = forwardRef(function RibbonButton2({
|
|
|
8130
7832
|
"data-testid": testId,
|
|
8131
7833
|
disabled,
|
|
8132
7834
|
onClick,
|
|
8133
|
-
className: clsx
|
|
7835
|
+
className: clsx(
|
|
8134
7836
|
className,
|
|
8135
7837
|
"RibbonButton",
|
|
8136
7838
|
selected && "RibbonButton-selected",
|
|
@@ -8175,7 +7877,7 @@ const RibbonButtonOpenPanel = forwardRef(
|
|
|
8175
7877
|
ref,
|
|
8176
7878
|
...buttonProps,
|
|
8177
7879
|
onClick: () => openPanel({ uniqueId: uniqueId || buttonProps.title, componentFn, poppedOut, onClose }),
|
|
8178
|
-
className: clsx
|
|
7880
|
+
className: clsx(openPanels.has(uniqueId ?? "") && "RibbonButton-selected", className)
|
|
8179
7881
|
}
|
|
8180
7882
|
);
|
|
8181
7883
|
}
|
|
@@ -8235,7 +7937,7 @@ const RibbonMenuOption = forwardRef(
|
|
|
8235
7937
|
currentTarget?.focus?.();
|
|
8236
7938
|
},
|
|
8237
7939
|
onClick,
|
|
8238
|
-
className: clsx
|
|
7940
|
+
className: clsx(className, "RibbonMenuOption", disabled && "RibbonMenuOption-disabled"),
|
|
8239
7941
|
children: [
|
|
8240
7942
|
/* @__PURE__ */ jsx("div", { style: { display: "flex" }, children: icon && /* @__PURE__ */ jsx(LuiIcon, { name: icon, alt: title ?? "", size: "md" }) }),
|
|
8241
7943
|
/* @__PURE__ */ jsx("div", { style: hasIcon && !icon ? { paddingLeft: 24 } : {}, children })
|
|
@@ -8275,7 +7977,7 @@ const RibbonButtonSlider = forwardRef(
|
|
|
8275
7977
|
...{ ["popover"]: "auto" },
|
|
8276
7978
|
role: "menu",
|
|
8277
7979
|
"aria-label": "Menu",
|
|
8278
|
-
className: clsx
|
|
7980
|
+
className: clsx(`RibbonSliderMenu RibbonSliderMenu-${alignment}`, sliderClassName),
|
|
8279
7981
|
style: {
|
|
8280
7982
|
positionAnchor,
|
|
8281
7983
|
[alignments[0]]: `anchor(${positionAnchor} ${alignments[1]})`,
|