Socket
Socket
Sign inDemoInstall

@vtex/admin-ui-theme

Package Overview
Dependencies
Maintainers
66
Versions
102
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@vtex/admin-ui-theme - npm Package Compare versions

Comparing version 0.10.3 to 0.11.0-experimental.0

368

CHANGELOG.md

@@ -6,87 +6,77 @@ # Change Log

## [0.10.3](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.10.2...@vtex/admin-ui-theme@0.10.3) (2020-12-28)
# [0.11.0-experimental.0](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.10.3...@vtex/admin-ui-theme@0.11.0-experimental.0) (2020-12-28)
**Note:** Version bump only for package @vtex/admin-ui-theme
### Bug Fixes
* **colors:** remove accent colors ([4e877e4](https://github.com/vtex/onda/commit/4e877e47037231f7bb532f0fc9314c5ac4cbfb4b))
### Features
## [0.10.2](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.10.1...@vtex/admin-ui-theme@0.10.2) (2020-12-28)
* **colors:** change color structure to be aligned with figma ([b6419be](https://github.com/vtex/onda/commit/b6419be42bfa7a72be170713a395d58326a52962))
### Bug Fixes
* **select:** fix help text padding, icon size and viewport of documentation ([34d486a](https://github.com/vtex/onda/commit/34d486a66c14ad26a4a46812a08e963df39c1010))
* **select:** fix size of label on mobile select ([2c8d583](https://github.com/vtex/onda/commit/2c8d5838add562b2a19ed5b7e449ed19151334a6))
## [0.10.3](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.10.2...@vtex/admin-ui-theme@0.10.3) (2020-12-28)
**Note:** Version bump only for package @vtex/admin-ui-theme
## [0.10.2](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.10.1...@vtex/admin-ui-theme@0.10.2) (2020-12-28)
## [0.10.1](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.9.2...@vtex/admin-ui-theme@0.10.1) (2020-12-22)
### Bug Fixes
- **select:** fix help text padding, icon size and viewport of documentation ([34d486a](https://github.com/vtex/onda/commit/34d486a66c14ad26a4a46812a08e963df39c1010))
- **select:** fix size of label on mobile select ([2c8d583](https://github.com/vtex/onda/commit/2c8d5838add562b2a19ed5b7e449ed19151334a6))
## [0.10.2-experimental.0](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.10.1...@vtex/admin-ui-theme@0.10.2-experimental.0) (2020-12-23)
### Bug Fixes
* **select:** fix styles ([bba6876](https://github.com/vtex/onda/commit/bba6876fe6e262c757ec4d975b045a59926114c1))
- **colors:** remove accent colors ([9803727](https://github.com/vtex/onda/commit/9803727dd621276b163250e19933f1dbe1a14c31))
### Features
* **select:** create a new component ([f4e3e17](https://github.com/vtex/onda/commit/f4e3e17f952454430505bfeeb3efb3c5c7147389))
- **colors:** change color structure to be aligned with figma ([e53963c](https://github.com/vtex/onda/commit/e53963cb9847cd2e0a95b47bfbc4572c891cac17))
## [0.10.1](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.9.2...@vtex/admin-ui-theme@0.10.1) (2020-12-22)
### Bug Fixes
- **select:** fix styles ([bba6876](https://github.com/vtex/onda/commit/bba6876fe6e262c757ec4d975b045a59926114c1))
### Features
- **select:** create a new component ([f4e3e17](https://github.com/vtex/onda/commit/f4e3e17f952454430505bfeeb3efb3c5c7147389))
# [0.10.0](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.9.2...@vtex/admin-ui-theme@0.10.0) (2020-12-22)
### Bug Fixes
* **select:** fix styles ([bba6876](https://github.com/vtex/onda/commit/bba6876fe6e262c757ec4d975b045a59926114c1))
- **select:** fix styles ([bba6876](https://github.com/vtex/onda/commit/bba6876fe6e262c757ec4d975b045a59926114c1))
### Features
* **select:** create a new component ([f4e3e17](https://github.com/vtex/onda/commit/f4e3e17f952454430505bfeeb3efb3c5c7147389))
- **select:** create a new component ([f4e3e17](https://github.com/vtex/onda/commit/f4e3e17f952454430505bfeeb3efb3c5c7147389))
## [0.9.2](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.9.1...@vtex/admin-ui-theme@0.9.2) (2020-12-18)
### Bug Fixes
* **divider:** change margin to be 0 by default ([b67ce12](https://github.com/vtex/onda/commit/b67ce12d0a731ddc8719f3bcd7e1deb72c9b73e8))
- **divider:** change margin to be 0 by default ([b67ce12](https://github.com/vtex/onda/commit/b67ce12d0a731ddc8719f3bcd7e1deb72c9b73e8))
## [0.9.1](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.9.0...@vtex/admin-ui-theme@0.9.1) (2020-12-16)
### Bug Fixes
* **tooltip:** now it should overlay all elements ([827c221](https://github.com/vtex/onda/commit/827c2216c611ddb1aef80f34ee8fdf49a208c4e7))
- **tooltip:** now it should overlay all elements ([827c221](https://github.com/vtex/onda/commit/827c2216c611ddb1aef80f34ee8fdf49a208c4e7))
# [0.9.0](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.8.2...@vtex/admin-ui-theme@0.9.0) (2020-12-10)
### Features
* **admin:** add mono & sans font to theme ([124711a](https://github.com/vtex/onda/commit/124711ac8b68bfdb2a02785dcfe18bd5300d98d4))
- **admin:** add mono & sans font to theme ([124711a](https://github.com/vtex/onda/commit/124711ac8b68bfdb2a02785dcfe18bd5300d98d4))
## [0.8.2](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.8.1...@vtex/admin-ui-theme@0.8.2) (2020-12-09)

@@ -96,6 +86,2 @@

## [0.8.1](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.8.0-next.2...@vtex/admin-ui-theme@0.8.1) (2020-12-09)

@@ -105,17 +91,8 @@

# [0.8.0-next.2](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.7.0...@vtex/admin-ui-theme@0.8.0-next.2) (2020-12-08)
### Features
* **admin-ui:** implement new system on admin-ui ([a71381a](https://github.com/vtex/onda/commit/a71381aa6a923a33e8e16c1a9fa8baea3b3eb092))
- **admin-ui:** implement new system on admin-ui ([a71381a](https://github.com/vtex/onda/commit/a71381aa6a923a33e8e16c1a9fa8baea3b3eb092))
# [0.8.0-next.1](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.8.0-next.0...@vtex/admin-ui-theme@0.8.0-next.1) (2020-12-08)

@@ -125,89 +102,49 @@

# [0.8.0-next.0](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.7.0...@vtex/admin-ui-theme@0.8.0-next.0) (2020-12-07)
### Features
* **admin-ui:** implement new system on admin-ui ([d6aaf20](https://github.com/vtex/onda/commit/d6aaf206f5cce70cbb3de3bb617e54cb5e8de806))
- **admin-ui:** implement new system on admin-ui ([d6aaf20](https://github.com/vtex/onda/commit/d6aaf206f5cce70cbb3de3bb617e54cb5e8de806))
# [0.7.0](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.6.1...@vtex/admin-ui-theme@0.7.0) (2020-12-02)
### Features
* **admin-theme:** add hairline, thin, light, medium, bold & black font-variation-settings ([f2e9027](https://github.com/vtex/onda/commit/f2e90276d387dd1bce59155985b3b81274def333))
- **admin-theme:** add hairline, thin, light, medium, bold & black font-variation-settings ([f2e9027](https://github.com/vtex/onda/commit/f2e90276d387dd1bce59155985b3b81274def333))
## [0.6.1](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.6.0...@vtex/admin-ui-theme@0.6.1) (2020-12-02)
### Bug Fixes
* **text-area:** remove state property ([b32e171](https://github.com/vtex/onda/commit/b32e171f4cd88ec85be4d0f29e753b79e1679db2))
- **text-area:** remove state property ([b32e171](https://github.com/vtex/onda/commit/b32e171f4cd88ec85be4d0f29e753b79e1679db2))
# [0.6.0](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.5.4...@vtex/admin-ui-theme@0.6.0) (2020-12-02)
### Features
* **collapsible:** add animation to collapsible ([a7c509d](https://github.com/vtex/onda/commit/a7c509d2bebe0443bc3e8e69866850c85610f18b))
- **collapsible:** add animation to collapsible ([a7c509d](https://github.com/vtex/onda/commit/a7c509d2bebe0443bc3e8e69866850c85610f18b))
### BREAKING CHANGES
* **collapsible:** The Collpasible component should now be used directly instead within
CollpasibleGroup.Item
- **collapsible:** The Collpasible component should now be used directly instead within
CollpasibleGroup.Item
## [0.5.4](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.5.3...@vtex/admin-ui-theme@0.5.4) (2020-12-01)
### Bug Fixes
* **dropdown:** rename SelectButton to Dropdown ([b329fc7](https://github.com/vtex/onda/commit/b329fc79427142837b6061710ba36dbc6682ab3e))
- **dropdown:** rename SelectButton to Dropdown ([b329fc7](https://github.com/vtex/onda/commit/b329fc79427142837b6061710ba36dbc6682ab3e))
## [0.5.3](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.5.2...@vtex/admin-ui-theme@0.5.3) (2020-11-30)
### Bug Fixes
* **z-index:** fix zIndex property not consuming from theme ([bc82ba9](https://github.com/vtex/onda/commit/bc82ba983f38984e7bf7774f8a119bbbecd7766a))
- **z-index:** fix zIndex property not consuming from theme ([bc82ba9](https://github.com/vtex/onda/commit/bc82ba983f38984e7bf7774f8a119bbbecd7766a))
## [0.5.2](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.5.1...@vtex/admin-ui-theme@0.5.2) (2020-11-30)
### Bug Fixes
* **numeric-stepper:** rename Stepper to NumericStepper and refactor state logic ([ce442cf](https://github.com/vtex/onda/commit/ce442cf7b2f96fe9b6ca90a4d7cf507275dce47b))
- **numeric-stepper:** rename Stepper to NumericStepper and refactor state logic ([ce442cf](https://github.com/vtex/onda/commit/ce442cf7b2f96fe9b6ca90a4d7cf507275dce47b))
## [0.5.1](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.5.0...@vtex/admin-ui-theme@0.5.1) (2020-11-27)

@@ -217,28 +154,19 @@

# [0.5.0](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.4.3...@vtex/admin-ui-theme@0.5.0) (2020-11-24)
### Features
* input password component ([a77e6b1](https://github.com/vtex/onda/commit/a77e6b1ea8b7ab31855c13a0ab9d33c5e9141808))
* input password component [wip] ([c68e8e0](https://github.com/vtex/onda/commit/c68e8e04d08d6e21ed6a1b9c1ca04dddffbae4af))
* input password reviewed ([0d8e979](https://github.com/vtex/onda/commit/0d8e9790368df7235e2341026314dd75cd57ac3a))
* input password reviewed icons ([a4d43ab](https://github.com/vtex/onda/commit/a4d43abd7d0a6a17a03281bc9ab1fbcfd4aeadcb))
* stepper ([b654134](https://github.com/vtex/onda/commit/b654134f79207f5c9d977199aa2e6bc10b0b9a67))
* stepper ([d81b486](https://github.com/vtex/onda/commit/d81b486a1d0c87788429e33ab02a899201222d0d))
* stepper ([6d36dae](https://github.com/vtex/onda/commit/6d36daed623ee166726a42485f789819484b5ace))
* stepper adjusts ([a679507](https://github.com/vtex/onda/commit/a6795074aa6a9bb34769476be0089f494bf85f83))
* stepper adjusts ([03085c9](https://github.com/vtex/onda/commit/03085c9a37fb52c63bc6c1bc35cf4079df378b0d))
* stepper changes ([a10bb95](https://github.com/vtex/onda/commit/a10bb954620de17c407ad4646acd2a05e6ddbbca))
* stepper Component ([ecee786](https://github.com/vtex/onda/commit/ecee786524f5d7c44d3982da53f64caf5aa1fd7d))
* stepper Component tests ([39faad1](https://github.com/vtex/onda/commit/39faad1a66d4b746855d6a2f4a0d7c98f257e94b))
- input password component ([a77e6b1](https://github.com/vtex/onda/commit/a77e6b1ea8b7ab31855c13a0ab9d33c5e9141808))
- input password component [wip] ([c68e8e0](https://github.com/vtex/onda/commit/c68e8e04d08d6e21ed6a1b9c1ca04dddffbae4af))
- input password reviewed ([0d8e979](https://github.com/vtex/onda/commit/0d8e9790368df7235e2341026314dd75cd57ac3a))
- input password reviewed icons ([a4d43ab](https://github.com/vtex/onda/commit/a4d43abd7d0a6a17a03281bc9ab1fbcfd4aeadcb))
- stepper ([b654134](https://github.com/vtex/onda/commit/b654134f79207f5c9d977199aa2e6bc10b0b9a67))
- stepper ([d81b486](https://github.com/vtex/onda/commit/d81b486a1d0c87788429e33ab02a899201222d0d))
- stepper ([6d36dae](https://github.com/vtex/onda/commit/6d36daed623ee166726a42485f789819484b5ace))
- stepper adjusts ([a679507](https://github.com/vtex/onda/commit/a6795074aa6a9bb34769476be0089f494bf85f83))
- stepper adjusts ([03085c9](https://github.com/vtex/onda/commit/03085c9a37fb52c63bc6c1bc35cf4079df378b0d))
- stepper changes ([a10bb95](https://github.com/vtex/onda/commit/a10bb954620de17c407ad4646acd2a05e6ddbbca))
- stepper Component ([ecee786](https://github.com/vtex/onda/commit/ecee786524f5d7c44d3982da53f64caf5aa1fd7d))
- stepper Component tests ([39faad1](https://github.com/vtex/onda/commit/39faad1a66d4b746855d6a2f4a0d7c98f257e94b))
## [0.4.3](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.4.2...@vtex/admin-ui-theme@0.4.3) (2020-11-19)

@@ -248,17 +176,8 @@

## [0.4.2](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.4.1...@vtex/admin-ui-theme@0.4.2) (2020-11-19)
### Bug Fixes
* **text-area:** add error boolean property to the state property ([3d2d802](https://github.com/vtex/onda/commit/3d2d8027ee5267dcbf9c46ebefa6c623153abe6c))
- **text-area:** add error boolean property to the state property ([3d2d802](https://github.com/vtex/onda/commit/3d2d8027ee5267dcbf9c46ebefa6c623153abe6c))
## [0.4.1](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.4.0...@vtex/admin-ui-theme@0.4.1) (2020-11-18)

@@ -268,58 +187,33 @@

# [0.4.0](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.3.0...@vtex/admin-ui-theme@0.4.0) (2020-11-17)
### Features
* textarea component next to master ([3c4d12c](https://github.com/vtex/onda/commit/3c4d12cf518972850f6d489c526664eae077a09b))
* textarea component next to master[wip] ([8b25c89](https://github.com/vtex/onda/commit/8b25c89f841d51c534f32daf7765982268f28325))
* textarea component reviewed ([d4b7540](https://github.com/vtex/onda/commit/d4b7540028f8acf2da41a735529244321b7ca7ab))
- textarea component next to master ([3c4d12c](https://github.com/vtex/onda/commit/3c4d12cf518972850f6d489c526664eae077a09b))
- textarea component next to master[wip] ([8b25c89](https://github.com/vtex/onda/commit/8b25c89f841d51c534f32daf7765982268f28325))
- textarea component reviewed ([d4b7540](https://github.com/vtex/onda/commit/d4b7540028f8acf2da41a735529244321b7ca7ab))
# [0.3.0](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.2.0...@vtex/admin-ui-theme@0.3.0) (2020-11-16)
### Bug Fixes
* **collapsible-tree:** change from CollapsibleGroup to CollapsibleTree ([16cd720](https://github.com/vtex/onda/commit/16cd7203e129a8db4740adf6ed7aae4650ace007))
- **collapsible-tree:** change from CollapsibleGroup to CollapsibleTree ([16cd720](https://github.com/vtex/onda/commit/16cd7203e129a8db4740adf6ed7aae4650ace007))
### Features
* **collapsible:** adjust collapsible's paddings when it's a nested one ([393dccd](https://github.com/vtex/onda/commit/393dccdc90e31382f83a4aee55d780d59ec9a055))
- **collapsible:** adjust collapsible's paddings when it's a nested one ([393dccd](https://github.com/vtex/onda/commit/393dccdc90e31382f83a4aee55d780d59ec9a055))
# [0.2.0](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.1.2...@vtex/admin-ui-theme@0.2.0) (2020-11-16)
### Features
* **admin-colors:** generate admin colors using polished ([63cb978](https://github.com/vtex/onda/commit/63cb978051c86f6da32ecd0ff6e9c6395ee99e40))
* **button:** add new adaptative variants ([93eb56a](https://github.com/vtex/onda/commit/93eb56aded60f54e37db21b19ee1332d4f1a6309))
- **admin-colors:** generate admin colors using polished ([63cb978](https://github.com/vtex/onda/commit/63cb978051c86f6da32ecd0ff6e9c6395ee99e40))
- **button:** add new adaptative variants ([93eb56a](https://github.com/vtex/onda/commit/93eb56aded60f54e37db21b19ee1332d4f1a6309))
## [0.1.2](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.1.1...@vtex/admin-ui-theme@0.1.2) (2020-11-12)
### Bug Fixes
* **admin-ui-theme:** body scroll blocked ([7df2860](https://github.com/vtex/onda/commit/7df2860fb4c0593485dd12d81a6a1cc53b8d6d86))
- **admin-ui-theme:** body scroll blocked ([7df2860](https://github.com/vtex/onda/commit/7df2860fb4c0593485dd12d81a6a1cc53b8d6d86))
## [0.1.1](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.1.0...@vtex/admin-ui-theme@0.1.1) (2020-11-12)

@@ -329,41 +223,31 @@

# 0.1.0 (2020-11-10)
### Bug Fixes
* **breakpoints:** merge small mobile and mobile ([7f7d0a3](https://github.com/vtex/onda/commit/7f7d0a34dfeadb9dbeda110b61cb15175ac4cffd))
* **colors:** update theme colors values ([83a14b6](https://github.com/vtex/onda/commit/83a14b67938de9589fd1be3c338c8048f51a1cc5))
* **text:** change from text to variant prop ([4a4f3f9](https://github.com/vtex/onda/commit/4a4f3f9eb0f40b519a7e702405467d7cca34a06b))
* **unstable-table:** use table styles instead of flex ([b0b2ee4](https://github.com/vtex/onda/commit/b0b2ee4764876fe9f88a63a5e19aac7087699924))
- **breakpoints:** merge small mobile and mobile ([7f7d0a3](https://github.com/vtex/onda/commit/7f7d0a34dfeadb9dbeda110b61cb15175ac4cffd))
- **colors:** update theme colors values ([83a14b6](https://github.com/vtex/onda/commit/83a14b67938de9589fd1be3c338c8048f51a1cc5))
- **text:** change from text to variant prop ([4a4f3f9](https://github.com/vtex/onda/commit/4a4f3f9eb0f40b519a7e702405467d7cca34a06b))
- **unstable-table:** use table styles instead of flex ([b0b2ee4](https://github.com/vtex/onda/commit/b0b2ee4764876fe9f88a63a5e19aac7087699924))
### Features
* **box-divider:** improve default tokens ([ab7c934](https://github.com/vtex/onda/commit/ab7c93446338463ffcb44d56cee3e8a67bf0e4aa))
* **button:** add base palette ([bd34abb](https://github.com/vtex/onda/commit/bd34abbc6d514b117df045135d5a1908e20d6fb5))
* anchor [WIP] ([dd03002](https://github.com/vtex/onda/commit/dd030024592d8add620a320960a42352f29f4914))
* link [WIP] ([55ec81b](https://github.com/vtex/onda/commit/55ec81b415cbbd7bac58376cb2951ffc249cfa0f))
* **box:** migrate box to new structure ([29e68f4](https://github.com/vtex/onda/commit/29e68f46fe490f7e8e285e1be0ebfe1d6b56d54f))
* **columns:** add columns unstable component ([a24b2d9](https://github.com/vtex/onda/commit/a24b2d9d309d926f88066c2e2ec354d19981e7da))
* **input:** add Input component ([47fbfc2](https://github.com/vtex/onda/commit/47fbfc226e0e79bd76e1586548aa0d253fea0895))
* **label:** migrate label to new structure ([5852559](https://github.com/vtex/onda/commit/5852559b579cbef5963f663636ded5be41bb4e65))
* **layout:** add set component ([0cf2e64](https://github.com/vtex/onda/commit/0cf2e64982da41b59858782ea66927f48dca25bb))
* **list:** add component ([6dc8785](https://github.com/vtex/onda/commit/6dc878559dfec804a8627dcb86758f8a171c580d))
* **modal:** migrate to new structure ([1859bbb](https://github.com/vtex/onda/commit/1859bbb4c179ad2a08facf1fa3a341086927a193))
* **patterns:** add border, palette, and text patterns ([fac9776](https://github.com/vtex/onda/commit/fac9776da7d4f333d675f1aa121bb45505f8730f))
* **skeleton:** migrate to new structure ([860eb1a](https://github.com/vtex/onda/commit/860eb1aee1e038d3ea658c55dd80f26cfa13d14d))
* **style-props:** add space and size style-props ([c42d6ce](https://github.com/vtex/onda/commit/c42d6cecd9c5515f68e6f9472fb701443e102e38))
* **tag:** add tag to admin-ui-theme ([db6f9b3](https://github.com/vtex/onda/commit/db6f9b339649d42f7f7a50705ff3c0358546cb44))
* **text-field:** add TextField component ([c78f127](https://github.com/vtex/onda/commit/c78f127cd407f43178ce3a9d85054289bdc7b508))
* **unstable-table:** add table component ([99b5c77](https://github.com/vtex/onda/commit/99b5c7779f4e5ed46daffe2a7f4e731fc1f3fad5))
- **box-divider:** improve default tokens ([ab7c934](https://github.com/vtex/onda/commit/ab7c93446338463ffcb44d56cee3e8a67bf0e4aa))
- **button:** add base palette ([bd34abb](https://github.com/vtex/onda/commit/bd34abbc6d514b117df045135d5a1908e20d6fb5))
- anchor [WIP] ([dd03002](https://github.com/vtex/onda/commit/dd030024592d8add620a320960a42352f29f4914))
- link [WIP] ([55ec81b](https://github.com/vtex/onda/commit/55ec81b415cbbd7bac58376cb2951ffc249cfa0f))
- **box:** migrate box to new structure ([29e68f4](https://github.com/vtex/onda/commit/29e68f46fe490f7e8e285e1be0ebfe1d6b56d54f))
- **columns:** add columns unstable component ([a24b2d9](https://github.com/vtex/onda/commit/a24b2d9d309d926f88066c2e2ec354d19981e7da))
- **input:** add Input component ([47fbfc2](https://github.com/vtex/onda/commit/47fbfc226e0e79bd76e1586548aa0d253fea0895))
- **label:** migrate label to new structure ([5852559](https://github.com/vtex/onda/commit/5852559b579cbef5963f663636ded5be41bb4e65))
- **layout:** add set component ([0cf2e64](https://github.com/vtex/onda/commit/0cf2e64982da41b59858782ea66927f48dca25bb))
- **list:** add component ([6dc8785](https://github.com/vtex/onda/commit/6dc878559dfec804a8627dcb86758f8a171c580d))
- **modal:** migrate to new structure ([1859bbb](https://github.com/vtex/onda/commit/1859bbb4c179ad2a08facf1fa3a341086927a193))
- **patterns:** add border, palette, and text patterns ([fac9776](https://github.com/vtex/onda/commit/fac9776da7d4f333d675f1aa121bb45505f8730f))
- **skeleton:** migrate to new structure ([860eb1a](https://github.com/vtex/onda/commit/860eb1aee1e038d3ea658c55dd80f26cfa13d14d))
- **style-props:** add space and size style-props ([c42d6ce](https://github.com/vtex/onda/commit/c42d6cecd9c5515f68e6f9472fb701443e102e38))
- **tag:** add tag to admin-ui-theme ([db6f9b3](https://github.com/vtex/onda/commit/db6f9b339649d42f7f7a50705ff3c0358546cb44))
- **text-field:** add TextField component ([c78f127](https://github.com/vtex/onda/commit/c78f127cd407f43178ce3a9d85054289bdc7b508))
- **unstable-table:** add table component ([99b5c77](https://github.com/vtex/onda/commit/99b5c7779f4e5ed46daffe2a7f4e731fc1f3fad5))
# [0.1.0-rc.3](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.1.0-rc.2...@vtex/admin-ui-theme@0.1.0-rc.3) (2020-11-06)

@@ -373,115 +257,73 @@

# [0.1.0-rc.2](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.1.0-rc.1...@vtex/admin-ui-theme@0.1.0-rc.2) (2020-11-06)
### Features
* anchor [WIP] ([54f2acd](https://github.com/vtex/onda/commit/54f2acd758ffbbe6a8be9b6ca1f95aaa97ad8735))
* link [WIP] ([3748582](https://github.com/vtex/onda/commit/3748582786583d0ad4d08a51be3b48fdefd593bd))
- anchor [WIP] ([54f2acd](https://github.com/vtex/onda/commit/54f2acd758ffbbe6a8be9b6ca1f95aaa97ad8735))
- link [WIP] ([3748582](https://github.com/vtex/onda/commit/3748582786583d0ad4d08a51be3b48fdefd593bd))
# [0.1.0-rc.1](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.1.0-rc.0...@vtex/admin-ui-theme@0.1.0-rc.1) (2020-11-04)
### Features
* **input:** add Input component ([9d2fe30](https://github.com/vtex/onda/commit/9d2fe305e9a88980e13e3e05d2f235e730d4c070))
* **text-field:** add TextField component ([89c2764](https://github.com/vtex/onda/commit/89c27643988363beb80b57e06d25ad05cca300da))
- **input:** add Input component ([9d2fe30](https://github.com/vtex/onda/commit/9d2fe305e9a88980e13e3e05d2f235e730d4c070))
- **text-field:** add TextField component ([89c2764](https://github.com/vtex/onda/commit/89c27643988363beb80b57e06d25ad05cca300da))
# 0.1.0-rc.0 (2020-11-04)
### Bug Fixes
* **breakpoints:** merge small mobile and mobile ([2418007](https://github.com/vtex/onda/commit/2418007442425cc2fed7362f5060ff010a31fa84))
* **colors:** update theme colors values ([d8d525a](https://github.com/vtex/onda/commit/d8d525a537007c27f75921fa116a43ece914f461))
* **text:** change from text to variant prop ([5aa42a9](https://github.com/vtex/onda/commit/5aa42a9562319e3aeb0bfe0581311b1739ee1c19))
* **unstable-table:** use table styles instead of flex ([7623036](https://github.com/vtex/onda/commit/7623036803e281cea3d884a655c8788d4875ad24))
- **breakpoints:** merge small mobile and mobile ([2418007](https://github.com/vtex/onda/commit/2418007442425cc2fed7362f5060ff010a31fa84))
- **colors:** update theme colors values ([d8d525a](https://github.com/vtex/onda/commit/d8d525a537007c27f75921fa116a43ece914f461))
- **text:** change from text to variant prop ([5aa42a9](https://github.com/vtex/onda/commit/5aa42a9562319e3aeb0bfe0581311b1739ee1c19))
- **unstable-table:** use table styles instead of flex ([7623036](https://github.com/vtex/onda/commit/7623036803e281cea3d884a655c8788d4875ad24))
### Features
* **box:** migrate box to new structure ([890f91f](https://github.com/vtex/onda/commit/890f91f7b3081fbd7f53d3576500211995956744))
* **columns:** add columns unstable component ([0bfb696](https://github.com/vtex/onda/commit/0bfb696866b296c44cf9feb0b9720e6dfbe5c590))
* **label:** migrate label to new structure ([0a5e0fe](https://github.com/vtex/onda/commit/0a5e0fea1ccea884de20f42f0271582658abce7e))
* **layout:** add set component ([f9e2890](https://github.com/vtex/onda/commit/f9e28907a14e675e5fdc935f8ebfe3cf15179f5f))
* **list:** add component ([ba9a91a](https://github.com/vtex/onda/commit/ba9a91a5647506e023de6a558d69d89b45721ccc))
* **modal:** migrate to new structure ([5165767](https://github.com/vtex/onda/commit/5165767fc5788fbccf811ad383a3f08a72aedf60))
* **patterns:** add border, palette, and text patterns ([4ebd4f7](https://github.com/vtex/onda/commit/4ebd4f75f87cf88c1a182e7795e558ab9616d186))
* **skeleton:** migrate to new structure ([a118507](https://github.com/vtex/onda/commit/a11850778379d4e3f5bb608878daf4d280b3934b))
* **style-props:** add space and size style-props ([a1c7154](https://github.com/vtex/onda/commit/a1c715425062829102452d86ad3fd2887178a30b))
* **tag:** add tag to admin-ui-theme ([75db8ef](https://github.com/vtex/onda/commit/75db8effb1be25d0f63de7590d5216cb02cea3a5))
* **unstable-table:** add table component ([41ba514](https://github.com/vtex/onda/commit/41ba5148e41de9dc430d3dff72e4d4a5afcdcb7c))
- **box:** migrate box to new structure ([890f91f](https://github.com/vtex/onda/commit/890f91f7b3081fbd7f53d3576500211995956744))
- **columns:** add columns unstable component ([0bfb696](https://github.com/vtex/onda/commit/0bfb696866b296c44cf9feb0b9720e6dfbe5c590))
- **label:** migrate label to new structure ([0a5e0fe](https://github.com/vtex/onda/commit/0a5e0fea1ccea884de20f42f0271582658abce7e))
- **layout:** add set component ([f9e2890](https://github.com/vtex/onda/commit/f9e28907a14e675e5fdc935f8ebfe3cf15179f5f))
- **list:** add component ([ba9a91a](https://github.com/vtex/onda/commit/ba9a91a5647506e023de6a558d69d89b45721ccc))
- **modal:** migrate to new structure ([5165767](https://github.com/vtex/onda/commit/5165767fc5788fbccf811ad383a3f08a72aedf60))
- **patterns:** add border, palette, and text patterns ([4ebd4f7](https://github.com/vtex/onda/commit/4ebd4f75f87cf88c1a182e7795e558ab9616d186))
- **skeleton:** migrate to new structure ([a118507](https://github.com/vtex/onda/commit/a11850778379d4e3f5bb608878daf4d280b3934b))
- **style-props:** add space and size style-props ([a1c7154](https://github.com/vtex/onda/commit/a1c715425062829102452d86ad3fd2887178a30b))
- **tag:** add tag to admin-ui-theme ([75db8ef](https://github.com/vtex/onda/commit/75db8effb1be25d0f63de7590d5216cb02cea3a5))
- **unstable-table:** add table component ([41ba514](https://github.com/vtex/onda/commit/41ba5148e41de9dc430d3dff72e4d4a5afcdcb7c))
# [0.1.0-alpha.4](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.1.0-alpha.3...@vtex/admin-ui-theme@0.1.0-alpha.4) (2020-10-27)
### Bug Fixes
* **breakpoints:** merge small mobile and mobile ([8e59e62](https://github.com/vtex/onda/commit/8e59e6240e071c7d2f8895acc8ea7fbfe3f60872))
- **breakpoints:** merge small mobile and mobile ([8e59e62](https://github.com/vtex/onda/commit/8e59e6240e071c7d2f8895acc8ea7fbfe3f60872))
# [0.1.0-alpha.3](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.1.0-alpha.2...@vtex/admin-ui-theme@0.1.0-alpha.3) (2020-10-27)
### Bug Fixes
* **unstable-table:** use table styles instead of flex ([e74a4db](https://github.com/vtex/onda/commit/e74a4db58c867f8216ad7cb5f9b2f42a44752a53))
- **unstable-table:** use table styles instead of flex ([e74a4db](https://github.com/vtex/onda/commit/e74a4db58c867f8216ad7cb5f9b2f42a44752a53))
# [0.1.0-alpha.2](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.1.0-alpha.1...@vtex/admin-ui-theme@0.1.0-alpha.2) (2020-10-27)
### Bug Fixes
* **colors:** update theme colors values ([8c512df](https://github.com/vtex/onda/commit/8c512dfcb2385a6a56a15ee5c1cfd36106237e4e))
- **colors:** update theme colors values ([8c512df](https://github.com/vtex/onda/commit/8c512dfcb2385a6a56a15ee5c1cfd36106237e4e))
### Features
* **unstable-table:** add table component ([cb8fef8](https://github.com/vtex/onda/commit/cb8fef8689de54c04be0e8562bcf15a134fa61fe))
- **unstable-table:** add table component ([cb8fef8](https://github.com/vtex/onda/commit/cb8fef8689de54c04be0e8562bcf15a134fa61fe))
# [0.1.0-alpha.1](https://github.com/vtex/onda/compare/@vtex/admin-ui-theme@0.1.0-alpha.0...@vtex/admin-ui-theme@0.1.0-alpha.1) (2020-10-22)
### Features
* **style-props:** add space and size style-props ([7098f06](https://github.com/vtex/onda/commit/7098f06843f0e02d29c6366eca2cb76e84616802))
- **style-props:** add space and size style-props ([7098f06](https://github.com/vtex/onda/commit/7098f06843f0e02d29c6366eca2cb76e84616802))
# 0.1.0-alpha.0 (2020-10-22)
### Features
* **columns:** add columns unstable component ([9660d54](https://github.com/vtex/onda/commit/9660d54f993d72df529d5e4bf86f0df8919a026d))
* **layout:** add set component ([105ab83](https://github.com/vtex/onda/commit/105ab837ac10d3a0442157f98d562e3d0a16949a))
* **patterns:** add border, palette, and text patterns ([e69f81c](https://github.com/vtex/onda/commit/e69f81c6a72d32f8ce47d0e2e45c317c57b58fab))
- **columns:** add columns unstable component ([9660d54](https://github.com/vtex/onda/commit/9660d54f993d72df529d5e4bf86f0df8919a026d))
- **layout:** add set component ([105ab83](https://github.com/vtex/onda/commit/105ab837ac10d3a0442157f98d562e3d0a16949a))
- **patterns:** add border, palette, and text patterns ([e69f81c](https://github.com/vtex/onda/commit/e69f81c6a72d32f8ce47d0e2e45c317c57b58fab))

573

dist/admin-ui-theme.cjs.development.js

@@ -35,79 +35,70 @@ 'use strict';

var elementaryColors = {
white: '#FFFFFF',
blue: '#DAE3F5',
purple: '#F4EFFF',
yellow: '#FDE6C0',
green: '#D6EFE5',
red: '#FEE3E3',
black: '#323845'
};
var semanticColors = {
primary: '#2953B2',
secondary: '#DAE3F5',
danger: '#CB4242',
dangerWashed: '#FEDADA',
warning: '#FFBA52',
warningWashed: '#F6E0BA',
success: '#368369',
successWashed: '#CEE8DE'
blue: '#2953B2',
blueSecondary: '#DAE3F5',
red: '#CB4242',
redSecondary: '#FEDADA',
yellow: '#FFBA52',
yellowSecondary: '#F6E0BA',
green: '#368369',
greenSecondary: '#CEE8DE',
black: '#323845',
white: '#FFFFFF'
};
var colors = /*#__PURE__*/_extends({}, elementaryColors, {
text: {
primary: '#323845',
var colors = {
dark: {
primary: semanticColors.black,
secondary: '#707685'
},
background: '#FFFFFF',
brand: '#F71963',
muted: ['#898F9E', '#C4C5CA', '#E0E2E7', '#F4F6FB'],
focus: '#8DB6FA',
primary: {
base: semanticColors.primary,
hover: /*#__PURE__*/polished.darken(0.08, semanticColors.primary),
pressed: /*#__PURE__*/polished.darken(0.16, semanticColors.primary),
accent: '#FFFFFF'
light: {
primary: semanticColors.white,
secondary: '#F4F6FB'
},
secondary: {
base: semanticColors.secondary,
hover: /*#__PURE__*/polished.darken(0.04, semanticColors.secondary),
pressed: /*#__PURE__*/polished.darken(0.08, semanticColors.secondary),
accent: semanticColors.primary
mid: {
primary: '#898F9E',
secondary: '#C4C5CA',
tertiary: '#E0E2E7'
},
danger: {
base: semanticColors.danger,
hover: /*#__PURE__*/polished.darken(0.08, semanticColors.danger),
pressed: /*#__PURE__*/polished.darken(0.16, semanticColors.danger),
accent: '#FFFFFF',
washed: {
base: semanticColors.dangerWashed,
hover: /*#__PURE__*/polished.darken(0.04, semanticColors.dangerWashed),
pressed: /*#__PURE__*/polished.darken(0.08, semanticColors.dangerWashed),
accent: semanticColors.danger
focus: '#8DB6FA',
blue: {
"default": semanticColors.blue,
hover: /*#__PURE__*/polished.darken(0.08, semanticColors.blue),
pressed: /*#__PURE__*/polished.darken(0.16, semanticColors.blue),
secondary: {
"default": semanticColors.blueSecondary,
hover: /*#__PURE__*/polished.darken(0.04, semanticColors.blueSecondary),
pressed: /*#__PURE__*/polished.darken(0.08, semanticColors.blueSecondary)
}
},
warning: {
base: semanticColors.warning,
hover: /*#__PURE__*/polished.darken(0.08, semanticColors.warning),
pressed: /*#__PURE__*/polished.darken(0.16, semanticColors.warning),
accent: '#FFFFFF',
washed: {
base: semanticColors.warningWashed,
hover: /*#__PURE__*/polished.darken(0.04, semanticColors.warningWashed),
pressed: /*#__PURE__*/polished.darken(0.08, semanticColors.warningWashed),
accent: semanticColors.warning
red: {
"default": semanticColors.red,
hover: /*#__PURE__*/polished.darken(0.08, semanticColors.red),
pressed: /*#__PURE__*/polished.darken(0.16, semanticColors.red),
secondary: {
"default": semanticColors.redSecondary,
hover: /*#__PURE__*/polished.darken(0.04, semanticColors.redSecondary),
pressed: /*#__PURE__*/polished.darken(0.08, semanticColors.redSecondary)
}
},
success: {
base: semanticColors.success,
hover: /*#__PURE__*/polished.darken(0.08, semanticColors.success),
pressed: /*#__PURE__*/polished.darken(0.16, semanticColors.success),
accent: '#FFFFFF',
washed: {
base: semanticColors.successWashed,
hover: /*#__PURE__*/polished.darken(0.04, semanticColors.successWashed),
pressed: /*#__PURE__*/polished.darken(0.08, semanticColors.successWashed),
accent: semanticColors.success
yellow: {
"default": semanticColors.yellow,
hover: /*#__PURE__*/polished.darken(0.08, semanticColors.yellow),
pressed: /*#__PURE__*/polished.darken(0.16, semanticColors.yellow),
secondary: {
"default": semanticColors.yellowSecondary,
hover: /*#__PURE__*/polished.darken(0.04, semanticColors.yellowSecondary),
pressed: /*#__PURE__*/polished.darken(0.08, semanticColors.yellowSecondary)
}
},
green: {
"default": semanticColors.green,
hover: /*#__PURE__*/polished.darken(0.08, semanticColors.green),
pressed: /*#__PURE__*/polished.darken(0.16, semanticColors.green),
secondary: {
"default": semanticColors.greenSecondary,
hover: /*#__PURE__*/polished.darken(0.04, semanticColors.greenSecondary),
pressed: /*#__PURE__*/polished.darken(0.08, semanticColors.greenSecondary)
}
}
});
};

@@ -233,3 +224,3 @@ var space = {

borderRadius: 'default',
borderColor: 'muted.2'
borderColor: 'mid.tertiary'
},

@@ -241,3 +232,3 @@ 'divider-bottom': {

borderBottomRightRadius: 0,
borderColor: 'muted.2'
borderColor: 'mid.tertiary'
},

@@ -249,3 +240,3 @@ 'divider-top': {

borderTopRightRadius: 0,
borderColor: 'muted.2'
borderColor: 'mid.tertiary'
}

@@ -397,13 +388,13 @@ },

textTransform: 'uppercase',
color: 'primary.accent',
backgroundColor: 'primary.base',
color: 'light.primary',
backgroundColor: 'blue',
':hover': {
backgroundColor: 'primary.hover'
backgroundColor: 'blue.hover'
},
':active': {
backgroundColor: 'primary.pressed'
backgroundColor: 'blue.pressed'
},
':disabled': {
color: 'text.primary',
backgroundColor: 'muted.1'
color: 'dark.primary',
backgroundColor: 'mid.secondary'
}

@@ -413,13 +404,13 @@ },

textTransform: 'uppercase',
backgroundColor: 'secondary.base',
color: 'secondary.accent',
backgroundColor: 'blue.secondary',
color: 'blue',
':hover': {
backgroundColor: 'secondary.hover'
backgroundColor: 'blue.secondary.hover'
},
':active': {
backgroundColor: 'secondary.pressed'
backgroundColor: 'blue.secondary.pressed'
},
':disabled': {
color: 'muted.0',
backgroundColor: 'muted.3'
color: 'mid.primary',
backgroundColor: 'light.secondary'
}

@@ -430,13 +421,13 @@ },

backgroundColor: 'transparent',
color: 'primary.base',
color: 'blue',
':hover': {
color: 'primary.hover',
backgroundColor: 'secondary.hover'
color: 'blue.hover',
backgroundColor: 'blue.secondary.hover'
},
':active': {
color: 'primary.pressed',
backgroundColor: 'secondary.pressed'
color: 'blue.pressed',
backgroundColor: 'blue.secondary.pressed'
},
':disabled': {
color: 'muted.0'
color: 'mid.primary'
}

@@ -446,13 +437,13 @@ },

textTransform: 'uppercase',
color: 'danger.accent',
backgroundColor: 'danger.base',
color: 'light.primary',
backgroundColor: 'red',
':hover': {
backgroundColor: 'danger.hover'
backgroundColor: 'red.hover'
},
':active': {
backgroundColor: 'danger.pressed'
backgroundColor: 'red.pressed'
},
':disabled': {
color: 'text.primary',
backgroundColor: 'muted.1'
color: 'dark.primary',
backgroundColor: 'mid.secondary'
}

@@ -462,15 +453,15 @@ },

textTransform: 'uppercase',
backgroundColor: 'danger.washed.base',
color: 'danger.base',
backgroundColor: 'red.secondary',
color: 'red',
':hover': {
backgroundColor: 'danger.washed.hover',
color: 'danger.hover'
backgroundColor: 'red.secondary.hover',
color: 'red.hover'
},
':active': {
backgroundColor: 'danger.washed.pressed',
color: 'danger.pressed'
backgroundColor: 'red.secondary.pressed',
color: 'red.pressed'
},
':disabled': {
color: 'muted.0',
backgroundColor: 'muted.3'
color: 'mid.primary',
backgroundColor: 'light.secondary'
}

@@ -481,13 +472,13 @@ },

backgroundColor: 'transparent',
color: 'danger.washed.accent',
color: 'red',
':hover': {
color: 'danger.hover',
backgroundColor: 'danger.washed.hover'
color: 'red.hover',
backgroundColor: 'red.secondary.hover'
},
':active': {
color: 'danger.pressed',
backgroundColor: 'danger.washed.pressed'
color: 'red.pressed',
backgroundColor: 'red.secondary.pressed'
},
':disabled': {
color: 'muted.0'
color: 'mid.primary'
}

@@ -499,9 +490,9 @@ },

':hover': {
backgroundColor: /*#__PURE__*/adminUiSystem.alpha('text.primary', 0.04)
backgroundColor: /*#__PURE__*/adminUiSystem.alpha('dark.primary', 0.04)
},
':active': {
backgroundColor: /*#__PURE__*/adminUiSystem.alpha('text.primary', 0.08)
backgroundColor: /*#__PURE__*/adminUiSystem.alpha('dark.primary', 0.08)
},
':disabled': {
color: 'muted.0'
color: 'mid.primary'
}

@@ -513,9 +504,9 @@ },

':hover': {
backgroundColor: /*#__PURE__*/adminUiSystem.alpha('background', 0.04)
backgroundColor: /*#__PURE__*/adminUiSystem.alpha('light.primary', 0.04)
},
':active': {
backgroundColor: /*#__PURE__*/adminUiSystem.alpha('background', 0.08)
backgroundColor: /*#__PURE__*/adminUiSystem.alpha('light.primary', 0.08)
},
':disabled': {
color: 'muted.0'
color: 'mid.primary'
}

@@ -551,3 +542,3 @@ }

borderWidth: 1,
borderColor: 'muted.2',
borderColor: 'mid.tertiary',
margin: 0

@@ -569,3 +560,3 @@ };

borderRadius: '100px',
color: 'text.primary',
color: 'dark.primary',
border: 'none',

@@ -578,19 +569,19 @@ '> svg:nth-of-type(1)': {

blue: {
bg: 'blue'
bg: 'blue.secondary'
},
green: {
bg: 'green'
bg: 'green.secondary'
},
red: {
bg: 'red'
bg: 'red.secondary'
},
black: {
bg: 'black',
color: 'white'
bg: 'dark.primary',
color: 'light.primary'
},
yellow: {
bg: 'yellow'
bg: 'yellow.secondary'
},
purple: {
bg: 'purple'
bg: '#E4E0F0'
}

@@ -644,10 +635,10 @@ };

font: 'inherit',
color: 'primary.base',
color: 'blue',
textDecoration: 'none',
':active': {
color: 'primary.pressed',
color: 'blue.pressed',
textDecoration: 'underline'
},
':hover': {
color: 'primary.hover',
color: 'blue.hover',
textDecoration: 'underline'

@@ -677,7 +668,7 @@ }

cell: {
bg: 'background',
bg: 'light.primary',
flex: 1,
borderBottomWidth: 1,
borderBottomStyle: 'solid',
borderBottomColor: 'muted.2',
borderBottomColor: 'mid.tertiary',
display: 'table-cell',

@@ -689,3 +680,3 @@ verticalAlign: 'middle',

columnheader: {
bg: 'background',
bg: 'light.primary',
height: 48,

@@ -695,3 +686,3 @@ display: 'table-cell',

paddingX: 2,
color: 'text.secondary',
color: 'dark.secondary',
fontWeight: 'normal',

@@ -702,3 +693,3 @@ variant: 'text.body',

borderBottomStyle: 'solid',
borderBottomColor: 'muted.2'
borderBottomColor: 'mid.tertiary'
}

@@ -782,3 +773,3 @@ };

borderBottomStyle: 'solid',
borderBottomColor: 'muted.2',
borderBottomColor: 'mid.tertiary',
justifyContent: 'flex-start'

@@ -824,3 +815,3 @@ };

paddingRight: 4,
borderColor: 'muted.2',
borderColor: 'mid.tertiary',
borderRadius: 'default',

@@ -830,16 +821,16 @@ bg: 'inherit',

fontSize: 1,
color: 'text.primary',
color: 'dark.primary',
outline: 0,
transition: 'snap',
':hover': {
borderColor: 'text.primary'
borderColor: 'dark.primary'
},
':focus': {
borderColor: 'primary.base',
boxShadow: "0 0 0 1px " + colors.primary.base
borderColor: 'blue',
boxShadow: "0 0 0 1px " + colors.blue["default"]
},
':disabled': {
bg: 'muted.3',
borderColor: 'muted.0',
color: 'muted.0'
bg: 'light.secondary',
borderColor: 'mid.primary',
color: 'mid.primary'
},

@@ -857,9 +848,9 @@ ':focus + label': {

var errorState = {
borderColor: 'danger.base',
borderColor: 'red',
':focus': {
borderColor: 'danger.base',
boxShadow: "0 0 0 1px " + colors.danger.base
borderColor: 'red',
boxShadow: "0 0 0 1px " + colors.red["default"]
},
':hover': {
borderColor: 'danger.hover'
borderColor: 'red.hover'
}

@@ -908,6 +899,6 @@ };

suffix: {
color: 'muted.0',
color: 'mid.primary',
borderLeftStyle: 'solid',
borderLeftWidth: '1px',
borderLeftColor: 'muted.2',
borderLeftColor: 'mid.tertiary',
paddingTop: '14px',

@@ -923,3 +914,3 @@ marginTop: 'px',

icon: {
color: 'muted.0',
color: 'mid.primary',
top: 1,

@@ -943,3 +934,3 @@ left: 0,

display: 'flex',
color: 'text.secondary'
color: 'dark.secondary'
}

@@ -961,3 +952,3 @@ }, /*#__PURE__*/getInputVariants('input'), /*#__PURE__*/getInputVariants('input-error', errorState));

cursor: 'pointer',
color: 'text.secondary',
color: 'dark.secondary',
display: 'flex',

@@ -1005,3 +996,3 @@ alignItems: 'center'

borderWidth: '1px',
borderColor: 'muted.1',
borderColor: 'mid.secondary',
backgroundColor: 'transparent',

@@ -1013,8 +1004,8 @@ borderRadius: 'circle',

borderRadius: 'circle',
backgroundColor: 'white',
backgroundColor: 'light.primary',
opacity: 0
},
':checked': {
backgroundColor: 'primary.base',
borderColor: 'primary.base',
backgroundColor: 'blue',
borderColor: 'blue',
':after': {

@@ -1024,8 +1015,8 @@ opacity: 1

':hover': {
backgroundColor: 'primary.hover',
borderColor: 'primary.hover'
backgroundColor: 'blue.hover',
borderColor: 'blue.hover'
},
':active': {
borderColor: 'primary.pressed',
backgroundColor: 'primary.pressed'
borderColor: 'blue.pressed',
backgroundColor: 'blue.pressed'
}

@@ -1035,14 +1026,14 @@ },

cursor: 'not-allowed',
backgroundColor: 'muted.2',
borderColor: 'muted.0',
backgroundColor: 'mid.tertiary',
borderColor: 'mid.primary',
':after': {
backgroundColor: 'muted.0'
backgroundColor: 'mid.primary'
}
},
':hover': {
borderColor: 'text.primary'
borderColor: 'dark.primary'
},
':active': {
borderColor: 'text.secondary',
backgroundColor: 'secondary.base'
borderColor: 'dark.secondary',
backgroundColor: 'blue.secondary'
},

@@ -1085,3 +1076,3 @@ ':focus:not([data-focus-visible-added])': {

borderWidth: 1,
borderColor: 'muted.0',
borderColor: 'mid.primary',
borderRadius: 3,

@@ -1093,4 +1084,4 @@ cursor: 'pointer',

'&:checked': {
backgroundColor: 'primary.base',
borderColor: 'primary.base',
backgroundColor: 'blue',
borderColor: 'blue',
'&:after': {

@@ -1100,17 +1091,17 @@ content: "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8' width='10' height='8' fill='none'><path d='M9 1L4 7L1 4' stroke='%23FFFFFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'></path></svg>\")"

'&[disabled]:after': {
content: "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8' width='10' height='8' fill='none'><path d='M9 1L4 7L1 4' stroke='%238B9299' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'></path></svg>\")"
content: "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8' width='10' height='8' fill='none'><path d='M9 1L4 7L1 4' stroke='%23898F9E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'></path></svg>\")"
},
'&:hover': {
backgroundColor: 'primary.hover',
borderColor: 'primary.hover'
backgroundColor: 'blue.hover',
borderColor: 'blue.hover'
},
'&:active': {
backgroundColor: 'primary.pressed',
borderColor: 'primary.pressed'
backgroundColor: 'blue.pressed',
borderColor: 'blue.pressed'
}
},
'&:indeterminate': {
backgroundColor: 'secondary.base',
borderColor: 'primary.base',
color: 'primary.base',
backgroundColor: 'blue.secondary',
borderColor: 'blue',
color: 'blue',
'&:after': {

@@ -1129,27 +1120,27 @@ content: '""',

'&:disabled': {
backgroundColor: 'muted.1',
borderColor: 'muted.0',
color: 'muted.0'
backgroundColor: 'mid.secondary',
borderColor: 'mid.primary',
color: 'mid.primary'
},
'&:hover': {
borderColor: 'primary.hover',
color: 'primary.hover',
bg: 'secondary.hover'
borderColor: 'blue.hover',
color: 'blue.hover',
bg: 'blue.secondary.hover'
},
'&:active': {
borderColor: 'primary.pressed',
color: 'primary.pressed'
borderColor: 'blue.pressed',
color: 'blue.pressed'
}
},
'&:disabled': {
backgroundColor: 'muted.1',
borderColor: 'muted.0',
color: 'muted.0'
backgroundColor: 'mid.secondary',
borderColor: 'mid.primary',
color: 'mid.primary'
},
'&:hover': {
borderColor: 'text.primary'
borderColor: 'dark.primary'
},
'&:active': {
backgroundColor: 'secondary.base',
borderColor: 'text.secondary'
backgroundColor: 'blue.secondary',
borderColor: 'dark.secondary'
},

@@ -1185,5 +1176,5 @@ ':focus:not([data-focus-visible-added])': {

borderRadius: '6.25rem',
backgroundColor: 'muted.0',
backgroundColor: 'mid.primary',
borderStyle: 'solid',
borderColor: 'muted.0',
borderColor: 'mid.primary',
borderWidth: 1,

@@ -1195,17 +1186,17 @@ '&:after': {

borderRadius: '1.25rem',
backgroundColor: 'success.accent',
backgroundColor: 'light.primary',
transition: 'transform .25s ease'
},
'&:checked': {
backgroundColor: 'success.base',
borderColor: 'success.base',
backgroundColor: 'green',
borderColor: 'green',
'&:hover': {
backgroundColor: 'success.hover',
borderColor: 'success.hover'
backgroundColor: 'green.hover',
borderColor: 'green.hover'
},
'&:disabled': {
backgroundColor: 'muted.0',
borderColor: 'muted.0',
backgroundColor: 'mid.primary',
borderColor: 'mid.primary',
'&:after': {
backgroundColor: 'muted.1'
backgroundColor: 'mid.secondary'
}

@@ -1215,17 +1206,17 @@ }

'&:hover': {
backgroundColor: 'text.secondary',
borderColor: 'text.secondary'
backgroundColor: 'dark.secondary',
borderColor: 'dark.secondary'
},
'&:disabled': {
backgroundColor: 'muted.0',
borderColor: 'muted.0',
backgroundColor: 'mid.primary',
borderColor: 'mid.primary',
'&:after': {
backgroundColor: 'muted.1'
backgroundColor: 'mid.secondary'
}
},
':not(:checked):active': {
backgroundColor: 'text.secondary',
borderColor: 'text.secondary',
backgroundColor: 'dark.secondary',
borderColor: 'dark.secondary',
':after': {
backgroundColor: 'secondary.base'
backgroundColor: 'blue.secondary'
}

@@ -1282,3 +1273,3 @@ },

paddingTop: 2,
color: 'muted.0',
color: 'mid.primary',
marginBottom: 3,

@@ -1308,3 +1299,3 @@ position: 'absolute',

paddingRight: 4,
borderColor: 'muted.2',
borderColor: 'mid.tertiary',
borderRadius: 'default',

@@ -1314,16 +1305,16 @@ bg: 'inherit',

fontSize: 1,
color: 'text.primary',
color: 'dark.primary',
outline: 0,
transition: 'snap',
':hover': {
borderColor: 'text.primary'
borderColor: 'dark.primary'
},
':focus': {
borderColor: 'primary.base',
boxShadow: "0 0 0 1px " + colors.primary.base
borderColor: 'blue',
boxShadow: "0 0 0 1px " + colors.blue["default"]
},
':disabled': {
bg: 'muted.3',
borderColor: 'muted.0',
color: 'muted.0'
bg: 'light.secondary',
borderColor: 'mid.primary',
color: 'mid.primary'
},

@@ -1350,9 +1341,9 @@ // Label styles

textarea: {
borderColor: 'danger.base',
borderColor: 'red',
':focus': {
borderColor: 'danger.base',
boxShadow: "0 0 0 1px " + colors.danger.base
borderColor: 'red',
boxShadow: "0 0 0 1px " + colors.red["default"]
},
':hover': {
borderColor: 'danger.hover'
borderColor: 'red.hover'
}

@@ -1374,3 +1365,3 @@ }

paddingTop: 2,
color: 'muted.0',
color: 'mid.primary',
marginBottom: 3,

@@ -1387,7 +1378,7 @@ position: 'absolute',

cursor: 'pointer',
bg: 'background',
bg: 'light.primary',
borderRadius: 'default',
borderWidth: 1,
borderStyle: 'solid',
borderColor: 'muted.1',
borderColor: 'mid.secondary',
boxShadow: 'menu',

@@ -1407,3 +1398,3 @@ outline: 'none',

cursor: 'pointer',
bg: 'background'
bg: 'light.primary'
};

@@ -1417,3 +1408,3 @@ var dropdown = {

'item-active': /*#__PURE__*/_extends({}, item, {
bg: 'secondary.base'
bg: 'blue.secondary'
})

@@ -1433,14 +1424,14 @@ };

textAlign: 'center',
color: 'black',
color: 'dark.primary',
borderStyle: 'solid',
borderWidth: 1,
borderColor: 'muted.0',
borderColor: 'mid.primary',
borderRadius: 'default',
backgroundColor: 'primary.accent',
backgroundColor: 'light.primary',
':hover': {
borderColor: 'black'
borderColor: 'dark.primary'
},
':disabled': {
backgroundColor: 'muted.3',
color: 'muted.0'
backgroundColor: 'light.secondary',
color: 'mid.primary'
},

@@ -1466,5 +1457,5 @@ ':focus:not([data-focus-visible-added])': {

'default-error': /*#__PURE__*/_extends({}, styles$8, {
borderColor: 'danger.base',
borderColor: 'red',
':hover': {
borderColor: 'danger.base'
borderColor: 'red'
},

@@ -1488,3 +1479,3 @@ ':focus': {

width: 'inherit',
backgroundColor: 'background',
backgroundColor: 'light.primary',
outline: 'none'

@@ -1497,3 +1488,3 @@ };

borderStyle: 'solid',
borderColor: 'muted.0',
borderColor: 'mid.primary',
borderRadius: 'default'

@@ -1507,3 +1498,3 @@ };

paddingLeft: 3,
color: 'text.secondary'
color: 'mid.primary'
};

@@ -1519,3 +1510,3 @@ var optionsUl = {

var item$1 = {
color: 'text.primary',
color: 'dark.primary',
verticalAlign: 'middle',

@@ -1539,26 +1530,26 @@ listStyleType: 'none',

paddingRight: 4,
borderColor: 'muted.1',
borderColor: 'mid.secondary',
borderRadius: 'default',
bg: 'inherit',
fontSize: 1,
color: 'text.secondary',
color: 'dark.secondary',
outline: 0,
':hover': {
borderColor: 'muted.0'
borderColor: 'mid.primary'
},
':hover > svg': {
color: 'text.primary'
color: 'dark.primary'
},
':focus': {
borderColor: colors.primary.base,
boxShadow: "0 0 0 1px " + colors.primary.base
borderColor: colors.blue["default"],
boxShadow: "0 0 0 1px " + colors.blue["default"]
},
':disabled': {
bg: 'muted.3',
borderColor: 'muted.0',
color: 'text.secondary',
bg: 'light.secondary',
borderColor: 'mid.primary',
color: 'dark.secondary',
cursor: 'initial'
},
':disabled > svg': {
color: 'text.secondary'
color: 'dark.secondary'
}

@@ -1568,9 +1559,9 @@ };

var buttonError = /*#__PURE__*/_extends({}, button$1, {
borderColor: 'danger.base',
borderColor: 'red',
':focus': {
borderColor: 'danger.base',
boxShadow: "0 0 0 1px " + colors.danger.base
borderColor: 'red',
boxShadow: "0 0 0 1px " + colors.red["default"]
},
':hover': {
borderColor: 'danger.base'
borderColor: 'red'
}

@@ -1581,3 +1572,3 @@ });

lineHeight: 1.43,
color: 'text.primary',
color: 'dark.primary',
"float": 'left',

@@ -1605,3 +1596,3 @@ marginTop: '1.125rem',

paddingLeft: 3,
color: 'text.secondary',
color: 'dark.secondary',
zIndex: 2

@@ -1616,3 +1607,3 @@ };

var mobileSelect = {
color: 'text.primary',
color: 'dark.primary',
outline: 'none',

@@ -1623,3 +1614,3 @@ fontSize: 1,

border: '1px solid',
borderColor: 'muted.1',
borderColor: 'mid.secondary',
borderRadius: 'default',

@@ -1631,13 +1622,13 @@ paddingTop: '1.125rem',

':focus': {
borderColor: 'primary.base',
boxShadow: "0 0 0 1px " + colors.primary.base
borderColor: 'blue',
boxShadow: "0 0 0 1px " + colors.blue["default"]
},
':disabled': {
bg: 'muted.3',
borderColor: 'muted.0',
color: 'text.primary',
bg: 'light.secondary',
borderColor: 'mid.primary',
color: 'dark.primary',
opacity: 1
},
':disabled > svg': {
color: 'text.secondary'
color: 'dark.secondary'
}

@@ -1647,6 +1638,6 @@ };

var mobileSelectError = /*#__PURE__*/_extends({}, mobileSelect, {
borderColor: 'danger.base',
borderColor: 'red',
':focus': {
borderColor: 'danger.base',
boxShadow: "0 0 0 1px " + colors.danger.base
borderColor: 'red',
boxShadow: "0 0 0 1px " + colors.red["default"]
}

@@ -1659,3 +1650,3 @@ });

top: '25%',
color: 'text.secondary'
color: 'dark.secondary'
};

@@ -1682,4 +1673,4 @@ var select = {

var tooltip = {
backgroundColor: 'text.primary',
color: 'background',
backgroundColor: 'dark.primary',
color: 'light.primary',
fontSize: 1,

@@ -1697,3 +1688,3 @@ paddingY: 2,

flexDirection: 'column',
bg: 'background',
bg: 'light.primary',
marginTop: 1,

@@ -1705,3 +1696,3 @@ padding: 3,

borderStyle: 'solid',
borderColor: 'muted.1',
borderColor: 'mid.secondary',
boxShadow: 'menu',

@@ -1715,3 +1706,3 @@ hr: {

borderRight: 'none',
borderColor: 'muted.1',
borderColor: 'mid.secondary',
width: "calc(100% -" + space[3] + ")",

@@ -1724,3 +1715,3 @@ marginX: "-" + space[3],

paddingX: 1,
color: 'text.primary',
color: 'dark.primary',
fontSize: 1,

@@ -1730,3 +1721,3 @@ border: 'none',

':focus': {
bg: 'secondary.base',
bg: 'blue.secondary',
outline: 'none',

@@ -1736,3 +1727,3 @@ boxShadow: 'none'

':hover': {
color: 'text.primary'
color: 'dark.primary'
},

@@ -1752,5 +1743,5 @@ width: 'full',

outline: 'none',
bg: 'background',
bg: 'light.primary',
borderRadius: 3,
borderColor: 'muted.2',
borderColor: 'mid.tertiary',
borderStyle: 'solid',

@@ -1775,3 +1766,3 @@ borderWidth: 1,

alignItems: 'center',
borderColor: 'muted.2',
borderColor: 'mid.tertiary',
borderStyle: 'solid',

@@ -1795,3 +1786,3 @@ 'button + button': {

right: 0,
bg: 'background',
bg: 'light.primary',
zIndex: 999

@@ -1803,3 +1794,3 @@ };

alignItems: 'center',
borderColor: 'muted.2',
borderColor: 'mid.tertiary',
borderStyle: 'solid',

@@ -1813,3 +1804,3 @@ borderBottomWidth: 0,

right: 0,
bg: 'background',
bg: 'light.primary',
padding: 6,

@@ -1833,3 +1824,3 @@ flexDirection: ['column-reverse', 'column-reverse', 'row'],

scrollbarWidth: 'thin',
scrollbarColor: 'background',
scrollbarColor: 'light.primary',
'::-webkit-scrollbar': {

@@ -1839,6 +1830,6 @@ width: '8px'

'::-webkit-scrollbar-thumb': {
backgroundColor: 'muted.2',
backgroundColor: 'mid.tertiary',
borderRadius: '6px',
border: '2px solid',
color: 'background'
color: 'light.primary'
}

@@ -1857,3 +1848,3 @@ };

alignItems: 'center',
backgroundColor: /*#__PURE__*/polished.rgba(colors.text.primary, 0.5),
backgroundColor: /*#__PURE__*/polished.rgba(colors.dark.primary, 0.5),
position: 'fixed',

@@ -1937,3 +1928,3 @@ top: 0,

height: 'full',
backgroundColor: 'muted.3',
backgroundColor: 'light.secondary',
backgroundSize: "200px 100%",

@@ -1943,3 +1934,3 @@ backgroundRepeat: 'no-repeat',

borderRadius: 3,
backgroundImage: "linear-gradient(\n 90deg,\n " + colors.muted[3] + ",\n white,\n " + colors.muted[3] + "\n )",
backgroundImage: "linear-gradient(\n 90deg,\n " + colors.light.secondary + ",\n white,\n " + colors.light.secondary + "\n )",
animation: load + " 1.2s ease-in-out infinite"

@@ -1958,4 +1949,4 @@ };

container: {
bg: 'background',
borderColor: 'muted.2',
bg: 'light.primary',
borderColor: 'mid.tertiary',
borderStyle: 'solid',

@@ -1966,3 +1957,3 @@ borderWidth: 1,

'container-grouped': {
bg: 'background',
bg: 'light.primary',
borderRadius: 'default'

@@ -2012,12 +2003,12 @@ },

base: /*#__PURE__*/_extends({}, styles$a, {
bg: 'text.primary',
color: 'background'
bg: 'dark.primary',
color: 'light.primary'
}),
primary: /*#__PURE__*/_extends({}, styles$a, {
bg: 'primary.base',
color: 'primary.accent'
bg: 'blue',
color: 'light.primary'
}),
danger: /*#__PURE__*/_extends({}, styles$a, {
bg: 'danger.base',
color: 'danger.accent'
bg: 'red',
color: 'light.primary'
})

@@ -2024,0 +2015,0 @@ };

2

dist/admin-ui-theme.cjs.production.min.js

@@ -1,2 +0,2 @@

"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("polished"),r=require("@vtex/admin-ui-system");function o(){return(o=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var o=arguments[r];for(var t in o)Object.prototype.hasOwnProperty.call(o,t)&&(e[t]=o[t])}return e}).apply(this,arguments)}var t=o({},{white:"#FFFFFF",blue:"#DAE3F5",purple:"#F4EFFF",yellow:"#FDE6C0",green:"#D6EFE5",red:"#FEE3E3",black:"#323845"},{text:{primary:"#323845",secondary:"#707685"},background:"#FFFFFF",brand:"#F71963",muted:["#898F9E","#C4C5CA","#E0E2E7","#F4F6FB"],focus:"#8DB6FA",primary:{base:"#2953B2",hover:e.darken(.08,"#2953B2"),pressed:e.darken(.16,"#2953B2"),accent:"#FFFFFF"},secondary:{base:"#DAE3F5",hover:e.darken(.04,"#DAE3F5"),pressed:e.darken(.08,"#DAE3F5"),accent:"#2953B2"},danger:{base:"#CB4242",hover:e.darken(.08,"#CB4242"),pressed:e.darken(.16,"#CB4242"),accent:"#FFFFFF",washed:{base:"#FEDADA",hover:e.darken(.04,"#FEDADA"),pressed:e.darken(.08,"#FEDADA"),accent:"#CB4242"}},warning:{base:"#FFBA52",hover:e.darken(.08,"#FFBA52"),pressed:e.darken(.16,"#FFBA52"),accent:"#FFFFFF",washed:{base:"#F6E0BA",hover:e.darken(.04,"#F6E0BA"),pressed:e.darken(.08,"#F6E0BA"),accent:"#FFBA52"}},success:{base:"#368369",hover:e.darken(.08,"#368369"),pressed:e.darken(.16,"#368369"),accent:"#FFFFFF",washed:{base:"#CEE8DE",hover:e.darken(.04,"#CEE8DE"),pressed:e.darken(.08,"#CEE8DE"),accent:"#368369"}}}),i={0:"0rem",1:"0.25rem",2:"0.5rem",3:"0.75rem",4:"1rem",5:"1.25rem",6:"1.5rem",7:"1.75rem",8:"2rem",px:"0.0625rem","2px":"0.125rem"},a={sizes:{sm:"20rem",md:"48rem",lg:"56rem",xl:"64rem","1/2":"50%","1/4":"25%","2/4":"50%","3/4":"75%","1/8":"12.5%","2/8":"25%","3/8":"37.5%","4/8":"50%","5/8":"62.5%","6/8":"75%","7/8":"87.5%","1/12":"8.333333%","2/12":"16.666667%","3/12":"25%","4/12":"33.333333%","5/12":"41.666667%","6/12":"50%","7/12":"58.333333%","8/12":"66.666667%","9/12":"75%","10/12":"83.333333%","11/12":"91.666667%",full:"100%",screenHeight:"100vh",screenWidth:"100vw"},colors:t,space:i,breakpoints:["640px","768px","1024px","1280px"],transition:{snap:"all 70ms cubic-bezier(0.2, 0.2, 0.38, 0.9)",fade:"all 110ms cubic-bezier(0.2, 0.2, 0.38, 0.9)",pop:"all 150ms cubic-bezier(0.4, 0.14, 0.3, 1)",callout:"all 240ms cubic-bezier(0.4, 0.14, 0.3, 1)"},fonts:{sans:"VTEXTrustVF, -apple-system, system-ui, BlinkMacSystemFont, sans-serif",mono:'"Dank Mono", "Operator Mono", "Fira Code Retina", "Fira Code", "FiraCode-Retina", "Consolas", "Monaco", "Menlo", monospace'},fontSizes:{0:"0.75rem",1:"0.875rem",2:"1rem",3:"1.125rem",4:"1.25rem"},text:{code:{fontFamily:"mono",lineHeight:"code",fontSize:1,fontFeatureSettings:"'clig' 0, 'calt' 0",fontVariantLigatures:"normal"},small:{fontFamily:"sans",lineHeight:"small",fontSettings:"regular",fontSize:0},body:{fontFamily:"sans",lineHeight:"body",fontSettings:"regular",fontSize:1},highlight:{fontFamily:"sans",lineHeight:"highlight",fontSettings:"regular",fontSize:1},action:{fontFamily:"sans",lineHeight:"action",fontSettings:"regular",fontSize:1,textTransform:"uppercase"},subtitle:{fontFamily:"sans",lineHeight:"subtitle",fontSettings:"regular",fontSize:2},headline:{fontFamily:"sans",lineHeight:"headline",fontSettings:"regular",fontSize:4}},border:{default:{borderWidth:"1px",borderStyle:"solid",borderRadius:"default",borderColor:"muted.2"},"divider-bottom":{borderBottomWidth:"1px",borderBottomStyle:"solid",borderBottomLeftRadius:0,borderBottomRightRadius:0,borderColor:"muted.2"},"divider-top":{borderTopWidth:"1px",borderTopStyle:"solid",borderTopLeftRadius:0,borderTopRightRadius:0,borderColor:"muted.2"}},zIndices:{under:-1,plain:0,over:999,1:1,2:2,3:3,4:4,5:5},fontSettings:{hairline:"'wght' 30",thin:"'wght' 50",light:"'wght' 65",regular:"'wght' 92",medium:"'wght' 120",bold:"'wght' 170",black:"'wght' 200"},lineHeights:{code:1,small:1.125,body:1.25,highlight:1.25,action:1.5,subtitle:1.5,headline:1.5},shadows:{menu:"0rem 0rem 1rem 0rem rgba(0,0,0,0.10)",subtle:"0rem 0rem 1.5rem 0rem rgba(0,0,0,0.05)",focus:"0rem 0rem 0rem "+i["2px"]+" "+t.focus},borderRadius:{default:"4px",flat:"0px",pill:"100px",circle:"100%"}},d={regular:{fontSize:1,height:40,width:"auto",paddingLeft:4,paddingRight:4},"regular-icon":{fontSize:1,height:40,width:40,paddingLeft:1,paddingRight:1,svg:{width:24,minWidth:24,height:24,minHeight:24,margin:1}},"regular-icon-start":{fontSize:1,height:40,width:"auto",paddingLeft:2,paddingRight:3,svg:{width:24,minWidth:24,height:24,minHeight:24,margin:1}},"regular-icon-end":{fontSize:1,height:40,width:"auto",paddingLeft:3,paddingRight:2,svg:{width:24,minWidth:24,height:24,minHeight:24,margin:1}},small:{fontSize:0,height:32,width:"auto",paddingLeft:3,paddingRight:3},"small-icon":{fontSize:0,height:32,width:32,paddingLeft:"2px",paddingRight:"2px",svg:{width:20,minWidth:20,height:20,minHeight:20,margin:1}},"small-icon-start":{fontSize:0,height:32,width:"auto",paddingLeft:2,paddingRight:3,svg:{width:20,minWidth:20,height:20,minHeight:20,margin:1}},"small-icon-end":{fontSize:0,height:32,width:"auto",paddingLeft:3,paddingRight:2,svg:{width:20,minWidth:20,height:20,minHeight:20,margin:1}}},n={primary:{textTransform:"uppercase",color:"primary.accent",backgroundColor:"primary.base",":hover":{backgroundColor:"primary.hover"},":active":{backgroundColor:"primary.pressed"},":disabled":{color:"text.primary",backgroundColor:"muted.1"}},secondary:{textTransform:"uppercase",backgroundColor:"secondary.base",color:"secondary.accent",":hover":{backgroundColor:"secondary.hover"},":active":{backgroundColor:"secondary.pressed"},":disabled":{color:"muted.0",backgroundColor:"muted.3"}},tertiary:{textTransform:"capitalize",backgroundColor:"transparent",color:"primary.base",":hover":{color:"primary.hover",backgroundColor:"secondary.hover"},":active":{color:"primary.pressed",backgroundColor:"secondary.pressed"},":disabled":{color:"muted.0"}},danger:{textTransform:"uppercase",color:"danger.accent",backgroundColor:"danger.base",":hover":{backgroundColor:"danger.hover"},":active":{backgroundColor:"danger.pressed"},":disabled":{color:"text.primary",backgroundColor:"muted.1"}},"danger-secondary":{textTransform:"uppercase",backgroundColor:"danger.washed.base",color:"danger.base",":hover":{backgroundColor:"danger.washed.hover",color:"danger.hover"},":active":{backgroundColor:"danger.washed.pressed",color:"danger.pressed"},":disabled":{color:"muted.0",backgroundColor:"muted.3"}},"danger-tertiary":{textTransform:"capitalize",backgroundColor:"transparent",color:"danger.washed.accent",":hover":{color:"danger.hover",backgroundColor:"danger.washed.hover"},":active":{color:"danger.pressed",backgroundColor:"danger.washed.pressed"},":disabled":{color:"muted.0"}},"adaptative-dark":{color:"currentColor",backgroundColor:"transparent",":hover":{backgroundColor:r.alpha("text.primary",.04)},":active":{backgroundColor:r.alpha("text.primary",.08)},":disabled":{color:"muted.0"}},"adaptative-light":{color:"currentColor",backgroundColor:"transparent",":hover":{backgroundColor:r.alpha("background",.04)},":active":{backgroundColor:r.alpha("background",.08)},":disabled":{color:"muted.0"}}},l={fontFamily:"sans",fontSettings:"regular",border:"none",borderRadius:"default",cursor:"pointer",position:"relative",":focus:not([data-focus-visible-added])":{outline:"none",boxShadow:"none"},":focus":{outline:"none",boxShadow:"focus"}},s=o({},Object.keys(n).reduce((function(e,r){return o({},e,Object.keys(d).reduce((function(e,t){var i;return o({},e,((i={})[r+"-"+t]=o({},l,n[r],d[t]),i))}),[]))}),{})),g={border:"solid",borderWidth:1,borderColor:"muted.2",margin:0},c={horizontal:o({},g,{borderBottom:0}),vertical:o({},g,{borderLeft:0})},b={display:"inline-flex",alignItems:"center",borderRadius:"100px",color:"text.primary",border:"none","> svg:nth-of-type(1)":{marginRight:1}},h={blue:{bg:"blue"},green:{bg:"green"},red:{bg:"red"},black:{bg:"black",color:"white"},yellow:{bg:"yellow"},purple:{bg:"purple"}},u={small:{height:26,paddingX:"2",lineHeight:"small",fontSettings:"'wght' 80",fontSize:0,svg:{width:16,height:16,minWidth:16,minHeight:16},button:{height:16,width:16}},regular:{height:40,paddingX:"4",lineHeight:"subtitle",fontSettings:"regular",fontSize:2,svg:{width:20,minWidth:20,height:20,minHeight:20},button:{height:20,width:20}}},p=o({},Object.keys(h).reduce((function(e,r){return o({},e,Object.keys(u).reduce((function(e,t){var i;return o({},e,((i={})[r+"-"+t]=o({},b,h[r],u[t]),i))}),[]))}),{})),m={table:{display:"table",width:"full"},header:{display:"table-header-group"},body:{display:"table-row-group"},"row-ltr":{display:"table-row",textAlign:"left"},"row-rtl":{display:"table-row",textAlign:"right"},cell:{bg:"background",flex:1,borderBottomWidth:1,borderBottomStyle:"solid",borderBottomColor:"muted.2",display:"table-cell",verticalAlign:"middle",paddingX:2,variant:"text.body"},columnheader:{bg:"background",height:48,display:"table-cell",verticalAlign:"middle",paddingX:2,color:"text.secondary",fontWeight:"normal",variant:"text.body",flex:1,borderBottomWidth:1,borderBottomStyle:"solid",borderBottomColor:"muted.2"}},f={skeleton:{height:24},image:{regular:{width:56,minWidth:56,height:56,minHeight:56,borderRadius:4},compact:{width:32,minWidth:32,height:32,minHeight:32,borderRadius:4},variable:{minWidth:32,minHeight:32,borderRadius:4}},"image-preview":{small:{width:56,minWidth:56,height:56,minHeight:56,borderRadius:4,boxShadow:"menu"},regular:{width:156,minWidth:156,height:156,minHeight:156,borderRadius:4,boxShadow:"menu"},large:{width:256,minWidth:256,height:256,minHeight:256,borderRadius:4,boxShadow:"menu"}},regular:r.merge(m,{cell:{height:80}}),compact:r.merge(m,{cell:{height:48}}),variable:r.merge(m,{cell:{verticalAlign:"top",minHeight:48,paddingY:4}})},x={display:"flex",width:"full",alignItems:"center",borderBottomWidth:1,borderBottomStyle:"solid",borderBottomColor:"muted.2",justifyContent:"flex-start"},y={compact:o({},x,{height:48,"svg, img":{minHeight:32,maxHeight:32,minWidth:32,maxWidth:32}}),regular:o({},x,{height:80,"svg, img":{minHeight:48,maxHeight:48,minWidth:48,maxWidth:48}}),comfortable:o({},x,{height:128,"svg, img":{minHeight:80,maxHeight:80,minWidth:80,maxWidth:80}})},C={fontSettings:"regular",width:"full",height:48,borderStyle:"solid",borderWidth:1,paddingLeft:3,paddingRight:4,borderColor:"muted.2",borderRadius:"default",bg:"inherit",marginY:1,fontSize:1,color:"text.primary",outline:0,transition:"snap",":hover":{borderColor:"text.primary"},":focus":{borderColor:"primary.base",boxShadow:"0 0 0 1px "+t.primary.base},":disabled":{bg:"muted.3",borderColor:"muted.0",color:"muted.0"},":focus + label":{transform:"translate(1px, 4px) scale(0.875)"},":placeholder-shown:not(:focus) + label":{paddingTop:1},":not(:placeholder-shown) + label":{transform:"translate(1px, 4px) scale(0.875)"}},v={borderColor:"danger.base",":focus":{borderColor:"danger.base",boxShadow:"0 0 0 1px "+t.danger.base},":hover":{borderColor:"danger.hover"}};function w(e,o){var t;return void 0===o&&(o={}),(t={})[""+e]=r.merge(C,o),t[e+"-icon"]=r.merge(C,o,{paddingLeft:44}),t[e+"-suffix"]=r.merge(C,o,{paddingRight:"64px"}),t[e+"-clear"]=r.merge(C,o,{paddingRight:"44px"}),t[e+"-icon-clear"]=r.merge(C,o,{paddingLeft:"44px",paddingRight:"44px"}),t[e+"-icon-suffix"]=r.merge(C,o,{paddingRight:"64px",paddingLeft:"44px"}),t[e+"-suffix-clear"]=r.merge(C,o,{paddingRight:"75px"}),t[e+"-icon-suffix-clear"]=r.merge(C,o,{paddingLeft:"44px",paddingRight:"75px"}),t}var k=o({container:{position:"relative"},"container-icon":{position:"relative",label:{left:"44px"}},suffix:{color:"muted.0",borderLeftStyle:"solid",borderLeftWidth:"1px",borderLeftColor:"muted.2",paddingTop:"14px",marginTop:"px",width:"32px",paddingLeft:3,lineHeight:"body",fontSettings:"regular",fontSize:1},icon:{color:"muted.0",top:1,left:0,marginX:3,marginTop:"14px",position:"absolute",height:20,width:20,minWidth:20,minHeight:20},buttons:{right:0,top:1,height:46,paddingRight:3,position:"absolute",display:"flex",color:"text.secondary"}},w("input"),w("input-error",v)),S={fontSettings:"regular",lh:"highlight",marginTop:3,marginBottom:6,display:"flex",alignItems:"flex-start","& > label > input":{marginRight:2,marginLeft:0},"& > label":{cursor:"pointer",color:"text.secondary",display:"flex",alignItems:"center"}},F={"horizontal-regular":o({},S,{fontSize:"2",flexDirection:"row","& label:not(:last-child)":{marginRight:6}}),"horizontal-small":o({},S,{fontSize:"1",flexDirection:"row","& label:not(:last-child)":{marginRight:5}}),"vertical-regular":o({},S,{fontSize:"2",flexDirection:"column","& label:not(:last-child)":{marginBottom:4}}),"vertical-small":o({},S,{fontSize:"1",flexDirection:"column","& label:not(:last-child)":{marginBottom:4}})},R={appearance:"none",margin:0,position:"relative",cursor:"pointer",borderStyle:"solid",borderWidth:"1px",borderColor:"muted.1",backgroundColor:"transparent",borderRadius:"circle",":after":{content:'""',display:"block",borderRadius:"circle",backgroundColor:"white",opacity:0},":checked":{backgroundColor:"primary.base",borderColor:"primary.base",":after":{opacity:1},":hover":{backgroundColor:"primary.hover",borderColor:"primary.hover"},":active":{borderColor:"primary.pressed",backgroundColor:"primary.pressed"}},":disabled":{cursor:"not-allowed",backgroundColor:"muted.2",borderColor:"muted.0",":after":{backgroundColor:"muted.0"}},":hover":{borderColor:"text.primary"},":active":{borderColor:"text.secondary",backgroundColor:"secondary.base"},":focus:not([data-focus-visible-added])":{outline:"none",boxShadow:"none"},":focus":{outline:"none",boxShadow:"focus"}},W={regular:r.merge(R,{height:20,width:20,padding:"5px",":after":{width:8,height:8}}),small:r.merge(R,{height:16,width:16,padding:1,":after":{width:6,height:6}})},z={appearance:"none",borderStyle:"solid",borderWidth:1,borderColor:"muted.0",borderRadius:3,cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center","&:checked":{backgroundColor:"primary.base",borderColor:"primary.base","&:after":{content:"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8' width='10' height='8' fill='none'><path d='M9 1L4 7L1 4' stroke='%23FFFFFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'></path></svg>\")"},"&[disabled]:after":{content:"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8' width='10' height='8' fill='none'><path d='M9 1L4 7L1 4' stroke='%238B9299' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'></path></svg>\")"},"&:hover":{backgroundColor:"primary.hover",borderColor:"primary.hover"},"&:active":{backgroundColor:"primary.pressed",borderColor:"primary.pressed"}},"&:indeterminate":{backgroundColor:"secondary.base",borderColor:"primary.base",color:"primary.base","&:after":{content:'""',position:"absolute",width:8,height:0,borderWidth:1,borderStyle:"solid",borderLeft:0,borderRight:0,borderRadius:3,borderColor:"currentColor"},"&:disabled":{backgroundColor:"muted.1",borderColor:"muted.0",color:"muted.0"},"&:hover":{borderColor:"primary.hover",color:"primary.hover",bg:"secondary.hover"},"&:active":{borderColor:"primary.pressed",color:"primary.pressed"}},"&:disabled":{backgroundColor:"muted.1",borderColor:"muted.0",color:"muted.0"},"&:hover":{borderColor:"text.primary"},"&:active":{backgroundColor:"secondary.base",borderColor:"text.secondary"},":focus:not([data-focus-visible-added])":{outline:"none",boxShadow:"none"},":focus":{outline:"none",boxShadow:"focus"}},B={regular:o({},z,{height:20,width:20,minWidth:20,minHeight:20}),small:o({},z,{height:16,width:16,minWidth:16,minHeight:16})},H={appearance:"none",position:"relative",cursor:"pointer",borderRadius:"6.25rem",backgroundColor:"muted.0",borderStyle:"solid",borderColor:"muted.0",borderWidth:1,"&:after":{content:'""',display:"block",position:"absolute",borderRadius:"1.25rem",backgroundColor:"success.accent",transition:"transform .25s ease"},"&:checked":{backgroundColor:"success.base",borderColor:"success.base","&:hover":{backgroundColor:"success.hover",borderColor:"success.hover"},"&:disabled":{backgroundColor:"muted.0",borderColor:"muted.0","&:after":{backgroundColor:"muted.1"}}},"&:hover":{backgroundColor:"text.secondary",borderColor:"text.secondary"},"&:disabled":{backgroundColor:"muted.0",borderColor:"muted.0","&:after":{backgroundColor:"muted.1"}},":not(:checked):active":{backgroundColor:"text.secondary",borderColor:"text.secondary",":after":{backgroundColor:"secondary.base"}},":focus:not([data-focus-visible-added])":{outline:"none",boxShadow:"none"},":focus":{outline:"none",boxShadow:"focus"}},L={regular:r.merge(H,{height:20,width:36,"&:after":{width:18,height:18},"&:checked":{"&:after":{transform:"translateX(16px)"}}}),small:r.merge(H,{height:16,width:28,"&:after":{width:14,height:14},"&:checked":{"&:after":{transform:"translateX(12px)"}}})},T={paddingTop:24,height:100,resize:"none",fontSettings:"regular",width:"full",borderStyle:"solid",borderWidth:1,paddingLeft:3,paddingRight:4,borderColor:"muted.2",borderRadius:"default",bg:"inherit",marginY:1,fontSize:1,color:"text.primary",outline:0,transition:"snap",":hover":{borderColor:"text.primary"},":focus":{borderColor:"primary.base",boxShadow:"0 0 0 1px "+t.primary.base},":disabled":{bg:"muted.3",borderColor:"muted.0",color:"muted.0"},":focus + label":{transform:"translate(1px, 4px) scale(0.875)"},":placeholder-shown:not(:focus) + label":{paddingTop:1},":not(:placeholder-shown) + label":{transform:"translate(1px, 4px) scale(0.875)"}},E={display:"flex",position:"relative",justifyContent:"flex-start",flexDirection:"column",width:"full"},D={textarea:{borderColor:"danger.base",":focus":{borderColor:"danger.base",boxShadow:"0 0 0 1px "+t.danger.base},":hover":{borderColor:"danger.hover"}}},A={container:o({},E),default:o({},T),"container-error":o({},E,D),"text-container":{display:"flex",justifyContent:"space-between",paddingTop:1},"floating-label":{fontSize:1,left:12,paddingTop:2,color:"muted.0",marginBottom:3,position:"absolute",transform:"translate(0, 16px) scale(1)",transformOrigin:"top left",transition:"all 0.2s ease-out;"}},I={visibility:"hidden",cursor:"pointer",bg:"background",borderRadius:"default",borderWidth:1,borderStyle:"solid",borderColor:"muted.1",boxShadow:"menu",outline:"none",marginTop:1,paddingY:4,width:"max-content",position:"absolute",zIndex:999},j={display:"flex",alignItems:"center",height:24,paddingX:4,cursor:"pointer",bg:"background"},X={menu:I,"menu-visible":o({},I,{visibility:"visible"}),item:j,"item-active":o({},j,{bg:"secondary.base"})},Y={width:106,height:48,appearance:"none","::-webkit-inner-spin-button ":{WebkitAppearance:"none",margin:0},paddingLeft:36,paddingRight:36,textAlign:"center",color:"black",borderStyle:"solid",borderWidth:1,borderColor:"muted.0",borderRadius:"default",backgroundColor:"primary.accent",":hover":{borderColor:"black"},":disabled":{backgroundColor:"muted.3",color:"muted.0"},":focus:not([data-focus-visible-added])":{outline:"none",boxShadow:"none"},":focus":{outline:"none",boxShadow:"focus"}},O={"default-error":o({},Y,{borderColor:"danger.base",":hover":{borderColor:"danger.base"},":focus":{outline:"none",boxShadow:"none"}}),default:Y,container:{position:"relative",display:"flex",alignItems:"center",height:48,width:106,paddingY:12}},M={display:"flex",alignItems:"center",justifyContent:"space-between",cursor:"pointer",height:48,width:"inherit",boxShadow:"0 0 0 0 transparent",borderStyle:"solid",borderWidth:1,paddingLeft:3,paddingRight:4,borderColor:"muted.1",borderRadius:"default",bg:"inherit",fontSize:1,color:"text.secondary",outline:0,":hover":{borderColor:"muted.0"},":hover > svg":{color:"text.primary"},":focus":{borderColor:t.primary.base,boxShadow:"0 0 0 1px "+t.primary.base},":disabled":{bg:"muted.3",borderColor:"muted.0",color:"text.secondary",cursor:"initial"},":disabled > svg":{color:"text.secondary"}},P={position:"absolute",top:"25%",lineHeight:1.5,paddingLeft:3,color:"text.secondary",zIndex:2},V={color:"text.primary",outline:"none",fontSize:1,appearance:"none",backgroundColor:"transparent",border:"1px solid",borderColor:"muted.1",borderRadius:"default",paddingTop:"1.125rem",paddingLeft:3,width:"100%",height:"100%",":focus":{borderColor:"primary.base",boxShadow:"0 0 0 1px "+t.primary.base},":disabled":{bg:"muted.3",borderColor:"muted.0",color:"text.primary",opacity:1},":disabled > svg":{color:"text.secondary"}},q={container:{width:288,position:"relative"},optionsPortal:{position:"absolute",zIndex:999,width:"inherit",backgroundColor:"background",outline:"none"},optionsContainer:{display:"flex",flexDirection:"column",borderWidth:1,borderStyle:"solid",borderColor:"muted.0",borderRadius:"default"},optionsLabel:{text:"small",lineHeight:1.5,paddingTop:2,paddingBottom:1,paddingLeft:3,color:"text.secondary"},optionsUl:{paddingBottom:1,maxHeight:150,width:"inherit",overflowY:"auto",borderBottomLeftRadius:4,borderBottomRightRadius:4},item:{color:"text.primary",verticalAlign:"middle",listStyleType:"none",display:"flex",alignItems:"center",cursor:"pointer"},button:M,buttonError:o({},M,{borderColor:"danger.base",":focus":{borderColor:"danger.base",boxShadow:"0 0 0 1px "+t.danger.base},":hover":{borderColor:"danger.base"}}),selectedItem:{lineHeight:1.43,color:"text.primary",float:"left",marginTop:"1.125rem",":not(:empty) + label":{fontSize:0,lineHeight:1.5}},label:{lineHeight:1.43,position:"absolute",left:12},mobileContainer:{position:"relative",width:288,height:48},mobileLabel:P,mobileLabelSelectedItem:o({},P,{top:2,text:"small"}),mobileSelect:V,mobileSelectError:o({},V,{borderColor:"danger.base",":focus":{borderColor:"danger.base",boxShadow:"0 0 0 1px "+t.danger.base}}),mobileIcon:{position:"absolute",right:12,top:"25%",color:"text.secondary"}},_={display:"flex",flexDirection:"column",bg:"background",marginTop:1,padding:3,minWidth:18,borderRadius:3,borderWidth:1,borderStyle:"solid",borderColor:"muted.1",boxShadow:"menu",hr:{marginY:2,borderStyle:"solid",borderBottomWidth:1,borderTop:"none",borderLeft:"none",borderRight:"none",borderColor:"muted.1",width:"calc(100% -"+i[3]+")",marginX:"-"+i[3],outline:"none"},"> button":{marginY:"2px",paddingX:1,color:"text.primary",fontSize:1,border:"none",textTransform:"initial",":focus":{bg:"secondary.base",outline:"none",boxShadow:"none"},":hover":{color:"text.primary"},width:"full",div:{justifyContent:"flex-start"},svg:{marginLeft:0,marginRight:2}}},G={outline:"none",bg:"background",borderRadius:3,borderColor:"muted.2",borderStyle:"solid",borderWidth:1,position:"relative",overflowY:"auto",overflowX:"hidden",maxHeight:"3/4",margin:2,opacity:0,transform:"translate3d(0, 48px, 0)",transition:"pop","&[data-enter]":{opacity:1,transform:"translate3d(0, 0, 0)"}},U={display:"flex",justifyContent:"space-between",alignItems:"center",borderColor:"muted.2",borderStyle:"solid","button + button":{marginLeft:4},paddingY:4,paddingX:6,borderTopWidth:0,borderLeftWidth:0,borderRightWidth:0,borderBottomWidth:1,h1:{variant:"text.subtitle",lineHeight:0},position:"sticky",top:0,left:0,right:0,bg:"background",zIndex:999},J={display:"flex",justifyContent:"space-between",alignItems:"center",borderColor:"muted.2",borderStyle:"solid",borderBottomWidth:0,borderLeftWidth:0,borderRightWidth:0,position:"sticky",bottom:0,left:0,right:0,bg:"background",padding:6,flexDirection:["column-reverse","column-reverse","row"],">button":{width:["full","full","inherit"]},"* + button":{marginLeft:[0,0,4],marginBottom:[4,4,0]}},K={paddingTop:4,paddingX:6,paddingBottom:6},N=o({},K,{scrollbarWidth:"thin",scrollbarColor:"background","::-webkit-scrollbar":{width:"8px"},"::-webkit-scrollbar-thumb":{backgroundColor:"muted.2",borderRadius:"6px",border:"2px solid",color:"background"}},{overflowY:"auto"}),Q={backdrop:{display:"flex",flexDirection:"column",justifyContent:["flex-end","flex-end","center"],alignItems:"center",backgroundColor:e.rgba(t.text.primary,.5),position:"fixed",top:0,left:0,right:0,bottom:0,zIndex:9999,opacity:0,transition:"fade","&[data-enter]":{opacity:1}},"surface-small":o({},G,{width:["calc(100% - 16px)","calc(100% - 16px)",320]}),"surface-regular":o({},G,{width:["calc(100% - 16px)","calc(100% - 16px)",560]}),"surface-large":o({},G,{width:["calc(100% - 16px)","calc(100% - 16px)",800]}),"header-small":o({},U,{height:56}),"header-regular":o({},U,{height:56}),"header-large":o({},U,{height:80}),"content-with-small-scroll-area":o({},N,{height:"calc(100% - 3.5rem)"}),"content-with-regular-scroll-area":o({},N,{height:"calc(100% - 3.5rem)"}),"content-with-large-scroll-area":o({},N,{height:"calc(100% - 5rem)"}),"content-with-larger-scroll-area":o({},N,{height:"calc(100% - 7rem)"}),"content-with-extra-large-scroll-area":o({},N,{height:"calc(100% - 10rem)"}),content:o({},K),"footer-small":o({},J,{borderTopWidth:0,pt:0,">button":{width:"full"},minHeight:"3.5rem"}),"footer-regular":o({},J,{borderTopWidth:1,minHeight:"3.5rem"}),"footer-large":o({},J,{borderTopWidth:1,minHeight:"5rem"})};function Z(){var e,r,o=(e=["\n 0% {\n background-position: -200px 0;\n }\n 100% {\n background-position: calc(200px + 100%) 0;\n }\n"],r||(r=e.slice(0)),e.raw=r,e);return Z=function(){return o},o}var $={display:"inline-block",width:"full",height:"full",backgroundColor:"muted.3",backgroundSize:"200px 100%",backgroundRepeat:"no-repeat",lineHeight:1,borderRadius:3,backgroundImage:"linear-gradient(\n 90deg,\n "+t.muted[3]+",\n white,\n "+t.muted[3]+"\n )",animation:r.keyframes(Z())+" 1.2s ease-in-out infinite"},ee={display:"flex",alignItems:"center",justifyContent:"center",width:24,height:24,padding:2,borderRadius:"circle",textTransform:"uppercase"};exports.theme=o({},a,{components:{button:s,list:y,table:f,controlGroup:F,toggle:L,checkbox:B,radio:W,abstractInput:k,input:{container:{display:"flex",position:"relative",justifyContent:"flex-start",flexDirection:"column"},"floating-label":{fontSize:1,left:12,paddingTop:2,color:"muted.0",marginBottom:3,position:"absolute",transform:"translate(0, 16px) scale(1)",transformOrigin:"top left",transition:"all 0.2s ease-out;"},"text-container":{display:"flex",justifyContent:"space-between",alignItems:"",paddingTop:1}},tooltip:{backgroundColor:"text.primary",color:"background",fontSize:1,paddingY:2,paddingX:3,borderRadius:3,maxWidth:240,minHeight:32,zIndex:"over"},menu:_,modal:Q,skeleton:{rect:o({},$,{borderRadius:"default"}),circle:o({},$,{borderRadius:"circle"})},divider:c,collapsible:{container:{bg:"background",borderColor:"muted.2",borderStyle:"solid",borderWidth:1,borderRadius:"default"},"container-grouped":{bg:"background",borderRadius:"default"},header:{display:"flex",alignItems:"center",justifyContent:"space-between",padding:6,paddingLeft:2,"div > button:nth-of-type(n+2)":{marginLeft:1}},section:{paddingX:6,paddingBottom:6},"header-nested":{display:"flex",alignItems:"center",justifyContent:"space-between",padding:4,paddingLeft:0,"div > button:nth-of-type(n+2)":{marginLeft:1}},"section-nested":{paddingX:4,paddingBottom:4}},avatar:{base:o({},ee,{bg:"text.primary",color:"background"}),primary:o({},ee,{bg:"primary.base",color:"primary.accent"}),danger:o({},ee,{bg:"danger.base",color:"danger.accent"})},tag:p,anchor:{font:"inherit",color:"primary.base",textDecoration:"none",":active":{color:"primary.pressed",textDecoration:"underline"},":hover":{color:"primary.hover",textDecoration:"underline"}},dropdown:X,textArea:A,numericStepper:O,select:q}});
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var r=require("polished"),e=require("@vtex/admin-ui-system");function o(){return(o=Object.assign||function(r){for(var e=1;e<arguments.length;e++){var o=arguments[e];for(var i in o)Object.prototype.hasOwnProperty.call(o,i)&&(r[i]=o[i])}return r}).apply(this,arguments)}var i={dark:{primary:"#323845",secondary:"#707685"},light:{primary:"#FFFFFF",secondary:"#F4F6FB"},mid:{primary:"#898F9E",secondary:"#C4C5CA",tertiary:"#E0E2E7"},focus:"#8DB6FA",blue:{default:"#2953B2",hover:r.darken(.08,"#2953B2"),pressed:r.darken(.16,"#2953B2"),secondary:{default:"#DAE3F5",hover:r.darken(.04,"#DAE3F5"),pressed:r.darken(.08,"#DAE3F5")}},red:{default:"#CB4242",hover:r.darken(.08,"#CB4242"),pressed:r.darken(.16,"#CB4242"),secondary:{default:"#FEDADA",hover:r.darken(.04,"#FEDADA"),pressed:r.darken(.08,"#FEDADA")}},yellow:{default:"#FFBA52",hover:r.darken(.08,"#FFBA52"),pressed:r.darken(.16,"#FFBA52"),secondary:{default:"#F6E0BA",hover:r.darken(.04,"#F6E0BA"),pressed:r.darken(.08,"#F6E0BA")}},green:{default:"#368369",hover:r.darken(.08,"#368369"),pressed:r.darken(.16,"#368369"),secondary:{default:"#CEE8DE",hover:r.darken(.04,"#CEE8DE"),pressed:r.darken(.08,"#CEE8DE")}}},t={0:"0rem",1:"0.25rem",2:"0.5rem",3:"0.75rem",4:"1rem",5:"1.25rem",6:"1.5rem",7:"1.75rem",8:"2rem",px:"0.0625rem","2px":"0.125rem"},a={sizes:{sm:"20rem",md:"48rem",lg:"56rem",xl:"64rem","1/2":"50%","1/4":"25%","2/4":"50%","3/4":"75%","1/8":"12.5%","2/8":"25%","3/8":"37.5%","4/8":"50%","5/8":"62.5%","6/8":"75%","7/8":"87.5%","1/12":"8.333333%","2/12":"16.666667%","3/12":"25%","4/12":"33.333333%","5/12":"41.666667%","6/12":"50%","7/12":"58.333333%","8/12":"66.666667%","9/12":"75%","10/12":"83.333333%","11/12":"91.666667%",full:"100%",screenHeight:"100vh",screenWidth:"100vw"},colors:i,space:t,breakpoints:["640px","768px","1024px","1280px"],transition:{snap:"all 70ms cubic-bezier(0.2, 0.2, 0.38, 0.9)",fade:"all 110ms cubic-bezier(0.2, 0.2, 0.38, 0.9)",pop:"all 150ms cubic-bezier(0.4, 0.14, 0.3, 1)",callout:"all 240ms cubic-bezier(0.4, 0.14, 0.3, 1)"},fonts:{sans:"VTEXTrustVF, -apple-system, system-ui, BlinkMacSystemFont, sans-serif",mono:'"Dank Mono", "Operator Mono", "Fira Code Retina", "Fira Code", "FiraCode-Retina", "Consolas", "Monaco", "Menlo", monospace'},fontSizes:{0:"0.75rem",1:"0.875rem",2:"1rem",3:"1.125rem",4:"1.25rem"},text:{code:{fontFamily:"mono",lineHeight:"code",fontSize:1,fontFeatureSettings:"'clig' 0, 'calt' 0",fontVariantLigatures:"normal"},small:{fontFamily:"sans",lineHeight:"small",fontSettings:"regular",fontSize:0},body:{fontFamily:"sans",lineHeight:"body",fontSettings:"regular",fontSize:1},highlight:{fontFamily:"sans",lineHeight:"highlight",fontSettings:"regular",fontSize:1},action:{fontFamily:"sans",lineHeight:"action",fontSettings:"regular",fontSize:1,textTransform:"uppercase"},subtitle:{fontFamily:"sans",lineHeight:"subtitle",fontSettings:"regular",fontSize:2},headline:{fontFamily:"sans",lineHeight:"headline",fontSettings:"regular",fontSize:4}},border:{default:{borderWidth:"1px",borderStyle:"solid",borderRadius:"default",borderColor:"mid.tertiary"},"divider-bottom":{borderBottomWidth:"1px",borderBottomStyle:"solid",borderBottomLeftRadius:0,borderBottomRightRadius:0,borderColor:"mid.tertiary"},"divider-top":{borderTopWidth:"1px",borderTopStyle:"solid",borderTopLeftRadius:0,borderTopRightRadius:0,borderColor:"mid.tertiary"}},zIndices:{under:-1,plain:0,over:999,1:1,2:2,3:3,4:4,5:5},fontSettings:{hairline:"'wght' 30",thin:"'wght' 50",light:"'wght' 65",regular:"'wght' 92",medium:"'wght' 120",bold:"'wght' 170",black:"'wght' 200"},lineHeights:{code:1,small:1.125,body:1.25,highlight:1.25,action:1.5,subtitle:1.5,headline:1.5},shadows:{menu:"0rem 0rem 1rem 0rem rgba(0,0,0,0.10)",subtle:"0rem 0rem 1.5rem 0rem rgba(0,0,0,0.05)",focus:"0rem 0rem 0rem "+t["2px"]+" "+i.focus},borderRadius:{default:"4px",flat:"0px",pill:"100px",circle:"100%"}},d={regular:{fontSize:1,height:40,width:"auto",paddingLeft:4,paddingRight:4},"regular-icon":{fontSize:1,height:40,width:40,paddingLeft:1,paddingRight:1,svg:{width:24,minWidth:24,height:24,minHeight:24,margin:1}},"regular-icon-start":{fontSize:1,height:40,width:"auto",paddingLeft:2,paddingRight:3,svg:{width:24,minWidth:24,height:24,minHeight:24,margin:1}},"regular-icon-end":{fontSize:1,height:40,width:"auto",paddingLeft:3,paddingRight:2,svg:{width:24,minWidth:24,height:24,minHeight:24,margin:1}},small:{fontSize:0,height:32,width:"auto",paddingLeft:3,paddingRight:3},"small-icon":{fontSize:0,height:32,width:32,paddingLeft:"2px",paddingRight:"2px",svg:{width:20,minWidth:20,height:20,minHeight:20,margin:1}},"small-icon-start":{fontSize:0,height:32,width:"auto",paddingLeft:2,paddingRight:3,svg:{width:20,minWidth:20,height:20,minHeight:20,margin:1}},"small-icon-end":{fontSize:0,height:32,width:"auto",paddingLeft:3,paddingRight:2,svg:{width:20,minWidth:20,height:20,minHeight:20,margin:1}}},n={primary:{textTransform:"uppercase",color:"light.primary",backgroundColor:"blue",":hover":{backgroundColor:"blue.hover"},":active":{backgroundColor:"blue.pressed"},":disabled":{color:"dark.primary",backgroundColor:"mid.secondary"}},secondary:{textTransform:"uppercase",backgroundColor:"blue.secondary",color:"blue",":hover":{backgroundColor:"blue.secondary.hover"},":active":{backgroundColor:"blue.secondary.pressed"},":disabled":{color:"mid.primary",backgroundColor:"light.secondary"}},tertiary:{textTransform:"capitalize",backgroundColor:"transparent",color:"blue",":hover":{color:"blue.hover",backgroundColor:"blue.secondary.hover"},":active":{color:"blue.pressed",backgroundColor:"blue.secondary.pressed"},":disabled":{color:"mid.primary"}},danger:{textTransform:"uppercase",color:"light.primary",backgroundColor:"red",":hover":{backgroundColor:"red.hover"},":active":{backgroundColor:"red.pressed"},":disabled":{color:"dark.primary",backgroundColor:"mid.secondary"}},"danger-secondary":{textTransform:"uppercase",backgroundColor:"red.secondary",color:"red",":hover":{backgroundColor:"red.secondary.hover",color:"red.hover"},":active":{backgroundColor:"red.secondary.pressed",color:"red.pressed"},":disabled":{color:"mid.primary",backgroundColor:"light.secondary"}},"danger-tertiary":{textTransform:"capitalize",backgroundColor:"transparent",color:"red",":hover":{color:"red.hover",backgroundColor:"red.secondary.hover"},":active":{color:"red.pressed",backgroundColor:"red.secondary.pressed"},":disabled":{color:"mid.primary"}},"adaptative-dark":{color:"currentColor",backgroundColor:"transparent",":hover":{backgroundColor:e.alpha("dark.primary",.04)},":active":{backgroundColor:e.alpha("dark.primary",.08)},":disabled":{color:"mid.primary"}},"adaptative-light":{color:"currentColor",backgroundColor:"transparent",":hover":{backgroundColor:e.alpha("light.primary",.04)},":active":{backgroundColor:e.alpha("light.primary",.08)},":disabled":{color:"mid.primary"}}},l={fontFamily:"sans",fontSettings:"regular",border:"none",borderRadius:"default",cursor:"pointer",position:"relative",":focus:not([data-focus-visible-added])":{outline:"none",boxShadow:"none"},":focus":{outline:"none",boxShadow:"focus"}},s=o({},Object.keys(n).reduce((function(r,e){return o({},r,Object.keys(d).reduce((function(r,i){var t;return o({},r,((t={})[e+"-"+i]=o({},l,n[e],d[i]),t))}),[]))}),{})),g={border:"solid",borderWidth:1,borderColor:"mid.tertiary",margin:0},h={horizontal:o({},g,{borderBottom:0}),vertical:o({},g,{borderLeft:0})},c={display:"inline-flex",alignItems:"center",borderRadius:"100px",color:"dark.primary",border:"none","> svg:nth-of-type(1)":{marginRight:1}},b={blue:{bg:"blue.secondary"},green:{bg:"green.secondary"},red:{bg:"red.secondary"},black:{bg:"dark.primary",color:"light.primary"},yellow:{bg:"yellow.secondary"},purple:{bg:"#E4E0F0"}},p={small:{height:26,paddingX:"2",lineHeight:"small",fontSettings:"'wght' 80",fontSize:0,svg:{width:16,height:16,minWidth:16,minHeight:16},button:{height:16,width:16}},regular:{height:40,paddingX:"4",lineHeight:"subtitle",fontSettings:"regular",fontSize:2,svg:{width:20,minWidth:20,height:20,minHeight:20},button:{height:20,width:20}}},m=o({},Object.keys(b).reduce((function(r,e){return o({},r,Object.keys(p).reduce((function(r,i){var t;return o({},r,((t={})[e+"-"+i]=o({},c,b[e],p[i]),t))}),[]))}),{})),u={table:{display:"table",width:"full"},header:{display:"table-header-group"},body:{display:"table-row-group"},"row-ltr":{display:"table-row",textAlign:"left"},"row-rtl":{display:"table-row",textAlign:"right"},cell:{bg:"light.primary",flex:1,borderBottomWidth:1,borderBottomStyle:"solid",borderBottomColor:"mid.tertiary",display:"table-cell",verticalAlign:"middle",paddingX:2,variant:"text.body"},columnheader:{bg:"light.primary",height:48,display:"table-cell",verticalAlign:"middle",paddingX:2,color:"dark.secondary",fontWeight:"normal",variant:"text.body",flex:1,borderBottomWidth:1,borderBottomStyle:"solid",borderBottomColor:"mid.tertiary"}},f={skeleton:{height:24},image:{regular:{width:56,minWidth:56,height:56,minHeight:56,borderRadius:4},compact:{width:32,minWidth:32,height:32,minHeight:32,borderRadius:4},variable:{minWidth:32,minHeight:32,borderRadius:4}},"image-preview":{small:{width:56,minWidth:56,height:56,minHeight:56,borderRadius:4,boxShadow:"menu"},regular:{width:156,minWidth:156,height:156,minHeight:156,borderRadius:4,boxShadow:"menu"},large:{width:256,minWidth:256,height:256,minHeight:256,borderRadius:4,boxShadow:"menu"}},regular:e.merge(u,{cell:{height:80}}),compact:e.merge(u,{cell:{height:48}}),variable:e.merge(u,{cell:{verticalAlign:"top",minHeight:48,paddingY:4}})},y={display:"flex",width:"full",alignItems:"center",borderBottomWidth:1,borderBottomStyle:"solid",borderBottomColor:"mid.tertiary",justifyContent:"flex-start"},x={compact:o({},y,{height:48,"svg, img":{minHeight:32,maxHeight:32,minWidth:32,maxWidth:32}}),regular:o({},y,{height:80,"svg, img":{minHeight:48,maxHeight:48,minWidth:48,maxWidth:48}}),comfortable:o({},y,{height:128,"svg, img":{minHeight:80,maxHeight:80,minWidth:80,maxWidth:80}})},C={fontSettings:"regular",width:"full",height:48,borderStyle:"solid",borderWidth:1,paddingLeft:3,paddingRight:4,borderColor:"mid.tertiary",borderRadius:"default",bg:"inherit",marginY:1,fontSize:1,color:"dark.primary",outline:0,transition:"snap",":hover":{borderColor:"dark.primary"},":focus":{borderColor:"blue",boxShadow:"0 0 0 1px "+i.blue.default},":disabled":{bg:"light.secondary",borderColor:"mid.primary",color:"mid.primary"},":focus + label":{transform:"translate(1px, 4px) scale(0.875)"},":placeholder-shown:not(:focus) + label":{paddingTop:1},":not(:placeholder-shown) + label":{transform:"translate(1px, 4px) scale(0.875)"}},v={borderColor:"red",":focus":{borderColor:"red",boxShadow:"0 0 0 1px "+i.red.default},":hover":{borderColor:"red.hover"}};function k(r,o){var i;return void 0===o&&(o={}),(i={})[""+r]=e.merge(C,o),i[r+"-icon"]=e.merge(C,o,{paddingLeft:44}),i[r+"-suffix"]=e.merge(C,o,{paddingRight:"64px"}),i[r+"-clear"]=e.merge(C,o,{paddingRight:"44px"}),i[r+"-icon-clear"]=e.merge(C,o,{paddingLeft:"44px",paddingRight:"44px"}),i[r+"-icon-suffix"]=e.merge(C,o,{paddingRight:"64px",paddingLeft:"44px"}),i[r+"-suffix-clear"]=e.merge(C,o,{paddingRight:"75px"}),i[r+"-icon-suffix-clear"]=e.merge(C,o,{paddingLeft:"44px",paddingRight:"75px"}),i}var w=o({container:{position:"relative"},"container-icon":{position:"relative",label:{left:"44px"}},suffix:{color:"mid.primary",borderLeftStyle:"solid",borderLeftWidth:"1px",borderLeftColor:"mid.tertiary",paddingTop:"14px",marginTop:"px",width:"32px",paddingLeft:3,lineHeight:"body",fontSettings:"regular",fontSize:1},icon:{color:"mid.primary",top:1,left:0,marginX:3,marginTop:"14px",position:"absolute",height:20,width:20,minWidth:20,minHeight:20},buttons:{right:0,top:1,height:46,paddingRight:3,position:"absolute",display:"flex",color:"dark.secondary"}},k("input"),k("input-error",v)),S={fontSettings:"regular",lh:"highlight",marginTop:3,marginBottom:6,display:"flex",alignItems:"flex-start","& > label > input":{marginRight:2,marginLeft:0},"& > label":{cursor:"pointer",color:"dark.secondary",display:"flex",alignItems:"center"}},R={"horizontal-regular":o({},S,{fontSize:"2",flexDirection:"row","& label:not(:last-child)":{marginRight:6}}),"horizontal-small":o({},S,{fontSize:"1",flexDirection:"row","& label:not(:last-child)":{marginRight:5}}),"vertical-regular":o({},S,{fontSize:"2",flexDirection:"column","& label:not(:last-child)":{marginBottom:4}}),"vertical-small":o({},S,{fontSize:"1",flexDirection:"column","& label:not(:last-child)":{marginBottom:4}})},W={appearance:"none",margin:0,position:"relative",cursor:"pointer",borderStyle:"solid",borderWidth:"1px",borderColor:"mid.secondary",backgroundColor:"transparent",borderRadius:"circle",":after":{content:'""',display:"block",borderRadius:"circle",backgroundColor:"light.primary",opacity:0},":checked":{backgroundColor:"blue",borderColor:"blue",":after":{opacity:1},":hover":{backgroundColor:"blue.hover",borderColor:"blue.hover"},":active":{borderColor:"blue.pressed",backgroundColor:"blue.pressed"}},":disabled":{cursor:"not-allowed",backgroundColor:"mid.tertiary",borderColor:"mid.primary",":after":{backgroundColor:"mid.primary"}},":hover":{borderColor:"dark.primary"},":active":{borderColor:"dark.secondary",backgroundColor:"blue.secondary"},":focus:not([data-focus-visible-added])":{outline:"none",boxShadow:"none"},":focus":{outline:"none",boxShadow:"focus"}},z={regular:e.merge(W,{height:20,width:20,padding:"5px",":after":{width:8,height:8}}),small:e.merge(W,{height:16,width:16,padding:1,":after":{width:6,height:6}})},H={appearance:"none",borderStyle:"solid",borderWidth:1,borderColor:"mid.primary",borderRadius:3,cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center","&:checked":{backgroundColor:"blue",borderColor:"blue","&:after":{content:"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8' width='10' height='8' fill='none'><path d='M9 1L4 7L1 4' stroke='%23FFFFFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'></path></svg>\")"},"&[disabled]:after":{content:"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8' width='10' height='8' fill='none'><path d='M9 1L4 7L1 4' stroke='%23898F9E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'></path></svg>\")"},"&:hover":{backgroundColor:"blue.hover",borderColor:"blue.hover"},"&:active":{backgroundColor:"blue.pressed",borderColor:"blue.pressed"}},"&:indeterminate":{backgroundColor:"blue.secondary",borderColor:"blue",color:"blue","&:after":{content:'""',position:"absolute",width:8,height:0,borderWidth:1,borderStyle:"solid",borderLeft:0,borderRight:0,borderRadius:3,borderColor:"currentColor"},"&:disabled":{backgroundColor:"mid.secondary",borderColor:"mid.primary",color:"mid.primary"},"&:hover":{borderColor:"blue.hover",color:"blue.hover",bg:"blue.secondary.hover"},"&:active":{borderColor:"blue.pressed",color:"blue.pressed"}},"&:disabled":{backgroundColor:"mid.secondary",borderColor:"mid.primary",color:"mid.primary"},"&:hover":{borderColor:"dark.primary"},"&:active":{backgroundColor:"blue.secondary",borderColor:"dark.secondary"},":focus:not([data-focus-visible-added])":{outline:"none",boxShadow:"none"},":focus":{outline:"none",boxShadow:"focus"}},F={regular:o({},H,{height:20,width:20,minWidth:20,minHeight:20}),small:o({},H,{height:16,width:16,minWidth:16,minHeight:16})},B={appearance:"none",position:"relative",cursor:"pointer",borderRadius:"6.25rem",backgroundColor:"mid.primary",borderStyle:"solid",borderColor:"mid.primary",borderWidth:1,"&:after":{content:'""',display:"block",position:"absolute",borderRadius:"1.25rem",backgroundColor:"light.primary",transition:"transform .25s ease"},"&:checked":{backgroundColor:"green",borderColor:"green","&:hover":{backgroundColor:"green.hover",borderColor:"green.hover"},"&:disabled":{backgroundColor:"mid.primary",borderColor:"mid.primary","&:after":{backgroundColor:"mid.secondary"}}},"&:hover":{backgroundColor:"dark.secondary",borderColor:"dark.secondary"},"&:disabled":{backgroundColor:"mid.primary",borderColor:"mid.primary","&:after":{backgroundColor:"mid.secondary"}},":not(:checked):active":{backgroundColor:"dark.secondary",borderColor:"dark.secondary",":after":{backgroundColor:"blue.secondary"}},":focus:not([data-focus-visible-added])":{outline:"none",boxShadow:"none"},":focus":{outline:"none",boxShadow:"focus"}},L={regular:e.merge(B,{height:20,width:36,"&:after":{width:18,height:18},"&:checked":{"&:after":{transform:"translateX(16px)"}}}),small:e.merge(B,{height:16,width:28,"&:after":{width:14,height:14},"&:checked":{"&:after":{transform:"translateX(12px)"}}})},T={paddingTop:24,height:100,resize:"none",fontSettings:"regular",width:"full",borderStyle:"solid",borderWidth:1,paddingLeft:3,paddingRight:4,borderColor:"mid.tertiary",borderRadius:"default",bg:"inherit",marginY:1,fontSize:1,color:"dark.primary",outline:0,transition:"snap",":hover":{borderColor:"dark.primary"},":focus":{borderColor:"blue",boxShadow:"0 0 0 1px "+i.blue.default},":disabled":{bg:"light.secondary",borderColor:"mid.primary",color:"mid.primary"},":focus + label":{transform:"translate(1px, 4px) scale(0.875)"},":placeholder-shown:not(:focus) + label":{paddingTop:1},":not(:placeholder-shown) + label":{transform:"translate(1px, 4px) scale(0.875)"}},E={display:"flex",position:"relative",justifyContent:"flex-start",flexDirection:"column",width:"full"},I={textarea:{borderColor:"red",":focus":{borderColor:"red",boxShadow:"0 0 0 1px "+i.red.default},":hover":{borderColor:"red.hover"}}},D={container:o({},E),default:o({},T),"container-error":o({},E,I),"text-container":{display:"flex",justifyContent:"space-between",paddingTop:1},"floating-label":{fontSize:1,left:12,paddingTop:2,color:"mid.primary",marginBottom:3,position:"absolute",transform:"translate(0, 16px) scale(1)",transformOrigin:"top left",transition:"all 0.2s ease-out;"}},A={visibility:"hidden",cursor:"pointer",bg:"light.primary",borderRadius:"default",borderWidth:1,borderStyle:"solid",borderColor:"mid.secondary",boxShadow:"menu",outline:"none",marginTop:1,paddingY:4,width:"max-content",position:"absolute",zIndex:999},j={display:"flex",alignItems:"center",height:24,paddingX:4,cursor:"pointer",bg:"light.primary"},X={menu:A,"menu-visible":o({},A,{visibility:"visible"}),item:j,"item-active":o({},j,{bg:"blue.secondary"})},Y={width:106,height:48,appearance:"none","::-webkit-inner-spin-button ":{WebkitAppearance:"none",margin:0},paddingLeft:36,paddingRight:36,textAlign:"center",color:"dark.primary",borderStyle:"solid",borderWidth:1,borderColor:"mid.primary",borderRadius:"default",backgroundColor:"light.primary",":hover":{borderColor:"dark.primary"},":disabled":{backgroundColor:"light.secondary",color:"mid.primary"},":focus:not([data-focus-visible-added])":{outline:"none",boxShadow:"none"},":focus":{outline:"none",boxShadow:"focus"}},O={"default-error":o({},Y,{borderColor:"red",":hover":{borderColor:"red"},":focus":{outline:"none",boxShadow:"none"}}),default:Y,container:{position:"relative",display:"flex",alignItems:"center",height:48,width:106,paddingY:12}},M={display:"flex",alignItems:"center",justifyContent:"space-between",cursor:"pointer",height:48,width:"inherit",boxShadow:"0 0 0 0 transparent",borderStyle:"solid",borderWidth:1,paddingLeft:3,paddingRight:4,borderColor:"mid.secondary",borderRadius:"default",bg:"inherit",fontSize:1,color:"dark.secondary",outline:0,":hover":{borderColor:"mid.primary"},":hover > svg":{color:"dark.primary"},":focus":{borderColor:i.blue.default,boxShadow:"0 0 0 1px "+i.blue.default},":disabled":{bg:"light.secondary",borderColor:"mid.primary",color:"dark.secondary",cursor:"initial"},":disabled > svg":{color:"dark.secondary"}},P={position:"absolute",top:"25%",lineHeight:1.5,paddingLeft:3,color:"dark.secondary",zIndex:2},V={color:"dark.primary",outline:"none",fontSize:1,appearance:"none",backgroundColor:"transparent",border:"1px solid",borderColor:"mid.secondary",borderRadius:"default",paddingTop:"1.125rem",paddingLeft:3,width:"100%",height:"100%",":focus":{borderColor:"blue",boxShadow:"0 0 0 1px "+i.blue.default},":disabled":{bg:"light.secondary",borderColor:"mid.primary",color:"dark.primary",opacity:1},":disabled > svg":{color:"dark.secondary"}},q={container:{width:288,position:"relative"},optionsPortal:{position:"absolute",zIndex:999,width:"inherit",backgroundColor:"light.primary",outline:"none"},optionsContainer:{display:"flex",flexDirection:"column",borderWidth:1,borderStyle:"solid",borderColor:"mid.primary",borderRadius:"default"},optionsLabel:{text:"small",lineHeight:1.5,paddingTop:2,paddingBottom:1,paddingLeft:3,color:"mid.primary"},optionsUl:{paddingBottom:1,maxHeight:150,width:"inherit",overflowY:"auto",borderBottomLeftRadius:4,borderBottomRightRadius:4},item:{color:"dark.primary",verticalAlign:"middle",listStyleType:"none",display:"flex",alignItems:"center",cursor:"pointer"},button:M,buttonError:o({},M,{borderColor:"red",":focus":{borderColor:"red",boxShadow:"0 0 0 1px "+i.red.default},":hover":{borderColor:"red"}}),selectedItem:{lineHeight:1.43,color:"dark.primary",float:"left",marginTop:"1.125rem",":not(:empty) + label":{fontSize:0,lineHeight:1.5}},label:{lineHeight:1.43,position:"absolute",left:12},mobileContainer:{position:"relative",width:288,height:48},mobileLabel:P,mobileLabelSelectedItem:o({},P,{top:2,text:"small"}),mobileSelect:V,mobileSelectError:o({},V,{borderColor:"red",":focus":{borderColor:"red",boxShadow:"0 0 0 1px "+i.red.default}}),mobileIcon:{position:"absolute",right:12,top:"25%",color:"dark.secondary"}},_={display:"flex",flexDirection:"column",bg:"light.primary",marginTop:1,padding:3,minWidth:18,borderRadius:3,borderWidth:1,borderStyle:"solid",borderColor:"mid.secondary",boxShadow:"menu",hr:{marginY:2,borderStyle:"solid",borderBottomWidth:1,borderTop:"none",borderLeft:"none",borderRight:"none",borderColor:"mid.secondary",width:"calc(100% -"+t[3]+")",marginX:"-"+t[3],outline:"none"},"> button":{marginY:"2px",paddingX:1,color:"dark.primary",fontSize:1,border:"none",textTransform:"initial",":focus":{bg:"blue.secondary",outline:"none",boxShadow:"none"},":hover":{color:"dark.primary"},width:"full",div:{justifyContent:"flex-start"},svg:{marginLeft:0,marginRight:2}}},G={outline:"none",bg:"light.primary",borderRadius:3,borderColor:"mid.tertiary",borderStyle:"solid",borderWidth:1,position:"relative",overflowY:"auto",overflowX:"hidden",maxHeight:"3/4",margin:2,opacity:0,transform:"translate3d(0, 48px, 0)",transition:"pop","&[data-enter]":{opacity:1,transform:"translate3d(0, 0, 0)"}},U={display:"flex",justifyContent:"space-between",alignItems:"center",borderColor:"mid.tertiary",borderStyle:"solid","button + button":{marginLeft:4},paddingY:4,paddingX:6,borderTopWidth:0,borderLeftWidth:0,borderRightWidth:0,borderBottomWidth:1,h1:{variant:"text.subtitle",lineHeight:0},position:"sticky",top:0,left:0,right:0,bg:"light.primary",zIndex:999},J={display:"flex",justifyContent:"space-between",alignItems:"center",borderColor:"mid.tertiary",borderStyle:"solid",borderBottomWidth:0,borderLeftWidth:0,borderRightWidth:0,position:"sticky",bottom:0,left:0,right:0,bg:"light.primary",padding:6,flexDirection:["column-reverse","column-reverse","row"],">button":{width:["full","full","inherit"]},"* + button":{marginLeft:[0,0,4],marginBottom:[4,4,0]}},K={paddingTop:4,paddingX:6,paddingBottom:6},N=o({},K,{scrollbarWidth:"thin",scrollbarColor:"light.primary","::-webkit-scrollbar":{width:"8px"},"::-webkit-scrollbar-thumb":{backgroundColor:"mid.tertiary",borderRadius:"6px",border:"2px solid",color:"light.primary"}},{overflowY:"auto"}),Q={backdrop:{display:"flex",flexDirection:"column",justifyContent:["flex-end","flex-end","center"],alignItems:"center",backgroundColor:r.rgba(i.dark.primary,.5),position:"fixed",top:0,left:0,right:0,bottom:0,zIndex:9999,opacity:0,transition:"fade","&[data-enter]":{opacity:1}},"surface-small":o({},G,{width:["calc(100% - 16px)","calc(100% - 16px)",320]}),"surface-regular":o({},G,{width:["calc(100% - 16px)","calc(100% - 16px)",560]}),"surface-large":o({},G,{width:["calc(100% - 16px)","calc(100% - 16px)",800]}),"header-small":o({},U,{height:56}),"header-regular":o({},U,{height:56}),"header-large":o({},U,{height:80}),"content-with-small-scroll-area":o({},N,{height:"calc(100% - 3.5rem)"}),"content-with-regular-scroll-area":o({},N,{height:"calc(100% - 3.5rem)"}),"content-with-large-scroll-area":o({},N,{height:"calc(100% - 5rem)"}),"content-with-larger-scroll-area":o({},N,{height:"calc(100% - 7rem)"}),"content-with-extra-large-scroll-area":o({},N,{height:"calc(100% - 10rem)"}),content:o({},K),"footer-small":o({},J,{borderTopWidth:0,pt:0,">button":{width:"full"},minHeight:"3.5rem"}),"footer-regular":o({},J,{borderTopWidth:1,minHeight:"3.5rem"}),"footer-large":o({},J,{borderTopWidth:1,minHeight:"5rem"})};function Z(){var r,e,o=(r=["\n 0% {\n background-position: -200px 0;\n }\n 100% {\n background-position: calc(200px + 100%) 0;\n }\n"],e||(e=r.slice(0)),r.raw=e,r);return Z=function(){return o},o}var $={display:"inline-block",width:"full",height:"full",backgroundColor:"light.secondary",backgroundSize:"200px 100%",backgroundRepeat:"no-repeat",lineHeight:1,borderRadius:3,backgroundImage:"linear-gradient(\n 90deg,\n "+i.light.secondary+",\n white,\n "+i.light.secondary+"\n )",animation:e.keyframes(Z())+" 1.2s ease-in-out infinite"},rr={display:"flex",alignItems:"center",justifyContent:"center",width:24,height:24,padding:2,borderRadius:"circle",textTransform:"uppercase"};exports.theme=o({},a,{components:{button:s,list:x,table:f,controlGroup:R,toggle:L,checkbox:F,radio:z,abstractInput:w,input:{container:{display:"flex",position:"relative",justifyContent:"flex-start",flexDirection:"column"},"floating-label":{fontSize:1,left:12,paddingTop:2,color:"mid.primary",marginBottom:3,position:"absolute",transform:"translate(0, 16px) scale(1)",transformOrigin:"top left",transition:"all 0.2s ease-out;"},"text-container":{display:"flex",justifyContent:"space-between",alignItems:"",paddingTop:1}},tooltip:{backgroundColor:"dark.primary",color:"light.primary",fontSize:1,paddingY:2,paddingX:3,borderRadius:3,maxWidth:240,minHeight:32,zIndex:"over"},menu:_,modal:Q,skeleton:{rect:o({},$,{borderRadius:"default"}),circle:o({},$,{borderRadius:"circle"})},divider:h,collapsible:{container:{bg:"light.primary",borderColor:"mid.tertiary",borderStyle:"solid",borderWidth:1,borderRadius:"default"},"container-grouped":{bg:"light.primary",borderRadius:"default"},header:{display:"flex",alignItems:"center",justifyContent:"space-between",padding:6,paddingLeft:2,"div > button:nth-of-type(n+2)":{marginLeft:1}},section:{paddingX:6,paddingBottom:6},"header-nested":{display:"flex",alignItems:"center",justifyContent:"space-between",padding:4,paddingLeft:0,"div > button:nth-of-type(n+2)":{marginLeft:1}},"section-nested":{paddingX:4,paddingBottom:4}},avatar:{base:o({},rr,{bg:"dark.primary",color:"light.primary"}),primary:o({},rr,{bg:"blue",color:"light.primary"}),danger:o({},rr,{bg:"red",color:"light.primary"})},tag:m,anchor:{font:"inherit",color:"blue",textDecoration:"none",":active":{color:"blue.pressed",textDecoration:"underline"},":hover":{color:"blue.hover",textDecoration:"underline"}},dropdown:X,textArea:D,numericStepper:O,select:q}});
//# sourceMappingURL=admin-ui-theme.cjs.production.min.js.map

573

dist/admin-ui-theme.esm.js

@@ -31,79 +31,70 @@ import { darken, rgba } from 'polished';

var elementaryColors = {
white: '#FFFFFF',
blue: '#DAE3F5',
purple: '#F4EFFF',
yellow: '#FDE6C0',
green: '#D6EFE5',
red: '#FEE3E3',
black: '#323845'
};
var semanticColors = {
primary: '#2953B2',
secondary: '#DAE3F5',
danger: '#CB4242',
dangerWashed: '#FEDADA',
warning: '#FFBA52',
warningWashed: '#F6E0BA',
success: '#368369',
successWashed: '#CEE8DE'
blue: '#2953B2',
blueSecondary: '#DAE3F5',
red: '#CB4242',
redSecondary: '#FEDADA',
yellow: '#FFBA52',
yellowSecondary: '#F6E0BA',
green: '#368369',
greenSecondary: '#CEE8DE',
black: '#323845',
white: '#FFFFFF'
};
var colors = /*#__PURE__*/_extends({}, elementaryColors, {
text: {
primary: '#323845',
var colors = {
dark: {
primary: semanticColors.black,
secondary: '#707685'
},
background: '#FFFFFF',
brand: '#F71963',
muted: ['#898F9E', '#C4C5CA', '#E0E2E7', '#F4F6FB'],
focus: '#8DB6FA',
primary: {
base: semanticColors.primary,
hover: /*#__PURE__*/darken(0.08, semanticColors.primary),
pressed: /*#__PURE__*/darken(0.16, semanticColors.primary),
accent: '#FFFFFF'
light: {
primary: semanticColors.white,
secondary: '#F4F6FB'
},
secondary: {
base: semanticColors.secondary,
hover: /*#__PURE__*/darken(0.04, semanticColors.secondary),
pressed: /*#__PURE__*/darken(0.08, semanticColors.secondary),
accent: semanticColors.primary
mid: {
primary: '#898F9E',
secondary: '#C4C5CA',
tertiary: '#E0E2E7'
},
danger: {
base: semanticColors.danger,
hover: /*#__PURE__*/darken(0.08, semanticColors.danger),
pressed: /*#__PURE__*/darken(0.16, semanticColors.danger),
accent: '#FFFFFF',
washed: {
base: semanticColors.dangerWashed,
hover: /*#__PURE__*/darken(0.04, semanticColors.dangerWashed),
pressed: /*#__PURE__*/darken(0.08, semanticColors.dangerWashed),
accent: semanticColors.danger
focus: '#8DB6FA',
blue: {
"default": semanticColors.blue,
hover: /*#__PURE__*/darken(0.08, semanticColors.blue),
pressed: /*#__PURE__*/darken(0.16, semanticColors.blue),
secondary: {
"default": semanticColors.blueSecondary,
hover: /*#__PURE__*/darken(0.04, semanticColors.blueSecondary),
pressed: /*#__PURE__*/darken(0.08, semanticColors.blueSecondary)
}
},
warning: {
base: semanticColors.warning,
hover: /*#__PURE__*/darken(0.08, semanticColors.warning),
pressed: /*#__PURE__*/darken(0.16, semanticColors.warning),
accent: '#FFFFFF',
washed: {
base: semanticColors.warningWashed,
hover: /*#__PURE__*/darken(0.04, semanticColors.warningWashed),
pressed: /*#__PURE__*/darken(0.08, semanticColors.warningWashed),
accent: semanticColors.warning
red: {
"default": semanticColors.red,
hover: /*#__PURE__*/darken(0.08, semanticColors.red),
pressed: /*#__PURE__*/darken(0.16, semanticColors.red),
secondary: {
"default": semanticColors.redSecondary,
hover: /*#__PURE__*/darken(0.04, semanticColors.redSecondary),
pressed: /*#__PURE__*/darken(0.08, semanticColors.redSecondary)
}
},
success: {
base: semanticColors.success,
hover: /*#__PURE__*/darken(0.08, semanticColors.success),
pressed: /*#__PURE__*/darken(0.16, semanticColors.success),
accent: '#FFFFFF',
washed: {
base: semanticColors.successWashed,
hover: /*#__PURE__*/darken(0.04, semanticColors.successWashed),
pressed: /*#__PURE__*/darken(0.08, semanticColors.successWashed),
accent: semanticColors.success
yellow: {
"default": semanticColors.yellow,
hover: /*#__PURE__*/darken(0.08, semanticColors.yellow),
pressed: /*#__PURE__*/darken(0.16, semanticColors.yellow),
secondary: {
"default": semanticColors.yellowSecondary,
hover: /*#__PURE__*/darken(0.04, semanticColors.yellowSecondary),
pressed: /*#__PURE__*/darken(0.08, semanticColors.yellowSecondary)
}
},
green: {
"default": semanticColors.green,
hover: /*#__PURE__*/darken(0.08, semanticColors.green),
pressed: /*#__PURE__*/darken(0.16, semanticColors.green),
secondary: {
"default": semanticColors.greenSecondary,
hover: /*#__PURE__*/darken(0.04, semanticColors.greenSecondary),
pressed: /*#__PURE__*/darken(0.08, semanticColors.greenSecondary)
}
}
});
};

@@ -229,3 +220,3 @@ var space = {

borderRadius: 'default',
borderColor: 'muted.2'
borderColor: 'mid.tertiary'
},

@@ -237,3 +228,3 @@ 'divider-bottom': {

borderBottomRightRadius: 0,
borderColor: 'muted.2'
borderColor: 'mid.tertiary'
},

@@ -245,3 +236,3 @@ 'divider-top': {

borderTopRightRadius: 0,
borderColor: 'muted.2'
borderColor: 'mid.tertiary'
}

@@ -393,13 +384,13 @@ },

textTransform: 'uppercase',
color: 'primary.accent',
backgroundColor: 'primary.base',
color: 'light.primary',
backgroundColor: 'blue',
':hover': {
backgroundColor: 'primary.hover'
backgroundColor: 'blue.hover'
},
':active': {
backgroundColor: 'primary.pressed'
backgroundColor: 'blue.pressed'
},
':disabled': {
color: 'text.primary',
backgroundColor: 'muted.1'
color: 'dark.primary',
backgroundColor: 'mid.secondary'
}

@@ -409,13 +400,13 @@ },

textTransform: 'uppercase',
backgroundColor: 'secondary.base',
color: 'secondary.accent',
backgroundColor: 'blue.secondary',
color: 'blue',
':hover': {
backgroundColor: 'secondary.hover'
backgroundColor: 'blue.secondary.hover'
},
':active': {
backgroundColor: 'secondary.pressed'
backgroundColor: 'blue.secondary.pressed'
},
':disabled': {
color: 'muted.0',
backgroundColor: 'muted.3'
color: 'mid.primary',
backgroundColor: 'light.secondary'
}

@@ -426,13 +417,13 @@ },

backgroundColor: 'transparent',
color: 'primary.base',
color: 'blue',
':hover': {
color: 'primary.hover',
backgroundColor: 'secondary.hover'
color: 'blue.hover',
backgroundColor: 'blue.secondary.hover'
},
':active': {
color: 'primary.pressed',
backgroundColor: 'secondary.pressed'
color: 'blue.pressed',
backgroundColor: 'blue.secondary.pressed'
},
':disabled': {
color: 'muted.0'
color: 'mid.primary'
}

@@ -442,13 +433,13 @@ },

textTransform: 'uppercase',
color: 'danger.accent',
backgroundColor: 'danger.base',
color: 'light.primary',
backgroundColor: 'red',
':hover': {
backgroundColor: 'danger.hover'
backgroundColor: 'red.hover'
},
':active': {
backgroundColor: 'danger.pressed'
backgroundColor: 'red.pressed'
},
':disabled': {
color: 'text.primary',
backgroundColor: 'muted.1'
color: 'dark.primary',
backgroundColor: 'mid.secondary'
}

@@ -458,15 +449,15 @@ },

textTransform: 'uppercase',
backgroundColor: 'danger.washed.base',
color: 'danger.base',
backgroundColor: 'red.secondary',
color: 'red',
':hover': {
backgroundColor: 'danger.washed.hover',
color: 'danger.hover'
backgroundColor: 'red.secondary.hover',
color: 'red.hover'
},
':active': {
backgroundColor: 'danger.washed.pressed',
color: 'danger.pressed'
backgroundColor: 'red.secondary.pressed',
color: 'red.pressed'
},
':disabled': {
color: 'muted.0',
backgroundColor: 'muted.3'
color: 'mid.primary',
backgroundColor: 'light.secondary'
}

@@ -477,13 +468,13 @@ },

backgroundColor: 'transparent',
color: 'danger.washed.accent',
color: 'red',
':hover': {
color: 'danger.hover',
backgroundColor: 'danger.washed.hover'
color: 'red.hover',
backgroundColor: 'red.secondary.hover'
},
':active': {
color: 'danger.pressed',
backgroundColor: 'danger.washed.pressed'
color: 'red.pressed',
backgroundColor: 'red.secondary.pressed'
},
':disabled': {
color: 'muted.0'
color: 'mid.primary'
}

@@ -495,9 +486,9 @@ },

':hover': {
backgroundColor: /*#__PURE__*/alpha('text.primary', 0.04)
backgroundColor: /*#__PURE__*/alpha('dark.primary', 0.04)
},
':active': {
backgroundColor: /*#__PURE__*/alpha('text.primary', 0.08)
backgroundColor: /*#__PURE__*/alpha('dark.primary', 0.08)
},
':disabled': {
color: 'muted.0'
color: 'mid.primary'
}

@@ -509,9 +500,9 @@ },

':hover': {
backgroundColor: /*#__PURE__*/alpha('background', 0.04)
backgroundColor: /*#__PURE__*/alpha('light.primary', 0.04)
},
':active': {
backgroundColor: /*#__PURE__*/alpha('background', 0.08)
backgroundColor: /*#__PURE__*/alpha('light.primary', 0.08)
},
':disabled': {
color: 'muted.0'
color: 'mid.primary'
}

@@ -547,3 +538,3 @@ }

borderWidth: 1,
borderColor: 'muted.2',
borderColor: 'mid.tertiary',
margin: 0

@@ -565,3 +556,3 @@ };

borderRadius: '100px',
color: 'text.primary',
color: 'dark.primary',
border: 'none',

@@ -574,19 +565,19 @@ '> svg:nth-of-type(1)': {

blue: {
bg: 'blue'
bg: 'blue.secondary'
},
green: {
bg: 'green'
bg: 'green.secondary'
},
red: {
bg: 'red'
bg: 'red.secondary'
},
black: {
bg: 'black',
color: 'white'
bg: 'dark.primary',
color: 'light.primary'
},
yellow: {
bg: 'yellow'
bg: 'yellow.secondary'
},
purple: {
bg: 'purple'
bg: '#E4E0F0'
}

@@ -640,10 +631,10 @@ };

font: 'inherit',
color: 'primary.base',
color: 'blue',
textDecoration: 'none',
':active': {
color: 'primary.pressed',
color: 'blue.pressed',
textDecoration: 'underline'
},
':hover': {
color: 'primary.hover',
color: 'blue.hover',
textDecoration: 'underline'

@@ -673,7 +664,7 @@ }

cell: {
bg: 'background',
bg: 'light.primary',
flex: 1,
borderBottomWidth: 1,
borderBottomStyle: 'solid',
borderBottomColor: 'muted.2',
borderBottomColor: 'mid.tertiary',
display: 'table-cell',

@@ -685,3 +676,3 @@ verticalAlign: 'middle',

columnheader: {
bg: 'background',
bg: 'light.primary',
height: 48,

@@ -691,3 +682,3 @@ display: 'table-cell',

paddingX: 2,
color: 'text.secondary',
color: 'dark.secondary',
fontWeight: 'normal',

@@ -698,3 +689,3 @@ variant: 'text.body',

borderBottomStyle: 'solid',
borderBottomColor: 'muted.2'
borderBottomColor: 'mid.tertiary'
}

@@ -778,3 +769,3 @@ };

borderBottomStyle: 'solid',
borderBottomColor: 'muted.2',
borderBottomColor: 'mid.tertiary',
justifyContent: 'flex-start'

@@ -820,3 +811,3 @@ };

paddingRight: 4,
borderColor: 'muted.2',
borderColor: 'mid.tertiary',
borderRadius: 'default',

@@ -826,16 +817,16 @@ bg: 'inherit',

fontSize: 1,
color: 'text.primary',
color: 'dark.primary',
outline: 0,
transition: 'snap',
':hover': {
borderColor: 'text.primary'
borderColor: 'dark.primary'
},
':focus': {
borderColor: 'primary.base',
boxShadow: "0 0 0 1px " + colors.primary.base
borderColor: 'blue',
boxShadow: "0 0 0 1px " + colors.blue["default"]
},
':disabled': {
bg: 'muted.3',
borderColor: 'muted.0',
color: 'muted.0'
bg: 'light.secondary',
borderColor: 'mid.primary',
color: 'mid.primary'
},

@@ -853,9 +844,9 @@ ':focus + label': {

var errorState = {
borderColor: 'danger.base',
borderColor: 'red',
':focus': {
borderColor: 'danger.base',
boxShadow: "0 0 0 1px " + colors.danger.base
borderColor: 'red',
boxShadow: "0 0 0 1px " + colors.red["default"]
},
':hover': {
borderColor: 'danger.hover'
borderColor: 'red.hover'
}

@@ -904,6 +895,6 @@ };

suffix: {
color: 'muted.0',
color: 'mid.primary',
borderLeftStyle: 'solid',
borderLeftWidth: '1px',
borderLeftColor: 'muted.2',
borderLeftColor: 'mid.tertiary',
paddingTop: '14px',

@@ -919,3 +910,3 @@ marginTop: 'px',

icon: {
color: 'muted.0',
color: 'mid.primary',
top: 1,

@@ -939,3 +930,3 @@ left: 0,

display: 'flex',
color: 'text.secondary'
color: 'dark.secondary'
}

@@ -957,3 +948,3 @@ }, /*#__PURE__*/getInputVariants('input'), /*#__PURE__*/getInputVariants('input-error', errorState));

cursor: 'pointer',
color: 'text.secondary',
color: 'dark.secondary',
display: 'flex',

@@ -1001,3 +992,3 @@ alignItems: 'center'

borderWidth: '1px',
borderColor: 'muted.1',
borderColor: 'mid.secondary',
backgroundColor: 'transparent',

@@ -1009,8 +1000,8 @@ borderRadius: 'circle',

borderRadius: 'circle',
backgroundColor: 'white',
backgroundColor: 'light.primary',
opacity: 0
},
':checked': {
backgroundColor: 'primary.base',
borderColor: 'primary.base',
backgroundColor: 'blue',
borderColor: 'blue',
':after': {

@@ -1020,8 +1011,8 @@ opacity: 1

':hover': {
backgroundColor: 'primary.hover',
borderColor: 'primary.hover'
backgroundColor: 'blue.hover',
borderColor: 'blue.hover'
},
':active': {
borderColor: 'primary.pressed',
backgroundColor: 'primary.pressed'
borderColor: 'blue.pressed',
backgroundColor: 'blue.pressed'
}

@@ -1031,14 +1022,14 @@ },

cursor: 'not-allowed',
backgroundColor: 'muted.2',
borderColor: 'muted.0',
backgroundColor: 'mid.tertiary',
borderColor: 'mid.primary',
':after': {
backgroundColor: 'muted.0'
backgroundColor: 'mid.primary'
}
},
':hover': {
borderColor: 'text.primary'
borderColor: 'dark.primary'
},
':active': {
borderColor: 'text.secondary',
backgroundColor: 'secondary.base'
borderColor: 'dark.secondary',
backgroundColor: 'blue.secondary'
},

@@ -1081,3 +1072,3 @@ ':focus:not([data-focus-visible-added])': {

borderWidth: 1,
borderColor: 'muted.0',
borderColor: 'mid.primary',
borderRadius: 3,

@@ -1089,4 +1080,4 @@ cursor: 'pointer',

'&:checked': {
backgroundColor: 'primary.base',
borderColor: 'primary.base',
backgroundColor: 'blue',
borderColor: 'blue',
'&:after': {

@@ -1096,17 +1087,17 @@ content: "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8' width='10' height='8' fill='none'><path d='M9 1L4 7L1 4' stroke='%23FFFFFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'></path></svg>\")"

'&[disabled]:after': {
content: "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8' width='10' height='8' fill='none'><path d='M9 1L4 7L1 4' stroke='%238B9299' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'></path></svg>\")"
content: "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8' width='10' height='8' fill='none'><path d='M9 1L4 7L1 4' stroke='%23898F9E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'></path></svg>\")"
},
'&:hover': {
backgroundColor: 'primary.hover',
borderColor: 'primary.hover'
backgroundColor: 'blue.hover',
borderColor: 'blue.hover'
},
'&:active': {
backgroundColor: 'primary.pressed',
borderColor: 'primary.pressed'
backgroundColor: 'blue.pressed',
borderColor: 'blue.pressed'
}
},
'&:indeterminate': {
backgroundColor: 'secondary.base',
borderColor: 'primary.base',
color: 'primary.base',
backgroundColor: 'blue.secondary',
borderColor: 'blue',
color: 'blue',
'&:after': {

@@ -1125,27 +1116,27 @@ content: '""',

'&:disabled': {
backgroundColor: 'muted.1',
borderColor: 'muted.0',
color: 'muted.0'
backgroundColor: 'mid.secondary',
borderColor: 'mid.primary',
color: 'mid.primary'
},
'&:hover': {
borderColor: 'primary.hover',
color: 'primary.hover',
bg: 'secondary.hover'
borderColor: 'blue.hover',
color: 'blue.hover',
bg: 'blue.secondary.hover'
},
'&:active': {
borderColor: 'primary.pressed',
color: 'primary.pressed'
borderColor: 'blue.pressed',
color: 'blue.pressed'
}
},
'&:disabled': {
backgroundColor: 'muted.1',
borderColor: 'muted.0',
color: 'muted.0'
backgroundColor: 'mid.secondary',
borderColor: 'mid.primary',
color: 'mid.primary'
},
'&:hover': {
borderColor: 'text.primary'
borderColor: 'dark.primary'
},
'&:active': {
backgroundColor: 'secondary.base',
borderColor: 'text.secondary'
backgroundColor: 'blue.secondary',
borderColor: 'dark.secondary'
},

@@ -1181,5 +1172,5 @@ ':focus:not([data-focus-visible-added])': {

borderRadius: '6.25rem',
backgroundColor: 'muted.0',
backgroundColor: 'mid.primary',
borderStyle: 'solid',
borderColor: 'muted.0',
borderColor: 'mid.primary',
borderWidth: 1,

@@ -1191,17 +1182,17 @@ '&:after': {

borderRadius: '1.25rem',
backgroundColor: 'success.accent',
backgroundColor: 'light.primary',
transition: 'transform .25s ease'
},
'&:checked': {
backgroundColor: 'success.base',
borderColor: 'success.base',
backgroundColor: 'green',
borderColor: 'green',
'&:hover': {
backgroundColor: 'success.hover',
borderColor: 'success.hover'
backgroundColor: 'green.hover',
borderColor: 'green.hover'
},
'&:disabled': {
backgroundColor: 'muted.0',
borderColor: 'muted.0',
backgroundColor: 'mid.primary',
borderColor: 'mid.primary',
'&:after': {
backgroundColor: 'muted.1'
backgroundColor: 'mid.secondary'
}

@@ -1211,17 +1202,17 @@ }

'&:hover': {
backgroundColor: 'text.secondary',
borderColor: 'text.secondary'
backgroundColor: 'dark.secondary',
borderColor: 'dark.secondary'
},
'&:disabled': {
backgroundColor: 'muted.0',
borderColor: 'muted.0',
backgroundColor: 'mid.primary',
borderColor: 'mid.primary',
'&:after': {
backgroundColor: 'muted.1'
backgroundColor: 'mid.secondary'
}
},
':not(:checked):active': {
backgroundColor: 'text.secondary',
borderColor: 'text.secondary',
backgroundColor: 'dark.secondary',
borderColor: 'dark.secondary',
':after': {
backgroundColor: 'secondary.base'
backgroundColor: 'blue.secondary'
}

@@ -1278,3 +1269,3 @@ },

paddingTop: 2,
color: 'muted.0',
color: 'mid.primary',
marginBottom: 3,

@@ -1304,3 +1295,3 @@ position: 'absolute',

paddingRight: 4,
borderColor: 'muted.2',
borderColor: 'mid.tertiary',
borderRadius: 'default',

@@ -1310,16 +1301,16 @@ bg: 'inherit',

fontSize: 1,
color: 'text.primary',
color: 'dark.primary',
outline: 0,
transition: 'snap',
':hover': {
borderColor: 'text.primary'
borderColor: 'dark.primary'
},
':focus': {
borderColor: 'primary.base',
boxShadow: "0 0 0 1px " + colors.primary.base
borderColor: 'blue',
boxShadow: "0 0 0 1px " + colors.blue["default"]
},
':disabled': {
bg: 'muted.3',
borderColor: 'muted.0',
color: 'muted.0'
bg: 'light.secondary',
borderColor: 'mid.primary',
color: 'mid.primary'
},

@@ -1346,9 +1337,9 @@ // Label styles

textarea: {
borderColor: 'danger.base',
borderColor: 'red',
':focus': {
borderColor: 'danger.base',
boxShadow: "0 0 0 1px " + colors.danger.base
borderColor: 'red',
boxShadow: "0 0 0 1px " + colors.red["default"]
},
':hover': {
borderColor: 'danger.hover'
borderColor: 'red.hover'
}

@@ -1370,3 +1361,3 @@ }

paddingTop: 2,
color: 'muted.0',
color: 'mid.primary',
marginBottom: 3,

@@ -1383,7 +1374,7 @@ position: 'absolute',

cursor: 'pointer',
bg: 'background',
bg: 'light.primary',
borderRadius: 'default',
borderWidth: 1,
borderStyle: 'solid',
borderColor: 'muted.1',
borderColor: 'mid.secondary',
boxShadow: 'menu',

@@ -1403,3 +1394,3 @@ outline: 'none',

cursor: 'pointer',
bg: 'background'
bg: 'light.primary'
};

@@ -1413,3 +1404,3 @@ var dropdown = {

'item-active': /*#__PURE__*/_extends({}, item, {
bg: 'secondary.base'
bg: 'blue.secondary'
})

@@ -1429,14 +1420,14 @@ };

textAlign: 'center',
color: 'black',
color: 'dark.primary',
borderStyle: 'solid',
borderWidth: 1,
borderColor: 'muted.0',
borderColor: 'mid.primary',
borderRadius: 'default',
backgroundColor: 'primary.accent',
backgroundColor: 'light.primary',
':hover': {
borderColor: 'black'
borderColor: 'dark.primary'
},
':disabled': {
backgroundColor: 'muted.3',
color: 'muted.0'
backgroundColor: 'light.secondary',
color: 'mid.primary'
},

@@ -1462,5 +1453,5 @@ ':focus:not([data-focus-visible-added])': {

'default-error': /*#__PURE__*/_extends({}, styles$8, {
borderColor: 'danger.base',
borderColor: 'red',
':hover': {
borderColor: 'danger.base'
borderColor: 'red'
},

@@ -1484,3 +1475,3 @@ ':focus': {

width: 'inherit',
backgroundColor: 'background',
backgroundColor: 'light.primary',
outline: 'none'

@@ -1493,3 +1484,3 @@ };

borderStyle: 'solid',
borderColor: 'muted.0',
borderColor: 'mid.primary',
borderRadius: 'default'

@@ -1503,3 +1494,3 @@ };

paddingLeft: 3,
color: 'text.secondary'
color: 'mid.primary'
};

@@ -1515,3 +1506,3 @@ var optionsUl = {

var item$1 = {
color: 'text.primary',
color: 'dark.primary',
verticalAlign: 'middle',

@@ -1535,26 +1526,26 @@ listStyleType: 'none',

paddingRight: 4,
borderColor: 'muted.1',
borderColor: 'mid.secondary',
borderRadius: 'default',
bg: 'inherit',
fontSize: 1,
color: 'text.secondary',
color: 'dark.secondary',
outline: 0,
':hover': {
borderColor: 'muted.0'
borderColor: 'mid.primary'
},
':hover > svg': {
color: 'text.primary'
color: 'dark.primary'
},
':focus': {
borderColor: colors.primary.base,
boxShadow: "0 0 0 1px " + colors.primary.base
borderColor: colors.blue["default"],
boxShadow: "0 0 0 1px " + colors.blue["default"]
},
':disabled': {
bg: 'muted.3',
borderColor: 'muted.0',
color: 'text.secondary',
bg: 'light.secondary',
borderColor: 'mid.primary',
color: 'dark.secondary',
cursor: 'initial'
},
':disabled > svg': {
color: 'text.secondary'
color: 'dark.secondary'
}

@@ -1564,9 +1555,9 @@ };

var buttonError = /*#__PURE__*/_extends({}, button$1, {
borderColor: 'danger.base',
borderColor: 'red',
':focus': {
borderColor: 'danger.base',
boxShadow: "0 0 0 1px " + colors.danger.base
borderColor: 'red',
boxShadow: "0 0 0 1px " + colors.red["default"]
},
':hover': {
borderColor: 'danger.base'
borderColor: 'red'
}

@@ -1577,3 +1568,3 @@ });

lineHeight: 1.43,
color: 'text.primary',
color: 'dark.primary',
"float": 'left',

@@ -1601,3 +1592,3 @@ marginTop: '1.125rem',

paddingLeft: 3,
color: 'text.secondary',
color: 'dark.secondary',
zIndex: 2

@@ -1612,3 +1603,3 @@ };

var mobileSelect = {
color: 'text.primary',
color: 'dark.primary',
outline: 'none',

@@ -1619,3 +1610,3 @@ fontSize: 1,

border: '1px solid',
borderColor: 'muted.1',
borderColor: 'mid.secondary',
borderRadius: 'default',

@@ -1627,13 +1618,13 @@ paddingTop: '1.125rem',

':focus': {
borderColor: 'primary.base',
boxShadow: "0 0 0 1px " + colors.primary.base
borderColor: 'blue',
boxShadow: "0 0 0 1px " + colors.blue["default"]
},
':disabled': {
bg: 'muted.3',
borderColor: 'muted.0',
color: 'text.primary',
bg: 'light.secondary',
borderColor: 'mid.primary',
color: 'dark.primary',
opacity: 1
},
':disabled > svg': {
color: 'text.secondary'
color: 'dark.secondary'
}

@@ -1643,6 +1634,6 @@ };

var mobileSelectError = /*#__PURE__*/_extends({}, mobileSelect, {
borderColor: 'danger.base',
borderColor: 'red',
':focus': {
borderColor: 'danger.base',
boxShadow: "0 0 0 1px " + colors.danger.base
borderColor: 'red',
boxShadow: "0 0 0 1px " + colors.red["default"]
}

@@ -1655,3 +1646,3 @@ });

top: '25%',
color: 'text.secondary'
color: 'dark.secondary'
};

@@ -1678,4 +1669,4 @@ var select = {

var tooltip = {
backgroundColor: 'text.primary',
color: 'background',
backgroundColor: 'dark.primary',
color: 'light.primary',
fontSize: 1,

@@ -1693,3 +1684,3 @@ paddingY: 2,

flexDirection: 'column',
bg: 'background',
bg: 'light.primary',
marginTop: 1,

@@ -1701,3 +1692,3 @@ padding: 3,

borderStyle: 'solid',
borderColor: 'muted.1',
borderColor: 'mid.secondary',
boxShadow: 'menu',

@@ -1711,3 +1702,3 @@ hr: {

borderRight: 'none',
borderColor: 'muted.1',
borderColor: 'mid.secondary',
width: "calc(100% -" + space[3] + ")",

@@ -1720,3 +1711,3 @@ marginX: "-" + space[3],

paddingX: 1,
color: 'text.primary',
color: 'dark.primary',
fontSize: 1,

@@ -1726,3 +1717,3 @@ border: 'none',

':focus': {
bg: 'secondary.base',
bg: 'blue.secondary',
outline: 'none',

@@ -1732,3 +1723,3 @@ boxShadow: 'none'

':hover': {
color: 'text.primary'
color: 'dark.primary'
},

@@ -1748,5 +1739,5 @@ width: 'full',

outline: 'none',
bg: 'background',
bg: 'light.primary',
borderRadius: 3,
borderColor: 'muted.2',
borderColor: 'mid.tertiary',
borderStyle: 'solid',

@@ -1771,3 +1762,3 @@ borderWidth: 1,

alignItems: 'center',
borderColor: 'muted.2',
borderColor: 'mid.tertiary',
borderStyle: 'solid',

@@ -1791,3 +1782,3 @@ 'button + button': {

right: 0,
bg: 'background',
bg: 'light.primary',
zIndex: 999

@@ -1799,3 +1790,3 @@ };

alignItems: 'center',
borderColor: 'muted.2',
borderColor: 'mid.tertiary',
borderStyle: 'solid',

@@ -1809,3 +1800,3 @@ borderBottomWidth: 0,

right: 0,
bg: 'background',
bg: 'light.primary',
padding: 6,

@@ -1829,3 +1820,3 @@ flexDirection: ['column-reverse', 'column-reverse', 'row'],

scrollbarWidth: 'thin',
scrollbarColor: 'background',
scrollbarColor: 'light.primary',
'::-webkit-scrollbar': {

@@ -1835,6 +1826,6 @@ width: '8px'

'::-webkit-scrollbar-thumb': {
backgroundColor: 'muted.2',
backgroundColor: 'mid.tertiary',
borderRadius: '6px',
border: '2px solid',
color: 'background'
color: 'light.primary'
}

@@ -1853,3 +1844,3 @@ };

alignItems: 'center',
backgroundColor: /*#__PURE__*/rgba(colors.text.primary, 0.5),
backgroundColor: /*#__PURE__*/rgba(colors.dark.primary, 0.5),
position: 'fixed',

@@ -1933,3 +1924,3 @@ top: 0,

height: 'full',
backgroundColor: 'muted.3',
backgroundColor: 'light.secondary',
backgroundSize: "200px 100%",

@@ -1939,3 +1930,3 @@ backgroundRepeat: 'no-repeat',

borderRadius: 3,
backgroundImage: "linear-gradient(\n 90deg,\n " + colors.muted[3] + ",\n white,\n " + colors.muted[3] + "\n )",
backgroundImage: "linear-gradient(\n 90deg,\n " + colors.light.secondary + ",\n white,\n " + colors.light.secondary + "\n )",
animation: load + " 1.2s ease-in-out infinite"

@@ -1954,4 +1945,4 @@ };

container: {
bg: 'background',
borderColor: 'muted.2',
bg: 'light.primary',
borderColor: 'mid.tertiary',
borderStyle: 'solid',

@@ -1962,3 +1953,3 @@ borderWidth: 1,

'container-grouped': {
bg: 'background',
bg: 'light.primary',
borderRadius: 'default'

@@ -2008,12 +1999,12 @@ },

base: /*#__PURE__*/_extends({}, styles$a, {
bg: 'text.primary',
color: 'background'
bg: 'dark.primary',
color: 'light.primary'
}),
primary: /*#__PURE__*/_extends({}, styles$a, {
bg: 'primary.base',
color: 'primary.accent'
bg: 'blue',
color: 'light.primary'
}),
danger: /*#__PURE__*/_extends({}, styles$a, {
bg: 'danger.base',
color: 'danger.accent'
bg: 'red',
color: 'light.primary'
})

@@ -2020,0 +2011,0 @@ };

67

dist/config/base/colors.d.ts
declare const _default: {
text: {
dark: {
primary: string;
secondary: string;
};
background: string;
brand: string;
muted: string[];
light: {
primary: string;
secondary: string;
};
mid: {
primary: string;
secondary: string;
tertiary: string;
};
focus: string;
primary: {
base: string;
blue: {
default: string;
hover: string;
pressed: string;
accent: string;
secondary: {
default: string;
hover: string;
pressed: string;
};
};
secondary: {
base: string;
red: {
default: string;
hover: string;
pressed: string;
accent: string;
};
danger: {
base: string;
hover: string;
pressed: string;
accent: string;
washed: {
base: string;
secondary: {
default: string;
hover: string;
pressed: string;
accent: string;
};
};
warning: {
base: string;
yellow: {
default: string;
hover: string;
pressed: string;
accent: string;
washed: {
base: string;
secondary: {
default: string;
hover: string;
pressed: string;
accent: string;
};
};
success: {
base: string;
green: {
default: string;
hover: string;
pressed: string;
accent: string;
washed: {
base: string;
secondary: {
default: string;
hover: string;
pressed: string;
accent: string;
};
};
white: string;
blue: string;
purple: string;
yellow: string;
green: string;
red: string;
black: string;
};
export default _default;

67

dist/config/base/index.d.ts

@@ -38,65 +38,56 @@ import colors from './colors';

colors: {
text: {
dark: {
primary: string;
secondary: string;
};
background: string;
brand: string;
muted: string[];
light: {
primary: string;
secondary: string;
};
mid: {
primary: string;
secondary: string;
tertiary: string;
};
focus: string;
primary: {
base: string;
blue: {
default: string;
hover: string;
pressed: string;
accent: string;
secondary: {
default: string;
hover: string;
pressed: string;
};
};
secondary: {
base: string;
red: {
default: string;
hover: string;
pressed: string;
accent: string;
};
danger: {
base: string;
hover: string;
pressed: string;
accent: string;
washed: {
base: string;
secondary: {
default: string;
hover: string;
pressed: string;
accent: string;
};
};
warning: {
base: string;
yellow: {
default: string;
hover: string;
pressed: string;
accent: string;
washed: {
base: string;
secondary: {
default: string;
hover: string;
pressed: string;
accent: string;
};
};
success: {
base: string;
green: {
default: string;
hover: string;
pressed: string;
accent: string;
washed: {
base: string;
secondary: {
default: string;
hover: string;
pressed: string;
accent: string;
};
};
white: string;
blue: string;
purple: string;
yellow: string;
green: string;
red: string;
black: string;
};

@@ -103,0 +94,0 @@ space: {

81

dist/config/index.d.ts

@@ -1225,3 +1225,4 @@ export declare const theme: {

overflowY: string;
borderRadius: string;
borderBottomLeftRadius: number;
borderBottomRightRadius: number;
};

@@ -1251,3 +1252,2 @@ item: {

bg: string;
marginBottom: number;
fontSize: number;

@@ -1298,3 +1298,2 @@ color: string;

bg: string;
marginBottom: number;
fontSize: number;

@@ -1320,3 +1319,3 @@ color: string;

float: string;
marginTop: number;
marginTop: string;
':not(:empty) + label': {

@@ -1340,3 +1339,2 @@ fontSize: number;

top: string;
text: string;
lineHeight: number;

@@ -1366,3 +1364,3 @@ paddingLeft: number;

paddingTop: string;
paddingLeft: string;
paddingLeft: number;
width: string;

@@ -1398,3 +1396,3 @@ height: string;

paddingTop: string;
paddingLeft: string;
paddingLeft: number;
width: string;

@@ -1452,65 +1450,56 @@ height: string;

colors: {
text: {
dark: {
primary: string;
secondary: string;
};
background: string;
brand: string;
muted: string[];
light: {
primary: string;
secondary: string;
};
mid: {
primary: string;
secondary: string;
tertiary: string;
};
focus: string;
primary: {
base: string;
blue: {
default: string;
hover: string;
pressed: string;
accent: string;
secondary: {
default: string;
hover: string;
pressed: string;
};
};
secondary: {
base: string;
red: {
default: string;
hover: string;
pressed: string;
accent: string;
};
danger: {
base: string;
hover: string;
pressed: string;
accent: string;
washed: {
base: string;
secondary: {
default: string;
hover: string;
pressed: string;
accent: string;
};
};
warning: {
base: string;
yellow: {
default: string;
hover: string;
pressed: string;
accent: string;
washed: {
base: string;
secondary: {
default: string;
hover: string;
pressed: string;
accent: string;
};
};
success: {
base: string;
green: {
default: string;
hover: string;
pressed: string;
accent: string;
washed: {
base: string;
secondary: {
default: string;
hover: string;
pressed: string;
accent: string;
};
};
white: string;
blue: string;
purple: string;
yellow: string;
green: string;
red: string;
black: string;
};

@@ -1664,2 +1653,2 @@ space: {

export declare type Sizes = keyof typeof theme.sizes;
export declare type ThemeColors = 'text.primary' | 'background' | 'text.secondary' | 'muted.0' | 'muted.1' | 'muted.2' | 'muted.3' | 'brand' | 'focus' | 'primary.base' | 'primary.hover' | 'primary.pressed' | 'primary.accent' | 'secondary.base' | 'secondary.hover' | 'secondary.pressed' | 'danger.base' | 'danger.hover' | 'danger.pressed' | 'danger.accent' | 'danger.washed.base' | 'danger.washed.hover' | 'danger.washed.pressed' | 'success.base' | 'success.hover' | 'success.pressed' | 'success.accent' | 'success.washed.base' | 'warning.base';
export declare type ThemeColors = 'dark.primary' | 'dark.secondary' | 'light.primary' | 'light.secondary' | 'mid.primary' | 'mid.secondary' | 'mid.tertiary' | 'focus' | 'blue' | 'blue.default' | 'blue.hover' | 'blue.pressed' | 'blue.secondary.default' | 'blue.secondary.hover' | 'blue.secondary.pressed' | 'red.default' | 'red.hover' | 'red.pressed' | 'red.secondary.default' | 'red.secondary.hover' | 'red.secondary.pressed' | 'green.default' | 'green.hover' | 'green.pressed' | 'green.secondary.default' | 'green.secondary.hover' | 'green.secondary.pressed' | 'yellow.default' | 'yellow.hover' | 'yellow.pressed' | 'yellow.secondary.default' | 'yellow.secondary.hover' | 'yellow.secondary.pressed';

6

package.json
{
"name": "@vtex/admin-ui-theme",
"version": "0.10.3",
"version": "0.11.0-experimental.0",
"main": "dist/index.js",

@@ -36,3 +36,3 @@ "module": "dist/admin-ui-theme.esm.js",

"devDependencies": {
"@vtex/admin-ui-system": "^0.6.0"
"@vtex/admin-ui-system": "^0.7.0-experimental.0"
},

@@ -42,3 +42,3 @@ "dependencies": {

},
"gitHead": "62f9c59bef33a2480fa546616318e591edbb0238"
"gitHead": "69c4a8669d9e187a9f4f1934124db5daa1693ab7"
}

119

src/config/base/colors.ts
import { darken } from 'polished'
const elementaryColors = {
const semanticColors = {
blue: '#2953B2',
blueSecondary: '#DAE3F5',
red: '#CB4242',
redSecondary: '#FEDADA',
yellow: '#FFBA52',
yellowSecondary: '#F6E0BA',
green: '#368369',
greenSecondary: '#CEE8DE',
black: '#323845',
white: '#FFFFFF',
blue: '#DAE3F5',
purple: '#F4EFFF',
yellow: '#FDE6C0',
green: '#D6EFE5',
red: '#FEE3E3',
black: '#323845',
}
const semanticColors = {
primary: '#2953B2',
secondary: '#DAE3F5',
danger: '#CB4242',
dangerWashed: '#FEDADA',
warning: '#FFBA52',
warningWashed: '#F6E0BA',
success: '#368369',
successWashed: '#CEE8DE',
}
export default {
...elementaryColors,
text: {
primary: '#323845',
dark: {
primary: semanticColors.black,
secondary: '#707685',
},
background: '#FFFFFF',
brand: '#F71963',
muted: ['#898F9E', '#C4C5CA', '#E0E2E7', '#F4F6FB'],
focus: '#8DB6FA',
primary: {
base: semanticColors.primary,
hover: darken(0.08, semanticColors.primary),
pressed: darken(0.16, semanticColors.primary),
accent: '#FFFFFF',
light: {
primary: semanticColors.white,
secondary: '#F4F6FB',
},
secondary: {
base: semanticColors.secondary,
hover: darken(0.04, semanticColors.secondary),
pressed: darken(0.08, semanticColors.secondary),
accent: semanticColors.primary,
mid: {
primary: '#898F9E',
secondary: '#C4C5CA',
tertiary: '#E0E2E7',
},
danger: {
base: semanticColors.danger,
hover: darken(0.08, semanticColors.danger),
pressed: darken(0.16, semanticColors.danger),
accent: '#FFFFFF',
washed: {
base: semanticColors.dangerWashed,
hover: darken(0.04, semanticColors.dangerWashed),
pressed: darken(0.08, semanticColors.dangerWashed),
accent: semanticColors.danger,
focus: '#8DB6FA',
blue: {
default: semanticColors.blue,
hover: darken(0.08, semanticColors.blue),
pressed: darken(0.16, semanticColors.blue),
secondary: {
default: semanticColors.blueSecondary,
hover: darken(0.04, semanticColors.blueSecondary),
pressed: darken(0.08, semanticColors.blueSecondary),
},
},
warning: {
base: semanticColors.warning,
hover: darken(0.08, semanticColors.warning),
pressed: darken(0.16, semanticColors.warning),
accent: '#FFFFFF',
washed: {
base: semanticColors.warningWashed,
hover: darken(0.04, semanticColors.warningWashed),
pressed: darken(0.08, semanticColors.warningWashed),
accent: semanticColors.warning,
red: {
default: semanticColors.red,
hover: darken(0.08, semanticColors.red),
pressed: darken(0.16, semanticColors.red),
secondary: {
default: semanticColors.redSecondary,
hover: darken(0.04, semanticColors.redSecondary),
pressed: darken(0.08, semanticColors.redSecondary),
},
},
success: {
base: semanticColors.success,
hover: darken(0.08, semanticColors.success),
pressed: darken(0.16, semanticColors.success),
accent: '#FFFFFF',
washed: {
base: semanticColors.successWashed,
hover: darken(0.04, semanticColors.successWashed),
pressed: darken(0.08, semanticColors.successWashed),
accent: semanticColors.success,
yellow: {
default: semanticColors.yellow,
hover: darken(0.08, semanticColors.yellow),
pressed: darken(0.16, semanticColors.yellow),
secondary: {
default: semanticColors.yellowSecondary,
hover: darken(0.04, semanticColors.yellowSecondary),
pressed: darken(0.08, semanticColors.yellowSecondary),
},
},
green: {
default: semanticColors.green,
hover: darken(0.08, semanticColors.green),
pressed: darken(0.16, semanticColors.green),
secondary: {
default: semanticColors.greenSecondary,
hover: darken(0.04, semanticColors.greenSecondary),
pressed: darken(0.08, semanticColors.greenSecondary),
},
},
}

6

src/config/base/index.ts

@@ -82,3 +82,3 @@ import colors from './colors'

borderRadius: 'default',
borderColor: 'muted.2',
borderColor: 'mid.tertiary',
},

@@ -90,3 +90,3 @@ 'divider-bottom': {

borderBottomRightRadius: 0,
borderColor: 'muted.2',
borderColor: 'mid.tertiary',
},

@@ -98,3 +98,3 @@ 'divider-top': {

borderTopRightRadius: 0,
borderColor: 'muted.2',
borderColor: 'mid.tertiary',
},

@@ -101,0 +101,0 @@ },

32

src/config/components/abstractInput.ts

@@ -13,3 +13,3 @@ import { merge } from '@vtex/admin-ui-system'

paddingRight: 4,
borderColor: 'muted.2',
borderColor: 'mid.tertiary',
borderRadius: 'default',

@@ -19,16 +19,16 @@ bg: 'inherit',

fontSize: 1,
color: 'text.primary',
color: 'dark.primary',
outline: 0,
transition: 'snap',
':hover': {
borderColor: 'text.primary',
borderColor: 'dark.primary',
},
':focus': {
borderColor: 'primary.base',
boxShadow: `0 0 0 1px ${colors.primary.base}`,
borderColor: 'blue',
boxShadow: `0 0 0 1px ${colors.blue.default}`,
},
':disabled': {
bg: 'muted.3',
borderColor: 'muted.0',
color: 'muted.0',
bg: 'light.secondary',
borderColor: 'mid.primary',
color: 'mid.primary',
},

@@ -47,9 +47,9 @@ ':focus + label': {

const errorState = {
borderColor: 'danger.base',
borderColor: 'red',
':focus': {
borderColor: 'danger.base',
boxShadow: `0 0 0 1px ${colors.danger.base}`,
borderColor: 'red',
boxShadow: `0 0 0 1px ${colors.red.default}`,
},
':hover': {
borderColor: 'danger.hover',
borderColor: 'red.hover',
},

@@ -95,6 +95,6 @@ }

suffix: {
color: 'muted.0',
color: 'mid.primary',
borderLeftStyle: 'solid',
borderLeftWidth: '1px',
borderLeftColor: 'muted.2',
borderLeftColor: 'mid.tertiary',
paddingTop: '14px',

@@ -111,3 +111,3 @@ marginTop: 'px',

icon: {
color: 'muted.0',
color: 'mid.primary',
top: 1,

@@ -132,3 +132,3 @@ left: 0,

display: 'flex',
color: 'text.secondary',
color: 'dark.secondary',
},

@@ -135,0 +135,0 @@ ...getInputVariants('input'),

6

src/config/components/anchor.ts
export default {
font: 'inherit',
color: 'primary.base',
color: 'blue',
textDecoration: 'none',
':active': {
color: 'primary.pressed',
color: 'blue.pressed',
textDecoration: 'underline',
},
':hover': {
color: 'primary.hover',
color: 'blue.hover',
textDecoration: 'underline',
},
}

12

src/config/components/avatar.ts

@@ -15,15 +15,15 @@ const styles = {

...styles,
bg: 'text.primary',
color: 'background',
bg: 'dark.primary',
color: 'light.primary',
},
primary: {
...styles,
bg: 'primary.base',
color: 'primary.accent',
bg: 'blue',
color: 'light.primary',
},
danger: {
...styles,
bg: 'danger.base',
color: 'danger.accent',
bg: 'red',
color: 'light.primary',
},
}

88

src/config/components/button.ts

@@ -108,13 +108,13 @@ /* eslint-disable @typescript-eslint/no-explicit-any */

textTransform: 'uppercase',
color: 'primary.accent',
backgroundColor: 'primary.base',
color: 'light.primary',
backgroundColor: 'blue',
':hover': {
backgroundColor: 'primary.hover',
backgroundColor: 'blue.hover',
},
':active': {
backgroundColor: 'primary.pressed',
backgroundColor: 'blue.pressed',
},
':disabled': {
color: 'text.primary',
backgroundColor: 'muted.1',
color: 'dark.primary',
backgroundColor: 'mid.secondary',
},

@@ -124,13 +124,13 @@ },

textTransform: 'uppercase',
backgroundColor: 'secondary.base',
color: 'secondary.accent',
backgroundColor: 'blue.secondary',
color: 'blue',
':hover': {
backgroundColor: 'secondary.hover',
backgroundColor: 'blue.secondary.hover',
},
':active': {
backgroundColor: 'secondary.pressed',
backgroundColor: 'blue.secondary.pressed',
},
':disabled': {
color: 'muted.0',
backgroundColor: 'muted.3',
color: 'mid.primary',
backgroundColor: 'light.secondary',
},

@@ -141,13 +141,13 @@ },

backgroundColor: 'transparent',
color: 'primary.base',
color: 'blue',
':hover': {
color: 'primary.hover',
backgroundColor: 'secondary.hover',
color: 'blue.hover',
backgroundColor: 'blue.secondary.hover',
},
':active': {
color: 'primary.pressed',
backgroundColor: 'secondary.pressed',
color: 'blue.pressed',
backgroundColor: 'blue.secondary.pressed',
},
':disabled': {
color: 'muted.0',
color: 'mid.primary',
},

@@ -157,13 +157,13 @@ },

textTransform: 'uppercase',
color: 'danger.accent',
backgroundColor: 'danger.base',
color: 'light.primary',
backgroundColor: 'red',
':hover': {
backgroundColor: 'danger.hover',
backgroundColor: 'red.hover',
},
':active': {
backgroundColor: 'danger.pressed',
backgroundColor: 'red.pressed',
},
':disabled': {
color: 'text.primary',
backgroundColor: 'muted.1',
color: 'dark.primary',
backgroundColor: 'mid.secondary',
},

@@ -173,15 +173,15 @@ },

textTransform: 'uppercase',
backgroundColor: 'danger.washed.base',
color: 'danger.base',
backgroundColor: 'red.secondary',
color: 'red',
':hover': {
backgroundColor: 'danger.washed.hover',
color: 'danger.hover',
backgroundColor: 'red.secondary.hover',
color: 'red.hover',
},
':active': {
backgroundColor: 'danger.washed.pressed',
color: 'danger.pressed',
backgroundColor: 'red.secondary.pressed',
color: 'red.pressed',
},
':disabled': {
color: 'muted.0',
backgroundColor: 'muted.3',
color: 'mid.primary',
backgroundColor: 'light.secondary',
},

@@ -192,13 +192,13 @@ },

backgroundColor: 'transparent',
color: 'danger.washed.accent',
color: 'red',
':hover': {
color: 'danger.hover',
backgroundColor: 'danger.washed.hover',
color: 'red.hover',
backgroundColor: 'red.secondary.hover',
},
':active': {
color: 'danger.pressed',
backgroundColor: 'danger.washed.pressed',
color: 'red.pressed',
backgroundColor: 'red.secondary.pressed',
},
':disabled': {
color: 'muted.0',
color: 'mid.primary',
},

@@ -210,9 +210,9 @@ },

':hover': {
backgroundColor: alpha('text.primary', 0.04),
backgroundColor: alpha('dark.primary', 0.04),
},
':active': {
backgroundColor: alpha('text.primary', 0.08),
backgroundColor: alpha('dark.primary', 0.08),
},
':disabled': {
color: 'muted.0',
color: 'mid.primary',
},

@@ -224,9 +224,9 @@ },

':hover': {
backgroundColor: alpha('background', 0.04),
backgroundColor: alpha('light.primary', 0.04),
},
':active': {
backgroundColor: alpha('background', 0.08),
backgroundColor: alpha('light.primary', 0.08),
},
':disabled': {
color: 'muted.0',
color: 'mid.primary',
},

@@ -233,0 +233,0 @@ },

50

src/config/components/checkbox.ts

@@ -5,3 +5,3 @@ const styles = {

borderWidth: 1,
borderColor: 'muted.0',
borderColor: 'mid.primary',
borderRadius: 3,

@@ -13,4 +13,4 @@ cursor: 'pointer',

'&:checked': {
backgroundColor: 'primary.base',
borderColor: 'primary.base',
backgroundColor: 'blue',
borderColor: 'blue',
'&:after': {

@@ -20,17 +20,17 @@ content: `url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8' width='10' height='8' fill='none'><path d='M9 1L4 7L1 4' stroke='%23FFFFFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'></path></svg>")`,

'&[disabled]:after': {
content: `url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8' width='10' height='8' fill='none'><path d='M9 1L4 7L1 4' stroke='%238B9299' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'></path></svg>")`,
content: `url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8' width='10' height='8' fill='none'><path d='M9 1L4 7L1 4' stroke='%23898F9E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'></path></svg>")`,
},
'&:hover': {
backgroundColor: 'primary.hover',
borderColor: 'primary.hover',
backgroundColor: 'blue.hover',
borderColor: 'blue.hover',
},
'&:active': {
backgroundColor: 'primary.pressed',
borderColor: 'primary.pressed',
backgroundColor: 'blue.pressed',
borderColor: 'blue.pressed',
},
},
'&:indeterminate': {
backgroundColor: 'secondary.base',
borderColor: 'primary.base',
color: 'primary.base',
backgroundColor: 'blue.secondary',
borderColor: 'blue',
color: 'blue',
'&:after': {

@@ -49,27 +49,27 @@ content: '""',

'&:disabled': {
backgroundColor: 'muted.1',
borderColor: 'muted.0',
color: 'muted.0',
backgroundColor: 'mid.secondary',
borderColor: 'mid.primary',
color: 'mid.primary',
},
'&:hover': {
borderColor: 'primary.hover',
color: 'primary.hover',
bg: 'secondary.hover',
borderColor: 'blue.hover',
color: 'blue.hover',
bg: 'blue.secondary.hover',
},
'&:active': {
borderColor: 'primary.pressed',
color: 'primary.pressed',
borderColor: 'blue.pressed',
color: 'blue.pressed',
},
},
'&:disabled': {
backgroundColor: 'muted.1',
borderColor: 'muted.0',
color: 'muted.0',
backgroundColor: 'mid.secondary',
borderColor: 'mid.primary',
color: 'mid.primary',
},
'&:hover': {
borderColor: 'text.primary',
borderColor: 'dark.primary',
},
'&:active': {
backgroundColor: 'secondary.base',
borderColor: 'text.secondary',
backgroundColor: 'blue.secondary',
borderColor: 'dark.secondary',
},

@@ -76,0 +76,0 @@ ':focus:not([data-focus-visible-added])': {

6

src/config/components/collapsible.ts
export default {
container: {
bg: 'background',
borderColor: 'muted.2',
bg: 'light.primary',
borderColor: 'mid.tertiary',
borderStyle: 'solid',

@@ -10,3 +10,3 @@ borderWidth: 1,

'container-grouped': {
bg: 'background',
bg: 'light.primary',
borderRadius: 'default',

@@ -13,0 +13,0 @@ },

2

src/config/components/controlGroup.ts

@@ -14,3 +14,3 @@ const styles = {

cursor: 'pointer',
color: 'text.secondary',
color: 'dark.secondary',
display: 'flex',

@@ -17,0 +17,0 @@ alignItems: 'center',

2

src/config/components/divider.ts
const styles = {
border: 'solid',
borderWidth: 1,
borderColor: 'muted.2',
borderColor: 'mid.tertiary',
margin: 0,

@@ -6,0 +6,0 @@ }

8

src/config/components/dropdown.ts
const menu = {
visibility: 'hidden',
cursor: 'pointer',
bg: 'background',
bg: 'light.primary',
borderRadius: 'default',
borderWidth: 1,
borderStyle: 'solid',
borderColor: 'muted.1',
borderColor: 'mid.secondary',
boxShadow: 'menu',

@@ -24,3 +24,3 @@ outline: 'none',

cursor: 'pointer',
bg: 'background',
bg: 'light.primary',
}

@@ -37,4 +37,4 @@

...item,
bg: 'secondary.base',
bg: 'blue.secondary',
},
}

2

src/config/components/input.ts

@@ -12,3 +12,3 @@ export default {

paddingTop: 2,
color: 'muted.0',
color: 'mid.primary',
marginBottom: 3,

@@ -15,0 +15,0 @@ position: 'absolute',

2

src/config/components/list.ts

@@ -7,3 +7,3 @@ const itemStyles = {

borderBottomStyle: 'solid',
borderBottomColor: 'muted.2',
borderBottomColor: 'mid.tertiary',
justifyContent: 'flex-start',

@@ -10,0 +10,0 @@ }

12

src/config/components/menu.ts

@@ -6,3 +6,3 @@ import { space } from '../base'

flexDirection: 'column',
bg: 'background',
bg: 'light.primary',
marginTop: 1,

@@ -14,3 +14,3 @@ padding: 3,

borderStyle: 'solid',
borderColor: 'muted.1',
borderColor: 'mid.secondary',
boxShadow: 'menu',

@@ -24,3 +24,3 @@ hr: {

borderRight: 'none',
borderColor: 'muted.1',
borderColor: 'mid.secondary',
width: `calc(100% -${space[3]})`,

@@ -33,3 +33,3 @@ marginX: `-${space[3]}`,

paddingX: 1,
color: 'text.primary',
color: 'dark.primary',
fontSize: 1,

@@ -39,3 +39,3 @@ border: 'none',

':focus': {
bg: 'secondary.base',
bg: 'blue.secondary',
outline: 'none',

@@ -45,3 +45,3 @@ boxShadow: 'none',

':hover': {
color: 'text.primary',
color: 'dark.primary',
},

@@ -48,0 +48,0 @@ width: 'full',

20

src/config/components/modal.ts

@@ -7,5 +7,5 @@ import { rgba } from 'polished'

outline: 'none',
bg: 'background',
bg: 'light.primary',
borderRadius: 3,
borderColor: 'muted.2',
borderColor: 'mid.tertiary',
borderStyle: 'solid',

@@ -31,3 +31,3 @@ borderWidth: 1,

alignItems: 'center',
borderColor: 'muted.2',
borderColor: 'mid.tertiary',
borderStyle: 'solid',

@@ -51,3 +51,3 @@ 'button + button': {

right: 0,
bg: 'background',
bg: 'light.primary',
zIndex: 999,

@@ -60,3 +60,3 @@ }

alignItems: 'center',
borderColor: 'muted.2',
borderColor: 'mid.tertiary',
borderStyle: 'solid',

@@ -70,3 +70,3 @@ borderBottomWidth: 0,

right: 0,
bg: 'background',
bg: 'light.primary',
padding: 6,

@@ -92,3 +92,3 @@ flexDirection: ['column-reverse', 'column-reverse', 'row'],

scrollbarWidth: 'thin',
scrollbarColor: 'background',
scrollbarColor: 'light.primary',
'::-webkit-scrollbar': {

@@ -98,6 +98,6 @@ width: '8px',

'::-webkit-scrollbar-thumb': {
backgroundColor: 'muted.2',
backgroundColor: 'mid.tertiary',
borderRadius: '6px',
border: '2px solid',
color: 'background',
color: 'light.primary',
},

@@ -118,3 +118,3 @@ }

alignItems: 'center',
backgroundColor: rgba(colors.text.primary, 0.5),
backgroundColor: rgba(colors.dark.primary, 0.5),
position: 'fixed',

@@ -121,0 +121,0 @@ top: 0,

16

src/config/components/numericStepper.ts

@@ -12,14 +12,14 @@ const styles = {

textAlign: 'center',
color: 'black',
color: 'dark.primary',
borderStyle: 'solid',
borderWidth: 1,
borderColor: 'muted.0',
borderColor: 'mid.primary',
borderRadius: 'default',
backgroundColor: 'primary.accent',
backgroundColor: 'light.primary',
':hover': {
borderColor: 'black',
borderColor: 'dark.primary',
},
':disabled': {
backgroundColor: 'muted.3',
color: 'muted.0',
backgroundColor: 'light.secondary',
color: 'mid.primary',
},

@@ -48,5 +48,5 @@ ':focus:not([data-focus-visible-added])': {

...styles,
borderColor: 'danger.base',
borderColor: 'red',
':hover': {
borderColor: 'danger.base',
borderColor: 'red',
},

@@ -53,0 +53,0 @@ ':focus': {

28

src/config/components/radio.ts

@@ -10,3 +10,3 @@ import { merge } from '@vtex/admin-ui-system'

borderWidth: '1px',
borderColor: 'muted.1',
borderColor: 'mid.secondary',
backgroundColor: 'transparent',

@@ -18,8 +18,8 @@ borderRadius: 'circle',

borderRadius: 'circle',
backgroundColor: 'white',
backgroundColor: 'light.primary',
opacity: 0,
},
':checked': {
backgroundColor: 'primary.base',
borderColor: 'primary.base',
backgroundColor: 'blue',
borderColor: 'blue',
':after': {

@@ -29,8 +29,8 @@ opacity: 1,

':hover': {
backgroundColor: 'primary.hover',
borderColor: 'primary.hover',
backgroundColor: 'blue.hover',
borderColor: 'blue.hover',
},
':active': {
borderColor: 'primary.pressed',
backgroundColor: 'primary.pressed',
borderColor: 'blue.pressed',
backgroundColor: 'blue.pressed',
},

@@ -40,14 +40,14 @@ },

cursor: 'not-allowed',
backgroundColor: 'muted.2',
borderColor: 'muted.0',
backgroundColor: 'mid.tertiary',
borderColor: 'mid.primary',
':after': {
backgroundColor: 'muted.0',
backgroundColor: 'mid.primary',
},
},
':hover': {
borderColor: 'text.primary',
borderColor: 'dark.primary',
},
':active': {
borderColor: 'text.secondary',
backgroundColor: 'secondary.base',
borderColor: 'dark.secondary',
backgroundColor: 'blue.secondary',
},

@@ -54,0 +54,0 @@ ':focus:not([data-focus-visible-added])': {

64

src/config/components/select.ts

@@ -12,3 +12,3 @@ import { colors } from '../base'

width: 'inherit',
backgroundColor: 'background',
backgroundColor: 'light.primary',
outline: 'none',

@@ -22,3 +22,3 @@ }

borderStyle: 'solid',
borderColor: 'muted.0',
borderColor: 'mid.primary',
borderRadius: 'default',

@@ -33,3 +33,3 @@ }

paddingLeft: 3,
color: 'text.secondary',
color: 'mid.primary',
}

@@ -47,3 +47,3 @@

const item = {
color: 'text.primary',
color: 'dark.primary',
verticalAlign: 'middle',

@@ -68,26 +68,26 @@ listStyleType: 'none',

paddingRight: 4,
borderColor: 'muted.1',
borderColor: 'mid.secondary',
borderRadius: 'default',
bg: 'inherit',
fontSize: 1,
color: 'text.secondary',
color: 'dark.secondary',
outline: 0,
':hover': {
borderColor: 'muted.0',
borderColor: 'mid.primary',
},
':hover > svg': {
color: 'text.primary',
color: 'dark.primary',
},
':focus': {
borderColor: colors.primary.base,
boxShadow: `0 0 0 1px ${colors.primary.base}`,
borderColor: colors.blue.default,
boxShadow: `0 0 0 1px ${colors.blue.default}`,
},
':disabled': {
bg: 'muted.3',
borderColor: 'muted.0',
color: 'text.secondary',
bg: 'light.secondary',
borderColor: 'mid.primary',
color: 'dark.secondary',
cursor: 'initial',
},
':disabled > svg': {
color: 'text.secondary',
color: 'dark.secondary',
},

@@ -98,9 +98,9 @@ }

...button,
borderColor: 'danger.base',
borderColor: 'red',
':focus': {
borderColor: 'danger.base',
boxShadow: `0 0 0 1px ${colors.danger.base}`,
borderColor: 'red',
boxShadow: `0 0 0 1px ${colors.red.default}`,
},
':hover': {
borderColor: 'danger.base',
borderColor: 'red',
},

@@ -111,3 +111,3 @@ }

lineHeight: 1.43,
color: 'text.primary',
color: 'dark.primary',
float: 'left',

@@ -138,3 +138,3 @@ marginTop: '1.125rem',

paddingLeft: 3,
color: 'text.secondary',
color: 'dark.secondary',
zIndex: 2,

@@ -150,3 +150,3 @@ }

const mobileSelect = {
color: 'text.primary',
color: 'dark.primary',
outline: 'none',

@@ -157,3 +157,3 @@ fontSize: 1,

border: '1px solid',
borderColor: 'muted.1',
borderColor: 'mid.secondary',
borderRadius: 'default',

@@ -165,13 +165,13 @@ paddingTop: '1.125rem',

':focus': {
borderColor: 'primary.base',
boxShadow: `0 0 0 1px ${colors.primary.base}`,
borderColor: 'blue',
boxShadow: `0 0 0 1px ${colors.blue.default}`,
},
':disabled': {
bg: 'muted.3',
borderColor: 'muted.0',
color: 'text.primary',
bg: 'light.secondary',
borderColor: 'mid.primary',
color: 'dark.primary',
opacity: 1,
},
':disabled > svg': {
color: 'text.secondary',
color: 'dark.secondary',
},

@@ -182,6 +182,6 @@ }

...mobileSelect,
borderColor: 'danger.base',
borderColor: 'red',
':focus': {
borderColor: 'danger.base',
boxShadow: `0 0 0 1px ${colors.danger.base}`,
borderColor: 'red',
boxShadow: `0 0 0 1px ${colors.red.default}`,
},

@@ -194,3 +194,3 @@ }

top: '25%',
color: 'text.secondary',
color: 'dark.secondary',
}

@@ -197,0 +197,0 @@

6

src/config/components/skeleton.ts

@@ -18,3 +18,3 @@ import { keyframes } from '@vtex/admin-ui-system'

height: 'full',
backgroundColor: 'muted.3',
backgroundColor: 'light.secondary',
backgroundSize: `200px 100%`,

@@ -26,5 +26,5 @@ backgroundRepeat: 'no-repeat',

90deg,
${colors.muted[3]},
${colors.light.secondary},
white,
${colors.muted[3]}
${colors.light.secondary}
)`,

@@ -31,0 +31,0 @@ animation: `${load} 1.2s ease-in-out infinite`,

10

src/config/components/table.ts

@@ -23,7 +23,7 @@ import { merge } from '@vtex/admin-ui-system'

cell: {
bg: 'background',
bg: 'light.primary',
flex: 1,
borderBottomWidth: 1,
borderBottomStyle: 'solid',
borderBottomColor: 'muted.2',
borderBottomColor: 'mid.tertiary',
display: 'table-cell',

@@ -35,3 +35,3 @@ verticalAlign: 'middle',

columnheader: {
bg: 'background',
bg: 'light.primary',
height: 48,

@@ -41,3 +41,3 @@ display: 'table-cell',

paddingX: 2,
color: 'text.secondary',
color: 'dark.secondary',
fontWeight: 'normal',

@@ -48,3 +48,3 @@ variant: 'text.body',

borderBottomStyle: 'solid',
borderBottomColor: 'muted.2',
borderBottomColor: 'mid.tertiary',
},

@@ -51,0 +51,0 @@ }

16

src/config/components/tag.ts

@@ -7,3 +7,3 @@ /* eslint-disable @typescript-eslint/no-explicit-any */

borderRadius: '100px',
color: 'text.primary',
color: 'dark.primary',
border: 'none',

@@ -17,19 +17,19 @@ '> svg:nth-of-type(1)': {

blue: {
bg: 'blue',
bg: 'blue.secondary',
},
green: {
bg: 'green',
bg: 'green.secondary',
},
red: {
bg: 'red',
bg: 'red.secondary',
},
black: {
bg: 'black',
color: 'white',
bg: 'dark.primary',
color: 'light.primary',
},
yellow: {
bg: 'yellow',
bg: 'yellow.secondary',
},
purple: {
bg: 'purple',
bg: '#E4E0F0',
},

@@ -36,0 +36,0 @@ }

26

src/config/components/textArea.ts

@@ -13,3 +13,3 @@ import { colors } from '../base'

paddingRight: 4,
borderColor: 'muted.2',
borderColor: 'mid.tertiary',
borderRadius: 'default',

@@ -19,16 +19,16 @@ bg: 'inherit',

fontSize: 1,
color: 'text.primary',
color: 'dark.primary',
outline: 0,
transition: 'snap',
':hover': {
borderColor: 'text.primary',
borderColor: 'dark.primary',
},
':focus': {
borderColor: 'primary.base',
boxShadow: `0 0 0 1px ${colors.primary.base}`,
borderColor: 'blue',
boxShadow: `0 0 0 1px ${colors.blue.default}`,
},
':disabled': {
bg: 'muted.3',
borderColor: 'muted.0',
color: 'muted.0',
bg: 'light.secondary',
borderColor: 'mid.primary',
color: 'mid.primary',
},

@@ -57,9 +57,9 @@ // Label styles

textarea: {
borderColor: 'danger.base',
borderColor: 'red',
':focus': {
borderColor: 'danger.base',
boxShadow: `0 0 0 1px ${colors.danger.base}`,
borderColor: 'red',
boxShadow: `0 0 0 1px ${colors.red.default}`,
},
':hover': {
borderColor: 'danger.hover',
borderColor: 'red.hover',
},

@@ -82,3 +82,3 @@ },

paddingTop: 2,
color: 'muted.0',
color: 'mid.primary',
marginBottom: 3,

@@ -85,0 +85,0 @@ position: 'absolute',

36

src/config/components/toggle.ts

@@ -8,5 +8,5 @@ import { merge } from '@vtex/admin-ui-system'

borderRadius: '6.25rem',
backgroundColor: 'muted.0',
backgroundColor: 'mid.primary',
borderStyle: 'solid',
borderColor: 'muted.0',
borderColor: 'mid.primary',
borderWidth: 1,

@@ -18,17 +18,17 @@ '&:after': {

borderRadius: '1.25rem',
backgroundColor: 'success.accent',
backgroundColor: 'light.primary',
transition: 'transform .25s ease',
},
'&:checked': {
backgroundColor: 'success.base',
borderColor: 'success.base',
backgroundColor: 'green',
borderColor: 'green',
'&:hover': {
backgroundColor: 'success.hover',
borderColor: 'success.hover',
backgroundColor: 'green.hover',
borderColor: 'green.hover',
},
'&:disabled': {
backgroundColor: 'muted.0',
borderColor: 'muted.0',
backgroundColor: 'mid.primary',
borderColor: 'mid.primary',
'&:after': {
backgroundColor: 'muted.1',
backgroundColor: 'mid.secondary',
},

@@ -38,17 +38,17 @@ },

'&:hover': {
backgroundColor: 'text.secondary',
borderColor: 'text.secondary',
backgroundColor: 'dark.secondary',
borderColor: 'dark.secondary',
},
'&:disabled': {
backgroundColor: 'muted.0',
borderColor: 'muted.0',
backgroundColor: 'mid.primary',
borderColor: 'mid.primary',
'&:after': {
backgroundColor: 'muted.1',
backgroundColor: 'mid.secondary',
},
},
':not(:checked):active': {
backgroundColor: 'text.secondary',
borderColor: 'text.secondary',
backgroundColor: 'dark.secondary',
borderColor: 'dark.secondary',
':after': {
backgroundColor: 'secondary.base',
backgroundColor: 'blue.secondary',
},

@@ -55,0 +55,0 @@ },

4

src/config/components/tooltip.ts
export default {
backgroundColor: 'text.primary',
color: 'background',
backgroundColor: 'dark.primary',
color: 'light.primary',
fontSize: 1,

@@ -5,0 +5,0 @@ paddingY: 2,

60

src/config/index.ts

@@ -37,30 +37,34 @@ import base from './base'

export type ThemeColors =
| 'text.primary'
| 'background'
| 'text.secondary'
| 'muted.0'
| 'muted.1'
| 'muted.2'
| 'muted.3'
| 'brand'
| 'dark.primary'
| 'dark.secondary'
| 'light.primary'
| 'light.secondary'
| 'mid.primary'
| 'mid.secondary'
| 'mid.tertiary'
| 'focus'
| 'primary.base'
| 'primary.hover'
| 'primary.pressed'
| 'primary.accent'
| 'secondary.base'
| 'secondary.hover'
| 'secondary.pressed'
| 'danger.base'
| 'danger.hover'
| 'danger.pressed'
| 'danger.accent'
| 'danger.washed.base'
| 'danger.washed.hover'
| 'danger.washed.pressed'
| 'success.base'
| 'success.hover'
| 'success.pressed'
| 'success.accent'
| 'success.washed.base'
| 'warning.base'
| 'blue'
| 'blue.default'
| 'blue.hover'
| 'blue.pressed'
| 'blue.secondary.default'
| 'blue.secondary.hover'
| 'blue.secondary.pressed'
| 'red.default'
| 'red.hover'
| 'red.pressed'
| 'red.secondary.default'
| 'red.secondary.hover'
| 'red.secondary.pressed'
| 'green.default'
| 'green.hover'
| 'green.pressed'
| 'green.secondary.default'
| 'green.secondary.hover'
| 'green.secondary.pressed'
| 'yellow.default'
| 'yellow.hover'
| 'yellow.pressed'
| 'yellow.secondary.default'
| 'yellow.secondary.hover'
| 'yellow.secondary.pressed'
dist/admin-ui-theme.cjs.development.js.map

Sorry, the diff of this file is not supported yet

dist/admin-ui-theme.cjs.production.min.js.map

Sorry, the diff of this file is not supported yet

dist/admin-ui-theme.esm.js.map

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc