From 6ecbeffaa66f2e5f281c3bb0bcf702a5ab4e1b2e Mon Sep 17 00:00:00 2001 From: robuddybot <65057909+robuddybot@users.noreply.github.com> Date: Thu, 14 Nov 2024 21:53:56 +0000 Subject: [PATCH] Build & Release v1.3.0 --- dist/ProgressBar.module-Jzqlebbx.js | 29 -- dist/Section.module-qhQWhlUX.js | 18 -- dist/assets/BlockQuote.css | 1 - dist/assets/Button.css | 1 - dist/assets/ColorBox.css | 1 - dist/assets/Dialog.css | 1 - dist/assets/Dimmer.css | 1 - dist/assets/Divider.css | 1 - dist/assets/Flex.css | 1 - dist/assets/Icon.css | 6 - dist/assets/ImageButton.css | 5 - dist/assets/Input.css | 1 - dist/assets/Knob.css | 1 - dist/assets/LabeledList.css | 1 - dist/assets/MenuBar.css | 1 - dist/assets/Modal.css | 1 - dist/assets/NoticeBox.css | 1 - dist/assets/NumberInput.css | 1 - dist/assets/ProgressBar.css | 1 - dist/assets/RoundGauge.css | 1 - dist/assets/Section.css | 1 - dist/assets/Slider.css | 1 - dist/assets/Stack.css | 1 - dist/assets/Table.css | 1 - dist/assets/Tabs.css | 1 - dist/assets/TextArea.css | 1 - dist/assets/Tooltip.css | 1 - dist/common/color.js | 61 ++-- dist/common/events.js | 10 +- dist/common/format.js | 54 ++-- dist/common/hotkeys.d.ts | 1 - dist/common/hotkeys.js | 4 +- dist/common/math.d.ts | 4 + dist/common/math.js | 54 ++-- dist/common/random.js | 27 +- dist/common/react.js | 2 +- dist/common/string.js | 18 +- dist/common/type-utils.d.ts | 2 +- dist/components/AnimatedNumber.d.ts | 12 +- dist/components/AnimatedNumber.js | 31 +- dist/components/Autofocus.d.ts | 1 - dist/components/Blink.d.ts | 1 - dist/components/BlockQuote.d.ts | 1 - dist/components/BlockQuote.js | 11 +- dist/components/Box.d.ts | 1 - dist/components/Box.js | 8 +- dist/components/Button.d.ts | 1 - dist/components/Button.js | 384 +++++++++++------------- dist/components/ByondUi.js | 6 +- dist/components/Chart.d.ts | 1 - dist/components/Chart.js | 47 +-- dist/components/Collapsible.d.ts | 1 - dist/components/ColorBox.d.ts | 1 - dist/components/ColorBox.js | 21 +- dist/components/Dialog.js | 71 ++--- dist/components/Dimmer.d.ts | 1 - dist/components/Dimmer.js | 15 +- dist/components/Divider.js | 24 +- dist/components/DmIcon.d.ts | 1 - dist/components/DraggableControl.js | 106 ++++--- dist/components/Dropdown.d.ts | 1 - dist/components/Dropdown.js | 140 ++++----- dist/components/FitText.d.ts | 1 - dist/components/Flex.d.ts | 2 +- dist/components/Flex.js | 80 +++-- dist/components/Icon.d.ts | 1 - dist/components/Icon.js | 61 ++-- dist/components/Image.d.ts | 1 - dist/components/Image.js | 13 +- dist/components/ImageButton.d.ts | 1 - dist/components/ImageButton.js | 255 ++++++---------- dist/components/InfinitePlane.js | 2 +- dist/components/Input.d.ts | 1 - dist/components/Input.js | 121 ++++---- dist/components/KeyListener.d.ts | 1 - dist/components/Knob.d.ts | 1 - dist/components/Knob.js | 208 ++++++------- dist/components/LabeledControls.d.ts | 1 - dist/components/LabeledList.d.ts | 1 - dist/components/LabeledList.js | 103 +++---- dist/components/MenuBar.d.ts | 1 - dist/components/MenuBar.js | 195 ++++++------ dist/components/Modal.d.ts | 1 - dist/components/Modal.js | 29 +- dist/components/NoticeBox.d.ts | 1 - dist/components/NoticeBox.js | 59 +--- dist/components/NumberInput.d.ts | 2 - dist/components/NumberInput.js | 206 ++++++------- dist/components/Popper.d.ts | 1 - dist/components/ProgressBar.d.ts | 1 - dist/components/ProgressBar.js | 49 ++- dist/components/RestrictedInput.js | 122 ++++---- dist/components/RoundGauge.d.ts | 1 - dist/components/RoundGauge.js | 174 +++++------ dist/components/Section.d.ts | 3 +- dist/components/Section.js | 101 +++---- dist/components/Slider.d.ts | 1 - dist/components/Slider.js | 152 +++++----- dist/components/Stack.d.ts | 1 - dist/components/Stack.js | 84 +++--- dist/components/StyleableSection.d.ts | 1 - dist/components/StyleableSection.js | 22 +- dist/components/Table.d.ts | 1 - dist/components/Table.js | 85 +++--- dist/components/Tabs.d.ts | 1 - dist/components/Tabs.js | 118 +++----- dist/components/TextArea.d.ts | 1 - dist/components/TextArea.js | 143 ++++----- dist/components/TimeDisplay.d.ts | 13 +- dist/components/TimeDisplay.js | 34 +-- dist/components/Tooltip.d.ts | 3 +- dist/components/Tooltip.js | 18 +- dist/components/TrackOutsideClicks.d.ts | 1 - dist/components/VirtualList.d.ts | 1 - package.json | 12 +- 115 files changed, 1634 insertions(+), 2063 deletions(-) delete mode 100644 dist/ProgressBar.module-Jzqlebbx.js delete mode 100644 dist/Section.module-qhQWhlUX.js delete mode 100644 dist/assets/BlockQuote.css delete mode 100644 dist/assets/Button.css delete mode 100644 dist/assets/ColorBox.css delete mode 100644 dist/assets/Dialog.css delete mode 100644 dist/assets/Dimmer.css delete mode 100644 dist/assets/Divider.css delete mode 100644 dist/assets/Flex.css delete mode 100644 dist/assets/Icon.css delete mode 100644 dist/assets/ImageButton.css delete mode 100644 dist/assets/Input.css delete mode 100644 dist/assets/Knob.css delete mode 100644 dist/assets/LabeledList.css delete mode 100644 dist/assets/MenuBar.css delete mode 100644 dist/assets/Modal.css delete mode 100644 dist/assets/NoticeBox.css delete mode 100644 dist/assets/NumberInput.css delete mode 100644 dist/assets/ProgressBar.css delete mode 100644 dist/assets/RoundGauge.css delete mode 100644 dist/assets/Section.css delete mode 100644 dist/assets/Slider.css delete mode 100644 dist/assets/Stack.css delete mode 100644 dist/assets/Table.css delete mode 100644 dist/assets/Tabs.css delete mode 100644 dist/assets/TextArea.css delete mode 100644 dist/assets/Tooltip.css diff --git a/dist/ProgressBar.module-Jzqlebbx.js b/dist/ProgressBar.module-Jzqlebbx.js deleted file mode 100644 index e14e85a..0000000 --- a/dist/ProgressBar.module-Jzqlebbx.js +++ /dev/null @@ -1,29 +0,0 @@ -import './assets/ProgressBar.css';const _ = "_progressBar_140lk_17", o = "_fill_140lk_29", l = "_fill__animated_140lk_36", r = "_content_140lk_40", c = "_color__default_140lk_47", e = "_color__black_140lk_54", t = "_color__white_140lk_61", n = "_color__red_140lk_68", a = "_color__orange_140lk_75", s = "_color__yellow_140lk_82", k = "_color__olive_140lk_89", g = "_color__green_140lk_96", i = "_color__teal_140lk_103", b = "_color__blue_140lk_110", d = "_color__violet_140lk_117", p = "_color__purple_140lk_124", f = "_color__pink_140lk_131", u = "_color__brown_140lk_138", v = "_color__grey_140lk_145", w = "_color__good_140lk_159", y = "_color__average_140lk_166", h = "_color__bad_140lk_173", m = "_color__label_140lk_180", B = { - progressBar: _, - fill: o, - fill__animated: l, - content: r, - color__default: c, - color__black: e, - color__white: t, - color__red: n, - color__orange: a, - color__yellow: s, - color__olive: k, - color__green: g, - color__teal: i, - color__blue: b, - color__violet: d, - color__purple: p, - color__pink: f, - color__brown: u, - color__grey: v, - "color__light-grey": "_color__light-grey_140lk_152", - color__good: w, - color__average: y, - color__bad: h, - color__label: m -}; -export { - B as p -}; diff --git a/dist/Section.module-qhQWhlUX.js b/dist/Section.module-qhQWhlUX.js deleted file mode 100644 index 56b1409..0000000 --- a/dist/Section.module-qhQWhlUX.js +++ /dev/null @@ -1,18 +0,0 @@ -import './assets/Section.css';const t = "_section_10c68_17", _ = "_title_10c68_28", n = "_titleText_10c68_34", o = "_buttons_10c68_40", c = "_rest_10c68_47", e = "_content_10c68_51", s = "_fitted_10c68_55", l = "_fill_10c68_59", i = "_scrollable_10c68_73", r = "_scrollableHorizontal_10c68_90", a = "_section__flex_10c68_125", b = "_content__noTopPadding_10c68_135", d = "_content__stretchContents_10c68_139", f = { - section: t, - title: _, - titleText: n, - buttons: o, - rest: c, - content: e, - fitted: s, - fill: l, - scrollable: i, - scrollableHorizontal: r, - section__flex: a, - content__noTopPadding: b, - content__stretchContents: d -}; -export { - f as s -}; diff --git a/dist/assets/BlockQuote.css b/dist/assets/BlockQuote.css deleted file mode 100644 index 461d17c..0000000 --- a/dist/assets/BlockQuote.css +++ /dev/null @@ -1 +0,0 @@ -._blockQuote_14fvy_13{color:#8b9bb0;border-left:.1666666667em solid #8b9bb0;padding-left:.5em;margin-bottom:.5em}._blockQuote_14fvy_13:last-child{margin-bottom:0} diff --git a/dist/assets/Button.css b/dist/assets/Button.css deleted file mode 100644 index a0405b6..0000000 --- a/dist/assets/Button.css +++ /dev/null @@ -1 +0,0 @@ -._button_433yx_17{position:relative;display:inline-block;line-height:1.667em;padding:0 .5em;margin-right:.1666666667em;white-space:nowrap;outline:0;border-radius:.16em;margin-bottom:.1666666667em;-webkit-user-select:none;user-select:none;-ms-user-select:none}._button_433yx_17:last-child{margin-right:0;margin-bottom:0}._button_433yx_17 ._fa_433yx_34,._button_433yx_17 ._fas_433yx_35,._button_433yx_17 ._far_433yx_36{margin-left:-.25em;margin-right:-.25em;min-width:1.333em;text-align:center}._dropdown_433yx_43{line-height:1.3333333333em;height:1.8333333333em;padding:.2rem .5rem}._ellipsis_433yx_49{text-overflow:ellipsis;overflow:hidden}._fluid_433yx_54{display:block;margin-left:0;margin-right:0}._circular_433yx_60{border-radius:50%}._compact_433yx_64{padding:0 .25em;line-height:1.333em}._color__black_433yx_69{transition:color 50ms,background-color 50ms;background-color:#000;color:#fff}._color__black_433yx_69:focus{transition:color .1s,background-color .1s}._color__black_433yx_69:hover{background-color:#131313;color:#fff}._color__white_433yx_82{transition:color 50ms,background-color 50ms;background-color:#d9d9d9;color:#000}._color__white_433yx_82:focus{transition:color .1s,background-color .1s}._color__white_433yx_82:hover{background-color:#f8f8f8;color:#000}._color__red_433yx_95{transition:color 50ms,background-color 50ms;background-color:#bd2020;color:#fff}._color__red_433yx_95:focus{transition:color .1s,background-color .1s}._color__red_433yx_95:hover{background-color:#dc4848;color:#fff}._color__orange_433yx_108{transition:color 50ms,background-color 50ms;background-color:#d95e0c;color:#fff}._color__orange_433yx_108:focus{transition:color .1s,background-color .1s}._color__orange_433yx_108:hover{background-color:#f0853f;color:#fff}._color__yellow_433yx_121{transition:color 50ms,background-color 50ms;background-color:#d9b804;color:#000}._color__yellow_433yx_121:focus{transition:color .1s,background-color .1s}._color__yellow_433yx_121:hover{background-color:#f5d72e;color:#000}._color__olive_433yx_134{transition:color 50ms,background-color 50ms;background-color:#9aad14;color:#fff}._color__olive_433yx_134:focus{transition:color .1s,background-color .1s}._color__olive_433yx_134:hover{background-color:#c4da2b;color:#fff}._color__green_433yx_147{transition:color 50ms,background-color 50ms;background-color:#1b9638;color:#fff}._color__green_433yx_147:focus{transition:color .1s,background-color .1s}._color__green_433yx_147:hover{background-color:#32c154;color:#fff}._color__teal_433yx_160{transition:color 50ms,background-color 50ms;background-color:#009a93;color:#fff}._color__teal_433yx_160:focus{transition:color .1s,background-color .1s}._color__teal_433yx_160:hover{background-color:#13c4bc;color:#fff}._color__blue_433yx_173{transition:color 50ms,background-color 50ms;background-color:#1c71b1;color:#fff}._color__blue_433yx_173:focus{transition:color .1s,background-color .1s}._color__blue_433yx_173:hover{background-color:#3a95d9;color:#fff}._color__violet_433yx_186{transition:color 50ms,background-color 50ms;background-color:#552dab;color:#fff}._color__violet_433yx_186:focus{transition:color .1s,background-color .1s}._color__violet_433yx_186:hover{background-color:#7953cc;color:#fff}._color__purple_433yx_199{transition:color 50ms,background-color 50ms;background-color:#8b2baa;color:#fff}._color__purple_433yx_199:focus{transition:color .1s,background-color .1s}._color__purple_433yx_199:hover{background-color:#ad4fcd;color:#fff}._color__pink_433yx_212{transition:color 50ms,background-color 50ms;background-color:#cf2082;color:#fff}._color__pink_433yx_212:focus{transition:color .1s,background-color .1s}._color__pink_433yx_212:hover{background-color:#e257a5;color:#fff}._color__brown_433yx_225{transition:color 50ms,background-color 50ms;background-color:#8c5836;color:#fff}._color__brown_433yx_225:focus{transition:color .1s,background-color .1s}._color__brown_433yx_225:hover{background-color:#b47851;color:#fff}._color__grey_433yx_238{transition:color 50ms,background-color 50ms;background-color:#646464;color:#fff}._color__grey_433yx_238:focus{transition:color .1s,background-color .1s}._color__grey_433yx_238:hover{background-color:#868686;color:#fff}._color__light-grey_433yx_251{transition:color 50ms,background-color 50ms;background-color:#919191;color:#fff}._color__light-grey_433yx_251:focus{transition:color .1s,background-color .1s}._color__light-grey_433yx_251:hover{background-color:#bababa;color:#fff}._color__good_433yx_264{transition:color 50ms,background-color 50ms;background-color:#4d9121;color:#fff}._color__good_433yx_264:focus{transition:color .1s,background-color .1s}._color__good_433yx_264:hover{background-color:#6cba39;color:#fff}._color__average_433yx_277{transition:color 50ms,background-color 50ms;background-color:#cd7a0d;color:#fff}._color__average_433yx_277:focus{transition:color .1s,background-color .1s}._color__average_433yx_277:hover{background-color:#ed9d35;color:#fff}._color__bad_433yx_290{transition:color 50ms,background-color 50ms;background-color:#bd2020;color:#fff}._color__bad_433yx_290:focus{transition:color .1s,background-color .1s}._color__bad_433yx_290:hover{background-color:#dc4848;color:#fff}._color__label_433yx_303{transition:color 50ms,background-color 50ms;background-color:#657a94;color:#fff}._color__label_433yx_303:focus{transition:color .1s,background-color .1s}._color__label_433yx_303:hover{background-color:#91a1b3;color:#fff}._color__default_433yx_316{transition:color 50ms,background-color 50ms;background-color:#3e6189;color:#fff}._color__default_433yx_316:focus{transition:color .1s,background-color .1s}._color__default_433yx_316:hover{background-color:#5c83b0;color:#fff}._color__caution_433yx_329{transition:color 50ms,background-color 50ms;background-color:#d9b804;color:#000}._color__caution_433yx_329:focus{transition:color .1s,background-color .1s}._color__caution_433yx_329:hover{background-color:#f5d72e;color:#000}._color__danger_433yx_342{transition:color 50ms,background-color 50ms;background-color:#bd2020;color:#fff}._color__danger_433yx_342:focus{transition:color .1s,background-color .1s}._color__danger_433yx_342:hover{background-color:#dc4848;color:#fff}._color__transparent_433yx_355{transition:color 50ms,background-color 50ms;background-color:#252525;color:#fff;background-color:#25252500;color:#ffffff80}._color__transparent_433yx_355:focus{transition:color .1s,background-color .1s}._color__transparent_433yx_355:hover{background-color:#3e3e3e;color:#fff}._disabled_433yx_370{background-color:#999!important}._selected_433yx_374{transition:color 50ms,background-color 50ms;background-color:#1b9638;color:#fff}._selected_433yx_374:focus{transition:color .1s,background-color .1s}._selected_433yx_374:hover{background-color:#32c154;color:#fff}._flex_433yx_387{display:inline-flex;flex-direction:column}._flex__fluid_433yx_392{width:100%}._verticalAlignContent__top_433yx_396{justify-content:flex-start}._verticalAlignContent__middle_433yx_400{justify-content:center}._verticalAlignContent__bottom_433yx_404{justify-content:flex-end}._content_433yx_408{display:block;align-self:stretch}._textMargin_433yx_413{margin-left:.4rem} diff --git a/dist/assets/ColorBox.css b/dist/assets/ColorBox.css deleted file mode 100644 index a97595c..0000000 --- a/dist/assets/ColorBox.css +++ /dev/null @@ -1 +0,0 @@ -._colorBox_110qz_5{display:inline-block;width:1em;height:1em;line-height:1em;text-align:center} diff --git a/dist/assets/Dialog.css b/dist/assets/Dialog.css deleted file mode 100644 index 0ea2d57..0000000 --- a/dist/assets/Dialog.css +++ /dev/null @@ -1 +0,0 @@ -._dialog_1hdv8_5{position:fixed;left:0;top:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center}._content_1hdv8_17{background-color:#252525;font-family:Consolas,monospace;font-size:1.1666666667em;display:flex;flex-direction:column}._header_1hdv8_25{display:flex;height:2em;line-height:1.928em;background-color:#00000080;-webkit-user-select:none;user-select:none}._title_1hdv8_33{display:inline;font-style:italic;margin-left:1rem;margin-right:2rem;flex-grow:1;opacity:.33}._body_1hdv8_42{margin:2rem 1rem;flex-grow:1}._footer_1hdv8_47{display:flex;flex-direction:row;justify-content:flex-end;padding:1rem;background-color:#00000040}._button_1hdv8_55{margin:0 1rem;height:2rem;min-width:6rem;text-align:center} diff --git a/dist/assets/Dimmer.css b/dist/assets/Dimmer.css deleted file mode 100644 index a327e0b..0000000 --- a/dist/assets/Dimmer.css +++ /dev/null @@ -1 +0,0 @@ -._dimmer_ldz2o_5{display:flex;justify-content:center;align-items:center;position:absolute;top:0;bottom:0;left:0;right:0;background-color:#000000bf;z-index:1} diff --git a/dist/assets/Divider.css b/dist/assets/Divider.css deleted file mode 100644 index 82d2e24..0000000 --- a/dist/assets/Divider.css +++ /dev/null @@ -1 +0,0 @@ -._horizontal_1dhv5_9{margin:.5em 0}._horizontal_1dhv5_9:not(._hidden_1dhv5_12){border-top:.1666666667em solid rgba(255,255,255,.1)}._vertical_1dhv5_16{height:100%;margin:0 .5em}._vertical_1dhv5_16:not(._hidden_1dhv5_12){border-left:.1666666667em solid rgba(255,255,255,.1)} diff --git a/dist/assets/Flex.css b/dist/assets/Flex.css deleted file mode 100644 index 881c68b..0000000 --- a/dist/assets/Flex.css +++ /dev/null @@ -1 +0,0 @@ -._flex_djoni_5{display:-ms-flexbox;display:flex}._inline_djoni_10{display:inline-flex} diff --git a/dist/assets/Icon.css b/dist/assets/Icon.css deleted file mode 100644 index 8a09bfa..0000000 --- a/dist/assets/Icon.css +++ /dev/null @@ -1,6 +0,0 @@ -/** - * @file - * @copyright 2020 - * @author ThePotato97 (https://github.com/ThePotato97) - * @license ISC - */._iconStack_bg05l_7>._icon_bg05l_7{position:absolute;width:100%;text-align:center}._iconStack_bg05l_7{position:relative;display:inline-block;height:1.2em;line-height:2em;vertical-align:middle}._iconStack_bg05l_7:after{color:transparent;content:"."} diff --git a/dist/assets/ImageButton.css b/dist/assets/ImageButton.css deleted file mode 100644 index 48d814b..0000000 --- a/dist/assets/ImageButton.css +++ /dev/null @@ -1,5 +0,0 @@ -/** - * @file - * @copyright 2024 Aylong (https://github.com/AyIong) - * @license MIT - */._color__black_7gau9_18{background-color:#0003;color:#fff;border:solid rgba(32,32,32,.2);border-width:1px;transition:background-color .2s,border-color .2s}._color__black_7gau9_18:hover{background-color:#20202033}._contentColor__black_7gau9_29{background-color:#000;color:#fff;border:solid #101010;border-width:1px 0 0 0;transition:background-color .2s,border-color .2s}._buttonsContainerColor__black_7gau9_37{background-color:#00000054;color:#fff;border:solid rgba(32,32,32,.2);border-width:1px 1px 1px 0;transition:background-color 0,border-color 0}._color__white_7gau9_45{background-color:#d9d9d933;color:#000;border:solid rgba(250,250,250,.2);border-width:1px;transition:background-color .2s,border-color .2s}._color__white_7gau9_45:hover{background-color:#fafafa33}._contentColor__white_7gau9_56{background-color:#d9d9d9;color:#000;border:solid #f8f8f8;border-width:1px 0 0 0;transition:background-color .2s,border-color .2s}._buttonsContainerColor__white_7gau9_64{background-color:#d9d9d954;color:#000;border:solid rgba(250,250,250,.2);border-width:1px 1px 1px 0;transition:background-color 0,border-color 0}._color__red_7gau9_72{background-color:#bd202033;color:#fff;border:solid rgba(227,112,112,.2);border-width:1px;transition:background-color .2s,border-color .2s}._color__red_7gau9_72:hover{background-color:#e3707033}._contentColor__red_7gau9_83{background-color:#bd2020;color:#fff;border:solid #d93f3f;border-width:1px 0 0 0;transition:background-color .2s,border-color .2s}._buttonsContainerColor__red_7gau9_91{background-color:#bd202054;color:#fff;border:solid rgba(227,112,112,.2);border-width:1px 1px 1px 0;transition:background-color 0,border-color 0}._color__orange_7gau9_99{background-color:#d95e0c33;color:#fff;border:solid rgba(244,162,107,.2);border-width:1px;transition:background-color .2s,border-color .2s}._color__orange_7gau9_99:hover{background-color:#f4a26b33}._contentColor__orange_7gau9_110{background-color:#d95e0c;color:#fff;border:solid #ef7e33;border-width:1px 0 0 0;transition:background-color .2s,border-color .2s}._buttonsContainerColor__orange_7gau9_118{background-color:#d95e0c54;color:#fff;border:solid rgba(244,162,107,.2);border-width:1px 1px 1px 0;transition:background-color 0,border-color 0}._color__yellow_7gau9_126{background-color:#d9b80433;color:#000;border:solid rgba(248,225,91,.2);border-width:1px;transition:background-color .2s,border-color .2s}._color__yellow_7gau9_126:hover{background-color:#f8e15b33}._contentColor__yellow_7gau9_137{background-color:#d9b804;color:#000;border:solid #f5d523;border-width:1px 0 0 0;transition:background-color .2s,border-color .2s}._buttonsContainerColor__yellow_7gau9_145{background-color:#d9b80454;color:#000;border:solid rgba(248,225,91,.2);border-width:1px 1px 1px 0;transition:background-color 0,border-color 0}._color__olive_7gau9_153{background-color:#9aad1433;color:#000;border:solid rgba(209,228,79,.2);border-width:1px;transition:background-color .2s,border-color .2s}._color__olive_7gau9_153:hover{background-color:#d1e44f33}._contentColor__olive_7gau9_164{background-color:#9aad14;color:#000;border:solid #bdd327;border-width:1px 0 0 0;transition:background-color .2s,border-color .2s}._buttonsContainerColor__olive_7gau9_172{background-color:#9aad1454;color:#000;border:solid rgba(209,228,79,.2);border-width:1px 1px 1px 0;transition:background-color 0,border-color 0}._color__green_7gau9_180{background-color:#1b963833;color:#fff;border:solid rgba(72,214,105,.2);border-width:1px;transition:background-color .2s,border-color .2s}._color__green_7gau9_180:hover{background-color:#48d66933}._contentColor__green_7gau9_191{background-color:#1b9638;color:#fff;border:solid #2fb94f;border-width:1px 0 0 0;transition:background-color .2s,border-color .2s}._buttonsContainerColor__green_7gau9_199{background-color:#1b963854;color:#fff;border:solid rgba(72,214,105,.2);border-width:1px 1px 1px 0;transition:background-color 0,border-color 0}._color__teal_7gau9_207{background-color:#009a9333;color:#fff;border:solid rgba(32,225,216,.2);border-width:1px;transition:background-color .2s,border-color .2s}._color__teal_7gau9_207:hover{background-color:#20e1d833}._contentColor__teal_7gau9_218{background-color:#009a93;color:#fff;border:solid #10bdb6;border-width:1px 0 0 0;transition:background-color .2s,border-color .2s}._buttonsContainerColor__teal_7gau9_226{background-color:#009a9354;color:#fff;border:solid rgba(32,225,216,.2);border-width:1px 1px 1px 0;transition:background-color 0,border-color 0}._color__blue_7gau9_234{background-color:#1c71b133;color:#fff;border:solid rgba(96,169,224,.2);border-width:1px;transition:background-color .2s,border-color .2s}._color__blue_7gau9_234:hover{background-color:#60a9e033}._contentColor__blue_7gau9_245{background-color:#1c71b1;color:#fff;border:solid #308fd6;border-width:1px 0 0 0;transition:background-color .2s,border-color .2s}._buttonsContainerColor__blue_7gau9_253{background-color:#1c71b154;color:#fff;border:solid rgba(96,169,224,.2);border-width:1px 1px 1px 0;transition:background-color 0,border-color 0}._color__violet_7gau9_261{background-color:#552dab33;color:#fff;border:solid rgba(149,119,215,.2);border-width:1px;transition:background-color .2s,border-color .2s}._color__violet_7gau9_261:hover{background-color:#9577d733}._contentColor__violet_7gau9_272{background-color:#552dab;color:#fff;border:solid #7249ca;border-width:1px 0 0 0;transition:background-color .2s,border-color .2s}._buttonsContainerColor__violet_7gau9_280{background-color:#552dab54;color:#fff;border:solid rgba(149,119,215,.2);border-width:1px 1px 1px 0;transition:background-color 0,border-color 0}._color__purple_7gau9_288{background-color:#8b2baa33;color:#fff;border:solid rgba(190,115,215,.2);border-width:1px;transition:background-color .2s,border-color .2s}._color__purple_7gau9_288:hover{background-color:#be73d733}._contentColor__purple_7gau9_299{background-color:#8b2baa;color:#fff;border:solid #aa46ca;border-width:1px 0 0 0;transition:background-color .2s,border-color .2s}._buttonsContainerColor__purple_7gau9_307{background-color:#8b2baa54;color:#fff;border:solid rgba(190,115,215,.2);border-width:1px 1px 1px 0;transition:background-color 0,border-color 0}._color__pink_7gau9_315{background-color:#cf208233;color:#fff;border:solid rgba(233,129,188,.2);border-width:1px;transition:background-color .2s,border-color .2s}._color__pink_7gau9_315:hover{background-color:#e981bc33}._contentColor__pink_7gau9_326{background-color:#cf2082;color:#fff;border:solid #e04ca0;border-width:1px 0 0 0;transition:background-color .2s,border-color .2s}._buttonsContainerColor__pink_7gau9_334{background-color:#cf208254;color:#fff;border:solid rgba(233,129,188,.2);border-width:1px 1px 1px 0;transition:background-color 0,border-color 0}._color__brown_7gau9_342{background-color:#8c583633;color:#fff;border:solid rgba(195,144,111,.2);border-width:1px;transition:background-color .2s,border-color .2s}._color__brown_7gau9_342:hover{background-color:#c3906f33}._contentColor__brown_7gau9_353{background-color:#8c5836;color:#fff;border:solid #ae724c;border-width:1px 0 0 0;transition:background-color .2s,border-color .2s}._buttonsContainerColor__brown_7gau9_361{background-color:#8c583654;color:#fff;border:solid rgba(195,144,111,.2);border-width:1px 1px 1px 0;transition:background-color 0,border-color 0}._color__grey_7gau9_369{background-color:#64646433;color:#fff;border:solid rgba(157,157,157,.2);border-width:1px;transition:background-color .2s,border-color .2s}._color__grey_7gau9_369:hover{background-color:#9d9d9d33}._contentColor__grey_7gau9_380{background-color:#646464;color:#fff;border:solid #818181;border-width:1px 0 0 0;transition:background-color .2s,border-color .2s}._buttonsContainerColor__grey_7gau9_388{background-color:#64646454;color:#fff;border:solid rgba(157,157,157,.2);border-width:1px 1px 1px 0;transition:background-color 0,border-color 0}._color__light-grey_7gau9_396{background-color:#91919133;color:#fff;border:solid rgba(213,213,213,.2);border-width:1px;transition:background-color .2s,border-color .2s}._color__light-grey_7gau9_396:hover{background-color:#d5d5d533}._contentColor__light-grey_7gau9_407{background-color:#919191;color:#fff;border:solid #b3b3b3;border-width:1px 0 0 0;transition:background-color .2s,border-color .2s}._buttonsContainerColor__light-grey_7gau9_415{background-color:#91919154;color:#fff;border:solid rgba(213,213,213,.2);border-width:1px 1px 1px 0;transition:background-color 0,border-color 0}._color__good_7gau9_423{background-color:#4d912133;color:#fff;border:solid rgba(130,208,79,.2);border-width:1px;transition:background-color .2s,border-color .2s}._color__good_7gau9_423:hover{background-color:#82d04f33}._contentColor__good_7gau9_434{background-color:#4d9121;color:#fff;border:solid #67b335;border-width:1px 0 0 0;transition:background-color .2s,border-color .2s}._buttonsContainerColor__good_7gau9_442{background-color:#4d912154;color:#fff;border:solid rgba(130,208,79,.2);border-width:1px 1px 1px 0;transition:background-color 0,border-color 0}._color__average_7gau9_450{background-color:#cd7a0d33;color:#fff;border:solid rgba(241,178,96,.2);border-width:1px;transition:background-color .2s,border-color .2s}._color__average_7gau9_450:hover{background-color:#f1b26033}._contentColor__average_7gau9_461{background-color:#cd7a0d;color:#fff;border:solid #eb972b;border-width:1px 0 0 0;transition:background-color .2s,border-color .2s}._buttonsContainerColor__average_7gau9_469{background-color:#cd7a0d54;color:#fff;border:solid rgba(241,178,96,.2);border-width:1px 1px 1px 0;transition:background-color 0,border-color 0}._color__bad_7gau9_477{background-color:#bd202033;color:#fff;border:solid rgba(227,112,112,.2);border-width:1px;transition:background-color .2s,border-color .2s}._color__bad_7gau9_477:hover{background-color:#e3707033}._contentColor__bad_7gau9_488{background-color:#bd2020;color:#fff;border:solid #d93f3f;border-width:1px 0 0 0;transition:background-color .2s,border-color .2s}._buttonsContainerColor__bad_7gau9_496{background-color:#bd202054;color:#fff;border:solid rgba(227,112,112,.2);border-width:1px 1px 1px 0;transition:background-color 0,border-color 0}._color__label_7gau9_504{background-color:#657a9433;color:#fff;border:solid rgba(175,186,201,.2);border-width:1px;transition:background-color .2s,border-color .2s}._color__label_7gau9_504:hover{background-color:#afbac933}._contentColor__label_7gau9_515{background-color:#657a94;color:#fff;border:solid #8a9aae;border-width:1px 0 0 0;transition:background-color .2s,border-color .2s}._buttonsContainerColor__label_7gau9_523{background-color:#657a9454;color:#fff;border:solid rgba(175,186,201,.2);border-width:1px 1px 1px 0;transition:background-color 0,border-color 0}._color__default_7gau9_531{background-color:#35353533;color:#fff;border:solid rgba(99,99,99,.2);border-width:1px;transition:background-color .2s,border-color .2s}._color__default_7gau9_531:hover{background-color:#63636333}._disabled_7gau9_542{background-color:#631d1d40!important;border-color:#631d1d40!important}._selected_7gau9_547{background-color:#1b963833;color:#fff;border:solid rgba(27,150,56,.25);border-width:1px;transition:background-color .2s,border-color .2s}._selected_7gau9_547:hover{background-color:#48d66933}._contentColor__default_7gau9_558{background-color:#313131;color:#fff;border:solid #404040;border-width:1px 0 0 0;transition:background-color .2s,border-color .2s}._contentDisabled_7gau9_566{background-color:#631d1d!important;border-top:1px solid #803131!important}._contentSelected_7gau9_571{background-color:#1b9638;color:#fff;border:solid #2fb94f;border-width:1px 0 0 0;transition:background-color .2s,border-color .2s}._buttonsContainerColor__default_7gau9_579{background-color:#35353533;color:#fff;border:solid rgba(99,99,99,.2);border-width:1px 1px 1px 0;transition:background-color 0,border-color 0}._ImageButton_7gau9_587{display:inline-table;position:relative;text-align:center;margin:.25em;-webkit-user-select:none;user-select:none;-ms-user-select:none}._ImageButton_7gau9_587 ._noAction_7gau9_595{pointer-events:none}._ImageButton_7gau9_587 ._container_7gau9_598{display:flex;flex-direction:column;border-radius:.33em}._ImageButton_7gau9_587 ._image_7gau9_603{position:relative;align-self:center;pointer-events:none;overflow:hidden;line-height:0;padding:.25em;border-radius:.33em}._ImageButton_7gau9_587 ._buttonsContainer_7gau9_37{display:flex;position:absolute;overflow:hidden;left:1px;bottom:1.8em;max-width:100%;z-index:1}._ImageButton_7gau9_587 ._buttonsContainer_7gau9_37._buttonsAltContainer_7gau9_621{overflow:visible;flex-direction:column;pointer-events:none;top:1px;bottom:inherit!important}._ImageButton_7gau9_587 ._buttonsContainer_7gau9_37._buttonsEmpty_7gau9_628{bottom:1px}._ImageButton_7gau9_587 ._buttonsContainer_7gau9_37>*{margin:0!important;padding:0 .2em!important;border-radius:0!important}._ImageButton_7gau9_587 ._content_7gau9_29{-ms-user-select:none;-webkit-user-select:none;user-select:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:.25em .5em;margin:-1px;border-radius:0 0 .33em .33em;z-index:2}._fluid_7gau9_649{display:flex;flex-direction:row;position:relative;text-align:center;margin:0 0 .5em;-webkit-user-select:none;user-select:none;-ms-user-select:none}._fluid_7gau9_649:last-child{margin-bottom:0}._fluid_7gau9_649 ._info_7gau9_661{display:flex;flex-direction:column;justify-content:center;flex:1}._fluid_7gau9_649 ._title_7gau9_667{font-weight:700;padding:.5em}._fluid_7gau9_649 ._title_7gau9_667._divider_7gau9_671{margin:0 .5em;border-bottom:.1666666667em solid rgba(255,255,255,.1)}._fluid_7gau9_649 ._contentFluid_7gau9_675{padding:.5em;color:#fff}._fluid_7gau9_649 ._container_7gau9_598{flex-direction:row;flex:1}._fluid_7gau9_649 ._container_7gau9_598._hasButtons_7gau9_683{border-radius:.33em 0 0 .33em;border-width:1px 0 1px 1px}._fluid_7gau9_649 ._image_7gau9_603{padding:0}._fluid_7gau9_649 ._buttonsContainer_7gau9_37{position:relative;left:inherit;bottom:inherit;border-radius:0 .33em .33em 0}._fluid_7gau9_649 ._buttonsContainer_7gau9_37._buttonsEmpty_7gau9_628{bottom:inherit}._fluid_7gau9_649 ._buttonsContainer_7gau9_37._buttonsAltContainer_7gau9_621{overflow:hidden;pointer-events:auto;top:inherit}._fluid_7gau9_649 ._buttonsContainer_7gau9_37._buttonsAltContainer_7gau9_621>*{border-top:1px solid rgba(255,255,255,.075)}._fluid_7gau9_649 ._buttonsContainer_7gau9_37._buttonsAltContainer_7gau9_621>*:first-child{border-top:0}._fluid_7gau9_649 ._buttonsContainer_7gau9_37>*{display:inline-flex;flex-direction:column;justify-content:center;text-align:center;white-space:pre-wrap;line-height:1.1666666667em;height:100%;border-left:1px solid rgba(255,255,255,.075)} diff --git a/dist/assets/Input.css b/dist/assets/Input.css deleted file mode 100644 index 2c23d3f..0000000 --- a/dist/assets/Input.css +++ /dev/null @@ -1 +0,0 @@ -._input_17i79_20{position:relative;display:inline-block;width:10em;border:.0833333333em solid #88bfff;border:.0833333333em solid rgba(136,191,255,.75);border-radius:.16em;color:#fff;background-color:#0a0a0a;padding:0 .3333333333em;margin-right:.1666666667em;line-height:1.4166666667em;overflow:visible}._fluid_17i79_35{display:block;width:auto}._baseline_17i79_40{display:inline-block;color:transparent}._inner_17i79_45{display:block;position:absolute;top:0;bottom:0;left:0;right:0;border:0;outline:0;width:100%;font-size:1em;line-height:1.4166666667em;height:1.4166666667em;margin:0;padding:0 .5em;font-family:Verdana,sans-serif;background-color:transparent;color:#fff;color:inherit}._inner_17i79_45:-ms-input-placeholder{font-style:italic;color:#777;color:#ffffff73}._monospace_17i79_71 ._inner_17i79_45{font-family:Consolas,monospace} diff --git a/dist/assets/Knob.css b/dist/assets/Knob.css deleted file mode 100644 index d5c6dd0..0000000 --- a/dist/assets/Knob.css +++ /dev/null @@ -1 +0,0 @@ -._knob_69dqe_17{position:relative;font-size:1rem;width:2.6em;height:2.6em;margin:0 auto -.2em;cursor:n-resize}._knob_69dqe_17:after{content:".";color:transparent;line-height:2.5em}._circle_69dqe_32{position:absolute;top:.1em;bottom:.1em;left:.1em;right:.1em;margin:.3em;background-color:#333;background-image:linear-gradient(to bottom,#ffffff26,#fff0);border-radius:50%;box-shadow:0 .05em .5em #00000080}._cursorBox_69dqe_45{position:absolute;top:0;bottom:0;left:0;right:0}._cursor_69dqe_45{position:relative;top:.05em;margin:0 auto;width:.2em;height:.8em;background-color:#ffffffe6}._popupValue_69dqe_62{position:absolute;top:-2rem;right:50%;font-size:1rem;text-align:center;padding:.25rem .5rem;color:#fff;background-color:#000;transform:translate(50%);white-space:nowrap}._ring_69dqe_75{position:absolute;top:0;bottom:0;left:0;right:0;padding:.1em}._ringTrackPivot_69dqe_84{transform:rotate(135deg)}._ringTrack_69dqe_84{fill:transparent;stroke:#ffffff1a;stroke-width:8;stroke-linecap:round;stroke-dasharray:235.62}._ringFillPivot_69dqe_96{transform:rotate(135deg)}._bipolar_69dqe_100 ._ringFillPivot_69dqe_96{transform:rotate(270deg)}._ringFill_69dqe_96{fill:transparent;stroke:#6a96c9;stroke-width:8;stroke-linecap:round;stroke-dasharray:314.16;transition:stroke 50ms ease-out}._color__black_69dqe_113 ._ringFill_69dqe_96{stroke:#1a1a1a}._color__white_69dqe_117 ._ringFill_69dqe_96{stroke:#fff}._color__red_69dqe_121 ._ringFill_69dqe_96{stroke:#df3e3e}._color__orange_69dqe_125 ._ringFill_69dqe_96{stroke:#f37f33}._color__yellow_69dqe_129 ._ringFill_69dqe_96{stroke:#fbda21}._color__olive_69dqe_133 ._ringFill_69dqe_96{stroke:#cbe41c}._color__green_69dqe_137 ._ringFill_69dqe_96{stroke:#25ca4c}._color__teal_69dqe_141 ._ringFill_69dqe_96{stroke:#00d6cc}._color__blue_69dqe_145 ._ringFill_69dqe_96{stroke:#2e93de}._color__violet_69dqe_149 ._ringFill_69dqe_96{stroke:#7349cf}._color__purple_69dqe_153 ._ringFill_69dqe_96{stroke:#ad45d0}._color__pink_69dqe_157 ._ringFill_69dqe_96{stroke:#e34da1}._color__brown_69dqe_161 ._ringFill_69dqe_96{stroke:#b97447}._color__grey_69dqe_165 ._ringFill_69dqe_96{stroke:#848484}._color__light-grey_69dqe_169 ._ringFill_69dqe_96{stroke:#b3b3b3}._color__good_69dqe_173 ._ringFill_69dqe_96{stroke:#68c22d}._color__average_69dqe_177 ._ringFill_69dqe_96{stroke:#f29a29}._color__bad_69dqe_181 ._ringFill_69dqe_96{stroke:#df3e3e}._color__label_69dqe_185 ._ringFill_69dqe_96{stroke:#8b9bb0} diff --git a/dist/assets/LabeledList.css b/dist/assets/LabeledList.css deleted file mode 100644 index afe0745..0000000 --- a/dist/assets/LabeledList.css +++ /dev/null @@ -1 +0,0 @@ -._labeledList_pb6nb_9{display:table;width:100%;width:calc(100% + 1em);border-collapse:collapse;border-spacing:0;margin:-.25em -.5em 0;padding:0}._row_pb6nb_20{display:table-row}._row_pb6nb_20:last-child ._cell_pb6nb_24{padding-bottom:0}._cell_pb6nb_24{display:table-cell;margin:0;padding:.25em .5em;border:0;text-align:left}._label__nowrap_pb6nb_36{width:1%;white-space:nowrap;min-width:5em}._buttons_pb6nb_42{width:.1%;white-space:nowrap;text-align:right;padding-top:.0833333333em;padding-bottom:0} diff --git a/dist/assets/MenuBar.css b/dist/assets/MenuBar.css deleted file mode 100644 index b070989..0000000 --- a/dist/assets/MenuBar.css +++ /dev/null @@ -1 +0,0 @@ -._menuBar_esza9_9{display:flex}._font_esza9_13{font-family:Verdana,sans-serif;font-size:1em;line-height:1.4166666667em}._hover_esza9_19:hover{background-color:#727272;transition:background-color 0ms}._button_esza9_24{padding:.2rem .5rem}._menu_esza9_9{position:absolute;z-index:5;background-color:#252525;padding:.3rem;box-shadow:4px 6px 5px -2px #0000008c}._item_esza9_36{z-index:5;transition:background-color .1s ease-out;background-color:#252525;white-space:nowrap;padding:.3rem 2rem .3rem 3rem}._toggle_esza9_44{padding:.3rem 2rem .3rem 0}._toggle__check_esza9_48{display:inline-block;vertical-align:middle;min-width:3rem;margin-left:.3rem}._over_esza9_55{top:auto;bottom:100%}._button__text_esza9_60{text-overflow:clip;white-space:nowrap;height:1.4166666667em}._separator_esza9_66{display:block;margin:.3rem .3rem .3rem 2.3rem;border-top:1px solid rgba(0,0,0,.33)} diff --git a/dist/assets/Modal.css b/dist/assets/Modal.css deleted file mode 100644 index c6c3a64..0000000 --- a/dist/assets/Modal.css +++ /dev/null @@ -1 +0,0 @@ -._modal_1e7qt_9{background-color:#252525;max-width:calc(100% - 1rem);padding:1rem} diff --git a/dist/assets/NoticeBox.css b/dist/assets/NoticeBox.css deleted file mode 100644 index 7f618ff..0000000 --- a/dist/assets/NoticeBox.css +++ /dev/null @@ -1 +0,0 @@ -._noticeBox_56yom_17{padding:.33em .5em;margin-bottom:.5em;box-shadow:none;font-weight:700;font-style:italic;color:#000;background-color:#bb9b68;background-image:repeating-linear-gradient(-45deg,transparent,transparent .8333333333em,rgba(0,0,0,.1) .8333333333em,rgba(0,0,0,.1) 1.6666666667em)}._color__black_56yom_28{color:#fff;background-color:#000}._color__white_56yom_33{color:#000;background-color:#b3b3b3}._color__red_56yom_38{color:#fff;background-color:#701f1f}._color__orange_56yom_43{color:#fff;background-color:#854114}._color__yellow_56yom_48{color:#000;background-color:#83710d}._color__olive_56yom_53{color:#000;background-color:#576015}._color__green_56yom_58{color:#fff;background-color:#174e24}._color__teal_56yom_63{color:#fff;background-color:#064845}._color__blue_56yom_68{color:#fff;background-color:#1b4565}._color__violet_56yom_73{color:#fff;background-color:#3b2864}._color__purple_56yom_78{color:#fff;background-color:#542663}._color__pink_56yom_83{color:#fff;background-color:#802257}._color__brown_56yom_88{color:#fff;background-color:#4c3729}._color__grey_56yom_93{color:#fff;background-color:#3e3e3e}._color__light-grey_56yom_98{color:#fff;background-color:#6a6a6a}._color__good_56yom_103{color:#fff;background-color:#2e4b1a}._color__average_56yom_108{color:#fff;background-color:#7b4e13}._color__bad_56yom_113{color:#fff;background-color:#701f1f}._color__label_56yom_118{color:#fff;background-color:#53565a}._info_56yom_123{color:#fff;background-color:#235982}._success_56yom_128{color:#fff;background-color:#1e662f}._warning_56yom_133{color:#fff;background-color:#a95219}._danger_56yom_138{color:#fff;background-color:#8f2828} diff --git a/dist/assets/NumberInput.css b/dist/assets/NumberInput.css deleted file mode 100644 index 73339b1..0000000 --- a/dist/assets/NumberInput.css +++ /dev/null @@ -1 +0,0 @@ -._numberInput_4xyrw_20{position:relative;display:inline-block;border:.0833333333em solid #88bfff;border:.0833333333em solid rgba(136,191,255,.75);border-radius:.16em;color:#88bfff;background-color:#0a0a0a;padding:0 .3333333333em;margin-right:.1666666667em;line-height:1.4166666667em;text-align:right;overflow:visible;cursor:n-resize}._fluid_4xyrw_36{display:block}._content_4xyrw_40{margin-left:.5em}._barContainer_4xyrw_44{position:absolute;top:.1666666667em;bottom:.1666666667em;left:.1666666667em}._bar_4xyrw_44{position:absolute;bottom:0;left:0;width:.25em;box-sizing:border-box;border-bottom:.0833333333em solid #88bfff;background-color:#88bfff}._inner_4xyrw_61{display:block;position:absolute;top:0;bottom:0;left:0;right:0;border:0;outline:0;width:100%;font-size:1em;line-height:1.4166666667em;height:1.4166666667em;margin:0;padding:0 .5em;font-family:Verdana,sans-serif;background-color:#0a0a0a;color:#fff;text-align:right} diff --git a/dist/assets/ProgressBar.css b/dist/assets/ProgressBar.css deleted file mode 100644 index 27913b7..0000000 --- a/dist/assets/ProgressBar.css +++ /dev/null @@ -1 +0,0 @@ -._progressBar_140lk_17{display:inline-block;position:relative;width:100%;padding:0 .5em;border-width:.0833333333em!important;border-style:solid!important;border-radius:.16em;background-color:#0000;transition:border-color .9s ease-out}._fill_140lk_29{position:absolute;top:-.5px;left:0;bottom:-.5px}._fill__animated_140lk_36{transition:background-color .9s ease-out,width .9s ease-out}._content_140lk_40{position:relative;line-height:1.4166666667em;width:100%;text-align:right}._color__default_140lk_47{border:.0833333333em solid #3e6189}._color__default_140lk_47 ._fill_140lk_29{background-color:#3e6189}._color__black_140lk_54{border-color:#000!important}._color__black_140lk_54 ._fill_140lk_29{background-color:#000}._color__white_140lk_61{border-color:#d9d9d9!important}._color__white_140lk_61 ._fill_140lk_29{background-color:#d9d9d9}._color__red_140lk_68{border-color:#bd2020!important}._color__red_140lk_68 ._fill_140lk_29{background-color:#bd2020}._color__orange_140lk_75{border-color:#d95e0c!important}._color__orange_140lk_75 ._fill_140lk_29{background-color:#d95e0c}._color__yellow_140lk_82{border-color:#d9b804!important}._color__yellow_140lk_82 ._fill_140lk_29{background-color:#d9b804}._color__olive_140lk_89{border-color:#9aad14!important}._color__olive_140lk_89 ._fill_140lk_29{background-color:#9aad14}._color__green_140lk_96{border-color:#1b9638!important}._color__green_140lk_96 ._fill_140lk_29{background-color:#1b9638}._color__teal_140lk_103{border-color:#009a93!important}._color__teal_140lk_103 ._fill_140lk_29{background-color:#009a93}._color__blue_140lk_110{border-color:#1c71b1!important}._color__blue_140lk_110 ._fill_140lk_29{background-color:#1c71b1}._color__violet_140lk_117{border-color:#552dab!important}._color__violet_140lk_117 ._fill_140lk_29{background-color:#552dab}._color__purple_140lk_124{border-color:#8b2baa!important}._color__purple_140lk_124 ._fill_140lk_29{background-color:#8b2baa}._color__pink_140lk_131{border-color:#cf2082!important}._color__pink_140lk_131 ._fill_140lk_29{background-color:#cf2082}._color__brown_140lk_138{border-color:#8c5836!important}._color__brown_140lk_138 ._fill_140lk_29{background-color:#8c5836}._color__grey_140lk_145{border-color:#646464!important}._color__grey_140lk_145 ._fill_140lk_29{background-color:#646464}._color__light-grey_140lk_152{border-color:#919191!important}._color__light-grey_140lk_152 ._fill_140lk_29{background-color:#919191}._color__good_140lk_159{border-color:#4d9121!important}._color__good_140lk_159 ._fill_140lk_29{background-color:#4d9121}._color__average_140lk_166{border-color:#cd7a0d!important}._color__average_140lk_166 ._fill_140lk_29{background-color:#cd7a0d}._color__bad_140lk_173{border-color:#bd2020!important}._color__bad_140lk_173 ._fill_140lk_29{background-color:#bd2020}._color__label_140lk_180{border-color:#657a94!important}._color__label_140lk_180 ._fill_140lk_29{background-color:#657a94} diff --git a/dist/assets/RoundGauge.css b/dist/assets/RoundGauge.css deleted file mode 100644 index ee1328f..0000000 --- a/dist/assets/RoundGauge.css +++ /dev/null @@ -1 +0,0 @@ -._roundGauge_gktag_17{font-size:1rem;width:2.6em;height:1.3em;margin:0 auto .2em}._ringTrack_gktag_25{fill:transparent;stroke:#ffffff1a;stroke-width:10;stroke-dasharray:157.08;stroke-dashoffset:157.08}._ringFill_gktag_33{fill:transparent;stroke:#6a96c9;stroke-width:10;stroke-dasharray:314.16;transition:stroke 50ms ease-out}._needle_gktag_41,._ringFill_gktag_33{transition:transform 50ms ease-in-out}._needleLine_gktag_46,._needleMiddle_gktag_47{fill:#db2828}._alert_gktag_51{fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;fill:#ffffff1a}._alert_gktag_51._max_gktag_59{fill:#db2828}._color__black_gktag_63._ringFill_gktag_33{stroke:#1a1a1a}._color__white_gktag_67._ringFill_gktag_33{stroke:#fff}._color__red_gktag_71._ringFill_gktag_33{stroke:#df3e3e}._color__orange_gktag_75._ringFill_gktag_33{stroke:#f37f33}._color__yellow_gktag_79._ringFill_gktag_33{stroke:#fbda21}._color__olive_gktag_83._ringFill_gktag_33{stroke:#cbe41c}._color__green_gktag_87._ringFill_gktag_33{stroke:#25ca4c}._color__teal_gktag_91._ringFill_gktag_33{stroke:#00d6cc}._color__blue_gktag_95._ringFill_gktag_33{stroke:#2e93de}._color__violet_gktag_99._ringFill_gktag_33{stroke:#7349cf}._color__purple_gktag_103._ringFill_gktag_33{stroke:#ad45d0}._color__pink_gktag_107._ringFill_gktag_33{stroke:#e34da1}._color__brown_gktag_111._ringFill_gktag_33{stroke:#b97447}._color__grey_gktag_115._ringFill_gktag_33{stroke:#848484}._color__light-grey_gktag_119._ringFill_gktag_33{stroke:#b3b3b3}._color__good_gktag_123._ringFill_gktag_33{stroke:#68c22d}._color__average_gktag_127._ringFill_gktag_33{stroke:#f29a29}._color__bad_gktag_131._ringFill_gktag_33{stroke:#df3e3e}._color__label_gktag_135._ringFill_gktag_33{stroke:#8b9bb0}._alert__black_gktag_139{fill:#1a1a1a;transition:opacity .6s cubic-bezier(.25,1,.5,1);animation:_alertAnim_gktag_1 1s cubic-bezier(.34,1.56,.64,1) infinite}._alert__white_gktag_145{fill:#fff;transition:opacity .6s cubic-bezier(.25,1,.5,1);animation:_alertAnim_gktag_1 1s cubic-bezier(.34,1.56,.64,1) infinite}._alert__red_gktag_151{fill:#df3e3e;transition:opacity .6s cubic-bezier(.25,1,.5,1);animation:_alertAnim_gktag_1 1s cubic-bezier(.34,1.56,.64,1) infinite}._alert__orange_gktag_157{fill:#f37f33;transition:opacity .6s cubic-bezier(.25,1,.5,1);animation:_alertAnim_gktag_1 1s cubic-bezier(.34,1.56,.64,1) infinite}._alert__yellow_gktag_163{fill:#fbda21;transition:opacity .6s cubic-bezier(.25,1,.5,1);animation:_alertAnim_gktag_1 1s cubic-bezier(.34,1.56,.64,1) infinite}._alert__olive_gktag_169{fill:#cbe41c;transition:opacity .6s cubic-bezier(.25,1,.5,1);animation:_alertAnim_gktag_1 1s cubic-bezier(.34,1.56,.64,1) infinite}._alert__green_gktag_175{fill:#25ca4c;transition:opacity .6s cubic-bezier(.25,1,.5,1);animation:_alertAnim_gktag_1 1s cubic-bezier(.34,1.56,.64,1) infinite}._alert__teal_gktag_181{fill:#00d6cc;transition:opacity .6s cubic-bezier(.25,1,.5,1);animation:_alertAnim_gktag_1 1s cubic-bezier(.34,1.56,.64,1) infinite}._alert__blue_gktag_187{fill:#2e93de;transition:opacity .6s cubic-bezier(.25,1,.5,1);animation:_alertAnim_gktag_1 1s cubic-bezier(.34,1.56,.64,1) infinite}._alert__violet_gktag_193{fill:#7349cf;transition:opacity .6s cubic-bezier(.25,1,.5,1);animation:_alertAnim_gktag_1 1s cubic-bezier(.34,1.56,.64,1) infinite}._alert__purple_gktag_199{fill:#ad45d0;transition:opacity .6s cubic-bezier(.25,1,.5,1);animation:_alertAnim_gktag_1 1s cubic-bezier(.34,1.56,.64,1) infinite}._alert__pink_gktag_205{fill:#e34da1;transition:opacity .6s cubic-bezier(.25,1,.5,1);animation:_alertAnim_gktag_1 1s cubic-bezier(.34,1.56,.64,1) infinite}._alert__brown_gktag_211{fill:#b97447;transition:opacity .6s cubic-bezier(.25,1,.5,1);animation:_alertAnim_gktag_1 1s cubic-bezier(.34,1.56,.64,1) infinite}._alert__grey_gktag_217{fill:#848484;transition:opacity .6s cubic-bezier(.25,1,.5,1);animation:_alertAnim_gktag_1 1s cubic-bezier(.34,1.56,.64,1) infinite}._alert__light-grey_gktag_223{fill:#b3b3b3;transition:opacity .6s cubic-bezier(.25,1,.5,1);animation:_alertAnim_gktag_1 1s cubic-bezier(.34,1.56,.64,1) infinite}._alert__good_gktag_229{fill:#68c22d;transition:opacity .6s cubic-bezier(.25,1,.5,1);animation:_alertAnim_gktag_1 1s cubic-bezier(.34,1.56,.64,1) infinite}._alert__average_gktag_235{fill:#f29a29;transition:opacity .6s cubic-bezier(.25,1,.5,1);animation:_alertAnim_gktag_1 1s cubic-bezier(.34,1.56,.64,1) infinite}._alert__bad_gktag_241{fill:#df3e3e;transition:opacity .6s cubic-bezier(.25,1,.5,1);animation:_alertAnim_gktag_1 1s cubic-bezier(.34,1.56,.64,1) infinite}._alert__label_gktag_247{fill:#8b9bb0;transition:opacity .6s cubic-bezier(.25,1,.5,1);animation:_alertAnim_gktag_1 1s cubic-bezier(.34,1.56,.64,1) infinite}@keyframes _alertAnim_gktag_1{0%{opacity:.1}50%{opacity:1}to{opacity:.1}} diff --git a/dist/assets/Section.css b/dist/assets/Section.css deleted file mode 100644 index 5cdd3be..0000000 --- a/dist/assets/Section.css +++ /dev/null @@ -1 +0,0 @@ -._section_10c68_17{position:relative;margin-bottom:.5em;background-color:#191919;background-color:#00000054;box-sizing:border-box}._section_10c68_17:last-child{margin-bottom:0}._title_10c68_28{position:relative;padding:.5em;border-bottom:.1666666667em solid #4972a1}._titleText_10c68_34{font-size:1.1666666667em;font-weight:700;color:#fff}._buttons_10c68_40{position:absolute;display:inline-block;right:.5em;margin-top:-.0833333333em}._rest_10c68_47{position:relative}._content_10c68_51{padding:.66em .5em}._fitted_10c68_55>._rest_10c68_47>._content_10c68_51{padding:0}._fill_10c68_59{display:flex;flex-direction:column;height:100%}._fill_10c68_59>._rest_10c68_47{flex-grow:1}._fill_10c68_59>._rest_10c68_47>._content_10c68_51{height:100%}._fill_10c68_59._scrollable_10c68_73>._rest_10c68_47>._content_10c68_51{position:absolute;top:0;left:0;right:0;bottom:0}._scrollable_10c68_73{overflow-x:hidden;overflow-y:hidden}._scrollable_10c68_73>._rest_10c68_47>._content_10c68_51{overflow-y:scroll;overflow-x:hidden}._scrollableHorizontal_10c68_90{overflow-x:hidden;overflow-y:hidden}._scrollableHorizontal_10c68_90>._rest_10c68_47>._content_10c68_51{overflow-y:hidden;overflow-x:scroll}._scrollable_10c68_73._scrollableHorizontal_10c68_90{overflow-x:hidden;overflow-y:hidden}._scrollable_10c68_73._scrollableHorizontal_10c68_90>._rest_10c68_47>._content_10c68_51{overflow-y:scroll;overflow-x:scroll}._section_10c68_17 ._section_10c68_17{background-color:transparent;margin-left:-.5em;margin-right:-.5em}._section_10c68_17 ._section_10c68_17:first-child{margin-top:-.5em}._section_10c68_17 ._section_10c68_17 ._titleText_10c68_34{font-size:1.0833333333em}._section_10c68_17 ._section_10c68_17 ._section_10c68_17 ._titleText_10c68_34{font-size:1em}._section__flex_10c68_125{display:flex;flex-flow:column}._section__flex_10c68_125 ._content_10c68_51{overflow:auto;flex-grow:1}._content__noTopPadding_10c68_135{padding-top:0}._content__stretchContents_10c68_139{height:calc(100% - 3rem)} diff --git a/dist/assets/Slider.css b/dist/assets/Slider.css deleted file mode 100644 index 10c2328..0000000 --- a/dist/assets/Slider.css +++ /dev/null @@ -1 +0,0 @@ -._slider_1assx_9{cursor:e-resize}._cursorOffset_1assx_13{position:absolute;top:0;left:0;bottom:0;transition:none!important}._cursor_1assx_13{position:absolute;top:0;right:-.0833333333em;bottom:0;width:0;border-left:.1666666667em solid #ffffff}._pointer_1assx_30{position:absolute;right:-.4166666667em;bottom:-.3333333333em;width:0;height:0;border-left:.4166666667em solid transparent;border-right:.4166666667em solid transparent;border-bottom:.4166666667em solid #ffffff}._popupValue_1assx_41{position:absolute;right:0;top:-2rem;font-size:1rem;padding:.25rem .5rem;color:#fff;background-color:#000;transform:translate(50%);white-space:nowrap} diff --git a/dist/assets/Stack.css b/dist/assets/Stack.css deleted file mode 100644 index f4b630d..0000000 --- a/dist/assets/Stack.css +++ /dev/null @@ -1 +0,0 @@ -._fill_wrul1_9{height:100%}._horizontal_wrul1_13>._item_wrul1_13{margin-left:.5em}._horizontal_wrul1_13>._item_wrul1_13:first-child{margin-left:0}._vertical_wrul1_20>._item_wrul1_13{margin-top:.5em}._vertical_wrul1_20>._item_wrul1_13:first-child{margin-top:0}._reverse_wrul1_27>._item_wrul1_13{margin-left:0;margin-right:.5em}._reverse_wrul1_27>._item_wrul1_13:first-child{margin-right:0}._reverse__vertical_wrul1_35>._item_wrul1_13{margin-top:0;margin-bottom:.5em}._reverse__vertical_wrul1_35>._item_wrul1_13:first-child{margin-bottom:0}._zebra_wrul1_43>._item_wrul1_13:nth-child(2n){background-color:#00000054}._horizontal_wrul1_13>._divider_wrul1_47:not(._divider__hidden_wrul1_47){border-left:.1666666667em solid rgba(255,255,255,.1)}._vertical_wrul1_20>._divider_wrul1_47:not(._divider__hidden_wrul1_47){border-top:.1666666667em solid rgba(255,255,255,.1)} diff --git a/dist/assets/Table.css b/dist/assets/Table.css deleted file mode 100644 index a884c04..0000000 --- a/dist/assets/Table.css +++ /dev/null @@ -1 +0,0 @@ -._table_1hctn_5{display:table;width:100%;border-collapse:collapse;border-spacing:0;margin:0}._collapsing_1hctn_13{width:auto}._row_1hctn_17{display:table-row}._cell_1hctn_21{display:table-cell;padding:0 .25em}._cell_1hctn_21:first-child{padding-left:0}._cell_1hctn_21:last-child{padding-right:0}._row__header_1hctn_32 ._cell_1hctn_21,._cell__header_1hctn_33{font-weight:700;padding-bottom:.5em}._cell__collapsing_1hctn_38{width:1%;white-space:nowrap} diff --git a/dist/assets/Tabs.css b/dist/assets/Tabs.css deleted file mode 100644 index ab32092..0000000 --- a/dist/assets/Tabs.css +++ /dev/null @@ -1 +0,0 @@ -._tabs_9h380_13{display:flex;align-items:stretch;overflow:hidden;background-color:#00000054}._fill_9h380_20{height:100%}.section ._tabs_9h380_13{background-color:transparent}.section:not(.section--fitted) ._tabs_9h380_13{margin:0 -.5em .5em}.section:not(.section--fitted) ._tabs_9h380_13:first-child{margin-top:-.5em}._vertical_9h380_35{flex-direction:column;padding:.25em 0 .25em .25em}._horizontal_9h380_40{margin-bottom:.5em;padding:.25em .25em 0}._horizontal_9h380_40:last-child{margin-bottom:0}._tabs__tab_9h380_48{flex-grow:0}._fluid_9h380_52 ._tabs__tab_9h380_48{flex-grow:1}._tab_9h380_13{display:flex;align-items:center;justify-content:space-between;background-color:transparent;color:#ffffff80;min-height:2.25em;min-width:4em}._tab_9h380_13:not(._selected_9h380_66):hover{background-color:#ffffff13}._selected_9h380_66{background-color:#ffffff20;color:#dfe7f0}._tab__text_9h380_75{flex-grow:1;margin:0 .5em}._tab__left_9h380_80{min-width:1.5em;text-align:center;margin-left:.25em}._tab__right_9h380_86{min-width:1.5em;text-align:center;margin-right:.25em}._horizontal_9h380_40 ._tab_9h380_13{border-top:.1666666667em solid transparent;border-bottom:.1666666667em solid transparent;border-top-left-radius:.25em;border-top-right-radius:.25em}._horizontal_9h380_40 ._selected_9h380_66{border-bottom:.1666666667em solid #d4dfec}._vertical_9h380_35 ._tab_9h380_13{min-height:2em;border-left:.1666666667em solid transparent;border-right:.1666666667em solid transparent;border-top-left-radius:.25em;border-bottom-left-radius:.25em}._vertical_9h380_35 ._selected_9h380_66{border-right:.1666666667em solid #d4dfec}._selected_9h380_66._color__black_9h380_113{color:#535353}._horizontal_9h380_40 ._selected_9h380_66 ._color__black_9h380_113{border-bottom-color:#1a1a1a}._vertical_9h380_35 ._selected_9h380_66 ._color__black_9h380_113{border-right-color:#1a1a1a}._selected_9h380_66._color__white_9h380_125{color:#fff}._horizontal_9h380_40 ._selected_9h380_66 ._color__white_9h380_125{border-bottom-color:#fff}._vertical_9h380_35 ._selected_9h380_66 ._color__white_9h380_125{border-right-color:#fff}._selected_9h380_66._color__red_9h380_137{color:#e76e6e}._horizontal_9h380_40 ._selected_9h380_66 ._color__red_9h380_137{border-bottom-color:#df3e3e}._vertical_9h380_35 ._selected_9h380_66 ._color__red_9h380_137{border-right-color:#df3e3e}._selected_9h380_66._color__orange_9h380_149{color:#f69f66}._horizontal_9h380_40 ._selected_9h380_66 ._color__orange_9h380_149{border-bottom-color:#f37f33}._vertical_9h380_35 ._selected_9h380_66 ._color__orange_9h380_149{border-right-color:#f37f33}._selected_9h380_66._color__yellow_9h380_161{color:#fce358}._horizontal_9h380_40 ._selected_9h380_66 ._color__yellow_9h380_161{border-bottom-color:#fbda21}._vertical_9h380_35 ._selected_9h380_66 ._color__yellow_9h380_161{border-right-color:#fbda21}._selected_9h380_66._color__olive_9h380_173{color:#d8eb55}._horizontal_9h380_40 ._selected_9h380_66 ._color__olive_9h380_173{border-bottom-color:#cbe41c}._vertical_9h380_35 ._selected_9h380_66 ._color__olive_9h380_173{border-right-color:#cbe41c}._selected_9h380_66._color__green_9h380_185{color:#53e074}._horizontal_9h380_40 ._selected_9h380_66 ._color__green_9h380_185{border-bottom-color:#25ca4c}._vertical_9h380_35 ._selected_9h380_66 ._color__green_9h380_185{border-right-color:#25ca4c}._selected_9h380_66._color__teal_9h380_197{color:#21fff5}._horizontal_9h380_40 ._selected_9h380_66 ._color__teal_9h380_197{border-bottom-color:#00d6cc}._vertical_9h380_35 ._selected_9h380_66 ._color__teal_9h380_197{border-right-color:#00d6cc}._selected_9h380_66._color__blue_9h380_209{color:#62aee6}._horizontal_9h380_40 ._selected_9h380_66 ._color__blue_9h380_209{border-bottom-color:#2e93de}._vertical_9h380_35 ._selected_9h380_66 ._color__blue_9h380_209{border-right-color:#2e93de}._selected_9h380_66._color__violet_9h380_221{color:#9676db}._horizontal_9h380_40 ._selected_9h380_66 ._color__violet_9h380_221{border-bottom-color:#7349cf}._vertical_9h380_35 ._selected_9h380_66 ._color__violet_9h380_221{border-right-color:#7349cf}._selected_9h380_66._color__purple_9h380_233{color:#c274db}._horizontal_9h380_40 ._selected_9h380_66 ._color__purple_9h380_233{border-bottom-color:#ad45d0}._vertical_9h380_35 ._selected_9h380_66 ._color__purple_9h380_233{border-right-color:#ad45d0}._selected_9h380_66._color__pink_9h380_245{color:#ea79b9}._horizontal_9h380_40 ._selected_9h380_66 ._color__pink_9h380_245{border-bottom-color:#e34da1}._vertical_9h380_35 ._selected_9h380_66 ._color__pink_9h380_245{border-right-color:#e34da1}._selected_9h380_66._color__brown_9h380_257{color:#ca9775}._horizontal_9h380_40 ._selected_9h380_66 ._color__brown_9h380_257{border-bottom-color:#b97447}._vertical_9h380_35 ._selected_9h380_66 ._color__brown_9h380_257{border-right-color:#b97447}._selected_9h380_66._color__grey_9h380_269{color:#a3a3a3}._horizontal_9h380_40 ._selected_9h380_66 ._color__grey_9h380_269{border-bottom-color:#848484}._vertical_9h380_35 ._selected_9h380_66 ._color__grey_9h380_269{border-right-color:#848484}._selected_9h380_66._color__light-grey_9h380_281{color:#c6c6c6}._horizontal_9h380_40 ._selected_9h380_66 ._color__light-grey_9h380_281{border-bottom-color:#b3b3b3}._vertical_9h380_35 ._selected_9h380_66 ._color__light-grey_9h380_281{border-right-color:#b3b3b3}._selected_9h380_66._color__good_9h380_293{color:#8cd95a}._horizontal_9h380_40 ._selected_9h380_66 ._color__good_9h380_293{border-bottom-color:#68c22d}._vertical_9h380_35 ._selected_9h380_66 ._color__good_9h380_293{border-right-color:#68c22d}._selected_9h380_66._color__average_9h380_305{color:#f5b35e}._horizontal_9h380_40 ._selected_9h380_66 ._color__average_9h380_305{border-bottom-color:#f29a29}._vertical_9h380_35 ._selected_9h380_66 ._color__average_9h380_305{border-right-color:#f29a29}._selected_9h380_66._color__bad_9h380_317{color:#e76e6e}._horizontal_9h380_40 ._selected_9h380_66 ._color__bad_9h380_317{border-bottom-color:#df3e3e}._vertical_9h380_35 ._selected_9h380_66 ._color__bad_9h380_317{border-right-color:#df3e3e}._selected_9h380_66._color__label_9h380_329{color:#a8b4c4}._horizontal_9h380_40 ._selected_9h380_66 ._color__label_9h380_329{border-bottom-color:#8b9bb0}._vertical_9h380_35 ._selected_9h380_66 ._color__label_9h380_329{border-right-color:#8b9bb0} diff --git a/dist/assets/TextArea.css b/dist/assets/TextArea.css deleted file mode 100644 index f6cb22a..0000000 --- a/dist/assets/TextArea.css +++ /dev/null @@ -1 +0,0 @@ -._textArea_1bert_20{position:relative;display:inline-block;border:.0833333333em solid #88bfff;border:.0833333333em solid rgba(136,191,255,.75);border-radius:.16em;background-color:#0a0a0a;margin-right:.1666666667em;line-height:1.4166666667em;box-sizing:border-box;width:100%}._fluid_1bert_33{display:block;width:auto;height:auto}._noborder_1bert_39{border:0px}._inner_1bert_43 ._scrollable_1bert_43{overflow:auto;overflow-x:hidden;overflow-y:scroll}._inner_1bert_43{display:block;position:absolute;top:0;bottom:0;left:0;right:0;border:0;outline:0;width:100%;height:100%;font-size:1em;line-height:1.4166666667em;min-height:1.4166666667em;margin:0;padding:0 .5em;font-family:inherit;background-color:transparent;color:inherit;box-sizing:border-box;word-wrap:break-word;overflow:hidden}._inner_1bert_43:-ms-input-placeholder{font-style:italic;color:#777;color:#ffffff73}._custom_1bert_78{overflow:visible;white-space:pre-wrap}._nowrap_1bert_83{white-space:nowrap;overflow-wrap:normal;overflow-x:scroll}._wrapper_1bert_89{overflow:hidden;height:100%;width:100%;position:absolute} diff --git a/dist/assets/Tooltip.css b/dist/assets/Tooltip.css deleted file mode 100644 index 20d1a60..0000000 --- a/dist/assets/Tooltip.css +++ /dev/null @@ -1 +0,0 @@ -._tooltip_1pib4_13{z-index:2;padding:.5em .75em;pointer-events:none;text-align:left;transition:opacity .15s ease-out;background-color:#000;color:#fff;box-shadow:.1em .1em 1.25em -.1em #00000080;border-radius:.16em;max-width:20.8333333333em} diff --git a/dist/common/color.js b/dist/common/color.js index e8f38b8..2573c4d 100644 --- a/dist/common/color.js +++ b/dist/common/color.js @@ -1,24 +1,25 @@ -var b = Object.defineProperty; -var l = (i, t, s) => t in i ? b(i, t, { enumerable: !0, configurable: !0, writable: !0, value: s }) : i[t] = s; -var e = (i, t, s) => l(i, typeof t != "symbol" ? t + "" : t, s); +var g = Object.defineProperty; +var u = (e, t, r) => t in e ? g(e, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[t] = r; +var i = (e, t, r) => u(e, typeof t != "symbol" ? t + "" : t, r); class n { - constructor(t = 0, s = 0, r = 0, a = 1) { - e(this, "r"); - e(this, "g"); - e(this, "b"); - e(this, "a"); - this.r = t, this.g = s, this.b = r, this.a = a; + constructor(t = 0, r = 0, s = 0, a = 1) { + i(this, "r"); + i(this, "g"); + i(this, "b"); + i(this, "a"); + this.r = t, this.g = r, this.b = s, this.a = a; } toString() { let t = this.a; - return typeof t == "string" && (t = parseFloat(this.a)), isNaN(t) && (t = 1), `rgba(${this.r | 0}, ${this.g | 0}, ${this.b | 0}, ${t})`; + return typeof t == "string" && (t = Number.parseFloat(this.a)), Number.isNaN(t) && (t = 1), `rgba(${this.r | 0}, ${this.g | 0}, ${this.b | 0}, ${t})`; } /** Darkens a color by a given percent. Returns a color, which can have toString called to get it's rgba() css value. */ darken(t) { - return t /= 100, new n( - this.r - this.r * t, - this.g - this.g * t, - this.b - this.b * t, + const r = t / 100; + return new n( + this.r - this.r * r, + this.g - this.g * r, + this.b - this.b * r, this.a ); } @@ -31,37 +32,37 @@ class n { */ static fromHex(t) { return new n( - parseInt(t.slice(1, 3), 16), - parseInt(t.slice(3, 5), 16), - parseInt(t.slice(5, 7), 16) + Number.parseInt(t.slice(1, 3), 16), + Number.parseInt(t.slice(3, 5), 16), + Number.parseInt(t.slice(5, 7), 16) ); } /** * Linear interpolation of two colors. */ - static lerp(t, s, r) { + static lerp(t, r, s) { return new n( - (s.r - t.r) * r + t.r, - (s.g - t.g) * r + t.g, - (s.b - t.b) * r + t.b, - (s.a - t.a) * r + t.a + (r.r - t.r) * s + t.r, + (r.g - t.g) * s + t.g, + (r.b - t.b) * s + t.b, + (r.a - t.a) * s + t.a ); } /** * Loops up the color in the provided list of colors * with linear interpolation. */ - static lookup(t, s) { - const r = s.length; - if (r < 2) + static lookup(t, r) { + const s = r.length; + if (s < 2) throw new Error("Needs at least two colors!"); - const a = t * (r - 1); + const a = t * (s - 1); if (t < 1e-4) - return s[0]; + return r[0]; if (t >= 1 - 1e-4) - return s[r - 1]; - const g = a % 1, h = a | 0; - return this.lerp(s[h], s[h + 1], g); + return r[s - 1]; + const b = a % 1, h = a | 0; + return n.lerp(r[h], r[h + 1], b); } } export { diff --git a/dist/common/events.js b/dist/common/events.js index a7f41a8..906c475 100644 --- a/dist/common/events.js +++ b/dist/common/events.js @@ -58,10 +58,10 @@ function a() { } let w = null, c = null; const h = []; -function A(t) { +function $(t) { h.push(t); } -function B(t) { +function A(t) { const e = h.indexOf(t); e >= 0 && h.splice(e, 1); } @@ -121,7 +121,7 @@ class p { return this.type === "keyup"; } toString() { - return this._str ? this._str : (this._str = "", this.ctrl && (this._str += "Ctrl+"), this.alt && (this._str += "Alt+"), this.shift && (this._str += "Shift+"), this.code >= 48 && this.code <= 90 ? this._str += String.fromCharCode(this.code) : this.code >= K && this.code <= S ? this._str += "F" + (this.code - 111) : this._str += "[" + this.code + "]", this._str); + return this._str ? this._str : (this._str = "", this.ctrl && (this._str += "Ctrl+"), this.alt && (this._str += "Alt+"), this.shift && (this._str += "Shift+"), this.code >= 48 && this.code <= 90 ? this._str += String.fromCharCode(this.code) : this.code >= K && this.code <= S ? this._str += `F${this.code - 111}` : this._str += `[${this.code}]`, this._str); } } document.addEventListener("keydown", (t) => { @@ -139,9 +139,9 @@ document.addEventListener("keyup", (t) => { export { C as EventEmitter, p as KeyEvent, - A as addScrollableNode, + $ as addScrollableNode, E as canStealFocus, o as globalEvents, - B as removeScrollableNode, + A as removeScrollableNode, W as setupGlobalEvents }; diff --git a/dist/common/format.js b/dist/common/format.js index 917fc1a..b7dd517 100644 --- a/dist/common/format.js +++ b/dist/common/format.js @@ -38,21 +38,21 @@ const d = [ "F", "N", "H" -], l = d.indexOf(" "); -function u(t, n = -l, s = "") { - if (!isFinite(t)) +], u = d.indexOf(" "); +function m(t, n = -u, s = "") { + if (!Number.isFinite(t)) return t.toString(); - const o = Math.floor(Math.log10(Math.abs(t))), r = Math.max(n * 3, o), e = Math.floor(r / 3), i = d[Math.min(e + l, d.length - 1)]; - let a = (t / Math.pow(1e3, e)).toFixed(2); - return a.endsWith(".00") ? a = a.slice(0, -3) : a.endsWith(".0") && (a = a.slice(0, -2)), `${a} ${i.trim()}${s}`.trim(); -} -function S(t, n = 0) { - return u(t, n, "W"); + const o = Math.floor(Math.log10(Math.abs(t))), a = Math.max(n * 3, o), e = Math.floor(a / 3), i = d[Math.min(e + u, d.length - 1)]; + let r = (t / 1e3 ** e).toFixed(2); + return r.endsWith(".00") ? r = r.slice(0, -3) : r.endsWith(".0") && (r = r.slice(0, -2)), `${r} ${i.trim()}${s}`.trim(); } -function $(t, n = 0) { - return u(t, n, "J"); +function M(t, n = 0) { + return m(t, n, "W"); } function b(t, n = 0) { + return m(t, n, "J"); +} +function $(t, n = 0) { if (!Number.isFinite(t)) return String(t); const s = Number(t.toFixed(n)), o = s < 0, e = Math.abs(s).toString().split("."); @@ -63,9 +63,9 @@ function b(t, n = 0) { function g(t) { const n = 20 * Math.log10(t), s = n >= 0 ? "+" : "-"; let o = Math.abs(n); - return o === 1 / 0 ? o = "Inf" : o = o.toFixed(2), `${s}${o} dB`; + return o === Number.POSITIVE_INFINITY ? o = "Inf" : o = o.toFixed(2), `${s}${o} dB`; } -const M = [ +const S = [ "", "· 10³", // kilo @@ -91,27 +91,27 @@ const M = [ "· 10³⁶", "· 10³⁹" ]; -function p(t, n = 0, s = "") { - if (!isFinite(t)) +function N(t, n = 0, s = "") { + if (!Number.isFinite(t)) return "NaN"; - const o = Math.floor(Math.log10(t)), r = Math.max(n * 3, o), e = Math.floor(r / 3), i = M[e], c = t / Math.pow(1e3, e), a = Math.max(0, 2 - r % 3); - return `${c.toFixed(a)} ${i} ${s}`.trim(); + const o = Math.floor(Math.log10(t)), a = Math.max(n * 3, o), e = Math.floor(a / 3), i = S[e], c = t / 1e3 ** e, r = Math.max(0, 2 - a % 3); + return `${c.toFixed(r)} ${i} ${s}`.trim(); } function F(t, n = "default") { - const s = Math.floor(t / 10), o = Math.floor(s / 3600), r = Math.floor(s % 3600 / 60), e = s % 60; + const s = Math.floor(t / 10), o = Math.floor(s / 3600), a = Math.floor(s % 3600 / 60), e = s % 60; if (n === "short") { - const f = o > 0 ? `${o}h` : "", m = r > 0 ? `${r}m` : "", h = e > 0 ? `${e}s` : ""; - return `${f}${m}${h}`; + const f = o > 0 ? `${o}h` : "", l = a > 0 ? `${a}m` : "", h = e > 0 ? `${e}s` : ""; + return `${f}${l}${h}`; } - const i = String(o).padStart(2, "0"), c = String(r).padStart(2, "0"), a = String(e).padStart(2, "0"); - return `${i}:${c}:${a}`; + const i = String(o).padStart(2, "0"), c = String(a).padStart(2, "0"), r = String(e).padStart(2, "0"); + return `${i}:${c}:${r}`; } export { g as formatDb, - $ as formatEnergy, - b as formatMoney, - S as formatPower, - p as formatSiBaseTenUnit, - u as formatSiUnit, + b as formatEnergy, + $ as formatMoney, + M as formatPower, + N as formatSiBaseTenUnit, + m as formatSiUnit, F as formatTime }; diff --git a/dist/common/hotkeys.d.ts b/dist/common/hotkeys.d.ts index 335624d..a0c01e8 100644 --- a/dist/common/hotkeys.d.ts +++ b/dist/common/hotkeys.d.ts @@ -1,5 +1,4 @@ import { KeyEvent } from './events'; - /** * Acquires a lock on the hotkey, which prevents it from being * passed through to BYOND. diff --git a/dist/common/hotkeys.js b/dist/common/hotkeys.js index a0680b8..1e77290 100644 --- a/dist/common/hotkeys.js +++ b/dist/common/hotkeys.js @@ -30,9 +30,9 @@ function w(t) { if (t >= 48 && t <= 57 || t >= 65 && t <= 90) return String.fromCharCode(t); if (t >= 96 && t <= 105) - return "Numpad" + (t - 96); + return `Numpad${t - 96}`; if (t >= 112 && t <= 123) - return "F" + (t - 111); + return `F${t - 111}`; if (t === 188) return ","; if (t === 189) return "-"; if (t === 190) return "."; diff --git a/dist/common/math.d.ts b/dist/common/math.d.ts index c8e8388..cb20a3c 100644 --- a/dist/common/math.d.ts +++ b/dist/common/math.d.ts @@ -37,3 +37,7 @@ export declare function keyOfMatchingRange(value: number, ranges: Record r ? r : t; +function e(n, t, r) { + return n < t ? t : n > r ? r : n; } -function c(t) { - return t < 0 ? 0 : t > 1 ? 1 : t; +function u(n) { + return n < 0 ? 0 : n > 1 ? 1 : n; } -function f(t, n = 0, r = 100) { - return (t - n) / (r - n); +function f(n, t = 0, r = 100) { + return (n - t) / (r - t); } -function u(t, n) { - const r = t >= 0 ? 1 : -1; - return parseFloat( - (Math.round(t * Math.pow(10, n) + r * 1e-4) / Math.pow(10, n)).toFixed(n) +function c(n, t) { + const r = n >= 0 ? 1 : -1; + return Number.parseFloat( + (Math.round(n * 10 ** t + r * 1e-4) / 10 ** t).toFixed(t) ); } -function s(t, n = 0) { - return Number(t).toFixed(Math.max(n, 0)); +function s(n, t = 0) { + return Number(n).toFixed(Math.max(t, 0)); } -function i(t, n) { - return n && t >= n[0] && t <= n[1]; +function o(n, t) { + return t && n >= t[0] && n <= t[1]; } -function a(t, n) { - for (const r of Object.keys(n)) { - const o = n[r]; - if (i(t, o)) +function m(n, t) { + for (const r of Object.keys(t)) { + const i = t[r]; + if (o(n, i)) return r; } } -function h(t) { - return Math.floor(t) !== t && t.toString().split(".")[1].length || 0; +function b(n) { + return Math.floor(n) !== n && n.toString().split(".")[1].length || 0; +} +function N(n) { + return typeof n == "number" && Number.isFinite(n) && !Number.isNaN(n); } export { e as clamp, - c as clamp01, - i as inRange, - a as keyOfMatchingRange, - h as numberOfDecimalDigits, - u as round, + u as clamp01, + o as inRange, + N as isSafeNumber, + m as keyOfMatchingRange, + b as numberOfDecimalDigits, + c as round, f as scale, s as toFixed }; diff --git a/dist/common/random.js b/dist/common/random.js index 2f8c196..57e50fa 100644 --- a/dist/common/random.js +++ b/dist/common/random.js @@ -1,20 +1,21 @@ -import { clamp as r } from "./math.js"; -function o(t, n) { - return Math.random() * (n - t) + t; +import { clamp as a } from "./math.js"; +function e(n, o) { + return Math.random() * (o - n) + n; } -function m(t, n) { - return t = Math.ceil(t), n = Math.floor(n), Math.floor(Math.random() * (n - t) + t); +function c(n, o) { + const r = Math.ceil(n), t = Math.floor(o); + return Math.floor(Math.random() * (t - r) + r); } -function h(t) { - return t[Math.floor(Math.random() * t.length)]; +function h(n) { + return n[Math.floor(Math.random() * n.length)]; } -function c(t) { - const n = r(t, 0, 100) / 100; - return Math.random() <= n; +function u(n) { + const o = a(n, 0, 100) / 100; + return Math.random() <= o; } export { - m as randomInteger, - o as randomNumber, + c as randomInteger, + e as randomNumber, h as randomPick, - c as randomProb + u as randomProb }; diff --git a/dist/common/react.js b/dist/common/react.js index 4302a42..c2552e3 100644 --- a/dist/common/react.js +++ b/dist/common/react.js @@ -2,7 +2,7 @@ function f(r) { let n = ""; for (let t = 0; t < r.length; t++) { const e = r[t]; - typeof e == "string" && (n += e + " "); + typeof e == "string" && (n += `${e} `); } return n; } diff --git a/dist/common/string.js b/dist/common/string.js index 6d340cf..c8a391c 100644 --- a/dist/common/string.js +++ b/dist/common/string.js @@ -9,7 +9,7 @@ function p(e, t = (r) => JSON.stringify(r)) { } const a = ["a", "e", "i", "o", "u"]; function l(e, t, r) { - return t === 1 ? e : r ? e + r : e.endsWith("s") || e.endsWith("x") || e.endsWith("z") || e.endsWith("ch") || e.endsWith("sh") ? e + "es" : e.endsWith("y") && !a.includes(e.charAt(e.length - 2)) ? e.slice(0, -1) + "ies" : e + "s"; + return t === 1 ? e : r ? e + r : e.endsWith("s") || e.endsWith("x") || e.endsWith("z") || e.endsWith("ch") || e.endsWith("sh") ? `${e}es` : e.endsWith("y") && !a.includes(e.charAt(e.length - 2)) ? `${e.slice(0, -1)}ies` : `${e}s`; } function c(e) { return e.charAt(0).toUpperCase() + e.slice(1).toLowerCase(); @@ -20,7 +20,7 @@ function f(e) { function h(e) { return e.replace(/^\w/, (t) => t.toUpperCase()); } -const i = ["Id", "Tv"], s = [ +const i = ["Id", "Tv"], u = [ "A", "An", "And", @@ -46,17 +46,17 @@ const i = ["Id", "Tv"], s = [ function g(e) { if (!e) return e; let t = e.replace(/([^\W_]+[^\s-]*) */g, (r) => c(r)); - for (const r of s) { - const n = new RegExp("\\s" + r + "\\s", "g"); + for (const r of u) { + const n = new RegExp(`\\s${r}\\s`, "g"); t = t.replace(n, (o) => o.toLowerCase()); } for (const r of i) { - const n = new RegExp("\\b" + r + "\\b", "g"); + const n = new RegExp(`\\b${r}\\b`, "g"); t = t.replace(n, (o) => o.toLowerCase()); } return t; } -const u = { +const s = { amp: "&", apos: "'", gt: ">", @@ -68,12 +68,12 @@ function d(e) { return e && e.replace(/
/gi, ` `).replace(/<\/?[a-z0-9-_]+[^>]*>/gi, "").replace( /&(nbsp|amp|quot|lt|gt|apos);/g, - (t, r) => u[r] + (t, r) => s[r] ).replace(/&#?([0-9]+);/gi, (t, r) => { - const n = parseInt(r, 10); + const n = Number.parseInt(r, 10); return String.fromCharCode(n); }).replace(/&#x?([0-9a-f]+);/gi, (t, r) => { - const n = parseInt(r, 16); + const n = Number.parseInt(r, 16); return String.fromCharCode(n); }); } diff --git a/dist/common/type-utils.d.ts b/dist/common/type-utils.d.ts index 4391cd3..f3d4ca8 100644 --- a/dist/common/type-utils.d.ts +++ b/dist/common/type-utils.d.ts @@ -6,4 +6,4 @@ * logger.log(getShallowTypes(data)); * ``` */ -export declare function getShallowTypes(data: Record): Record; +export declare function getShallowTypes(data: Record): Record; diff --git a/dist/components/AnimatedNumber.d.ts b/dist/components/AnimatedNumber.d.ts index 0dc051f..4bd3df1 100644 --- a/dist/components/AnimatedNumber.d.ts +++ b/dist/components/AnimatedNumber.d.ts @@ -1,6 +1,10 @@ import { Component } from 'react'; - type Props = { + /** + * The target value to approach. + */ + value: number; +} & Partial<{ /** * If provided, a function that formats the inner string. By default, * attempts to match the numeric precision of `value`. @@ -12,11 +16,7 @@ type Props = { * animating. */ initial?: number; - /** - * The target value to approach. - */ - value: number; -}; +}>; /** * An animated number label. Shows a number, formatted with an optionally * provided function, and animates it towards its target value. diff --git a/dist/components/AnimatedNumber.js b/dist/components/AnimatedNumber.js index 5f1d43d..3b6f594 100644 --- a/dist/components/AnimatedNumber.js +++ b/dist/components/AnimatedNumber.js @@ -1,14 +1,11 @@ var f = Object.defineProperty; -var p = (i, r, t) => r in i ? f(i, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : i[r] = t; -var s = (i, r, t) => p(i, typeof r != "symbol" ? r + "" : r, t); -import { jsx as m } from "react/jsx-runtime"; -import { Component as v, createRef as g } from "react"; -import { toFixed as d, clamp as T } from "../common/math.js"; -function o(i) { - return typeof i == "number" && Number.isFinite(i) && !Number.isNaN(i); -} -const V = 1e3 / 60, a = 0.8333, l = 1e-3; -class S extends v { +var p = (r, i, t) => i in r ? f(r, i, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[i] = t; +var s = (r, i, t) => p(r, typeof i != "symbol" ? i + "" : i, t); +import { jsx as v } from "react/jsx-runtime"; +import { Component as m, createRef as g } from "react"; +import { isSafeNumber as o, toFixed as d, clamp as T } from "../common/math.js"; +const V = 1e3 / 60, u = 0.8333, l = 1e-3; +class b extends m { constructor(t) { super(t); /** @@ -53,24 +50,24 @@ class S extends v { */ tick() { const { currentValue: t } = this, { value: e } = this.props; - o(e) ? this.currentValue = t * a + e * (1 - a) : this.stopTicking(), Math.abs(e - this.currentValue) < Math.max(l, l * e) && (this.currentValue = e, this.stopTicking()), this.ref.current && (this.ref.current.textContent = this.getText()); + o(e) ? this.currentValue = t * u + e * (1 - u) : this.stopTicking(), Math.abs(e - this.currentValue) < Math.max(l, l * e) && (this.currentValue = e, this.stopTicking()), this.ref.current && (this.ref.current.textContent = this.getText()); } /** * Gets the inner text of the span. */ getText() { - const { props: t, currentValue: e } = this, { format: n, value: u } = t; - if (!o(u)) - return String(u); + const { props: t, currentValue: e } = this, { format: n, value: a } = t; + if (!o(a)) + return String(a); if (n) return n(this.currentValue); - const c = String(u).split(".")[1], h = c ? c.length : 0; + const c = String(a).split(".")[1], h = c ? c.length : 0; return d(e, T(h, 0, 8)); } render() { - return /* @__PURE__ */ m("span", { ref: this.ref, children: this.getText() }); + return /* @__PURE__ */ v("span", { ref: this.ref, children: this.getText() }); } } export { - S as AnimatedNumber + b as AnimatedNumber }; diff --git a/dist/components/Autofocus.d.ts b/dist/components/Autofocus.d.ts index 10d39b1..4fcb8cb 100644 --- a/dist/components/Autofocus.d.ts +++ b/dist/components/Autofocus.d.ts @@ -1,4 +1,3 @@ import { PropsWithChildren } from 'react'; - /** Used to force the window to steal focus on load. Children optional */ export declare function Autofocus(props: PropsWithChildren): import("react/jsx-runtime").JSX.Element; diff --git a/dist/components/Blink.d.ts b/dist/components/Blink.d.ts index ce5b723..446e5d9 100644 --- a/dist/components/Blink.d.ts +++ b/dist/components/Blink.d.ts @@ -1,5 +1,4 @@ import { Component, PropsWithChildren } from 'react'; - type Props = Partial<{ /** * The interval between blinks, in milliseconds. diff --git a/dist/components/BlockQuote.d.ts b/dist/components/BlockQuote.d.ts index b25b484..9d4b1f5 100644 --- a/dist/components/BlockQuote.d.ts +++ b/dist/components/BlockQuote.d.ts @@ -1,3 +1,2 @@ import { BoxProps } from './Box'; - export declare function BlockQuote(props: BoxProps): import("react/jsx-runtime").JSX.Element; diff --git a/dist/components/BlockQuote.js b/dist/components/BlockQuote.js index a4ff88e..0592bbf 100644 --- a/dist/components/BlockQuote.js +++ b/dist/components/BlockQuote.js @@ -1,12 +1,9 @@ -import { jsx as c } from "react/jsx-runtime"; +import { jsx as t } from "react/jsx-runtime"; import { classes as e } from "../common/react.js"; -import { Box as r } from "./Box.js"; -import '../assets/BlockQuote.css';const l = "_blockQuote_14fvy_13", m = { - blockQuote: l -}; +import { Box as m } from "./Box.js"; function f(o) { - const { className: t, ...s } = o; - return /* @__PURE__ */ c(r, { className: e([m.blockQuote, t]), ...s }); + const { className: r, ...s } = o; + return /* @__PURE__ */ t(m, { className: e(["BlockQuote", r]), ...s }); } export { f as BlockQuote diff --git a/dist/components/Box.d.ts b/dist/components/Box.d.ts index f1e1eca..6b53e20 100644 --- a/dist/components/Box.d.ts +++ b/dist/components/Box.d.ts @@ -1,6 +1,5 @@ import { CSSProperties, KeyboardEventHandler, MouseEventHandler, ReactNode, UIEventHandler } from 'react'; import { BooleanLike } from '../common/react'; - type BooleanProps = Partial>; type StringProps = Partial>; export type EventHandlers = Partial<{ diff --git a/dist/components/Box.js b/dist/components/Box.js index 27ffaf2..50c1248 100644 --- a/dist/components/Box.js +++ b/dist/components/Box.js @@ -3,9 +3,9 @@ import { CSS_COLORS as b } from "../common/constants.js"; import { classes as u } from "../common/react.js"; function p(o) { if (typeof o == "string") - return o.endsWith("px") ? parseFloat(o) / 12 + "rem" : o; + return o.endsWith("px") ? `${Number.parseFloat(o) / 12}rem` : o; if (typeof o == "number") - return o + "rem"; + return `${o}rem`; } function r(o) { if (typeof o == "string") @@ -109,8 +109,8 @@ function S(o) { function d(o) { const t = o.textColor || o.color, i = o.backgroundColor; return u([ - a(t) && "color-" + t, - a(i) && "color-bg-" + i + a(t) && `color-${t}`, + a(i) && `color-bg-${i}` ]); } function W(o) { diff --git a/dist/components/Button.d.ts b/dist/components/Button.d.ts index 29540e3..407ee88 100644 --- a/dist/components/Button.d.ts +++ b/dist/components/Button.d.ts @@ -2,7 +2,6 @@ import { Placement } from '@popperjs/core'; import { ReactNode } from 'react'; import { BooleanLike } from '../common/react'; import { BoxProps } from './Box'; - /** * Getting ellipses to work requires that you use: * 1. A string rather than a node diff --git a/dist/components/Button.js b/dist/components/Button.js index 862e5da..1b8ee23 100644 --- a/dist/components/Button.js +++ b/dist/components/Button.js @@ -1,301 +1,263 @@ -import { jsx as l, jsxs as P, Fragment as M } from "react/jsx-runtime"; -import { useState as S, createRef as V, useEffect as z, useRef as j } from "react"; -import { KEY as R, isEscape as E } from "../common/keys.js"; -import { classes as D } from "../common/react.js"; -import { computeBoxClassName as q, computeBoxProps as O, Box as T } from "./Box.js"; -import { Icon as F } from "./Icon.js"; -import { Tooltip as K } from "./Tooltip.js"; -import '../assets/Button.css';const L = "_button_433yx_17", Y = "_fa_433yx_34", G = "_fas_433yx_35", H = "_far_433yx_36", J = "_dropdown_433yx_43", Q = "_ellipsis_433yx_49", U = "_fluid_433yx_54", W = "_circular_433yx_60", X = "_compact_433yx_64", Z = "_color__black_433yx_69", $ = "_color__white_433yx_82", oo = "_color__red_433yx_95", to = "_color__orange_433yx_108", _o = "_color__yellow_433yx_121", no = "_color__olive_433yx_134", eo = "_color__green_433yx_147", lo = "_color__teal_433yx_160", co = "_color__blue_433yx_173", ro = "_color__violet_433yx_186", io = "_color__purple_433yx_199", so = "_color__pink_433yx_212", ao = "_color__brown_433yx_225", uo = "_color__grey_433yx_238", fo = "_color__good_433yx_264", po = "_color__average_433yx_277", yo = "_color__bad_433yx_290", xo = "_color__label_433yx_303", mo = "_color__default_433yx_316", go = "_color__caution_433yx_329", bo = "_color__danger_433yx_342", ho = "_color__transparent_433yx_355", Co = "_disabled_433yx_370", ko = "_selected_433yx_374", vo = "_flex_433yx_387", wo = "_flex__fluid_433yx_392", Ao = "_verticalAlignContent__top_433yx_396", Bo = "_verticalAlignContent__middle_433yx_400", Io = "_verticalAlignContent__bottom_433yx_404", No = "_content_433yx_408", Ro = "_textMargin_433yx_413", _ = { - button: L, - fa: Y, - fas: G, - far: H, - dropdown: J, - ellipsis: Q, - fluid: U, - circular: W, - compact: X, - color__black: Z, - color__white: $, - color__red: oo, - color__orange: to, - color__yellow: _o, - color__olive: no, - color__green: eo, - color__teal: lo, - color__blue: co, - color__violet: ro, - color__purple: io, - color__pink: so, - color__brown: ao, - color__grey: uo, - "color__light-grey": "_color__light-grey_433yx_251", - color__good: fo, - color__average: po, - color__bad: yo, - color__label: xo, - color__default: mo, - color__caution: go, - color__danger: bo, - color__transparent: ho, - disabled: Co, - selected: ko, - flex: vo, - flex__fluid: wo, - verticalAlignContent__top: Ao, - verticalAlignContent__middle: Bo, - verticalAlignContent__bottom: Io, - content: No, - textMargin: Ro -}; -function b(a) { +import { jsx as i, jsxs as _, Fragment as K } from "react/jsx-runtime"; +import { useState as A, createRef as V, useEffect as $, useRef as z } from "react"; +import { KEY as D, isEscape as E } from "../common/keys.js"; +import { classes as F } from "../common/react.js"; +import { computeBoxClassName as j, computeBoxProps as q, Box as O } from "./Box.js"; +import { Icon as S } from "./Icon.js"; +import { Tooltip as v } from "./Tooltip.js"; +function x(u) { const { - captureKeys: i = !0, + captureKeys: l = !0, children: s, - circular: y, - className: p, - color: r, + circular: m, + className: d, + color: c, compact: h, - content: x, - disabled: o, - ellipsis: c, - fluid: n, + content: B, + disabled: t, + ellipsis: r, + fluid: o, icon: e, - iconColor: u, - iconPosition: w, - iconRotation: A, - iconSize: B, - iconSpin: I, - onClick: d, - selected: C, - tooltip: k, - tooltipPosition: N, - verticalAlignContent: m, - ...v - } = a, t = x || s; - let g = /* @__PURE__ */ l( + iconColor: a, + iconPosition: C, + iconRotation: N, + iconSize: R, + iconSpin: P, + onClick: f, + selected: g, + tooltip: b, + tooltipPosition: w, + verticalAlignContent: y, + ...I + } = u, n = B || s; + let k = /* @__PURE__ */ i( "div", { - className: D([ - _.button, - n && _.fluid, - o && _.disabled, - C && _.selected, - y && _.circular, - h && _.compact, - m && _.flex, - m && n && _.flex__fluid, - m && _["verticalAlignContent__" + m], - r && typeof r == "string" ? _["color__" + r] : _.color__default, - p, - q(v) + className: F([ + "Button", + o && "Button--fluid", + t && "Button--disabled", + g && "Button--selected", + m && "Button--circular", + h && "Button--compact", + C && `Button--iconPosition--${C}`, + y && "Button--flex", + y && o && "Button--flex--fluid", + y && `Button--verticalAlignContent--${y}`, + c && typeof c == "string" ? `Button--color--${c}` : "Button--color--default", + d, + j(I) ]), - tabIndex: o ? void 0 : 0, - onClick: (f) => { - !o && d && d(f); + tabIndex: t ? void 0 : 0, + onClick: (p) => { + !t && f && f(p); }, - onKeyDown: (f) => { - if (i) { - if (f.key === R.Space || f.key === R.Enter) { - f.preventDefault(), !o && d && d(f); + onKeyDown: (p) => { + if (l) { + if (p.key === D.Space || p.key === D.Enter) { + p.preventDefault(), !t && f && f(p); return; } - E(f.key) && f.preventDefault(); + E(p.key) && p.preventDefault(); } }, - ...O(v), - children: /* @__PURE__ */ P("div", { className: _.content, children: [ - e && w !== "right" && /* @__PURE__ */ l( - F, + ...q(I), + children: /* @__PURE__ */ _("div", { className: "Button__content", children: [ + e && C !== "right" && /* @__PURE__ */ i( + S, { - mr: t ? 1 : 0, + mr: n ? 1 : 0, name: e, - color: u, - rotation: A, - size: B, - spin: I + color: a, + rotation: N, + size: R, + spin: P } ), - c ? /* @__PURE__ */ l( + r ? /* @__PURE__ */ i( "span", { - className: D([_.ellipsis, e && _.textMargin]), - children: t + className: F([ + "Button--ellipsis", + e && "Button__textMargin" + ]), + children: n } - ) : t, - e && w === "right" && /* @__PURE__ */ l( - F, + ) : n, + e && C === "right" && /* @__PURE__ */ i( + S, { - ml: t ? 1 : 0, + ml: n ? 1 : 0, name: e, - color: u, - rotation: A, - size: B, - spin: I + color: a, + rotation: N, + size: R, + spin: P } ) ] }) } ); - return k && (g = /* @__PURE__ */ l(K, { content: k, position: N, children: g })), g; + return b && (k = /* @__PURE__ */ i(v, { content: b, position: w, children: k })), k; } -function Do(a) { - const { checked: i, ...s } = a; - return /* @__PURE__ */ l( - b, +function T(u) { + const { checked: l, ...s } = u; + return /* @__PURE__ */ i( + x, { color: "transparent", - icon: i ? "check-square-o" : "square-o", - selected: i, + icon: l ? "check-square-o" : "square-o", + selected: l, ...s } ); } -b.Checkbox = Do; -function Fo(a) { +x.Checkbox = T; +function L(u) { const { - children: i, + children: l, color: s, - confirmColor: y = "bad", - confirmContent: p = "Confirm?", - confirmIcon: r, + confirmColor: m = "bad", + confirmContent: d = "Confirm?", + confirmIcon: c, ellipsis: h = !0, - icon: x, - onClick: o, - ...c - } = a, [n, e] = S(!1); - function u(w) { - if (!n) { + icon: B, + onClick: t, + ...r + } = u, [o, e] = A(!1); + function a(C) { + if (!o) { e(!0); return; } - o == null || o(w), e(!1); + t == null || t(C), e(!1); } - return /* @__PURE__ */ l( - b, + return /* @__PURE__ */ i( + x, { - icon: n ? r : x, - color: n ? y : s, - onClick: u, - ...c, - children: n ? p : i + icon: o ? c : B, + color: o ? m : s, + onClick: a, + ...r, + children: o ? d : l } ); } -b.Confirm = Fo; -function Po(a) { +x.Confirm = L; +function M(u) { const { - children: i, + children: l, color: s = "default", - content: y, - currentValue: p, - defaultValue: r, + content: m, + currentValue: d, + defaultValue: c, disabled: h, - fluid: x, - icon: o, - iconRotation: c, - iconSpin: n, + fluid: B, + icon: t, + iconRotation: r, + iconSpin: o, maxLength: e, - onCommit: u = () => null, - placeholder: w, - tooltip: A, - tooltipPosition: B, - ...I - } = a, [d, C] = S(!1), k = V(), N = y || i; - function m(t) { - const g = k.current; - if (!g) return; - g.value !== "" ? u(t, g.value) : r && u(t, r); + onCommit: a = () => null, + placeholder: C, + tooltip: N, + tooltipPosition: R, + ...P + } = u, [f, g] = A(!1), b = V(), w = m || l; + function y(n) { + const k = b.current; + if (!k) return; + k.value !== "" ? a(n, k.value) : c && a(n, c); } - z(() => { - const t = k.current; - if (t && d) { - t.value = p || ""; + $(() => { + const n = b.current; + if (n && f) { + n.value = d || ""; try { - t.focus(), t.select(); + n.focus(), n.select(); } catch { } } - }, [d, p]); - let v = /* @__PURE__ */ P( - T, + }, [f, d]); + let I = /* @__PURE__ */ _( + O, { - className: D([ - _.button, - x && _.fluid, - _["color__" + s] + className: F([ + "Button", + B && "Button--fluid", + h && "Button--disabled", + `Button--color--${s}` ]), - ...I, - onClick: () => C(!0), + ...P, + onClick: () => g(!0), children: [ - o && /* @__PURE__ */ l(F, { name: o, rotation: c, spin: n }), - /* @__PURE__ */ l("div", { children: N }), - /* @__PURE__ */ l( + t && /* @__PURE__ */ i(S, { name: t, rotation: r, spin: o }), + /* @__PURE__ */ i("div", { children: w }), + /* @__PURE__ */ i( "input", { disabled: !!h, - ref: k, + ref: b, className: "NumberInput__input", style: { - display: d ? "" : "none", + display: f ? "" : "none", textAlign: "left" }, - onBlur: (t) => { - d && (C(!1), m(t)); + onBlur: (n) => { + f && (g(!1), y(n)); }, - onKeyDown: (t) => { - if (t.key === R.Enter) { - C(!1), m(t); + onKeyDown: (n) => { + if (n.key === D.Enter) { + g(!1), y(n); return; } - E(t.key) && C(!1); + E(n.key) && g(!1); } } ) ] } ); - return A && (v = /* @__PURE__ */ l(K, { content: A, position: B, children: v })), v; + return N && (I = /* @__PURE__ */ i(v, { content: N, position: R, children: I })), I; } -b.Input = Po; -function So(a) { - const { accept: i, multiple: s, onSelectFiles: y, ...p } = a, r = j(null); - async function h(o) { - const c = Array.from(o).map((n) => { +x.Input = M; +function Y(u) { + const { accept: l, multiple: s, onSelectFiles: m, ...d } = u, c = z(null); + async function h(t) { + const r = Array.from(t).map((o) => { const e = new FileReader(); - return new Promise((u) => { - e.onload = () => u(e.result), e.readAsText(n); + return new Promise((a) => { + e.onload = () => a(e.result), e.readAsText(o); }); }); - return await Promise.all(c); + return await Promise.all(r); } - async function x(o) { - const c = o.target.files; - if (c != null && c.length) { - const n = await h(c); - y(s ? n : n[0]); + async function B(t) { + const r = t.target.files; + if (r != null && r.length) { + const o = await h(r); + m(s ? o : o[0]); } } - return /* @__PURE__ */ P(M, { children: [ - /* @__PURE__ */ l(b, { onClick: () => { - var o; - return (o = r.current) == null ? void 0 : o.click(); - }, ...p }), - /* @__PURE__ */ l( + return /* @__PURE__ */ _(K, { children: [ + /* @__PURE__ */ i(x, { onClick: () => { + var t; + return (t = c.current) == null ? void 0 : t.click(); + }, ...d }), + /* @__PURE__ */ i( "input", { hidden: !0, type: "file", - ref: r, - accept: i, + ref: c, + accept: l, multiple: s, - onChange: x + onChange: B } ) ] }); } -b.File = So; +x.File = Y; export { - b as Button, - Do as ButtonCheckbox + x as Button, + T as ButtonCheckbox }; diff --git a/dist/components/ByondUi.js b/dist/components/ByondUi.js index 1dba974..9dbc13e 100644 --- a/dist/components/ByondUi.js +++ b/dist/components/ByondUi.js @@ -7,7 +7,7 @@ const o = []; function h(t) { const n = o.length; o.push(null); - const e = t || "byondui_" + n; + const e = t || `byondui_${n}`; return { render: (i) => { o[n] = e, Byond.winset(e, i); @@ -56,8 +56,8 @@ class U extends a { this.byondUiElement.render({ parent: Byond.windowId, ...n, - pos: e.pos[0] + "," + e.pos[1], - size: e.size[0] + "x" + e.size[1] + pos: `${e.pos[0]},${e.pos[1]}`, + size: `${e.size[0]}x${e.size[1]}` }); } componentWillUnmount() { diff --git a/dist/components/Chart.d.ts b/dist/components/Chart.d.ts index 9b3a41a..aacdf20 100644 --- a/dist/components/Chart.d.ts +++ b/dist/components/Chart.d.ts @@ -1,6 +1,5 @@ import { Component, RefObject } from 'react'; import { BoxProps } from './Box'; - type Props = { data: number[][]; } & Partial<{ diff --git a/dist/components/Chart.js b/dist/components/Chart.js index 9beb4ee..bcaa820 100644 --- a/dist/components/Chart.js +++ b/dist/components/Chart.js @@ -1,17 +1,17 @@ var w = Object.defineProperty; var R = (t, o, e) => o in t ? w(t, o, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[o] = e; var p = (t, o, e) => R(t, typeof o != "symbol" ? o + "" : o, e); -import { jsx as c } from "react/jsx-runtime"; -import { Component as g, createRef as B } from "react"; +import { jsx as c, jsxs as g } from "react/jsx-runtime"; +import { Component as B, createRef as C } from "react"; import { zip as u } from "../common/collections.js"; import { Box as v } from "./Box.js"; -function C(t, o, e, n) { +function $(t, o, e, n) { if (t.length === 0) return []; const f = u(...t), h = f.map((r) => Math.min(...r)), a = f.map((r) => Math.max(...r)); return e !== void 0 && (h[0] = e[0], a[0] = e[1]), n !== void 0 && (h[1] = n[0], a[1] = n[1]), t.map( (r) => u(r, h, a, o).map( - ([l, i, m, d]) => (l - i) / (m - i) * d + ([l, i, d, m]) => (l - i) / (d - i) * m ) ); } @@ -19,11 +19,11 @@ function L(t) { let o = ""; for (let e = 0; e < t.length; e++) { const n = t[e]; - o += n[0] + "," + n[1] + " "; + o += `${n[0]},${n[1]} `; } return o; } -class b extends g { +class b extends B { constructor(e) { super(e); p(this, "ref"); @@ -34,7 +34,7 @@ class b extends g { viewBox: [e.offsetWidth, e.offsetHeight] }); }); - this.ref = B(), this.state = { + this.ref = C(), this.state = { // Initial guess viewBox: [600, 200] }, this.handleResize = this.handleResize.bind(this); @@ -54,13 +54,13 @@ class b extends g { strokeColor: a = "#ffffff", strokeWidth: s = 2, ...r - } = this.props, { viewBox: l } = this.state, i = C(e, l, n, f); + } = this.props, { viewBox: l } = this.state, i = $(e, l, n, f); if (i.length > 0) { const z = i[0], x = i[i.length - 1]; i.push([l[0] + s, x[1]]), i.push([l[0] + s, -s]), i.push([-s, -s]), i.push([-s, z[1]]); } - const m = L(i), d = { ...r, className: "", ref: this.ref }; - return /* @__PURE__ */ c(v, { position: "relative", ...r, children: /* @__PURE__ */ c(v, { ...d, children: /* @__PURE__ */ c( + const d = L(i), m = { ...r, className: "", ref: this.ref }; + return /* @__PURE__ */ c(v, { position: "relative", ...r, children: /* @__PURE__ */ c(v, { ...m, children: /* @__PURE__ */ g( "svg", { viewBox: `0 0 ${l[0]} ${l[1]}`, @@ -73,23 +73,26 @@ class b extends g { bottom: 0, overflow: "hidden" }, - children: /* @__PURE__ */ c( - "polyline", - { - transform: `scale(1, -1) translate(0, -${l[1]})`, - fill: h, - stroke: a, - strokeWidth: s, - points: m - } - ) + children: [ + /* @__PURE__ */ c("title", { children: "chart" }), + /* @__PURE__ */ c( + "polyline", + { + transform: `scale(1, -1) translate(0, -${l[1]})`, + fill: h, + stroke: a, + strokeWidth: s, + points: d + } + ) + ] } ) }) }); } } -const $ = { +const j = { Line: b }; export { - $ as Chart + j as Chart }; diff --git a/dist/components/Collapsible.d.ts b/dist/components/Collapsible.d.ts index bbb1b50..5ad6dc5 100644 --- a/dist/components/Collapsible.d.ts +++ b/dist/components/Collapsible.d.ts @@ -1,6 +1,5 @@ import { ReactNode } from 'react'; import { BoxProps } from './Box'; - type Props = Partial<{ /** Buttons or other content to render inline with the button */ buttons: ReactNode; diff --git a/dist/components/ColorBox.d.ts b/dist/components/ColorBox.d.ts index a12ce8f..f56d3af 100644 --- a/dist/components/ColorBox.d.ts +++ b/dist/components/ColorBox.d.ts @@ -1,6 +1,5 @@ import { ReactNode } from 'react'; import { BoxProps } from './Box'; - type Props = { content?: ReactNode; } & BoxProps; diff --git a/dist/components/ColorBox.js b/dist/components/ColorBox.js index 84cf159..82e3d47 100644 --- a/dist/components/ColorBox.js +++ b/dist/components/ColorBox.js @@ -1,21 +1,14 @@ import { jsx as t } from "react/jsx-runtime"; -import { classes as s } from "../common/react.js"; -import { computeBoxClassName as e, computeBoxProps as n } from "./Box.js"; -import '../assets/ColorBox.css';const m = "_colorBox_110qz_5", a = { - colorBox: m -}; +import { classes as c } from "../common/react.js"; +import { computeBoxClassName as s, computeBoxProps as m } from "./Box.js"; function d(r) { - const { content: c, children: x, className: l, ...o } = r; - return o.color = c ? null : "default", o.backgroundColor = r.color || "default", /* @__PURE__ */ t( + const { content: l, children: a, className: e, ...o } = r; + return o.color = l ? null : "default", o.backgroundColor = r.color || "default", /* @__PURE__ */ t( "div", { - className: s([ - a.colorBox, - l, - e(o) - ]), - ...n(o), - children: c || "" + className: c(["ColorBox", e, s(o)]), + ...m(o), + children: l || "" } ); } diff --git a/dist/components/Dialog.js b/dist/components/Dialog.js index 95be06e..f5083e2 100644 --- a/dist/components/Dialog.js +++ b/dist/components/Dialog.js @@ -1,22 +1,13 @@ -import { jsx as t, jsxs as c } from "react/jsx-runtime"; -import { Box as s } from "./Box.js"; -import { Button as a } from "./Button.js"; -import '../assets/Dialog.css';const m = "_dialog_1hdv8_5", v = "_content_1hdv8_17", u = "_header_1hdv8_25", g = "_title_1hdv8_33", p = "_body_1hdv8_42", C = "_footer_1hdv8_47", f = "_button_1hdv8_55", o = { - dialog: m, - content: v, - header: u, - title: g, - body: p, - footer: C, - button: f -}; -function h(n) { - const { title: e, onClose: i, children: r, width: l, height: _ } = n; - return /* @__PURE__ */ t("div", { className: o.dialog, children: /* @__PURE__ */ c(s, { className: o.content, width: l || "370px", height: _, children: [ - /* @__PURE__ */ c("div", { className: o.header, children: [ - /* @__PURE__ */ t("div", { className: o.title, children: e }), - /* @__PURE__ */ t(s, { mr: 2, children: /* @__PURE__ */ t( - a, +import { jsx as o, jsxs as e } from "react/jsx-runtime"; +import { Box as r } from "./Box.js"; +import { Button as s } from "./Button.js"; +function d(i) { + const { title: n, onClose: t, children: c, width: l, height: h } = i; + return /* @__PURE__ */ o("div", { className: "Dialog", children: /* @__PURE__ */ e(r, { className: "Dialog__content", width: l || "370px", height: h, children: [ + /* @__PURE__ */ e("div", { className: "Dialog__header", children: [ + /* @__PURE__ */ o("div", { className: "Dialog__title", children: n }), + /* @__PURE__ */ o(r, { mr: 2, children: /* @__PURE__ */ o( + s, { mr: "-3px", width: "26px", @@ -26,42 +17,42 @@ function h(n) { icon: "window-close-o", tooltip: "Close", tooltipPosition: "bottom-start", - onClick: i + onClick: t } ) }) ] }), - r + c ] }) }); } -function d(n) { - const { onClick: e, children: i } = n; - return /* @__PURE__ */ t( - a, +function a(i) { + const { onClick: n, children: t } = i; + return /* @__PURE__ */ o( + s, { - onClick: e, - className: o.button, + onClick: n, + className: "Dialog__button", verticalAlignContent: "middle", - children: i + children: t } ); } -h.Button = d; -function w(n) { - const { documentName: e, onSave: i, onDiscard: r, onClose: l } = n; - return /* @__PURE__ */ c(h, { title: "Notepad", onClose: l, children: [ - /* @__PURE__ */ c("div", { className: o.body, children: [ +d.Button = a; +function p(i) { + const { documentName: n, onSave: t, onDiscard: c, onClose: l } = i; + return /* @__PURE__ */ e(d, { title: "Notepad", onClose: l, children: [ + /* @__PURE__ */ e("div", { className: "Dialog__body", children: [ "Do you want to save changes to ", - e, + n, "?" ] }), - /* @__PURE__ */ c("div", { className: o.footer, children: [ - /* @__PURE__ */ t(d, { onClick: i, children: "Save" }), - /* @__PURE__ */ t(d, { onClick: r, children: "Don't Save" }), - /* @__PURE__ */ t(d, { onClick: l, children: "Cancel" }) + /* @__PURE__ */ e("div", { className: "Dialog__footer", children: [ + /* @__PURE__ */ o(a, { onClick: t, children: "Save" }), + /* @__PURE__ */ o(a, { onClick: c, children: "Don't Save" }), + /* @__PURE__ */ o(a, { onClick: l, children: "Cancel" }) ] }) ] }); } export { - h as Dialog, - w as UnsavedChangesDialog + d as Dialog, + p as UnsavedChangesDialog }; diff --git a/dist/components/Dimmer.d.ts b/dist/components/Dimmer.d.ts index d084c4e..71023f9 100644 --- a/dist/components/Dimmer.d.ts +++ b/dist/components/Dimmer.d.ts @@ -1,3 +1,2 @@ import { BoxProps } from './Box'; - export declare function Dimmer(props: BoxProps): import("react/jsx-runtime").JSX.Element; diff --git a/dist/components/Dimmer.js b/dist/components/Dimmer.js index cec30f9..f5afa21 100644 --- a/dist/components/Dimmer.js +++ b/dist/components/Dimmer.js @@ -1,13 +1,10 @@ -import { jsx as m } from "react/jsx-runtime"; +import { jsx as r } from "react/jsx-runtime"; import { classes as o } from "../common/react.js"; -import { Box as t } from "./Box.js"; -import '../assets/Dimmer.css';const c = "_dimmer_ldz2o_5", n = { - dimmer: c -}; -function _(r) { - const { className: e, children: s, ...i } = r; - return /* @__PURE__ */ m(t, { className: o([n.dimmer, e]), ...i, children: /* @__PURE__ */ m("div", { className: "Dimmer__inner", children: s }) }); +import { Box as c } from "./Box.js"; +function l(m) { + const { className: e, children: s, ...i } = m; + return /* @__PURE__ */ r(c, { className: o(["Dimmer", e]), ...i, children: /* @__PURE__ */ r("div", { className: "Dimmer__inner", children: s }) }); } export { - _ as Dimmer + l as Dimmer }; diff --git a/dist/components/Divider.js b/dist/components/Divider.js index 67d5b7b..74fffbf 100644 --- a/dist/components/Divider.js +++ b/dist/components/Divider.js @@ -1,22 +1,18 @@ -import { jsx as r } from "react/jsx-runtime"; -import { classes as e } from "../common/react.js"; -import '../assets/Divider.css';const d = "_horizontal_1dhv5_9", c = "_hidden_1dhv5_12", s = "_vertical_1dhv5_16", i = { - horizontal: d, - hidden: c, - vertical: s -}; -function l(t) { - const { hidden: o, vertical: n } = t; - return /* @__PURE__ */ r( +import { jsx as d } from "react/jsx-runtime"; +import { classes as o } from "../common/react.js"; +function n(i) { + const { hidden: r, vertical: e } = i; + return /* @__PURE__ */ d( "div", { - className: e([ - o && i.hidden, - n ? i.vertical : i.horizontal + className: o([ + "Divider", + r && "Divider--hidden", + e ? "Divider--vertical" : "Divider--horizontal" ]) } ); } export { - l as Divider + n as Divider }; diff --git a/dist/components/DmIcon.d.ts b/dist/components/DmIcon.d.ts index 8c65a08..c1a82c5 100644 --- a/dist/components/DmIcon.d.ts +++ b/dist/components/DmIcon.d.ts @@ -1,6 +1,5 @@ import { ReactNode } from 'react'; import { BoxProps } from './Box'; - declare enum Direction { NORTH = 1, SOUTH = 2, diff --git a/dist/components/DraggableControl.js b/dist/components/DraggableControl.js index 4ea85b5..5e8cecc 100644 --- a/dist/components/DraggableControl.js +++ b/dist/components/DraggableControl.js @@ -1,14 +1,14 @@ -import { jsxs as T, Fragment as N, jsx as F } from "react/jsx-runtime"; -import { clamp as m } from "../common/math.js"; -import { Component as b, createRef as I } from "react"; +import { jsxs as T, Fragment as I, jsx as F } from "react/jsx-runtime"; +import { Component as x, createRef as y } from "react"; +import { clamp as c } from "../common/math.js"; import { AnimatedNumber as M } from "./AnimatedNumber.js"; const R = 400; -function S(v, u) { +function N(v, u) { return v.screenX * u[0] + v.screenY * u[1]; } -class C extends b { +class C extends x { constructor(u) { - super(u), this.inputRef = I(), this.state = { + super(u), this.inputRef = y(), this.state = { value: u.value, dragging: !1, editing: !1, @@ -28,7 +28,7 @@ class C extends b { const { value: i, dragMatrix: l } = this.props, { editing: s } = this.state; s || (document.body.style["pointer-events"] = "none", this.ref = e.target, this.setState({ dragging: !1, - origin: S(e, l), + origin: N(e, l), value: i, internalValue: i }), this.timer = setTimeout(() => { @@ -36,26 +36,26 @@ class C extends b { dragging: !0 }); }, 250), this.dragInterval = setInterval(() => { - const { dragging: o, value: g } = this.state, { onDrag: a } = this.props; - o && a && a(e, g); + const { dragging: o, value: g } = this.state, { onDrag: r } = this.props; + o && r && r(e, g); }, this.props.updateRate || R), document.addEventListener("mousemove", this.handleDragMove), document.addEventListener("mouseup", this.handleDragEnd)); }, this.handleDragMove = (e) => { const { minValue: i, maxValue: l, step: s, stepPixelSize: o, dragMatrix: g } = this.props; - this.setState((a) => { - const n = { ...a }, p = S(e, g) - n.origin; - if (a.dragging) { + this.setState((r) => { + const a = { ...r }, p = N(e, g) - a.origin; + if (r.dragging) { const h = Number.isFinite(i) ? i % s : 0; - n.internalValue = m( - n.internalValue + p * s / o, + a.internalValue = c( + a.internalValue + p * s / o, i - s, l + s - ), n.value = m( - n.internalValue - n.internalValue % s + h, + ), a.value = c( + a.internalValue - a.internalValue % s + h, i, l - ), n.origin = S(e, g); - } else Math.abs(p) > 4 && (n.dragging = !0); - return n; + ), a.origin = N(e, g); + } else Math.abs(p) > 4 && (a.dragging = !0); + return a; }); }, this.handleDragEnd = (e) => { const { onChange: i, onDrag: l } = this.props, { dragging: s, value: o, internalValue: g } = this.state; @@ -66,9 +66,9 @@ class C extends b { }), document.removeEventListener("mousemove", this.handleDragMove), document.removeEventListener("mouseup", this.handleDragEnd), s) this.suppressFlicker(), i && i(e, o), l && l(e, o); else if (this.inputRef) { - const a = this.inputRef.current; - a.value = g, setTimeout(() => { - a.focus(), a.select(); + const r = this.inputRef.current; + r.value = g, setTimeout(() => { + r.focus(), r.select(); }, 10); } }; @@ -83,39 +83,43 @@ class C extends b { animated: s, value: o, unit: g, - minValue: a, - maxValue: n, + minValue: r, + maxValue: a, unclamped: p, format: h, - onChange: f, - onDrag: c, - children: D, + onChange: m, + onDrag: f, + children: S, // Input props - height: k, - lineHeight: V, - fontSize: y + height: V, + lineHeight: D, + fontSize: b } = this.props; let d = o; (u || l) && (d = i); - const E = /* @__PURE__ */ T(N, { children: [ + const k = /* @__PURE__ */ T(I, { children: [ s && !u && !l ? /* @__PURE__ */ F(M, { value: d, format: h }) : h ? h(d) : d, - g ? " " + g : "" - ] }), x = /* @__PURE__ */ F( + g ? ` ${g}` : "" + ] }), E = /* @__PURE__ */ F( "input", { ref: this.inputRef, className: "NumberInput__input", style: { display: e ? void 0 : "none", - height: k, - lineHeight: V, - fontsize: y + height: V, + lineHeight: D, + fontsize: b }, - onBlur: (r) => { + onBlur: (n) => { if (!e) return; let t; - if (p ? t = parseFloat(r.target.value) : t = m(parseFloat(r.target.value), a, n), Number.isNaN(t)) { + if (p ? t = Number.parseFloat(n.target.value) : t = c( + Number.parseFloat(n.target.value), + r, + a + ), Number.isNaN(t)) { this.setState({ editing: !1 }); @@ -124,12 +128,16 @@ class C extends b { this.setState({ editing: !1, value: t - }), this.suppressFlicker(), f && f(r, t), c && c(r, t); + }), this.suppressFlicker(), m && m(n, t), f && f(n, t); }, - onKeyDown: (r) => { - if (r.keyCode === 13) { + onKeyDown: (n) => { + if (n.keyCode === 13) { let t; - if (p ? t = parseFloat(r.target.value) : t = m(parseFloat(r.target.value), a, n), Number.isNaN(t)) { + if (p ? t = Number.parseFloat(n.target.value) : t = c( + Number.parseFloat(n.target.value), + r, + a + ), Number.isNaN(t)) { this.setState({ editing: !1 }); @@ -138,10 +146,10 @@ class C extends b { this.setState({ editing: !1, value: t - }), this.suppressFlicker(), f && f(r, t), c && c(r, t); + }), this.suppressFlicker(), m && m(n, t), f && f(n, t); return; } - if (r.keyCode === 27) { + if (n.keyCode === 27) { this.setState({ editing: !1 }); @@ -150,20 +158,20 @@ class C extends b { } } ); - return D({ + return S({ dragging: u, editing: e, value: o, displayValue: d, - displayElement: E, - inputElement: x, + displayElement: k, + inputElement: E, handleDragStart: this.handleDragStart }); } } C.defaultProps = { - minValue: -1 / 0, - maxValue: 1 / 0, + minValue: Number.NEGATIVE_INFINITY, + maxValue: Number.POSITIVE_INFINITY, step: 1, stepPixelSize: 1, suppressFlicker: 50, diff --git a/dist/components/Dropdown.d.ts b/dist/components/Dropdown.d.ts index b6a5a23..4e3e24b 100644 --- a/dist/components/Dropdown.d.ts +++ b/dist/components/Dropdown.d.ts @@ -1,6 +1,5 @@ import { ReactNode } from 'react'; import { BoxProps } from './Box'; - export type DropdownEntry = { displayText: ReactNode; value: string | number; diff --git a/dist/components/Dropdown.js b/dist/components/Dropdown.js index 39aec9e..eaee454 100644 --- a/dist/components/Dropdown.js +++ b/dist/components/Dropdown.js @@ -1,141 +1,147 @@ -import { jsx as o, jsxs as m, Fragment as W } from "react/jsx-runtime"; -import { useState as F, useRef as L, useEffect as q } from "react"; -import { classes as y } from "../common/react.js"; -import { unit as z } from "./Box.js"; +import { jsx as l, jsxs as p, Fragment as W } from "react/jsx-runtime"; +import { useState as F, useRef as L, useEffect as S } from "react"; +import { classes as N } from "../common/react.js"; +import { unit as $ } from "./Box.js"; import { Button as D } from "./Button.js"; import { Icon as b } from "./Icon.js"; -import { Popper as A } from "./Popper.js"; -const G = -1; -function f(d) { - return typeof d == "string" ? d : d.value; +import { Popper as q } from "./Popper.js"; +const z = -1; +function h(u) { + return typeof u == "string" ? u : u.value; } -function Y(d) { +function X(u) { const { - autoScroll: w = !0, + autoScroll: v = !0, buttons: I, className: O, clipSelectedText: k = !0, color: B = "default", - disabled: a, - displayText: C, + disabled: d, + displayText: E, icon: x, iconRotation: T, iconSpin: j, - menuWidth: R = "15rem", - noChevron: S, - onClick: p, - onSelected: i, - options: r = [], - over: g, - placeholder: E = "Select...", - selected: u, + menuWidth: C = "15rem", + noChevron: R, + onClick: a, + onSelected: o, + options: c = [], + over: y, + placeholder: K = "Select...", + selected: m, width: P = "15rem" - } = d, [l, h] = F(!1), V = g ? !l : l, v = L(null), s = r.findIndex((e) => f(e) === u) || 0; - function _(e) { - var c; - let t = e; - e < s ? t = e < 2 ? 0 : e - 2 : t = e > r.length - 3 ? r.length - 1 : e - 2; - const n = (c = v.current) == null ? void 0 : c.children[t]; + } = u, [r, f] = F(!1), V = y ? !r : r, w = L(null), i = c.findIndex((e) => h(e) === m) || 0; + function g(e) { + var t; + let s = e; + e < i ? s = e < 2 ? 0 : e - 2 : s = e > c.length - 3 ? c.length - 1 : e - 2; + const n = (t = w.current) == null ? void 0 : t.children[s]; n == null || n.scrollIntoView({ block: "nearest" }); } - function N(e) { - if (r.length < 1 || a) + function _(e) { + if (c.length < 1 || d) return; - const t = 0, n = r.length - 1; - let c; - s < 0 ? c = e === "next" ? n : t : e === "next" ? c = s === n ? t : s + 1 : c = s === t ? n : s - 1, l && w && _(c), i == null || i(f(r[c])); + const s = 0, n = c.length - 1; + let t; + i < 0 ? t = e === "next" ? n : s : e === "next" ? t = i === n ? s : i + 1 : t = i === s ? n : i - 1, r && v && g(t), o == null || o(h(c[t])); } - return q(() => { + return S(() => { var e; - l && (w && s !== G && _(s), (e = v.current) == null || e.focus()); - }, [l]), /* @__PURE__ */ o( - A, + r && (v && i !== z && g(i), (e = w.current) == null || e.focus()); + }, [r]), /* @__PURE__ */ l( + q, { - isOpen: l, - onClickOutside: () => h(!1), - placement: g ? "top-start" : "bottom-start", - content: /* @__PURE__ */ m( + isOpen: r, + onClickOutside: () => f(!1), + placement: y ? "top-start" : "bottom-start", + content: /* @__PURE__ */ p( "div", { className: "Layout Dropdown__menu", - style: { minWidth: R }, - ref: v, + style: { minWidth: C }, + ref: w, children: [ - r.length === 0 && /* @__PURE__ */ o("div", { className: "Dropdown__menuentry", children: "No options" }), - r.map((e, t) => { - const n = f(e); - return /* @__PURE__ */ o( + c.length === 0 && /* @__PURE__ */ l("div", { className: "Dropdown__menuentry", children: "No options" }), + c.map((e, s) => { + const n = h(e); + return /* @__PURE__ */ l( "div", { - className: y([ + className: N([ "Dropdown__menuentry", - u === n && "selected" + m === n && "selected" ]), onClick: () => { - h(!1), i == null || i(n); + f(!1), o == null || o(n); + }, + onKeyDown: (t) => { + t.key === "Enter" && (f(!1), o == null || o(n)); }, children: typeof e == "string" ? e : e.displayText }, - t + s ); }) ] } ), - children: /* @__PURE__ */ m("div", { className: "Dropdown", style: { width: z(P) }, children: [ - /* @__PURE__ */ m( + children: /* @__PURE__ */ p("div", { className: "Dropdown", style: { width: $(P) }, children: [ + /* @__PURE__ */ p( "div", { - className: y([ + className: N([ "Dropdown__control", "Button", "Button--dropdown", - "Button--color--" + B, - a && "Button--disabled", + `Button--color--${B}`, + d && "Button--disabled", O ]), onClick: (e) => { - a && !l || (h(!l), p == null || p(e)); + d && !r || (f(!r), a == null || a(e)); + }, + onKeyDown: (e) => { + e.key === "Enter" && !d && (f(!r), a == null || a(e)); }, children: [ - x && /* @__PURE__ */ o(b, { mr: 1, name: x, rotation: T, spin: j }), - /* @__PURE__ */ o( + x && /* @__PURE__ */ l(b, { mr: 1, name: x, rotation: T, spin: j }), + /* @__PURE__ */ l( "span", { className: "Dropdown__selected-text", style: { overflow: k ? "hidden" : "visible" }, - children: C || u && f(u) || E + children: E || m && h(m) || K } ), - !S && /* @__PURE__ */ o("span", { className: "Dropdown__arrow-button", children: /* @__PURE__ */ o(b, { name: V ? "chevron-up" : "chevron-down" }) }) + !R && /* @__PURE__ */ l("span", { className: "Dropdown__arrow-button", children: /* @__PURE__ */ l(b, { name: V ? "chevron-up" : "chevron-down" }) }) ] } ), - I && /* @__PURE__ */ m(W, { children: [ - /* @__PURE__ */ o( + I && /* @__PURE__ */ p(W, { children: [ + /* @__PURE__ */ l( D, { - disabled: a, + disabled: d, height: 1.8, icon: "chevron-left", onClick: () => { - N( + _( "previous" /* Previous */ ); } } ), - /* @__PURE__ */ o( + /* @__PURE__ */ l( D, { - disabled: a, + disabled: d, height: 1.8, icon: "chevron-right", onClick: () => { - N( + _( "next" /* Next */ ); @@ -148,5 +154,5 @@ function Y(d) { ); } export { - Y as Dropdown + X as Dropdown }; diff --git a/dist/components/FitText.d.ts b/dist/components/FitText.d.ts index 2dd0ce9..ca9db74 100644 --- a/dist/components/FitText.d.ts +++ b/dist/components/FitText.d.ts @@ -1,5 +1,4 @@ import { Component, HTMLAttributes, PropsWithChildren, RefObject } from 'react'; - type Props = { acceptableDifference?: number; maxFontSize: number; diff --git a/dist/components/Flex.d.ts b/dist/components/Flex.d.ts index 59b8811..6a71692 100644 --- a/dist/components/Flex.d.ts +++ b/dist/components/Flex.d.ts @@ -1,5 +1,4 @@ import { BoxProps } from './Box'; - export type FlexProps = Partial<{ /** * Default alignment of all children. @@ -60,6 +59,7 @@ export declare function Flex(props: any): import("react/jsx-runtime").JSX.Elemen export declare namespace Flex { var Item: typeof FlexItem; } +export declare const computeFlexItemClassName: (props: FlexItemProps) => string; export type FlexItemProps = Partial<{ /** This allows the default alignment (or the one specified by align-items) to be overridden for individual flex items. */ align: string | boolean; diff --git a/dist/components/Flex.js b/dist/components/Flex.js index 32da2d5..06a9e97 100644 --- a/dist/components/Flex.js +++ b/dist/components/Flex.js @@ -1,72 +1,70 @@ -import { jsx as c } from "react/jsx-runtime"; -import { classes as l } from "../common/react.js"; -import { computeBoxClassName as m, computeBoxProps as a, unit as d } from "./Box.js"; -import '../assets/Flex.css';const p = "_flex_djoni_5", N = "_inline_djoni_10", r = { - flex: p, - inline: N -}; -function y(e) { - return l([ - r.flex, - e.inline && r.inline, +import { jsx as l } from "react/jsx-runtime"; +import { classes as r } from "../common/react.js"; +import { computeBoxClassName as m, computeBoxProps as a, unit as f } from "./Box.js"; +function p(e) { + return r([ + "Flex", + e.inline && "Flex--inline", m(e) ]); } -function v(e) { - const { direction: n, wrap: t, align: o, justify: s, ...i } = e; +function d(e) { + const { direction: s, wrap: t, align: i, justify: n, ...o } = e; return a({ style: { - ...i.style, - flexDirection: n, + ...o.style, + flexDirection: s, flexWrap: t === !0 ? "wrap" : t, - alignItems: o, - justifyContent: s + alignItems: i, + justifyContent: n }, - ...i + ...o }); } -function _(e) { - const { className: n, ...t } = e; - return /* @__PURE__ */ c( +function F(e) { + const { className: s, ...t } = e; + return /* @__PURE__ */ l( "div", { - className: l([n, y(t)]), - ...v(t) + className: r([s, p(t)]), + ...d(t) } ); } -function g(e) { - const { style: n, grow: t, order: o, shrink: s, basis: i, align: u, ...f } = e, x = i ?? // IE11: Set basis to specified width if it's known, which fixes certain +const N = (e) => r(["Flex__item", m(e)]); +function v(e) { + const { style: s, grow: t, order: i, shrink: n, basis: o, align: c, ...u } = e, x = o ?? // IE11: Set basis to specified width if it's known, which fixes certain // bugs when rendering tables inside the flex. e.width ?? // If grow is used, basis should be set to 0 to be consistent with // flex css shorthand `flex: 1`. (t !== void 0 ? 0 : void 0); return a({ style: { - ...n, + ...s, flexGrow: t !== void 0 && Number(t), - flexShrink: s !== void 0 && Number(s), - flexBasis: d(x), - order: o, - alignSelf: u + flexShrink: n !== void 0 && Number(n), + flexBasis: f(x), + order: i, + alignSelf: c }, - ...f + ...u }); } -function j(e) { - const { className: n, ...t } = e; - return /* @__PURE__ */ c( +function y(e) { + const { className: s, ...t } = e; + return /* @__PURE__ */ l( "div", { - className: l([n, m(e)]), - ...g(t) + className: r([s, N(e)]), + ...v(t) } ); } -_.Item = j; +F.Item = y; export { - _ as Flex, - y as computeFlexClassName, - g as computeFlexItemProps, - v as computeFlexProps + F as Flex, + p as computeFlexClassName, + N as computeFlexItemClassName, + v as computeFlexItemProps, + d as computeFlexProps }; diff --git a/dist/components/Icon.d.ts b/dist/components/Icon.d.ts index 52d36c6..a39fd4a 100644 --- a/dist/components/Icon.d.ts +++ b/dist/components/Icon.d.ts @@ -1,7 +1,6 @@ import { CSSProperties, ReactNode } from 'react'; import { BooleanLike } from '../common/react'; import { BoxProps } from './Box'; - type Props = { /** Icon name. See [icon list](https://fontawesome.com/v5/search?o=r&m=free) */ name: string; diff --git a/dist/components/Icon.js b/dist/components/Icon.js index 7a2b67c..ac2d1bd 100644 --- a/dist/components/Icon.js +++ b/dist/components/Icon.js @@ -1,51 +1,44 @@ -import { jsx as l } from "react/jsx-runtime"; -import { classes as m } from "../common/react.js"; +import { jsx as m } from "react/jsx-runtime"; +import { classes as l } from "../common/react.js"; import { computeBoxProps as p, computeBoxClassName as u } from "./Box.js"; -import '../assets/Icon.css';const x = "_iconStack_bg05l_7", y = "_icon_bg05l_7", S = { - iconStack: x, - icon: y -}, f = /-o$/; -function b(a) { - const { name: t, size: o, spin: c, className: _, rotation: i, ...n } = a, e = n.style || {}; - o && (e.fontSize = o * 100 + "%"), i && (e.transform = `rotate(${i}deg)`), n.style = e; - const N = p(n); - let s = ""; - if (t.startsWith("tg-")) - s = t; +const f = /-o$/; +function d(c) { + const { name: s, size: o, spin: a, className: N, rotation: r, ...e } = c, n = e.style || {}; + o && (n.fontSize = `${o * 100}%`), r && (n.transform = `rotate(${r}deg)`), e.style = n; + const x = p(e); + let t = ""; + if (s.startsWith("tg-")) + t = s; else { - const k = f.test(t), r = t.replace(f, ""), g = !r.startsWith("fa-"); - s = k ? "far " : "fas ", g && (s += "fa-"), s += r, c && (s += " fa-spin"); + const I = f.test(s), i = s.replace(f, ""), S = !i.startsWith("fa-"); + t = I ? "far " : "fas ", S && (t += "fa-"), t += i, a && (t += " fa-spin"); } - return /* @__PURE__ */ l( + return /* @__PURE__ */ m( "i", { - className: m([ - S.icon, - s, - _, - u(n) + className: l([ + "Icon", + t, + N, + u(e) ]), - ...N + ...x } ); } -function d(a) { - const { className: t, children: o, ...c } = a; - return /* @__PURE__ */ l( +function g(c) { + const { className: s, children: o, ...a } = c; + return /* @__PURE__ */ m( "span", { - className: m([ - S.iconStack, - t, - u(c) - ]), - ...p(c), + className: l(["IconStack", s, u(a)]), + ...p(a), children: o } ); } -b.Stack = d; +d.Stack = g; export { - b as Icon, - d as IconStack + d as Icon, + g as IconStack }; diff --git a/dist/components/Image.d.ts b/dist/components/Image.d.ts index f14d9f7..b188303 100644 --- a/dist/components/Image.d.ts +++ b/dist/components/Image.d.ts @@ -1,5 +1,4 @@ import { BoxProps } from './Box'; - type Props = Partial<{ className: string; /** True is default, this fixes an ie thing */ diff --git a/dist/components/Image.js b/dist/components/Image.js index aa998a3..0678d9e 100644 --- a/dist/components/Image.js +++ b/dist/components/Image.js @@ -1,15 +1,15 @@ import { jsx as p } from "react/jsx-runtime"; -import { useRef as f } from "react"; -import { computeBoxProps as a } from "./Box.js"; +import { useRef as a } from "react"; +import { computeBoxProps as f } from "./Box.js"; const l = 5; -function b(o) { +function E(o) { const { fixBlur: s = !0, fixErrors: m = !1, objectFit: n = "fill", src: e, ...c - } = o, t = f(0), r = a(c); + } = o, t = a(0), r = f(c); return r.style = { ...r.style, "-ms-interpolation-mode": s ? "nearest-neighbor" : "auto", @@ -26,10 +26,11 @@ function b(o) { } }, src: e, - ...r + ...r, + alt: "dm icon" } ); } export { - b as Image + E as Image }; diff --git a/dist/components/ImageButton.d.ts b/dist/components/ImageButton.d.ts index 147fe08..561031e 100644 --- a/dist/components/ImageButton.d.ts +++ b/dist/components/ImageButton.d.ts @@ -2,7 +2,6 @@ import { Placement } from '@popperjs/core'; import { ReactNode } from 'react'; import { BooleanLike } from '../common/react'; import { BoxProps } from './Box'; - type Props = Partial<{ /** Asset cache. Example: `asset={['assetname32x32', thing.key]}` */ asset: string[]; diff --git a/dist/components/ImageButton.js b/dist/components/ImageButton.js index dc79f65..fa4a6bc 100644 --- a/dist/components/ImageButton.js +++ b/dist/components/ImageButton.js @@ -1,212 +1,125 @@ -import { jsxs as d, jsx as t } from "react/jsx-runtime"; -import { classes as e } from "../common/react.js"; -import { computeBoxProps as D } from "./Box.js"; -import { DmIcon as F } from "./DmIcon.js"; -import { Icon as E } from "./Icon.js"; +import { jsxs as f, jsx as t } from "react/jsx-runtime"; +import { classes as l } from "../common/react.js"; +import { computeBoxProps as B } from "./Box.js"; +import { DmIcon as D } from "./DmIcon.js"; +import { Icon as F } from "./Icon.js"; import { Image as j } from "./Image.js"; import { Stack as I } from "./Stack.js"; import { Tooltip as z } from "./Tooltip.js"; -import '../assets/ImageButton.css';const P = "_color__black_7gau9_18", q = "_contentColor__black_7gau9_29", M = "_buttonsContainerColor__black_7gau9_37", R = "_color__white_7gau9_45", T = "_contentColor__white_7gau9_56", G = "_buttonsContainerColor__white_7gau9_64", H = "_color__red_7gau9_72", J = "_contentColor__red_7gau9_83", K = "_buttonsContainerColor__red_7gau9_91", L = "_color__orange_7gau9_99", O = "_contentColor__orange_7gau9_110", Q = "_buttonsContainerColor__orange_7gau9_118", U = "_color__yellow_7gau9_126", V = "_contentColor__yellow_7gau9_137", W = "_buttonsContainerColor__yellow_7gau9_145", X = "_color__olive_7gau9_153", Y = "_contentColor__olive_7gau9_164", Z = "_buttonsContainerColor__olive_7gau9_172", oo = "_color__green_7gau9_180", to = "_contentColor__green_7gau9_191", _o = "_buttonsContainerColor__green_7gau9_199", no = "_color__teal_7gau9_207", eo = "_contentColor__teal_7gau9_218", ro = "_buttonsContainerColor__teal_7gau9_226", lo = "_color__blue_7gau9_234", ao = "_contentColor__blue_7gau9_245", co = "_buttonsContainerColor__blue_7gau9_253", so = "_color__violet_7gau9_261", io = "_contentColor__violet_7gau9_272", uo = "_buttonsContainerColor__violet_7gau9_280", Co = "_color__purple_7gau9_288", go = "_contentColor__purple_7gau9_299", bo = "_buttonsContainerColor__purple_7gau9_307", po = "_color__pink_7gau9_315", mo = "_contentColor__pink_7gau9_326", fo = "_buttonsContainerColor__pink_7gau9_334", ho = "_color__brown_7gau9_342", vo = "_contentColor__brown_7gau9_353", yo = "_buttonsContainerColor__brown_7gau9_361", wo = "_color__grey_7gau9_369", ko = "_contentColor__grey_7gau9_380", xo = "_buttonsContainerColor__grey_7gau9_388", Io = "_color__good_7gau9_423", $o = "_contentColor__good_7gau9_434", Ao = "_buttonsContainerColor__good_7gau9_442", Bo = "_color__average_7gau9_450", No = "_contentColor__average_7gau9_461", So = "_buttonsContainerColor__average_7gau9_469", Do = "_color__bad_7gau9_477", Fo = "_contentColor__bad_7gau9_488", Eo = "_buttonsContainerColor__bad_7gau9_496", jo = "_color__label_7gau9_504", zo = "_contentColor__label_7gau9_515", Po = "_buttonsContainerColor__label_7gau9_523", qo = "_color__default_7gau9_531", Mo = "_disabled_7gau9_542", Ro = "_selected_7gau9_547", To = "_contentColor__default_7gau9_558", Go = "_contentDisabled_7gau9_566", Ho = "_contentSelected_7gau9_571", Jo = "_buttonsContainerColor__default_7gau9_579", Ko = "_ImageButton_7gau9_587", Lo = "_noAction_7gau9_595", Oo = "_container_7gau9_598", Qo = "_image_7gau9_603", Uo = "_buttonsContainer_7gau9_37", Vo = "_buttonsAltContainer_7gau9_621", Wo = "_buttonsEmpty_7gau9_628", Xo = "_content_7gau9_29", Yo = "_fluid_7gau9_649", Zo = "_info_7gau9_661", ot = "_title_7gau9_667", tt = "_divider_7gau9_671", _t = "_contentFluid_7gau9_675", nt = "_hasButtons_7gau9_683", o = { - color__black: P, - contentColor__black: q, - buttonsContainerColor__black: M, - color__white: R, - contentColor__white: T, - buttonsContainerColor__white: G, - color__red: H, - contentColor__red: J, - buttonsContainerColor__red: K, - color__orange: L, - contentColor__orange: O, - buttonsContainerColor__orange: Q, - color__yellow: U, - contentColor__yellow: V, - buttonsContainerColor__yellow: W, - color__olive: X, - contentColor__olive: Y, - buttonsContainerColor__olive: Z, - color__green: oo, - contentColor__green: to, - buttonsContainerColor__green: _o, - color__teal: no, - contentColor__teal: eo, - buttonsContainerColor__teal: ro, - color__blue: lo, - contentColor__blue: ao, - buttonsContainerColor__blue: co, - color__violet: so, - contentColor__violet: io, - buttonsContainerColor__violet: uo, - color__purple: Co, - contentColor__purple: go, - buttonsContainerColor__purple: bo, - color__pink: po, - contentColor__pink: mo, - buttonsContainerColor__pink: fo, - color__brown: ho, - contentColor__brown: vo, - buttonsContainerColor__brown: yo, - color__grey: wo, - contentColor__grey: ko, - buttonsContainerColor__grey: xo, - "color__light-grey": "_color__light-grey_7gau9_396", - "contentColor__light-grey": "_contentColor__light-grey_7gau9_407", - "buttonsContainerColor__light-grey": "_buttonsContainerColor__light-grey_7gau9_415", - color__good: Io, - contentColor__good: $o, - buttonsContainerColor__good: Ao, - color__average: Bo, - contentColor__average: No, - buttonsContainerColor__average: So, - color__bad: Do, - contentColor__bad: Fo, - buttonsContainerColor__bad: Eo, - color__label: jo, - contentColor__label: zo, - buttonsContainerColor__label: Po, - color__default: qo, - disabled: Mo, - selected: Ro, - contentColor__default: To, - contentDisabled: Go, - contentSelected: Ho, - buttonsContainerColor__default: Jo, - ImageButton: Ko, - noAction: Lo, - container: Oo, - image: Qo, - buttonsContainer: Uo, - buttonsAltContainer: Vo, - buttonsEmpty: Wo, - content: Xo, - fluid: Yo, - info: Zo, - title: ot, - divider: tt, - contentFluid: _t, - hasButtons: nt -}; -function Ct($) { +function H(k) { const { - asset: p, - base64: s, - buttons: i, - buttonsAlt: m, - children: r, - className: A, - color: _, + asset: h, + base64: r, + buttons: m, + buttonsAlt: g, + children: i, + className: w, + color: e, disabled: a, - dmFallback: f, - dmIcon: h, - dmIconState: v, + dmFallback: b, + dmIcon: x, + dmIconState: C, fluid: c, - imageSize: n = 64, - imageSrc: u, - onClick: C, - onRightClick: g, - selected: y, - title: w, - tooltip: k, - tooltipPosition: B, - ...N - } = $; - function x(l, S) { - return /* @__PURE__ */ t(I, { height: `${n}px`, width: `${n}px`, children: /* @__PURE__ */ t(I.Item, { grow: !0, textAlign: "center", align: "center", children: /* @__PURE__ */ t( - E, + imageSize: o = 64, + imageSrc: d, + onClick: s, + onRightClick: p, + selected: _, + title: $, + tooltip: y, + tooltipPosition: v, + ...S + } = k; + function N(n, A) { + return /* @__PURE__ */ t(I, { height: `${o}px`, width: `${o}px`, children: /* @__PURE__ */ t(I.Item, { grow: !0, textAlign: "center", align: "center", children: /* @__PURE__ */ t( + F, { - spin: S, - name: l, + spin: A, + name: n, color: "gray", - style: { fontSize: `calc(${n}px * 0.75)` } + style: { fontSize: `calc(${o}px * 0.75)` } } ) }) }); } - let b = /* @__PURE__ */ d( + let u = /* @__PURE__ */ f( "div", { - className: e([ - o.container, - i && o.hasButtons, - !C && !g && o.noAction, - y && o.selected, - a && o.disabled, - _ && typeof _ == "string" ? o["color__" + _] : o.color__default + className: l([ + "container", + m && "hasButtons", + !s && !p && "noAction", + _ && "selected", + a && "disabled", + e && typeof e == "string" ? `color__${e}` : "color__default" ]), tabIndex: a ? void 0 : 0, - onClick: (l) => { - !a && C && C(l); + onClick: (n) => { + !a && s && s(n); + }, + onKeyDown: (n) => { + n.key === "Enter" && !a && s && s(n); }, - onContextMenu: (l) => { - l.preventDefault(), !a && g && g(l); + onContextMenu: (n) => { + n.preventDefault(), !a && p && p(n); }, - style: { width: c ? "auto" : `calc(${n}px + 0.5em + 2px)` }, + style: { width: c ? "auto" : `calc(${o}px + 0.5em + 2px)` }, children: [ - /* @__PURE__ */ t("div", { className: e([o.image]), children: s || p || u ? /* @__PURE__ */ t( + /* @__PURE__ */ t("div", { className: "image", children: r || h || d ? /* @__PURE__ */ t( j, { - className: e(!s && !u && p || []), - src: s ? `data:image/png;base64,${s}` : u, - height: `${n}px`, - width: `${n}px` + className: l(!r && !d && h || []), + src: r ? `data:image/png;base64,${r}` : d, + height: `${o}px`, + width: `${o}px` } - ) : h && v ? /* @__PURE__ */ t( - F, + ) : x && C ? /* @__PURE__ */ t( + D, { - icon: h, - icon_state: v, - fallback: f || x("spinner", !0), - height: `${n}px`, - width: `${n}px` + icon: x, + icon_state: C, + fallback: b || N("spinner", !0), + height: `${o}px`, + width: `${o}px` } - ) : x("question", !1) }), - c ? /* @__PURE__ */ d("div", { className: e([o.info]), children: [ - w && /* @__PURE__ */ t( - "span", - { - className: e([o.title, r && o.divider]), - children: w - } - ), - r && /* @__PURE__ */ t("span", { className: e([o.contentFluid]), children: r }) - ] }) : r && /* @__PURE__ */ t( + ) : N("question", !1) }), + c ? /* @__PURE__ */ f("div", { className: "info", children: [ + $ && /* @__PURE__ */ t("span", { className: l(["title", i && "divider"]), children: $ }), + i && /* @__PURE__ */ t("span", { className: "contentFluid", children: i }) + ] }) : i && /* @__PURE__ */ t( "span", { - className: e([ - o.content, - y && o.contentSelected, - a && o.contentDisabled, - _ && typeof _ == "string" ? o["contentColor__" + _] : o.contentColor__default + className: l([ + "content", + _ && "contentSelected", + a && "contentDisabled", + e && typeof e == "string" ? `contentColor__${e}` : "contentColor__default" ]), - children: r + children: i } ) ] } ); - return k && (b = /* @__PURE__ */ t(z, { content: k, position: B, children: b })), /* @__PURE__ */ d( + return y && (u = /* @__PURE__ */ t(z, { content: y, position: v, children: u })), /* @__PURE__ */ f( "div", { - className: e([ - o.ImageButton, - c && o.fluid, - A - ]), - ...D(N), + className: l(["ImageButton", c && "fluid", w]), + ...B(S), children: [ - b, - i && /* @__PURE__ */ t( + u, + m && /* @__PURE__ */ t( "div", { - className: e([ - o.buttonsContainer, - m && o.buttonsAltContainer, - !r && o.buttonsEmpty, - c && _ && typeof _ == "string" ? o["buttonsContainerColor__" + _] : c && o.buttonsContainerColor__default + className: l([ + "buttonsContainer", + g && "buttonsAltContainer", + !i && "buttonsEmpty", + c && e && typeof e == "string" ? `buttonsContainerColor__${e}` : c && "buttonsContainerColor__default" ]), style: { - width: m ? `calc(${n}px + 0.5em)` : "auto" + width: g ? `calc(${o}px + 0.5em)` : "auto" }, - children: i + children: m } ) ] @@ -214,5 +127,5 @@ function Ct($) { ); } export { - Ct as ImageButton + H as ImageButton }; diff --git a/dist/components/InfinitePlane.js b/dist/components/InfinitePlane.js index 2a2b690..b175aae 100644 --- a/dist/components/InfinitePlane.js +++ b/dist/components/InfinitePlane.js @@ -24,7 +24,7 @@ class k extends v { } doOffsetMouse(e) { const { zoom: o } = this.state; - e.screenZoomX = e.screenX * Math.pow(o, -1), e.screenZoomY = e.screenY * Math.pow(o, -1); + e.screenZoomX = e.screenX * o ** -1, e.screenZoomY = e.screenY * o ** -1; } handleMouseDown(e) { this.setState((o) => ({ diff --git a/dist/components/Input.d.ts b/dist/components/Input.d.ts index 9d56b0d..cb12a11 100644 --- a/dist/components/Input.d.ts +++ b/dist/components/Input.d.ts @@ -1,6 +1,5 @@ import { SyntheticEvent } from 'react'; import { BoxProps } from './Box'; - type ConditionalProps = { /** * Mark this if you want to debounce onInput. diff --git a/dist/components/Input.js b/dist/components/Input.js index 7540758..060b1f0 100644 --- a/dist/components/Input.js +++ b/dist/components/Input.js @@ -1,88 +1,81 @@ -import { jsxs as K, jsx as m } from "react/jsx-runtime"; -import { useRef as V, useEffect as d } from "react"; -import { KEY as j, isEscape as k } from "../common/keys.js"; -import { classes as B } from "../common/react.js"; -import { debounce as R } from "../common/timer.js"; -import { Box as S } from "./Box.js"; -import '../assets/Input.css';const F = "_input_17i79_20", L = "_fluid_17i79_35", Y = "_baseline_17i79_40", q = "_inner_17i79_45", v = "_monospace_17i79_71", u = { - input: F, - fluid: L, - baseline: Y, - inner: q, - monospace: v -}; -function a(r) { - return typeof r != "number" && typeof r != "string" ? "" : String(r); +import { jsxs as E, jsx as p } from "react/jsx-runtime"; +import { useRef as K, useEffect as m } from "react"; +import { KEY as V, isEscape as j } from "../common/keys.js"; +import { classes as k } from "../common/react.js"; +import { debounce as B } from "../common/timer.js"; +import { Box as R } from "./Box.js"; +function l(u) { + return typeof u != "number" && typeof u != "string" ? "" : String(u); } -const z = R((r) => r(), 250); -function P(r) { +const S = B((u) => u(), 250); +function A(u) { const { - autoFocus: _, - autoSelect: f, - className: b, - disabled: g, + autoFocus: d, + autoSelect: s, + className: g, + disabled: I, expensive: T, - fluid: y, + fluid: b, maxLength: x, - monospace: h, + monospace: y, onChange: t, - onEnter: i, + onEnter: n, onEscape: o, - onInput: s, - placeholder: w, - selfClear: I, - value: c, + onInput: i, + placeholder: h, + selfClear: w, + value: a, ...N - } = r, l = V(null); - function D(e) { - var p; - if (!s) return; - const n = (p = e.currentTarget) == null ? void 0 : p.value; - T ? z(() => s(e, n)) : s(e, n); + } = u, c = K(null); + function _(e) { + var f; + if (!i) return; + const r = (f = e.currentTarget) == null ? void 0 : f.value; + T ? S(() => i(e, r)) : i(e, r); } - function E(e) { - if (e.key === j.Enter) { - i == null || i(e, e.currentTarget.value), I ? e.currentTarget.value = "" : (e.currentTarget.blur(), t == null || t(e, e.currentTarget.value)); + function D(e) { + if (e.key === V.Enter) { + n == null || n(e, e.currentTarget.value), w ? e.currentTarget.value = "" : (e.currentTarget.blur(), t == null || t(e, e.currentTarget.value)); return; } - k(e.key) && (o == null || o(e), e.currentTarget.value = a(c), e.currentTarget.blur()); + j(e.key) && (o == null || o(e), e.currentTarget.value = l(a), e.currentTarget.blur()); } - return d(() => { - const e = l.current; + return m(() => { + const e = c.current; if (!e) return; - const n = a(c); - e.value !== n && (e.value = n), !(!_ && !f) && setTimeout(() => { - e.focus(), f && e.select(); + const r = l(a); + e.value !== r && (e.value = r), !(!d && !s) && setTimeout(() => { + e.focus(), s && e.select(); }, 1); - }, []), d(() => { - const e = l.current; + }, []), m(() => { + const e = c.current; if (!e || document.activeElement === e) return; - const n = a(c); - e.value !== n && (e.value = n); - }), /* @__PURE__ */ K( - S, + const r = l(a); + e.value !== r && (e.value = r); + }), /* @__PURE__ */ E( + R, { - className: B([ - u.input, - y && u.fluid, - h && u.monospace, - b + className: k([ + "Input", + b && "Input--fluid", + y && "Input--monospace", + g ]), ...N, children: [ - /* @__PURE__ */ m("div", { className: u.baseline, children: "." }), - /* @__PURE__ */ m( + /* @__PURE__ */ p("div", { className: "Input__baseline", children: "." }), + /* @__PURE__ */ p( "input", { - className: u.inner, - disabled: g, + className: "Input__input", + disabled: I, maxLength: x, onBlur: (e) => t == null ? void 0 : t(e, e.target.value), - onChange: D, - onKeyDown: E, - placeholder: w, - ref: l + onChange: _, + onKeyDown: D, + placeholder: h, + ref: c } ) ] @@ -90,6 +83,6 @@ function P(r) { ); } export { - P as Input, - a as toInputValue + A as Input, + l as toInputValue }; diff --git a/dist/components/KeyListener.d.ts b/dist/components/KeyListener.d.ts index 70ca240..95b7661 100644 --- a/dist/components/KeyListener.d.ts +++ b/dist/components/KeyListener.d.ts @@ -1,6 +1,5 @@ import { Component } from 'react'; import { KeyEvent } from '../common/events'; - type KeyListenerProps = Partial<{ onKey: (key: KeyEvent) => void; onKeyDown: (key: KeyEvent) => void; diff --git a/dist/components/Knob.d.ts b/dist/components/Knob.d.ts index 9e16cb1..f62ce8d 100644 --- a/dist/components/Knob.d.ts +++ b/dist/components/Knob.d.ts @@ -1,6 +1,5 @@ import { BooleanLike } from '../common/react'; import { BoxProps } from './Box'; - type Props = { /** Value itself, controls the position of the cursor. */ value: number; diff --git a/dist/components/Knob.js b/dist/components/Knob.js index 276e5f3..1c96f01 100644 --- a/dist/components/Knob.js +++ b/dist/components/Knob.js @@ -1,155 +1,129 @@ -import { jsx as _, jsxs as j } from "react/jsx-runtime"; -import { keyOfMatchingRange as E, scale as s } from "../common/math.js"; -import { classes as e } from "../common/react.js"; -import { computeBoxClassName as K, computeBoxProps as I } from "./Box.js"; -import { DraggableControl as O } from "./DraggableControl.js"; -import '../assets/Knob.css';const R = "_knob_69dqe_17", $ = "_circle_69dqe_32", A = "_cursorBox_69dqe_45", G = "_cursor_69dqe_45", H = "_popupValue_69dqe_62", J = "_ring_69dqe_75", L = "_ringTrackPivot_69dqe_84", Q = "_ringTrack_69dqe_84", U = "_ringFillPivot_69dqe_96", W = "_bipolar_69dqe_100", X = "_ringFill_69dqe_96", Y = "_color__black_69dqe_113", Z = "_color__white_69dqe_117", oo = "_color__red_69dqe_121", _o = "_color__orange_69dqe_125", ro = "_color__yellow_69dqe_129", lo = "_color__olive_69dqe_133", eo = "_color__green_69dqe_137", co = "_color__teal_69dqe_141", no = "_color__blue_69dqe_145", ao = "_color__violet_69dqe_149", io = "_color__purple_69dqe_153", so = "_color__pink_69dqe_157", to = "_color__brown_69dqe_161", go = "_color__grey_69dqe_165", po = "_color__good_69dqe_173", uo = "_color__average_69dqe_177", mo = "_color__bad_69dqe_181", qo = "_color__label_69dqe_185", o = { - knob: R, - circle: $, - cursorBox: A, - cursor: G, - popupValue: H, - ring: J, - ringTrackPivot: L, - ringTrack: Q, - ringFillPivot: U, - bipolar: W, - ringFill: X, - color__black: Y, - color__white: Z, - color__red: oo, - color__orange: _o, - color__yellow: ro, - color__olive: lo, - color__green: eo, - color__teal: co, - color__blue: no, - color__violet: ao, - color__purple: io, - color__pink: so, - color__brown: to, - color__grey: go, - "color__light-grey": "_color__light-grey_69dqe_169", - color__good: po, - color__average: uo, - color__bad: mo, - color__label: qo -}; -function xo(t) { +import { jsx as e, jsxs as o } from "react/jsx-runtime"; +import { keyOfMatchingRange as $, scale as t } from "../common/math.js"; +import { classes as j } from "../common/react.js"; +import { computeBoxClassName as E, computeBoxProps as T } from "./Box.js"; +import { DraggableControl as I } from "./DraggableControl.js"; +function H(c) { const { // Draggable props (passthrough) - animated: d, - format: g, - maxValue: r, + animated: m, + format: d, + maxValue: a, minValue: l, - onChange: p, - onDrag: u, - step: m, - stepPixelSize: q, - suppressFlicker: v, - unclamped: b, - unit: k, - value: h, + onChange: u, + onDrag: p, + step: g, + stepPixelSize: _, + suppressFlicker: b, + unclamped: f, + unit: h, + value: v, // Own props - bipolar: c, - className: y, - color: x, - fillValue: n, - ranges: f = {}, - size: w = 1, - style: N, - ...a - } = t; - return /* @__PURE__ */ _( - O, + bipolar: r, + className: x, + color: K, + fillValue: s, + ranges: N = {}, + size: y = 1, + style: V, + ...n + } = c; + return /* @__PURE__ */ e( + I, { dragMatrix: [0, -1], - animated: d, - format: g, - maxValue: r, + animated: m, + format: d, + maxValue: a, minValue: l, - onChange: p, - onDrag: u, - step: m, - stepPixelSize: q, - suppressFlicker: v, - unclamped: b, - unit: k, - value: h, - children: (P) => { + onChange: u, + onDrag: p, + step: g, + stepPixelSize: _, + suppressFlicker: b, + unclamped: f, + unit: h, + value: v, + children: (k) => { const { - displayElement: F, + displayElement: D, displayValue: i, - dragging: V, + dragging: M, handleDragStart: B, - inputElement: T, - value: D - } = P, M = s( - n ?? i, + inputElement: P, + value: C + } = k, F = t( + s ?? i, l, - r - ), C = s(i, l, r), z = x || E(n ?? D, f) || "default", S = Math.min((C - 0.5) * 270, 225); - return /* @__PURE__ */ j( + a + ), w = t(i, l, a), z = K || $(s ?? C, N) || "default", S = Math.min((w - 0.5) * 270, 225); + return /* @__PURE__ */ o( "div", { - className: e([ - o.knob, - o["color__" + z], - c && o.bipolar, - y, - K(a) + className: j([ + "Knob", + `Knob--color--${z}`, + r && "Knob--bipolar", + x, + E(n) ]), - ...I({ + ...T({ style: { - fontSize: w + "em", - ...N + fontSize: `${y}em`, + ...V }, - ...a + ...n }), onMouseDown: B, children: [ - /* @__PURE__ */ _("div", { className: o.circle, children: /* @__PURE__ */ _( + /* @__PURE__ */ e("div", { className: "Knob__circle", children: /* @__PURE__ */ e( "div", { - className: o.cursorBox, + className: "Knob__cursorBox", style: { transform: `rotate(${S}deg)` }, - children: /* @__PURE__ */ _("div", { className: o.cursor }) + children: /* @__PURE__ */ e("div", { className: "Knob__cursor" }) } ) }), - V && /* @__PURE__ */ _("div", { className: o.popupValue, children: F }), - /* @__PURE__ */ _( + M && /* @__PURE__ */ e("div", { className: "Knob__popupValue", children: D }), + /* @__PURE__ */ o( "svg", { - className: e([o.ring, o.ringTrackPivot]), + className: "Knob__ring Knob__ringTrackPivot", viewBox: "0 0 100 100", - children: /* @__PURE__ */ _("circle", { className: "Knob__ringTrack", cx: "50", cy: "50", r: "50" }) + children: [ + /* @__PURE__ */ e("circle", { className: "Knob__ringTrack", cx: "50", cy: "50", r: "50" }), + /* @__PURE__ */ e("title", { children: "track" }) + ] } ), - /* @__PURE__ */ _( + /* @__PURE__ */ o( "svg", { - className: e([o.ring, o.ringFillPivot]), + className: "Knob__ring Knob__ringFillPivot", viewBox: "0 0 100 100", - children: /* @__PURE__ */ _( - "circle", - { - className: o.ringFill, - style: { - strokeDashoffset: Math.max( - ((c ? 2.75 : 2) - M * 1.5) * Math.PI * 50, - 0 - ) - }, - cx: "50", - cy: "50", - r: "50" - } - ) + children: [ + /* @__PURE__ */ e("title", { children: "fill" }), + /* @__PURE__ */ e( + "circle", + { + className: "Knob__ringFill", + style: { + strokeDashoffset: Math.max( + ((r ? 2.75 : 2) - F * 1.5) * Math.PI * 50, + 0 + ) + }, + cx: "50", + cy: "50", + r: "50" + } + ) + ] } ), - T + P ] } ); @@ -158,5 +132,5 @@ function xo(t) { ); } export { - xo as Knob + H as Knob }; diff --git a/dist/components/LabeledControls.d.ts b/dist/components/LabeledControls.d.ts index 2427938..4abec1b 100644 --- a/dist/components/LabeledControls.d.ts +++ b/dist/components/LabeledControls.d.ts @@ -1,5 +1,4 @@ import { FlexProps } from './Flex'; - export declare function LabeledControls(props: FlexProps): import("react/jsx-runtime").JSX.Element; export declare namespace LabeledControls { var Item: typeof LabeledControlsItem; diff --git a/dist/components/LabeledList.d.ts b/dist/components/LabeledList.d.ts index c44b498..eeab7cb 100644 --- a/dist/components/LabeledList.d.ts +++ b/dist/components/LabeledList.d.ts @@ -1,6 +1,5 @@ import { PropsWithChildren, ReactNode } from 'react'; import { BooleanLike } from '../common/react'; - export declare function LabeledList(props: PropsWithChildren): import("react/jsx-runtime").JSX.Element; export declare namespace LabeledList { var Item: typeof LabeledListItem; diff --git a/dist/components/LabeledList.js b/dist/components/LabeledList.js index f82f961..96439ce 100644 --- a/dist/components/LabeledList.js +++ b/dist/components/LabeledList.js @@ -1,82 +1,75 @@ -import { jsx as l, jsxs as b } from "react/jsx-runtime"; -import { classes as i } from "../common/react.js"; -import { Box as r, unit as g } from "./Box.js"; +import { jsx as e, jsxs as d } from "react/jsx-runtime"; +import { classes as c } from "../common/react.js"; +import { Box as s, unit as g } from "./Box.js"; import { Divider as x } from "./Divider.js"; import { Tooltip as N } from "./Tooltip.js"; -import '../assets/LabeledList.css';const v = "_labeledList_pb6nb_9", y = "_row_pb6nb_20", B = "_cell_pb6nb_24", D = "_label__nowrap_pb6nb_36", j = "_buttons_pb6nb_42", o = { - labeledList: v, - row: y, - cell: B, - label__nowrap: D, - buttons: j -}; -function p(e) { - const { children: t } = e; - return /* @__PURE__ */ l("table", { className: "LabeledList", children: /* @__PURE__ */ l("tbody", { children: t }) }); +function b(l) { + const { children: t } = l; + return /* @__PURE__ */ e("table", { className: "LabeledList", children: /* @__PURE__ */ e("tbody", { children: t }) }); } -function z(e) { +function v(l) { const { className: t, - label: s, - labelColor: _ = "label", + label: a, + labelColor: L = "label", labelWrap: m, - color: L, - textAlign: h, - buttons: a, - content: f, - children: u, - verticalAlign: c = "baseline", - tooltip: d - } = e; - let n; - s && (n = s, typeof s == "string" && (n += ":")), d !== void 0 && (n = /* @__PURE__ */ l(N, { content: d, children: /* @__PURE__ */ l( - r, + color: p, + textAlign: _, + buttons: o, + content: h, + children: f, + verticalAlign: r = "baseline", + tooltip: n + } = l; + let i; + a && (i = a, typeof a == "string" && (i += ":")), n !== void 0 && (i = /* @__PURE__ */ e(N, { content: n, children: /* @__PURE__ */ e( + s, { as: "span", style: { borderBottom: "2px dotted rgba(255, 255, 255, 0.8)" }, - children: n + children: i } ) })); - const w = /* @__PURE__ */ l( - r, + const u = /* @__PURE__ */ e( + s, { as: "td", - color: _, - className: i([ - o.cell, + color: L, + className: c([ + "LabeledList__cell", // Kinda flipped because we want nowrap as default. Cleaner CSS this way though. - !m && o.label__nowrap + !m && "LabeledList__label--nowrap" ]), - verticalAlign: c, - children: n + verticalAlign: r, + children: i } ); - return /* @__PURE__ */ b("tr", { className: i([o.row, t]), children: [ - w, - /* @__PURE__ */ b( - r, + return /* @__PURE__ */ d("tr", { className: c(["LabeledList__row", t]), children: [ + u, + /* @__PURE__ */ d( + s, { as: "td", - color: L, - textAlign: h, - className: o.cell, - colSpan: a ? void 0 : 2, - verticalAlign: c, + color: p, + textAlign: _, + className: "LabeledList__cell", + colSpan: o ? void 0 : 2, + verticalAlign: r, children: [ - f, - u + h, + f ] } ), - a && /* @__PURE__ */ l("td", { className: i([o.cell, o.buttons]), children: a }) + o && /* @__PURE__ */ e("td", { className: "LabeledList__cell LabeledList__buttons", children: o }) ] }); } -p.Item = z; -function A(e) { - const t = e.size ? g(Math.max(0, e.size - 1)) : 0; - return /* @__PURE__ */ l("tr", { className: "LabeledList__row", children: /* @__PURE__ */ l( +b.Item = v; +function y(l) { + const t = l.size ? g(Math.max(0, l.size - 1)) : 0; + return /* @__PURE__ */ e("tr", { className: "LabeledList__row", children: /* @__PURE__ */ e( "td", { colSpan: 3, @@ -84,11 +77,11 @@ function A(e) { paddingTop: t, paddingBottom: t }, - children: /* @__PURE__ */ l(x, {}) + children: /* @__PURE__ */ e(x, {}) } ) }); } -p.Divider = A; +b.Divider = y; export { - p as LabeledList + b as LabeledList }; diff --git a/dist/components/MenuBar.d.ts b/dist/components/MenuBar.d.ts index be0d738..868a573 100644 --- a/dist/components/MenuBar.d.ts +++ b/dist/components/MenuBar.d.ts @@ -1,5 +1,4 @@ import { ReactNode } from 'react'; - type MenuBarItemProps = { children: any; className?: string; diff --git a/dist/components/MenuBar.js b/dist/components/MenuBar.js index c566ed7..e048e9a 100644 --- a/dist/components/MenuBar.js +++ b/dist/components/MenuBar.js @@ -1,30 +1,17 @@ -import '../assets/MenuBar.css';var z = Object.defineProperty; -var M = (t, e, n) => e in t ? z(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n; -var h = (t, e, n) => M(t, typeof e != "symbol" ? e + "" : e, n); -import { jsx as r, jsxs as v } from "react/jsx-runtime"; -import { Component as g, createRef as b } from "react"; -import { classes as f } from "../common/react.js"; -import { Box as m } from "./Box.js"; -import { Icon as B } from "./Icon.js"; -const N = "_menuBar_esza9_9", O = "_font_esza9_13", w = "_hover_esza9_19", R = "_button_esza9_24", y = "_menu_esza9_9", I = "_item_esza9_36", T = "_toggle_esza9_44", W = "_toggle__check_esza9_48", j = "_over_esza9_55", D = "_button__text_esza9_60", E = "_separator_esza9_66", o = { - menuBar: N, - font: O, - hover: w, - button: R, - menu: y, - item: I, - toggle: T, - toggle__check: W, - over: j, - button__text: D, - separator: E -}; -class H extends g { +var C = Object.defineProperty; +var x = (r, e, n) => e in r ? C(r, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : r[e] = n; +var h = (r, e, n) => x(r, typeof e != "symbol" ? e + "" : e, n); +import { jsx as o, jsxs as f } from "react/jsx-runtime"; +import { Component as B, createRef as N } from "react"; +import { classes as M } from "../common/react.js"; +import { Box as l } from "./Box.js"; +import { Icon as g } from "./Icon.js"; +class I extends B { constructor(n) { super(n); h(this, "handleClick"); - this.handleClick = (s) => { - this.props.menuRef.current && (this.props.menuRef.current.contains(s.target) || this.props.onOutsideClick()); + this.handleClick = (t) => { + this.props.menuRef.current && (this.props.menuRef.current.contains(t.target) || this.props.onOutsideClick()); }; } componentWillMount() { @@ -34,141 +21,145 @@ class H extends g { window.removeEventListener("click", this.handleClick); } render() { - const { width: n, children: s } = this.props; - return /* @__PURE__ */ r( + const { width: n, children: t } = this.props; + return /* @__PURE__ */ o( "div", { - className: o.menu, + className: "Menubar__menu", style: { width: n }, - children: s + children: t } ); } } -class L extends g { +class O extends B { constructor(n) { super(n); h(this, "menuRef"); - this.menuRef = b(); + this.menuRef = N(); } render() { const { props: n } = this, { - open: s, - openWidth: c, + open: t, + openWidth: s, children: i, - disabled: l, - display: a, - onMouseOver: u, - onClick: p, - onOutsideClick: d, - ...k - } = n, { className: C, ...x } = k; - return /* @__PURE__ */ v("div", { ref: this.menuRef, children: [ - /* @__PURE__ */ r( - m, + disabled: c, + display: u, + onMouseOver: a, + onClick: m, + onOutsideClick: p, + ..._ + } = n, { className: k, ...v } = _; + return /* @__PURE__ */ f("div", { ref: this.menuRef, children: [ + /* @__PURE__ */ o( + l, { - className: f([ - o.button, - o.font, - o.hover, - C + className: M([ + "MenuBar__MenuBarButton", + "MenuBar__font", + "MenuBar__hover", + k ]), - ...x, - onClick: l ? () => null : p, - onMouseOver: u, - children: /* @__PURE__ */ r("span", { className: o.button__text, children: a }) + ...v, + onClick: c ? () => null : m, + onMouseOver: a, + children: /* @__PURE__ */ o("span", { className: "MenuBar__MenuBarButton-text", children: u }) } ), - s && /* @__PURE__ */ r( - H, + t && /* @__PURE__ */ o( + I, { - width: c, + width: s, menuRef: this.menuRef, - onOutsideClick: d, + onOutsideClick: p, children: i } ) ] }); } } -function _(t) { +function d(r) { const { entry: e, children: n, - openWidth: s, - display: c, + openWidth: t, + display: s, setOpenMenuBar: i, - openMenuBar: l, - setOpenOnHover: a, - openOnHover: u, - disabled: p, - className: d - } = t; - return /* @__PURE__ */ r( - L, + openMenuBar: c, + setOpenOnHover: u, + openOnHover: a, + disabled: m, + className: p + } = r; + return /* @__PURE__ */ o( + O, { - openWidth: s, - display: c, - disabled: p, - open: l === e, - className: d, + openWidth: t, + display: s, + disabled: m, + open: c === e, + className: p, onClick: () => { - i(l === e ? null : e), a(!u); + i(c === e ? null : e), u(!a); }, onOutsideClick: () => { - i(null), a(!1); + i(null), u(!1); }, onMouseOver: () => { - u && i(e); + a && i(e); }, children: n } ); } -function S(t) { - const { value: e, displayText: n, onClick: s, checked: c } = t; - return /* @__PURE__ */ v( - m, +function w(r) { + const { value: e, displayText: n, onClick: t, checked: s } = r; + return /* @__PURE__ */ f( + l, { - className: f([ - o.font, - o.item, - o.toggle, - o.hover + className: M([ + "MenuBar__font", + "MenuBar__MenuItem", + "MenuBar__MenuItemToggle", + "MenuBar__hover" ]), - onClick: () => s(e), + onClick: () => t(e), children: [ - /* @__PURE__ */ r("div", { className: o.toggle__check, children: c && /* @__PURE__ */ r(B, { size: 1.3, name: "check" }) }), + /* @__PURE__ */ o("div", { className: "MenuBar__MenuItemToggle__check", children: s && /* @__PURE__ */ o(g, { size: 1.3, name: "check" }) }), n ] } ); } -_.MenuItemToggle = S; -function P(t) { - const { value: e, displayText: n, onClick: s } = t; - return /* @__PURE__ */ r( - m, +d.MenuItemToggle = w; +function R(r) { + const { value: e, displayText: n, onClick: t } = r; + return /* @__PURE__ */ o( + l, { - className: f([o.font, o.item, o.hover]), - onClick: () => s(e), + className: M([ + "MenuBar__font", + "MenuBar__MenuItem", + "MenuBar__hover" + ]), + onClick: () => t(e), children: n } ); } -_.MenuItem = P; -function U() { - return /* @__PURE__ */ r("div", { className: o.separator }); +d.MenuItem = R; +function y() { + return /* @__PURE__ */ o("div", { className: "MenuBar__Separator" }); } -_.Separator = U; -function q(t) { - const { children: e } = t; - return /* @__PURE__ */ r(m, { className: o.menuBar, children: e }); +d.Separator = y; +function T(r) { + const { children: e } = r; + return /* @__PURE__ */ o(l, { className: "MenuBar", children: e }); } -q.Dropdown = _; +T.Dropdown = d; export { - _ as Dropdown, - q as MenuBar + d as Dropdown, + T as MenuBar }; diff --git a/dist/components/Modal.d.ts b/dist/components/Modal.d.ts index 790c0a6..b6583f7 100644 --- a/dist/components/Modal.d.ts +++ b/dist/components/Modal.d.ts @@ -1,3 +1,2 @@ import { BoxProps } from './Box'; - export declare function Modal(props: BoxProps): import("react/jsx-runtime").JSX.Element; diff --git a/dist/components/Modal.js b/dist/components/Modal.js index d74c0be..5bb9c02 100644 --- a/dist/components/Modal.js +++ b/dist/components/Modal.js @@ -1,25 +1,18 @@ -import { jsx as m } from "react/jsx-runtime"; -import { classes as e } from "../common/react.js"; -import { computeBoxClassName as a, computeBoxProps as l } from "./Box.js"; -import { Dimmer as c } from "./Dimmer.js"; -import '../assets/Modal.css';const i = "_modal_1e7qt_9", d = { - modal: i -}; -function x(s) { - const { className: r, children: t, ...o } = s; - return /* @__PURE__ */ m(c, { children: /* @__PURE__ */ m( +import { jsx as r } from "react/jsx-runtime"; +import { classes as t } from "../common/react.js"; +import { computeBoxClassName as a, computeBoxProps as c } from "./Box.js"; +import { Dimmer as i } from "./Dimmer.js"; +function f(m) { + const { className: s, children: e, ...o } = m; + return /* @__PURE__ */ r(i, { children: /* @__PURE__ */ r( "div", { - className: e([ - d.modal, - r, - a(o) - ]), - ...l(o), - children: t + className: t(["Modal", s, a(o)]), + ...c(o), + children: e } ) }); } export { - x as Modal + f as Modal }; diff --git a/dist/components/NoticeBox.d.ts b/dist/components/NoticeBox.d.ts index bd43cc9..8d4ad03 100644 --- a/dist/components/NoticeBox.d.ts +++ b/dist/components/NoticeBox.d.ts @@ -1,5 +1,4 @@ import { BoxProps } from './Box'; - type Props = ExclusiveProps & BoxProps; /** You MUST use only one or none */ type NoticeType = 'info' | 'success' | 'warning' | 'danger'; diff --git a/dist/components/NoticeBox.js b/dist/components/NoticeBox.js index dd50961..02c93b9 100644 --- a/dist/components/NoticeBox.js +++ b/dist/components/NoticeBox.js @@ -1,50 +1,23 @@ -import { jsx as a } from "react/jsx-runtime"; -import { classes as i } from "../common/react.js"; -import { Box as y } from "./Box.js"; -import '../assets/NoticeBox.css';const m = "_noticeBox_56yom_17", g = "_color__black_56yom_28", b = "_color__white_56yom_33", d = "_color__red_56yom_38", w = "_color__orange_56yom_43", p = "_color__yellow_56yom_48", u = "_color__olive_56yom_53", f = "_color__green_56yom_58", v = "_color__teal_56yom_63", x = "_color__blue_56yom_68", k = "_color__violet_56yom_73", B = "_color__purple_56yom_78", h = "_color__pink_56yom_83", N = "_color__brown_56yom_88", j = "_color__grey_56yom_93", q = "_color__good_56yom_103", z = "_color__average_56yom_108", A = "_color__bad_56yom_113", C = "_color__label_56yom_118", D = "_info_56yom_123", E = "_success_56yom_128", F = "_warning_56yom_133", G = "_danger_56yom_138", o = { - noticeBox: m, - color__black: g, - color__white: b, - color__red: d, - color__orange: w, - color__yellow: p, - color__olive: u, - color__green: f, - color__teal: v, - color__blue: x, - color__violet: k, - color__purple: B, - color__pink: h, - color__brown: N, - color__grey: j, - "color__light-grey": "_color__light-grey_56yom_98", - color__good: q, - color__average: z, - color__bad: A, - color__label: C, - info: D, - success: E, - warning: F, - danger: G -}; -function K(c) { - const { className: r, color: _, info: l, success: e, warning: n, danger: s, ...t } = c; - return /* @__PURE__ */ a( - y, +import { jsx as n } from "react/jsx-runtime"; +import { classes as x } from "../common/react.js"; +import { Box as a } from "./Box.js"; +function f(e) { + const { className: c, color: o, info: t, success: s, warning: m, danger: r, ...i } = e; + return /* @__PURE__ */ n( + a, { - className: i([ - o.noticeBox, - _ && o["color__" + _], - l && o.info, - e && o.success, - n && o.warning, - s && o.danger, - r + className: x([ + "NoticeBox", + o && `NoticeBox--color--${o}`, + t && "NoticeBox--type--info", + s && "NoticeBox--type--success", + r && "NoticeBox--type--danger", + c ]), - ...t + ...i } ); } export { - K as NoticeBox + f as NoticeBox }; diff --git a/dist/components/NumberInput.d.ts b/dist/components/NumberInput.d.ts index 807e739..3f25709 100644 --- a/dist/components/NumberInput.d.ts +++ b/dist/components/NumberInput.d.ts @@ -1,6 +1,5 @@ import { Component, FocusEventHandler, KeyboardEventHandler, MouseEventHandler, RefObject } from 'react'; import { BooleanLike } from '../common/react'; - type Props = Required<{ maxValue: number; minValue: number; @@ -33,7 +32,6 @@ export declare class NumberInput extends Component { dragTimeout: NodeJS.Timeout; dragInterval: NodeJS.Timeout; state: State; - constructor(props: Props); componentDidMount(): void; handleDragStart: MouseEventHandler; handleDragMove: (event: MouseEvent) => void; diff --git a/dist/components/NumberInput.js b/dist/components/NumberInput.js index 1f5d8fb..2e5221c 100644 --- a/dist/components/NumberInput.js +++ b/dist/components/NumberInput.js @@ -1,44 +1,36 @@ -import '../assets/NumberInput.css';var N = Object.defineProperty; -var w = (c, d, e) => d in c ? N(c, d, { enumerable: !0, configurable: !0, writable: !0, value: e }) : c[d] = e; -var l = (c, d, e) => w(c, typeof d != "symbol" ? d + "" : d, e); -import { jsxs as _, jsx as V } from "react/jsx-runtime"; -import { Component as E, createRef as I } from "react"; -import { KEY as D, isEscape as M } from "../common/keys.js"; -import { clamp as g, round as T } from "../common/math.js"; -import { classes as F } from "../common/react.js"; -import { AnimatedNumber as R } from "./AnimatedNumber.js"; -import { Box as Y } from "./Box.js"; -const B = "_numberInput_4xyrw_20", K = "_fluid_4xyrw_36", L = "_content_4xyrw_40", z = "_barContainer_4xyrw_44", j = "_bar_4xyrw_44", k = "_inner_4xyrw_61", p = { - numberInput: B, - fluid: K, - content: L, - barContainer: z, - bar: j, - inner: k -}; -class J extends E { - constructor(e) { - super(e); +var I = Object.defineProperty; +var E = (m, d, e) => d in m ? I(m, d, { enumerable: !0, configurable: !0, writable: !0, value: e }) : m[d] = e; +var o = (m, d, e) => E(m, typeof d != "symbol" ? d + "" : d, e); +import { jsxs as N, jsx as f } from "react/jsx-runtime"; +import { Component as x, createRef as D } from "react"; +import { KEY as _, isEscape as M } from "../common/keys.js"; +import { clamp as h, round as T } from "../common/math.js"; +import { classes as w } from "../common/react.js"; +import { AnimatedNumber as F } from "./AnimatedNumber.js"; +import { Box as R } from "./Box.js"; +class H extends x { + constructor() { + super(...arguments); // Ref to the input field to set focus & highlight - l(this, "inputRef", I()); + o(this, "inputRef", D()); // After this time has elapsed we are in drag mode so no editing when dragging ends - l(this, "dragTimeout"); + o(this, "dragTimeout"); // Call onDrag at this interval - l(this, "dragInterval"); + o(this, "dragInterval"); // default values for the number input state - l(this, "state", { + o(this, "state", { editing: !1, dragging: !1, currentValue: 0, previousValue: 0, origin: 0 }); - l(this, "handleDragStart", (e) => { - const { value: o, disabled: a } = this.props, { editing: s } = this.state; - if (a || s) + o(this, "handleDragStart", (e) => { + const { value: u, disabled: n } = this.props, { editing: s } = this.state; + if (n || s) return; document.body.style["pointer-events"] = "none"; - const r = parseFloat(o.toString()); + const r = Number.parseFloat(u.toString()); this.setState({ dragging: !1, origin: e.screenY, @@ -49,59 +41,59 @@ class J extends E { dragging: !0 }); }, 250), this.dragInterval = setInterval(() => { - const { dragging: u, currentValue: i, previousValue: t } = this.state, { onDrag: n } = this.props; - u && i !== t && (this.setState({ + const { dragging: l, currentValue: i, previousValue: t } = this.state, { onDrag: a } = this.props; + l && i !== t && (this.setState({ previousValue: i - }), n == null || n(i)); + }), a == null || a(i)); }, 400), document.addEventListener("mousemove", this.handleDragMove), document.addEventListener("mouseup", this.handleDragEnd); }); - l(this, "handleDragMove", (e) => { - const { minValue: o, maxValue: a, step: s, stepPixelSize: r, disabled: u } = this.props; - u || this.setState((i) => { - const t = { ...i }, n = t.origin - e.screenY; + o(this, "handleDragMove", (e) => { + const { minValue: u, maxValue: n, step: s, stepPixelSize: r, disabled: l } = this.props; + l || this.setState((i) => { + const t = { ...i }, a = t.origin - e.screenY; if (i.dragging) { - const f = r || 1, m = g( - t.currentValue + n * s / f, - o - s, - a + s + const g = r || 1, c = h( + t.currentValue + a * s / g, + u - s, + n + s ); - Math.abs(m - t.currentValue) >= s ? (t.currentValue = g( - T(m / s, 0) * s, - o, - a - ), t.origin = e.screenY) : Math.abs(n) > f && (t.origin = e.screenY); - } else Math.abs(n) > 4 && (t.dragging = !0); + Math.abs(c - t.currentValue) >= s ? (t.currentValue = h( + T(c / s, 0) * s, + u, + n + ), t.origin = e.screenY) : Math.abs(a) > g && (t.origin = e.screenY); + } else Math.abs(a) > 4 && (t.dragging = !0); return t; }); }); - l(this, "handleDragEnd", (e) => { - const { dragging: o, currentValue: a } = this.state, { onDrag: s, onChange: r, disabled: u } = this.props; - if (!u) { + o(this, "handleDragEnd", (e) => { + const { dragging: u, currentValue: n } = this.state, { onDrag: s, onChange: r, disabled: l } = this.props; + if (!l) { if (document.body.style["pointer-events"] = "auto", clearInterval(this.dragInterval), clearTimeout(this.dragTimeout), this.setState({ dragging: !1, - editing: !o, - previousValue: a - }), o) - r == null || r(a), s == null || s(a); + editing: !u, + previousValue: n + }), u) + r == null || r(n), s == null || s(n); else if (this.inputRef) { const i = this.inputRef.current; - i && (i.value = `${a}`, setTimeout(() => { + i && (i.value = `${n}`, setTimeout(() => { i.focus(), i.select(); }, 10)); } document.removeEventListener("mousemove", this.handleDragMove), document.removeEventListener("mouseup", this.handleDragEnd); } }); - l(this, "handleBlur", (e) => { - const { editing: o, previousValue: a } = this.state, { minValue: s, maxValue: r, onChange: u, onDrag: i, disabled: t } = this.props; - if (t || !o) + o(this, "handleBlur", (e) => { + const { editing: u, previousValue: n } = this.state, { minValue: s, maxValue: r, onChange: l, onDrag: i, disabled: t } = this.props; + if (t || !u) return; - const n = g( - parseFloat(e.target.value), + const a = h( + Number.parseFloat(e.target.value), s, r ); - if (isNaN(n)) { + if (Number.isNaN(a)) { this.setState({ editing: !1 }); @@ -109,22 +101,22 @@ class J extends E { } this.setState({ editing: !1, - currentValue: n, - previousValue: n - }), a !== n && (u == null || u(n), i == null || i(n)); + currentValue: a, + previousValue: a + }), n !== a && (l == null || l(a), i == null || i(a)); }); - l(this, "handleKeyDown", (e) => { - const { minValue: o, maxValue: a, onChange: s, onDrag: r, disabled: u } = this.props; - if (u) + o(this, "handleKeyDown", (e) => { + const { minValue: u, maxValue: n, onChange: s, onDrag: r, disabled: l } = this.props; + if (l) return; const { previousValue: i } = this.state; - if (e.key === D.Enter) { - const t = g( - parseFloat(e.currentTarget.value), - o, - a + if (e.key === _.Enter) { + const t = h( + Number.parseFloat(e.currentTarget.value), + u, + n ); - if (isNaN(t)) { + if (Number.isNaN(t)) { this.setState({ editing: !1 }); @@ -141,71 +133,71 @@ class J extends E { }); } componentDidMount() { - const e = parseFloat(this.props.value.toString()); + const e = Number.parseFloat(this.props.value.toString()); this.setState({ currentValue: e, previousValue: e }); } render() { - const { dragging: e, editing: o, currentValue: a } = this.state, { + const { dragging: e, editing: u, currentValue: n } = this.state, { className: s, fluid: r, - animated: u, + animated: l, unit: i, value: t, - minValue: n, - maxValue: f, - height: m, + minValue: a, + maxValue: g, + height: c, width: S, - lineHeight: b, - fontSize: y, - format: v + lineHeight: v, + fontSize: b, + format: V } = this.props; - let h = parseFloat(t.toString()); - e && (h = a); - const x = /* @__PURE__ */ _("div", { className: p.content, children: [ - u && !e ? /* @__PURE__ */ V(R, { value: h, format: v }) : v ? v(h) : h, - i ? " " + i : "" + let p = Number.parseFloat(t.toString()); + e && (p = n); + const y = /* @__PURE__ */ N("div", { className: "NumberInput__content", children: [ + l && !e ? /* @__PURE__ */ f(F, { value: p, format: V }) : V ? V(p) : p, + i ? ` ${i}` : "" ] }); - return /* @__PURE__ */ _( - Y, + return /* @__PURE__ */ N( + R, { - className: F([ - p.numberInput, - r && p.fluid, + className: w([ + "NumberInput", + r && "NumberInput--fluid", s ]), minWidth: S, - minHeight: m, - lineHeight: b, - fontSize: y, + minHeight: c, + lineHeight: v, + fontSize: b, onMouseDown: this.handleDragStart, children: [ - /* @__PURE__ */ V("div", { className: p.barContainer, children: /* @__PURE__ */ V( + /* @__PURE__ */ f("div", { className: "NumberInput__barContainer", children: /* @__PURE__ */ f( "div", { - className: p.bar, + className: "NumberInput__bar", style: { - height: g( - (h - n) / (f - n) * 100, + height: `${h( + (p - a) / (g - a) * 100, 0, 100 - ) + "%" + )}%` } } ) }), - x, - /* @__PURE__ */ V( + y, + /* @__PURE__ */ f( "input", { ref: this.inputRef, - className: p.inner, + className: "NumberInput__input", style: { - display: o ? "inline" : "none", - height: m, - lineHeight: b, - fontSize: y + display: u ? "inline" : "none", + height: c, + lineHeight: v, + fontSize: b }, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown @@ -217,5 +209,5 @@ class J extends E { } } export { - J as NumberInput + H as NumberInput }; diff --git a/dist/components/Popper.d.ts b/dist/components/Popper.d.ts index bc6ffa4..48f2412 100644 --- a/dist/components/Popper.d.ts +++ b/dist/components/Popper.d.ts @@ -1,6 +1,5 @@ import { Placement } from '@popperjs/core'; import { PropsWithChildren, ReactNode } from 'react'; - type RequiredProps = { /** The content to display in the popper */ content: ReactNode; diff --git a/dist/components/ProgressBar.d.ts b/dist/components/ProgressBar.d.ts index d78563d..c7c0252 100644 --- a/dist/components/ProgressBar.d.ts +++ b/dist/components/ProgressBar.d.ts @@ -1,6 +1,5 @@ import { PropsWithChildren } from 'react'; import { BoxProps } from './Box'; - type Props = { /** * Current progress as a floating point number between `minValue` (default: 0) and `maxValue` (default: 1). diff --git a/dist/components/ProgressBar.js b/dist/components/ProgressBar.js index da73f38..a2d0645 100644 --- a/dist/components/ProgressBar.js +++ b/dist/components/ProgressBar.js @@ -1,37 +1,32 @@ -import { jsxs as x, jsx as n } from "react/jsx-runtime"; -import { CSS_COLORS as v } from "../common/constants.js"; -import { keyOfMatchingRange as y, toFixed as N, scale as S, clamp01 as _ } from "../common/math.js"; -import { classes as m } from "../common/react.js"; -import { p as e } from "../ProgressBar.module-Jzqlebbx.js"; -import { computeBoxProps as B, computeBoxClassName as O } from "./Box.js"; -function w(d) { +import { jsxs as B, jsx as i } from "react/jsx-runtime"; +import { CSS_COLORS as C } from "../common/constants.js"; +import { keyOfMatchingRange as P, toFixed as h, scale as x, clamp01 as _ } from "../common/math.js"; +import { classes as v } from "../common/react.js"; +import { computeBoxProps as y, computeBoxClassName as N } from "./Box.js"; +function j(n) { const { - className: f, - value: r, - minValue: p = 0, - maxValue: u = 1, - color: C, - ranges: g = {}, - children: l, - ...t - } = d, a = S(r, p, u), h = l !== void 0, o = C || y(r, g) || "default", s = B(t), c = [ - e.progressBar, - f, - O(t) - ], i = { - width: _(a) * 100 + "%" + className: m, + value: o, + minValue: d = 0, + maxValue: f = 1, + color: u, + ranges: p = {}, + children: r, + ...l + } = n, a = x(o, d, f), g = r !== void 0, s = u || P(o, p) || "default", e = y(l), t = ["ProgressBar", m, N(l)], c = { + width: `${_(a) * 100}%` }; - return v.includes(o) || o === "default" ? c.push(e["color__" + o]) : (s.style = { ...s.style, borderColor: o }, i.backgroundColor = o), /* @__PURE__ */ x("div", { className: m(c), ...s, children: [ - /* @__PURE__ */ n( + return C.includes(s) || s === "default" ? t.push(`ProgressBar--color--${s}`) : (e.style = { ...e.style, borderColor: s }, c.backgroundColor = s), /* @__PURE__ */ B("div", { className: v(t), ...e, children: [ + /* @__PURE__ */ i( "div", { - className: m([e.fill, e.fill__animated]), - style: i + className: "ProgressBar__fill ProgressBar__fill--animated", + style: c } ), - /* @__PURE__ */ n("div", { className: e.content, children: h ? l : N(a * 100) + "%" }) + /* @__PURE__ */ i("div", { className: "ProgressBar__content", children: g ? r : `${h(a * 100)}%` }) ] }); } export { - w as ProgressBar + j as ProgressBar }; diff --git a/dist/components/RestrictedInput.js b/dist/components/RestrictedInput.js index dcc9817..fda00e4 100644 --- a/dist/components/RestrictedInput.js +++ b/dist/components/RestrictedInput.js @@ -1,89 +1,95 @@ import { jsxs as E, jsx as h } from "react/jsx-runtime"; -import { KEY_ENTER as I, KEY_ESCAPE as S } from "../common/keycodes.js"; -import { clamp as m } from "../common/math.js"; +import { Component as N, createRef as S } from "react"; +import { KEY_ENTER as I, KEY_ESCAPE as b } from "../common/keycodes.js"; +import { clamp as d } from "../common/math.js"; import { classes as v } from "../common/react.js"; -import { Component as F, createRef as N } from "react"; -import { Box as C } from "./Box.js"; +import { Box as F } from "./Box.js"; const g = 0, x = 1e4; -function M(e, n, t, s) { - const i = n || g, o = t || t === 0 ? t : x; - let r = s ? e.replace(/[^\-\d.]/g, "") : e.replace(/[^\-\d]/g, ""); - return s && (r = b(r, i), r = d(".", r)), n < 0 ? (r = _(r), r = d("-", r)) : r = r.replaceAll("-", ""), i <= 1 && o >= 0 ? V(r, i, o, s) : r; +function C(s, e, t, n) { + const i = e || g, o = t || t === 0 ? t : x; + let r = n ? s.replace(/[^\-\d.]/g, "") : s.replace(/[^\-\d]/g, ""); + return n && (r = V(r, i), r = m(".", r)), e < 0 ? (r = _(r), r = m("-", r)) : r = r.replaceAll("-", ""), i <= 1 && o >= 0 ? M(r, i, o, n) : r; } -const V = (e, n, t, s) => { - let i = s ? parseFloat(e) : parseInt(e, 10); - if (!isNaN(i) && (e.slice(-1) !== "." || i < Math.floor(n))) { - let o = m(i, n, t); +const M = (s, e, t, n) => { + const i = n ? Number.parseFloat(s) : Number.parseInt(s, 10); + if (!Number.isNaN(i) && (s.slice(-1) !== "." || i < Math.floor(e))) { + const o = d(i, e, t); if (i !== o) return String(o); } - return e; + return s; }; -function _(e) { - let n = e, t = e.indexOf("-"); - return t > 0 ? (e = e.replace("-", ""), n = "-".concat(e)) : t === 0 && e.indexOf("-", t + 1) > 0 && (n = e.replaceAll("-", "")), n; +function _(s) { + let e = s; + const t = s.indexOf("-"); + if (t > 0) { + const n = s.replace("-", ""); + e = "-".concat(n); + } else t === 0 && s.indexOf("-", t + 1) > 0 && (e = s.replaceAll("-", "")); + return e; } -function b(e, n) { - let t = e, s = Math.sign(n) * Math.floor(Math.abs(n)); - return e.indexOf(".") === 0 ? t = String(s).concat(e) : e.indexOf("-") === 0 && e.indexOf(".") === 1 && (t = s + ".".concat(e.slice(2))), t; +function V(s, e) { + let t = s; + const n = Math.sign(e) * Math.floor(Math.abs(e)); + return s.indexOf(".") === 0 ? t = String(n).concat(s) : s.indexOf("-") === 0 && s.indexOf(".") === 1 && (t = n + ".".concat(s.slice(2))), t; } -function d(e, n) { - const t = n.indexOf(e), s = n.length; - let i = n; - if (t !== -1 && t < s - 1) { - let o = n.slice(t + 1, s); - o = o.replaceAll(e, ""), i = n.slice(0, t + 1).concat(o); +function m(s, e) { + const t = e.indexOf(s), n = e.length; + let i = e; + if (t !== -1 && t < n - 1) { + let o = e.slice(t + 1, n); + o = o.replaceAll(s, ""), i = e.slice(0, t + 1).concat(o); } return i; } -function f(e, n, t, s) { - const i = n || g, o = t || t === 0 ? t : x; - if (!e || !e.length) +function f(s, e, t, n) { + const i = e || g, o = t || t === 0 ? t : x; + if (!s || !s.length) return String(i); - let r = s ? parseFloat(e.replace(/[^\-\d.]/g, "")) : parseInt(e.replace(/[^\-\d]/g, ""), 10); - return isNaN(r) ? String(i) : String(m(r, i, o)); + const r = n ? Number.parseFloat(s.replace(/[^\-\d.]/g, "")) : Number.parseInt(s.replace(/[^\-\d]/g, ""), 10); + return Number.isNaN(r) ? String(i) : String(d(r, i, o)); } -class B extends F { - constructor(n) { - super(n), this.inputRef = N(), this.state = { +class B extends N { + constructor(e) { + super(e), this.inputRef = S(), this.state = { editing: !1 }, this.handleBlur = (t) => { - const { maxValue: s, minValue: i, onBlur: o, allowFloats: r } = this.props, { editing: l } = this.state; + const { maxValue: n, minValue: i, onBlur: o, allowFloats: r } = this.props, { editing: l } = this.state; l && this.setEditing(!1); const a = f( t.target.value, i, - s, + n, r ); o && o(t, +a); }, this.handleChange = (t) => { - const { maxValue: s, minValue: i, onChange: o, allowFloats: r } = this.props; - t.target.value = M( + const { maxValue: n, minValue: i, onChange: o, allowFloats: r } = this.props; + t.target.value = C( t.target.value, i, - s, + n, r ), o && o(t, +t.target.value); }, this.handleFocus = (t) => { - const { editing: s } = this.state; - s || this.setEditing(!0); + const { editing: n } = this.state; + n || this.setEditing(!0); }, this.handleInput = (t) => { - const { editing: s } = this.state, { onInput: i } = this.props; - s || this.setEditing(!0), i && i(t, +t.target.value); + const { editing: n } = this.state, { onInput: i } = this.props; + n || this.setEditing(!0), i && i(t, +t.target.value); }, this.handleKeyDown = (t) => { - const { maxValue: s, minValue: i, onChange: o, onEnter: r, allowFloats: l } = this.props; + const { maxValue: n, minValue: i, onChange: o, onEnter: r, allowFloats: l } = this.props; if (t.keyCode === I) { const a = f( t.target.value, i, - s, + n, l ); this.setEditing(!1), o && o(t, +a), r && r(t, +a), t.target.blur(); return; } - if (t.keyCode === S) { + if (t.keyCode === b) { if (this.props.onEscape) { this.props.onEscape(t); return; @@ -95,41 +101,41 @@ class B extends F { } componentDidMount() { var r; - const { maxValue: n, minValue: t, allowFloats: s } = this.props, i = (r = this.props.value) == null ? void 0 : r.toString(), o = this.inputRef.current; + const { maxValue: e, minValue: t, allowFloats: n } = this.props, i = (r = this.props.value) == null ? void 0 : r.toString(), o = this.inputRef.current; o && (o.value = f( i, t, - n, - s + e, + n )), (this.props.autoFocus || this.props.autoSelect) && setTimeout(() => { o.focus(), this.props.autoSelect && o.select(); }, 1); } - componentDidUpdate(n, t) { - var p, c; - const { maxValue: s, minValue: i, allowFloats: o } = this.props, { editing: r } = this.state, l = (p = n.value) == null ? void 0 : p.toString(), a = (c = this.props.value) == null ? void 0 : c.toString(), u = this.inputRef.current; + componentDidUpdate(e, t) { + var c, p; + const { maxValue: n, minValue: i, allowFloats: o } = this.props, { editing: r } = this.state, l = (c = e.value) == null ? void 0 : c.toString(), a = (p = this.props.value) == null ? void 0 : p.toString(), u = this.inputRef.current; u && !r && a !== l && a !== u.value && (u.value = f( a, i, - s, + n, o )); } - setEditing(n) { - this.setState({ editing: n }); + setEditing(e) { + this.setState({ editing: e }); } render() { - const { props: n } = this, { onChange: t, onEnter: s, onInput: i, onBlur: o, value: r, ...l } = n, { className: a, fluid: u, monospace: p, ...c } = l; + const { props: e } = this, { onChange: t, onEnter: n, onInput: i, onBlur: o, value: r, ...l } = e, { className: a, fluid: u, monospace: c, ...p } = l; return /* @__PURE__ */ E( - C, + F, { className: v([ "Input", u && "Input--fluid", - p && "Input--monospace", + c && "Input--monospace", a ]), - ...c, + ...p, children: [ /* @__PURE__ */ h("div", { className: "Input__baseline", children: "." }), /* @__PURE__ */ h( diff --git a/dist/components/RoundGauge.d.ts b/dist/components/RoundGauge.d.ts index 3f03487..4353423 100644 --- a/dist/components/RoundGauge.d.ts +++ b/dist/components/RoundGauge.d.ts @@ -1,5 +1,4 @@ import { BoxProps } from './Box'; - type Props = { /** The current value of the metric. */ value: number; diff --git a/dist/components/RoundGauge.js b/dist/components/RoundGauge.js index ba8c016..d9edf8b 100644 --- a/dist/components/RoundGauge.js +++ b/dist/components/RoundGauge.js @@ -1,116 +1,67 @@ -import { jsxs as k, jsx as _ } from "react/jsx-runtime"; -import { scale as d, keyOfMatchingRange as M, clamp01 as N } from "../common/math.js"; -import { classes as u } from "../common/react.js"; -import { AnimatedNumber as A } from "./AnimatedNumber.js"; -import { Box as B, computeBoxClassName as G, computeBoxProps as j } from "./Box.js"; -import '../assets/RoundGauge.css';const F = "_roundGauge_gktag_17", L = "_ringTrack_gktag_25", T = "_ringFill_gktag_33", V = "_needle_gktag_41", O = "_needleLine_gktag_46", R = "_needleMiddle_gktag_47", Z = "_alert_gktag_51", z = "_max_gktag_59", P = "_color__black_gktag_63", S = "_color__white_gktag_67", $ = "_color__red_gktag_71", D = "_color__orange_gktag_75", E = "_color__yellow_gktag_79", I = "_color__olive_gktag_83", q = "_color__green_gktag_87", H = "_color__teal_gktag_91", J = "_color__blue_gktag_95", K = "_color__violet_gktag_99", Q = "_color__purple_gktag_103", U = "_color__pink_gktag_107", W = "_color__brown_gktag_111", X = "_color__grey_gktag_115", Y = "_color__good_gktag_123", __ = "_color__average_gktag_127", e_ = "_color__bad_gktag_131", l_ = "_color__label_gktag_135", o_ = "_alert__black_gktag_139", r_ = "_alertAnim_gktag_1", t_ = "_alert__white_gktag_145", a_ = "_alert__red_gktag_151", c_ = "_alert__orange_gktag_157", g_ = "_alert__yellow_gktag_163", n_ = "_alert__olive_gktag_169", s_ = "_alert__green_gktag_175", i_ = "_alert__teal_gktag_181", k_ = "_alert__blue_gktag_187", d_ = "_alert__violet_gktag_193", u_ = "_alert__purple_gktag_199", m_ = "_alert__pink_gktag_205", p_ = "_alert__brown_gktag_211", b_ = "_alert__grey_gktag_217", y_ = "_alert__good_gktag_229", h_ = "_alert__average_gktag_235", f_ = "_alert__bad_gktag_241", v_ = "_alert__label_gktag_247", e = { - roundGauge: F, - ringTrack: L, - ringFill: T, - needle: V, - needleLine: O, - needleMiddle: R, - alert: Z, - max: z, - color__black: P, - color__white: S, - color__red: $, - color__orange: D, - color__yellow: E, - color__olive: I, - color__green: q, - color__teal: H, - color__blue: J, - color__violet: K, - color__purple: Q, - color__pink: U, - color__brown: W, - color__grey: X, - "color__light-grey": "_color__light-grey_gktag_119", - color__good: Y, - color__average: __, - color__bad: e_, - color__label: l_, - alert__black: o_, - alertAnim: r_, - alert__white: t_, - alert__red: a_, - alert__orange: c_, - alert__yellow: g_, - alert__olive: n_, - alert__green: s_, - alert__teal: i_, - alert__blue: k_, - alert__violet: d_, - alert__purple: u_, - alert__pink: m_, - alert__brown: p_, - alert__grey: b_, - "alert__light-grey": "_alert__light-grey_gktag_223", - alert__good: y_, - alert__average: h_, - alert__bad: f_, - alert__label: v_ -}; -function A_(y) { +import { jsxs as m, jsx as e } from "react/jsx-runtime"; +import { scale as d, keyOfMatchingRange as M, clamp01 as k } from "../common/math.js"; +import { classes as h } from "../common/react.js"; +import { AnimatedNumber as v } from "./AnimatedNumber.js"; +import { Box as B, computeBoxClassName as $, computeBoxProps as j } from "./Box.js"; +function w(p) { const { - alertAfter: o, - alertBefore: r, - className: h, - format: f, - maxValue: n = 1, - minValue: s = 1, - ranges: a, - size: v = 1, - style: w, - value: l, - ...m - } = y, C = d(l, s, n), p = N(C), c = a ? {} : { primary: [0, 1] }; - a && Object.keys(a).forEach((t) => { - const g = a[t]; - c[t] = [ - d(g[0], s, n), - d(g[1], s, n) + alertAfter: a, + alertBefore: t, + className: _, + format: R, + maxValue: c = 1, + minValue: u = 1, + ranges: n, + size: y = 1, + style: x, + value: r, + ...g + } = p, G = d(r, u, c), f = k(G), l = n ? {} : { primary: [0, 1] }; + n && Object.keys(n).forEach((o) => { + const s = n[o]; + l[o] = [ + d(s[0], u, c), + d(s[1], u, c) ]; }); - function x() { - return o && r && l > o && l < r || o && l > o ? !0 : !!(r && l < r); + function N() { + return !!(a && t && r > a && r < t || a && r > a || t && r < t); } - const b = x() && M(p, c); - return /* @__PURE__ */ k(B, { inline: !0, children: [ - /* @__PURE__ */ _( + const C = N() && M(f, l); + return /* @__PURE__ */ m(B, { inline: !0, children: [ + /* @__PURE__ */ e( "div", { - className: u([ - e.roundGauge, - h, - G(m) + className: h([ + "RoundGauge", + _, + $(g) ]), ...j({ style: { - fontSize: v + "em", - ...w + fontSize: `${y}em`, + ...x }, - ...m + ...g }), - children: /* @__PURE__ */ k("svg", { viewBox: "0 0 100 50", children: [ - (o || r) && /* @__PURE__ */ _( + children: /* @__PURE__ */ m("svg", { viewBox: "0 0 100 50", children: [ + (a || t) && /* @__PURE__ */ e( "g", { - className: u([ - e.alert, - b ? e["alert__" + b] : "" + className: h([ + "RoundGauge__alert", + C ? `active RoundGauge__alert--${C}` : "" ]), - children: /* @__PURE__ */ _("path", { d: "M48.211,14.578C48.55,13.9 49.242,13.472 50,13.472C50.758,13.472 51.45,13.9 51.789,14.578C54.793,20.587 60.795,32.589 63.553,38.106C63.863,38.726 63.83,39.462 63.465,40.051C63.101,40.641 62.457,41 61.764,41C55.996,41 44.004,41 38.236,41C37.543,41 36.899,40.641 36.535,40.051C36.17,39.462 36.137,38.726 36.447,38.106C39.205,32.589 45.207,20.587 48.211,14.578ZM50,34.417C51.426,34.417 52.583,35.574 52.583,37C52.583,38.426 51.426,39.583 50,39.583C48.574,39.583 47.417,38.426 47.417,37C47.417,35.574 48.574,34.417 50,34.417ZM50,32.75C50,32.75 53,31.805 53,22.25C53,20.594 51.656,19.25 50,19.25C48.344,19.25 47,20.594 47,22.25C47,31.805 50,32.75 50,32.75Z" }) + children: /* @__PURE__ */ e("path", { d: "M48.211,14.578C48.55,13.9 49.242,13.472 50,13.472C50.758,13.472 51.45,13.9 51.789,14.578C54.793,20.587 60.795,32.589 63.553,38.106C63.863,38.726 63.83,39.462 63.465,40.051C63.101,40.641 62.457,41 61.764,41C55.996,41 44.004,41 38.236,41C37.543,41 36.899,40.641 36.535,40.051C36.17,39.462 36.137,38.726 36.447,38.106C39.205,32.589 45.207,20.587 48.211,14.578ZM50,34.417C51.426,34.417 52.583,35.574 52.583,37C52.583,38.426 51.426,39.583 50,39.583C48.574,39.583 47.417,38.426 47.417,37C47.417,35.574 48.574,34.417 50,34.417ZM50,32.75C50,32.75 53,31.805 53,22.25C53,20.594 51.656,19.25 50,19.25C48.344,19.25 47,20.594 47,22.25C47,31.805 50,32.75 50,32.75Z" }) } ), - /* @__PURE__ */ _("g", { children: /* @__PURE__ */ _("circle", { className: e.ringTrack, cx: "50", cy: "50", r: "45" }) }), - /* @__PURE__ */ _("g", { children: Object.keys(c).map((t, g) => { - const i = c[t]; - return /* @__PURE__ */ _( + /* @__PURE__ */ e("g", { children: /* @__PURE__ */ e("circle", { className: "RoundGauge__ringTrack", cx: "50", cy: "50", r: "45" }) }), + /* @__PURE__ */ e("g", { children: Object.keys(l).map((o, s) => { + const i = l[o]; + return /* @__PURE__ */ e( "circle", { - className: u([e.ringFill, e["color__" + t]]), + className: `RoundGauge__ringFill RoundGauge--color--${o}`, style: { strokeDashoffset: Math.max( (2 - (i[1] - i[0])) * Math.PI * 50, @@ -122,26 +73,41 @@ function A_(y) { cy: "50", r: "45" }, - g + s ); }) }), - /* @__PURE__ */ k( + /* @__PURE__ */ m( "g", { - className: e.needle, - transform: `rotate(${p * 180 - 90} 50 50)`, + className: "RoundGauge__needle", + transform: `rotate(${f * 180 - 90} 50 50)`, children: [ - /* @__PURE__ */ _("polygon", { className: e.needleLine, points: "46,50 50,0 54,50" }), - /* @__PURE__ */ _("circle", { className: e.needleMiddle, cx: "50", cy: "50", r: "8" }) + /* @__PURE__ */ e( + "polygon", + { + className: "RoundGauge__needleLine", + points: "46,50 50,0 54,50" + } + ), + /* @__PURE__ */ e( + "circle", + { + className: "RoundGauge__needleMiddle", + cx: "50", + cy: "50", + r: "8" + } + ) ] } - ) + ), + /* @__PURE__ */ e("title", { children: "alert" }) ] }) } ), - /* @__PURE__ */ _(A, { value: l, format: f }) + /* @__PURE__ */ e(v, { value: r, format: R }) ] }); } export { - A_ as RoundGauge + w as RoundGauge }; diff --git a/dist/components/Section.d.ts b/dist/components/Section.d.ts index 43d49e8..fafa5ee 100644 --- a/dist/components/Section.d.ts +++ b/dist/components/Section.d.ts @@ -1,6 +1,5 @@ import { ReactNode } from 'react'; import { BoxProps } from './Box'; - type Props = Partial<{ /** Buttons to render aside the section title. */ buttons: ReactNode; @@ -52,5 +51,5 @@ type Props = Partial<{ * * ``` */ -export declare const Section: (props: Props) => import("react/jsx-runtime").JSX.Element; +export declare function Section(props: Props): import("react/jsx-runtime").JSX.Element; export {}; diff --git a/dist/components/Section.js b/dist/components/Section.js index 5dc959d..dc5fccf 100644 --- a/dist/components/Section.js +++ b/dist/components/Section.js @@ -1,69 +1,68 @@ -import { jsxs as a, jsx as r } from "react/jsx-runtime"; -import { useRef as P, useEffect as g } from "react"; -import { addScrollableNode as j, removeScrollableNode as z } from "../common/events.js"; -import { classes as d, canRender as m } from "../common/react.js"; -import { s as e } from "../Section.module-qhQWhlUX.js"; -import { computeBoxClassName as B, computeBoxProps as H } from "./Box.js"; -const _ = (f) => { +import { jsxs as s, jsx as t } from "react/jsx-runtime"; +import { useRef as T, useEffect as C } from "react"; +import { addScrollableNode as P, removeScrollableNode as g } from "../common/events.js"; +import { classes as a, canRender as d } from "../common/react.js"; +import { computeBoxClassName as j, computeBoxProps as z } from "./Box.js"; +function G(m) { const { - buttons: o, - children: u, - className: p, - fill: N, - fitted: h, - flexGrow: b, - noTopPadding: x, - onScroll: v, - scrollable: s, - scrollableHorizontal: n, - stretchContents: S, - title: c, - container_id: T, + buttons: n, + children: f, + className: _, + fill: u, + fitted: S, + flexGrow: p, + noTopPadding: N, + onScroll: h, + scrollable: c, + scrollableHorizontal: l, + stretchContents: b, + title: r, + container_id: x, ...i - } = f, t = P(null), C = m(c) || m(o); - return g(() => { - if (!(t != null && t.current) || !s && !n) return; - const l = t.current; - return j(l), () => { - l && z(l); + } = m, e = T(null), v = d(r) || d(n); + return C(() => { + if (!(e != null && e.current) || !c && !l) return; + const o = e.current; + return P(o), () => { + o && g(o); }; - }, []), /* @__PURE__ */ a( + }, []), /* @__PURE__ */ s( "div", { - id: T || "", - className: d([ - e.section, - N && e.fill, - h && e.fitted, - s && e.scrollable, - n && e.scrollableHorizontal, - b && e.sectionFlex, - p, - B(i) + id: x || "", + className: a([ + "Section", + u && "Section--fill", + S && "Section--fitted", + c && "Section--scrollable", + l && "Section--scrollableHorizontal", + p && "Section__flex", + _, + j(i) ]), - ...H(i), + ...z(i), children: [ - C && /* @__PURE__ */ a("div", { className: e.title, children: [ - /* @__PURE__ */ r("span", { className: e.titleText, children: c }), - /* @__PURE__ */ r("div", { className: e.buttons, children: o }) + v && /* @__PURE__ */ s("div", { className: "Section__title", children: [ + /* @__PURE__ */ t("span", { className: "Section__titleText", children: r }), + /* @__PURE__ */ t("div", { className: "Section__buttons", children: n }) ] }), - /* @__PURE__ */ r("div", { className: e.rest, children: /* @__PURE__ */ r( + /* @__PURE__ */ t("div", { className: "Section__rest", children: /* @__PURE__ */ t( "div", { - className: d([ - e.content, - !!S && e.stretchContents, - !!x && e.noTopPadding + className: a([ + "Section__content", + !!b && "content__stretchContents", + !!N && "content__noTopPadding" ]), - onScroll: v, - ref: t, - children: u + onScroll: h, + ref: e, + children: f } ) }) ] } ); -}; +} export { - _ as Section + G as Section }; diff --git a/dist/components/Slider.d.ts b/dist/components/Slider.d.ts index 53c1aca..94aaa1e 100644 --- a/dist/components/Slider.d.ts +++ b/dist/components/Slider.d.ts @@ -1,6 +1,5 @@ import { PropsWithChildren } from 'react'; import { BoxProps } from './Box'; - type Props = { /** Highest possible value. */ maxValue: number; diff --git a/dist/components/Slider.js b/dist/components/Slider.js index d29016c..a0961ba 100644 --- a/dist/components/Slider.js +++ b/dist/components/Slider.js @@ -1,117 +1,109 @@ -import { jsx as s, jsxs as m } from "react/jsx-runtime"; -import { keyOfMatchingRange as R, clamp01 as t, scale as f } from "../common/math.js"; -import { classes as _ } from "../common/react.js"; -import { p as e } from "../ProgressBar.module-Jzqlebbx.js"; -import { computeBoxClassName as q, computeBoxProps as A } from "./Box.js"; -import { DraggableControl as G } from "./DraggableControl.js"; -import '../assets/Slider.css';const H = "_slider_1assx_9", I = "_cursorOffset_1assx_13", J = "_cursor_1assx_13", K = "_pointer_1assx_30", L = "_popupValue_1assx_41", a = { - slider: H, - cursorOffset: I, - cursor: J, - pointer: K, - popupValue: L -}; -function Z(h) { +import { jsx as e, jsxs as m } from "react/jsx-runtime"; +import { keyOfMatchingRange as O, clamp01 as r, scale as u } from "../common/math.js"; +import { classes as p } from "../common/react.js"; +import { computeBoxClassName as b, computeBoxProps as z } from "./Box.js"; +import { DraggableControl as R } from "./DraggableControl.js"; +function J(g) { const { // Draggable props (passthrough) - animated: g, - format: v, - maxValue: o, - minValue: r, - onChange: x, - onDrag: V, - step: y, - stepPixelSize: N, - suppressFlicker: C, - unit: D, - value: O, + animated: f, + format: _, + maxValue: l, + minValue: s, + onChange: h, + onDrag: v, + step: N, + stepPixelSize: x, + suppressFlicker: y, + unit: B, + value: P, // Own props - className: w, - fillValue: l, - color: M, - ranges: S = {}, + className: S, + fillValue: a, + color: V, + ranges: C = {}, children: i, - ...c - } = h, B = i !== void 0; - return /* @__PURE__ */ s( - G, + ...o + } = g, D = i !== void 0; + return /* @__PURE__ */ e( + R, { dragMatrix: [1, 0], - animated: g, - format: v, - maxValue: o, - minValue: r, - onChange: x, - onDrag: V, - step: y, - stepPixelSize: N, - suppressFlicker: C, - unit: D, - value: O, - children: (F) => { + animated: f, + format: _, + maxValue: l, + minValue: s, + onChange: h, + onDrag: v, + step: N, + stepPixelSize: x, + suppressFlicker: y, + unit: B, + value: P, + children: (w) => { const { - displayElement: n, - displayValue: p, - dragging: j, - handleDragStart: k, - inputElement: E, - value: P - } = F, b = l != null, u = f( - l ?? p, - r, - o - ), d = f(p, r, o), z = M || R(l ?? P, S) || "default"; + displayElement: t, + displayValue: n, + dragging: M, + handleDragStart: $, + inputElement: F, + value: j + } = w, k = a != null, c = u( + a ?? n, + s, + l + ), d = u(n, s, l), E = V || O(a ?? j, C) || "default"; return /* @__PURE__ */ m( "div", { - className: _([ - a.slider, - e.progressBar, - e["color__" + z], - w, - q(c) + className: p([ + "Slider", + "ProgressBar", + `ProgressBar--color--${E}`, + S, + b(o) ]), - ...A(c), - onMouseDown: k, + ...z(o), + onMouseDown: $, children: [ - /* @__PURE__ */ s( + /* @__PURE__ */ e( "div", { - className: _([ - e.fill, - b && e.fill__animated + className: p([ + "ProgressBar__fill", + k && "ProgressBar__fill--animated" ]), style: { - width: t(u) * 100 + "%", + width: `${r(c) * 100}%`, opacity: 0.4 } } ), - /* @__PURE__ */ s( + /* @__PURE__ */ e( "div", { - className: e.fill, + className: "ProgressBar__fill", style: { - width: t(Math.min(u, d)) * 100 + "%" + width: `${r(Math.min(c, d)) * 100}%` } } ), /* @__PURE__ */ m( "div", { - className: a.cursorOffset, + className: "Slider__cursorOffset", style: { - width: t(d) * 100 + "%" + width: `${r(d) * 100}%` }, children: [ - /* @__PURE__ */ s("div", { className: a.cursor }), - /* @__PURE__ */ s("div", { className: a.pointer }), - j && /* @__PURE__ */ s("div", { className: a.popupValue, children: n }) + /* @__PURE__ */ e("div", { className: "Slider__cursor" }), + /* @__PURE__ */ e("div", { className: "Slider__pointer" }), + M && /* @__PURE__ */ e("div", { className: "Slider__popupValue", children: t }) ] } ), - /* @__PURE__ */ s("div", { className: e.content, children: B ? i : n }), - E + /* @__PURE__ */ e("div", { className: "ProgressBar__content", children: D ? i : t }), + F ] } ); @@ -120,5 +112,5 @@ function Z(h) { ); } export { - Z as Slider + J as Slider }; diff --git a/dist/components/Stack.d.ts b/dist/components/Stack.d.ts index 5223bc0..d0273b4 100644 --- a/dist/components/Stack.d.ts +++ b/dist/components/Stack.d.ts @@ -1,6 +1,5 @@ import { RefObject } from 'react'; import { FlexItemProps, FlexProps } from './Flex'; - type Props = Partial<{ /** Fills available space. */ fill: boolean; diff --git a/dist/components/Stack.js b/dist/components/Stack.js index 8c4edbd..a3ea103 100644 --- a/dist/components/Stack.js +++ b/dist/components/Stack.js @@ -1,67 +1,57 @@ -import { jsx as l } from "react/jsx-runtime"; -import { classes as o } from "../common/react.js"; -import { computeBoxClassName as _ } from "./Box.js"; -import { computeFlexClassName as f, computeFlexProps as w, computeFlexItemProps as n } from "./Flex.js"; -import '../assets/Stack.css';const h = "_fill_wrul1_9", p = "_horizontal_wrul1_13", z = "_item_wrul1_13", x = "_vertical_wrul1_20", N = "_reverse_wrul1_27", b = "_reverse__vertical_wrul1_35", S = "_zebra_wrul1_43", k = "_divider_wrul1_47", F = "_divider__hidden_wrul1_47", e = { - fill: h, - horizontal: p, - item: z, - vertical: x, - reverse: N, - reverse__vertical: b, - zebra: S, - divider: k, - divider__hidden: F -}; -function a(t) { - const { className: s, vertical: r, fill: i, reverse: c, zebra: d, ...v } = t, m = r ? "column" : "row", u = c ? "-reverse" : ""; - return /* @__PURE__ */ l( +import { jsx as i } from "react/jsx-runtime"; +import { classes as a } from "../common/react.js"; +import { computeBoxClassName as o } from "./Box.js"; +import { computeFlexClassName as k, computeFlexProps as v, computeFlexItemProps as m } from "./Flex.js"; +function n(r) { + const { className: c, vertical: e, fill: t, reverse: s, zebra: l, ...d } = r, f = e ? "column" : "row", S = s ? "-reverse" : ""; + return /* @__PURE__ */ i( "div", { - className: o([ - i && e.fill, - r ? e.vertical : e.horizontal, - d && e.zebra, - c && e[`reverse${r ? "__vertical" : ""}`], - s, - f(t) + className: a([ + "Stack", + t && "Stack--fill", + e ? "Stack--vertical" : "Stack--horizontal", + l && "Stack--zebra", + s && `Stack--reverse${e ? "--vertical" : ""}`, + c, + k(r) ]), - ...w({ - direction: `${m}${u}`, - ...v + ...v({ + direction: `${f}${S}`, + ...d }) } ); } -function I(t) { - const { className: s, innerRef: r, ...i } = t; - return /* @__PURE__ */ l( +function u(r) { + const { className: c, innerRef: e, ...t } = r; + return /* @__PURE__ */ i( "div", { - className: o([e.item, s, _(i)]), - ref: r, - ...n(i) + className: a(["Stack__item", c, o(t)]), + ref: e, + ...m(t) } ); } -a.Item = I; -function P(t) { - const { className: s, hidden: r, ...i } = t; - return /* @__PURE__ */ l( +n.Item = u; +function p(r) { + const { className: c, hidden: e, ...t } = r; + return /* @__PURE__ */ i( "div", { - className: o([ - e.item, - e.divider, - r && e.divider__hidden, - s, - _(i) + className: a([ + "Stack__item", + "Stack__divider", + e && "Stack__divider--hidden", + c, + o(t) ]), - ...n(i) + ...m(t) } ); } -a.Divider = P; +n.Divider = p; export { - a as Stack + n as Stack }; diff --git a/dist/components/StyleableSection.d.ts b/dist/components/StyleableSection.d.ts index c75bd3a..bc1e77d 100644 --- a/dist/components/StyleableSection.d.ts +++ b/dist/components/StyleableSection.d.ts @@ -1,5 +1,4 @@ import { PropsWithChildren, ReactNode } from 'react'; - type Props = Partial<{ style: Record; textStyle: Record; diff --git a/dist/components/StyleableSection.js b/dist/components/StyleableSection.js index 9dbf782..b24c41f 100644 --- a/dist/components/StyleableSection.js +++ b/dist/components/StyleableSection.js @@ -1,16 +1,16 @@ -import { jsxs as s, jsx as l } from "react/jsx-runtime"; -import { s as t } from "../Section.module-qhQWhlUX.js"; -import { Box as e } from "./Box.js"; -function h(i) { - const { children: r, titleStyle: c, titleSubtext: n, title: o, textStyle: a, style: m } = i; - return /* @__PURE__ */ s(e, { style: m, children: [ - /* @__PURE__ */ s(e, { className: t.title, style: c, children: [ - /* @__PURE__ */ l(e, { className: t.titleText, style: a, children: o }), - /* @__PURE__ */ l("div", { className: t.buttons, children: n }) +import { jsxs as l, jsx as e } from "react/jsx-runtime"; +import { Box as t } from "./Box.js"; +function m(i) { + const { children: c, titleStyle: n, titleSubtext: s, title: o, textStyle: r, style: a } = i; + return /* @__PURE__ */ l(t, { style: a, children: [ + /* @__PURE__ */ l(t, { className: "Section__title", style: n, children: [ + /* @__PURE__ */ e(t, { className: "Section__titleText", style: r, children: o }), + /* @__PURE__ */ e("div", { className: "Section__buttons", children: s }), + " " ] }), - /* @__PURE__ */ l(e, { className: t.rest, children: /* @__PURE__ */ l(e, { className: t.content, children: r }) }) + /* @__PURE__ */ e(t, { className: "Section__rest", children: /* @__PURE__ */ e(t, { className: "Section__content", children: c }) }) ] }); } export { - h as StyleableSection + m as StyleableSection }; diff --git a/dist/components/Table.d.ts b/dist/components/Table.d.ts index cbffa6d..c1dd1b2 100644 --- a/dist/components/Table.d.ts +++ b/dist/components/Table.d.ts @@ -1,5 +1,4 @@ import { BoxProps } from './Box'; - type Props = Partial<{ /** Collapses table to the smallest possible size. */ collapsing: boolean; diff --git a/dist/components/Table.js b/dist/components/Table.js index 0f94349..5b37c8e 100644 --- a/dist/components/Table.js +++ b/dist/components/Table.js @@ -1,67 +1,58 @@ -import { jsx as s } from "react/jsx-runtime"; -import { classes as t } from "../common/react.js"; -import { computeBoxClassName as n, computeBoxProps as r } from "./Box.js"; -import '../assets/Table.css';const m = "_table_1hctn_5", d = "_collapsing_1hctn_13", p = "_row_1hctn_17", g = "_cell_1hctn_21", w = "_row__header_1hctn_32", b = "_cell__header_1hctn_33", u = "_cell__collapsing_1hctn_38", e = { - table: m, - collapsing: d, - row: p, - cell: g, - row__header: w, - cell__header: b, - cell__collapsing: u -}; -function h(l) { - const { className: c, collapsing: o, children: _, ...a } = l; - return /* @__PURE__ */ s( +import { jsx as c } from "react/jsx-runtime"; +import { classes as r } from "../common/react.js"; +import { computeBoxClassName as t, computeBoxProps as n } from "./Box.js"; +function m(e) { + const { className: l, collapsing: a, children: s, ...o } = e; + return /* @__PURE__ */ c( "table", { - className: t([ - e.table, - o && e.collapsing, - c, - n(a) + className: r([ + "Table", + a && "Table--collapsing", + l, + t(o) ]), - ...r(a), - children: /* @__PURE__ */ s("tbody", { children: _ }) + ...n(o), + children: /* @__PURE__ */ c("tbody", { children: s }) } ); } -function N(l) { - const { className: c, header: o, ..._ } = l; - return /* @__PURE__ */ s( +function i(e) { + const { className: l, header: a, ...s } = e; + return /* @__PURE__ */ c( "tr", { - className: t([ - e.row, - o && e.row__header, - c, - n(l) + className: r([ + "Table__row", + a && "Table__row--header", + l, + t(e) ]), - ...r(_) + ...n(s) } ); } -h.Row = N; -function f(l) { - const { className: c, collapsing: o, colSpan: _, header: a, ...i } = l; - return /* @__PURE__ */ s( +m.Row = i; +function T(e) { + const { className: l, collapsing: a, colSpan: s, header: o, ...b } = e; + return /* @__PURE__ */ c( "td", { - className: t([ - e.cell, - o && e.cell__collapsing, - a && e.cell__header, - c, - n(l) + className: r([ + "Table__cell", + a && "Table__cell--collapsing", + o && "Table__cell--header", + l, + t(e) ]), - colSpan: _, - ...r(i) + colSpan: s, + ...n(b) } ); } -h.Cell = f; +m.Cell = T; export { - h as Table, - f as TableCell, - N as TableRow + m as Table, + T as TableCell, + i as TableRow }; diff --git a/dist/components/Tabs.d.ts b/dist/components/Tabs.d.ts index 47a1bb8..f5795c8 100644 --- a/dist/components/Tabs.d.ts +++ b/dist/components/Tabs.d.ts @@ -1,6 +1,5 @@ import { PropsWithChildren, ReactNode } from 'react'; import { BoxProps } from './Box'; - type Props = Partial<{ className: string; fill: boolean; diff --git a/dist/components/Tabs.js b/dist/components/Tabs.js index 6991246..ff6ab61 100644 --- a/dist/components/Tabs.js +++ b/dist/components/Tabs.js @@ -1,94 +1,62 @@ -import { jsx as o, jsxs as u } from "react/jsx-runtime"; -import { classes as g, canRender as d } from "../common/react.js"; -import { computeBoxClassName as f, computeBoxProps as m } from "./Box.js"; -import { Icon as k } from "./Icon.js"; -import '../assets/Tabs.css';const w = "_tabs_9h380_13", x = "_fill_9h380_20", y = "_vertical_9h380_35", N = "_horizontal_9h380_40", z = "_tabs__tab_9h380_48", C = "_fluid_9h380_52", S = "_tab_9h380_13", T = "_selected_9h380_66", j = "_tab__text_9h380_75", B = "_tab__left_9h380_80", I = "_tab__right_9h380_86", P = "_color__black_9h380_113", R = "_color__white_9h380_125", q = "_color__red_9h380_137", A = "_color__orange_9h380_149", D = "_color__yellow_9h380_161", E = "_color__olive_9h380_173", F = "_color__green_9h380_185", G = "_color__teal_9h380_197", H = "_color__blue_9h380_209", J = "_color__violet_9h380_221", K = "_color__purple_9h380_233", L = "_color__pink_9h380_245", M = "_color__brown_9h380_257", O = "_color__grey_9h380_269", Q = "_color__good_9h380_293", U = "_color__average_9h380_305", V = "_color__bad_9h380_317", W = "_color__label_9h380_329", _ = { - tabs: w, - fill: x, - vertical: y, - horizontal: N, - tabs__tab: z, - fluid: C, - tab: S, - selected: T, - tab__text: j, - tab__left: B, - tab__right: I, - color__black: P, - color__white: R, - color__red: q, - color__orange: A, - color__yellow: D, - color__olive: E, - color__green: F, - color__teal: G, - color__blue: H, - color__violet: J, - color__purple: K, - color__pink: L, - color__brown: M, - color__grey: O, - "color__light-grey": "_color__light-grey_9h380_281", - color__good: Q, - color__average: U, - color__bad: V, - color__label: W -}; -function X(t) { - const { className: r, vertical: e, fill: a, fluid: c, children: s, ...l } = t; - return /* @__PURE__ */ o( +import { jsx as a, jsxs as u } from "react/jsx-runtime"; +import { classes as T, canRender as d } from "../common/react.js"; +import { computeBoxClassName as f, computeBoxProps as h } from "./Box.js"; +import { Icon as N } from "./Icon.js"; +function v(l) { + const { className: c, vertical: i, fill: o, fluid: e, children: r, ...s } = l; + return /* @__PURE__ */ a( "div", { - className: g([ - _.tabs, - e ? _.vertical : _.horizontal, - a && _.fill, - c && _.fluid, - r, - f(l) + className: T([ + "Tabs", + i ? "Tabs--vertical" : "Tabs--horizontal", + o && "Tabs--fill", + e && "Tabs--fluid", + c, + f(s) ]), - ...m(l), - children: s + ...h(s), + children: r } ); } -function Y(t) { +function x(l) { const { - className: r, - selected: e, - color: a, - icon: c, - iconSpin: s, - leftSlot: l, - rightSlot: n, - children: v, - onClick: i, - ...h - } = t, p = (b) => { - i && (i(b), b.target.blur()); + className: c, + selected: i, + color: o, + icon: e, + iconSpin: r, + leftSlot: s, + rightSlot: t, + children: p, + onClick: n, + ...m + } = l, _ = (b) => { + n && (n(b), b.target.blur()); }; return /* @__PURE__ */ u( "div", { - className: g([ - _.tab, - _.tabs__tab, - _["color__" + a], - e && _.selected, - r, - f(h) + className: T([ + "Tab", + "Tabs__Tab", + `Tab--color--${o}`, + i && "Tab--selected", + c, + f(m) ]), - onClick: p, - ...m(h), + onClick: _, + ...h(m), children: [ - d(l) && /* @__PURE__ */ o("div", { className: _.tab__left, children: l }) || !!c && /* @__PURE__ */ o("div", { className: _.tab__left, children: /* @__PURE__ */ o(k, { name: c, spin: s }) }), - /* @__PURE__ */ o("div", { className: _.tab__text, children: v }), - d(n) && /* @__PURE__ */ o("div", { className: _.tab__right, children: n }) + d(s) && /* @__PURE__ */ a("div", { className: "Tab__left", children: s }) || !!e && /* @__PURE__ */ a("div", { className: "Tab__left", children: /* @__PURE__ */ a(N, { name: e, spin: r }) }), + /* @__PURE__ */ a("div", { className: "Tab__text", children: p }), + d(t) && /* @__PURE__ */ a("div", { className: "Tab__right", children: t }) ] } ); } -X.Tab = Y; +v.Tab = x; export { - X as Tabs + v as Tabs }; diff --git a/dist/components/TextArea.d.ts b/dist/components/TextArea.d.ts index a976786..5b0fe7e 100644 --- a/dist/components/TextArea.d.ts +++ b/dist/components/TextArea.d.ts @@ -1,5 +1,4 @@ import { SyntheticEvent } from 'react'; - export declare const TextArea: import('react').ForwardRefExoticComponent { +import { jsxs as B, jsx as i } from "react/jsx-runtime"; +import { forwardRef as F, useRef as I, useState as Y, useImperativeHandle as C, useEffect as x } from "react"; +import { KEY as p, isEscape as H } from "../common/keys.js"; +import { classes as f } from "../common/react.js"; +import { Box as L } from "./Box.js"; +import { toInputValue as g } from "./Input.js"; +const M = F( + (b, h) => { const { autoFocus: d, - autoSelect: s, + autoSelect: o, displayedValue: a, - dontUseTabForIndent: y, - maxLength: h, - noborder: A, + dontUseTabForIndent: A, + maxLength: _, + noborder: y, onChange: l, - onEnter: n, - onEscape: u, + onEnter: u, + onEscape: s, onInput: c, - placeholder: N, + placeholder: w, scrollbar: S, selfClear: m, - value: i, + value: n, ...E - } = x, { className: K, fluid: k, nowrap: D, ...R } = E, t = C(null), [V, j] = H(0); - function B(r) { - if (r.key === g.Enter) { + } = b, { className: K, fluid: N, nowrap: k, ...D } = E, e = I(null), [R, V] = Y(0); + function $(r) { + if (r.key === p.Enter) { if (r.shiftKey) { r.currentTarget.focus(); return; } - n == null || n(r, r.currentTarget.value), m && (r.currentTarget.value = ""), r.currentTarget.blur(); + u == null || u(r, r.currentTarget.value), m && (r.currentTarget.value = ""), r.currentTarget.blur(); return; } - if (P(r.key)) { - u == null || u(r), m ? r.currentTarget.value = "" : (r.currentTarget.value = T(i), r.currentTarget.blur()); + if (H(r.key)) { + s == null || s(r), m ? r.currentTarget.value = "" : (r.currentTarget.value = g(n), r.currentTarget.blur()); return; } - if (!y && r.key === g.Tab) { + if (!A && r.key === p.Tab) { r.preventDefault(); - const { value: o, selectionStart: b, selectionEnd: F } = r.currentTarget; - r.currentTarget.value = o.substring(0, b) + " " + o.substring(F), r.currentTarget.selectionEnd = b + 1; + const { value: t, selectionStart: T, selectionEnd: j } = r.currentTarget; + r.currentTarget.value = `${t.substring(0, T)} ${t.substring(j)}`, r.currentTarget.selectionEnd = T + 1; } } - return L( - w, - () => t.current - ), _(() => { - if (!d && !s) return; - const r = t.current; - r && (d || s) && setTimeout(() => { - r.focus(), s && r.select(); + return C( + h, + () => e.current + ), x(() => { + if (!d && !o) return; + const r = e.current; + r && (d || o) && setTimeout(() => { + r.focus(), o && r.select(); }, 1); - }, []), _(() => { - const r = t.current; + }, []), x(() => { + const r = e.current; if (!r) return; - const o = T(i); - r.value !== o && (r.value = o); - }, [i]), /* @__PURE__ */ I( - U, + const t = g(n); + r.value !== t && (r.value = t); + }, [n]), /* @__PURE__ */ B( + L, { - className: p([ - e.textArea, - k && e.fluid, - A && e.noborder, + className: f([ + "TextArea", + N && "TextArea--fluid", + y && "TextArea--noborder", K ]), - ...R, + ...D, children: [ - !!a && /* @__PURE__ */ f("div", { className: e.wrapper, children: /* @__PURE__ */ f( + !!a && /* @__PURE__ */ i( "div", { - className: p([e.inner, e.custom]), style: { - transform: `translateY(-${V}px)` + height: "100%", + overflow: "hidden", + position: "absolute", + width: "100%" }, - children: a + children: /* @__PURE__ */ i( + "div", + { + className: f([ + "TextArea__textarea", + "TextArea__textarea_custom" + ]), + style: { + transform: `translateY(-${R}px)` + }, + children: a + } + ) } - ) }), - /* @__PURE__ */ f( + ), + /* @__PURE__ */ i( "textarea", { - className: p([ - e.inner, - S && e.scrollable, - D && e.nowrap + className: f([ + "TextArea__textarea", + S && "TextArea__textarea--scrollable", + k && "TextArea__nowrap" ]), - maxLength: h, + maxLength: _, onBlur: (r) => l == null ? void 0 : l(r, r.target.value), onChange: (r) => c == null ? void 0 : c(r, r.target.value), - onKeyDown: B, + onKeyDown: $, onScroll: () => { - a && t.current && j(t.current.scrollTop); + a && e.current && V(e.current.scrollTop); }, - placeholder: N, - ref: t, + placeholder: w, + ref: e, style: { color: a ? "rgba(0, 0, 0, 0)" : "inherit" } @@ -114,5 +119,5 @@ import '../assets/TextArea.css';const $ = "_textArea_1bert_20", q = "_fluid_1ber } ); export { - tr as TextArea + M as TextArea }; diff --git a/dist/components/TimeDisplay.d.ts b/dist/components/TimeDisplay.d.ts index f3b55f1..4f7f811 100644 --- a/dist/components/TimeDisplay.d.ts +++ b/dist/components/TimeDisplay.d.ts @@ -1,10 +1,11 @@ -interface TimeDisplayProps { - /** Whether the TimeDisplay should automatically increment or decrement (plain prop to dec.) */ - auto?: 'up' | 'down' | true; - /** An optional function to format the value */ - format?: (value: number) => string; +type TimeDisplayProps = { /** The value that the TimeDisplay needs to render - if you pass a wrong type it will be rendered directly */ value: number; -} +} & Partial<{ + /** Whether the TimeDisplay should automatically increment or decrement (plain prop to dec.) */ + auto: 'up' | 'down' | true; + /** An optional function to format the value */ + format: (value: number) => string; +}>; export declare function TimeDisplay(props: TimeDisplayProps): string | number | null; export {}; diff --git a/dist/components/TimeDisplay.js b/dist/components/TimeDisplay.js index 60c1a01..c129c07 100644 --- a/dist/components/TimeDisplay.js +++ b/dist/components/TimeDisplay.js @@ -1,25 +1,25 @@ -import { useState as f, useRef as d, useEffect as m } from "react"; -import { formatTime as v } from "../common/format.js"; -const u = (t) => typeof t == "number" && Number.isFinite(t) && !Number.isNaN(t); -function b(t) { +import { useState as l, useRef as p, useEffect as f } from "react"; +import { formatTime as d } from "../common/format.js"; +import { isSafeNumber as u } from "../common/math.js"; +function I(s) { const { value: e = 0, - auto: r = void 0, - format: i = void 0 - } = t, [o, a] = f( + auto: t = void 0, + format: n = void 0 + } = s, [o, a] = l( () => u(e) ? e : 0 - ), [s, l] = f( + ), [i, m] = l( u(e) ? e : void 0 - ), n = d(null); - return m(() => (r !== void 0 && (n.current = setInterval(() => { - const c = r === "up" ? 10 : -10; - a((p) => Math.max(0, p + c)); + ), r = p(null); + return f(() => (t !== void 0 && (r.current = setInterval(() => { + const c = t === "up" ? 10 : -10; + a((v) => Math.max(0, v + c)); }, 1e3)), () => { - n.current && clearInterval(n.current); - }), [r]), m(() => { - e !== s && (l(e), a(e)); - }, [e, s]), u(e) ? i ? i(o) : v(o) : e || null; + r.current && clearInterval(r.current); + }), [t]), f(() => { + e !== i && (m(e), a(e)); + }, [e, i]), u(e) ? n ? n(o) : d(o) : e || null; } export { - b as TimeDisplay + I as TimeDisplay }; diff --git a/dist/components/Tooltip.d.ts b/dist/components/Tooltip.d.ts index 35148c4..6a34e40 100644 --- a/dist/components/Tooltip.d.ts +++ b/dist/components/Tooltip.d.ts @@ -1,6 +1,5 @@ -import { createPopper, Placement, VirtualElement } from '@popperjs/core'; +import { Placement, VirtualElement, createPopper } from '@popperjs/core'; import { Component, ReactNode } from 'react'; - type Props = { /** The content to display in the tooltip */ content: ReactNode; diff --git a/dist/components/Tooltip.js b/dist/components/Tooltip.js index 1f97712..5ec685e 100644 --- a/dist/components/Tooltip.js +++ b/dist/components/Tooltip.js @@ -1,20 +1,18 @@ -import '../assets/Tooltip.css';var s = Object.defineProperty; -var p = (o, e, n) => e in o ? s(o, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : o[e] = n; -var r = (o, e, n) => p(o, typeof e != "symbol" ? e + "" : e, n); +var s = Object.defineProperty; +var p = (r, e, n) => e in r ? s(r, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : r[e] = n; +var o = (r, e, n) => p(r, typeof e != "symbol" ? e + "" : e, n); import { jsx as l } from "react/jsx-runtime"; import { Component as c } from "react"; import { findDOMNode as m, render as a } from "react-dom"; import { c as u } from "../popper-CiqSDJTE.js"; -const h = "_tooltip_1pib4_13", f = { - tooltip: h -}, i = { +const i = { modifiers: [ { name: "eventListeners", enabled: !1 } ] -}, v = { +}, h = { width: 0, height: 0, top: 0, @@ -32,7 +30,7 @@ const h = "_tooltip_1pib4_13", f = { const e = this.getDOMNode(); e && (e.addEventListener("mouseenter", () => { let n = t.renderedTooltip; - n === void 0 && (n = document.createElement("div"), n.className = f.tooltip, document.body.appendChild(n), t.renderedTooltip = n), t.currentHoveredElement = e, n.style.opacity = "1", this.renderPopperContent(); + n === void 0 && (n = document.createElement("div"), n.className = "Tooltip", document.body.appendChild(n), t.renderedTooltip = n), t.currentHoveredElement = e, n.style.opacity = "1", this.renderPopperContent(); }), e.addEventListener("mouseleave", () => { this.fadeOut(); })); @@ -71,10 +69,10 @@ const h = "_tooltip_1pib4_13", f = { // Thus, instead of using the Popper component, Tooltip creates ONE popper // and stores every tooltip inside that. // This means you can never have two tooltips at once, for instance. -r(t, "renderedTooltip"), r(t, "singletonPopper"), r(t, "currentHoveredElement"), r(t, "virtualElement", { +o(t, "renderedTooltip"), o(t, "singletonPopper"), o(t, "currentHoveredElement"), o(t, "virtualElement", { getBoundingClientRect: () => { var e; - return ((e = t.currentHoveredElement) == null ? void 0 : e.getBoundingClientRect()) ?? v; + return ((e = t.currentHoveredElement) == null ? void 0 : e.getBoundingClientRect()) ?? h; } }); let d = t; diff --git a/dist/components/TrackOutsideClicks.d.ts b/dist/components/TrackOutsideClicks.d.ts index c8c32dd..65b5bef 100644 --- a/dist/components/TrackOutsideClicks.d.ts +++ b/dist/components/TrackOutsideClicks.d.ts @@ -1,5 +1,4 @@ import { Component, PropsWithChildren } from 'react'; - type Props = { onOutsideClick: () => void; } & PropsWithChildren; diff --git a/dist/components/VirtualList.d.ts b/dist/components/VirtualList.d.ts index 1dbf7ce..deb3cb6 100644 --- a/dist/components/VirtualList.d.ts +++ b/dist/components/VirtualList.d.ts @@ -1,5 +1,4 @@ import { PropsWithChildren } from 'react'; - /** * A vertical list that renders items to fill space up to the extents of the * current window, and then defers rendering of other items until they come diff --git a/package.json b/package.json index c74c6c8..92f31d6 100644 --- a/package.json +++ b/package.json @@ -1,9 +1,15 @@ { "name": "tgui-core", - "version": "1.2.1", + "version": "1.3.0", "description": "TGUI core component library", - "keywords": ["TGUI", "library", "typescript"], - "files": ["dist"], + "keywords": [ + "TGUI", + "library", + "typescript" + ], + "files": [ + "dist" + ], "exports": { "./components": { "import": "./dist/components/index.js",