From bb10ec63a01245f854f772ef97969cd4045ce5ac Mon Sep 17 00:00:00 2001 From: kostasdano Date: Thu, 20 Jul 2023 16:05:45 +0300 Subject: [PATCH 1/7] feat: add react-aria-components --- package.json | 1 + yarn.lock | 1200 ++++++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 1201 insertions(+) diff --git a/package.json b/package.json index e21765b84..d5b0311a3 100644 --- a/package.json +++ b/package.json @@ -117,6 +117,7 @@ "lodash": "^4.17.19", "pluralize": "^8.0.0", "polished": "^3.4.4", + "react-aria-components": "^1.0.0-alpha.5", "react-fast-compare": "^3.2.0", "react-highlight-words": "^0.17.0", "react-media": "^2.0.0-rc.1", diff --git a/yarn.lock b/yarn.lock index ebfbb977d..6009fe4c6 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2736,6 +2736,45 @@ "@figspec/components" "^1.0.0" "@lit-labs/react" "^1.0.2" +"@formatjs/ecma402-abstract@1.17.0": + version "1.17.0" + resolved "https://registry.yarnpkg.com/@formatjs/ecma402-abstract/-/ecma402-abstract-1.17.0.tgz#2ce191a3bde4c65c6684e03fa247062a4a294b9e" + integrity sha512-6ueQTeJZtwKjmh23bdkq/DMqH4l4bmfvtQH98blOSbiXv/OUiyijSW6jU22IT8BNM1ujCaEvJfTtyCYVH38EMQ== + dependencies: + "@formatjs/intl-localematcher" "0.4.0" + tslib "^2.4.0" + +"@formatjs/fast-memoize@2.2.0": + version "2.2.0" + resolved "https://registry.yarnpkg.com/@formatjs/fast-memoize/-/fast-memoize-2.2.0.tgz#33bd616d2e486c3e8ef4e68c99648c196887802b" + integrity sha512-hnk/nY8FyrL5YxwP9e4r9dqeM6cAbo8PeU9UjyXojZMNvVad2Z06FAVHyR3Ecw6fza+0GH7vdJgiKIVXTMbSBA== + dependencies: + tslib "^2.4.0" + +"@formatjs/icu-messageformat-parser@2.6.0": + version "2.6.0" + resolved "https://registry.yarnpkg.com/@formatjs/icu-messageformat-parser/-/icu-messageformat-parser-2.6.0.tgz#b0d58ce8c8f472969c96b5cd0b3ad5522d3a02b7" + integrity sha512-yT6at0qc0DANw9qM/TU8RZaCtfDXtj4pZM/IC2WnVU80yAcliS3KVDiuUt4jSQAeFL9JS5bc2hARnFmjPdA6qw== + dependencies: + "@formatjs/ecma402-abstract" "1.17.0" + "@formatjs/icu-skeleton-parser" "1.6.0" + tslib "^2.4.0" + +"@formatjs/icu-skeleton-parser@1.6.0": + version "1.6.0" + resolved "https://registry.yarnpkg.com/@formatjs/icu-skeleton-parser/-/icu-skeleton-parser-1.6.0.tgz#0728be8b6b3656f1a4b8e6e5b0e02dffffc23c6c" + integrity sha512-eMmxNpoX/J1IPUjPGSZwo0Wh+7CEvdEMddP2Jxg1gQJXfGfht/FdW2D5XDFj3VMbOTUQlDIdZJY7uC6O6gjPoA== + dependencies: + "@formatjs/ecma402-abstract" "1.17.0" + tslib "^2.4.0" + +"@formatjs/intl-localematcher@0.4.0": + version "0.4.0" + resolved "https://registry.yarnpkg.com/@formatjs/intl-localematcher/-/intl-localematcher-0.4.0.tgz#63bbc37a7c3545a1bf1686072e51d9a3aed98d6b" + integrity sha512-bRTd+rKomvfdS4QDlVJ6TA/Jx1F2h/TBVO5LjvhQ7QPPHp19oPNMIum7W2CMEReq/zPxpmCeB31F9+5gl/qtvw== + dependencies: + tslib "^2.4.0" + "@humanwhocodes/config-array@^0.5.0": version "0.5.0" resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.5.0.tgz#1407967d4c6eecd7388f83acf1eaf4d0c6e58ef9" @@ -2750,6 +2789,35 @@ resolved "https://registry.yarnpkg.com/@humanwhocodes/object-schema/-/object-schema-1.2.1.tgz#b520529ec21d8e5945a1851dfd1c32e94e39ff45" integrity sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA== +"@internationalized/date@^3.3.0": + version "3.3.0" + resolved "https://registry.yarnpkg.com/@internationalized/date/-/date-3.3.0.tgz#90386d4b4e707f28507d1a1b3cc0e162ad5ee038" + integrity sha512-qfRd7jCIgUjabI8RxeAsxhLDRS1u8eUPX96GB5uBp1Tpm6YY6dVveE7YwsTEV6L4QOp5LKFirFHHGsL/XQwJIA== + dependencies: + "@swc/helpers" "^0.5.0" + +"@internationalized/message@^3.1.1": + version "3.1.1" + resolved "https://registry.yarnpkg.com/@internationalized/message/-/message-3.1.1.tgz#0f29c5a239b5dcd457b55f21dcd38d1a44a1236a" + integrity sha512-ZgHxf5HAPIaR0th+w0RUD62yF6vxitjlprSxmLJ1tam7FOekqRSDELMg4Cr/DdszG5YLsp5BG3FgHgqquQZbqw== + dependencies: + "@swc/helpers" "^0.5.0" + intl-messageformat "^10.1.0" + +"@internationalized/number@^3.2.1": + version "3.2.1" + resolved "https://registry.yarnpkg.com/@internationalized/number/-/number-3.2.1.tgz#570e4010544a84a8225e65b34a689a36187caaa8" + integrity sha512-hK30sfBlmB1aIe3/OwAPg9Ey0DjjXvHEiGVhNaOiBJl31G0B6wMaX8BN3ibzdlpyRNE9p7X+3EBONmxtJO9Yfg== + dependencies: + "@swc/helpers" "^0.5.0" + +"@internationalized/string@^3.1.1": + version "3.1.1" + resolved "https://registry.yarnpkg.com/@internationalized/string/-/string-3.1.1.tgz#2ab7372d58bbb7ffd3de62fc2a311e4690186981" + integrity sha512-fvSr6YRoVPgONiVIUhgCmIAlifMVCeej/snPZVzbzRPxGpHl3o1GRe+d/qh92D8KhgOciruDUH8I5mjdfdjzfA== + dependencies: + "@swc/helpers" "^0.5.0" + "@istanbuljs/load-nyc-config@^1.0.0": version "1.1.0" resolved "https://registry.yarnpkg.com/@istanbuljs/load-nyc-config/-/load-nyc-config-1.1.0.tgz#fd3db1d59ecf7cf121e80650bb86712f9b55eced" @@ -3326,6 +3394,1022 @@ prop-types "^15.6.1" react-lifecycles-compat "^3.0.4" +"@react-aria/breadcrumbs@^3.5.3": + version "3.5.3" + resolved "https://registry.yarnpkg.com/@react-aria/breadcrumbs/-/breadcrumbs-3.5.3.tgz#05d4d811d7a665ccf6b0b411a2c0ab0f4fb4638e" + integrity sha512-rmkApAflZm7Finn3vxLGv7MbsMaPo5Bn7/lf8GBztNfzmLWP/dAA5bgvi1sj1T6sWJOuFJT8u04ImUwBCLh8cQ== + dependencies: + "@react-aria/i18n" "^3.8.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/link" "^3.5.2" + "@react-aria/utils" "^3.18.0" + "@react-types/breadcrumbs" "^3.6.0" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/button@^3.8.0": + version "3.8.0" + resolved "https://registry.yarnpkg.com/@react-aria/button/-/button-3.8.0.tgz#24ccdee450f588d1edeaea3045b0755ae54cc2ce" + integrity sha512-QdvXTQgn+QEWOHoMbUIPXSBIN5P2r1zthRvqDJMTCzuT0I6LbNAq7RoojEbRrcn0DbTa/nZPzOOYsZXjgteRdw== + dependencies: + "@react-aria/focus" "^3.13.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/utils" "^3.18.0" + "@react-stately/toggle" "^3.6.0" + "@react-types/button" "^3.7.3" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/calendar@^3.4.0": + version "3.4.0" + resolved "https://registry.yarnpkg.com/@react-aria/calendar/-/calendar-3.4.0.tgz#7415132eb97871ce86d566a92ec0bf8e5d4f45e6" + integrity sha512-Ly+9KsOXWZTlOYDZeIYCWNuMZg7ZiJC497Z4U3SqaWmDsZaqwU8ZnLmZ1xUWq1cYvK9rnWPnnpby1JUgttY9RA== + dependencies: + "@internationalized/date" "^3.3.0" + "@react-aria/i18n" "^3.8.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/live-announcer" "^3.3.1" + "@react-aria/utils" "^3.18.0" + "@react-stately/calendar" "^3.3.0" + "@react-types/button" "^3.7.3" + "@react-types/calendar" "^3.3.0" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/checkbox@^3.9.2": + version "3.9.2" + resolved "https://registry.yarnpkg.com/@react-aria/checkbox/-/checkbox-3.9.2.tgz#bb21d2d6142f8ab169f40720c42e9c3eec22da51" + integrity sha512-gpvC+EnrxcQ9wupnoXsIDUmhSeBpxWtfRIYYypn6Ta6NY9Ubkh4H/8xE9/27nhJltHf5rzEcLfKg4QlEftab/w== + dependencies: + "@react-aria/label" "^3.6.0" + "@react-aria/toggle" "^3.6.2" + "@react-aria/utils" "^3.18.0" + "@react-stately/checkbox" "^3.4.3" + "@react-stately/toggle" "^3.6.0" + "@react-types/checkbox" "^3.4.4" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/combobox@^3.6.2": + version "3.6.2" + resolved "https://registry.yarnpkg.com/@react-aria/combobox/-/combobox-3.6.2.tgz#569382f6e1f3ea4e716994c3c5be86b2edca7545" + integrity sha512-SWbA2vH26zcrZDbXdPJtZNR6ywYPdf4LU8/7IKLs1Iv7mrlICr9Cmeywiu2RuFRosuR1hGSy1hibBTgPO6V/sw== + dependencies: + "@react-aria/i18n" "^3.8.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/listbox" "^3.10.0" + "@react-aria/live-announcer" "^3.3.1" + "@react-aria/menu" "^3.10.0" + "@react-aria/overlays" "^3.15.0" + "@react-aria/selection" "^3.16.0" + "@react-aria/textfield" "^3.10.0" + "@react-aria/utils" "^3.18.0" + "@react-stately/collections" "^3.9.0" + "@react-stately/combobox" "^3.5.2" + "@react-stately/layout" "^3.12.2" + "@react-types/button" "^3.7.3" + "@react-types/combobox" "^3.6.2" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/datepicker@^3.5.0": + version "3.5.0" + resolved "https://registry.yarnpkg.com/@react-aria/datepicker/-/datepicker-3.5.0.tgz#0ed4f595f7bffaa1b44613dcede4fd845213774d" + integrity sha512-oUfLbfFwe5XgS2Womx0t0gA8797mGQjjxZAGa9lGSNGFx26NOfhWBh24lAYQzQnZ5ot/DxDSJmzLjN6WEWv9pQ== + dependencies: + "@internationalized/date" "^3.3.0" + "@internationalized/number" "^3.2.1" + "@internationalized/string" "^3.1.1" + "@react-aria/focus" "^3.13.0" + "@react-aria/i18n" "^3.8.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/label" "^3.6.0" + "@react-aria/spinbutton" "^3.5.0" + "@react-aria/utils" "^3.18.0" + "@react-stately/datepicker" "^3.5.0" + "@react-types/button" "^3.7.3" + "@react-types/calendar" "^3.3.0" + "@react-types/datepicker" "^3.4.0" + "@react-types/dialog" "^3.5.3" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/dialog@^3.5.3": + version "3.5.3" + resolved "https://registry.yarnpkg.com/@react-aria/dialog/-/dialog-3.5.3.tgz#50c3b49906706e366cb5feae1089e6b7bf51fef9" + integrity sha512-wXpAqnt6TtR4X/5Xk5HCTBM0qyPcF2bXFQ5z2gSwl1olgoQ5znZEgMqMLbMmwb4dsWGGtAueULs6fVZk766ygA== + dependencies: + "@react-aria/focus" "^3.13.0" + "@react-aria/overlays" "^3.15.0" + "@react-aria/utils" "^3.18.0" + "@react-stately/overlays" "^3.6.0" + "@react-types/dialog" "^3.5.3" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/dnd@^3.3.0": + version "3.3.0" + resolved "https://registry.yarnpkg.com/@react-aria/dnd/-/dnd-3.3.0.tgz#9f949671dddb5c25ef6fbc4a76c8199dff7329d2" + integrity sha512-rk46inb6XdVR5cIFzuMoqUfdqgqb+GHOIFGDiwhHYONeCdvQKD31ztQZ78yITORmPOmjrnn6r2V3GQ6Oz54WSQ== + dependencies: + "@internationalized/string" "^3.1.1" + "@react-aria/i18n" "^3.8.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/live-announcer" "^3.3.1" + "@react-aria/overlays" "^3.15.0" + "@react-aria/utils" "^3.18.0" + "@react-aria/visually-hidden" "^3.8.2" + "@react-stately/dnd" "^3.2.2" + "@react-types/button" "^3.7.3" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/focus@^3.13.0": + version "3.13.0" + resolved "https://registry.yarnpkg.com/@react-aria/focus/-/focus-3.13.0.tgz#0134112d52a83a53f15b5f7e7435833c6a69d913" + integrity sha512-9DW7RqgbFWiImZmkmTIJGe9LrQBqEeLYwlKY+F1FTVXerIPiCCQ3JO3ESEa4lFMmkaHoueFLUrq2jkYjRNqoTw== + dependencies: + "@react-aria/interactions" "^3.16.0" + "@react-aria/utils" "^3.18.0" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + clsx "^1.1.1" + +"@react-aria/grid@^3.8.0": + version "3.8.0" + resolved "https://registry.yarnpkg.com/@react-aria/grid/-/grid-3.8.0.tgz#5b13c952f449f21ae9c3b5bee72376f4974675ab" + integrity sha512-7z1xFAbLPgUPROrXwuJk94STQPQ/K8rCLshhwTAg70uFVCPNnrm3jxQ6vE/lddPB+yss9Ee33GwSCrEXdzJkTw== + dependencies: + "@react-aria/focus" "^3.13.0" + "@react-aria/i18n" "^3.8.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/live-announcer" "^3.3.1" + "@react-aria/selection" "^3.16.0" + "@react-aria/utils" "^3.18.0" + "@react-stately/collections" "^3.9.0" + "@react-stately/grid" "^3.7.0" + "@react-stately/selection" "^3.13.2" + "@react-stately/virtualizer" "^3.6.0" + "@react-types/checkbox" "^3.4.4" + "@react-types/grid" "^3.1.8" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/gridlist@^3.5.0": + version "3.5.0" + resolved "https://registry.yarnpkg.com/@react-aria/gridlist/-/gridlist-3.5.0.tgz#79047c1f8fca73eb9068ef467d42ed30d972b941" + integrity sha512-xBCWyTtJNdUKSSUWXPMEi4lTnM1NRUlEJNi0eTNPIQVZOwQ7AgkEOD6uI+C6mgBL8q0oJwyIAfhK3zdwUCQSPg== + dependencies: + "@react-aria/focus" "^3.13.0" + "@react-aria/grid" "^3.8.0" + "@react-aria/i18n" "^3.8.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/selection" "^3.16.0" + "@react-aria/utils" "^3.18.0" + "@react-stately/list" "^3.9.0" + "@react-types/checkbox" "^3.4.4" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/i18n@^3.8.0": + version "3.8.0" + resolved "https://registry.yarnpkg.com/@react-aria/i18n/-/i18n-3.8.0.tgz#fe0c6b9ad9fe1e8a139c4d514d4240164c699bf8" + integrity sha512-zeohg7d66zPLnGQl1rJuVJJ/gP7GmUMxEKIFRwE+rg2u02ldKxJMSb8QKGo605QpFWqo7CuuWYvKJP5Mj+Em/w== + dependencies: + "@internationalized/date" "^3.3.0" + "@internationalized/message" "^3.1.1" + "@internationalized/number" "^3.2.1" + "@internationalized/string" "^3.1.1" + "@react-aria/ssr" "^3.7.0" + "@react-aria/utils" "^3.18.0" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/interactions@^3.16.0": + version "3.16.0" + resolved "https://registry.yarnpkg.com/@react-aria/interactions/-/interactions-3.16.0.tgz#d3ed51df60d68090114322b853bcc3e9f5f51619" + integrity sha512-vXANFKVd6ONqNw8U+ZWbSA8lrduCOXw7cWsYosTa5dZ24ZJfRfbhlvRe8CaAKMhB/rOOmvTLaAwdIPia6JtLDg== + dependencies: + "@react-aria/ssr" "^3.7.0" + "@react-aria/utils" "^3.18.0" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/label@^3.6.0": + version "3.6.0" + resolved "https://registry.yarnpkg.com/@react-aria/label/-/label-3.6.0.tgz#9bf353cd0f3577f14285e8032dddcfe1fc37a8e0" + integrity sha512-o6Z9YAbvywj/b995HOl7fS9vf8FVmhWiJkKwFyCi/M1A7FXBqgtPcdPDNHaaKOhvQcwnLs4iMVMJwZdn/dLVDA== + dependencies: + "@react-aria/utils" "^3.18.0" + "@react-types/label" "^3.7.4" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/link@^3.5.2": + version "3.5.2" + resolved "https://registry.yarnpkg.com/@react-aria/link/-/link-3.5.2.tgz#68b99721eeddffb87c42541419f08333eada37d9" + integrity sha512-CCFP11Uietro6TUZpWBoq3Ql/6qss/ODC5XM6oNxckj72IHruFIj8V7Y0tL5x0aE6h38hlKcDf8NCxkQqz2edg== + dependencies: + "@react-aria/focus" "^3.13.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/utils" "^3.18.0" + "@react-types/link" "^3.4.3" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/listbox@^3.10.0": + version "3.10.0" + resolved "https://registry.yarnpkg.com/@react-aria/listbox/-/listbox-3.10.0.tgz#cf52ebe04a3f9472f505dcf22564070ae76a811b" + integrity sha512-4NelMDZAPoy2W4uoKZsMpdrC6XJQiZU+vpuhnzUT1eWTneDsEHKHSHQFtymoe8VrUEPrCV16EeMk1vRVvjCfAw== + dependencies: + "@react-aria/focus" "^3.13.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/label" "^3.6.0" + "@react-aria/selection" "^3.16.0" + "@react-aria/utils" "^3.18.0" + "@react-stately/collections" "^3.9.0" + "@react-stately/list" "^3.9.0" + "@react-types/listbox" "^3.4.2" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/live-announcer@^3.3.1": + version "3.3.1" + resolved "https://registry.yarnpkg.com/@react-aria/live-announcer/-/live-announcer-3.3.1.tgz#bf864b8820fb02daaeefc1c972782a0174fd60b9" + integrity sha512-hsc77U7S16trM86d+peqJCOCQ7/smO1cybgdpOuzXyiwcHQw8RQ4GrXrS37P4Ux/44E9nMZkOwATQRT2aK8+Ew== + dependencies: + "@swc/helpers" "^0.5.0" + +"@react-aria/menu@^3.10.0": + version "3.10.0" + resolved "https://registry.yarnpkg.com/@react-aria/menu/-/menu-3.10.0.tgz#7f94e84c3ed2e18efa4b537e20e1e4125e9e6f51" + integrity sha512-zOOOXvx21aGSxZsXvLa3NV48hLk0jBC/zu5WZHT0Mo/wAe0+43f8p/U3AT8Gc4WnxYbIestcdLaIwgeagSoLtQ== + dependencies: + "@react-aria/focus" "^3.13.0" + "@react-aria/i18n" "^3.8.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/overlays" "^3.15.0" + "@react-aria/selection" "^3.16.0" + "@react-aria/utils" "^3.18.0" + "@react-stately/collections" "^3.9.0" + "@react-stately/menu" "^3.5.3" + "@react-stately/tree" "^3.7.0" + "@react-types/button" "^3.7.3" + "@react-types/menu" "^3.9.2" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/meter@^3.4.3": + version "3.4.3" + resolved "https://registry.yarnpkg.com/@react-aria/meter/-/meter-3.4.3.tgz#918147208870c3ccb85fc55ab83867a67fa1fe96" + integrity sha512-1RUr93cNfMqTfyGtQ+SqFYLqlOqza6TEmXmtdCExPuZVRUZRjQRkqPoYuL8CPwHKlU4sbSlLiNeUu/HhV6pyTg== + dependencies: + "@react-aria/progress" "^3.4.3" + "@react-types/meter" "^3.3.2" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/numberfield@^3.6.0": + version "3.6.0" + resolved "https://registry.yarnpkg.com/@react-aria/numberfield/-/numberfield-3.6.0.tgz#7e140e7631f8b22f1f3d40ce5be1512e547a3849" + integrity sha512-LbtRS/JciPicYLjqAP87gufInzZ2rlOQlKu0tQK8l/Hwc2cPOWUldDXbrGgxrXwbMxfEASmfI6qYz8uhTGmIyw== + dependencies: + "@react-aria/i18n" "^3.8.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/live-announcer" "^3.3.1" + "@react-aria/spinbutton" "^3.5.0" + "@react-aria/textfield" "^3.10.0" + "@react-aria/utils" "^3.18.0" + "@react-stately/numberfield" "^3.5.0" + "@react-types/button" "^3.7.3" + "@react-types/numberfield" "^3.4.2" + "@react-types/shared" "^3.18.1" + "@react-types/textfield" "^3.7.2" + "@swc/helpers" "^0.5.0" + +"@react-aria/overlays@^3.15.0": + version "3.15.0" + resolved "https://registry.yarnpkg.com/@react-aria/overlays/-/overlays-3.15.0.tgz#9ae71209735b9020921c02a6603bae58f25bcbc9" + integrity sha512-MeLn74GvXZfi881NSx5sSd5eTduki/PMk4vPvMNp2Xm+9nGHm0FbGu2GMIGgarYy5JC7l/bOO7H01YrS4AozPg== + dependencies: + "@react-aria/focus" "^3.13.0" + "@react-aria/i18n" "^3.8.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/ssr" "^3.7.0" + "@react-aria/utils" "^3.18.0" + "@react-aria/visually-hidden" "^3.8.2" + "@react-stately/overlays" "^3.6.0" + "@react-types/button" "^3.7.3" + "@react-types/overlays" "^3.8.0" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/progress@^3.4.3": + version "3.4.3" + resolved "https://registry.yarnpkg.com/@react-aria/progress/-/progress-3.4.3.tgz#ea945c9c9b1fc23d3aff78d303da304a53bab0c5" + integrity sha512-u8aUrnnQGsRZWx5vBfBhf70TeGeN/gEJzcthef5YDUQZG8O2IDhzR1GLqBmn1RvdcSDvBdhRSpMXd+6bL1WzGw== + dependencies: + "@react-aria/i18n" "^3.8.0" + "@react-aria/label" "^3.6.0" + "@react-aria/utils" "^3.18.0" + "@react-types/progress" "^3.4.1" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/radio@^3.6.2": + version "3.6.2" + resolved "https://registry.yarnpkg.com/@react-aria/radio/-/radio-3.6.2.tgz#c1dd6a332f0c9fc1c7acc6094db28b92091c8868" + integrity sha512-R7vyh0G2HaUe0+SGa/LDMYuGnNC/15L6yfuljpP8ZUDPw9bR/6BuE1BDCI0ov1EXQ1lQ/vcvZMbf78OC72vPrg== + dependencies: + "@react-aria/focus" "^3.13.0" + "@react-aria/i18n" "^3.8.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/label" "^3.6.0" + "@react-aria/utils" "^3.18.0" + "@react-stately/radio" "^3.8.2" + "@react-types/radio" "^3.4.2" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/searchfield@^3.5.3": + version "3.5.3" + resolved "https://registry.yarnpkg.com/@react-aria/searchfield/-/searchfield-3.5.3.tgz#8592ea39b4ba4eaf187a09d5f97676c32067c342" + integrity sha512-OqkXTZrjesqRxBR0WIOh0cezwmuXDQpsdua9nnGj0+8BIGCHuxvUOpw1HA3eTsf4AbZfygngC7pMT1lOR21upg== + dependencies: + "@react-aria/i18n" "^3.8.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/textfield" "^3.10.0" + "@react-aria/utils" "^3.18.0" + "@react-stately/searchfield" "^3.4.3" + "@react-types/button" "^3.7.3" + "@react-types/searchfield" "^3.4.2" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/select@^3.11.0": + version "3.11.0" + resolved "https://registry.yarnpkg.com/@react-aria/select/-/select-3.11.0.tgz#5180f5095c617ef8076e6395a6795e2c37e5af5b" + integrity sha512-UEYhw7wK4XoPMVbTa3UykPcri9GIV777WvXeKEykS1nMbJzu1I1LUE5py4ymhaI7DbpZ+gWZPTA0iot8IYQOWQ== + dependencies: + "@react-aria/i18n" "^3.8.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/label" "^3.6.0" + "@react-aria/listbox" "^3.10.0" + "@react-aria/menu" "^3.10.0" + "@react-aria/selection" "^3.16.0" + "@react-aria/utils" "^3.18.0" + "@react-aria/visually-hidden" "^3.8.2" + "@react-stately/select" "^3.5.2" + "@react-types/button" "^3.7.3" + "@react-types/select" "^3.8.1" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/selection@^3.16.0": + version "3.16.0" + resolved "https://registry.yarnpkg.com/@react-aria/selection/-/selection-3.16.0.tgz#827cf8056b218813dafeca48d10e9d91b475ee12" + integrity sha512-qQ4X0+wtLz0+qjsoj1T0hVehA0CbZdu0Ax+lCzWmj+ZDivtdeNpVQl+K0yj9p95MnzLgIbnY7zU2zDQrYqKDOQ== + dependencies: + "@react-aria/focus" "^3.13.0" + "@react-aria/i18n" "^3.8.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/utils" "^3.18.0" + "@react-stately/collections" "^3.9.0" + "@react-stately/selection" "^3.13.2" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/separator@^3.3.3": + version "3.3.3" + resolved "https://registry.yarnpkg.com/@react-aria/separator/-/separator-3.3.3.tgz#3d188f9a74470e6809464d02a05d3b395c913c75" + integrity sha512-kBGEXSSUiJLPS9foS5/7jgzpdp3/Yb1aMvVuvRGuNxDUsPAmvaYUT3qZ44Zf3hoxKfRFb4452KcoZ03w3Jfcvg== + dependencies: + "@react-aria/utils" "^3.18.0" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/slider@^3.5.0": + version "3.5.0" + resolved "https://registry.yarnpkg.com/@react-aria/slider/-/slider-3.5.0.tgz#9b6973af0b6074bb86624eed8a27e2a013ad4f92" + integrity sha512-7qvzWZzwSww/+kLiSC8UJo4csHo8ndFzpzE2jUOom+hKMFomg5gIF4vqJI3ieWwF6rm6bbLmhxN4GvmNebVMwA== + dependencies: + "@react-aria/focus" "^3.13.0" + "@react-aria/i18n" "^3.8.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/label" "^3.6.0" + "@react-aria/utils" "^3.18.0" + "@react-stately/radio" "^3.8.2" + "@react-stately/slider" "^3.4.0" + "@react-types/radio" "^3.4.2" + "@react-types/shared" "^3.18.1" + "@react-types/slider" "^3.5.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/spinbutton@^3.5.0": + version "3.5.0" + resolved "https://registry.yarnpkg.com/@react-aria/spinbutton/-/spinbutton-3.5.0.tgz#85f27dfe2625c3b9b4c10fd115fa8a31f87c4b38" + integrity sha512-WWLPiJd2nbv17dSbcbOm+TXlLO9ZIEA86ft/CTkvRYRG48kDn++4f16QcA0Gr+7dKdLQGbKkCf61jMJ3q8t5Hw== + dependencies: + "@react-aria/i18n" "^3.8.0" + "@react-aria/live-announcer" "^3.3.1" + "@react-aria/utils" "^3.18.0" + "@react-types/button" "^3.7.3" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/ssr@^3.7.0": + version "3.7.0" + resolved "https://registry.yarnpkg.com/@react-aria/ssr/-/ssr-3.7.0.tgz#7eda2964ab792dc1c3a1fdacbf5bfb185590e9a5" + integrity sha512-bfufjg4ESE5giN+Fxj1XIzS5f/YIhqcGc+Ve+vUUKU8xZ8t/Xtjlv8F3kjqDBQdk//n3mluFY7xG1wQVB9rMLQ== + dependencies: + "@swc/helpers" "^0.5.0" + +"@react-aria/switch@^3.5.2": + version "3.5.2" + resolved "https://registry.yarnpkg.com/@react-aria/switch/-/switch-3.5.2.tgz#b47208e862343998a5f25baaaeb7bc9cbc63a09d" + integrity sha512-mhV4Ip3t241s7gp4ETDe61AsSDox5TZXkiWt8add65p/LMESYBju9hGtbrxkMNCW62AuYCTAIadHoEOpy9HIIg== + dependencies: + "@react-aria/toggle" "^3.6.2" + "@react-stately/toggle" "^3.6.0" + "@react-types/switch" "^3.3.2" + "@swc/helpers" "^0.5.0" + +"@react-aria/table@^3.10.0": + version "3.10.0" + resolved "https://registry.yarnpkg.com/@react-aria/table/-/table-3.10.0.tgz#c11ab57a2f32cd89258f129896256552ef98472a" + integrity sha512-N42Ill9fdjeWKC/516fPMpPa79B0c+teFJ/fhcROLFrlwotgLKwndIG/InkE1L6FKeiJ8JL33FgUnxfRGafa8Q== + dependencies: + "@react-aria/focus" "^3.13.0" + "@react-aria/grid" "^3.8.0" + "@react-aria/i18n" "^3.8.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/live-announcer" "^3.3.1" + "@react-aria/selection" "^3.16.0" + "@react-aria/utils" "^3.18.0" + "@react-aria/visually-hidden" "^3.8.2" + "@react-stately/collections" "^3.9.0" + "@react-stately/table" "^3.10.0" + "@react-stately/virtualizer" "^3.6.0" + "@react-types/checkbox" "^3.4.4" + "@react-types/grid" "^3.1.8" + "@react-types/shared" "^3.18.1" + "@react-types/table" "^3.7.0" + "@swc/helpers" "^0.5.0" + +"@react-aria/tabs@^3.6.1": + version "3.6.1" + resolved "https://registry.yarnpkg.com/@react-aria/tabs/-/tabs-3.6.1.tgz#7f45402ca58deec492f78db4f8f80a82e3d5d630" + integrity sha512-P/P3HA+b1Q917hVvXn1kzFl3dQnMTwYR8JKY5gjfjLQsAAEfJzSO3wLR0vNSp6Cz2FTAVCH4yzwP1G+bRLZVnw== + dependencies: + "@react-aria/focus" "^3.13.0" + "@react-aria/i18n" "^3.8.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/selection" "^3.16.0" + "@react-aria/utils" "^3.18.0" + "@react-stately/list" "^3.9.0" + "@react-stately/tabs" "^3.5.0" + "@react-types/shared" "^3.18.1" + "@react-types/tabs" "^3.3.0" + "@swc/helpers" "^0.5.0" + +"@react-aria/tag@^3.1.0": + version "3.1.0" + resolved "https://registry.yarnpkg.com/@react-aria/tag/-/tag-3.1.0.tgz#9f59108c1ccddc4eb179efdfc3d6673362e3222e" + integrity sha512-N3h34k23jK7xuMh4eMDJoUG1xsNUw6zz+r9mmSMMLCxU38w+RH27ywEpKheW25M7LhfggqTjbjnPOpPpBnrENQ== + dependencies: + "@react-aria/gridlist" "^3.5.0" + "@react-aria/i18n" "^3.8.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/label" "^3.6.0" + "@react-aria/selection" "^3.16.0" + "@react-aria/utils" "^3.18.0" + "@react-stately/list" "^3.9.0" + "@react-types/button" "^3.7.3" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-aria/textfield@^3.10.0": + version "3.10.0" + resolved "https://registry.yarnpkg.com/@react-aria/textfield/-/textfield-3.10.0.tgz#bb65ca96cb1a88f5a379464ce0fb4bd823e0945a" + integrity sha512-TYFgDTlxrljakD0TGOkoSCvot9BfVCZSrTKy3+/PICSTkPIzXThLIQmpX6yObLMXQSNW6SvBCl6CMetJMJHcbw== + dependencies: + "@react-aria/focus" "^3.13.0" + "@react-aria/label" "^3.6.0" + "@react-aria/utils" "^3.18.0" + "@react-types/shared" "^3.18.1" + "@react-types/textfield" "^3.7.2" + "@swc/helpers" "^0.5.0" + +"@react-aria/toggle@^3.6.2": + version "3.6.2" + resolved "https://registry.yarnpkg.com/@react-aria/toggle/-/toggle-3.6.2.tgz#901ec6098888ab3fdf19dc6b0bfe2b1409edc7dc" + integrity sha512-bRz/ybajeLEsJLt1ARRL7CtWs6bwvkNLWy/wpJnH2TJ3+lMpH+EKbWBVJoAP7wQ5jIVVpxKJLhpf6w6x8ZLtdw== + dependencies: + "@react-aria/focus" "^3.13.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/utils" "^3.18.0" + "@react-stately/toggle" "^3.6.0" + "@react-types/checkbox" "^3.4.4" + "@react-types/shared" "^3.18.1" + "@react-types/switch" "^3.3.2" + "@swc/helpers" "^0.5.0" + +"@react-aria/tooltip@^3.6.0": + version "3.6.0" + resolved "https://registry.yarnpkg.com/@react-aria/tooltip/-/tooltip-3.6.0.tgz#7f0cae6759ac573b745987950bf49098b7dd775d" + integrity sha512-D38C7M58ZXWmY2+TXDczbbYRj9/KhIDyE/rLI0KhZR/iXDOJvmB9DT8HZuZLPsntq4Wl6mpmfPggT/R91nvR2Q== + dependencies: + "@react-aria/focus" "^3.13.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/utils" "^3.18.0" + "@react-stately/tooltip" "^3.4.2" + "@react-types/shared" "^3.18.1" + "@react-types/tooltip" "^3.4.2" + "@swc/helpers" "^0.5.0" + +"@react-aria/utils@^3.18.0": + version "3.18.0" + resolved "https://registry.yarnpkg.com/@react-aria/utils/-/utils-3.18.0.tgz#50e555ac049f47bff25bc2cef1078352e853d229" + integrity sha512-eLs0ExzXx/D3P9qe6ophJ87ZFcI1oRTyRa51M59pCad7grrpk0gWcYrBjMwcR457YWOQQWCeLuq8QJl2QxCW6Q== + dependencies: + "@react-aria/ssr" "^3.7.0" + "@react-stately/utils" "^3.7.0" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + clsx "^1.1.1" + +"@react-aria/visually-hidden@^3.8.2": + version "3.8.2" + resolved "https://registry.yarnpkg.com/@react-aria/visually-hidden/-/visually-hidden-3.8.2.tgz#96601a0b8d301348dec4da89789f94723de6b034" + integrity sha512-MFTqqSvPfc8u3YlzNfQ3ITX4eVQpZDiSqLPKj3Zyr86CKlba5iG8WGqjiJhD2GNHlvmcF/mITXTsNzm0KxFE7g== + dependencies: + "@react-aria/interactions" "^3.16.0" + "@react-aria/utils" "^3.18.0" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + clsx "^1.1.1" + +"@react-stately/calendar@^3.3.0": + version "3.3.0" + resolved "https://registry.yarnpkg.com/@react-stately/calendar/-/calendar-3.3.0.tgz#e4ca329a4a1a880a5359d32c4b6a706cc3aeb147" + integrity sha512-fnqdxCTlkikgldEyW8ciPNUWhqaUsQKTx6X6XGob6VCwK59k0LmdlgZX+dXj0q2ezC+w4lnvz8TzpoRQ7GY8lw== + dependencies: + "@internationalized/date" "^3.3.0" + "@react-stately/utils" "^3.7.0" + "@react-types/calendar" "^3.3.0" + "@react-types/datepicker" "^3.4.0" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-stately/checkbox@^3.4.3": + version "3.4.3" + resolved "https://registry.yarnpkg.com/@react-stately/checkbox/-/checkbox-3.4.3.tgz#ffbf8109ca903e502a1e42cf0863e22c8f75c07e" + integrity sha512-TEd50vrUTHZWt8qO7ySLG2MlWJbsCvyx+pA1VhLJw6hRfjqorAjmCcpV2sEdu3EkLG7hA/Jw+7iBmGPlxmBN6A== + dependencies: + "@react-stately/toggle" "^3.6.0" + "@react-stately/utils" "^3.7.0" + "@react-types/checkbox" "^3.4.4" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-stately/collections@^3.9.0": + version "3.9.0" + resolved "https://registry.yarnpkg.com/@react-stately/collections/-/collections-3.9.0.tgz#8a9e621fb10e370bd0329f96dd141bc6dcd0e548" + integrity sha512-CBpXSKmCpbIFpIToVFlzo2R1/Cj+dcU8gWw2KfPyyJX+2wHKkDIvtK01EAytDLX/vkE8O+fD5a7qMZ3pf8gpeA== + dependencies: + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-stately/combobox@^3.5.2": + version "3.5.2" + resolved "https://registry.yarnpkg.com/@react-stately/combobox/-/combobox-3.5.2.tgz#df244fef38efc4bf8e5b2195110f56e0443bf9e4" + integrity sha512-vMp3/xWv9a3DglTvvcQsJup3zZkmIANbf799j21Kc6Z4DXs+ohU81Qg5q9Z/5QuTEPsJFFv7vKXtb+VlP/TK2g== + dependencies: + "@react-stately/collections" "^3.9.0" + "@react-stately/list" "^3.9.0" + "@react-stately/menu" "^3.5.3" + "@react-stately/select" "^3.5.2" + "@react-stately/utils" "^3.7.0" + "@react-types/combobox" "^3.6.2" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-stately/data@^3.10.0": + version "3.10.0" + resolved "https://registry.yarnpkg.com/@react-stately/data/-/data-3.10.0.tgz#a87206f29d517c7a8946e3ea2f1f5ab12f24e698" + integrity sha512-B5GqSNvvgTxVziR2nJW84HhvLOEI9AYPm/cyEdkumams7BFP8XEQStSS/SiRCMuufdHe4pnzHAQr5ynfRObwkg== + dependencies: + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-stately/datepicker@^3.5.0": + version "3.5.0" + resolved "https://registry.yarnpkg.com/@react-stately/datepicker/-/datepicker-3.5.0.tgz#eb43bf0e842e69c3390df3933869bf27fb337609" + integrity sha512-GPscIz4jP9hDa1ChgMAWAt8g8mCpjILmSgfyuIZXegPZfa3ryKuQutYU/JGJrBom1xablAgeHIN1AWpve+4f1w== + dependencies: + "@internationalized/date" "^3.3.0" + "@internationalized/string" "^3.1.1" + "@react-stately/overlays" "^3.6.0" + "@react-stately/utils" "^3.7.0" + "@react-types/datepicker" "^3.4.0" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-stately/dnd@^3.2.2": + version "3.2.2" + resolved "https://registry.yarnpkg.com/@react-stately/dnd/-/dnd-3.2.2.tgz#d33a80ce95c757c8e92ddd7f2e4f4cc897562e74" + integrity sha512-1Eb4ZGh2xzTLDBV/Y+c/UoOvd2A9rglj+5o1Vo7HuIVWWc8tDJXq499B7rp/5JPcfQspF5OI4h08OWZFlPd/Ig== + dependencies: + "@react-stately/selection" "^3.13.2" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-stately/grid@^3.7.0": + version "3.7.0" + resolved "https://registry.yarnpkg.com/@react-stately/grid/-/grid-3.7.0.tgz#0f757a7010460d92d3373d769194d871a5cf4ae3" + integrity sha512-3eb7+7p9Xh/+luUOyieY2bM4CsARA8WnRB7c2++gh4dh9AEpZV4VGICGTe35+dJYr+9pbYQqVMEcEFUOaJJzZw== + dependencies: + "@react-stately/collections" "^3.9.0" + "@react-stately/selection" "^3.13.2" + "@react-types/grid" "^3.1.8" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-stately/layout@^3.12.2": + version "3.12.2" + resolved "https://registry.yarnpkg.com/@react-stately/layout/-/layout-3.12.2.tgz#80f72128c1cc8890a7d507a767889d32ee092b55" + integrity sha512-9AGA11G5+Uo/mQoJR90lbqTR4+UFSl13jQMtqom/BYxkFGrHh3gWSUWEmg2h+n1Qa1q+oJjgaeQ9bxqlrR/wpQ== + dependencies: + "@react-stately/collections" "^3.9.0" + "@react-stately/table" "^3.10.0" + "@react-stately/virtualizer" "^3.6.0" + "@react-types/grid" "^3.1.8" + "@react-types/shared" "^3.18.1" + "@react-types/table" "^3.7.0" + "@swc/helpers" "^0.5.0" + +"@react-stately/list@^3.9.0": + version "3.9.0" + resolved "https://registry.yarnpkg.com/@react-stately/list/-/list-3.9.0.tgz#725239c3ef5d526570bfecf274d11dd63c35005f" + integrity sha512-9DNV02zFEkJG38AtHyhvGMfpJQGwV0KMyMObs+KEujzCh+rmHdTu1rWdjzLw1ve+ecESK8UMsF4Kt6wwO0Qi6g== + dependencies: + "@react-stately/collections" "^3.9.0" + "@react-stately/selection" "^3.13.2" + "@react-stately/utils" "^3.7.0" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-stately/menu@^3.5.3": + version "3.5.3" + resolved "https://registry.yarnpkg.com/@react-stately/menu/-/menu-3.5.3.tgz#c25fc231502cae639f5b557a9e1d8016a7e474cc" + integrity sha512-RFgwVD/4BgTtJkexi1WaHpAEkQWZPvpyri0LQUgXWVqBf9PpjB8wigF3XBLMDNkL+YXE0QtzQZBNS1nJECf7rg== + dependencies: + "@react-stately/overlays" "^3.6.0" + "@react-stately/utils" "^3.7.0" + "@react-types/menu" "^3.9.2" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-stately/numberfield@^3.5.0": + version "3.5.0" + resolved "https://registry.yarnpkg.com/@react-stately/numberfield/-/numberfield-3.5.0.tgz#31940c1be18d96173ff0f410a73298fbcfee52f4" + integrity sha512-2R39hXQpQzoVDl1r3TZDKUEKf6lHbhiOpcBOYTPOne+YJOyMXQ6PnXAOTVuIcgTNdagukhXQVoDYH2B/1FvJOA== + dependencies: + "@internationalized/number" "^3.2.1" + "@react-stately/utils" "^3.7.0" + "@react-types/numberfield" "^3.4.2" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-stately/overlays@^3.6.0": + version "3.6.0" + resolved "https://registry.yarnpkg.com/@react-stately/overlays/-/overlays-3.6.0.tgz#d53fedf3fec0e3a4db1c2a3b643b5cad09f9a88c" + integrity sha512-0Bgy4xwCXKM+jkHAGJMN19ZFXNgKstf6qJozfH79j3E5erY30ZStwT7gbAnwv112zFUQLHBKo+3wJTGWuHgs8Q== + dependencies: + "@react-stately/utils" "^3.7.0" + "@react-types/overlays" "^3.8.0" + "@swc/helpers" "^0.5.0" + +"@react-stately/radio@^3.8.2": + version "3.8.2" + resolved "https://registry.yarnpkg.com/@react-stately/radio/-/radio-3.8.2.tgz#e7f541211f67fb821b4e47c16b8401f93034139d" + integrity sha512-tjlXask1IEGzzXwdc495K+wsHhyVhtaMhAeTbrdTD1a1fdg2g/jA0vWhN/KGO/CpnZT4vXGjJcY686Rmlrt9EQ== + dependencies: + "@react-stately/utils" "^3.7.0" + "@react-types/radio" "^3.4.2" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-stately/searchfield@^3.4.3": + version "3.4.3" + resolved "https://registry.yarnpkg.com/@react-stately/searchfield/-/searchfield-3.4.3.tgz#0ae239c38aede9f349030fb5932ad38c94d70f98" + integrity sha512-mTdbWGpOA7foZJwkiR0AP5beh66I1feHMQ9/7/3lR4ETqLQ29vVXte+jc3+RrlFy+Adup0Ziwzs3DMfMZ0rN8Q== + dependencies: + "@react-stately/utils" "^3.7.0" + "@react-types/searchfield" "^3.4.2" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-stately/select@^3.5.2": + version "3.5.2" + resolved "https://registry.yarnpkg.com/@react-stately/select/-/select-3.5.2.tgz#140be9edf4ff714e7fa7bee5e7093e5d8cbb58b5" + integrity sha512-hIDAXFNg+q8rGQy5YKEaOz4NoWsckoQoi18vY8u6VsFUIhfYaYL76x6zKbTwekZLYuroifH7Fv81tBvRZmXikQ== + dependencies: + "@react-stately/collections" "^3.9.0" + "@react-stately/list" "^3.9.0" + "@react-stately/menu" "^3.5.3" + "@react-stately/selection" "^3.13.2" + "@react-stately/utils" "^3.7.0" + "@react-types/select" "^3.8.1" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-stately/selection@^3.13.2": + version "3.13.2" + resolved "https://registry.yarnpkg.com/@react-stately/selection/-/selection-3.13.2.tgz#9b0b717b0da4c84ec412a0e5068f6798ec37ddbd" + integrity sha512-rVnseneG9XWuS0+JEsa0EhRfTZsupm9JiEuZHZ19YeLewjVdFpjgBMDZb8ZYoyilNXVjyUwaoq94FsOXotsg9w== + dependencies: + "@react-stately/collections" "^3.9.0" + "@react-stately/utils" "^3.7.0" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-stately/slider@^3.4.0": + version "3.4.0" + resolved "https://registry.yarnpkg.com/@react-stately/slider/-/slider-3.4.0.tgz#1d0a6498a69332703046a8ba85d2b630ddf6e21e" + integrity sha512-VvGJ1XkFIIEXP0eg9xqK/NztimBCSRmEqLgqlwzeDJAtuFXZzPRgJGrodGnqGmhoLsTFaY8YleLh/1hgf6rO0g== + dependencies: + "@react-aria/i18n" "^3.8.0" + "@react-aria/utils" "^3.18.0" + "@react-stately/utils" "^3.7.0" + "@react-types/shared" "^3.18.1" + "@react-types/slider" "^3.5.1" + "@swc/helpers" "^0.5.0" + +"@react-stately/table@^3.10.0": + version "3.10.0" + resolved "https://registry.yarnpkg.com/@react-stately/table/-/table-3.10.0.tgz#2a88459debd9dcd408a073561474277685d737d5" + integrity sha512-LDF97lZIkCDYNFw5Yz1eREedO9QerPDchxXUXlPVyjwLiZ4ADlhz6W/NTq6gm2PgrHljY/0+Kd5zEgVySLMTEw== + dependencies: + "@react-stately/collections" "^3.9.0" + "@react-stately/grid" "^3.7.0" + "@react-stately/selection" "^3.13.2" + "@react-types/grid" "^3.1.8" + "@react-types/shared" "^3.18.1" + "@react-types/table" "^3.7.0" + "@swc/helpers" "^0.5.0" + +"@react-stately/tabs@^3.5.0": + version "3.5.0" + resolved "https://registry.yarnpkg.com/@react-stately/tabs/-/tabs-3.5.0.tgz#21209e68f6ca93a32f90149d5d820ebde58142cc" + integrity sha512-N6B0+ZyW6mbmY/kHl0GKGj/i7MtA141A7yYJFSLDdvq1Hb2x7V1Y6gfl40FkSW4W9y3oQtKU+rTxV0EyjEJMWQ== + dependencies: + "@react-stately/list" "^3.9.0" + "@react-stately/utils" "^3.7.0" + "@react-types/shared" "^3.18.1" + "@react-types/tabs" "^3.3.0" + "@swc/helpers" "^0.5.0" + +"@react-stately/toggle@^3.6.0": + version "3.6.0" + resolved "https://registry.yarnpkg.com/@react-stately/toggle/-/toggle-3.6.0.tgz#d1cd5a316ee1ee23003c2ed950816b8d314239fe" + integrity sha512-w+Aqh78H9MLs0FDUYTjAzYhrHQWaDJ2zWjyg2oYcSvERES0+D0obmPvtJLWsFrJ8fHJrTmxd7ezVFBY9BbPeFQ== + dependencies: + "@react-stately/utils" "^3.7.0" + "@react-types/checkbox" "^3.4.4" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-stately/tooltip@^3.4.2": + version "3.4.2" + resolved "https://registry.yarnpkg.com/@react-stately/tooltip/-/tooltip-3.4.2.tgz#8659bb7f3324a54a2b739fb9a1f5b759ebeef5bf" + integrity sha512-tDkoYyEfdo44a3CoeiF794TFTs36d9faX0QvbR1QZ2KksjCMceOL5+26MlQjnhjEydYqw1X1YlTZbtMeor4uQw== + dependencies: + "@react-stately/overlays" "^3.6.0" + "@react-stately/utils" "^3.7.0" + "@react-types/tooltip" "^3.4.2" + "@swc/helpers" "^0.5.0" + +"@react-stately/tree@^3.7.0": + version "3.7.0" + resolved "https://registry.yarnpkg.com/@react-stately/tree/-/tree-3.7.0.tgz#fe658143cfec2d50921eeb7a9d2fad9c84b94dc8" + integrity sha512-oXOjJwy/o3XSJyBkudiEvnjWzto2jy48kmGjHCJ+B7Hv+WcbN9o7iAaHv11lOqMXRSpuF9gqox4ZZCASG+smIQ== + dependencies: + "@react-stately/collections" "^3.9.0" + "@react-stately/selection" "^3.13.2" + "@react-stately/utils" "^3.7.0" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-stately/utils@^3.7.0": + version "3.7.0" + resolved "https://registry.yarnpkg.com/@react-stately/utils/-/utils-3.7.0.tgz#ea99c2c4b5fba7e5079434a1de1ef53fbb21f6a8" + integrity sha512-VbApRiUV2rhozOfk0Qj9xt0qjVbQfLTgAzXLdrfeZSBnyIgo1bFRnjDpnDZKZUUCeGQcJJI03I9niaUtY+kwJQ== + dependencies: + "@swc/helpers" "^0.5.0" + +"@react-stately/virtualizer@^3.6.0": + version "3.6.0" + resolved "https://registry.yarnpkg.com/@react-stately/virtualizer/-/virtualizer-3.6.0.tgz#ab11a0263041f4d7e5b2ecf1165b68bed2972166" + integrity sha512-f78BQT9ZSD5Hpqf6axRoNQJFqV+JjMSV2VixMfhIAcqi/fn8rEN2j3g4SPdFzTtFf2FR3+AKdBFu5tsgtk1Tgw== + dependencies: + "@react-aria/utils" "^3.18.0" + "@react-types/shared" "^3.18.1" + "@swc/helpers" "^0.5.0" + +"@react-types/breadcrumbs@^3.6.0": + version "3.6.0" + resolved "https://registry.yarnpkg.com/@react-types/breadcrumbs/-/breadcrumbs-3.6.0.tgz#6a5b5e459597172d7f23f2ecbc9e11c94d2a3f2a" + integrity sha512-EnZk/f59yMQUmH2DW21uo3ajQ7nLEZ/sIMSfEZYP69CFe1by0RKi9aFRjJSrYjxRC0PSHTVPTjIG72KeBSsUGA== + dependencies: + "@react-types/link" "^3.4.3" + "@react-types/shared" "^3.18.1" + +"@react-types/button@^3.7.3": + version "3.7.3" + resolved "https://registry.yarnpkg.com/@react-types/button/-/button-3.7.3.tgz#00ad45ff0a304a6f6ef29a5d6adda73cea10942f" + integrity sha512-Fz1t/kYinHDunmct3tADD2h3UDBPZUfRE+zCzYiymz0g+v/zYHTAqnkWToTF9ptf8HIB5L2Z2VFYpeUHFfpWzg== + dependencies: + "@react-types/shared" "^3.18.1" + +"@react-types/calendar@^3.3.0": + version "3.3.0" + resolved "https://registry.yarnpkg.com/@react-types/calendar/-/calendar-3.3.0.tgz#d6975683cbbdc1241204ef6501686cbc3f80b6e8" + integrity sha512-5Qga+eixj+PembMwzcJmQlxif4XhSJJ54JcoyYHVf6mYLw3aE81Jc52OBi1FEWBJOW9YVOTk7VbWPFFF/oBI8A== + dependencies: + "@internationalized/date" "^3.3.0" + "@react-types/shared" "^3.18.1" + +"@react-types/checkbox@^3.4.4": + version "3.4.4" + resolved "https://registry.yarnpkg.com/@react-types/checkbox/-/checkbox-3.4.4.tgz#cf55e9fd0cabef6e4408d03b308c754e1add3bc1" + integrity sha512-rJNhbW4R9HTvdbF2oTZmqGiZ/WVP3/XsU4gae7tfdhSYjG+5T5h9zau1vRhz++zwKn57wfcyNn6a83GDhhgkVw== + dependencies: + "@react-types/shared" "^3.18.1" + +"@react-types/combobox@^3.6.2": + version "3.6.2" + resolved "https://registry.yarnpkg.com/@react-types/combobox/-/combobox-3.6.2.tgz#887cc2bce355773cb9dc5613c88264d008c92384" + integrity sha512-qitu/W3Z3/ihyqocy+8n4HZKRXF5JTMHl1ug3rKps5yCNnVdkWwjPFPM6w180c9QjquThNY3o947LZ1v59qJ4A== + dependencies: + "@react-types/shared" "^3.18.1" + +"@react-types/datepicker@^3.4.0": + version "3.4.0" + resolved "https://registry.yarnpkg.com/@react-types/datepicker/-/datepicker-3.4.0.tgz#f1fea1b2e9fc963724193ae7b58ce49b58153c59" + integrity sha512-gQmbeNdVPXpaX8XsvxQb6nRLQZNlsMnDLVVpagVno7bifz2cdbthLfMe124nNT/Xr+JXolP+BtlYlZ7IRQVxdA== + dependencies: + "@internationalized/date" "^3.3.0" + "@react-types/calendar" "^3.3.0" + "@react-types/overlays" "^3.8.0" + "@react-types/shared" "^3.18.1" + +"@react-types/dialog@^3.5.3": + version "3.5.3" + resolved "https://registry.yarnpkg.com/@react-types/dialog/-/dialog-3.5.3.tgz#049e300372451190698ecf7d6e1ef559ab9fb962" + integrity sha512-iTdg+UZiJpJe7Rnu9eILf8Hcd9li0Kg2eg8ba8dIc1O++ymqPmrdPWj9wj1JB9cl94E2Yg4w3W5YINiLXkdoeA== + dependencies: + "@react-types/overlays" "^3.8.0" + "@react-types/shared" "^3.18.1" + +"@react-types/grid@^3.1.8": + version "3.1.8" + resolved "https://registry.yarnpkg.com/@react-types/grid/-/grid-3.1.8.tgz#2d8cf3ccbb2bba161917b9e242f920fed5f34026" + integrity sha512-NKk4pDbW2QXJOYnDSAYhta81CGwXOc/9tVw2WFs+1wacvxeKmh1Q+n36uAFcIdQOvVRqeGTJaYiqLFmF3fC3tA== + dependencies: + "@react-types/shared" "^3.18.1" + +"@react-types/label@^3.7.4": + version "3.7.4" + resolved "https://registry.yarnpkg.com/@react-types/label/-/label-3.7.4.tgz#db7ce5cc82785b11ed4c80308b2ec40768fec6e0" + integrity sha512-SfTqPRI39GE3GFD5ZGYEeX9jXQrNqDeaaI36PJhnbgGVFz96oVVkhy9t9c2bMHcbhLLENYIHMzxrvVqXS07e7A== + dependencies: + "@react-types/shared" "^3.18.1" + +"@react-types/link@^3.4.3": + version "3.4.3" + resolved "https://registry.yarnpkg.com/@react-types/link/-/link-3.4.3.tgz#51534673ea35cf6583b950319bafd16ff76296dc" + integrity sha512-opKfkcaeV0cir64jPcy7DS0BrmdfuWMjua+MSeNv7FfT/b65rFgPfAOKZcvLWDsaxT5HYb7pivYPBfjKqHsQKw== + dependencies: + "@react-aria/interactions" "^3.16.0" + "@react-types/shared" "^3.18.1" + +"@react-types/listbox@^3.4.2": + version "3.4.2" + resolved "https://registry.yarnpkg.com/@react-types/listbox/-/listbox-3.4.2.tgz#13a217ca2c31e4e5c0ef46f00f770bf0d1b24726" + integrity sha512-qg980T+tl15pqgfuK8V6z+vsvsIrJEEPxcupQXP3T1O0LxWxJDakZHF0lV9qwfyB9XlnVSMZfkjDiZp9Wgf8QQ== + dependencies: + "@react-types/shared" "^3.18.1" + +"@react-types/menu@^3.9.2": + version "3.9.2" + resolved "https://registry.yarnpkg.com/@react-types/menu/-/menu-3.9.2.tgz#e3a269fd687994495a3f8f104ca133487273874e" + integrity sha512-OIuEOGqo8gHaP4k3Ua+RvuPN2/3Sgcl30dNFIGaK7hra4eWxOUu8TTC+/Quy6xozR/SvFhqCLCoMKixy6MblWQ== + dependencies: + "@react-types/overlays" "^3.8.0" + "@react-types/shared" "^3.18.1" + +"@react-types/meter@^3.3.2": + version "3.3.2" + resolved "https://registry.yarnpkg.com/@react-types/meter/-/meter-3.3.2.tgz#f316eb4b47112137b0bbfc9e82b0f2814587c297" + integrity sha512-o21Zz+3LNjvBueMap+q2otGp5t2Xeb/lIMM4Y+v8j5XO+bLcHaAjdQB/TgKRe8iYFm3IqwpVtV9A38IWDtpLRQ== + dependencies: + "@react-types/progress" "^3.4.1" + "@react-types/shared" "^3.18.1" + +"@react-types/numberfield@^3.4.2": + version "3.4.2" + resolved "https://registry.yarnpkg.com/@react-types/numberfield/-/numberfield-3.4.2.tgz#6773e93b611131d45a4e5c4cac561945dc5ac7f3" + integrity sha512-SGzuuFf5wCSRPvpV+bnykiXSIt8pkpBBVp8tlygB66pQSBV7VLdUvWGohaayPSM+3Z+WkU+osgzYtGq5wh+C3Q== + dependencies: + "@react-types/shared" "^3.18.1" + +"@react-types/overlays@^3.8.0": + version "3.8.0" + resolved "https://registry.yarnpkg.com/@react-types/overlays/-/overlays-3.8.0.tgz#23d74b59be65b5c56e28f30da6ea1e9a83bba05f" + integrity sha512-0JxwUW3xwXjsT+nVI5dVE1KUm8QKxnQj9vjqgsazX213+klRd/QdeuFJgcbxzCVFOS/mLkP4o/ATjxt4+1eQsA== + dependencies: + "@react-types/shared" "^3.18.1" + +"@react-types/progress@^3.4.1": + version "3.4.1" + resolved "https://registry.yarnpkg.com/@react-types/progress/-/progress-3.4.1.tgz#3b45df4780b70573c27b316d557ce71b546e32bf" + integrity sha512-Y6cTvvJjbfFBeB7Zb3PizhhO3+YLWXpIP8opto15RWu11ktgZVMUgsnlsJgE3dFeoZ7UHwXdCYf8JOzBw5VPHA== + dependencies: + "@react-types/shared" "^3.18.1" + +"@react-types/radio@^3.4.2": + version "3.4.2" + resolved "https://registry.yarnpkg.com/@react-types/radio/-/radio-3.4.2.tgz#4a6a1f7ff11b71b6b69d13d28fd74de9c903df8c" + integrity sha512-SE6sjZjZbyuJMJNNdlhoutVr+QFRt1Vz7DZj4UaOswW5SD/Xb+xFdW8i6ETKdRN17am/5SC89ltWe0R3q0pVkA== + dependencies: + "@react-types/shared" "^3.18.1" + +"@react-types/searchfield@^3.4.2": + version "3.4.2" + resolved "https://registry.yarnpkg.com/@react-types/searchfield/-/searchfield-3.4.2.tgz#360ac97f52af5e2bb8e1a8a13e611fe9efc371fa" + integrity sha512-HQm++hIXVfEbjbRey6hYV/5hLEO6gtwt4Mft3u5I5BiT7yoQqQAD/8z9S8aUXDUU9KTrAKfL1DwrFQSkOsCWJA== + dependencies: + "@react-types/shared" "^3.18.1" + "@react-types/textfield" "^3.7.2" + +"@react-types/select@^3.8.1": + version "3.8.1" + resolved "https://registry.yarnpkg.com/@react-types/select/-/select-3.8.1.tgz#77d8ff3be70a5c342860469d71c8c23bbc1a877f" + integrity sha512-ByVKKwgpE3d08jI+Ibuom/qphlBiDKpVMwXgFgVZRAN2YvVrsix8arSo7kmXtzekz91qqDBqtt7DBCfT0E1WKw== + dependencies: + "@react-types/shared" "^3.18.1" + +"@react-types/shared@^3.18.1": + version "3.18.1" + resolved "https://registry.yarnpkg.com/@react-types/shared/-/shared-3.18.1.tgz#45bac7a1a433916d16535ea583d86a2b4c72ff8c" + integrity sha512-OpTYRFS607Ctfd6Tmhyk6t6cbFyDhO5K+etU35X50pMzpypo1b7vF0mkngEeTc0Xwl0e749ONZNPZskMyu5k8w== + +"@react-types/slider@^3.5.1": + version "3.5.1" + resolved "https://registry.yarnpkg.com/@react-types/slider/-/slider-3.5.1.tgz#bae46025de7d02a84918b3aca0e3ffd647e4fdf2" + integrity sha512-8+AMNexx7q7DqfAtQKC5tgnZdG/tIwG2tcEbFCfAQA09Djrt/xiMNz+mc7SsV1PWoWwVuSDFH9QqKPodOrJHDg== + dependencies: + "@react-types/shared" "^3.18.1" + +"@react-types/switch@^3.3.2": + version "3.3.2" + resolved "https://registry.yarnpkg.com/@react-types/switch/-/switch-3.3.2.tgz#af54e2dd8b599df3214360f593827c9033478ce4" + integrity sha512-L0XF4J43Q7HCAJXqseAk6RMteK6k1jQ0zrG05r6lSCkxaS9fGUlgLTCiFUsf07x0ADH1Xyc7PwpfJjyEr5A4tA== + dependencies: + "@react-types/checkbox" "^3.4.4" + "@react-types/shared" "^3.18.1" + +"@react-types/table@^3.7.0": + version "3.7.0" + resolved "https://registry.yarnpkg.com/@react-types/table/-/table-3.7.0.tgz#61f3c3eac2c894c848323b55d7520999a17a7816" + integrity sha512-tUSJPdU2eNjH/CRHs5pOCKDyQxzq8b1rJZHldvRK/GCW+B98debFOueYgw4+YGQ1E33IyzAwid+FXgY3wlZlHg== + dependencies: + "@react-types/grid" "^3.1.8" + "@react-types/shared" "^3.18.1" + +"@react-types/tabs@^3.3.0": + version "3.3.0" + resolved "https://registry.yarnpkg.com/@react-types/tabs/-/tabs-3.3.0.tgz#d8230bac82fcd1dca414fbc1c17b769cef9c5bd8" + integrity sha512-uXDVXBBppb+9S8bhxF7LZhgptrF5ll25SX8/jrpnXOR0jpihq6K3fkSe5M/OBnGsybuyVGN7+Np5v7UUYrM5SQ== + dependencies: + "@react-types/shared" "^3.18.1" + +"@react-types/textfield@^3.7.2": + version "3.7.2" + resolved "https://registry.yarnpkg.com/@react-types/textfield/-/textfield-3.7.2.tgz#f23341e80b319b68f2298dd429ed2280ada0bbe1" + integrity sha512-TsZTf1+4Ve9QHm6mbXr26uLOA4QtZPgyjYgYclL2nHoOl67algeQIFxIVfdlNIKFFMOw5BtC6Mer0I3KUWtbOQ== + dependencies: + "@react-types/shared" "^3.18.1" + +"@react-types/tooltip@^3.4.2": + version "3.4.2" + resolved "https://registry.yarnpkg.com/@react-types/tooltip/-/tooltip-3.4.2.tgz#68097ac53657fe3438cf7610e556e838725e9950" + integrity sha512-jkuhT4KsU3ePfVrLeQv3Z2Vt0SwZmFNUoVIlK6Q1QR8H/TuWG+SDKjbwNLcCdeVfAXcJLbEfPDT2zyGeQTwNEA== + dependencies: + "@react-types/overlays" "^3.8.0" + "@react-types/shared" "^3.18.1" + "@rollup/plugin-commonjs@^23.0.7": version "23.0.7" resolved "https://registry.yarnpkg.com/@rollup/plugin-commonjs/-/plugin-commonjs-23.0.7.tgz#7d26d879caa54283086de1974b66f512ef60abdc" @@ -5026,6 +6110,13 @@ "@svgr/plugin-svgo" "^5.5.0" loader-utils "^2.0.0" +"@swc/helpers@^0.5.0": + version "0.5.1" + resolved "https://registry.yarnpkg.com/@swc/helpers/-/helpers-0.5.1.tgz#e9031491aa3f26bfcc974a67f48bd456c8a5357a" + integrity sha512-sJ902EfIzn1Fa+qYmjdQqh8tPsoxyBz+8yBKC2HKUxyezKJFwPGOn7pv4WY6QuQW//ySQi5lJjA/ZT9sNWWNTg== + dependencies: + tslib "^2.4.0" + "@testing-library/dom@^7.28.1": version "7.31.2" resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-7.31.2.tgz#df361db38f5212b88555068ab8119f5d841a8c4a" @@ -11318,6 +12409,16 @@ interpret@^2.2.0: resolved "https://registry.yarnpkg.com/interpret/-/interpret-2.2.0.tgz#1a78a0b5965c40a5416d007ad6f50ad27c417df9" integrity sha512-Ju0Bz/cEia55xDwUWEa8+olFpCiQoypjnQySseKtmjNrnps3P+xfpUmGr90T7yjlVJmOtybRvPXhKMbHr+fWnw== +intl-messageformat@^10.1.0: + version "10.5.0" + resolved "https://registry.yarnpkg.com/intl-messageformat/-/intl-messageformat-10.5.0.tgz#86d11b15913ac954075b25253f5e669359f89538" + integrity sha512-AvojYuOaRb6r2veOKfTVpxH9TrmjSdc5iR9R5RgBwrDZYSmAAFVT+QLbW3C4V7Qsg0OguMp67Q/EoUkxZzXRGw== + dependencies: + "@formatjs/ecma402-abstract" "1.17.0" + "@formatjs/fast-memoize" "2.2.0" + "@formatjs/icu-messageformat-parser" "2.6.0" + tslib "^2.4.0" + invariant@^2.2.2, invariant@^2.2.3, invariant@^2.2.4: version "2.2.4" resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6" @@ -15336,6 +16437,67 @@ rc@^1.2.8: minimist "^1.2.0" strip-json-comments "~2.0.1" +react-aria-components@^1.0.0-alpha.5: + version "1.0.0-alpha.5" + resolved "https://registry.yarnpkg.com/react-aria-components/-/react-aria-components-1.0.0-alpha.5.tgz#0c71d66074c129ea542b3e8e858d5b0ff0de8fc5" + integrity sha512-cEi3u0Sb1LkXxuB+9MRZ5IrFa3runRwQ72klxiTWVT8CiAaj8t8H+7n5/Mi/jR8po68yTU/Dd2aAn8AaGQpxvA== + dependencies: + "@internationalized/date" "^3.3.0" + "@react-aria/focus" "^3.13.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/utils" "^3.18.0" + "@react-stately/table" "^3.10.0" + "@react-types/calendar" "^3.3.0" + "@react-types/grid" "^3.1.8" + "@react-types/shared" "^3.18.1" + "@react-types/table" "^3.7.0" + "@swc/helpers" "^0.5.0" + react-aria "^3.26.0" + react-stately "^3.24.0" + use-sync-external-store "^1.2.0" + +react-aria@^3.26.0: + version "3.26.0" + resolved "https://registry.yarnpkg.com/react-aria/-/react-aria-3.26.0.tgz#55bae48c7443c6ed16ac5a52715272070c0d6b04" + integrity sha512-G+dh25hEdDLfAGbKyahzasnyxXhd99y6xlMZjNtHoWB7wXod/9M3P3W6mdANvCEogxU28ATRdV1bv6A2JbuSYg== + dependencies: + "@react-aria/breadcrumbs" "^3.5.3" + "@react-aria/button" "^3.8.0" + "@react-aria/calendar" "^3.4.0" + "@react-aria/checkbox" "^3.9.2" + "@react-aria/combobox" "^3.6.2" + "@react-aria/datepicker" "^3.5.0" + "@react-aria/dialog" "^3.5.3" + "@react-aria/dnd" "^3.3.0" + "@react-aria/focus" "^3.13.0" + "@react-aria/gridlist" "^3.5.0" + "@react-aria/i18n" "^3.8.0" + "@react-aria/interactions" "^3.16.0" + "@react-aria/label" "^3.6.0" + "@react-aria/link" "^3.5.2" + "@react-aria/listbox" "^3.10.0" + "@react-aria/menu" "^3.10.0" + "@react-aria/meter" "^3.4.3" + "@react-aria/numberfield" "^3.6.0" + "@react-aria/overlays" "^3.15.0" + "@react-aria/progress" "^3.4.3" + "@react-aria/radio" "^3.6.2" + "@react-aria/searchfield" "^3.5.3" + "@react-aria/select" "^3.11.0" + "@react-aria/selection" "^3.16.0" + "@react-aria/separator" "^3.3.3" + "@react-aria/slider" "^3.5.0" + "@react-aria/ssr" "^3.7.0" + "@react-aria/switch" "^3.5.2" + "@react-aria/table" "^3.10.0" + "@react-aria/tabs" "^3.6.1" + "@react-aria/tag" "^3.1.0" + "@react-aria/textfield" "^3.10.0" + "@react-aria/tooltip" "^3.6.0" + "@react-aria/utils" "^3.18.0" + "@react-aria/visually-hidden" "^3.8.2" + "@react-types/shared" "^3.18.1" + react-colorful@^5.1.2: version "5.3.0" resolved "https://registry.yarnpkg.com/react-colorful/-/react-colorful-5.3.0.tgz#bcbae49c1affa9ab9a3c8063398c5948419296bd" @@ -15604,6 +16766,34 @@ react-smooth@^1.0.5: raf "^3.4.0" react-transition-group "^2.5.0" +react-stately@^3.24.0: + version "3.24.0" + resolved "https://registry.yarnpkg.com/react-stately/-/react-stately-3.24.0.tgz#87a3ac6fee7c9480970a595bc3e2e97675b00d25" + integrity sha512-4jNCR7rQBqvV8aKxm8giUWms/Wxlo9MMLUDDKfg75LEiCaqLcnxSC99HsEVKSao3RI0JCCj2ihewh6grRW/AgQ== + dependencies: + "@react-stately/calendar" "^3.3.0" + "@react-stately/checkbox" "^3.4.3" + "@react-stately/collections" "^3.9.0" + "@react-stately/combobox" "^3.5.2" + "@react-stately/data" "^3.10.0" + "@react-stately/datepicker" "^3.5.0" + "@react-stately/dnd" "^3.2.2" + "@react-stately/list" "^3.9.0" + "@react-stately/menu" "^3.5.3" + "@react-stately/numberfield" "^3.5.0" + "@react-stately/overlays" "^3.6.0" + "@react-stately/radio" "^3.8.2" + "@react-stately/searchfield" "^3.4.3" + "@react-stately/select" "^3.5.2" + "@react-stately/selection" "^3.13.2" + "@react-stately/slider" "^3.4.0" + "@react-stately/table" "^3.10.0" + "@react-stately/tabs" "^3.5.0" + "@react-stately/toggle" "^3.6.0" + "@react-stately/tooltip" "^3.4.2" + "@react-stately/tree" "^3.7.0" + "@react-types/shared" "^3.18.1" + react-switch@^6.0.0: version "6.0.0" resolved "https://registry.yarnpkg.com/react-switch/-/react-switch-6.0.0.tgz#bd4a2dea08f211b8a32e55e8314fd44bc1ec947e" @@ -17924,6 +19114,11 @@ tslib@^2.3.0: resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.4.0.tgz#7cecaa7f073ce680a05847aa77be941098f36dc3" integrity sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ== +tslib@^2.4.0: + version "2.6.0" + resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.6.0.tgz#b295854684dbda164e181d259a22cd779dcd7bc3" + integrity sha512-7At1WUettjcSRHXCyYtTselblcHl9PJFFVKiCAy/bY97+BPZXSQ2wbq0P9s8tK2G7dFQfNnlJnPAiArVBVBsfA== + tslib@^2.4.1, tslib@^2.5.0: version "2.5.3" resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.5.3.tgz#24944ba2d990940e6e982c4bea147aba80209913" @@ -18336,6 +19531,11 @@ use-latest@^1.2.1: dependencies: use-isomorphic-layout-effect "^1.1.1" +use-sync-external-store@^1.2.0: + version "1.2.0" + resolved "https://registry.yarnpkg.com/use-sync-external-store/-/use-sync-external-store-1.2.0.tgz#7dbefd6ef3fe4e767a0cf5d7287aacfb5846928a" + integrity sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA== + use@^3.1.0: version "3.1.1" resolved "https://registry.yarnpkg.com/use/-/use-3.1.1.tgz#d50c8cac79a19fbc20f2911f56eb973f4e10070f" From 117e28403646228dd2a65025b662809cb0b70921 Mon Sep 17 00:00:00 2001 From: kostasdano Date: Thu, 20 Jul 2023 16:06:15 +0300 Subject: [PATCH 2/7] feat: introduce NumberField --- src/components/NumberField/NumberField.tsx | 152 ++++++++++++++++++ .../components/Stepper/Stepper.style.ts | 33 ++++ .../components/Stepper/Stepper.tsx | 37 +++++ .../NumberField/components/Stepper/index.ts | 1 + src/components/NumberField/index.ts | 2 + 5 files changed, 225 insertions(+) create mode 100644 src/components/NumberField/NumberField.tsx create mode 100644 src/components/NumberField/components/Stepper/Stepper.style.ts create mode 100644 src/components/NumberField/components/Stepper/Stepper.tsx create mode 100644 src/components/NumberField/components/Stepper/index.ts create mode 100644 src/components/NumberField/index.ts diff --git a/src/components/NumberField/NumberField.tsx b/src/components/NumberField/NumberField.tsx new file mode 100644 index 000000000..9ec69e440 --- /dev/null +++ b/src/components/NumberField/NumberField.tsx @@ -0,0 +1,152 @@ +import useCombinedRefs from 'hooks/useCombinedRefs'; +import { useTheme } from 'index'; +import { omit } from 'lodash'; +import React, { useMemo } from 'react'; +import { NumberField as ReactAriaNumberField, Group, Input, } from 'react-aria-components'; +import { generateUniqueID } from 'utils/helpers'; + +import Stepper from './components/Stepper/Stepper'; +import { TextFieldProps } from '../TextField/TextField'; +import { getTextInputBaseTokens } from '../TextInputBase/TextInputBase.tokens'; +import Icon, { AcceptedIconNames } from 'components/Icon'; +import Label from 'components/Label'; +import { suffixContainerStyle } from 'components/TextField/TextField.style'; +import TextInputBase from 'components/TextInputBase/TextInputBase'; +import { inputStyle } from 'components/TextInputBase/TextInputBase.style'; + +export type NumberFieldProps = Omit & { + /** Callback fired when the `input` is changed. */ + onChange?: (value: number) => void; + /** The value of the `input` element. */ + value?: number; + /** Formatting options for the value displayed in the number field, following the Intl.NumberFormatOptions type */ + formatOptions?: Intl.NumberFormatOptions; + /** Whether the numberInput has a stepper */ + hasStepper?: boolean; + /** The amount that the input value changes with each increment or decrement "tick". Defaults to 1 */ + step?: number; + /** The smallest value allowed for the input. */ + minValue?: number; + /** The largest value allowed for the input. */ + maxValue?: number; +}; + +const NumberField = React.forwardRef((props, ref) => { + const { + id = generateUniqueID('numberfield_'), + suffix = null, + hasStepper = false, + label, + placeholder = '', + isRequired = false, + isDisabled, + isReadOnly, + step, + onChange, + formatOptions, + value, + minValue, + maxValue, + status = { type: 'normal' }, + dataTestPrefixId, + ...rest + } = props; + + const theme = useTheme(); + const tokens = getTextInputBaseTokens(theme); + + const inputRef = React.useRef(null); + const combinedRefs = useCombinedRefs(inputRef, ref); + + const isLocked = status?.type === 'read-only'; + const hintMessageId = status?.hintMessage ? status?.id ?? `${id}_hintMessage` : undefined; + + const handleClick = () => { + if (!isLocked && !isDisabled) { + combinedRefs.current?.focus(); + } + }; + + const suffixContent = useMemo(() => { + if (isLocked || typeof suffix === 'string') { + const iconName = isLocked ? 'lock' : suffix; + + return ( + + ); + } + + return suffix; + }, [isLocked, suffix, theme.utils]); + + const textInputBaseSx = useMemo( + () => + !suffixContent && !hasStepper + ? { + textField: { + paddingRight: tokens('paddingContentLeft'), + }, + } + : {}, + [hasStepper, suffixContent, tokens] + ); + + return ( +
+ +
+ + + + + +
+ {suffixContent && !hasStepper && ( +
+ {suffixContent} +
+ )} + +
+ ); +}); + +NumberField.displayName = 'NumberField'; + +export default NumberField; diff --git a/src/components/NumberField/components/Stepper/Stepper.style.ts b/src/components/NumberField/components/Stepper/Stepper.style.ts new file mode 100644 index 000000000..14a35e5b5 --- /dev/null +++ b/src/components/NumberField/components/Stepper/Stepper.style.ts @@ -0,0 +1,33 @@ +import { css, SerializedStyles } from '@emotion/react'; +import { Theme } from 'theme'; +import { rem } from 'theme/utils'; + +import { getTextInputBaseTokens } from 'components/TextInputBase/TextInputBase.tokens'; + +export const stepperContainerStyle = (): SerializedStyles => { + return css` + display: flex; + flex-direction: column; + width: ${rem(44)}; + position: absolute; + right: 0; + top: -${rem(15)}; + z-index: 1; + `; +}; + +export const buttonWrapperStyle = + () => + (theme: Theme): SerializedStyles => { + const tokens = getTextInputBaseTokens(theme); + + return css` + background: transparent; + border: none; + height: calc(${tokens('container')} / 2); + + &:hover { + cursor: pointer; + } + `; + }; diff --git a/src/components/NumberField/components/Stepper/Stepper.tsx b/src/components/NumberField/components/Stepper/Stepper.tsx new file mode 100644 index 000000000..5c8f2e667 --- /dev/null +++ b/src/components/NumberField/components/Stepper/Stepper.tsx @@ -0,0 +1,37 @@ +import React from 'react'; +import { Button } from 'react-aria-components'; + +import { buttonWrapperStyle, stepperContainerStyle } from './Stepper.style'; +import Icon from 'components/Icon'; + +type Props = { + isDisabled?: boolean; + dataTestIdPrefix?: string; +}; + +const Stepper: React.FC = ({ isDisabled, dataTestIdPrefix }) => { + const dataTestId = dataTestIdPrefix ? `${dataTestIdPrefix}_number` : 'number'; + + return ( +
+ + +
+ ); +}; + +export default Stepper; diff --git a/src/components/NumberField/components/Stepper/index.ts b/src/components/NumberField/components/Stepper/index.ts new file mode 100644 index 000000000..2fb2a1bd8 --- /dev/null +++ b/src/components/NumberField/components/Stepper/index.ts @@ -0,0 +1 @@ +export { default } from './Stepper'; diff --git a/src/components/NumberField/index.ts b/src/components/NumberField/index.ts new file mode 100644 index 000000000..8aaaeae04 --- /dev/null +++ b/src/components/NumberField/index.ts @@ -0,0 +1,2 @@ +export { default } from './NumberField'; +export * from './NumberField'; From b53f663ec767b033f98ef53fa6dbba5eafa4375c Mon Sep 17 00:00:00 2001 From: kostasdano Date: Thu, 20 Jul 2023 16:06:33 +0300 Subject: [PATCH 3/7] feat: create stories --- .../NumberField/NumberField.stories.mdx | 172 ++++++++++++++++++ 1 file changed, 172 insertions(+) create mode 100644 src/components/NumberField/NumberField.stories.mdx diff --git a/src/components/NumberField/NumberField.stories.mdx b/src/components/NumberField/NumberField.stories.mdx new file mode 100644 index 000000000..7d5e483cc --- /dev/null +++ b/src/components/NumberField/NumberField.stories.mdx @@ -0,0 +1,172 @@ +import { Meta, Preview, Props, Story } from '@storybook/addon-docs'; +import { boolean, number, select, text, withKnobs } from '@storybook/addon-knobs'; +import { linkTo } from '@storybook/addon-links'; +import NumberField from './NumberField'; +import Stack from '../storyUtils/Stack'; +import Icon from '../Icon'; +import iconSelector from '../Icon/assets/iconSelector'; +import Loader from '../Loader'; +import { FIGMA_URL } from '../../utils/common'; +import SectionHeader from '../../storybook/SectionHeader'; + + + + + +- [Overview](#overview) +- [Props](#props) +- [Usage](#usage) +- [Variants](#variants) + +## Overview + +A universal NumberField that only allows for numerical characters, designed to handle numerical data entry. + +## Props + + + +## Usage + + + +## Variants + +### NumberField with number format + +Formatting options for the value displayed in the number field can be configured based on +[Intl.NumberFormatOptions](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat) + + + + + + + + + +### NumberField with suffix or Stepper + +NumberField can either have custom suffix (as in TextField) or a stepper with increment and decrement buttons. Step defaults to 1 if not provided. + + + + + %} /> + + + + + +## NumberField with min and max values + +NumberField can have min and max values provided as props. + + + + + %} + /> + + + + +### NumberField with Label and Placeholder + +NumberField with label options. Label that will float, with or without Placeholder + + + + + + + + + + +### NumberField with Statuses + +NumberField inherits all TextField statuses behavior. + + + + + + + + + + + + +### Playground + + + + + + + + From 8917283f135a59e7469ffe434ec43414538685f2 Mon Sep 17 00:00:00 2001 From: kostasdano Date: Thu, 20 Jul 2023 16:06:43 +0300 Subject: [PATCH 4/7] feat: tests --- .../NumberField/NumberField.test.tsx | 66 +++++++++++++++++++ 1 file changed, 66 insertions(+) create mode 100644 src/components/NumberField/NumberField.test.tsx diff --git a/src/components/NumberField/NumberField.test.tsx b/src/components/NumberField/NumberField.test.tsx new file mode 100644 index 000000000..e1291481f --- /dev/null +++ b/src/components/NumberField/NumberField.test.tsx @@ -0,0 +1,66 @@ +import userEvent from '@testing-library/user-event'; +import React from 'react'; +import NumberField, { NumberFieldProps as Props } from './NumberField'; +import { render, screen } from '../../test'; + +const renderNumberField = (props: Partial = {}) => { + const defaultProps = { + label: 'Label', + formatOptions: { minimumFractionDigits: 2, maximumFractionDigits: 2 }, + }; + + return render(); +}; + +describe('NumberField', () => { + let input: HTMLInputElement; + let increase: HTMLButtonElement; + let decrease: HTMLButtonElement; + + it('formats the number input based on the given format', async () => { + renderNumberField(); + input = screen.getByTestId('input') as HTMLInputElement; + + userEvent.type(input, '12.3456'); + userEvent.click(document.body); + expect(input).toHaveValue('12.35'); + }); + + it('it rounds number input based on step', async () => { + renderNumberField({ step: 0.5 }); + input = screen.getByTestId('input') as HTMLInputElement; + + userEvent.type(input, '12.21'); + userEvent.click(document.body); + expect(input).toHaveValue('12.00'); + }); + + it('increases and decreases the number through stepper', async () => { + renderNumberField({ step: 0.5, hasStepper: true }); + input = screen.getByTestId('input') as HTMLInputElement; + increase = screen.getByTestId('number_increment') as HTMLButtonElement; + decrease = screen.getByTestId('number_decrement') as HTMLButtonElement; + + userEvent.type(input, '12.00'); + userEvent.click(document.body); + userEvent.click(increase); + expect(input).toHaveValue('12.50'); + userEvent.click(decrease); + expect(input).toHaveValue('12.00'); + }); + + it('it rejects number input outside min and max given', async () => { + renderNumberField({ minValue: 10, maxValue: 20 }); + input = screen.getByTestId('input') as HTMLInputElement; + + userEvent.type(input, '5'); + userEvent.click(document.body); + expect(input).toHaveValue('10.00'); + + userEvent.clear(input); + + userEvent.type(input, '25'); + userEvent.click(document.body); + expect(input).toHaveValue('20.00'); + }); +}); From 4551aa463f5c24ace904938942e2f5002823f875 Mon Sep 17 00:00:00 2001 From: kostasdano Date: Thu, 20 Jul 2023 16:06:54 +0300 Subject: [PATCH 5/7] feat: storyshots --- .../NumberField.stories.storyshot | 2879 +++++++++++++++++ 1 file changed, 2879 insertions(+) create mode 100644 src/components/NumberField/__snapshots__/NumberField.stories.storyshot diff --git a/src/components/NumberField/__snapshots__/NumberField.stories.storyshot b/src/components/NumberField/__snapshots__/NumberField.stories.storyshot new file mode 100644 index 000000000..d78ebea28 --- /dev/null +++ b/src/components/NumberField/__snapshots__/NumberField.stories.storyshot @@ -0,0 +1,2879 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Storyshots Design System/NumberField NumberField with Label and Placeholder 1`] = ` +.emotion-0 { + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + position: relative; + padding: 0.25rem; +} + +.emotion-1 { + margin: 1rem; +} + +.emotion-2 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; +} + +.emotion-3 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + position: relative; + -webkit-transition: background-color 0.25s,box-shadow 0.25s,border-color 0.25s; + transition: background-color 0.25s,box-shadow 0.25s,border-color 0.25s; + box-shadow: 0 0 0 0.0625rem #a2bdfb; + border-radius: 0.25rem; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + opacity: 1; + cursor: text; + height: 3.25rem; + min-width: 8.75rem; + background-color: #ffffff; +} + +.emotion-3:hover { + background-color: #e7eefe; +} + +.emotion-3:focus-within { + box-shadow: 0 0 0 0.125rem #175bf5; + background-color: #e7eefe; +} + +.emotion-4 { + position: relative; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + vertical-align: top; + width: -webkit-fill-available; + width: -moz-available; + width: fill-available; + padding: 0 0 0 0.75rem; + padding-right: 0.75rem; +} + +.emotion-4>div { + position: relative; +} + +.emotion-5 { + width: 100%; +} + +.emotion-6 { + font-family: Roboto; + font-weight: 400; + line-height: 1.25rem; + font-size: 0.875rem; + letter-spacing: 0.015625rem; + background: transparent; + border: none; + color: #212332; + display: block; + position: relative; + top: 0.4375rem; + z-index: 1; + text-overflow: ellipsis; + width: 0; + min-width: 100%; +} + +.emotion-6+label { + font-size: 0.9375rem; +} + +.emotion-6::-webkit-input-placeholder { + color: transparent; +} + +.emotion-6::-moz-placeholder { + color: transparent; +} + +.emotion-6:-ms-input-placeholder { + color: transparent; +} + +.emotion-6::placeholder { + color: transparent; +} + +.emotion-6:focus { + outline: none; +} + +.emotion-6:focus::-webkit-input-placeholder { + color: transparent; +} + +.emotion-6:focus::-moz-placeholder { + color: transparent; +} + +.emotion-6:focus:-ms-input-placeholder { + color: transparent; +} + +.emotion-6:focus::placeholder { + color: transparent; +} + +.emotion-6:not(:focus):placeholder-shown+label { + font-weight: normal; +} + +.emotion-6:focus-within+label, +.emotion-6:not(:placeholder-shown)+label { + -webkit-transform: translate(0.1875rem, -35%) scale(0.8); + -moz-transform: translate(0.1875rem, -35%) scale(0.8); + -ms-transform: translate(0.1875rem, -35%) scale(0.8); + transform: translate(0.1875rem, -35%) scale(0.8); + font-weight: 700; +} + +.emotion-6:focus-within+label { + color: #1451dc; +} + +.emotion-6:disabled { + cursor: not-allowed; +} + +.emotion-7 { + -webkit-transition: -webkit-transform 0.25s,opacity 0.25s ease-in-out; + transition: transform 0.25s,opacity 0.25s ease-in-out; + transform-origin: 0 0; + line-height: normal; + width: 100%; + position: absolute; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + -webkit-transform: translate(0.1875rem, 0); + -moz-transform: translate(0.1875rem, 0); + -ms-transform: translate(0.1875rem, 0); + transform: translate(0.1875rem, 0); + font-size: 0.875rem; + font-weight: 400; + color: #5f6c85; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + top: 0; + bottom: 0; + margin: auto; + white-space: nowrap; +} + +.emotion-11 { + font-family: Roboto; + font-weight: 400; + line-height: 1.25rem; + font-size: 0.875rem; + letter-spacing: 0.015625rem; + background: transparent; + border: none; + color: #212332; + display: block; + position: relative; + top: 0.4375rem; + z-index: 1; + text-overflow: ellipsis; + width: 0; + min-width: 100%; +} + +.emotion-11+label { + font-size: 0.9375rem; +} + +.emotion-11::-webkit-input-placeholder { + color: transparent; +} + +.emotion-11::-moz-placeholder { + color: transparent; +} + +.emotion-11:-ms-input-placeholder { + color: transparent; +} + +.emotion-11::placeholder { + color: transparent; +} + +.emotion-11:focus { + outline: none; +} + +.emotion-11:focus::-webkit-input-placeholder { + color: #54587f; +} + +.emotion-11:focus::-moz-placeholder { + color: #54587f; +} + +.emotion-11:focus:-ms-input-placeholder { + color: #54587f; +} + +.emotion-11:focus::placeholder { + color: #54587f; +} + +.emotion-11:not(:focus):placeholder-shown+label { + font-weight: normal; +} + +.emotion-11:focus-within+label, +.emotion-11:not(:placeholder-shown)+label { + -webkit-transform: translate(0.1875rem, -35%) scale(0.8); + -moz-transform: translate(0.1875rem, -35%) scale(0.8); + -ms-transform: translate(0.1875rem, -35%) scale(0.8); + transform: translate(0.1875rem, -35%) scale(0.8); + font-weight: 700; +} + +.emotion-11:focus-within+label { + color: #1451dc; +} + +.emotion-11:disabled { + cursor: not-allowed; +} + +
+
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+
+`; + +exports[`Storyshots Design System/NumberField NumberField with Label, Placeholder and Statuses 1`] = ` +.emotion-0 { + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + position: relative; + padding: 0.25rem; +} + +.emotion-1 { + margin: 1rem; +} + +.emotion-2 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; +} + +.emotion-3 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + position: relative; + -webkit-transition: background-color 0.25s,box-shadow 0.25s,border-color 0.25s; + transition: background-color 0.25s,box-shadow 0.25s,border-color 0.25s; + box-shadow: 0 0 0 0.0625rem #a2bdfb; + border-radius: 0.25rem; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + opacity: 1; + cursor: text; + height: 3.25rem; + min-width: 8.75rem; + background-color: #ffffff; +} + +.emotion-3:hover { + background-color: #e7eefe; +} + +.emotion-3:focus-within { + box-shadow: 0 0 0 0.125rem #175bf5; + background-color: #e7eefe; +} + +.emotion-4 { + position: relative; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + vertical-align: top; + width: -webkit-fill-available; + width: -moz-available; + width: fill-available; + padding: 0 0 0 0.75rem; + padding-right: 0.75rem; +} + +.emotion-4>div { + position: relative; +} + +.emotion-5 { + width: 100%; +} + +.emotion-6 { + font-family: Roboto; + font-weight: 400; + line-height: 1.25rem; + font-size: 0.875rem; + letter-spacing: 0.015625rem; + background: transparent; + border: none; + color: #212332; + display: block; + position: relative; + top: 0.4375rem; + z-index: 1; + text-overflow: ellipsis; + width: 0; + min-width: 100%; +} + +.emotion-6+label { + font-size: 0.9375rem; +} + +.emotion-6::-webkit-input-placeholder { + color: transparent; +} + +.emotion-6::-moz-placeholder { + color: transparent; +} + +.emotion-6:-ms-input-placeholder { + color: transparent; +} + +.emotion-6::placeholder { + color: transparent; +} + +.emotion-6:focus { + outline: none; +} + +.emotion-6:focus::-webkit-input-placeholder { + color: transparent; +} + +.emotion-6:focus::-moz-placeholder { + color: transparent; +} + +.emotion-6:focus:-ms-input-placeholder { + color: transparent; +} + +.emotion-6:focus::placeholder { + color: transparent; +} + +.emotion-6:not(:focus):placeholder-shown+label { + font-weight: normal; +} + +.emotion-6:focus-within+label, +.emotion-6:not(:placeholder-shown)+label { + -webkit-transform: translate(0.1875rem, -35%) scale(0.8); + -moz-transform: translate(0.1875rem, -35%) scale(0.8); + -ms-transform: translate(0.1875rem, -35%) scale(0.8); + transform: translate(0.1875rem, -35%) scale(0.8); + font-weight: 700; +} + +.emotion-6:focus-within+label { + color: #1451dc; +} + +.emotion-6:disabled { + cursor: not-allowed; +} + +.emotion-7 { + -webkit-transition: -webkit-transform 0.25s,opacity 0.25s ease-in-out; + transition: transform 0.25s,opacity 0.25s ease-in-out; + transform-origin: 0 0; + line-height: normal; + width: 100%; + position: absolute; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + -webkit-transform: translate(0.1875rem, 0); + -moz-transform: translate(0.1875rem, 0); + -ms-transform: translate(0.1875rem, 0); + transform: translate(0.1875rem, 0); + font-size: 0.875rem; + font-weight: 400; + color: #5f6c85; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + top: 0; + bottom: 0; + margin: auto; + white-space: nowrap; +} + +.emotion-8 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + gap: 0.25rem; + color: #54587f; + padding: 0.5rem 0 0; + font-family: Roboto; + font-weight: 400; + line-height: 1rem; + font-size: 0.75rem; + letter-spacing: 0.015625rem; +} + +.emotion-8 span { + -webkit-align-items: stretch; + -webkit-box-align: stretch; + -ms-flex-align: stretch; + align-items: stretch; + padding: 0; +} + +.emotion-9 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + position: relative; + -webkit-transition: background-color 0.25s,box-shadow 0.25s,border-color 0.25s; + transition: background-color 0.25s,box-shadow 0.25s,border-color 0.25s; + box-shadow: 0 0 0 0.125rem #ff73a6; + border-radius: 0.25rem; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + opacity: 1; + cursor: text; + height: 3.25rem; + min-width: 8.75rem; + background-color: #ffe7f0; +} + +.emotion-9:hover { + background-color: #ffd0e1; +} + +.emotion-9:focus-within { + box-shadow: 0 0 0 0.125rem #175bf5; + background-color: #e7eefe; +} + +.emotion-13 { + -webkit-transition: -webkit-transform 0.25s,opacity 0.25s ease-in-out; + transition: transform 0.25s,opacity 0.25s ease-in-out; + transform-origin: 0 0; + line-height: normal; + width: 100%; + position: absolute; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + -webkit-transform: translate(0.1875rem, 0); + -moz-transform: translate(0.1875rem, 0); + -ms-transform: translate(0.1875rem, 0); + transform: translate(0.1875rem, 0); + font-size: 0.875rem; + font-weight: 400; + color: #FF176B; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + top: 0; + bottom: 0; + margin: auto; + white-space: nowrap; +} + +.emotion-14 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + gap: 0.25rem; + color: #cc1255; + padding: 0.5rem 0 0; + font-family: Roboto; + font-weight: 400; + line-height: 1rem; + font-size: 0.75rem; + letter-spacing: 0.015625rem; +} + +.emotion-14 span { + -webkit-align-items: stretch; + -webkit-box-align: stretch; + -ms-flex-align: stretch; + align-items: stretch; + padding: 0; +} + +.emotion-15 { + padding: 0.125rem; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; +} + +.emotion-16 { + fill: #cc1255; + width: 0.75rem; + height: 0.75rem; +} + +.emotion-16 path { + fill: #cc1255; +} + +.emotion-17 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + position: relative; + -webkit-transition: background-color 0.25s,box-shadow 0.25s,border-color 0.25s; + transition: background-color 0.25s,box-shadow 0.25s,border-color 0.25s; + box-shadow: 0 0 0 0.0625rem #e4e7ff; + border-radius: 0.25rem; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + opacity: 1; + cursor: not-allowed; + height: 3.25rem; + min-width: 8.75rem; + background-color: #e7eefe; +} + +.emotion-17:hover { + background-color: #e7eefe; +} + +.emotion-17:focus-within { + box-shadow: 0 0 0 0.125rem #e4e7ff; + background-color: #e7eefe; +} + +.emotion-18 { + position: relative; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + vertical-align: top; + width: -webkit-fill-available; + width: -moz-available; + width: fill-available; + padding: 0 0 0 0.75rem; +} + +.emotion-18>div { + position: relative; +} + +.emotion-22 { + min-width: 2.75rem; + max-width: 2.75rem; + overflow: hidden; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + cursor: unset; +} + +.emotion-24 { + fill: #5f6c85; + width: 1rem; + height: 1rem; +} + +.emotion-24 path { + fill: #5f6c85; +} + +.emotion-25 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + position: relative; + -webkit-transition: background-color 0.25s,box-shadow 0.25s,border-color 0.25s; + transition: background-color 0.25s,box-shadow 0.25s,border-color 0.25s; + box-shadow: 0 0 0 0.0625rem #a2bdfb; + border-radius: 0.25rem; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + opacity: 50%; + cursor: not-allowed; + height: 3.25rem; + min-width: 8.75rem; + background-color: #ffffff; +} + +.emotion-25:focus-within { + box-shadow: 0 0 0 0.125rem transparent; +} + +
+
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+ + Hint in Text Field + +
+
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+ + + + + Error in Text Field + +
+
+
+
+
+
+
+
+
+
+ + +
+
+
+
+ + + +
+
+
+
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+
+`; + +exports[`Storyshots Design System/NumberField NumberField with min and max values 1`] = ` +.emotion-0 { + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + position: relative; + padding: 0.25rem; +} + +.emotion-1 { + margin: 1rem; +} + +.emotion-2 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; +} + +.emotion-3 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + position: relative; + -webkit-transition: background-color 0.25s,box-shadow 0.25s,border-color 0.25s; + transition: background-color 0.25s,box-shadow 0.25s,border-color 0.25s; + box-shadow: 0 0 0 0.0625rem #a2bdfb; + border-radius: 0.25rem; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + opacity: 1; + cursor: text; + height: 3.25rem; + min-width: 8.75rem; + background-color: #ffffff; +} + +.emotion-3:hover { + background-color: #e7eefe; +} + +.emotion-3:focus-within { + box-shadow: 0 0 0 0.125rem #175bf5; + background-color: #e7eefe; +} + +.emotion-4 { + position: relative; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + vertical-align: top; + width: -webkit-fill-available; + width: -moz-available; + width: fill-available; + padding: 0 0 0 0.75rem; +} + +.emotion-4>div { + position: relative; +} + +.emotion-5 { + width: 100%; +} + +.emotion-6 { + font-family: Roboto; + font-weight: 400; + line-height: 1.25rem; + font-size: 0.875rem; + letter-spacing: 0.015625rem; + background: transparent; + border: none; + color: #212332; + display: block; + position: relative; + top: 0.4375rem; + z-index: 1; + text-overflow: ellipsis; + width: 0; + min-width: 100%; +} + +.emotion-6+label { + font-size: 0.9375rem; +} + +.emotion-6::-webkit-input-placeholder { + color: transparent; +} + +.emotion-6::-moz-placeholder { + color: transparent; +} + +.emotion-6:-ms-input-placeholder { + color: transparent; +} + +.emotion-6::placeholder { + color: transparent; +} + +.emotion-6:focus { + outline: none; +} + +.emotion-6:focus::-webkit-input-placeholder { + color: transparent; +} + +.emotion-6:focus::-moz-placeholder { + color: transparent; +} + +.emotion-6:focus:-ms-input-placeholder { + color: transparent; +} + +.emotion-6:focus::placeholder { + color: transparent; +} + +.emotion-6:not(:focus):placeholder-shown+label { + font-weight: normal; +} + +.emotion-6:focus-within+label, +.emotion-6:not(:placeholder-shown)+label { + -webkit-transform: translate(0.1875rem, -35%) scale(0.8); + -moz-transform: translate(0.1875rem, -35%) scale(0.8); + -ms-transform: translate(0.1875rem, -35%) scale(0.8); + transform: translate(0.1875rem, -35%) scale(0.8); + font-weight: 700; +} + +.emotion-6:focus-within+label { + color: #1451dc; +} + +.emotion-6:disabled { + cursor: not-allowed; +} + +.emotion-7 { + -webkit-transition: -webkit-transform 0.25s,opacity 0.25s ease-in-out; + transition: transform 0.25s,opacity 0.25s ease-in-out; + transform-origin: 0 0; + line-height: normal; + width: 100%; + position: absolute; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + -webkit-transform: translate(0.1875rem, 0); + -moz-transform: translate(0.1875rem, 0); + -ms-transform: translate(0.1875rem, 0); + transform: translate(0.1875rem, 0); + font-size: 0.875rem; + font-weight: 400; + color: #5f6c85; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + top: 0; + bottom: 0; + margin: auto; + white-space: nowrap; +} + +.emotion-8 { + min-width: 2.75rem; + max-width: 2.75rem; + overflow: hidden; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + cursor: unset; +} + +
+
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+ % +
+
+
+
+
+
+
+
+
+`; + +exports[`Storyshots Design System/NumberField NumberField with number format 1`] = ` +.emotion-0 { + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + position: relative; + padding: 0.25rem; +} + +.emotion-1 { + margin: 1rem; +} + +.emotion-2 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; +} + +.emotion-3 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + position: relative; + -webkit-transition: background-color 0.25s,box-shadow 0.25s,border-color 0.25s; + transition: background-color 0.25s,box-shadow 0.25s,border-color 0.25s; + box-shadow: 0 0 0 0.0625rem #a2bdfb; + border-radius: 0.25rem; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + opacity: 1; + cursor: text; + height: 3.25rem; + min-width: 8.75rem; + background-color: #ffffff; +} + +.emotion-3:hover { + background-color: #e7eefe; +} + +.emotion-3:focus-within { + box-shadow: 0 0 0 0.125rem #175bf5; + background-color: #e7eefe; +} + +.emotion-4 { + position: relative; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + vertical-align: top; + width: -webkit-fill-available; + width: -moz-available; + width: fill-available; + padding: 0 0 0 0.75rem; + padding-right: 0.75rem; +} + +.emotion-4>div { + position: relative; +} + +.emotion-5 { + width: 100%; +} + +.emotion-6 { + font-family: Roboto; + font-weight: 400; + line-height: 1.25rem; + font-size: 0.875rem; + letter-spacing: 0.015625rem; + background: transparent; + border: none; + color: #212332; + display: block; + position: relative; + top: 0.4375rem; + z-index: 1; + text-overflow: ellipsis; + width: 0; + min-width: 100%; +} + +.emotion-6+label { + font-size: 0.9375rem; +} + +.emotion-6::-webkit-input-placeholder { + color: transparent; +} + +.emotion-6::-moz-placeholder { + color: transparent; +} + +.emotion-6:-ms-input-placeholder { + color: transparent; +} + +.emotion-6::placeholder { + color: transparent; +} + +.emotion-6:focus { + outline: none; +} + +.emotion-6:focus::-webkit-input-placeholder { + color: transparent; +} + +.emotion-6:focus::-moz-placeholder { + color: transparent; +} + +.emotion-6:focus:-ms-input-placeholder { + color: transparent; +} + +.emotion-6:focus::placeholder { + color: transparent; +} + +.emotion-6:not(:focus):placeholder-shown+label { + font-weight: normal; +} + +.emotion-6:focus-within+label, +.emotion-6:not(:placeholder-shown)+label { + -webkit-transform: translate(0.1875rem, -35%) scale(0.8); + -moz-transform: translate(0.1875rem, -35%) scale(0.8); + -ms-transform: translate(0.1875rem, -35%) scale(0.8); + transform: translate(0.1875rem, -35%) scale(0.8); + font-weight: 700; +} + +.emotion-6:focus-within+label { + color: #1451dc; +} + +.emotion-6:disabled { + cursor: not-allowed; +} + +.emotion-7 { + -webkit-transition: -webkit-transform 0.25s,opacity 0.25s ease-in-out; + transition: transform 0.25s,opacity 0.25s ease-in-out; + transform-origin: 0 0; + line-height: normal; + width: 100%; + position: absolute; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + -webkit-transform: translate(0.1875rem, 0); + -moz-transform: translate(0.1875rem, 0); + -ms-transform: translate(0.1875rem, 0); + transform: translate(0.1875rem, 0); + font-size: 0.875rem; + font-weight: 400; + color: #5f6c85; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + top: 0; + bottom: 0; + margin: auto; + white-space: nowrap; +} + +
+
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+
+`; + +exports[`Storyshots Design System/NumberField NumberField with suffix or Stepper 1`] = ` +.emotion-0 { + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + position: relative; + padding: 0.25rem; +} + +.emotion-1 { + margin: 1rem; +} + +.emotion-2 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; +} + +.emotion-3 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + position: relative; + -webkit-transition: background-color 0.25s,box-shadow 0.25s,border-color 0.25s; + transition: background-color 0.25s,box-shadow 0.25s,border-color 0.25s; + box-shadow: 0 0 0 0.0625rem #a2bdfb; + border-radius: 0.25rem; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + opacity: 1; + cursor: text; + height: 3.25rem; + min-width: 8.75rem; + background-color: #ffffff; +} + +.emotion-3:hover { + background-color: #e7eefe; +} + +.emotion-3:focus-within { + box-shadow: 0 0 0 0.125rem #175bf5; + background-color: #e7eefe; +} + +.emotion-4 { + position: relative; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + vertical-align: top; + width: -webkit-fill-available; + width: -moz-available; + width: fill-available; + padding: 0 0 0 0.75rem; +} + +.emotion-4>div { + position: relative; +} + +.emotion-5 { + width: 100%; +} + +.emotion-6 { + font-family: Roboto; + font-weight: 400; + line-height: 1.25rem; + font-size: 0.875rem; + letter-spacing: 0.015625rem; + background: transparent; + border: none; + color: #212332; + display: block; + position: relative; + top: 0.4375rem; + z-index: 1; + text-overflow: ellipsis; + width: 0; + min-width: 100%; +} + +.emotion-6+label { + font-size: 0.9375rem; +} + +.emotion-6::-webkit-input-placeholder { + color: transparent; +} + +.emotion-6::-moz-placeholder { + color: transparent; +} + +.emotion-6:-ms-input-placeholder { + color: transparent; +} + +.emotion-6::placeholder { + color: transparent; +} + +.emotion-6:focus { + outline: none; +} + +.emotion-6:focus::-webkit-input-placeholder { + color: transparent; +} + +.emotion-6:focus::-moz-placeholder { + color: transparent; +} + +.emotion-6:focus:-ms-input-placeholder { + color: transparent; +} + +.emotion-6:focus::placeholder { + color: transparent; +} + +.emotion-6:not(:focus):placeholder-shown+label { + font-weight: normal; +} + +.emotion-6:focus-within+label, +.emotion-6:not(:placeholder-shown)+label { + -webkit-transform: translate(0.1875rem, -35%) scale(0.8); + -moz-transform: translate(0.1875rem, -35%) scale(0.8); + -ms-transform: translate(0.1875rem, -35%) scale(0.8); + transform: translate(0.1875rem, -35%) scale(0.8); + font-weight: 700; +} + +.emotion-6:focus-within+label { + color: #1451dc; +} + +.emotion-6:disabled { + cursor: not-allowed; +} + +.emotion-7 { + -webkit-transition: -webkit-transform 0.25s,opacity 0.25s ease-in-out; + transition: transform 0.25s,opacity 0.25s ease-in-out; + transform-origin: 0 0; + line-height: normal; + width: 100%; + position: absolute; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + -webkit-transform: translate(0.1875rem, 0); + -moz-transform: translate(0.1875rem, 0); + -ms-transform: translate(0.1875rem, 0); + transform: translate(0.1875rem, 0); + font-size: 0.875rem; + font-weight: 400; + color: #5f6c85; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + top: 0; + bottom: 0; + margin: auto; + white-space: nowrap; +} + +.emotion-8 { + min-width: 2.75rem; + max-width: 2.75rem; + overflow: hidden; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + cursor: unset; +} + +.emotion-14 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + width: 2.75rem; + position: absolute; + right: 0; + top: -0.9375rem; + z-index: 1; +} + +.emotion-15 { + background: transparent; + border: none; + height: calc(3.25rem / 2); +} + +.emotion-15:hover { + cursor: pointer; +} + +.emotion-16 { + padding: 0.125rem; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; +} + +.emotion-17 { + fill: #54587F; + width: 0.75rem; + height: 0.75rem; +} + +.emotion-17 path { + fill: #54587F; +} + +
+
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+ % +
+
+
+
+
+
+
+
+
+
+
+
+
+ + +
+ + +
+
+
+
+
+
+
+
+
+
+
+`; + +exports[`Storyshots Design System/NumberField Playground 1`] = ` +.emotion-0 { + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + position: relative; + padding: 0.25rem; +} + +.emotion-1 { + margin: 1rem; +} + +.emotion-2 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; +} + +.emotion-3 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + position: relative; + -webkit-transition: background-color 0.25s,box-shadow 0.25s,border-color 0.25s; + transition: background-color 0.25s,box-shadow 0.25s,border-color 0.25s; + box-shadow: 0 0 0 0.0625rem #a2bdfb; + border-radius: 0.25rem; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + opacity: 1; + cursor: text; + height: 3.25rem; + min-width: 8.75rem; + background-color: #ffffff; +} + +.emotion-3:hover { + background-color: #e7eefe; +} + +.emotion-3:focus-within { + box-shadow: 0 0 0 0.125rem #175bf5; + background-color: #e7eefe; +} + +.emotion-4 { + position: relative; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + vertical-align: top; + width: -webkit-fill-available; + width: -moz-available; + width: fill-available; + padding: 0 0 0 0.75rem; +} + +.emotion-4>div { + position: relative; +} + +.emotion-5 { + width: 100%; +} + +.emotion-6 { + font-family: Roboto; + font-weight: 400; + line-height: 1.25rem; + font-size: 0.875rem; + letter-spacing: 0.015625rem; + background: transparent; + border: none; + color: #212332; + display: block; + position: relative; + top: 0.4375rem; + z-index: 1; + text-overflow: ellipsis; + width: 0; + min-width: 100%; +} + +.emotion-6+label { + font-size: 0.9375rem; +} + +.emotion-6::-webkit-input-placeholder { + color: transparent; +} + +.emotion-6::-moz-placeholder { + color: transparent; +} + +.emotion-6:-ms-input-placeholder { + color: transparent; +} + +.emotion-6::placeholder { + color: transparent; +} + +.emotion-6:focus { + outline: none; +} + +.emotion-6:focus::-webkit-input-placeholder { + color: transparent; +} + +.emotion-6:focus::-moz-placeholder { + color: transparent; +} + +.emotion-6:focus:-ms-input-placeholder { + color: transparent; +} + +.emotion-6:focus::placeholder { + color: transparent; +} + +.emotion-6:not(:focus):placeholder-shown+label { + font-weight: normal; +} + +.emotion-6:focus-within+label, +.emotion-6:not(:placeholder-shown)+label { + -webkit-transform: translate(0.1875rem, -35%) scale(0.8); + -moz-transform: translate(0.1875rem, -35%) scale(0.8); + -ms-transform: translate(0.1875rem, -35%) scale(0.8); + transform: translate(0.1875rem, -35%) scale(0.8); + font-weight: 700; +} + +.emotion-6:focus-within+label { + color: #1451dc; +} + +.emotion-6:disabled { + cursor: not-allowed; +} + +.emotion-7 { + -webkit-transition: -webkit-transform 0.25s,opacity 0.25s ease-in-out; + transition: transform 0.25s,opacity 0.25s ease-in-out; + transform-origin: 0 0; + line-height: normal; + width: 100%; + position: absolute; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + -webkit-transform: translate(0.1875rem, 0); + -moz-transform: translate(0.1875rem, 0); + -ms-transform: translate(0.1875rem, 0); + transform: translate(0.1875rem, 0); + font-size: 0.875rem; + font-weight: 400; + color: #5f6c85; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + top: 0; + bottom: 0; + margin: auto; + white-space: nowrap; +} + +.emotion-8 { + min-width: 2.75rem; + max-width: 2.75rem; + overflow: hidden; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + cursor: unset; +} + +.emotion-9 { + padding: 0.125rem; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; +} + +.emotion-10 { + fill: #5f6c85; + width: 1rem; + height: 1rem; +} + +.emotion-10 path { + fill: #5f6c85; +} + +.emotion-11 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + gap: 0.25rem; + color: #54587f; + padding: 0.5rem 0 0; + font-family: Roboto; + font-weight: 400; + line-height: 1rem; + font-size: 0.75rem; + letter-spacing: 0.015625rem; +} + +.emotion-11 span { + -webkit-align-items: stretch; + -webkit-box-align: stretch; + -ms-flex-align: stretch; + align-items: stretch; + padding: 0; +} + +
+
+
+
+
+
+
+
+
+
+ + +
+
+
+
+ + + +
+
+
+
+ + Message in Number Field + +
+
+
+
+
+
+`; From 158ab59cfcd56f08731a96ed0b4c4d707c8a0b91 Mon Sep 17 00:00:00 2001 From: kostasdano Date: Thu, 20 Jul 2023 16:33:45 +0300 Subject: [PATCH 6/7] fix: tests --- .../NumberField/__snapshots__/NumberField.stories.storyshot | 4 ++-- src/test/setup.ts | 5 +++++ 2 files changed, 7 insertions(+), 2 deletions(-) diff --git a/src/components/NumberField/__snapshots__/NumberField.stories.storyshot b/src/components/NumberField/__snapshots__/NumberField.stories.storyshot index d78ebea28..fa659b164 100644 --- a/src/components/NumberField/__snapshots__/NumberField.stories.storyshot +++ b/src/components/NumberField/__snapshots__/NumberField.stories.storyshot @@ -2401,7 +2401,7 @@ exports[`Storyshots Design System/NumberField NumberField with suffix or Stepper className="emotion-14" > @@ -2439,7 +2443,7 @@ exports[`Storyshots Design System/NumberField NumberField with suffix or Stepper aria-controls="react-aria-generated-id" aria-label="Decrease" aria-labelledby={null} - className="emotion-15" + className="emotion-17" data-testid="number_decrement" disabled={false} id={null} @@ -2462,11 +2466,11 @@ exports[`Storyshots Design System/NumberField NumberField with suffix or Stepper type="button" > @@ -2575,7 +2579,7 @@ exports[`Storyshots Design System/NumberField Playground 1`] = ` width: 100%; } -.emotion-6 { +.emotion-7 { font-family: Roboto; font-weight: 400; line-height: 1.25rem; @@ -2593,52 +2597,52 @@ exports[`Storyshots Design System/NumberField Playground 1`] = ` min-width: 100%; } -.emotion-6+label { +.emotion-7+label { font-size: 0.9375rem; } -.emotion-6::-webkit-input-placeholder { +.emotion-7::-webkit-input-placeholder { color: transparent; } -.emotion-6::-moz-placeholder { +.emotion-7::-moz-placeholder { color: transparent; } -.emotion-6:-ms-input-placeholder { +.emotion-7:-ms-input-placeholder { color: transparent; } -.emotion-6::placeholder { +.emotion-7::placeholder { color: transparent; } -.emotion-6:focus { +.emotion-7:focus { outline: none; } -.emotion-6:focus::-webkit-input-placeholder { +.emotion-7:focus::-webkit-input-placeholder { color: transparent; } -.emotion-6:focus::-moz-placeholder { +.emotion-7:focus::-moz-placeholder { color: transparent; } -.emotion-6:focus:-ms-input-placeholder { +.emotion-7:focus:-ms-input-placeholder { color: transparent; } -.emotion-6:focus::placeholder { +.emotion-7:focus::placeholder { color: transparent; } -.emotion-6:not(:focus):placeholder-shown+label { +.emotion-7:not(:focus):placeholder-shown+label { font-weight: normal; } -.emotion-6:focus-within+label, -.emotion-6:not(:placeholder-shown)+label { +.emotion-7:focus-within+label, +.emotion-7:not(:placeholder-shown)+label { -webkit-transform: translate(0.1875rem, -35%) scale(0.8); -moz-transform: translate(0.1875rem, -35%) scale(0.8); -ms-transform: translate(0.1875rem, -35%) scale(0.8); @@ -2646,15 +2650,15 @@ exports[`Storyshots Design System/NumberField Playground 1`] = ` font-weight: 700; } -.emotion-6:focus-within+label { +.emotion-7:focus-within+label { color: #1451dc; } -.emotion-6:disabled { +.emotion-7:disabled { cursor: not-allowed; } -.emotion-7 { +.emotion-8 { -webkit-transition: -webkit-transform 0.25s,opacity 0.25s ease-in-out; transition: transform 0.25s,opacity 0.25s ease-in-out; transform-origin: 0 0; @@ -2686,7 +2690,7 @@ exports[`Storyshots Design System/NumberField Playground 1`] = ` white-space: nowrap; } -.emotion-8 { +.emotion-9 { min-width: 2.75rem; max-width: 2.75rem; overflow: hidden; @@ -2705,7 +2709,7 @@ exports[`Storyshots Design System/NumberField Playground 1`] = ` cursor: unset; } -.emotion-9 { +.emotion-10 { padding: 0.125rem; display: -webkit-box; display: -webkit-flex; @@ -2721,17 +2725,17 @@ exports[`Storyshots Design System/NumberField Playground 1`] = ` justify-content: center; } -.emotion-10 { +.emotion-11 { fill: #5f6c85; width: 1rem; height: 1rem; } -.emotion-10 path { +.emotion-11 path { fill: #5f6c85; } -.emotion-11 { +.emotion-12 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -2750,7 +2754,7 @@ exports[`Storyshots Design System/NumberField Playground 1`] = ` letter-spacing: 0.015625rem; } -.emotion-11 span { +.emotion-12 span { -webkit-align-items: stretch; -webkit-box-align: stretch; -ms-flex-align: stretch; @@ -2790,7 +2794,7 @@ exports[`Storyshots Design System/NumberField Playground 1`] = ` className="react-aria-NumberField" >
{ return css` display: flex; flex-direction: column; + /** @TODO add tokens instead of rem */ width: ${rem(44)}; position: absolute; right: 0; diff --git a/src/components/NumberField/components/Stepper/Stepper.tsx b/src/components/NumberField/components/Stepper/Stepper.tsx index 5c8f2e667..3bab6a36e 100644 --- a/src/components/NumberField/components/Stepper/Stepper.tsx +++ b/src/components/NumberField/components/Stepper/Stepper.tsx @@ -20,6 +20,7 @@ const Stepper: React.FC = ({ isDisabled, dataTestIdPrefix }) => { css={buttonWrapperStyle()} data-testid={`${dataTestId}_increment`} > + {/** @TODO add tokens instead of hex color */}
diff --git a/src/components/TextField/TextField.tsx b/src/components/TextField/TextField.tsx index d1c5d18aa..f919b49f7 100644 --- a/src/components/TextField/TextField.tsx +++ b/src/components/TextField/TextField.tsx @@ -1,16 +1,12 @@ -import useCombinedRefs from 'hooks/useCombinedRefs'; -import useTheme from 'hooks/useTheme'; +import useFieldUtils from 'hooks/useFieldUtils'; import { omit } from 'lodash'; -import React, { InputHTMLAttributes, useMemo } from 'react'; +import React, { InputHTMLAttributes } from 'react'; import isEqual from 'react-fast-compare'; import { generateUniqueID } from 'utils/helpers'; import { suffixContainerStyle } from './TextField.style'; import { TestProps } from '../../utils/types'; -import Icon from '../Icon'; import Label from '../Label'; -import { getTextInputBaseTokens } from '../TextInputBase/TextInputBase.tokens'; -import { AcceptedIconNames } from 'components/Icon/types'; import MultiTextFieldBase from 'components/MultiTextFieldBase/MultiTextFieldBase'; import { SelectOption } from 'components/Select/Select'; import TextInputBase, { TextInputBaseProps } from 'components/TextInputBase'; @@ -64,53 +60,24 @@ const TextField = React.forwardRef((props, ref onMultiValueClearAll = () => null, ...rest } = props; - const theme = useTheme(); - const tokens = getTextInputBaseTokens(theme); - - const inputRef = React.useRef(null); - const combinedRefs = useCombinedRefs(inputRef, ref); - - const isLocked = status?.type === 'read-only'; - - const hintMessageId = status?.hintMessage ? status?.id ?? `${id}_hintMessage` : undefined; - - const suffixContent = useMemo(() => { - if (isLocked || typeof suffix === 'string') { - const iconName = isLocked ? 'lock' : suffix; - - return ( - - ); - } - - return suffix; - }, [isLocked, suffix, theme.utils]); - - const handleClick = () => { - if (!isLocked && !isDisabled) { - combinedRefs.current?.focus(); - } - }; - - const textInputBaseSx = useMemo( - () => - !suffixContent - ? { - textField: { - paddingRight: tokens('paddingContentLeft'), - }, - } - : {}, - [suffixContent, tokens] - ); + const { + isLocked, + hintMessageId, + handleContainerClick, + textInputBaseSx, + suffixContent, + combinedRefs, + } = useFieldUtils({ + id, + suffix, + status, + isDisabled, + ref, + }); return ( -
+
{isMulti ? ( ((props, ref ref={combinedRefs} /> ) : ( - +
& { ref: React.ForwardedRef }) => { + const theme = useTheme(); + const tokens = getTextInputBaseTokens(theme); + + const isLocked = status?.type === 'read-only'; + const hintMessageId = status?.hintMessage ? status?.id ?? `${id}_hintMessage` : undefined; + + const inputRef = React.useRef(null); + const combinedRefs = useCombinedRefs(inputRef, ref); + + const suffixContent = useMemo(() => { + if (isLocked || typeof suffix === 'string') { + const iconName = isLocked ? 'lock' : suffix; + + return ( + + ); + } + + return suffix; + }, [isLocked, suffix, theme.utils]); + + const handleContainerClick = () => { + if (!isLocked && !isDisabled) { + combinedRefs.current?.focus(); + } + }; + + const textInputBaseSx = useCallback( + (hasSx: boolean) => { + if (hasSx) { + return { + textField: { + paddingRight: tokens('paddingContentLeft'), + }, + }; + } + + return {}; + }, + [tokens] + ); + + return { + isLocked, + hintMessageId, + suffixContent, + handleContainerClick, + textInputBaseSx, + combinedRefs, + }; +}; + +export default useFieldUtils;