tgui-core 1.0.13 → 1.0.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +30 -30
- package/dist/{ProgressBar.module-Jzqlebbx.js → ProgressBar.module-BkAFfFy0.js} +4 -4
- package/dist/Section.module-CLVHJ4yA.js +15 -0
- package/dist/assets/Button.css +1 -1
- package/dist/assets/Input.css +1 -1
- package/dist/assets/NumberInput.css +1 -1
- package/dist/assets/Section.css +1 -1
- package/dist/assets/Tabs.css +1 -1
- package/dist/assets/TextArea.css +1 -1
- package/dist/assets/Tooltip.css +1 -0
- package/dist/components/Button.js +97 -97
- package/dist/components/Input.js +28 -28
- package/dist/components/NumberInput.js +24 -24
- package/dist/components/ProgressBar.js +15 -15
- package/dist/components/Section.d.ts +1 -1
- package/dist/components/Section.js +35 -45
- package/dist/components/Slider.js +24 -24
- package/dist/components/Stack.js +35 -35
- package/dist/components/StyleableSection.d.ts +1 -1
- package/dist/components/StyleableSection.js +14 -10
- package/dist/components/Tabs.js +49 -51
- package/dist/components/TextArea.d.ts +1 -1
- package/dist/components/TextArea.js +14 -14
- package/dist/components/Tooltip.js +10 -8
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,30 +1,30 @@
|
|
|
1
|
-
# tgui-core
|
|
2
|
-
|
|
3
|
-
A collection of utilities and components for the [tgui](https://github.com/tgstation/tgstation) framework.
|
|
4
|
-
|
|
5
|
-
This package was built to help the various downstream SS13 servers stay up to date with TGUI without having to keep a local version of each file.
|
|
6
|
-
|
|
7
|
-
You can view the code on [GitHub](https://github.com/jlsnow301/tgui-core).
|
|
8
|
-
|
|
9
|
-
## Installation
|
|
10
|
-
|
|
11
|
-
```sh
|
|
12
|
-
yarn add tgui-core
|
|
13
|
-
```
|
|
14
|
-
|
|
15
|
-
## Usage
|
|
16
|
-
|
|
17
|
-
```tsx
|
|
18
|
-
import { Button } from 'tgui-core/components/Button';
|
|
19
|
-
import { render } from 'tgui-core/render';
|
|
20
|
-
|
|
21
|
-
<Button>Click</Button>;
|
|
22
|
-
```
|
|
23
|
-
|
|
24
|
-
## License
|
|
25
|
-
|
|
26
|
-
MIT
|
|
27
|
-
|
|
28
|
-
## Contributing
|
|
29
|
-
|
|
30
|
-
Contributions are welcome. Please open an issue or a pull request. I am available on the tgstation [discord](https://discord.com/invite/EUvpBtU78X).
|
|
1
|
+
# tgui-core
|
|
2
|
+
|
|
3
|
+
A collection of utilities and components for the [tgui](https://github.com/tgstation/tgstation) framework.
|
|
4
|
+
|
|
5
|
+
This package was built to help the various downstream SS13 servers stay up to date with TGUI without having to keep a local version of each file.
|
|
6
|
+
|
|
7
|
+
You can view the code on [GitHub](https://github.com/jlsnow301/tgui-core).
|
|
8
|
+
|
|
9
|
+
## Installation
|
|
10
|
+
|
|
11
|
+
```sh
|
|
12
|
+
yarn add tgui-core
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
## Usage
|
|
16
|
+
|
|
17
|
+
```tsx
|
|
18
|
+
import { Button } from 'tgui-core/components/Button';
|
|
19
|
+
import { render } from 'tgui-core/render';
|
|
20
|
+
|
|
21
|
+
<Button>Click</Button>;
|
|
22
|
+
```
|
|
23
|
+
|
|
24
|
+
## License
|
|
25
|
+
|
|
26
|
+
MIT
|
|
27
|
+
|
|
28
|
+
## Contributing
|
|
29
|
+
|
|
30
|
+
Contributions are welcome. Please open an issue or a pull request. I am available on the tgstation [discord](https://discord.com/invite/EUvpBtU78X).
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
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",
|
|
1
|
+
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", i = "_color__green_140lk_96", g = "_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 = {
|
|
2
2
|
progressBar: _,
|
|
3
3
|
fill: o,
|
|
4
4
|
fill__animated: l,
|
|
@@ -10,8 +10,8 @@ import './assets/ProgressBar.css';const _ = "_progressBar_140lk_17", o = "_fill_
|
|
|
10
10
|
color__orange: a,
|
|
11
11
|
color__yellow: s,
|
|
12
12
|
color__olive: k,
|
|
13
|
-
color__green:
|
|
14
|
-
color__teal:
|
|
13
|
+
color__green: i,
|
|
14
|
+
color__teal: g,
|
|
15
15
|
color__blue: b,
|
|
16
16
|
color__violet: d,
|
|
17
17
|
color__purple: p,
|
|
@@ -25,5 +25,5 @@ import './assets/ProgressBar.css';const _ = "_progressBar_140lk_17", o = "_fill_
|
|
|
25
25
|
color__label: m
|
|
26
26
|
};
|
|
27
27
|
export {
|
|
28
|
-
B as
|
|
28
|
+
B as s
|
|
29
29
|
};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import './assets/Section.css';const t = "_section_1awt0_17", l = "_title_1awt0_28", o = "_titleText_1awt0_34", s = "_buttons_1awt0_40", _ = "_rest_1awt0_47", e = "_content_1awt0_51", n = "_fitted_1awt0_55", c = "_fill_1awt0_59", a = "_scrollable_1awt0_73", i = "_scrollableHorizontal_1awt0_90", r = {
|
|
2
|
+
section: t,
|
|
3
|
+
title: l,
|
|
4
|
+
titleText: o,
|
|
5
|
+
buttons: s,
|
|
6
|
+
rest: _,
|
|
7
|
+
content: e,
|
|
8
|
+
fitted: n,
|
|
9
|
+
fill: c,
|
|
10
|
+
scrollable: a,
|
|
11
|
+
scrollableHorizontal: i
|
|
12
|
+
};
|
|
13
|
+
export {
|
|
14
|
+
r as s
|
|
15
|
+
};
|
package/dist/assets/Button.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._button_19bob_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_19bob_17:last-child{margin-right:0;margin-bottom:0}._button_19bob_17 ._fa_19bob_34,._button_19bob_17 ._fas_19bob_35,._button_19bob_17 ._far_19bob_36{margin-left:-.25em;margin-right:-.25em;min-width:1.333em;text-align:center}._dropdown_19bob_43{line-height:1.3333333333em;height:1.8333333333em;padding:.2rem .5rem}._hasContent_19bob_49 ._fa_19bob_34,._hasContent_19bob_49 ._fas_19bob_35,._hasContent_19bob_49 ._far_19bob_36{margin-right:.25em}._hasContent_19bob_49._iconPosition__right_19bob_55 ._fa_19bob_34,._hasContent_19bob_49._iconPosition__right_19bob_55 ._fas_19bob_35,._hasContent_19bob_49._iconPosition__right_19bob_55 ._far_19bob_36{margin-right:0;margin-left:3px}._ellipsis_19bob_62{text-overflow:ellipsis;overflow:hidden}._fluid_19bob_67{display:block;margin-left:0;margin-right:0}._circular_19bob_73{border-radius:50%}._compact_19bob_77{padding:0 .25em;line-height:1.333em}._color__black_19bob_82{transition:color 50ms,background-color 50ms;background-color:#000;color:#fff}._color__black_19bob_82:focus{transition:color .1s,background-color .1s}._color__black_19bob_82:hover{background-color:#131313;color:#fff}._color__white_19bob_95{transition:color 50ms,background-color 50ms;background-color:#d9d9d9;color:#000}._color__white_19bob_95:focus{transition:color .1s,background-color .1s}._color__white_19bob_95:hover{background-color:#f8f8f8;color:#000}._color__red_19bob_108{transition:color 50ms,background-color 50ms;background-color:#bd2020;color:#fff}._color__red_19bob_108:focus{transition:color .1s,background-color .1s}._color__red_19bob_108:hover{background-color:#dc4848;color:#fff}._color__orange_19bob_121{transition:color 50ms,background-color 50ms;background-color:#d95e0c;color:#fff}._color__orange_19bob_121:focus{transition:color .1s,background-color .1s}._color__orange_19bob_121:hover{background-color:#f0853f;color:#fff}._color__yellow_19bob_134{transition:color 50ms,background-color 50ms;background-color:#d9b804;color:#000}._color__yellow_19bob_134:focus{transition:color .1s,background-color .1s}._color__yellow_19bob_134:hover{background-color:#f5d72e;color:#000}._color__olive_19bob_147{transition:color 50ms,background-color 50ms;background-color:#9aad14;color:#fff}._color__olive_19bob_147:focus{transition:color .1s,background-color .1s}._color__olive_19bob_147:hover{background-color:#c4da2b;color:#fff}._color__green_19bob_160{transition:color 50ms,background-color 50ms;background-color:#1b9638;color:#fff}._color__green_19bob_160:focus{transition:color .1s,background-color .1s}._color__green_19bob_160:hover{background-color:#32c154;color:#fff}._color__teal_19bob_173{transition:color 50ms,background-color 50ms;background-color:#009a93;color:#fff}._color__teal_19bob_173:focus{transition:color .1s,background-color .1s}._color__teal_19bob_173:hover{background-color:#13c4bc;color:#fff}._color__blue_19bob_186{transition:color 50ms,background-color 50ms;background-color:#1c71b1;color:#fff}._color__blue_19bob_186:focus{transition:color .1s,background-color .1s}._color__blue_19bob_186:hover{background-color:#3a95d9;color:#fff}._color__violet_19bob_199{transition:color 50ms,background-color 50ms;background-color:#552dab;color:#fff}._color__violet_19bob_199:focus{transition:color .1s,background-color .1s}._color__violet_19bob_199:hover{background-color:#7953cc;color:#fff}._color__purple_19bob_212{transition:color 50ms,background-color 50ms;background-color:#8b2baa;color:#fff}._color__purple_19bob_212:focus{transition:color .1s,background-color .1s}._color__purple_19bob_212:hover{background-color:#ad4fcd;color:#fff}._color__pink_19bob_225{transition:color 50ms,background-color 50ms;background-color:#cf2082;color:#fff}._color__pink_19bob_225:focus{transition:color .1s,background-color .1s}._color__pink_19bob_225:hover{background-color:#e257a5;color:#fff}._color__brown_19bob_238{transition:color 50ms,background-color 50ms;background-color:#8c5836;color:#fff}._color__brown_19bob_238:focus{transition:color .1s,background-color .1s}._color__brown_19bob_238:hover{background-color:#b47851;color:#fff}._color__grey_19bob_251{transition:color 50ms,background-color 50ms;background-color:#646464;color:#fff}._color__grey_19bob_251:focus{transition:color .1s,background-color .1s}._color__grey_19bob_251:hover{background-color:#868686;color:#fff}._color__light-grey_19bob_264{transition:color 50ms,background-color 50ms;background-color:#919191;color:#fff}._color__light-grey_19bob_264:focus{transition:color .1s,background-color .1s}._color__light-grey_19bob_264:hover{background-color:#bababa;color:#fff}._color__good_19bob_277{transition:color 50ms,background-color 50ms;background-color:#4d9121;color:#fff}._color__good_19bob_277:focus{transition:color .1s,background-color .1s}._color__good_19bob_277:hover{background-color:#6cba39;color:#fff}._color__average_19bob_290{transition:color 50ms,background-color 50ms;background-color:#cd7a0d;color:#fff}._color__average_19bob_290:focus{transition:color .1s,background-color .1s}._color__average_19bob_290:hover{background-color:#ed9d35;color:#fff}._color__bad_19bob_303{transition:color 50ms,background-color 50ms;background-color:#bd2020;color:#fff}._color__bad_19bob_303:focus{transition:color .1s,background-color .1s}._color__bad_19bob_303:hover{background-color:#dc4848;color:#fff}._color__label_19bob_316{transition:color 50ms,background-color 50ms;background-color:#657a94;color:#fff}._color__label_19bob_316:focus{transition:color .1s,background-color .1s}._color__label_19bob_316:hover{background-color:#91a1b3;color:#fff}._color__default_19bob_329{transition:color 50ms,background-color 50ms;background-color:#3e6189;color:#fff}._color__default_19bob_329:focus{transition:color .1s,background-color .1s}._color__default_19bob_329:hover{background-color:#5c83b0;color:#fff}._color__caution_19bob_342{transition:color 50ms,background-color 50ms;background-color:#d9b804;color:#000}._color__caution_19bob_342:focus{transition:color .1s,background-color .1s}._color__caution_19bob_342:hover{background-color:#f5d72e;color:#000}._color__danger_19bob_355{transition:color 50ms,background-color 50ms;background-color:#bd2020;color:#fff}._color__danger_19bob_355:focus{transition:color .1s,background-color .1s}._color__danger_19bob_355:hover{background-color:#dc4848;color:#fff}._color__transparent_19bob_368{transition:color 50ms,background-color 50ms;background-color:#252525;color:#fff;background-color:#25252500;color:#ffffff80}._color__transparent_19bob_368:focus{transition:color .1s,background-color .1s}._color__transparent_19bob_368:hover{background-color:#3e3e3e;color:#fff}._disabled_19bob_383{background-color:#999!important}._selected_19bob_387{transition:color 50ms,background-color 50ms;background-color:#1b9638;color:#fff}._selected_19bob_387:focus{transition:color .1s,background-color .1s}._selected_19bob_387:hover{background-color:#32c154;color:#fff}._flex_19bob_400{display:inline-flex;flex-direction:column}._flex__fluid_19bob_405{width:100%}._verticalAlignContent__top_19bob_409{justify-content:flex-start}._verticalAlignContent__middle_19bob_413{justify-content:center}._verticalAlignContent__bottom_19bob_417{justify-content:flex-end}._content_19bob_421{display:block;align-self:stretch}._textMargin_19bob_426{margin-left:.4rem}
|
package/dist/assets/Input.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._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}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._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}
|
package/dist/assets/Section.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._section_1awt0_17{position:relative;margin-bottom:.5em;background-color:#191919;background-color:#00000054;box-sizing:border-box}._section_1awt0_17:last-child{margin-bottom:0}._title_1awt0_28{position:relative;padding:.5em;border-bottom:.1666666667em solid #4972a1}._titleText_1awt0_34{font-size:1.1666666667em;font-weight:700;color:#fff}._buttons_1awt0_40{position:absolute;display:inline-block;right:.5em;margin-top:-.0833333333em}._rest_1awt0_47{position:relative}._content_1awt0_51{padding:.66em .5em}._fitted_1awt0_55>._rest_1awt0_47>._content_1awt0_51{padding:0}._fill_1awt0_59{display:flex;flex-direction:column;height:100%}._fill_1awt0_59>._rest_1awt0_47{flex-grow:1}._fill_1awt0_59>._rest_1awt0_47>._content_1awt0_51{height:100%}._fill_1awt0_59._scrollable_1awt0_73>._rest_1awt0_47>._content_1awt0_51{position:absolute;top:0;left:0;right:0;bottom:0}._scrollable_1awt0_73{overflow-x:hidden;overflow-y:hidden}._scrollable_1awt0_73>._rest_1awt0_47>._content_1awt0_51{overflow-y:scroll;overflow-x:hidden}._scrollableHorizontal_1awt0_90{overflow-x:hidden;overflow-y:hidden}._scrollableHorizontal_1awt0_90>._rest_1awt0_47>._content_1awt0_51{overflow-y:hidden;overflow-x:scroll}._scrollable_1awt0_73._scrollableHorizontal_1awt0_90{overflow-x:hidden;overflow-y:hidden}._scrollable_1awt0_73._scrollableHorizontal_1awt0_90>._rest_1awt0_47>._content_1awt0_51{overflow-y:scroll;overflow-x:scroll}._section_1awt0_17 ._section_1awt0_17{background-color:transparent;margin-left:-.5em;margin-right:-.5em}._section_1awt0_17 ._section_1awt0_17:first-child{margin-top:-.5em}._section_1awt0_17 ._section_1awt0_17 ._titleText_1awt0_34{font-size:1.0833333333em}._section_1awt0_17 ._section_1awt0_17 ._section_1awt0_17 ._titleText_1awt0_34{font-size:1em}
|
package/dist/assets/Tabs.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._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}
|
package/dist/assets/TextArea.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._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}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._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}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import { jsx as
|
|
1
|
+
import { jsx as c, jsxs as D, Fragment as S } from "react/jsx-runtime";
|
|
2
2
|
import { KEY as B } from "../common/keys.js";
|
|
3
3
|
import { classes as N } from "../common/react.js";
|
|
4
4
|
import { useState as E, createRef as K, useEffect as M, useRef as V } from "react";
|
|
5
5
|
import { computeBoxClassName as j, computeBoxProps as q, Box as O } from "./Box.js";
|
|
6
6
|
import { Icon as R } from "./Icon.js";
|
|
7
7
|
import { Tooltip as F } from "./Tooltip.js";
|
|
8
|
-
import '../assets/Button.css';const T = "
|
|
8
|
+
import '../assets/Button.css';const T = "_button_19bob_17", L = "_fa_19bob_34", Y = "_fas_19bob_35", z = "_far_19bob_36", G = "_dropdown_19bob_43", H = "_hasContent_19bob_49", J = "_iconPosition__right_19bob_55", Q = "_ellipsis_19bob_62", U = "_fluid_19bob_67", W = "_circular_19bob_73", X = "_compact_19bob_77", Z = "_color__black_19bob_82", $ = "_color__white_19bob_95", oo = "_color__red_19bob_108", to = "_color__orange_19bob_121", _o = "_color__yellow_19bob_134", no = "_color__olive_19bob_147", eo = "_color__green_19bob_160", co = "_color__teal_19bob_173", lo = "_color__blue_19bob_186", ro = "_color__violet_19bob_199", io = "_color__purple_19bob_212", so = "_color__pink_19bob_225", ao = "_color__brown_19bob_238", bo = "_color__grey_19bob_251", uo = "_color__good_19bob_277", fo = "_color__average_19bob_290", po = "_color__bad_19bob_303", mo = "_color__label_19bob_316", go = "_color__default_19bob_329", ho = "_color__caution_19bob_342", Co = "_color__danger_19bob_355", yo = "_color__transparent_19bob_368", ko = "_disabled_19bob_383", xo = "_selected_19bob_387", vo = "_flex_19bob_400", wo = "_flex__fluid_19bob_405", Ao = "_verticalAlignContent__top_19bob_409", Po = "_verticalAlignContent__middle_19bob_413", Bo = "_verticalAlignContent__bottom_19bob_417", Io = "_content_19bob_421", No = "_textMargin_19bob_426", o = {
|
|
9
9
|
button: T,
|
|
10
10
|
fa: L,
|
|
11
11
|
fas: Y,
|
|
@@ -22,24 +22,24 @@ import '../assets/Button.css';const T = "_button_pi5yi_17", L = "_fa_pi5yi_34",
|
|
|
22
22
|
color__red: oo,
|
|
23
23
|
color__orange: to,
|
|
24
24
|
color__yellow: _o,
|
|
25
|
-
color__olive:
|
|
26
|
-
color__green:
|
|
27
|
-
color__teal:
|
|
28
|
-
color__blue:
|
|
29
|
-
color__violet:
|
|
30
|
-
color__purple:
|
|
25
|
+
color__olive: no,
|
|
26
|
+
color__green: eo,
|
|
27
|
+
color__teal: co,
|
|
28
|
+
color__blue: lo,
|
|
29
|
+
color__violet: ro,
|
|
30
|
+
color__purple: io,
|
|
31
31
|
color__pink: so,
|
|
32
32
|
color__brown: ao,
|
|
33
|
-
color__grey:
|
|
34
|
-
"color__light-grey": "_color__light-
|
|
33
|
+
color__grey: bo,
|
|
34
|
+
"color__light-grey": "_color__light-grey_19bob_264",
|
|
35
35
|
color__good: uo,
|
|
36
36
|
color__average: fo,
|
|
37
|
-
color__bad:
|
|
37
|
+
color__bad: po,
|
|
38
38
|
color__label: mo,
|
|
39
39
|
color__default: go,
|
|
40
40
|
color__caution: ho,
|
|
41
|
-
color__danger:
|
|
42
|
-
color__transparent:
|
|
41
|
+
color__danger: Co,
|
|
42
|
+
color__transparent: yo,
|
|
43
43
|
disabled: ko,
|
|
44
44
|
selected: xo,
|
|
45
45
|
flex: vo,
|
|
@@ -49,19 +49,19 @@ import '../assets/Button.css';const T = "_button_pi5yi_17", L = "_fa_pi5yi_34",
|
|
|
49
49
|
verticalAlignContent__bottom: Bo,
|
|
50
50
|
content: Io,
|
|
51
51
|
textMargin: No
|
|
52
|
-
},
|
|
52
|
+
}, C = (b) => {
|
|
53
53
|
const {
|
|
54
54
|
captureKeys: s = !0,
|
|
55
55
|
children: a,
|
|
56
56
|
circular: f,
|
|
57
57
|
className: u,
|
|
58
|
-
color:
|
|
59
|
-
compact:
|
|
60
|
-
content:
|
|
58
|
+
color: i,
|
|
59
|
+
compact: y,
|
|
60
|
+
content: p,
|
|
61
61
|
disabled: t,
|
|
62
|
-
ellipsis:
|
|
63
|
-
fluid:
|
|
64
|
-
icon:
|
|
62
|
+
ellipsis: l,
|
|
63
|
+
fluid: n,
|
|
64
|
+
icon: e,
|
|
65
65
|
iconColor: d,
|
|
66
66
|
iconPosition: m,
|
|
67
67
|
iconRotation: w,
|
|
@@ -72,61 +72,61 @@ import '../assets/Button.css';const T = "_button_pi5yi_17", L = "_fa_pi5yi_34",
|
|
|
72
72
|
tooltipPosition: A,
|
|
73
73
|
verticalAlignContent: v,
|
|
74
74
|
...P
|
|
75
|
-
} =
|
|
76
|
-
let _ = /* @__PURE__ */
|
|
75
|
+
} = b, h = p || a;
|
|
76
|
+
let _ = /* @__PURE__ */ c(
|
|
77
77
|
"div",
|
|
78
78
|
{
|
|
79
79
|
className: N([
|
|
80
80
|
o.button,
|
|
81
|
-
|
|
81
|
+
n && o.fluid,
|
|
82
82
|
t && o.disabled,
|
|
83
83
|
x && o.selected,
|
|
84
84
|
!!h && o.hasContent,
|
|
85
85
|
f && o.circular,
|
|
86
|
-
|
|
86
|
+
y && o.compact,
|
|
87
87
|
m && o["iconPosition__" + m],
|
|
88
88
|
v && o.flex,
|
|
89
|
-
v &&
|
|
89
|
+
v && n && o.flex__fluid,
|
|
90
90
|
v && o["verticalAlignContent__" + v],
|
|
91
|
-
|
|
91
|
+
i && typeof i == "string" ? o["color__" + i] : o.color__default,
|
|
92
92
|
u,
|
|
93
93
|
j(P)
|
|
94
94
|
]),
|
|
95
95
|
tabIndex: t ? void 0 : 0,
|
|
96
|
-
onClick: (
|
|
97
|
-
!t && k && k(
|
|
96
|
+
onClick: (r) => {
|
|
97
|
+
!t && k && k(r);
|
|
98
98
|
},
|
|
99
|
-
onKeyDown: (
|
|
99
|
+
onKeyDown: (r) => {
|
|
100
100
|
if (s) {
|
|
101
|
-
if (
|
|
102
|
-
|
|
101
|
+
if (r.key === B.Space || r.key === B.Enter) {
|
|
102
|
+
r.preventDefault(), !t && k && k(r);
|
|
103
103
|
return;
|
|
104
104
|
}
|
|
105
|
-
|
|
105
|
+
r.key === B.Escape && r.preventDefault();
|
|
106
106
|
}
|
|
107
107
|
},
|
|
108
108
|
...q(P),
|
|
109
109
|
children: /* @__PURE__ */ D("div", { className: o.content, children: [
|
|
110
|
-
|
|
110
|
+
e && m !== "right" && /* @__PURE__ */ c(
|
|
111
111
|
R,
|
|
112
112
|
{
|
|
113
|
-
name:
|
|
113
|
+
name: e,
|
|
114
114
|
color: d,
|
|
115
115
|
rotation: w,
|
|
116
116
|
spin: I
|
|
117
117
|
}
|
|
118
118
|
),
|
|
119
|
-
|
|
119
|
+
l ? /* @__PURE__ */ c(
|
|
120
120
|
"span",
|
|
121
121
|
{
|
|
122
|
-
className: N([o.ellipsis,
|
|
122
|
+
className: N([o.ellipsis, e && o.textMargin]),
|
|
123
123
|
children: h
|
|
124
124
|
}
|
|
125
125
|
) : h,
|
|
126
|
-
|
|
126
|
+
e && m === "right" && /* @__PURE__ */ c(
|
|
127
127
|
R,
|
|
128
128
|
{
|
|
129
|
-
name:
|
|
129
|
+
name: e,
|
|
130
130
|
color: d,
|
|
131
131
|
rotation: w,
|
|
132
132
|
spin: I
|
|
@@ -135,11 +135,11 @@ import '../assets/Button.css';const T = "_button_pi5yi_17", L = "_fa_pi5yi_34",
|
|
|
135
135
|
] })
|
|
136
136
|
}
|
|
137
137
|
);
|
|
138
|
-
return g && (_ = /* @__PURE__ */
|
|
139
|
-
}, Ro = (
|
|
140
|
-
const { checked: s, ...a } =
|
|
141
|
-
return /* @__PURE__ */
|
|
142
|
-
|
|
138
|
+
return g && (_ = /* @__PURE__ */ c(F, { content: g, position: A, children: _ })), _;
|
|
139
|
+
}, Ro = (b) => {
|
|
140
|
+
const { checked: s, ...a } = b;
|
|
141
|
+
return /* @__PURE__ */ c(
|
|
142
|
+
C,
|
|
143
143
|
{
|
|
144
144
|
color: "transparent",
|
|
145
145
|
icon: s ? "check-square-o" : "square-o",
|
|
@@ -148,60 +148,60 @@ import '../assets/Button.css';const T = "_button_pi5yi_17", L = "_fa_pi5yi_34",
|
|
|
148
148
|
}
|
|
149
149
|
);
|
|
150
150
|
};
|
|
151
|
-
|
|
152
|
-
const Do = (
|
|
151
|
+
C.Checkbox = Ro;
|
|
152
|
+
const Do = (b) => {
|
|
153
153
|
const {
|
|
154
154
|
children: s,
|
|
155
155
|
color: a,
|
|
156
156
|
confirmColor: f = "bad",
|
|
157
157
|
confirmContent: u = "Confirm?",
|
|
158
|
-
confirmIcon:
|
|
159
|
-
ellipsis:
|
|
160
|
-
icon:
|
|
158
|
+
confirmIcon: i,
|
|
159
|
+
ellipsis: y = !0,
|
|
160
|
+
icon: p,
|
|
161
161
|
onClick: t,
|
|
162
|
-
...
|
|
163
|
-
} =
|
|
164
|
-
return /* @__PURE__ */
|
|
165
|
-
|
|
162
|
+
...l
|
|
163
|
+
} = b, [n, e] = E(!1);
|
|
164
|
+
return /* @__PURE__ */ c(
|
|
165
|
+
C,
|
|
166
166
|
{
|
|
167
|
-
icon:
|
|
168
|
-
color:
|
|
167
|
+
icon: n ? i : p,
|
|
168
|
+
color: n ? f : a,
|
|
169
169
|
onClick: (m) => {
|
|
170
|
-
if (!
|
|
171
|
-
|
|
170
|
+
if (!n) {
|
|
171
|
+
e(!0);
|
|
172
172
|
return;
|
|
173
173
|
}
|
|
174
|
-
t == null || t(m),
|
|
174
|
+
t == null || t(m), e(!1);
|
|
175
175
|
},
|
|
176
|
-
...
|
|
177
|
-
children:
|
|
176
|
+
...l,
|
|
177
|
+
children: n ? u : s
|
|
178
178
|
}
|
|
179
179
|
);
|
|
180
180
|
};
|
|
181
|
-
|
|
182
|
-
const Eo = (
|
|
181
|
+
C.Confirm = Do;
|
|
182
|
+
const Eo = (b) => {
|
|
183
183
|
const {
|
|
184
184
|
children: s,
|
|
185
185
|
color: a = "default",
|
|
186
186
|
content: f,
|
|
187
187
|
currentValue: u,
|
|
188
|
-
defaultValue:
|
|
189
|
-
disabled:
|
|
190
|
-
fluid:
|
|
188
|
+
defaultValue: i,
|
|
189
|
+
disabled: y,
|
|
190
|
+
fluid: p,
|
|
191
191
|
icon: t,
|
|
192
|
-
iconRotation:
|
|
193
|
-
iconSpin:
|
|
194
|
-
maxLength:
|
|
192
|
+
iconRotation: l,
|
|
193
|
+
iconSpin: n,
|
|
194
|
+
maxLength: e,
|
|
195
195
|
onCommit: d = () => null,
|
|
196
196
|
placeholder: m,
|
|
197
197
|
tooltip: w,
|
|
198
198
|
tooltipPosition: I,
|
|
199
199
|
...k
|
|
200
|
-
} =
|
|
201
|
-
const
|
|
202
|
-
if (!
|
|
200
|
+
} = b, [x, g] = E(!1), A = K(), v = f || s, P = (_) => {
|
|
201
|
+
const r = A.current;
|
|
202
|
+
if (!r)
|
|
203
203
|
return;
|
|
204
|
-
|
|
204
|
+
r.value !== "" ? d(_, r.value) : i && d(_, i);
|
|
205
205
|
};
|
|
206
206
|
M(() => {
|
|
207
207
|
const _ = A.current;
|
|
@@ -218,18 +218,18 @@ const Eo = (p) => {
|
|
|
218
218
|
{
|
|
219
219
|
className: N([
|
|
220
220
|
o.button,
|
|
221
|
-
|
|
221
|
+
p && o.fluid,
|
|
222
222
|
o["color__" + a]
|
|
223
223
|
]),
|
|
224
224
|
...k,
|
|
225
225
|
onClick: () => g(!0),
|
|
226
226
|
children: [
|
|
227
|
-
t && /* @__PURE__ */
|
|
228
|
-
/* @__PURE__ */
|
|
229
|
-
/* @__PURE__ */
|
|
227
|
+
t && /* @__PURE__ */ c(R, { name: t, rotation: l, spin: n }),
|
|
228
|
+
/* @__PURE__ */ c("div", { children: v }),
|
|
229
|
+
/* @__PURE__ */ c(
|
|
230
230
|
"input",
|
|
231
231
|
{
|
|
232
|
-
disabled: !!
|
|
232
|
+
disabled: !!y,
|
|
233
233
|
ref: A,
|
|
234
234
|
className: "NumberInput__input",
|
|
235
235
|
style: {
|
|
@@ -251,47 +251,47 @@ const Eo = (p) => {
|
|
|
251
251
|
]
|
|
252
252
|
}
|
|
253
253
|
);
|
|
254
|
-
return w && (h = /* @__PURE__ */
|
|
254
|
+
return w && (h = /* @__PURE__ */ c(F, { content: w, position: I, children: h })), h;
|
|
255
255
|
};
|
|
256
|
-
|
|
257
|
-
function Fo(
|
|
258
|
-
const { accept: s, multiple: a, onSelectFiles: f, ...u } =
|
|
259
|
-
async function
|
|
260
|
-
const
|
|
261
|
-
const
|
|
256
|
+
C.Input = Eo;
|
|
257
|
+
function Fo(b) {
|
|
258
|
+
const { accept: s, multiple: a, onSelectFiles: f, ...u } = b, i = V(null);
|
|
259
|
+
async function y(t) {
|
|
260
|
+
const l = Array.from(t).map((n) => {
|
|
261
|
+
const e = new FileReader();
|
|
262
262
|
return new Promise((d) => {
|
|
263
|
-
|
|
263
|
+
e.onload = () => d(e.result), e.readAsText(n);
|
|
264
264
|
});
|
|
265
265
|
});
|
|
266
|
-
return await Promise.all(
|
|
266
|
+
return await Promise.all(l);
|
|
267
267
|
}
|
|
268
|
-
async function
|
|
269
|
-
const
|
|
270
|
-
if (
|
|
271
|
-
const
|
|
272
|
-
f(a ?
|
|
268
|
+
async function p(t) {
|
|
269
|
+
const l = t.target.files;
|
|
270
|
+
if (l != null && l.length) {
|
|
271
|
+
const n = await y(l);
|
|
272
|
+
f(a ? n : n[0]);
|
|
273
273
|
}
|
|
274
274
|
}
|
|
275
275
|
return /* @__PURE__ */ D(S, { children: [
|
|
276
|
-
/* @__PURE__ */
|
|
276
|
+
/* @__PURE__ */ c(C, { onClick: () => {
|
|
277
277
|
var t;
|
|
278
|
-
return (t =
|
|
278
|
+
return (t = i.current) == null ? void 0 : t.click();
|
|
279
279
|
}, ...u }),
|
|
280
|
-
/* @__PURE__ */
|
|
280
|
+
/* @__PURE__ */ c(
|
|
281
281
|
"input",
|
|
282
282
|
{
|
|
283
283
|
hidden: !0,
|
|
284
284
|
type: "file",
|
|
285
|
-
ref:
|
|
285
|
+
ref: i,
|
|
286
286
|
accept: s,
|
|
287
287
|
multiple: a,
|
|
288
|
-
onChange:
|
|
288
|
+
onChange: p
|
|
289
289
|
}
|
|
290
290
|
)
|
|
291
291
|
] });
|
|
292
292
|
}
|
|
293
|
-
|
|
293
|
+
C.File = Fo;
|
|
294
294
|
export {
|
|
295
|
-
|
|
295
|
+
C as Button,
|
|
296
296
|
Ro as ButtonCheckbox
|
|
297
297
|
};
|