UNPKG

prosperita-dumbo-react

Version:

Uma biblioteca de componentes React moderna e acessível, desenvolvida para aplicações financeiras com design system consistente.

1,632 lines (1,630 loc) 828 kB
import * as ee from "react"; import we, { useDebugValue as cs, createElement as Ja, useRef as de, useContext as jn, useState as q, useEffect as ge, useCallback as le, forwardRef as Ua, useLayoutEffect as Qa, useMemo as _e, createContext as S1, Component as sg, Fragment as da } from "react"; import cg, { createPortal as dg, flushSync as D1 } from "react-dom"; const ug = localStorage.getItem("@app:activated_theme_dumbo"), ds = ug || "banvox", Ht = { default: { neutral: { white: "#ffffff", black: "#000000" }, primary: { 10: "#dbd9de", 20: "#b8b2bd", 30: "#948c9d", 40: "#70657c", 50: "#4d3f5b", 60: "#29183a", 70: "#21132e", 80: "#190e23", 90: "#100a17", 100: "#08050c" }, accent: { 10: "#fcebe7", 20: "#fad7d0", 30: "#f7c3b8", 40: "#f4afa0", 50: "#f29b89", 60: "#ef8771", 70: "#bf6c5a", 80: "#8f5144", 90: "#60362d", 100: "#301b17" }, gray: { 10: "#f4f4f4", 20: "#e0e0e0", 30: "#c6c6c6", 40: "#a8a8a8", 50: "#8d8d8d", 60: "#6f6f6f", 70: "#525252", 80: "#393939", 90: "#262626", 100: "#161616" }, coolGray: { 10: "#f2f4f8", 20: "#dde1e6", 30: "#c1c7cd", 40: "#a2a9b0", 50: "#878d96", 60: "#697077", 70: "#4d5358", 80: "#343a3f", 90: "#21272a", 100: "#121619" }, warmGray: { 10: "#f7f3f2", 20: "#e5e0df", 30: "#cac5c4", 40: "#ada8a8", 50: "#8f8b8b", 60: "#726e6e", 70: "#565151", 80: "#3c3838", 90: "#272525", 100: "#171414" }, success: { 10: "#e1f8ed", 20: "#c2f2db", 30: "#a4ebc9", 40: "#86e4b7", 50: "#67dea5", 60: "#49d793", 70: "#3aac76", 80: "#2c8158", 90: "#1d563b", 100: "#0f2b1d" }, danger: { 10: "#fbe2e0", 20: "#f7c5c1", 30: "#f3a9a2", 40: "#ee8c82", 50: "#ea6f63", 60: "#e65244", 70: "#b84236", 80: "#8a3129", 90: "#5c211b", 100: "#2e100e" }, warning: { 10: "#fcf4d6", 20: "#fddc69", 30: "#f1c21b", 40: "#d2a106", 50: "#b28600", 60: "#8e6a00", 70: "#684e00", 80: "#483700", 90: "#302400", 100: "#1c1500" }, info: { 10: "#e5f6ff", 20: "#bae6ff", 30: "#82cfff", 40: "#33b1ff", 50: "#1192e8", 60: "#0072c3", 70: "#00539a", 80: "#003a6d", 90: "#012749", 100: "#061727" }, yellow: { 10: "#fcf4d6", 20: "#fddc69", 30: "#f1c21b", 40: "#d2a106", 50: "#b28600", 60: "#8e6a00", 70: "#684e00", 80: "#483700", 90: "#302400", 100: "#1c1500" }, orange: { 10: "#fff2e8", 20: "#ffd9be", 30: "#ffb784", 40: "#ff832b", 50: "#eb6200", 60: "#ba4e00", 70: "#8a3800", 80: "#5e2900", 90: "#3e1a00", 100: "#231000" }, red: { 10: "#fff1f1", 20: "#ffd7d9", 30: "#ffb3b8", 40: "#ff8389", 50: "#fa4d56", 60: "#da1e28", 70: "#a2191f", 80: "#750e13", 90: "#520408", 100: "#2d0709" }, magenta: { 10: "#fff0f7", 20: "#ffd6e8", 30: "#ffafd2", 40: "#ff7eb6", 50: "#ee5396", 60: "#d02670", 70: "#9f1853", 80: "#740937", 90: "#510224", 100: "#2a0a18" }, purple: { 10: "#f6f2ff", 20: "#e8daff", 30: "#d4bbff", 40: "#be95ff", 50: "#a56eff", 60: "#8a3ffc", 70: "#6929c4", 80: "#491d8b", 90: "#31135e", 100: "#1c0f30" }, blue: { 10: "#edf5ff", 20: "#d0e2ff", 30: "#a6c8ff", 40: "#78a9ff", 50: "#4589ff", 60: "#0f62fe", 70: "#0043ce", 80: "#002d9c", 90: "#001d6c", 100: "#001141" }, cyan: { 10: "#e5f6ff", 20: "#bae6ff", 30: "#82cfff", 40: "#33b1ff", 50: "#1192e8", 60: "#0072c3", 70: "#00539a", 80: "#003a6d", 90: "#012749", 100: "#061727" }, teal: { 10: "#d9fbfb", 20: "#9ef0f0", 30: "#3ddbd9", 40: "#08bdba", 50: "#009d9a", 60: "#007d79", 70: "#005d5d", 80: "#004144", 90: "#022b30", 100: "#081a1c" }, green: { 10: "#defbe6", 20: "#a7f0ba", 30: "#6fdc8c", 40: "#42be65", 50: "#24a148", 60: "#198038", 70: "#0e6027", 80: "#044317", 90: "#022d0d", 100: "#071908" } }, hover: { neutral: { white: "#e8e8e8", black: "#212121" }, primary: { 10: "#cac6ce", 20: "#a69fad", 30: "#82798d", 40: "#5f526c", 50: "#4d3f5b", 60: "#3b2c4b", 70: "#251634", 80: "#1d1129", 90: "#150c1d", 100: "#08050c" }, accent: { 10: "#fbe1dc", 20: "#f9cdc4", 30: "#f6b9ac", 40: "#f3a595", 50: "#f1917d", 60: "#d98472", 70: "#d77a66", 80: "#a75f4f", 90: "#784439", 100: "#301b17" }, gray: { 10: "#e8e8e8", 20: "#d1d1d1", 30: "#b5b5b5", 40: "#999999", 50: "#7a7a7a", 60: "#5e5e5e", 70: "#636363", 80: "#474747", 90: "#333333", 100: "#161616" }, coolGray: { 10: "#e4e9f1", 20: "#cdd3da", 30: "#adb5bd", 40: "#9199a1", 50: "#757b85", 60: "#585e64", 70: "#5d646a", 80: "#434a51", 90: "#2b3236", 100: "#121619" }, warmGray: { 10: "#f0e8e6", 20: "#d8d0cf", 30: "#b9b3b1", 40: "#9c9696", 50: "#7f7b7b", 60: "#605d5d", 70: "#696363", 80: "#4c4848", 90: "#343232", 100: "#171414" }, success: { 10: "#d2f5e4", 20: "#b3efd2", 30: "#95e8c0", 40: "#77e1ae", 50: "#58db9c", 60: "#42c285", 70: "#42c285", 80: "#339767", 90: "#256c4a", 100: "#0f2b1d" }, danger: { 10: "#f9d4d1", 20: "#f5b7b2", 30: "#f19b92", 40: "#ec7e73", 50: "#e86154", 60: "#cf4a3d", 70: "#cf4a3d", 80: "#a13a30", 90: "#732922", 100: "#2e100e" }, warning: { 10: "#f8e6a0", 20: "#fccd27", 30: "#ddb00e", 40: "#bc9005", 50: "#9e7700", 60: "#755800", 70: "#806000", 80: "#5c4600", 90: "#3d2e00", 100: "#1c1500" }, info: { 10: "#cceeff", 20: "#99daff", 30: "#57beff", 40: "#059fff", 50: "#0f7ec8", 60: "#005fa3", 70: "#0066bd", 80: "#00498a", 90: "#013360", 100: "#061727" }, yellow: { 10: "#f8e6a0", 20: "#fccd27", 30: "#ddb00e", 40: "#bc9005", 50: "#9e7700", 60: "#755800", 70: "#806000", 80: "#5c4600", 90: "#3d2e00", 100: "#332600" }, orange: { 10: "#ffe2cc", 20: "#ffc69e", 30: "#ff9d57", 40: "#fa6800", 50: "#cc5500", 60: "#9e4200", 70: "#a84400", 80: "#753300", 90: "#522200", 100: "#421e00" }, red: { 10: "#ffe0e0", 20: "#ffc2c5", 30: "#ff99a0", 40: "#ff6168", 50: "#ee0713", 60: "#b81922", 70: "#c21e25", 80: "#921118", 90: "#66050a", 100: "#540d11" }, magenta: { 10: "#ffe0ef", 20: "#ffbdda", 30: "#ff94c3", 40: "#ff57a0", 50: "#e3176f", 60: "#b0215f", 70: "#bf1d63", 80: "#8e0b43", 90: "#68032e", 100: "#53142f" }, purple: { 10: "#ede5ff", 20: "#dcc7ff", 30: "#c5a3ff", 40: "#ae7aff", 50: "#9352ff", 60: "#7822fb", 70: "#7c3dd6", 80: "#5b24ad", 90: "#40197b", 100: "#341c59" }, blue: { 10: "#dbebff", 20: "#b8d3ff", 30: "#8ab6ff", 40: "#5c97ff", 50: "#1f70ff", 60: "#0050e6", 70: "#0053ff", 80: "#0039c7", 90: "#00258a", 100: "#001f75" }, cyan: { 10: "#cceeff", 20: "#99daff", 30: "#57beff", 40: "#059fff", 50: "#0f7ec8", 60: "#005fa3", 70: "#0066bd", 80: "#00498a", 90: "#013360", 100: "#0b2947" }, teal: { 10: "#acf6f6", 20: "#57e5e5", 30: "#25cac8", 40: "#07aba9", 50: "#008a87", 60: "#006b68", 70: "#007070", 80: "#005357", 90: "#033940", 100: "#0f3034" }, green: { 10: "#b6f6c8", 20: "#74e792", 30: "#36ce5e", 40: "#3bab5a", 50: "#208e3f", 60: "#166f31", 70: "#11742f", 80: "#05521c", 90: "#033b11", 100: "#0d300f" } } }, P1 = { ...Ht, default: { ...Ht.default, primary: { 10: "#dbd9de", 20: "#b8b2bd", 30: "#948c9d", 40: "#70657c", 50: "#4d3f5b", 60: "#29183a", 70: "#21132e", 80: "#190e23", 90: "#100a17", 100: "#08050c" }, accent: { 10: "#fcebe7", 20: "#fad7d0", 30: "#f7c3b8", 40: "#f4afa0", 50: "#f29b89", 60: "#ef8771", 70: "#bf6c5a", 80: "#8f5144", 90: "#60362d", 100: "#301b17" } }, hover: { ...Ht.hover, primary: { 10: "#cac6ce", 20: "#a69fad", 30: "#82798d", 40: "#5f526c", 50: "#3b2c4b", 60: "#241532", 70: "#261636", 80: "#1d1129", 90: "#150c1d", 100: "#08050c" }, accent: { 10: "#fbe1dc", 20: "#f9cdc4", 30: "#f6b9ac", 40: "#f3a595", 50: "#f1917d", 60: "#cf7562", 70: "#df7e69", 80: "#a75f4f", 90: "#784439", 100: "#301b17" } } }, pg = P1, fg = { ...Ht, default: { ...Ht.default, primary: { 10: "#FDE6D7", 20: "#FBCEAF", 30: "#F9B588", 40: "#F69C60", 50: "#F48438", 60: "#F26B10", 70: "#C2560D", 80: "#91400A", 90: "#612B06", 100: "#301503" }, accent: { 10: "#E5DEF0", 20: "#CABDE1", 30: "#B09CD2", 40: "#967AC2", 50: "#7B59B3", 60: "#6138A4", 70: "#4E2D83", 80: "#3A2262", 90: "#271642", 100: "#130B21" } }, hover: { ...Ht.hover, primary: { 10: "#FCDAC3", 20: "#FAC29C", 30: "#F8A974", 40: "#F5904C", 50: "#F37824", 60: "#D25D0E", 70: "#E2640F", 80: "#AA4B0C", 90: "#793608", 100: "#301503" }, accent: { 10: "#D8CEE9", 20: "#BDADDA", 30: "#A38BCA", 40: "#896ABB", 50: "#6E49AC", 60: "#54318E", 70: "#5B3499", 80: "#442873", 90: "#311C52", 100: "#130B21" } } }, gg = { ...Ht, default: { ...Ht.default, primary: { 10: "#D6E1EB", 20: "#ADC3D7", 30: "#85A5C3", 40: "#5C86AF", 50: "#33689B", 60: "#0A4A87", 70: "#083B6C", 80: "#062C51", 90: "#041E36", 100: "#020F1B" }, accent: { 10: "#F5F1E7", 20: "#EAE2CE", 30: "#E0D4B6", 40: "#D6C69E", 50: "#CBB785", 60: "#C1A96D", 70: "#9A8757", 80: "#746541", 90: "#4D442C", 100: "#272216" } }, hover: { ...Ht.hover, primary: { 10: "#C2D2E1", 20: "#99B4CD", 30: "#7196B9", 40: "#4877A5", 50: "#1F5991", 60: "#094075", 70: "#09457E", 80: "#07345F", 90: "#052544", 100: "#020F1B" }, accent: { 10: "#fbe1dc", 20: "#f9cdc4", 30: "#f6b9ac", 40: "#f3a595", 50: "#f1917d", 60: "#cf7562", 70: "#df7e69", 80: "#a75f4f", 90: "#784439", 100: "#301b17" } } }, Eo = { default: pg, prosperita: P1, ivipbank: fg, banvox: gg }, hg = () => Eo[ds] !== void 0 ? Eo[ds] : Eo.default, Ka = hg(); if (Ka === void 0) throw new Error("Active theme is not defined"); const He = (e, t) => { if (!/^#[0-9A-F]{6}$/i.test(e)) throw new Error( "Invalid hex color format. It should be in the format #RRGGBB." ); const n = parseInt(e.slice(1, 3), 16), i = parseInt(e.slice(3, 5), 16), r = parseInt(e.slice(5, 7), 16), o = (d, u) => Math.min(255, Math.max(0, Math.round(d * (1 + u / 100)))), l = o(n, t).toString(16).padStart(2, "0"), c = o(i, t).toString(16).padStart(2, "0"), s = o(r, t).toString(16).padStart(2, "0"); return "#" + l + c + s; }, bg = (e) => ({ /* Background Tokens */ background: e.default.gray[100], backgroundActive: He(e.default.gray[50], 40), backgroundHover: He(e.hover.gray[50], 16), backgroundSelected: He(e.hover.gray[50], 24), backgroundSelectedHover: He(e.hover.gray[50], 32), backgroundBrand: e.default.primary[60], backgroundInverse: e.default.gray[10], backgroundInverseHover: e.hover.gray[10], /* Layer Tokens */ layer01: e.default.gray[90], layer02: e.default.gray[80], layer03: e.default.gray[70], layerHover01: e.hover.gray[90], layerHover02: e.hover.gray[80], layerHover03: e.hover.gray[70], layerActive01: e.default.gray[70], layerActive02: e.default.gray[60], layerActive03: e.default.gray[50], layerSelected01: e.default.gray[80], layerSelected02: e.default.gray[70], layerSelected03: e.default.gray[60], layerSelectedHover01: e.hover.gray[80], layerSelectedHover02: e.hover.gray[70], layerSelectedHover03: e.hover.gray[60], layerSelectedInverse: e.default.gray[10], layerSelectedDisabled: e.default.gray[60], /* Layer accent tokens */ layerAccent01: e.default.gray[80], layerAccent02: e.default.gray[70], layerAccent03: e.default.gray[60], layerAccentHover01: e.hover.gray[80], layerAccentHover02: e.hover.gray[70], layerAccentHover03: e.hover.gray[60], layerAccentActive01: e.hover.gray[70], layerAccentActive02: e.hover.gray[50], layerAccentActive03: e.hover.gray[80], /* Field tokens */ field01: e.default.gray[90], field02: e.default.gray[80], field03: e.default.gray[70], fieldHover01: e.hover.gray[90], fieldHover02: e.hover.gray[80], fieldHover03: e.hover.gray[70], /* Border Tokens */ borderSubtle00: e.default.gray[80], borderSubtle01: e.default.gray[80], borderSubtle02: e.default.gray[70], borderSubtle03: e.default.gray[60], borderSubtleSelected01: e.default.gray[70], borderSubtleSelected02: e.default.gray[60], borderSubtleSelected03: e.default.gray[50], borderStrong01: e.default.gray[60], borderStrong02: e.default.gray[50], borderStrong03: e.default.gray[40], borderTile01: e.default.gray[70], borderTile02: e.default.gray[60], borderTile03: e.default.gray[50], borderInverse: e.default.gray[10], borderDisabled: He(e.default.gray[50], 50), borderInteractive: e.default.primary[50], /* Text tokens */ textPrimary: e.default.gray[10], textSecondary: e.default.gray[30], textPlaceholder: e.default.gray[60], textOnColor: e.default.neutral.white, textOnColorDisabled: He(e.default.neutral.white, 25), textHelper: e.default.gray[50], textError: e.default.danger[40], textInverse: e.default.gray[100], textDisabled: He(e.default.gray[10], 25), /* Link tokens */ linkPrimary: e.default.primary[40], linkPrimaryHover: e.hover.primary[30], linkSecondary: e.default.primary[30], linkInverse: e.default.primary[60], linkVisited: e.default.accent[40], /* Icons tokens */ iconPrimary: e.default.gray[10], iconSecondary: e.default.gray[30], iconOnColor: e.default.neutral.white, iconOnColorDisabled: He(e.default.neutral.white, 25), iconInteractive: e.default.neutral.white, iconInverse: e.default.gray[100], iconDisabled: He(e.default.gray[10], 25), /* Support tokens */ supportError: e.default.danger[50], supportSuccess: e.default.success[40], supportWarning: e.default.warning[30], supportInfo: e.default.info[50], supportErrorInverse: e.default.danger[60], supportSuccessInverse: e.default.success[50], supportWarningInverse: e.default.warning[30], supportInfoInverse: e.default.info[70], supportCautionMajor: e.default.orange[40], supportCautionMinor: e.default.warning[30], supportUndefined: e.default.purple[60], /* Focus tokens */ focus: e.default.neutral.white, focusInset: e.default.gray[100], focusInverse: e.default.info[60], /* Miscellaneous tokens */ interactive: e.default.primary[50], highlight: e.default.primary[90], toogleOff: e.default.gray[60], overlay: He(e.default.gray[100], 70), skeletonElement: e.default.gray[70], skeletonBackground: e.hover.gray[80], /* Button tokens */ buttonPrimary: e.default.primary[60], buttonPrimaryHover: e.hover.primary[60], buttonPrimaryActive: e.default.primary[80], buttonAccent: e.default.accent[60], buttonAccentHover: e.hover.accent[60], buttonAccentActive: e.hover.accent[80], buttonSecondary: e.default.gray[60], buttonSecondaryHover: e.hover.gray[60], buttonSecondaryActive: e.default.gray[80], buttonTertiary: e.default.neutral.white, buttonTertiaryHover: e.default.gray[10], buttonTertiaryActive: e.default.gray[30], buttonDangerPrimary: e.default.danger[60], buttonDangerSecondary: e.default.danger[50], buttonDangerHover: e.hover.danger[60], buttonDangerActive: e.default.danger[80], buttonSeparator: e.default.gray[100], buttonDisabled: e.default.gray[70], /* Primary Tag Tokens */ tagBackgroundPrimary: e.default.primary[70], tagColorPrimary: e.default.primary[20], tagHoverPrimary: e.hover.primary[70], tagBackgroundAccent: e.default.accent[70], tagColorAccent: e.default.accent[20], tagHoverAccent: e.hover.accent[70], tagBackgroundBlue: e.default.info[70], tagColorBlue: e.default.info[20], tagHoverBlue: e.hover.info[70], tagBackgroundGreen: e.default.success[70], tagColorGreen: e.default.success[20], tagHoverGreen: e.hover.success[70], tagBackgroundRed: e.default.danger[70], tagColorRed: e.default.danger[20], tagHoverRed: e.hover.danger[70], tagBackgroundGray: e.default.gray[70], tagColorGray: e.default.gray[20], tagHoverGray: e.hover.gray[70], tagBackgroundCoolGray: e.default.coolGray[70], tagColorCoolGray: e.default.coolGray[20], tagHoverCoolGray: e.hover.coolGray[70], tagBackgroundWarmGray: e.default.warmGray[70], tagColorWarmGray: e.default.warmGray[20], tagHoverWarmGray: e.hover.warmGray[70], /* Notification Tokens */ notificationInfoBackground: e.default.gray[90], notificationInfoBorder: He(e.default.info[40], 50), notificationSuccessBackground: e.default.gray[90], notificationSuccessBorder: He(e.default.success[40], 50), notificationErrorBackground: e.default.gray[90], notificationErrorBorder: He(e.default.danger[40], 50), notificationWarningBackground: e.default.gray[90], notificationWarningBorder: He(e.default.warning[40], 50), notificationActionHover: e.hover.gray[90], notificationActionTertiaryInverse: e.default.primary[60], notificationActionTertiaryInverseText: e.default.neutral.white, notificationActionTertiaryInverseHover: e.default.primary[70], /* Inverse white + black Tokens */ whiteInLightThemes: e.default.neutral.black, blackInLightThemes: e.default.neutral.white }), mg = bg(Ka), vg = (e) => ({ /* Background Tokens */ background: e.default.neutral.white, backgroundActive: He(e.default.gray[50], 50), backgroundHover: He(e.hover.gray[50], 12), backgroundSelected: He(e.default.gray[50], 20), backgroundSelectedHover: He(e.default.gray[50], 32), backgroundBrand: e.default.primary[60], backgroundInverse: e.default.gray[80], backgroundInverseHover: e.hover.gray[80], /* Layer Tokens */ layer01: e.default.gray[10], layer02: e.default.neutral.white, layer03: e.default.gray[10], layerHover01: e.hover.gray[10], layerHover02: e.hover.neutral.white, layerHover03: e.hover.gray[10], layerActive01: e.default.gray[30], layerActive02: e.default.gray[30], layerActive03: e.default.gray[30], layerSelected01: e.default.gray[20], layerSelected02: e.default.gray[20], layerSelected03: e.default.gray[20], layerSelectedHover01: e.hover.gray[20], layerSelectedHover02: e.hover.gray[20], layerSelectedHover03: e.hover.gray[20], layerSelectedInverse: e.default.gray[100], layerSelectedDisabled: e.default.gray[50], /* Layer accent tokens */ layerAccent01: e.default.gray[20], layerAccent02: e.default.gray[20], layerAccent03: e.default.gray[20], layerAccentHover01: e.hover.gray[20], layerAccentHover02: e.hover.gray[20], layerAccentHover03: e.hover.gray[20], layerAccentActive01: e.hover.gray[40], layerAccentActive02: e.hover.gray[40], layerAccentActive03: e.hover.gray[40], /* Field tokens */ field01: e.default.gray[10], field02: e.default.neutral.white, field03: e.default.gray[10], fieldHover01: e.hover.gray[10], fieldHover02: e.hover.neutral.white, fieldHover03: e.hover.gray[10], /* Border Tokens */ borderSubtle00: e.default.gray[20], borderSubtle01: e.default.gray[30], borderSubtle02: e.default.gray[20], borderSubtle03: e.default.gray[30], borderSubtleSelected01: e.default.gray[30], borderSubtleSelected02: e.default.gray[30], borderSubtleSelected03: e.default.gray[30], borderStrong01: e.default.gray[50], borderStrong02: e.default.gray[50], borderStrong03: e.default.gray[50], borderTile01: e.default.gray[30], borderTile02: e.default.gray[40], borderTile03: e.default.gray[30], borderInverse: e.default.gray[100], borderDisabled: e.default.gray[30], borderInteractive: e.default.primary[60], /* Text tokens */ textPrimary: e.default.gray[100], textSecondary: e.default.gray[70], textPlaceholder: e.default.gray[40], textOnColor: e.default.neutral.white, textOnColorDisabled: e.default.gray[50], textHelper: e.default.gray[60], textError: e.default.danger[60], textInverse: e.default.neutral.white, textDisabled: He(e.default.gray[100], 25), /* Link tokens */ linkPrimary: e.default.primary[60], linkPrimaryHover: e.hover.primary[70], linkSecondary: e.default.primary[70], linkInverse: e.default.primary[40], linkVisited: e.default.accent[60], /* Icons tokens */ iconPrimary: e.default.gray[100], iconSecondary: e.default.gray[70], iconOnColor: e.default.neutral.white, iconOnColorDisabled: e.default.gray[50], iconInteractive: e.default.primary[60], iconInverse: e.default.neutral.white, iconDisabled: He(e.default.gray[100], 25), /* Support tokens */ supportError: e.default.danger[60], supportSuccess: e.default.success[60], supportWarning: e.default.warning[30], supportInfo: e.default.info[70], supportErrorInverse: e.default.danger[50], supportSuccessInverse: e.default.success[40], supportWarningInverse: e.default.warning[30], supportInfoInverse: e.default.info[50], supportCautionMajor: e.default.orange[40], supportCautionMinor: e.default.warning[30], supportUndefined: e.default.purple[60], /* Focus tokens */ focus: e.default.info[60], focusInset: e.default.neutral.white, focusInverse: e.default.neutral.white, /* Miscellaneous tokens */ interactive: e.default.primary[60], highlight: e.default.primary[20], toogleOff: e.default.gray[50], overlay: e.default.gray[100], skeletonElement: e.default.gray[30], skeletonBackground: e.hover.gray[10], /* Button tokens */ buttonPrimary: e.default.primary[60], buttonPrimaryHover: e.hover.primary[60], buttonPrimaryActive: e.default.primary[80], buttonAccent: e.default.accent[60], buttonAccentHover: e.hover.accent[60], buttonAccentActive: e.hover.accent[80], buttonSecondary: e.default.gray[80], buttonSecondaryHover: e.hover.gray[80], buttonSecondaryActive: e.default.gray[60], buttonTertiary: e.default.primary[60], buttonTertiaryHover: e.hover.primary[60], buttonTertiaryActive: e.hover.primary[80], buttonDangerPrimary: e.default.danger[60], buttonDangerSecondary: e.default.danger[60], buttonDangerHover: e.hover.danger[60], buttonDangerActive: e.default.danger[80], buttonSeparator: e.default.gray[20], buttonDisabled: e.default.gray[30], /* Primary Tag Tokens */ tagBackgroundPrimary: e.default.primary[20], tagColorPrimary: e.default.primary[70], tagHoverPrimary: e.hover.primary[20], tagBackgroundAccent: e.default.accent[20], tagColorAccent: e.default.accent[70], tagHoverAccent: e.hover.accent[20], tagBackgroundBlue: e.default.info[20], tagColorBlue: e.default.info[70], tagHoverBlue: e.hover.info[20], tagBackgroundGreen: e.default.success[20], tagColorGreen: e.default.success[70], tagHoverGreen: e.hover.success[20], tagBackgroundRed: e.default.danger[20], tagColorRed: e.default.danger[70], tagHoverRed: e.hover.danger[20], tagBackgroundGray: e.default.gray[20], tagColorGray: e.default.gray[70], tagHoverGray: e.hover.gray[20], tagBackgroundCoolGray: e.default.coolGray[20], tagColorCoolGray: e.default.coolGray[70], tagHoverCoolGray: e.hover.coolGray[20], tagBackgroundWarmGray: e.default.warmGray[20], tagColorWarmGray: e.default.warmGray[70], tagHoverWarmGray: e.hover.warmGray[20], /* Notification Tokens */ notificationInfoBackground: e.default.info[10], notificationInfoBorder: He(e.default.info[60], 30), notificationSuccessBackground: e.default.success[10], notificationSuccessBorder: He(e.default.success[60], 30), notificationErrorBackground: e.default.danger[10], notificationErrorBorder: He(e.default.danger[60], 30), notificationWarningBackground: e.default.warning[10], notificationWarningBorder: He(e.default.warning[60], 30), notificationActionHover: He(e.default.neutral.white, 0), notificationActionTertiaryInverse: He( e.default.neutral.white, 0 ), notificationActionTertiaryInverseText: e.default.coolGray[100], notificationActionTertiaryInverseHover: e.hover.gray[10], /* Inverse white + black Tokens */ whiteInLightThemes: e.default.neutral.white, blackInLightThemes: e.default.neutral.black }), xg = vg(Ka), us = { light: xg, dark: mg }, yg = () => { const e = localStorage.getItem("@app:theme_dumbo"), t = String(e) || "light"; return t === "dark" || t === "light" ? us[t] : us.light; }, f = yg(); if (f === void 0) throw new Error("Contextual theme is not defined"); function Cg(e) { return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e; } var ua = { exports: {} }, er = {}; /** * @license React * react-jsx-runtime.production.min.js * * Copyright (c) Facebook, Inc. and its affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var ps; function wg() { if (ps) return er; ps = 1; var e = we, t = Symbol.for("react.element"), n = Symbol.for("react.fragment"), i = Object.prototype.hasOwnProperty, r = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, o = { key: !0, ref: !0, __self: !0, __source: !0 }; function l(c, s, d) { var u, p = {}, g = null, h = null; d !== void 0 && (g = "" + d), s.key !== void 0 && (g = "" + s.key), s.ref !== void 0 && (h = s.ref); for (u in s) i.call(s, u) && !o.hasOwnProperty(u) && (p[u] = s[u]); if (c && c.defaultProps) for (u in s = c.defaultProps, s) p[u] === void 0 && (p[u] = s[u]); return { $$typeof: t, type: c, key: g, ref: h, props: p, _owner: r.current }; } return er.Fragment = n, er.jsx = l, er.jsxs = l, er; } var tr = {}; /** * @license React * react-jsx-runtime.development.js * * Copyright (c) Facebook, Inc. and its affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var fs; function Ig() { return fs || (fs = 1, process.env.NODE_ENV !== "production" && function() { var e = we, t = Symbol.for("react.element"), n = Symbol.for("react.portal"), i = Symbol.for("react.fragment"), r = Symbol.for("react.strict_mode"), o = Symbol.for("react.profiler"), l = Symbol.for("react.provider"), c = Symbol.for("react.context"), s = Symbol.for("react.forward_ref"), d = Symbol.for("react.suspense"), u = Symbol.for("react.suspense_list"), p = Symbol.for("react.memo"), g = Symbol.for("react.lazy"), h = Symbol.for("react.offscreen"), v = Symbol.iterator, m = "@@iterator"; function b(N) { if (N === null || typeof N != "object") return null; var W = v && N[v] || N[m]; return typeof W == "function" ? W : null; } var x = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED; function w(N) { { for (var W = arguments.length, ie = new Array(W > 1 ? W - 1 : 0), be = 1; be < W; be++) ie[be - 1] = arguments[be]; I("error", N, ie); } } function I(N, W, ie) { { var be = x.ReactDebugCurrentFrame, Oe = be.getStackAddendum(); Oe !== "" && (W += "%s", ie = ie.concat([Oe])); var Le = ie.map(function(Se) { return String(Se); }); Le.unshift("Warning: " + W), Function.prototype.apply.call(console[N], console, Le); } } var S = !1, E = !1, A = !1, D = !1, B = !1, F; F = Symbol.for("react.module.reference"); function Z(N) { return !!(typeof N == "string" || typeof N == "function" || N === i || N === o || B || N === r || N === d || N === u || D || N === h || S || E || A || typeof N == "object" && N !== null && (N.$$typeof === g || N.$$typeof === p || N.$$typeof === l || N.$$typeof === c || N.$$typeof === s || // This needs to include all possible module reference object // types supported by any Flight configuration anywhere since // we don't know which Flight build this will end up being used // with. N.$$typeof === F || N.getModuleId !== void 0)); } function Y(N, W, ie) { var be = N.displayName; if (be) return be; var Oe = W.displayName || W.name || ""; return Oe !== "" ? ie + "(" + Oe + ")" : ie; } function M(N) { return N.displayName || "Context"; } function H(N) { if (N == null) return null; if (typeof N.tag == "number" && w("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."), typeof N == "function") return N.displayName || N.name || null; if (typeof N == "string") return N; switch (N) { case i: return "Fragment"; case n: return "Portal"; case o: return "Profiler"; case r: return "StrictMode"; case d: return "Suspense"; case u: return "SuspenseList"; } if (typeof N == "object") switch (N.$$typeof) { case c: var W = N; return M(W) + ".Consumer"; case l: var ie = N; return M(ie._context) + ".Provider"; case s: return Y(N, N.render, "ForwardRef"); case p: var be = N.displayName || null; return be !== null ? be : H(N.type) || "Memo"; case g: { var Oe = N, Le = Oe._payload, Se = Oe._init; try { return H(Se(Le)); } catch { return null; } } } return null; } var P = Object.assign, R = 0, z, J, _, K, te, xe, re; function ye() { } ye.__reactDisabledLog = !0; function k() { { if (R === 0) { z = console.log, J = console.info, _ = console.warn, K = console.error, te = console.group, xe = console.groupCollapsed, re = console.groupEnd; var N = { configurable: !0, enumerable: !0, value: ye, writable: !0 }; Object.defineProperties(console, { info: N, log: N, warn: N, error: N, group: N, groupCollapsed: N, groupEnd: N }); } R++; } } function U() { { if (R--, R === 0) { var N = { configurable: !0, enumerable: !0, writable: !0 }; Object.defineProperties(console, { log: P({}, N, { value: z }), info: P({}, N, { value: J }), warn: P({}, N, { value: _ }), error: P({}, N, { value: K }), group: P({}, N, { value: te }), groupCollapsed: P({}, N, { value: xe }), groupEnd: P({}, N, { value: re }) }); } R < 0 && w("disabledDepth fell below zero. This is a bug in React. Please file an issue."); } } var ne = x.ReactCurrentDispatcher, he; function me(N, W, ie) { { if (he === void 0) try { throw Error(); } catch (Oe) { var be = Oe.stack.trim().match(/\n( *(at )?)/); he = be && be[1] || ""; } return ` ` + he + N; } } var Pe = !1, Me; { var Ke = typeof WeakMap == "function" ? WeakMap : Map; Me = new Ke(); } function X(N, W) { if (!N || Pe) return ""; { var ie = Me.get(N); if (ie !== void 0) return ie; } var be; Pe = !0; var Oe = Error.prepareStackTrace; Error.prepareStackTrace = void 0; var Le; Le = ne.current, ne.current = null, k(); try { if (W) { var Se = function() { throw Error(); }; if (Object.defineProperty(Se.prototype, "props", { set: function() { throw Error(); } }), typeof Reflect == "object" && Reflect.construct) { try { Reflect.construct(Se, []); } catch (gt) { be = gt; } Reflect.construct(N, [], Se); } else { try { Se.call(); } catch (gt) { be = gt; } N.call(Se.prototype); } } else { try { throw Error(); } catch (gt) { be = gt; } N(); } } catch (gt) { if (gt && be && typeof gt.stack == "string") { for (var Ae = gt.stack.split(` `), ut = be.stack.split(` `), Qe = Ae.length - 1, qe = ut.length - 1; Qe >= 1 && qe >= 0 && Ae[Qe] !== ut[qe]; ) qe--; for (; Qe >= 1 && qe >= 0; Qe--, qe--) if (Ae[Qe] !== ut[qe]) { if (Qe !== 1 || qe !== 1) do if (Qe--, qe--, qe < 0 || Ae[Qe] !== ut[qe]) { var Et = ` ` + Ae[Qe].replace(" at new ", " at "); return N.displayName && Et.includes("<anonymous>") && (Et = Et.replace("<anonymous>", N.displayName)), typeof N == "function" && Me.set(N, Et), Et; } while (Qe >= 1 && qe >= 0); break; } } } finally { Pe = !1, ne.current = Le, U(), Error.prepareStackTrace = Oe; } var Nn = N ? N.displayName || N.name : "", an = Nn ? me(Nn) : ""; return typeof N == "function" && Me.set(N, an), an; } function Ue(N, W, ie) { return X(N, !1); } function nt(N) { var W = N.prototype; return !!(W && W.isReactComponent); } function j(N, W, ie) { if (N == null) return ""; if (typeof N == "function") return X(N, nt(N)); if (typeof N == "string") return me(N); switch (N) { case d: return me("Suspense"); case u: return me("SuspenseList"); } if (typeof N == "object") switch (N.$$typeof) { case s: return Ue(N.render); case p: return j(N.type, W, ie); case g: { var be = N, Oe = be._payload, Le = be._init; try { return j(Le(Oe), W, ie); } catch { } } } return ""; } var L = Object.prototype.hasOwnProperty, Ge = {}, ke = x.ReactDebugCurrentFrame; function rt(N) { if (N) { var W = N._owner, ie = j(N.type, N._source, W ? W.type : null); ke.setExtraStackFrame(ie); } else ke.setExtraStackFrame(null); } function Vt(N, W, ie, be, Oe) { { var Le = Function.call.bind(L); for (var Se in N) if (Le(N, Se)) { var Ae = void 0; try { if (typeof N[Se] != "function") { var ut = Error((be || "React class") + ": " + ie + " type `" + Se + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof N[Se] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`."); throw ut.name = "Invariant Violation", ut; } Ae = N[Se](W, Se, be, ie, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"); } catch (Qe) { Ae = Qe; } Ae && !(Ae instanceof Error) && (rt(Oe), w("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", be || "React class", ie, Se, typeof Ae), rt(null)), Ae instanceof Error && !(Ae.message in Ge) && (Ge[Ae.message] = !0, rt(Oe), w("Failed %s type: %s", ie, Ae.message), rt(null)); } } } var Sn = Array.isArray; function T(N) { return Sn(N); } function Q(N) { { var W = typeof Symbol == "function" && Symbol.toStringTag, ie = W && N[Symbol.toStringTag] || N.constructor.name || "Object"; return ie; } } function oe(N) { try { return se(N), !1; } catch { return !0; } } function se(N) { return "" + N; } function ve(N) { if (oe(N)) return w("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", Q(N)), se(N); } var G = x.ReactCurrentOwner, O = { key: !0, ref: !0, __self: !0, __source: !0 }, ae, Ee; function Ie(N) { if (L.call(N, "ref")) { var W = Object.getOwnPropertyDescriptor(N, "ref").get; if (W && W.isReactWarning) return !1; } return N.ref !== void 0; } function nn(N) { if (L.call(N, "key")) { var W = Object.getOwnPropertyDescriptor(N, "key").get; if (W && W.isReactWarning) return !1; } return N.key !== void 0; } function rn(N, W) { typeof N.ref == "string" && G.current; } function on(N, W) { { var ie = function() { ae || (ae = !0, w("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", W)); }; ie.isReactWarning = !0, Object.defineProperty(N, "key", { get: ie, configurable: !0 }); } } function Dn(N, W) { { var ie = function() { Ee || (Ee = !0, w("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", W)); }; ie.isReactWarning = !0, Object.defineProperty(N, "ref", { get: ie, configurable: !0 }); } } var Uf = function(N, W, ie, be, Oe, Le, Se) { var Ae = { // This tag allows us to uniquely identify this as a React Element $$typeof: t, // Built-in properties that belong on the element type: N, key: W, ref: ie, props: Se, // Record the component responsible for creating this element. _owner: Le }; return Ae._store = {}, Object.defineProperty(Ae._store, "validated", { configurable: !1, enumerable: !1, writable: !0, value: !1 }), Object.defineProperty(Ae, "_self", { configurable: !1, enumerable: !1, writable: !1, value: be }), Object.defineProperty(Ae, "_source", { configurable: !1, enumerable: !1, writable: !1, value: Oe }), Object.freeze && (Object.freeze(Ae.props), Object.freeze(Ae)), Ae; }; function Qf(N, W, ie, be, Oe) { { var Le, Se = {}, Ae = null, ut = null; ie !== void 0 && (ve(ie), Ae = "" + ie), nn(W) && (ve(W.key), Ae = "" + W.key), Ie(W) && (ut = W.ref, rn(W, Oe)); for (Le in W) L.call(W, Le) && !O.hasOwnProperty(Le) && (Se[Le] = W[Le]); if (N && N.defaultProps) { var Qe = N.defaultProps; for (Le in Qe) Se[Le] === void 0 && (Se[Le] = Qe[Le]); } if (Ae || ut) { var qe = typeof N == "function" ? N.displayName || N.name || "Unknown" : N; Ae && on(Se, qe), ut && Dn(Se, qe); } return Uf(N, Ae, ut, Oe, be, G.current, Se); } } var yo = x.ReactCurrentOwner, ns = x.ReactDebugCurrentFrame; function Pn(N) { if (N) { var W = N._owner, ie = j(N.type, N._source, W ? W.type : null); ns.setExtraStackFrame(ie); } else ns.setExtraStackFrame(null); } var Co; Co = !1; function wo(N) { return typeof N == "object" && N !== null && N.$$typeof === t; } function rs() { { if (yo.current) { var N = H(yo.current.type); if (N) return ` Check the render method of \`` + N + "`."; } return ""; } } function Kf(N) { return ""; } var is = {}; function qf(N) { { var W = rs(); if (!W) { var ie = typeof N == "string" ? N : N.displayName || N.name; ie && (W = ` Check the top-level render call using <` + ie + ">."); } return W; } } function os(N, W) { { if (!N._store || N._store.validated || N.key != null) return; N._store.validated = !0; var ie = qf(W); if (is[ie]) return; is[ie] = !0; var be = ""; N && N._owner && N._owner !== yo.current && (be = " It was passed a child from " + H(N._owner.type) + "."), Pn(N), w('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', ie, be), Pn(null); } } function as(N, W) { { if (typeof N != "object") return; if (T(N)) for (var ie = 0; ie < N.length; ie++) { var be = N[ie]; wo(be) && os(be, W); } else if (wo(N)) N._store && (N._store.validated = !0); else if (N) { var Oe = b(N); if (typeof Oe == "function" && Oe !== N.entries) for (var Le = Oe.call(N), Se; !(Se = Le.next()).done; ) wo(Se.value) && os(Se.value, W); } } } function eg(N) { { var W = N.type; if (W == null || typeof W == "string") return; var ie; if (typeof W == "function") ie = W.propTypes; else if (typeof W == "object" && (W.$$typeof === s || // Note: Memo only checks outer props here. // Inner props are checked in the reconciler. W.$$typeof === p)) ie = W.propTypes; else return; if (ie) { var be = H(W); Vt(ie, N.props, "prop", be, N); } else if (W.PropTypes !== void 0 && !Co) { Co = !0; var Oe = H(W); w("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", Oe || "Unknown"); } typeof W.getDefaultProps == "function" && !W.getDefaultProps.isReactClassApproved && w("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead."); } } function tg(N) { { for (var W = Object.keys(N.props), ie = 0; ie < W.length; ie++) { var be = W[ie]; if (be !== "children" && be !== "key") { Pn(N), w("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", be), Pn(null); break; } } N.ref !== null && (Pn(N), w("Invalid attribute `ref` supplied to `React.Fragment`."), Pn(null)); } } var ls = {}; function ss(N, W, ie, be, Oe, Le) { { var Se = Z(N); if (!Se) { var Ae = ""; (N === void 0 || typeof N == "object" && N !== null && Object.keys(N).length === 0) && (Ae += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports."); var ut = Kf(); ut ? Ae += ut : Ae += rs(); var Qe; N === null ? Qe = "null" : T(N) ? Qe = "array" : N !== void 0 && N.$$typeof === t ? (Qe = "<" + (H(N.type) || "Unknown") + " />", Ae = " Did you accidentally export a JSX literal instead of a component?") : Qe = typeof N, w("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", Qe, Ae); } var qe = Qf(N, W, ie, Oe, Le); if (qe == null) return qe; if (Se) { var Et = W.children; if (Et !== void 0) if (be) if (T(Et)) { for (var Nn = 0; Nn < Et.length; Nn++) as(Et[Nn], N); Object.freeze && Object.freeze(Et); } else w("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."); else as(Et, N); } if (L.call(W, "key")) { var an = H(N), gt = Object.keys(W).filter(function(lg) { return lg !== "key"; }), Io = gt.length > 0 ? "{key: someKey, " + gt.join(": ..., ") + ": ...}" : "{key: someKey}"; if (!ls[an + Io]) { var ag = gt.length > 0 ? "{" + gt.join(": ..., ") + ": ...}" : "{}"; w(`A props object containing a "key" prop is being spread into JSX: let props = %s; <%s {...props} /> React keys must be passed directly to JSX without using spread: let props = %s; <%s key={someKey} {...props} />`, Io, an, ag, an), ls[an + Io] = !0; } } return N === i ? tg(qe) : eg(qe), qe; } } function ng(N, W, ie) { return ss(N, W, ie, !0); } function rg(N, W, ie) { return ss(N, W, ie, !1); } var ig = rg, og = ng; tr.Fragment = i, tr.jsx = ig, tr.jsxs = og; }()), tr; } process.env.NODE_ENV === "production" ? ua.exports = wg() : ua.exports = Ig(); var qa = ua.exports; const $ = qa.Fragment, a = qa.jsx, C = qa.jsxs; var ht = function() { return ht = Object.assign || function(t) { for (var n, i = 1, r = arguments.length; i < r; i++) { n = arguments[i]; for (var o in n) Object.prototype.hasOwnProperty.call(n, o) && (t[o] = n[o]); } return t; }, ht.apply(this, arguments); }; function bn(e, t, n) { if (n || arguments.length === 2) for (var i = 0, r = t.length, o; i < r; i++) (o || !(i in t)) && (o || (o = Array.prototype.slice.call(t, 0, i)), o[i] = t[i]); return e.concat(o || Array.prototype.slice.call(t)); } function Eg(e) { var t = /* @__PURE__ */ Object.create(null); return function(n) { return t[n] === void 0 && (t[n] = e(n)), t[n]; }; } var Ag = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|abbr|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|disableRemotePlayback|download|draggable|encType|enterKeyHint|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|translate|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|in