@skbkontur/react-ui 0.0.0-95a1dbe516 → 0.0.0-9ab4f802f3

package/cjs/internal/ThemeShowcase/ThemeShowcase.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ThemeShowcase.tsx"],"names":["EMPTY_ARRAY","ALL_VARIABLES","Object","keys","defaultVariables","ThemeShowcase","props","state","isUnmounting","variablesDiff","getItems","query","Promise","resolve","getValues","handleVariableChange","item","setState","selectedVariable","handleUnexpectedVariableInput","values","length","resetVariable","undefined","isDebugMode","forEach","variable","found","ALL_USED_VARIABLES","includes","push","render","IS_PROXY_SUPPORTED","descriptionsToRender","COMPONENT_DESCRIPTIONS_BY_VARIABLE","value","COMPONENT_DESCRIPTIONS","callsCount","CALLS_COUNT","executionTime","EXECUTION_TIME","toFixed","emotion","theme","styles","searchBar","sort","map","componentName","componentWillUnmount","lowerCaseQuery","toLowerCase","trim","allItems","filter","usedVariable","startsWith","usedVariableName","label","React","Component","ComponentShowcase","name","description","onVariableSelect","elements","isSticky","cx","heading","headingSticky","table","headerCell","width","el","ComponentShowcaseRow","element","row","rowSpan","variables","invisibleRow","invisibleDarkRow","darkVariables","cell","majorCell","elementName","invisibleCell","varName","dependencies","variableDefault","variableDark","hasNoVariables","suspiciousRow","darkRow","VariableName","variableName","handleVariableSelect","renderDependencies","dependency","DependencyName","dependencyName","onDependencySelect","handleDependencySelect","dependencyDefault","dependencyDark","VariableValue","valueIsColor","valueIsGradient","isGradient","hasExample","borderColor","ColorFunctions","contrast","colorExample","background","ShowUnusedVariables","diff","unusedVariablesWarning","v","input"],"mappings":"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","sourcesContent":["import React from 'react';\nimport type { Emotion } from '@emotion/css/create-instance';\n\nimport { isColor } from '../../lib/styles/ColorHelpers';\nimport { DEFAULT_THEME as defaultVariables } from '../../lib/theming/themes/DefaultTheme';\nimport { DARK_THEME as darkVariables } from '../../lib/theming/themes/DarkTheme';\nimport { ComboBox, ComboBoxItem } from '../../components/ComboBox';\nimport { Gapped } from '../../components/Gapped';\nimport { Link } from '../../components/Link';\nimport { Sticky } from '../../components/Sticky';\nimport * as ColorFunctions from '../../lib/styles/ColorFunctions';\nimport { Tooltip } from '../../components/Tooltip';\nimport { IS_PROXY_SUPPORTED } from '../../lib/Supports';\nimport { Theme } from '../../lib/theming/Theme';\nimport { EmotionConsumer, useEmotion } from '../../lib/theming/Emotion';\nimport { ThemeConsumer } from '../../lib/theming/ThemeContext';\nimport { useTheme } from '../../lib/theming/useTheme';\n\nimport {\n  ALL_USED_VARIABLES,\n  CALLS_COUNT,\n  COMPONENT_DESCRIPTIONS,\n  COMPONENT_DESCRIPTIONS_BY_VARIABLE,\n  ComponentDescriptionType,\n  ComponentRowDescriptionType,\n  EXECUTION_TIME,\n} from './VariablesCollector';\nimport { getStyles } from './ThemeShowcase.styles';\n\nconst EMPTY_ARRAY: string[] = [];\n\nconst ALL_VARIABLES = Object.keys(defaultVariables) as Array<keyof Theme>;\n\ninterface ShowcaseProps {\n  isDebugMode?: boolean;\n}\ninterface ShowcaseState {\n  selectedVariable?: ComboBoxItem;\n}\n\nexport class ThemeShowcase extends React.Component<ShowcaseProps, ShowcaseState> {\n  public state: ShowcaseState = {};\n  private emotion!: Emotion;\n\n  private isUnmounting = false;\n  private variablesDiff: string[] = [];\n\n  constructor(props: ShowcaseProps) {\n    super(props);\n    if (props.isDebugMode) {\n      ALL_VARIABLES.forEach((variable) => {\n        const found = ALL_USED_VARIABLES.includes(variable);\n        if (!found) {\n          this.variablesDiff.push(variable);\n        }\n      });\n    }\n  }\n\n  public render() {\n    if (!IS_PROXY_SUPPORTED) {\n      return (\n        <div>\n          Таблица использования переменных доступна только в{' '}\n          <Link href={'https://caniuse.com/#feat=proxy'} target={'_blank'}>\n            браузерах с поддержкой Proxy\n          </Link>\n          .\n        </div>\n      );\n    }\n\n    const selectedVariable = this.state.selectedVariable;\n    const descriptionsToRender = selectedVariable\n      ? COMPONENT_DESCRIPTIONS_BY_VARIABLE[selectedVariable.value] || {}\n      : COMPONENT_DESCRIPTIONS;\n\n    const isDebugMode = this.props.isDebugMode;\n    const callsCount = isDebugMode ? `(${CALLS_COUNT} вызовов)` : '';\n    const executionTime = isDebugMode ? `Сгенерировано за ${EXECUTION_TIME.toFixed(3)}ms` : '';\n\n    return (\n      <EmotionConsumer>\n        {(emotion) => {\n          this.emotion = emotion;\n          return (\n            <ThemeConsumer>\n              {(theme) => {\n                const styles = getStyles(this.emotion);\n                return (\n                  <Gapped wrap gap={30} verticalAlign={'top'}>\n                    <div>\n                      <Sticky side={'top'}>\n                        <div className={styles.searchBar(theme)} data-perf-info={`${executionTime} ${callsCount}`}>\n                          <Gapped gap={15}>\n                            <ComboBox\n                              getItems={this.getItems}\n                              value={selectedVariable}\n                              onValueChange={this.handleVariableChange}\n                              onUnexpectedInput={this.handleUnexpectedVariableInput}\n                              placeholder={'поиск по названию переменной'}\n                            />\n                            {!!selectedVariable && <Link onClick={this.resetVariable}>сбросить</Link>}\n                          </Gapped>\n                        </div>\n                      </Sticky>\n                      {Object.keys(descriptionsToRender)\n                        .sort()\n                        .map((componentName) => (\n                          <ComponentShowcase\n                            key={componentName}\n                            name={componentName}\n                            description={descriptionsToRender[componentName]}\n                            isDebugMode={isDebugMode}\n                            onVariableSelect={this.handleVariableChange}\n                          />\n                        ))}\n                    </div>\n                    <ShowUnusedVariables diff={this.variablesDiff} />\n                  </Gapped>\n                );\n              }}\n            </ThemeConsumer>\n          );\n        }}\n      </EmotionConsumer>\n    );\n  }\n  public componentWillUnmount(): void {\n    this.isUnmounting = true;\n  }\n\n  private getValues(query: string) {\n    const lowerCaseQuery = query && query.toLowerCase().trim();\n    let allItems = ALL_USED_VARIABLES;\n    if (lowerCaseQuery) {\n      allItems = ALL_USED_VARIABLES.filter((usedVariable) => usedVariable.toLowerCase().startsWith(lowerCaseQuery));\n    }\n    return allItems.map((usedVariableName) => ({\n      value: usedVariableName,\n      label: usedVariableName,\n    }));\n  }\n  private getItems = (query: string) => {\n    return Promise.resolve(this.getValues(query));\n  };\n  private handleVariableChange = (item: ComboBoxItem) => {\n    if (!this.isUnmounting) {\n      this.setState({ selectedVariable: item });\n    }\n  };\n  private handleUnexpectedVariableInput = (query: string) => {\n    const values = this.getValues(query);\n    if (values.length > 0) {\n      return values[0];\n    }\n\n    return this.resetVariable();\n  };\n  private resetVariable = () => {\n    if (!this.isUnmounting) {\n      this.setState({ selectedVariable: undefined });\n    }\n  };\n}\n\ninterface ComponentShowcaseProps {\n  name: string;\n  description: ComponentDescriptionType;\n  isDebugMode?: boolean;\n  onVariableSelect: (item: ComboBoxItem) => void;\n}\n\nfunction ComponentShowcase(props: ComponentShowcaseProps) {\n  const theme = useTheme();\n  const emotion = useEmotion();\n\n  const { name, description, onVariableSelect, isDebugMode } = props;\n  const elements = Object.keys(description);\n  const styles = getStyles(emotion);\n  return elements.length ? (\n    <React.Fragment>\n      <Sticky side={'top'} offset={40}>\n        {(isSticky) => (\n          <h2\n            className={emotion.cx({\n              [styles.heading(theme)]: true,\n              [styles.headingSticky()]: isSticky,\n            })}\n          >\n            {props.name}\n          </h2>\n        )}\n      </Sticky>\n      <table className={styles.table()}>\n        <thead>\n          <tr>\n            <th className={styles.headerCell()} style={{ width: 170 }}>\n              ClassName\n            </th>\n            <th className={styles.headerCell()} style={{ width: 210 }}>\n              Variable Name\n            </th>\n            <th className={styles.headerCell()} style={{ width: 250 }}>\n              Default Value\n            </th>\n            <th className={styles.headerCell()} style={{ width: 250 }}>\n              Dark Value\n            </th>\n          </tr>\n        </thead>\n        <tbody>\n          {elements.map((el) => (\n            <ComponentShowcaseRow\n              key={`${name}_${el}`}\n              element={el}\n              row={description[el]}\n              onVariableSelect={onVariableSelect}\n              isDebugMode={isDebugMode}\n            />\n          ))}\n        </tbody>\n      </table>\n    </React.Fragment>\n  ) : null;\n}\n\ninterface ComponentShowcaseRowProps {\n  element: string;\n  row: ComponentRowDescriptionType;\n  isDebugMode?: boolean;\n  onVariableSelect: (item: ComboBoxItem) => void;\n}\n\nfunction ComponentShowcaseRow(props: ComponentShowcaseRowProps) {\n  const theme = useTheme();\n  const emotion = useEmotion();\n\n  const { element: el, row, isDebugMode } = props;\n  const rowSpan = row.variables.length + 1;\n  const styles = getStyles(emotion);\n  return (\n    <React.Fragment>\n      <tr className={emotion.cx(styles.invisibleRow(), { [styles.invisibleDarkRow()]: theme === darkVariables })}>\n        <td className={emotion.cx(styles.cell(), styles.majorCell())} rowSpan={rowSpan}>\n          <span className={styles.elementName()}>.{el}</span>\n        </td>\n        <td className={styles.invisibleCell()} />\n        <td className={styles.invisibleCell()} />\n        <td className={styles.invisibleCell()} />\n      </tr>\n      {row.variables.map((varName) => {\n        const dependencies = row.dependencies[varName] || EMPTY_ARRAY;\n        const variableDefault = defaultVariables[varName] as string;\n        const variableDark = darkVariables[varName] as string;\n        const hasNoVariables = isDebugMode && !variableDefault;\n        return (\n          <tr\n            key={`${el}_${varName}`}\n            className={emotion.cx(styles.row(), {\n              [styles.suspiciousRow()]: hasNoVariables,\n              [styles.darkRow()]: theme === darkVariables,\n            })}\n          >\n            <td className={styles.cell()}>\n              <VariableName\n                variableName={varName as string}\n                dependencies={dependencies}\n                onVariableSelect={props.onVariableSelect}\n              />\n            </td>\n            <td className={styles.cell()}>\n              <VariableValue value={variableDefault} />\n            </td>\n            <td className={styles.cell()}>\n              <VariableValue value={variableDark} />\n            </td>\n          </tr>\n        );\n      })}\n    </React.Fragment>\n  );\n}\n\ninterface VariableNameProps {\n  variableName: string;\n  dependencies: Array<keyof Theme>;\n  onVariableSelect: (item: ComboBoxItem) => void;\n}\n\nfunction VariableName({ variableName, dependencies, onVariableSelect }: VariableNameProps) {\n  const emotion = useEmotion();\n  const styles = getStyles(emotion);\n\n  return (\n    <span>\n      <span className={styles.variableName()} onClick={handleVariableSelect}>\n        {variableName}\n      </span>\n      {dependencies.length > 0 && renderDependencies()}\n    </span>\n  );\n\n  function renderDependencies() {\n    return (\n      <React.Fragment>\n        <br />\n        <br />\n        зависит от:\n        {dependencies.map((dependency) => (\n          <DependencyName\n            key={`dependency_${dependency}`}\n            dependencyName={dependency}\n            onDependencySelect={onVariableSelect}\n          />\n        ))}\n      </React.Fragment>\n    );\n  }\n\n  function handleVariableSelect() {\n    if (onVariableSelect) {\n      onVariableSelect({ value: variableName, label: variableName });\n    }\n  }\n}\n\ninterface DependencyNameProps {\n  dependencyName: keyof Theme;\n  onDependencySelect: (item: ComboBoxItem) => void;\n}\n\nfunction DependencyName({ dependencyName, onDependencySelect }: DependencyNameProps) {\n  const emotion = useEmotion();\n  const styles = getStyles(emotion);\n\n  return (\n    <React.Fragment>\n      <br />\n      &ndash;{' '}\n      <Tooltip trigger={'hover'} render={getValues} pos={'right middle'}>\n        <span className={styles.variableName()} onClick={handleDependencySelect}>\n          {dependencyName}\n        </span>\n      </Tooltip>\n    </React.Fragment>\n  );\n\n  function getValues() {\n    const dependencyDefault = defaultVariables[dependencyName] as string;\n    const dependencyDark = darkVariables[dependencyName] as string;\n    return (\n      <React.Fragment>\n        <span>Default value: {<VariableValue value={dependencyDefault} />}</span>\n        <span>Dark value: {<VariableValue value={dependencyDark} />}</span>\n      </React.Fragment>\n    );\n  }\n\n  function handleDependencySelect() {\n    if (onDependencySelect) {\n      onDependencySelect({ value: dependencyName, label: dependencyName });\n    }\n  }\n}\n\nconst VariableValue = (props: { value: string }) => {\n  const emotion = useEmotion();\n\n  const value = props.value;\n  const valueIsColor = isColor(value);\n  const valueIsGradient = isGradient(value);\n  const hasExample = valueIsColor || valueIsGradient;\n  let borderColor = 'transparent';\n  if (hasExample) {\n    borderColor = valueIsColor ? ColorFunctions.contrast(value) : '#000';\n  }\n\n  const styles = getStyles(emotion);\n  return (\n    <span className={emotion.cx({ [styles.undefined()]: !value })}>\n      {hasExample && <span className={styles.colorExample()} style={{ background: value, borderColor }} />}\n      {value || 'undefined'}\n    </span>\n  );\n};\n\nconst ShowUnusedVariables = (props: { diff: string[] }) => {\n  const emotion = useEmotion();\n  if (props.diff.length === 0) {\n    return null;\n  }\n  const styles = getStyles(emotion);\n\n  return (\n    <div className={styles.unusedVariablesWarning()}>\n      Неиспользованные переменные ({props.diff.length}\n      ):\n      <ul>\n        {props.diff.sort().map((v) => (\n          <li key={v}>{v}</li>\n        ))}\n      </ul>\n    </div>\n  );\n};\n\nfunction isGradient(input: string) {\n  return !!input && input.startsWith('linear-gradient');\n}\n"]}
+{"version":3,"sources":["ThemeShowcase.tsx"],"names":["EMPTY_ARRAY","ALL_VARIABLES","Object","keys","defaultVariables","ThemeShowcase","props","state","isUnmounting","variablesDiff","getItems","query","Promise","resolve","getValues","handleVariableChange","item","setState","selectedVariable","handleUnexpectedVariableInput","values","length","resetVariable","undefined","isDebugMode","forEach","variable","found","ALL_USED_VARIABLES","includes","push","render","IS_PROXY_SUPPORTED","descriptionsToRender","COMPONENT_DESCRIPTIONS_BY_VARIABLE","value","COMPONENT_DESCRIPTIONS","callsCount","CALLS_COUNT","executionTime","EXECUTION_TIME","toFixed","emotion","theme","styles","searchBar","sort","map","componentName","componentWillUnmount","lowerCaseQuery","toLowerCase","trim","allItems","filter","usedVariable","startsWith","usedVariableName","label","React","Component","ComponentShowcase","name","description","onVariableSelect","elements","isSticky","cx","heading","headingSticky","table","headerCell","width","el","ComponentShowcaseRow","element","row","rowSpan","variables","invisibleRow","invisibleDarkRow","darkVariables","cell","majorCell","elementName","invisibleCell","varName","dependencies","variableDefault","variableDark","hasNoVariables","suspiciousRow","darkRow","VariableName","variableName","handleVariableSelect","renderDependencies","dependency","DependencyName","dependencyName","onDependencySelect","handleDependencySelect","dependencyDefault","dependencyDark","VariableValue","valueIsColor","valueIsGradient","isGradient","hasExample","borderColor","ColorFunctions","contrast","colorExample","background","ShowUnusedVariables","diff","unusedVariablesWarning","v","input"],"mappings":"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","sourcesContent":["import React from 'react';\nimport type { Emotion } from '@emotion/css/create-instance';\n\nimport { isColor } from '../../lib/styles/ColorHelpers';\nimport { DEFAULT_THEME as defaultVariables } from '../../lib/theming/themes/DefaultTheme';\nimport { DARK_THEME as darkVariables } from '../../lib/theming/themes/DarkTheme';\nimport { ComboBox, ComboBoxItem } from '../../components/ComboBox';\nimport { Gapped } from '../../components/Gapped';\nimport { Link } from '../../components/Link';\nimport { Sticky } from '../../components/Sticky';\nimport * as ColorFunctions from '../../lib/styles/ColorFunctions';\nimport { Tooltip } from '../../components/Tooltip';\nimport { IS_PROXY_SUPPORTED } from '../../lib/Supports';\nimport { Theme } from '../../lib/theming/Theme';\nimport { EmotionConsumer, useEmotion } from '../../lib/theming/Emotion';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { useTheme } from '../../lib/theming/useTheme';\n\nimport {\n  ALL_USED_VARIABLES,\n  CALLS_COUNT,\n  COMPONENT_DESCRIPTIONS,\n  COMPONENT_DESCRIPTIONS_BY_VARIABLE,\n  ComponentDescriptionType,\n  ComponentRowDescriptionType,\n  EXECUTION_TIME,\n} from './VariablesCollector';\nimport { getStyles } from './ThemeShowcase.styles';\n\nconst EMPTY_ARRAY: string[] = [];\n\nconst ALL_VARIABLES = Object.keys(defaultVariables) as Array<keyof Theme>;\n\ninterface ShowcaseProps {\n  isDebugMode?: boolean;\n}\ninterface ShowcaseState {\n  selectedVariable?: ComboBoxItem;\n}\n\nexport class ThemeShowcase extends React.Component<ShowcaseProps, ShowcaseState> {\n  public state: ShowcaseState = {};\n  private emotion!: Emotion;\n\n  private isUnmounting = false;\n  private variablesDiff: string[] = [];\n\n  constructor(props: ShowcaseProps) {\n    super(props);\n    if (props.isDebugMode) {\n      ALL_VARIABLES.forEach((variable) => {\n        const found = ALL_USED_VARIABLES.includes(variable);\n        if (!found) {\n          this.variablesDiff.push(variable);\n        }\n      });\n    }\n  }\n\n  public render() {\n    if (!IS_PROXY_SUPPORTED) {\n      return (\n        <div>\n          Таблица использования переменных доступна только в{' '}\n          <Link href={'https://caniuse.com/#feat=proxy'} target={'_blank'}>\n            браузерах с поддержкой Proxy\n          </Link>\n          .\n        </div>\n      );\n    }\n\n    const selectedVariable = this.state.selectedVariable;\n    const descriptionsToRender = selectedVariable\n      ? COMPONENT_DESCRIPTIONS_BY_VARIABLE[selectedVariable.value] || {}\n      : COMPONENT_DESCRIPTIONS;\n\n    const isDebugMode = this.props.isDebugMode;\n    const callsCount = isDebugMode ? `(${CALLS_COUNT} вызовов)` : '';\n    const executionTime = isDebugMode ? `Сгенерировано за ${EXECUTION_TIME.toFixed(3)}ms` : '';\n\n    return (\n      <EmotionConsumer>\n        {(emotion) => {\n          this.emotion = emotion;\n          return (\n            <ThemeContext.Consumer>\n              {(theme) => {\n                const styles = getStyles(this.emotion);\n                return (\n                  <Gapped wrap gap={30} verticalAlign={'top'}>\n                    <div>\n                      <Sticky side={'top'}>\n                        <div className={styles.searchBar(theme)} data-perf-info={`${executionTime} ${callsCount}`}>\n                          <Gapped gap={15}>\n                            <ComboBox\n                              getItems={this.getItems}\n                              value={selectedVariable}\n                              onValueChange={this.handleVariableChange}\n                              onUnexpectedInput={this.handleUnexpectedVariableInput}\n                              placeholder={'поиск по названию переменной'}\n                            />\n                            {!!selectedVariable && <Link onClick={this.resetVariable}>сбросить</Link>}\n                          </Gapped>\n                        </div>\n                      </Sticky>\n                      {Object.keys(descriptionsToRender)\n                        .sort()\n                        .map((componentName) => (\n                          <ComponentShowcase\n                            key={componentName}\n                            name={componentName}\n                            description={descriptionsToRender[componentName]}\n                            isDebugMode={isDebugMode}\n                            onVariableSelect={this.handleVariableChange}\n                          />\n                        ))}\n                    </div>\n                    <ShowUnusedVariables diff={this.variablesDiff} />\n                  </Gapped>\n                );\n              }}\n            </ThemeContext.Consumer>\n          );\n        }}\n      </EmotionConsumer>\n    );\n  }\n  public componentWillUnmount(): void {\n    this.isUnmounting = true;\n  }\n\n  private getValues(query: string) {\n    const lowerCaseQuery = query && query.toLowerCase().trim();\n    let allItems = ALL_USED_VARIABLES;\n    if (lowerCaseQuery) {\n      allItems = ALL_USED_VARIABLES.filter((usedVariable) => usedVariable.toLowerCase().startsWith(lowerCaseQuery));\n    }\n    return allItems.map((usedVariableName) => ({\n      value: usedVariableName,\n      label: usedVariableName,\n    }));\n  }\n  private getItems = (query: string) => {\n    return Promise.resolve(this.getValues(query));\n  };\n  private handleVariableChange = (item: ComboBoxItem) => {\n    if (!this.isUnmounting) {\n      this.setState({ selectedVariable: item });\n    }\n  };\n  private handleUnexpectedVariableInput = (query: string) => {\n    const values = this.getValues(query);\n    if (values.length > 0) {\n      return values[0];\n    }\n\n    return this.resetVariable();\n  };\n  private resetVariable = () => {\n    if (!this.isUnmounting) {\n      this.setState({ selectedVariable: undefined });\n    }\n  };\n}\n\ninterface ComponentShowcaseProps {\n  name: string;\n  description: ComponentDescriptionType;\n  isDebugMode?: boolean;\n  onVariableSelect: (item: ComboBoxItem) => void;\n}\n\nfunction ComponentShowcase(props: ComponentShowcaseProps) {\n  const theme = useTheme();\n  const emotion = useEmotion();\n\n  const { name, description, onVariableSelect, isDebugMode } = props;\n  const elements = Object.keys(description);\n  const styles = getStyles(emotion);\n  return elements.length ? (\n    <React.Fragment>\n      <Sticky side={'top'} offset={40}>\n        {(isSticky) => (\n          <h2\n            className={emotion.cx({\n              [styles.heading(theme)]: true,\n              [styles.headingSticky()]: isSticky,\n            })}\n          >\n            {props.name}\n          </h2>\n        )}\n      </Sticky>\n      <table className={styles.table()}>\n        <thead>\n          <tr>\n            <th className={styles.headerCell()} style={{ width: 170 }}>\n              ClassName\n            </th>\n            <th className={styles.headerCell()} style={{ width: 210 }}>\n              Variable Name\n            </th>\n            <th className={styles.headerCell()} style={{ width: 250 }}>\n              Default Value\n            </th>\n            <th className={styles.headerCell()} style={{ width: 250 }}>\n              Dark Value\n            </th>\n          </tr>\n        </thead>\n        <tbody>\n          {elements.map((el) => (\n            <ComponentShowcaseRow\n              key={`${name}_${el}`}\n              element={el}\n              row={description[el]}\n              onVariableSelect={onVariableSelect}\n              isDebugMode={isDebugMode}\n            />\n          ))}\n        </tbody>\n      </table>\n    </React.Fragment>\n  ) : null;\n}\n\ninterface ComponentShowcaseRowProps {\n  element: string;\n  row: ComponentRowDescriptionType;\n  isDebugMode?: boolean;\n  onVariableSelect: (item: ComboBoxItem) => void;\n}\n\nfunction ComponentShowcaseRow(props: ComponentShowcaseRowProps) {\n  const theme = useTheme();\n  const emotion = useEmotion();\n\n  const { element: el, row, isDebugMode } = props;\n  const rowSpan = row.variables.length + 1;\n  const styles = getStyles(emotion);\n  return (\n    <React.Fragment>\n      <tr className={emotion.cx(styles.invisibleRow(), { [styles.invisibleDarkRow()]: theme === darkVariables })}>\n        <td className={emotion.cx(styles.cell(), styles.majorCell())} rowSpan={rowSpan}>\n          <span className={styles.elementName()}>.{el}</span>\n        </td>\n        <td className={styles.invisibleCell()} />\n        <td className={styles.invisibleCell()} />\n        <td className={styles.invisibleCell()} />\n      </tr>\n      {row.variables.map((varName) => {\n        const dependencies = row.dependencies[varName] || EMPTY_ARRAY;\n        const variableDefault = defaultVariables[varName] as string;\n        const variableDark = darkVariables[varName] as string;\n        const hasNoVariables = isDebugMode && !variableDefault;\n        return (\n          <tr\n            key={`${el}_${varName}`}\n            className={emotion.cx(styles.row(), {\n              [styles.suspiciousRow()]: hasNoVariables,\n              [styles.darkRow()]: theme === darkVariables,\n            })}\n          >\n            <td className={styles.cell()}>\n              <VariableName\n                variableName={varName as string}\n                dependencies={dependencies}\n                onVariableSelect={props.onVariableSelect}\n              />\n            </td>\n            <td className={styles.cell()}>\n              <VariableValue value={variableDefault} />\n            </td>\n            <td className={styles.cell()}>\n              <VariableValue value={variableDark} />\n            </td>\n          </tr>\n        );\n      })}\n    </React.Fragment>\n  );\n}\n\ninterface VariableNameProps {\n  variableName: string;\n  dependencies: Array<keyof Theme>;\n  onVariableSelect: (item: ComboBoxItem) => void;\n}\n\nfunction VariableName({ variableName, dependencies, onVariableSelect }: VariableNameProps) {\n  const emotion = useEmotion();\n  const styles = getStyles(emotion);\n\n  return (\n    <span>\n      <span className={styles.variableName()} onClick={handleVariableSelect}>\n        {variableName}\n      </span>\n      {dependencies.length > 0 && renderDependencies()}\n    </span>\n  );\n\n  function renderDependencies() {\n    return (\n      <React.Fragment>\n        <br />\n        <br />\n        зависит от:\n        {dependencies.map((dependency) => (\n          <DependencyName\n            key={`dependency_${dependency}`}\n            dependencyName={dependency}\n            onDependencySelect={onVariableSelect}\n          />\n        ))}\n      </React.Fragment>\n    );\n  }\n\n  function handleVariableSelect() {\n    if (onVariableSelect) {\n      onVariableSelect({ value: variableName, label: variableName });\n    }\n  }\n}\n\ninterface DependencyNameProps {\n  dependencyName: keyof Theme;\n  onDependencySelect: (item: ComboBoxItem) => void;\n}\n\nfunction DependencyName({ dependencyName, onDependencySelect }: DependencyNameProps) {\n  const emotion = useEmotion();\n  const styles = getStyles(emotion);\n\n  return (\n    <React.Fragment>\n      <br />\n      &ndash;{' '}\n      <Tooltip trigger={'hover'} render={getValues} pos={'right middle'}>\n        <span className={styles.variableName()} onClick={handleDependencySelect}>\n          {dependencyName}\n        </span>\n      </Tooltip>\n    </React.Fragment>\n  );\n\n  function getValues() {\n    const dependencyDefault = defaultVariables[dependencyName] as string;\n    const dependencyDark = darkVariables[dependencyName] as string;\n    return (\n      <React.Fragment>\n        <span>Default value: {<VariableValue value={dependencyDefault} />}</span>\n        <span>Dark value: {<VariableValue value={dependencyDark} />}</span>\n      </React.Fragment>\n    );\n  }\n\n  function handleDependencySelect() {\n    if (onDependencySelect) {\n      onDependencySelect({ value: dependencyName, label: dependencyName });\n    }\n  }\n}\n\nconst VariableValue = (props: { value: string }) => {\n  const emotion = useEmotion();\n\n  const value = props.value;\n  const valueIsColor = isColor(value);\n  const valueIsGradient = isGradient(value);\n  const hasExample = valueIsColor || valueIsGradient;\n  let borderColor = 'transparent';\n  if (hasExample) {\n    borderColor = valueIsColor ? ColorFunctions.contrast(value) : '#000';\n  }\n\n  const styles = getStyles(emotion);\n  return (\n    <span className={emotion.cx({ [styles.undefined()]: !value })}>\n      {hasExample && <span className={styles.colorExample()} style={{ background: value, borderColor }} />}\n      {value || 'undefined'}\n    </span>\n  );\n};\n\nconst ShowUnusedVariables = (props: { diff: string[] }) => {\n  const emotion = useEmotion();\n  if (props.diff.length === 0) {\n    return null;\n  }\n  const styles = getStyles(emotion);\n\n  return (\n    <div className={styles.unusedVariablesWarning()}>\n      Неиспользованные переменные ({props.diff.length}\n      ):\n      <ul>\n        {props.diff.sort().map((v) => (\n          <li key={v}>{v}</li>\n        ))}\n      </ul>\n    </div>\n  );\n};\n\nfunction isGradient(input: string) {\n  return !!input && input.startsWith('linear-gradient');\n}\n"]}

package/cjs/internal/ThemeShowcase/VariablesCollector.d.ts

@@ -17,6 +17,6 @@ export interface VariableDependencies {
 }
 export declare const COMPONENT_DESCRIPTIONS: DescriptionsType;
 export declare const COMPONENT_DESCRIPTIONS_BY_VARIABLE: VariableNameToComponentsMap;
-export declare const ALL_USED_VARIABLES: ("black" | "blue" | "gray" | "green" | "red" | "white" | "yellow" | "prototype" | "fontFamilyCompensationBaseline" | "labGrotesqueBaselineCompensation" | "brandXLight" | "brandLight" | "brand" | "brandDark" | "brandXDark" | "grayXxLight" | "grayXLight" | "grayLight" | "grayDark" | "blueXxLight" | "blueLight" | "blueDark" | "blueXDark" | "greenXxLight" | "greenDark" | "redXxLight" | "redDark" | "yellowXxLight" | "yellowDark" | "bgDefault" | "bgSecondary" | "bgDisabled" | "errorMain" | "errorSecondary" | "errorText" | "warningMain" | "warningSecondary" | "warningText" | "borderColorFocusLight" | "borderColorGrayDark" | "borderColorGrayLight" | "borderColorDisabled" | "placeholderColor" | "outlineColorFocus" | "placeholderColorLight" | "blinkColor" | "controlBorderWidth" | "controlOutlineWidth" | "controlLineHeightSmall" | "controlLineHeightMedium" | "controlLineHeightLarge" | "controlPaddingYSmall" | "controlPaddingYMedium" | "controlPaddingYLarge" | "textColorDefault" | "textColorInvert" | "textColorDisabled" | "textColorDisabledContrast" | "fontSizeSmall" | "fontSizeMedium" | "fontSizeLarge" | "fontSizeMobile" | "lineHeightMobile" | "specificityLevel" | "fixedPanelShadow" | "bgActive" | "borderColorFocus" | "borderColorError" | "borderColorWarning" | "controlHeightSmall" | "controlHeightMedium" | "controlHeightLarge" | "mobileMediaQuery" | "transitionDuration" | "transitionTimingFunction" | "linkColor" | "linkActiveColor" | "linkHoverTextDecoration" | "linkSuccessColor" | "linkSuccessHoverColor" | "linkSuccessActiveColor" | "linkDangerColor" | "linkDangerHoverColor" | "linkDangerActiveColor" | "linkIconMarginRight" | "linkIconMarginLeft" | "linkHoverColor" | "linkDisabledColor" | "linkGrayedColor" | "linkGrayedHoverColor" | "linkGrayedActiveColor" | "linkButtonLineHeight" | "linkButtonPaddingX" | "linkLineBorderBottomStyle" | "linkLineHoverBorderBottomStyle" | "linkLineBorderBottomWidth" | "linkLineBorderBottomOpacity" | "linkLineBorderBottomColor" | "linkFocusOutlineColor" | "linkFocusOutlineWidth" | "linkFocusOutline" | "tokenDisabledBg" | "tokenTextColorDisabled" | "tokenFontSize" | "tokenFontSizeSmall" | "tokenFontSizeMedium" | "tokenFontSizeLarge" | "tokenMarginY" | "tokenMarginX" | "tokenMarginYSmall" | "tokenMarginXSmall" | "tokenMarginYMedium" | "tokenMarginXMedium" | "tokenMarginYLarge" | "tokenMarginXLarge" | "tokenLineHeight" | "tokenLineHeightSmall" | "tokenLineHeightMedium" | "tokenLineHeightLarge" | "tokenPaddingY" | "tokenPaddingX" | "tokenPaddingYSmall" | "tokenPaddingXSmall" | "tokenPaddingYMedium" | "tokenPaddingXMedium" | "tokenPaddingYLarge" | "tokenPaddingXLarge" | "tokenMarginBeforeIcon" | "tokenRemoveIconSize" | "tokenRemoveIconPaddingY" | "tokenRemoveIconPaddingX" | "tokenRemoveIconGap" | "tokenRemoveIconBoxSizing" | "tokenBorderRadius" | "tokenBorderWidth" | "tokenBorderColorDisabled" | "tokenDefaultIdle" | "tokenDefaultActive" | "tokenGrayIdle" | "tokenGrayActive" | "tokenBlueIdle" | "tokenBlueActive" | "tokenGreenIdle" | "tokenGreenActive" | "tokenYellowIdle" | "tokenYellowActive" | "tokenRedIdle" | "tokenRedActive" | "tokenWhite" | "tokenBlack" | "tokenBorderColorWarning" | "tokenBorderColorError" | "tokenOutlineWidth" | "tokenLegacyTextShift" | "tokenPaddingYDisabled" | "tokenPaddingXDisabled" | "tokenMarginYDisabled" | "tokenMarginXDisabled" | "tokenShadowDisabled" | "tokenDefaultIdleBg" | "tokenDefaultIdleColor" | "tokenDefaultIdleBorderColor" | "tokenDefaultIdleBgHover" | "tokenDefaultIdleColorHover" | "tokenDefaultIdleBorderColorHover" | "tokenDefaultActiveBg" | "tokenDefaultActiveColor" | "tokenDefaultActiveBorderColor" | "tokenInputLineHeight" | "tokenInputLineHeightSmall" | "tokenInputLineHeightMedium" | "tokenInputLineHeightLarge" | "tokenInputBorderColor" | "tokenInputBorderColorHover" | "tokenInputBorderColorFocus" | "tokenInputBorderColorError" | "tokenInputBorderColorWarning" | "tokenInputBorderTopColor" | "tokenInputBorderRadius" | "tokenInputPlaceholderColor" | "tokenInputPlaceholderColorLight" | "tokenInputDisabledBg" | "tokenInputDisabledBorderColor" | "tokenInputBorderWidth" | "tokenInputOutlineWidth" | "tokenInputBg" | "tokenInputMenuPopupBg" | "tokenInputShadow" | "tokenInputTextColor" | "tokenInputTextColorDisabled" | "tokenInputPlaceholderColorDisabled" | "tokenInputPaddingY" | "tokenInputPaddingX" | "tokenInputPaddingYSmall" | "tokenInputPaddingXSmall" | "tokenInputPaddingYMedium" | "tokenInputPaddingXMedium" | "tokenInputPaddingYLarge" | "tokenInputPaddingXLarge" | "tokenInputPopupOffset" | "tokenInputPopupMarginSmall" | "tokenInputPopupMarginMedium" | "tokenInputPopupMarginLarge" | "loaderBg" | "loaderOpacity" | "loaderBorderRadius" | "btnBackgroundClip" | "btnArrowBgImageActive" | "btnArrowBgImageChecked" | "btnLinkBorderRadius" | "btnFocusShadowWidth" | "btnBorderColorTransition" | "btnDisabledBorderColor" | "btnCheckedBg" | "btnCheckedDisabledBg" | "btnCheckedDisabledColor" | "btnCheckedTextColor" | "btnCheckedDisabledBorderColor" | "btnCheckedShadow" | "btnCheckedDisabledShadow" | "btnBorderRadiusSmall" | "btnBorderRadiusMedium" | "btnBorderRadiusLarge" | "btnBorderWidth" | "btnInsetWidth" | "btnOutlineWidth" | "btnPaddingXSmall" | "btnPaddingXMedium" | "btnPaddingXLarge" | "btnIconGapSmall" | "btnIconGapSmallLeft" | "btnIconGapSmallRight" | "btnIconGapMedium" | "btnIconGapMediumLeft" | "btnIconGapMediumRight" | "btnIconGapLarge" | "btnIconGapLargeLeft" | "btnIconGapLargeRight" | "btnIconSizeSmall" | "btnIconSizeMedium" | "btnIconSizeLarge" | "btnDefaultBg" | "btnDefaultBgStart" | "btnDefaultBgEnd" | "btnDefaultCheckedBorderColor" | "btnDefaultTextColor" | "btnDefaultHoverBg" | "btnDefaultHoverBgStart" | "btnDefaultHoverBgEnd" | "btnDefaultActiveBg" | "btnDefaultHoverBorderColor" | "btnDefaultHoverBorderBottomColor" | "btnDefaultHoverTextColor" | "btnDefaultActiveBorderColor" | "btnDefaultActiveBorderTopColor" | "btnDefaultBorderColor" | "btnDefaultBorderBottomColor" | "btnDefaultActiveShadow" | "btnSuccessBg" | "btnSuccessHoverBg" | "btnSuccessHoverBorderColor" | "btnSuccessHoverBorderBottomColor" | "btnSuccessHoverTextColor" | "btnSuccessBorderColor" | "btnSuccessBorderBottomColor" | "btnSuccessBgStart" | "btnSuccessBgEnd" | "btnSuccessTextColor" | "btnSuccessHoverBgStart" | "btnSuccessHoverBgEnd" | "btnSuccessActiveBg" | "btnSuccessActiveBorderColor" | "btnSuccessActiveBorderTopColor" | "btnSuccessActiveShadow" | "btnPrimaryBg" | "btnPrimaryHoverBg" | "btnPrimaryHoverBorderColor" | "btnPrimaryHoverBorderBottomColor" | "btnPrimaryHoverTextColor" | "btnPrimaryBorderColor" | "btnPrimaryBorderBottomColor" | "btnPrimaryBgStart" | "btnPrimaryBgEnd" | "btnPrimaryTextColor" | "btnPrimaryHoverBgStart" | "btnPrimaryHoverBgEnd" | "btnPrimaryActiveBg" | "btnPrimaryActiveBorderColor" | "btnPrimaryActiveBorderTopColor" | "btnPrimaryActiveShadow" | "btnDangerBg" | "btnDangerHoverBg" | "btnDangerHoverBorderColor" | "btnDangerHoverBorderBottomColor" | "btnDangerHoverTextColor" | "btnDangerBorderColor" | "btnDangerBorderBottomColor" | "btnDangerBgStart" | "btnDangerBgEnd" | "btnDangerTextColor" | "btnDangerHoverBgStart" | "btnDangerHoverBgEnd" | "btnDangerActiveBg" | "btnDangerActiveBorderColor" | "btnDangerActiveBorderTopColor" | "btnDangerActiveShadow" | "btnPayBg" | "btnPayHoverBg" | "btnPayHoverBorderColor" | "btnPayHoverBorderBottomColor" | "btnPayHoverTextColor" | "btnPayBorderColor" | "btnPayBorderBottomColor" | "btnPayBgStart" | "btnPayBgEnd" | "btnPayTextColor" | "btnPayHoverBgStart" | "btnPayHoverBgEnd" | "btnPayActiveBg" | "btnPayActiveBorderColor" | "btnPayActiveBorderTopColor" | "btnPayActiveShadow" | "btnMenuArrowColor" | "btnFontSizeSmall" | "btnFontSizeMedium" | "btnFontSizeLarge" | "btnLineHeightSmall" | "btnLineHeightMedium" | "btnLineHeightLarge" | "btnPaddingYSmall" | "btnPaddingYMedium" | "btnPaddingYLarge" | "btnDisabledBg" | "btnBorderColorWarning" | "btnBorderColorError" | "btnHeightSmall" | "btnHeightMedium" | "btnHeightLarge" | "btnLinkColor" | "btnLinkHoverColor" | "btnLinkActiveColor" | "btnLinkHoverTextDecoration" | "btnLinkLineBorderBottomColor" | "btnLinkLineBorderBottomStyle" | "btnLinkHoverLineBorderBottomStyle" | "btnLinkLineBorderBottomWidth" | "btnLinkLineBorderBottomOpacity" | "btnLinkIconMarginRight" | "btnLinkIconMarginLeft" | "btnErrorSecondary" | "btnWarningSecondary" | "btnOutlineColorFocus" | "btnInsetColor" | "btnBorderColorFocus" | "btnLinkDisabledColor" | "btnDisabledTextColor" | "btnBacklessBg" | "btnBacklessHoverBg" | "btnBacklessActiveBg" | "btnBacklessBorderColor" | "btnBacklessDisabledBorderColor" | "btnBacklessHoverBorderColor" | "btnBacklessHoverTextColor" | "btnBacklessTextColor" | "btnTextBg" | "btnTextHoverBg" | "btnTextActiveBg" | "btnTextBorderColor" | "btnTextTextColor" | "btnTextHoverTextColor" | "btnTextHoverBorderColor" | "btnWithIconPaddingLeftSmall" | "btnWithIconPaddingLeftMedium" | "btnWithIconPaddingLeftLarge" | "btnIconColor" | "btnIconHoverColor" | "btnIconDisabledColor" | "selectDefaultBg" | "selectPlaceholderColor" | "selectBorderWidth" | "selectPlaceholderColorDisabled" | "selectOutlineWidth" | "selectLineHeightSmall" | "selectFontSizeSmall" | "selectPaddingXSmall" | "selectPaddingYSmall" | "selectBorderRadiusSmall" | "selectIconGapSmall" | "selectLineHeightMedium" | "selectFontSizeMedium" | "selectPaddingXMedium" | "selectPaddingYMedium" | "selectBorderRadiusMedium" | "selectIconGapMedium" | "selectLineHeightLarge" | "selectFontSizeLarge" | "selectPaddingXLarge" | "selectPaddingYLarge" | "selectBorderRadiusLarge" | "selectIconGapLarge" | "selectMenuArrowColor" | "selectMenuArrowColorDisabled" | "selectIconSizeSmall" | "selectIconSizeMedium" | "selectIconSizeLarge" | "selectRootWidthMobile" | "mobileSelectMaxWidth" | "selectTextColorDisabled" | "selectBgDisabled" | "selectBorderColorDisabled" | "selectMenuOffsetY" | "selectBorderColorHover" | "selectBorderColorTransition" | "tooltipPaddingY" | "tooltipPaddingX" | "tooltipCloseBtnPadding" | "tooltipCloseBtnSide" | "tooltipCloseBtnColor" | "tooltipCloseBtnHoverColor" | "tooltipTextColor" | "tooltipBg" | "tooltipBorder" | "tooltipBorderRadius" | "tooltipPinOffset" | "tooltipPinOffsetX" | "tooltipPinOffsetY" | "tooltipMargin" | "tooltipPinSize" | "tooltipFontSize" | "tooltipLineHeight" | "tooltipMenuPinOffset" | "tooltipMenuMargin" | "tooltipMenuPinSize" | "kebabPinOffset" | "kebabPinSize" | "kebabMargin" | "kebabBackground" | "kebabBackgroundHover" | "kebabBackgroundActive" | "kebabBorderRadius" | "kebabBorder" | "kebabSizeSmall" | "kebabSizeMedium" | "kebabSizeLarge" | "kebabIconSizeSmall" | "kebabIconSizeMedium" | "kebabIconSizeLarge" | "kebabIconColor" | "modalWindowShadow" | "modalBackBg" | "modalBg" | "modalBackOpacity" | "modalCloseButtonColor" | "modalCloseButtonDisabledColor" | "modalCloseButtonHoverColor" | "modalCloseButtonPadding" | "modalCloseButtonLegacyShift" | "modalCloseButtonBottomPadding" | "modalCloseButtonClickArea" | "modalCloseIconSize" | "modalCloseLegacyGap" | "modalCloseWrapperLegacyGap" | "modalBorderRadius" | "modalFixedHeaderBg" | "modalFixedHeaderShadow" | "modalFixedHeaderBorder" | "modalFixedFooterBorder" | "modalFixedFooterShadow" | "modalFixedPanelShadow" | "modalFooterBg" | "modalAdaptiveThreshold" | "modalPaddingTop" | "modalPaddingLeft" | "modalPaddingRight" | "modalHeaderFontSize" | "modalHeaderFontWeight" | "modalHeaderTextColor" | "modalHeaderLineHeight" | "modalHeaderPaddingBottom" | "modalHeaderPaddingTop" | "modalHeaderAdditionalPaddingBottom" | "modalFixedHeaderMarginBottom" | "modalFixedHeaderPaddingBottom" | "modalFixedFooterPaddingTop" | "modalFixedFooterMarginTop" | "modalSeparatorBorderBottom" | "modalBodyTextColor" | "modalFooterTextColor" | "modalBodyPaddingTop" | "modalBodyPaddingBottom" | "modalBodyBorderRadius" | "modalFooterPaddingTop" | "modalFooterPaddingBottom" | "modalPaddingBottom" | "modalFooterPanelPaddingTop" | "modalFooterPanelPaddingBottom" | "mobileModalCloseButtonRightPadding" | "mobileModalCloseButtonTopPadding" | "mobileModalCloseButtonClickArea" | "mobileModalCloseIconSize" | "mobileModalHeaderFontSize" | "mobileModalHeaderLineHeight" | "mobileModalHeaderPadding" | "mobileModalBodyPadding" | "mobileModalBodyFontSize" | "mobileModalFooterPadding" | "mobileModalPaddingBottom" | "mobileModalContainerHeight" | "mobileModalContainerMarginTop" | "mobileModalContainerMarginRight" | "mobileModalContainerMarginBottom" | "mobileModalContainerMarginLeft" | "sidePageFooterPanelBg" | "sidePageBackingBg" | "sidePageBackingBgOpacity" | "sidePageCloseButtonColor" | "sidePageCloseButtonHoverColor" | "sidePageContainerShadow" | "mobileSidePagePaddingLeft" | "mobileSidePagePaddingRight" | "mobileSidePagePaddingTop" | "mobileSidePagePaddingBottom" | "mobileSidePageFooterPadding" | "sidePagePaddingLeft" | "sidePagePaddingRight" | "sidePagePaddingTop" | "sidePagePaddingBottom" | "sidePageFooterPaddingTop" | "sidePageFooterPaddingBottom" | "sidePageBgDefault" | "sidePageHeaderTextColor" | "sidePageBodyTextColor" | "sidePageFooterTextColor" | "sidePageHeaderFontSize" | "sidePageHeaderLineHeight" | "sidePageHeaderPaddingBottom" | "sidePageHeaderPaddingTop" | "sidePageHeaderFixedFontSize" | "sidePageHeaderFixedLineHeight" | "sidePageHeaderFixedPaddingY" | "sidePageHeaderStickyOffset" | "sidePageCloseButtonPadding" | "mobileSidePageCloseButtonPadding" | "sidePageCloseButtonLegacyPaddingLeft" | "sidePageFooterPanelPaddingTop" | "sidePageFooterPanelPaddingBottom" | "sidePageCloseIconSize" | "sidePageCloseButtonClickArea" | "mobileSidePageCloseButtonClickArea" | "sidePageFixedHeaderShadow" | "sidePageFixedFooterShadow" | "sidePageFixedPanelShadow" | "mobileSidePageHeaderFontSize" | "mobileSidePageHeaderLineHeight" | "mobileSidePageHeaderPaddingBottom" | "mobileSidePageHeaderPaddingTop" | "sidePageHeaderFontWeight" | "dateInputIconColor" | "dateInputMaskColor" | "dateInputComponentSelectedBgColor" | "dateInputComponentSelectedTextColor" | "calendarBottomSeparatorBorderColor" | "calendarBottomSeparatorBorderWidth" | "calendarBottomSeparatorBorder" | "calendarBg" | "calendarCellBg" | "calendarCellHoverColor" | "calendarCellActiveHoverColor" | "calendarCellWeekendColor" | "calendarCellTodayBorder" | "calendarCellSelectedBgColor" | "calendarCellSelectedFontColor" | "calendarCellSize" | "calendarCellLineHeight" | "calendarMonthHeaderStickedBgColor" | "calendarMonthTitleBorderBottomColor" | "calendarCellHoverBgColor" | "calendarPaddingX" | "calendarMonthTitleLineHeight" | "calendarMonthTitlePaddingTop" | "calendarMonthTitlePaddingBottom" | "calendarMonthTitleMarginX" | "calendarMonthTitleMarginBottom" | "calendarWrapperHeight" | "calendarMonthMarginBottom" | "calendarMaxMonthsToAppendOnScroll" | "dateSelectLineHeight" | "dateSelectFontSize" | "dateSelectFontWeight" | "dateSelectMenuItemBgSelected" | "dateSelectTextColorDisabled" | "dateSelectTextColorDefault" | "dateSelectLinkColor" | "dateSelectPopupBoxShadow" | "dateSelectTextColorInvert" | "datePickerOpenBtnColor" | "datePickerMenuOffsetY" | "pickerBg" | "pickerShadow" | "pickerTodayWrapperBgColor" | "pickerTodayWrapperBorderTop" | "pickerTodayWrapperHoverBgColor" | "pickerTodayWrapperFontSize" | "pickerTodayWrapperLineHeight" | "pickerTodayWrapperPaddingTop" | "pickerTodayWrapperPaddingBottom" | "pickerBorderRadius" | "dateSelectMenuBg" | "dateSelectMenuItemBgActive" | "dateSelectMenuItemBgDisabled" | "dateSelectMenuItemFontActive" | "dateSelectMenuItemFontSelected" | "dateSelectMenuItemFontDisabled" | "pagingFontSize" | "pagingForwardIconSize" | "pagingForwardIconMarginTop" | "pagingPageLinkBoxSizing" | "pagingPageLinkPaddingX" | "pagingPageLinkPaddingY" | "pagingPageLinkLegacyPaddingY" | "pagingPageLinkMinWidth" | "pagingPageForwardLinkMarginTop" | "pagingPageForwardLinkMarginLeft" | "pagingPageForwardLinkPaddingRight" | "pagingLineHeight" | "pagingDotsColor" | "pagingDotsPadding" | "pagingPageLinkActiveBg" | "pagingPageLinkDisabledActiveBg" | "pagingPageLinkActiveColor" | "pagingPageLinkHoverBg" | "pagingPageLinkBorderRadius" | "pagingPageLinkHintColor" | "pagingPageLinkHintFontSize" | "pagingPageLinkHintLineHeight" | "pagingPageLinkHintMargin" | "pagingPageLinkMargin" | "pagingForwardLinkColor" | "pagingForwardLinkDisabledColor" | "pagingDotsDisabledColor" | "hintColor" | "mobileHintColor" | "hintFontSize" | "hintLineHeight" | "hintMaxWidth" | "hintPaddingY" | "hintPaddingX" | "hintTextAlign" | "hintBgColor" | "hintBorder" | "hintBorderRadius" | "hintPinOffset" | "hintMargin" | "toastFontSize" | "toastLineHeight" | "toastPaddingY" | "toastPaddingX" | "toastBorderRadius" | "toastBorder" | "toastTop" | "toastBg" | "toastColor" | "toastLinkColor" | "toastLinkTextDecorationHover" | "toastLinkBgHover" | "toastLinkBgActive" | "toastClosePadding" | "toastCloseColor" | "toastCloseHoverColor" | "toastCloseSize" | "dropdownMenuSelectedBg" | "dropdownMenuBorderColorTransition" | "dropdownMenuHoverBorderColor" | "dropdownMenuHoverBg" | "dropdownMenuOffsetY" | "dropdownMenuMenuOffsetY" | "dropdownMenuMenuBoxSizing" | "dropdownButtonBorderRadiusSmall" | "dropdownButtonBorderRadiusMedium" | "dropdownButtonBorderRadiusLarge" | "dropdownDefaultBg" | "dropdownBorderWidth" | "dropdownOutlineWidth" | "dropdownLineHeightSmall" | "dropdownFontSizeSmall" | "dropdownPaddingXSmall" | "dropdownPaddingYSmall" | "dropdownIconSizeSmall" | "dropdownLineHeightMedium" | "dropdownFontSizeMedium" | "dropdownPaddingXMedium" | "dropdownPaddingYMedium" | "dropdownIconSizeMedium" | "dropdownLineHeightLarge" | "dropdownFontSizeLarge" | "dropdownPaddingXLarge" | "dropdownPaddingYLarge" | "dropdownIconSizeLarge" | "dropdownBgDisabled" | "dropdownBorderColorDisabled" | "dropdownTextColorDisabled" | "menuBgDefault" | "menuBorderRadius" | "menuBorder" | "menuShadow" | "menuPaddingY" | "menuLegacyPaddingY" | "menuScrollContainerContentWrapperPaddingY" | "mobileMenuPaddingY" | "mobileMenuScrollContainerContentWrapperPaddingY" | "menuPaddingX" | "mobileMenuPaddingX" | "menuOffsetY" | "menuBoxSizing" | "menuItemTextColor" | "menuItemSelectedBg" | "menuItemHoverBg" | "menuItemIconWidth" | "menuItemIconWidthSmall" | "menuItemIconWidthMedium" | "menuItemIconWidthLarge" | "menuItemIconGap" | "menuItemIconLegacyMargin" | "menuItemIconLegacyShift" | "menuItemPaddingForIcon" | "menuItemPaddingForIconSmall" | "menuItemPaddingForIconMedium" | "menuItemPaddingForIconLarge" | "menuItemLineHeight" | "menuItemLineHeightSmall" | "menuItemLineHeightMedium" | "menuItemLineHeightLarge" | "menuItemFontSize" | "menuItemFontSizeSmall" | "menuItemFontSizeMedium" | "menuItemFontSizeLarge" | "menuItemPaddingX" | "menuItemPaddingY" | "menuItemPaddingXSmall" | "menuItemPaddingYSmall" | "menuItemPaddingXMedium" | "menuItemPaddingYMedium" | "menuItemPaddingXLarge" | "menuItemPaddingYLarge" | "menuItemBorderRadius" | "menuItemLegacyPaddingX" | "menuItemLegacyPaddingY" | "menuItemHoverColor" | "menuItemLinkColor" | "menuItemCommentColor" | "menuItemCommentOpacity" | "menuItemCommentColorHover" | "menuItemDisplay" | "menuItemPaddingMobile" | "menuItemLineHeightMobile" | "menuItemFontSizeMobile" | "menuItemDisabledColor" | "menuItemDisabledBg" | "menuMessageTextColor" | "menuMessageBg" | "menuMessagePaddingY" | "menuMessagePaddingX" | "menuMessageDisplay" | "menuMessagePaddingMobile" | "menuMessageLineHeight" | "menuMessageLineHeightMobile" | "menuMessageFontSize" | "menuMessageFontSizeMobile" | "menuMessageFontSizeSmall" | "menuMessageFontSizeMedium" | "menuMessageFontSizeLarge" | "menuMessageLineHeightSmall" | "menuMessageLineHeightMedium" | "menuMessageLineHeightLarge" | "menuItemGap" | "menuHeaderColor" | "menuHeaderLineHeight" | "menuHeaderLineHeightSmall" | "menuHeaderLineHeightMedium" | "menuHeaderLineHeightLarge" | "menuHeaderFontSize" | "menuHeaderFontSizeSmall" | "menuHeaderFontSizeMedium" | "menuHeaderFontSizeLarge" | "menuHeaderPaddingX" | "menuHeaderPaddingTop" | "menuHeaderPaddingBottom" | "menuHeaderPaddingXSmall" | "menuHeaderPaddingTopSmall" | "menuHeaderPaddingBottomSmall" | "menuHeaderPaddingXMedium" | "menuHeaderPaddingTopMedium" | "menuHeaderPaddingBottomMedium" | "menuHeaderPaddingXLarge" | "menuHeaderPaddingTopLarge" | "menuHeaderPaddingBottomLarge" | "menuHeaderTotalCountPaddingTopSmall" | "menuHeaderTotalCountPaddingTopMedium" | "menuHeaderTotalCountPaddingTopLarge" | "menuHeaderTotalCountPaddingBottomSmall" | "menuHeaderTotalCountPaddingBottomMedium" | "menuHeaderTotalCountPaddingBottomLarge" | "menuHeaderLegacyPaddingRight" | "menuFooterColor" | "menuFooterLineHeightSmall" | "menuFooterLineHeightMedium" | "menuFooterLineHeightLarge" | "menuFooterFontSizeSmall" | "menuFooterFontSizeMedium" | "menuFooterFontSizeLarge" | "menuFooterPaddingXSmall" | "menuFooterPaddingXMedium" | "menuFooterPaddingXLarge" | "menuFooterPaddingTopSmall" | "menuFooterPaddingTopMedium" | "menuFooterPaddingTopLarge" | "menuFooterPaddingBottomSmall" | "menuFooterPaddingBottomMedium" | "menuFooterPaddingBottomLarge" | "menuFooterLegacyPaddingRight" | "menuSeparatorBorderColor" | "menuSeparatorMarginY" | "menuSeparatorMarginX" | "menuSeparatorBorderWidth" | "mobileMenuSeparatorMarginY" | "mobileMenuSeparatorMarginX" | "toggleFontSize" | "toggleLineHeight" | "toggleLineHeightSmall" | "toggleLineHeightMedium" | "toggleLineHeightLarge" | "toggleFontSizeSmall" | "toggleFontSizeMedium" | "toggleFontSizeLarge" | "toggleTextColor" | "toggleHandleActiveWidthIncrement" | "toggleHandleBorderRadius" | "toggleHandleBorderRadiusSmall" | "toggleHandleBorderRadiusMedium" | "toggleHandleBorderRadiusLarge" | "toggleHeight" | "toggleWidth" | "toggleHeightSmall" | "toggleWidthSmall" | "toggleHeightMedium" | "toggleWidthMedium" | "toggleHeightLarge" | "toggleWidthLarge" | "toggleBorderRadius" | "toggleBorderRadiusSmall" | "toggleBorderRadiusMedium" | "toggleBorderRadiusLarge" | "toggleBg" | "toggleCheckedBg" | "toggleDisabledHandleBg" | "toggleBaseBg" | "toggleBgDisabled" | "toggleBgDisabledChecked" | "toggleBgHover" | "toggleCheckedBgHover" | "toggleBgChecked" | "toggleBorderWidth" | "toggleOutlineWidth" | "toggleBorderColor" | "toggleBorderColorDisabled" | "toggleBorderColorDisabledChecked" | "toggleHandleSize" | "toggleHandleSizeSmall" | "toggleHandleSizeMedium" | "toggleHandleSizeLarge" | "toggleHandleLeft" | "toggleHandleTop" | "toggleBgFocus" | "toggleBgActive" | "toggleShadowColorError" | "toggleShadowColorWarning" | "toggleFocusShadowColor" | "toggleCaptionGap" | "toggleButtonOffsetY" | "toggleOutlineColorFocus" | "toggleHandleBoxShadowOld" | "toggleContainerBg" | "toggleContainerBgHover" | "toggleContainerBgChecked" | "toggleContainerBgCheckedHover" | "toggleContainerBoxShadow" | "toggleContainerBoxShadowHover" | "toggleContainerBoxShadowChecked" | "toggleContainerBoxShadowCheckedHover" | "toggleHandleBg" | "toggleHandleBgHover" | "toggleHandleBgChecked" | "toggleHandleBgCheckedHover" | "toggleHandleBoxShadow" | "toggleHandleBoxShadowHover" | "toggleHandleBoxShadowChecked" | "toggleHandleBoxShadowCheckedHover" | "toggleContainerBgDisabled" | "toggleHandleBgDisabled" | "toggleContainerBoxShadowDisabled" | "toggleHandleBoxShadowDisabled" | "toggleContainerBgDisabledChecked" | "toggleHandleBgDisabledChecked" | "toggleContainerBoxShadowDisabledChecked" | "toggleHandleBoxShadowDisabledChecked" | "popupBorder" | "popupBorderRadius" | "popupBorderColor" | "popupDropShadow" | "popupBoxShadow" | "popupTextColor" | "popupBackground" | "popupPinOffset" | "popupPinOffsetX" | "popupPinOffsetY" | "popupMargin" | "popupPinSize" | "popupMenuMenuOffsetY" | "inputTextColor" | "inputShadow" | "inputBg" | "inputIconColor" | "inputFocusedIconColor" | "inputColor" | "inputWidth" | "inputTextColorDisabled" | "inputFontSizeSmall" | "inputFontSizeMedium" | "inputFontSizeLarge" | "inputLineHeightSmall" | "inputLineHeightMedium" | "inputLineHeightLarge" | "inputHeightSmall" | "inputHeightMedium" | "inputHeightLarge" | "inputPaddingYSmall" | "inputPaddingYMedium" | "inputPaddingYLarge" | "inputPaddingXSmall" | "inputPaddingXMedium" | "inputPaddingXLarge" | "inputIconGapSmall" | "inputIconGapMedium" | "inputIconGapLarge" | "inputIconSizeSmall" | "inputIconSizeMedium" | "inputIconSizeLarge" | "inputFocusShadow" | "inputFocusedBg" | "inputDisabledBg" | "inputDisabledBorderColor" | "inputFocusOutline" | "inputBorderWidth" | "inputOutlineWidth" | "inputBackgroundClip" | "inputBorderRadiusSmall" | "inputBorderRadiusMedium" | "inputBorderRadiusLarge" | "inputDisabledBackgroundClip" | "inputBorderColor" | "inputBorderColorHover" | "inputBorderColorFocus" | "inputBorderColorError" | "inputBorderColorWarning" | "inputBorderTopColor" | "inputPlaceholderColor" | "inputPlaceholderColorDisabled" | "inputPlaceholderColorLight" | "inputBlinkColor" | "inputColorScheme" | "checkboxFontSize" | "checkboxFontSizeSmall" | "checkboxFontSizeMedium" | "checkboxFontSizeLarge" | "checkboxLineHeight" | "checkboxLineHeightSmall" | "checkboxLineHeightMedium" | "checkboxLineHeightLarge" | "checkboxBoxSize" | "checkboxBoxSizeSmall" | "checkboxBoxSizeMedium" | "checkboxBoxSizeLarge" | "checkboxCaptionGap" | "checkboxPaddingY" | "checkboxPaddingYSmall" | "checkboxPaddingYMedium" | "checkboxPaddingYLarge" | "checkboxBoxOffsetY" | "checkboxBgStart" | "checkboxBgEnd" | "checkboxTextColorDefault" | "checkboxTextColorDisabled" | "checkboxShadowDisabled" | "checkboxBorder" | "checkboxBorderWidth" | "checkboxShadow" | "checkboxShadowHover" | "checkboxCheckedColor" | "checkboxOutlineColorFocus" | "checkboxBorderColorWarning" | "checkboxBorderColorError" | "checkboxCheckedHoverShadow" | "checkboxBorderRadius" | "checkboxOutlineWidth" | "checkboxCheckedShadow" | "checkboxCheckedActiveShadow" | "checkboxBorderColorFocus" | "checkboxBg" | "checkboxHoverBg" | "checkboxActiveBg" | "checkboxCheckedBg" | "checkboxBgDisabled" | "checkboxCheckedHoverBg" | "checkboxCheckedActiveBg" | "checkboxShadowActive" | "textareaBg" | "textareaColor" | "textareaTextColorDisabled" | "textareaPlaceholderColorLight" | "textareaPlaceholderColor" | "textareaPlaceholderColorDisabled" | "textareaShadow" | "textareaBackgroundClip" | "textareaFontSize" | "textareaFontSizeSmall" | "textareaFontSizeMedium" | "textareaFontSizeLarge" | "textareaLineHeight" | "textareaLineHeightSmall" | "textareaLineHeightMedium" | "textareaLineHeightLarge" | "textareaBorderRadius" | "textareaBorderWidth" | "textareaOutlineWidth" | "textareaMinHeight" | "textareaMinHeightSmall" | "textareaMinHeightMedium" | "textareaMinHeightLarge" | "textareaWidth" | "textareaPaddingX" | "textareaPaddingXSmall" | "textareaPaddingXMedium" | "textareaPaddingXLarge" | "textareaPaddingY" | "textareaPaddingYSmall" | "textareaPaddingYMedium" | "textareaPaddingYLarge" | "textareaBorderColor" | "textareaBorderTopColor" | "textareaBorderColorFocus" | "textareaBorderColorHover" | "textareaBorderColorWarning" | "textareaBorderColorError" | "textareaDisabledBg" | "textareaDisabledBorderColor" | "textareaCounterColor" | "textareaCounterBg" | "textareaCounterErrorColor" | "textareaCounterHelpIconColor" | "radioBulletSize" | "radioBulletSizeSmall" | "radioBulletSizeMedium" | "radioBulletSizeLarge" | "radioOutlineWidth" | "radioTextColor" | "radioSize" | "radioSizeSmall" | "radioSizeMedium" | "radioSizeLarge" | "radioFontSize" | "radioFontSizeSmall" | "radioFontSizeMedium" | "radioFontSizeLarge" | "radioLineHeight" | "radioLineHeightSmall" | "radioLineHeightMedium" | "radioLineHeightLarge" | "radioCaptionGap" | "radioPaddingY" | "radioPaddingYSmall" | "radioPaddingYMedium" | "radioPaddingYLarge" | "radioVerticalAlign" | "radioBgImage" | "radioBgColor" | "radioHoverBg" | "radioActiveBg" | "radioBorderWidth" | "radioBorderColor" | "radioBoxShadow" | "radioBorder" | "radioBorderColorFocus" | "radioBorderColorWarning" | "radioBorderColorError" | "radioHoverShadow" | "radioActiveShadow" | "radioFocusShadow" | "radioCheckedBgColor" | "radioCheckedBorderColor" | "radioCheckedBulletColor" | "radioCheckedHoverBgColor" | "radioDisabledBg" | "radioDisabledShadow" | "radioCaptionDisplay" | "radioBorderWidthCompensation" | "radioCircleOffsetY" | "radioCheckedDisabledBulletBg" | "radioGroupLegacyItemGap" | "tabFontSize" | "tabFontSizeSmall" | "tabFontSizeMedium" | "tabFontSizeLarge" | "tabLineHeight" | "tabLineHeightSmall" | "tabLineHeightMedium" | "tabLineHeightLarge" | "tabPaddingX" | "tabPaddingXSmall" | "tabPaddingXMedium" | "tabPaddingXLarge" | "tabsMarginX" | "tabPaddingY" | "tabPaddingYSmall" | "tabPaddingYMedium" | "tabPaddingYLarge" | "tabBorderWidth" | "tabOutlineWidth" | "tabTextColorDefault" | "tabColorFocus" | "tabColorError" | "tabColorWarning" | "tabColorSuccess" | "tabColorPrimary" | "tabColorHover" | "tabColorHoverError" | "tabColorHoverWarning" | "tabColorHoverSuccess" | "tabColorHoverPrimary" | "tabIndicatorBorderRadius" | "spinnerBgColor" | "spinnerColor" | "spinnerDimmedColor" | "spinnerCaptionColor" | "spinnerFontSizeSmall" | "spinnerFontSizeMedium" | "spinnerFontSizeLarge" | "spinnerLineHeightSmall" | "spinnerLineHeightMedium" | "spinnerLineHeightLarge" | "spinnerCaptionGapSmall" | "spinnerCaptionGapMedium" | "spinnerCaptionGapLarge" | "spinnerCaptionMarginSmall" | "spinnerCaptionMarginMedium" | "spinnerCaptionMarginLarge" | "switcherBorderRadius" | "switcherTextColor" | "switcherOutlineWidth" | "switcherCaptionFontSizeSmall" | "switcherCaptionFontSizeMedium" | "switcherCaptionFontSizeLarge" | "switcherCaptionLineHeightSmall" | "switcherCaptionLineHeightMedium" | "switcherCaptionLineHeightLarge" | "switcherCaptionGapSmall" | "switcherCaptionGapMedium" | "switcherCaptionGapLarge" | "switcherButtonPaddingXSmall" | "switcherButtonPaddingXMedium" | "switcherButtonPaddingXLarge" | "switcherButtonPaddingYSmall" | "switcherButtonPaddingYMedium" | "switcherButtonPaddingYLarge" | "switcherButtonLineHeightSmall" | "switcherButtonLineHeightMedium" | "switcherButtonLineHeightLarge" | "switcherButtonFontSizeSmall" | "switcherButtonFontSizeMedium" | "switcherButtonFontSizeLarge" | "switcherButtonBorderRadiusSmall" | "switcherButtonBorderRadiusMedium" | "switcherButtonBorderRadiusLarge" | "switcherButtonBorderWidth" | "switcherBtnDisabledBorderColor" | "switcherButtonDisabledBorderColor" | "switcherButtonCheckedDisabledShadow" | "mobilePopupTopPadding" | "mobilePopupContainerBottomPadding" | "mobilePopupHeaderPadding" | "mobilePopupContainerBorderRadius" | "mobilePopupHeaderFontSize" | "mobilePopupHeaderLineHeight" | "mobilePopupHeaderFontWeight" | "mobilePopupHeaderChildPadding" | "mobilePopupOuterIndentY" | "scrollContainerScrollBarSize" | "scrollContainerScrollBarHoverSize" | "scrollContainerScrollBarColor" | "scrollContainerScrollBarInvertColor" | "scrollContainerScrollBarOffsetY" | "dropdownMenuScrollContainerScrollBarOffsetY" | "passwordInputVisibilityIconColor" | "passwordInputVisibilityIconOpacity" | "passwordInputVisibilityIconHoverColor" | "passwordInputVisibilityIconHoverOpacity" | "globalLoaderColor" | "globalLoaderHeight" | "globalLoaderWidth" | "globalLoaderPosition" | "globalLoaderTop" | "globalLoaderLeft" | "globalLoaderBottom" | "globalLoaderRight" | "globalLoaderBackgroundColor" | "globalLoaderTransitionToSpinnerDuration" | "globalLoaderSpinnerAnimationDuration" | "globalLoaderSlowAnimationDuration" | "globalLoaderTransitionFromSpinnerDuration" | "fileUploaderWidth" | "fileUploaderBg" | "fileUploaderUploadButtonBg" | "fileUploaderFontSize" | "fileUploaderPaddingXSmall" | "fileUploaderPaddingXMedium" | "fileUploaderPaddingXLarge" | "fileUploaderFontSizeSmall" | "fileUploaderFontSizeMedium" | "fileUploaderFontSizeLarge" | "fileUploaderLineHeight" | "fileUploaderLineHeightSmall" | "fileUploaderLineHeightMedium" | "fileUploaderLineHeightLarge" | "fileUploaderPaddingYSmall" | "fileUploaderPaddingYMedium" | "fileUploaderPaddingYLarge" | "fileUploaderTextColorDefault" | "fileUploaderPaddingX" | "fileUploaderPaddingY" | "fileUploaderBorderRadius" | "fileUploaderBorderColor" | "fileUploaderBorderWidth" | "fileUploaderDisabledBorder" | "fileUploaderBorderStyle" | "fileUploaderBorderColorFocus" | "fileUploaderLinkColor" | "fileUploaderAfterLinkColor" | "fileUploaderIconSize" | "fileUploaderIconColor" | "fileUploaderIconHoverColor" | "fileUploaderBorderColorError" | "fileUploaderBorderColorWarning" | "fileUploaderDisabledBg" | "fileUploaderDisabledBgClip" | "fileUploaderDisabledBorderColor" | "fileUploaderDisabledTextColor" | "fileUploaderDisabledLinkColor" | "fileUploaderDisabledIconColor" | "fileUploaderLinkHoverTextDecoration" | "fileUploaderHoveredBg" | "fileUploaderHoveredBorderColor" | "fileUploaderIconGapSmall" | "fileUploaderIconGapMedium" | "fileUploaderIconGapLarge" | "fileUploaderDragOverBorderColor" | "fileUploaderDragOverShadow" | "closeBtnIconColor" | "closeBtnIconDisabledColor" | "closeBtnIconHoverColor" | "closeBtnIconBorderRadius" | "closeBtnIconFocusShadow" | "internalMenuPaddingY" | "autocompleteMenuOffsetY" | "comboboxMenuOffsetY" | "miniModalHeaderPaddingBottom" | "miniModalBodyPaddingTop" | "miniModalBodyPaddingBottom" | "miniModalHeaderPaddingTop" | "miniModalActionGap" | "miniModalCancelIndent" | "miniModalFooterPaddingTop" | "miniModalFooterPaddingBottom" | "miniModalTitleMarginTop" | "miniModalHeightMobile" | "miniModalMarginTopMobile" | "miniModalMarginLeftMobile" | "miniModalMarginRightMobile" | "miniModalFooterPaddingMobile" | "miniModalHeaderPaddingMobile" | "miniModalBodyPaddingMobile")[];
+export declare const ALL_USED_VARIABLES: ("black" | "blue" | "gray" | "green" | "red" | "white" | "yellow" | "prototype" | "fontFamilyCompensationBaseline" | "labGrotesqueBaselineCompensation" | "brandXLight" | "brandLight" | "brand" | "brandDark" | "brandXDark" | "grayXxLight" | "grayXLight" | "grayLight" | "grayDark" | "blueXxLight" | "blueLight" | "blueDark" | "blueXDark" | "greenXxLight" | "greenDark" | "redXxLight" | "redDark" | "yellowXxLight" | "yellowDark" | "bgDefault" | "bgSecondary" | "bgDisabled" | "errorMain" | "errorSecondary" | "errorText" | "warningMain" | "warningSecondary" | "warningText" | "borderColorFocusLight" | "borderColorGrayDark" | "borderColorGrayLight" | "borderColorDisabled" | "placeholderColor" | "outlineColorFocus" | "placeholderColorLight" | "blinkColor" | "controlBorderWidth" | "controlOutlineWidth" | "controlLineHeightSmall" | "controlLineHeightMedium" | "controlLineHeightLarge" | "controlPaddingYSmall" | "controlPaddingYMedium" | "controlPaddingYLarge" | "textColorDefault" | "textColorInvert" | "textColorDisabled" | "textColorDisabledContrast" | "fontSizeSmall" | "fontSizeMedium" | "fontSizeLarge" | "fontSizeMobile" | "lineHeightMobile" | "specificityLevel" | "fixedPanelShadow" | "bgActive" | "borderColorFocus" | "borderColorError" | "borderColorWarning" | "controlHeightSmall" | "controlHeightMedium" | "controlHeightLarge" | "mobileMediaQuery" | "transitionDuration" | "transitionTimingFunction" | "linkColor" | "linkActiveColor" | "linkHoverTextDecoration" | "linkSuccessColor" | "linkSuccessHoverColor" | "linkSuccessActiveColor" | "linkDangerColor" | "linkDangerHoverColor" | "linkDangerActiveColor" | "linkIconMarginRight" | "linkIconMarginLeft" | "linkHoverColor" | "linkDisabledColor" | "linkGrayedColor" | "linkGrayedHoverColor" | "linkGrayedActiveColor" | "linkButtonLineHeight" | "linkButtonPaddingX" | "linkLineBorderBottomStyle" | "linkLineHoverBorderBottomStyle" | "linkLineBorderBottomWidth" | "linkLineBorderBottomOpacity" | "linkLineBorderBottomColor" | "linkFocusOutlineColor" | "linkFocusOutlineWidth" | "linkFocusOutline" | "tokenDisabledBg" | "tokenTextColorDisabled" | "tokenFontSize" | "tokenFontSizeSmall" | "tokenFontSizeMedium" | "tokenFontSizeLarge" | "tokenMarginY" | "tokenMarginX" | "tokenMarginYSmall" | "tokenMarginXSmall" | "tokenMarginYMedium" | "tokenMarginXMedium" | "tokenMarginYLarge" | "tokenMarginXLarge" | "tokenLineHeight" | "tokenLineHeightSmall" | "tokenLineHeightMedium" | "tokenLineHeightLarge" | "tokenPaddingY" | "tokenPaddingX" | "tokenPaddingYSmall" | "tokenPaddingXSmall" | "tokenPaddingYMedium" | "tokenPaddingXMedium" | "tokenPaddingYLarge" | "tokenPaddingXLarge" | "tokenMarginBeforeIcon" | "tokenRemoveIconSize" | "tokenRemoveIconPaddingY" | "tokenRemoveIconPaddingX" | "tokenRemoveIconGap" | "tokenRemoveIconBoxSizing" | "tokenBorderRadius" | "tokenBorderWidth" | "tokenBorderColorDisabled" | "tokenDefaultIdle" | "tokenDefaultActive" | "tokenGrayIdle" | "tokenGrayActive" | "tokenBlueIdle" | "tokenBlueActive" | "tokenGreenIdle" | "tokenGreenActive" | "tokenYellowIdle" | "tokenYellowActive" | "tokenRedIdle" | "tokenRedActive" | "tokenWhite" | "tokenBlack" | "tokenBorderColorWarning" | "tokenBorderColorError" | "tokenOutlineWidth" | "tokenLegacyTextShift" | "tokenPaddingYDisabled" | "tokenPaddingXDisabled" | "tokenMarginYDisabled" | "tokenMarginXDisabled" | "tokenShadowDisabled" | "tokenDefaultIdleBg" | "tokenDefaultIdleColor" | "tokenDefaultIdleBorderColor" | "tokenDefaultIdleBgHover" | "tokenDefaultIdleColorHover" | "tokenDefaultIdleBorderColorHover" | "tokenDefaultActiveBg" | "tokenDefaultActiveColor" | "tokenDefaultActiveBorderColor" | "tokenInputLineHeight" | "tokenInputLineHeightSmall" | "tokenInputLineHeightMedium" | "tokenInputLineHeightLarge" | "tokenInputBorderColor" | "tokenInputBorderColorHover" | "tokenInputBorderColorFocus" | "tokenInputBorderColorError" | "tokenInputBorderColorWarning" | "tokenInputBorderTopColor" | "tokenInputBorderRadius" | "tokenInputPlaceholderColor" | "tokenInputPlaceholderColorLight" | "tokenInputDisabledBg" | "tokenInputDisabledBorderColor" | "tokenInputBorderWidth" | "tokenInputOutlineWidth" | "tokenInputBg" | "tokenInputMenuPopupBg" | "tokenInputShadow" | "tokenInputTextColor" | "tokenInputTextColorDisabled" | "tokenInputPlaceholderColorDisabled" | "tokenInputPaddingY" | "tokenInputPaddingX" | "tokenInputPaddingYSmall" | "tokenInputPaddingXSmall" | "tokenInputPaddingYMedium" | "tokenInputPaddingXMedium" | "tokenInputPaddingYLarge" | "tokenInputPaddingXLarge" | "tokenInputPopupOffset" | "tokenInputPopupMarginSmall" | "tokenInputPopupMarginMedium" | "tokenInputPopupMarginLarge" | "loaderBg" | "loaderOpacity" | "loaderBorderRadius" | "btnBackgroundClip" | "btnArrowBgImageActive" | "btnArrowBgImageChecked" | "btnLinkBorderRadius" | "btnFocusShadowWidth" | "btnBorderColorTransition" | "btnDisabledBorderColor" | "btnCheckedBg" | "btnCheckedDisabledBg" | "btnCheckedDisabledColor" | "btnCheckedTextColor" | "btnCheckedDisabledBorderColor" | "btnCheckedShadow" | "btnCheckedDisabledShadow" | "btnBorderRadiusSmall" | "btnBorderRadiusMedium" | "btnBorderRadiusLarge" | "btnBorderWidth" | "btnInsetWidth" | "btnOutlineWidth" | "btnPaddingXSmall" | "btnPaddingXMedium" | "btnPaddingXLarge" | "btnIconGapSmall" | "btnIconGapSmallLeft" | "btnIconGapSmallRight" | "btnIconGapMedium" | "btnIconGapMediumLeft" | "btnIconGapMediumRight" | "btnIconGapLarge" | "btnIconGapLargeLeft" | "btnIconGapLargeRight" | "btnIconSizeSmall" | "btnIconSizeMedium" | "btnIconSizeLarge" | "btnDefaultBg" | "btnDefaultBgStart" | "btnDefaultBgEnd" | "btnDefaultCheckedBorderColor" | "btnDefaultTextColor" | "btnDefaultHoverBg" | "btnDefaultHoverBgStart" | "btnDefaultHoverBgEnd" | "btnDefaultActiveBg" | "btnDefaultHoverBorderColor" | "btnDefaultHoverBorderBottomColor" | "btnDefaultHoverTextColor" | "btnDefaultActiveBorderColor" | "btnDefaultActiveBorderTopColor" | "btnDefaultBorderColor" | "btnDefaultBorderBottomColor" | "btnDefaultActiveShadow" | "btnSuccessBg" | "btnSuccessHoverBg" | "btnSuccessHoverBorderColor" | "btnSuccessHoverBorderBottomColor" | "btnSuccessHoverTextColor" | "btnSuccessBorderColor" | "btnSuccessBorderBottomColor" | "btnSuccessBgStart" | "btnSuccessBgEnd" | "btnSuccessTextColor" | "btnSuccessHoverBgStart" | "btnSuccessHoverBgEnd" | "btnSuccessActiveBg" | "btnSuccessActiveBorderColor" | "btnSuccessActiveBorderTopColor" | "btnSuccessActiveShadow" | "btnPrimaryBg" | "btnPrimaryHoverBg" | "btnPrimaryHoverBorderColor" | "btnPrimaryHoverBorderBottomColor" | "btnPrimaryHoverTextColor" | "btnPrimaryBorderColor" | "btnPrimaryBorderBottomColor" | "btnPrimaryBgStart" | "btnPrimaryBgEnd" | "btnPrimaryTextColor" | "btnPrimaryHoverBgStart" | "btnPrimaryHoverBgEnd" | "btnPrimaryActiveBg" | "btnPrimaryActiveBorderColor" | "btnPrimaryActiveBorderTopColor" | "btnPrimaryActiveShadow" | "btnDangerBg" | "btnDangerHoverBg" | "btnDangerHoverBorderColor" | "btnDangerHoverBorderBottomColor" | "btnDangerHoverTextColor" | "btnDangerBorderColor" | "btnDangerBorderBottomColor" | "btnDangerBgStart" | "btnDangerBgEnd" | "btnDangerTextColor" | "btnDangerHoverBgStart" | "btnDangerHoverBgEnd" | "btnDangerActiveBg" | "btnDangerActiveBorderColor" | "btnDangerActiveBorderTopColor" | "btnDangerActiveShadow" | "btnPayBg" | "btnPayHoverBg" | "btnPayHoverBorderColor" | "btnPayHoverBorderBottomColor" | "btnPayHoverTextColor" | "btnPayBorderColor" | "btnPayBorderBottomColor" | "btnPayBgStart" | "btnPayBgEnd" | "btnPayTextColor" | "btnPayHoverBgStart" | "btnPayHoverBgEnd" | "btnPayActiveBg" | "btnPayActiveBorderColor" | "btnPayActiveBorderTopColor" | "btnPayActiveShadow" | "btnMenuArrowColor" | "btnFontSizeSmall" | "btnFontSizeMedium" | "btnFontSizeLarge" | "btnLineHeightSmall" | "btnLineHeightMedium" | "btnLineHeightLarge" | "btnPaddingYSmall" | "btnPaddingYMedium" | "btnPaddingYLarge" | "btnDisabledBg" | "btnBorderColorWarning" | "btnBorderColorError" | "btnHeightSmall" | "btnHeightMedium" | "btnHeightLarge" | "btnLinkColor" | "btnLinkHoverColor" | "btnLinkActiveColor" | "btnLinkHoverTextDecoration" | "btnLinkLineBorderBottomColor" | "btnLinkLineBorderBottomStyle" | "btnLinkHoverLineBorderBottomStyle" | "btnLinkLineBorderBottomWidth" | "btnLinkLineBorderBottomOpacity" | "btnLinkIconMarginRight" | "btnLinkIconMarginLeft" | "btnErrorSecondary" | "btnWarningSecondary" | "btnOutlineColorFocus" | "btnInsetColor" | "btnBorderColorFocus" | "btnLinkDisabledColor" | "btnDisabledTextColor" | "btnBacklessBg" | "btnBacklessHoverBg" | "btnBacklessActiveBg" | "btnBacklessBorderColor" | "btnBacklessDisabledBorderColor" | "btnBacklessHoverBorderColor" | "btnBacklessHoverTextColor" | "btnBacklessTextColor" | "btnTextBg" | "btnTextHoverBg" | "btnTextActiveBg" | "btnTextBorderColor" | "btnTextTextColor" | "btnTextHoverTextColor" | "btnTextHoverBorderColor" | "btnWithIconPaddingLeftSmall" | "btnWithIconPaddingLeftMedium" | "btnWithIconPaddingLeftLarge" | "btnIconColor" | "btnIconHoverColor" | "btnIconDisabledColor" | "selectDefaultBg" | "selectPlaceholderColor" | "selectBorderWidth" | "selectPlaceholderColorDisabled" | "selectOutlineWidth" | "selectLineHeightSmall" | "selectFontSizeSmall" | "selectPaddingXSmall" | "selectPaddingYSmall" | "selectBorderRadiusSmall" | "selectIconGapSmall" | "selectLineHeightMedium" | "selectFontSizeMedium" | "selectPaddingXMedium" | "selectPaddingYMedium" | "selectBorderRadiusMedium" | "selectIconGapMedium" | "selectLineHeightLarge" | "selectFontSizeLarge" | "selectPaddingXLarge" | "selectPaddingYLarge" | "selectBorderRadiusLarge" | "selectIconGapLarge" | "selectMenuArrowColor" | "selectMenuArrowColorDisabled" | "selectIconSizeSmall" | "selectIconSizeMedium" | "selectIconSizeLarge" | "selectRootWidthMobile" | "mobileSelectMaxWidth" | "selectTextColorDisabled" | "selectBgDisabled" | "selectBorderColorDisabled" | "selectMenuOffsetY" | "selectBorderColorHover" | "selectBorderColorTransition" | "tooltipPaddingY" | "tooltipPaddingX" | "tooltipCloseBtnPadding" | "tooltipCloseBtnSide" | "tooltipCloseBtnColor" | "tooltipCloseBtnHoverColor" | "tooltipTextColor" | "tooltipBg" | "tooltipBorder" | "tooltipBorderRadius" | "tooltipPinOffset" | "tooltipPinOffsetX" | "tooltipPinOffsetY" | "tooltipMargin" | "tooltipPinSize" | "tooltipFontSize" | "tooltipLineHeight" | "tooltipMenuPinOffset" | "tooltipMenuMargin" | "tooltipMenuPinSize" | "kebabPinOffset" | "kebabPinSize" | "kebabMargin" | "kebabBackground" | "kebabBackgroundHover" | "kebabBackgroundActive" | "kebabBorderRadius" | "kebabBorder" | "kebabSizeSmall" | "kebabSizeMedium" | "kebabSizeLarge" | "kebabIconSizeSmall" | "kebabIconSizeMedium" | "kebabIconSizeLarge" | "kebabIconColor" | "modalWindowShadow" | "modalBackBg" | "modalBg" | "modalBackOpacity" | "modalCloseButtonColor" | "modalCloseButtonDisabledColor" | "modalCloseButtonHoverColor" | "modalCloseButtonPadding" | "modalCloseButtonLegacyShift" | "modalCloseButtonBottomPadding" | "modalCloseButtonClickArea" | "modalCloseIconSize" | "modalCloseLegacyGap" | "modalCloseWrapperLegacyGap" | "modalBorderRadius" | "modalFixedHeaderBg" | "modalFixedHeaderShadow" | "modalFixedHeaderBorder" | "modalFixedFooterBorder" | "modalFixedFooterShadow" | "modalFixedPanelShadow" | "modalFooterBg" | "modalAdaptiveThreshold" | "modalPaddingTop" | "modalPaddingLeft" | "modalPaddingRight" | "modalHeaderFontSize" | "modalHeaderFontWeight" | "modalHeaderTextColor" | "modalHeaderLineHeight" | "modalHeaderPaddingBottom" | "modalHeaderPaddingTop" | "modalHeaderAdditionalPaddingBottom" | "modalFixedHeaderMarginBottom" | "modalFixedHeaderPaddingBottom" | "modalFixedFooterPaddingTop" | "modalFixedFooterMarginTop" | "modalSeparatorBorderBottom" | "modalBodyTextColor" | "modalFooterTextColor" | "modalBodyPaddingTop" | "modalBodyPaddingBottom" | "modalBodyBorderRadius" | "modalFooterPaddingTop" | "modalFooterPaddingBottom" | "modalPaddingBottom" | "modalFooterPanelPaddingTop" | "modalFooterPanelPaddingBottom" | "mobileModalCloseButtonRightPadding" | "mobileModalCloseButtonTopPadding" | "mobileModalCloseButtonClickArea" | "mobileModalCloseIconSize" | "mobileModalHeaderFontSize" | "mobileModalHeaderLineHeight" | "mobileModalHeaderPadding" | "mobileModalBodyPadding" | "mobileModalBodyFontSize" | "mobileModalFooterPadding" | "mobileModalPaddingBottom" | "mobileModalContainerHeight" | "mobileModalContainerMarginTop" | "mobileModalContainerMarginRight" | "mobileModalContainerMarginBottom" | "mobileModalContainerMarginLeft" | "sidePageFooterPanelBg" | "sidePageBackingBg" | "sidePageBackingBgOpacity" | "sidePageCloseButtonColor" | "sidePageCloseButtonHoverColor" | "sidePageContainerShadow" | "mobileSidePagePaddingLeft" | "mobileSidePagePaddingRight" | "mobileSidePagePaddingTop" | "mobileSidePagePaddingBottom" | "mobileSidePageFooterPadding" | "sidePagePaddingLeft" | "sidePagePaddingRight" | "sidePagePaddingTop" | "sidePagePaddingBottom" | "sidePageFooterPaddingTop" | "sidePageFooterPaddingBottom" | "sidePageBgDefault" | "sidePageHeaderTextColor" | "sidePageBodyTextColor" | "sidePageFooterTextColor" | "sidePageHeaderFontSize" | "sidePageHeaderLineHeight" | "sidePageHeaderPaddingBottom" | "sidePageHeaderPaddingTop" | "sidePageHeaderFixedFontSize" | "sidePageHeaderFixedLineHeight" | "sidePageHeaderFixedPaddingY" | "sidePageHeaderStickyOffset" | "sidePageCloseButtonPadding" | "mobileSidePageCloseButtonPadding" | "sidePageCloseButtonLegacyPaddingLeft" | "sidePageFooterPanelPaddingTop" | "sidePageFooterPanelPaddingBottom" | "sidePageCloseIconSize" | "sidePageCloseButtonClickArea" | "mobileSidePageCloseButtonClickArea" | "sidePageFixedHeaderShadow" | "sidePageFixedFooterShadow" | "sidePageFixedPanelShadow" | "mobileSidePageHeaderFontSize" | "mobileSidePageHeaderLineHeight" | "mobileSidePageHeaderPaddingBottom" | "mobileSidePageHeaderPaddingTop" | "sidePageHeaderFontWeight" | "dateInputIconColor" | "dateInputMaskColor" | "dateInputComponentSelectedBgColor" | "dateInputComponentSelectedTextColor" | "calendarBottomSeparatorBorderColor" | "calendarBottomSeparatorBorderWidth" | "calendarBottomSeparatorBorder" | "calendarBg" | "calendarCellBg" | "calendarCellHoverColor" | "calendarCellActiveHoverColor" | "calendarCellWeekendColor" | "calendarCellTodayBorder" | "calendarCellBorderRadius" | "calendarCellSelectedBgColor" | "calendarCellSelectedFontColor" | "calendarCellSize" | "calendarCellHeight" | "calendarCellWidth" | "calendarCellFontSize" | "calendarCellLineHeight" | "calendarMonthHeaderStickedBgColor" | "calendarMonthTitleBorderBottomColor" | "calendarCellHoverBgColor" | "calendarPaddingX" | "calendarMonthTitleLineHeight" | "calendarMonthTitlePaddingTop" | "calendarMonthTitlePaddingBottom" | "calendarMonthTitleMarginX" | "calendarMonthTitleMarginBottom" | "calendarWrapperHeight" | "calendarMonthMarginBottom" | "calendarMaxMonthsToAppendOnScroll" | "calendarGridRowSpacing" | "dateSelectLineHeight" | "dateSelectFontSize" | "dateSelectFontWeight" | "dateSelectMenuItemBgSelected" | "dateSelectTextColorDisabled" | "dateSelectTextColorDefault" | "dateSelectLinkColor" | "dateSelectPopupBoxShadow" | "dateSelectTextColorInvert" | "datePickerOpenBtnColor" | "datePickerMenuOffsetY" | "pickerBg" | "pickerShadow" | "pickerTodayWrapperBgColor" | "pickerTodayWrapperBorderTop" | "pickerTodayWrapperHoverBgColor" | "pickerTodayWrapperFontSize" | "pickerTodayWrapperLineHeight" | "pickerTodayWrapperPaddingTop" | "pickerTodayWrapperPaddingBottom" | "pickerBorderRadius" | "mobileCalendarPaddingX" | "mobileCalendarCellWidth" | "mobileCalendarCellHeight" | "mobileCalendarCellBorderRadius" | "mobileCalendarCellFontSize" | "mobileCalendarGridRowSpacing" | "mobileDateSelectFontSize" | "mobileDateSelectLineHeight" | "mobileCalendarWrapperHeight" | "dateSelectMenuBg" | "dateSelectMenuItemBgActive" | "dateSelectMenuItemBgDisabled" | "dateSelectMenuItemFontActive" | "dateSelectMenuItemFontSelected" | "dateSelectMenuItemFontDisabled" | "pagingFontSize" | "pagingForwardIconSize" | "pagingForwardIconMarginTop" | "pagingPageLinkBoxSizing" | "pagingPageLinkPaddingX" | "pagingPageLinkPaddingY" | "pagingPageLinkLegacyPaddingY" | "pagingPageLinkMinWidth" | "pagingPageForwardLinkMarginTop" | "pagingPageForwardLinkMarginLeft" | "pagingPageForwardLinkPaddingRight" | "pagingLineHeight" | "pagingDotsColor" | "pagingDotsPadding" | "pagingPageLinkActiveBg" | "pagingPageLinkDisabledActiveBg" | "pagingPageLinkActiveColor" | "pagingPageLinkHoverBg" | "pagingPageLinkBorderRadius" | "pagingPageLinkHintColor" | "pagingPageLinkHintFontSize" | "pagingPageLinkHintLineHeight" | "pagingPageLinkHintMargin" | "pagingPageLinkMargin" | "pagingForwardLinkColor" | "pagingForwardLinkDisabledColor" | "pagingDotsDisabledColor" | "hintColor" | "mobileHintColor" | "hintFontSize" | "hintLineHeight" | "hintMaxWidth" | "hintPaddingY" | "hintPaddingX" | "hintTextAlign" | "hintBgColor" | "hintBorder" | "hintBorderRadius" | "hintPinOffset" | "hintMargin" | "toastFontSize" | "toastLineHeight" | "toastPaddingY" | "toastPaddingX" | "toastBorderRadius" | "toastBorder" | "toastTop" | "toastBg" | "toastColor" | "toastLinkColor" | "toastLinkTextDecorationHover" | "toastLinkBgHover" | "toastLinkBgActive" | "toastClosePadding" | "toastCloseColor" | "toastCloseHoverColor" | "toastCloseSize" | "dropdownMenuSelectedBg" | "dropdownMenuBorderColorTransition" | "dropdownMenuHoverBorderColor" | "dropdownMenuHoverBg" | "dropdownMenuOffsetY" | "dropdownMenuMenuOffsetY" | "dropdownMenuMenuBoxSizing" | "dropdownButtonBorderRadiusSmall" | "dropdownButtonBorderRadiusMedium" | "dropdownButtonBorderRadiusLarge" | "dropdownDefaultBg" | "dropdownBorderWidth" | "dropdownOutlineWidth" | "dropdownLineHeightSmall" | "dropdownFontSizeSmall" | "dropdownPaddingXSmall" | "dropdownPaddingYSmall" | "dropdownIconSizeSmall" | "dropdownLineHeightMedium" | "dropdownFontSizeMedium" | "dropdownPaddingXMedium" | "dropdownPaddingYMedium" | "dropdownIconSizeMedium" | "dropdownLineHeightLarge" | "dropdownFontSizeLarge" | "dropdownPaddingXLarge" | "dropdownPaddingYLarge" | "dropdownIconSizeLarge" | "dropdownBgDisabled" | "dropdownBorderColorDisabled" | "dropdownTextColorDisabled" | "menuBgDefault" | "menuBorderRadius" | "menuBorder" | "menuShadow" | "menuPaddingY" | "menuLegacyPaddingY" | "menuScrollContainerContentWrapperPaddingY" | "mobileMenuPaddingY" | "mobileMenuScrollContainerContentWrapperPaddingY" | "menuPaddingX" | "mobileMenuPaddingX" | "menuOffsetY" | "menuBoxSizing" | "menuItemTextColor" | "menuItemSelectedBg" | "menuItemHoverBg" | "menuItemIconWidth" | "menuItemIconWidthSmall" | "menuItemIconWidthMedium" | "menuItemIconWidthLarge" | "menuItemIconGap" | "menuItemIconLegacyMargin" | "menuItemIconLegacyShift" | "menuItemPaddingForIcon" | "menuItemPaddingForIconSmall" | "menuItemPaddingForIconMedium" | "menuItemPaddingForIconLarge" | "menuItemLineHeight" | "menuItemLineHeightSmall" | "menuItemLineHeightMedium" | "menuItemLineHeightLarge" | "menuItemFontSize" | "menuItemFontSizeSmall" | "menuItemFontSizeMedium" | "menuItemFontSizeLarge" | "menuItemPaddingX" | "menuItemPaddingY" | "menuItemPaddingXSmall" | "menuItemPaddingYSmall" | "menuItemPaddingXMedium" | "menuItemPaddingYMedium" | "menuItemPaddingXLarge" | "menuItemPaddingYLarge" | "menuItemBorderRadius" | "menuItemLegacyPaddingX" | "menuItemLegacyPaddingY" | "menuItemHoverColor" | "menuItemLinkColor" | "menuItemCommentColor" | "menuItemCommentOpacity" | "menuItemCommentColorHover" | "menuItemDisplay" | "menuItemPaddingMobile" | "menuItemLineHeightMobile" | "menuItemFontSizeMobile" | "menuItemDisabledColor" | "menuItemDisabledBg" | "menuMessageTextColor" | "menuMessageBg" | "menuMessagePaddingY" | "menuMessagePaddingX" | "menuMessageDisplay" | "menuMessagePaddingMobile" | "menuMessageLineHeight" | "menuMessageLineHeightMobile" | "menuMessageFontSize" | "menuMessageFontSizeMobile" | "menuMessageFontSizeSmall" | "menuMessageFontSizeMedium" | "menuMessageFontSizeLarge" | "menuMessageLineHeightSmall" | "menuMessageLineHeightMedium" | "menuMessageLineHeightLarge" | "menuItemGap" | "menuHeaderColor" | "menuHeaderLineHeight" | "menuHeaderLineHeightSmall" | "menuHeaderLineHeightMedium" | "menuHeaderLineHeightLarge" | "menuHeaderFontSize" | "menuHeaderFontSizeSmall" | "menuHeaderFontSizeMedium" | "menuHeaderFontSizeLarge" | "menuHeaderPaddingX" | "menuHeaderPaddingTop" | "menuHeaderPaddingBottom" | "menuHeaderPaddingXSmall" | "menuHeaderPaddingTopSmall" | "menuHeaderPaddingBottomSmall" | "menuHeaderPaddingXMedium" | "menuHeaderPaddingTopMedium" | "menuHeaderPaddingBottomMedium" | "menuHeaderPaddingXLarge" | "menuHeaderPaddingTopLarge" | "menuHeaderPaddingBottomLarge" | "menuHeaderTotalCountPaddingTopSmall" | "menuHeaderTotalCountPaddingTopMedium" | "menuHeaderTotalCountPaddingTopLarge" | "menuHeaderTotalCountPaddingBottomSmall" | "menuHeaderTotalCountPaddingBottomMedium" | "menuHeaderTotalCountPaddingBottomLarge" | "menuHeaderLegacyPaddingRight" | "menuFooterColor" | "menuFooterLineHeightSmall" | "menuFooterLineHeightMedium" | "menuFooterLineHeightLarge" | "menuFooterFontSizeSmall" | "menuFooterFontSizeMedium" | "menuFooterFontSizeLarge" | "menuFooterPaddingXSmall" | "menuFooterPaddingXMedium" | "menuFooterPaddingXLarge" | "menuFooterPaddingTopSmall" | "menuFooterPaddingTopMedium" | "menuFooterPaddingTopLarge" | "menuFooterPaddingBottomSmall" | "menuFooterPaddingBottomMedium" | "menuFooterPaddingBottomLarge" | "menuFooterLegacyPaddingRight" | "menuSeparatorBorderColor" | "menuSeparatorMarginY" | "menuSeparatorMarginX" | "menuSeparatorBorderWidth" | "mobileMenuSeparatorMarginY" | "mobileMenuSeparatorMarginX" | "toggleFontSize" | "toggleLineHeight" | "toggleLineHeightSmall" | "toggleLineHeightMedium" | "toggleLineHeightLarge" | "toggleFontSizeSmall" | "toggleFontSizeMedium" | "toggleFontSizeLarge" | "toggleTextColor" | "toggleHandleActiveWidthIncrement" | "toggleHandleBorderRadius" | "toggleHandleBorderRadiusSmall" | "toggleHandleBorderRadiusMedium" | "toggleHandleBorderRadiusLarge" | "toggleHeight" | "toggleWidth" | "toggleHeightSmall" | "toggleWidthSmall" | "toggleHeightMedium" | "toggleWidthMedium" | "toggleHeightLarge" | "toggleWidthLarge" | "toggleBorderRadius" | "toggleBorderRadiusSmall" | "toggleBorderRadiusMedium" | "toggleBorderRadiusLarge" | "toggleBg" | "toggleCheckedBg" | "toggleDisabledHandleBg" | "toggleBaseBg" | "toggleBgDisabled" | "toggleBgDisabledChecked" | "toggleBgHover" | "toggleCheckedBgHover" | "toggleBgChecked" | "toggleBorderWidth" | "toggleOutlineWidth" | "toggleBorderColor" | "toggleBorderColorDisabled" | "toggleBorderColorDisabledChecked" | "toggleHandleSize" | "toggleHandleSizeSmall" | "toggleHandleSizeMedium" | "toggleHandleSizeLarge" | "toggleHandleLeft" | "toggleHandleTop" | "toggleBgFocus" | "toggleBgActive" | "toggleShadowColorError" | "toggleShadowColorWarning" | "toggleFocusShadowColor" | "toggleCaptionGap" | "toggleButtonOffsetY" | "toggleOutlineColorFocus" | "toggleHandleBoxShadowOld" | "toggleContainerBg" | "toggleContainerBgHover" | "toggleContainerBgChecked" | "toggleContainerBgCheckedHover" | "toggleContainerBoxShadow" | "toggleContainerBoxShadowHover" | "toggleContainerBoxShadowChecked" | "toggleContainerBoxShadowCheckedHover" | "toggleHandleBg" | "toggleHandleBgHover" | "toggleHandleBgChecked" | "toggleHandleBgCheckedHover" | "toggleHandleBoxShadow" | "toggleHandleBoxShadowHover" | "toggleHandleBoxShadowChecked" | "toggleHandleBoxShadowCheckedHover" | "toggleContainerBgDisabled" | "toggleHandleBgDisabled" | "toggleContainerBoxShadowDisabled" | "toggleHandleBoxShadowDisabled" | "toggleContainerBgDisabledChecked" | "toggleHandleBgDisabledChecked" | "toggleContainerBoxShadowDisabledChecked" | "toggleHandleBoxShadowDisabledChecked" | "popupBorder" | "popupBorderRadius" | "popupBorderColor" | "popupDropShadow" | "popupBoxShadow" | "popupTextColor" | "popupBackground" | "popupPinOffset" | "popupPinOffsetX" | "popupPinOffsetY" | "popupMargin" | "popupPinSize" | "popupMenuMenuOffsetY" | "inputTextColor" | "inputShadow" | "inputBg" | "inputIconColor" | "inputIconColorDisabled" | "inputFocusedIconColor" | "inputColor" | "inputWidth" | "inputTextColorDisabled" | "inputFontSizeSmall" | "inputFontSizeMedium" | "inputFontSizeLarge" | "inputLineHeightSmall" | "inputLineHeightMedium" | "inputLineHeightLarge" | "inputHeightSmall" | "inputHeightMedium" | "inputHeightLarge" | "inputPaddingYSmall" | "inputPaddingYMedium" | "inputPaddingYLarge" | "inputPaddingXSmall" | "inputPaddingXMedium" | "inputPaddingXLarge" | "inputIconGapSmall" | "inputIconGapMedium" | "inputIconGapLarge" | "inputIconSizeSmall" | "inputIconSizeMedium" | "inputIconSizeLarge" | "inputFocusShadow" | "inputFocusedBg" | "inputDisabledBg" | "inputDisabledBorderColor" | "inputFocusOutline" | "inputBorderWidth" | "inputOutlineWidth" | "inputBackgroundClip" | "inputBorderRadiusSmall" | "inputBorderRadiusMedium" | "inputBorderRadiusLarge" | "inputDisabledBackgroundClip" | "inputBorderColor" | "inputBorderColorHover" | "inputBorderColorFocus" | "inputBorderColorError" | "inputBorderColorWarning" | "inputBorderTopColor" | "inputPlaceholderColor" | "inputPlaceholderColorDisabled" | "inputPlaceholderColorLight" | "inputBlinkColor" | "inputColorScheme" | "checkboxFontSize" | "checkboxFontSizeSmall" | "checkboxFontSizeMedium" | "checkboxFontSizeLarge" | "checkboxLineHeight" | "checkboxLineHeightSmall" | "checkboxLineHeightMedium" | "checkboxLineHeightLarge" | "checkboxBoxSize" | "checkboxBoxSizeSmall" | "checkboxBoxSizeMedium" | "checkboxBoxSizeLarge" | "checkboxCaptionGap" | "checkboxPaddingY" | "checkboxPaddingYSmall" | "checkboxPaddingYMedium" | "checkboxPaddingYLarge" | "checkboxBoxOffsetY" | "checkboxBgStart" | "checkboxBgEnd" | "checkboxTextColorDefault" | "checkboxTextColorDisabled" | "checkboxShadowDisabled" | "checkboxBorder" | "checkboxBorderWidth" | "checkboxShadow" | "checkboxShadowHover" | "checkboxCheckedColor" | "checkboxOutlineColorFocus" | "checkboxBorderColorWarning" | "checkboxBorderColorError" | "checkboxCheckedHoverShadow" | "checkboxBorderRadius" | "checkboxOutlineWidth" | "checkboxCheckedShadow" | "checkboxCheckedActiveShadow" | "checkboxBorderColorFocus" | "checkboxBg" | "checkboxHoverBg" | "checkboxActiveBg" | "checkboxCheckedBg" | "checkboxBgDisabled" | "checkboxCheckedHoverBg" | "checkboxCheckedActiveBg" | "checkboxShadowActive" | "textareaBg" | "textareaColor" | "textareaTextColorDisabled" | "textareaPlaceholderColorLight" | "textareaPlaceholderColor" | "textareaPlaceholderColorDisabled" | "textareaShadow" | "textareaBackgroundClip" | "textareaFontSize" | "textareaFontSizeSmall" | "textareaFontSizeMedium" | "textareaFontSizeLarge" | "textareaLineHeight" | "textareaLineHeightSmall" | "textareaLineHeightMedium" | "textareaLineHeightLarge" | "textareaBorderRadius" | "textareaBorderWidth" | "textareaOutlineWidth" | "textareaMinHeight" | "textareaMinHeightSmall" | "textareaMinHeightMedium" | "textareaMinHeightLarge" | "textareaWidth" | "textareaPaddingX" | "textareaPaddingXSmall" | "textareaPaddingXMedium" | "textareaPaddingXLarge" | "textareaPaddingY" | "textareaPaddingYSmall" | "textareaPaddingYMedium" | "textareaPaddingYLarge" | "textareaBorderColor" | "textareaBorderTopColor" | "textareaBorderColorFocus" | "textareaBorderColorHover" | "textareaBorderColorWarning" | "textareaBorderColorError" | "textareaDisabledBg" | "textareaDisabledBorderColor" | "textareaCounterColor" | "textareaCounterBg" | "textareaCounterErrorColor" | "textareaCounterHelpIconColor" | "radioBulletSize" | "radioBulletSizeSmall" | "radioBulletSizeMedium" | "radioBulletSizeLarge" | "radioOutlineWidth" | "radioTextColor" | "radioSize" | "radioSizeSmall" | "radioSizeMedium" | "radioSizeLarge" | "radioFontSize" | "radioFontSizeSmall" | "radioFontSizeMedium" | "radioFontSizeLarge" | "radioLineHeight" | "radioLineHeightSmall" | "radioLineHeightMedium" | "radioLineHeightLarge" | "radioCaptionGap" | "radioPaddingY" | "radioPaddingYSmall" | "radioPaddingYMedium" | "radioPaddingYLarge" | "radioVerticalAlign" | "radioBgImage" | "radioBgColor" | "radioHoverBg" | "radioActiveBg" | "radioBorderWidth" | "radioBorderColor" | "radioBoxShadow" | "radioBorder" | "radioBorderColorFocus" | "radioBorderColorWarning" | "radioBorderColorError" | "radioHoverShadow" | "radioActiveShadow" | "radioFocusShadow" | "radioCheckedBgColor" | "radioCheckedBorderColor" | "radioCheckedBulletColor" | "radioCheckedHoverBgColor" | "radioDisabledBg" | "radioDisabledShadow" | "radioCaptionDisplay" | "radioBorderWidthCompensation" | "radioCircleOffsetY" | "radioCheckedDisabledBulletBg" | "radioGroupLegacyItemGap" | "tabFontSize" | "tabFontSizeSmall" | "tabFontSizeMedium" | "tabFontSizeLarge" | "tabLineHeight" | "tabLineHeightSmall" | "tabLineHeightMedium" | "tabLineHeightLarge" | "tabPaddingX" | "tabPaddingXSmall" | "tabPaddingXMedium" | "tabPaddingXLarge" | "tabsMarginX" | "tabPaddingY" | "tabPaddingYSmall" | "tabPaddingYMedium" | "tabPaddingYLarge" | "tabBorderWidth" | "tabOutlineWidth" | "tabTextColorDefault" | "tabColorFocus" | "tabColorError" | "tabColorWarning" | "tabColorSuccess" | "tabColorPrimary" | "tabColorHover" | "tabColorHoverError" | "tabColorHoverWarning" | "tabColorHoverSuccess" | "tabColorHoverPrimary" | "tabIndicatorBorderRadius" | "spinnerBgColor" | "spinnerColor" | "spinnerDimmedColor" | "spinnerCaptionColor" | "spinnerFontSizeSmall" | "spinnerFontSizeMedium" | "spinnerFontSizeLarge" | "spinnerLineHeightSmall" | "spinnerLineHeightMedium" | "spinnerLineHeightLarge" | "spinnerCaptionGapSmall" | "spinnerCaptionGapMedium" | "spinnerCaptionGapLarge" | "spinnerCaptionMarginSmall" | "spinnerCaptionMarginMedium" | "spinnerCaptionMarginLarge" | "switcherBorderRadius" | "switcherTextColor" | "switcherOutlineWidth" | "switcherCaptionFontSizeSmall" | "switcherCaptionFontSizeMedium" | "switcherCaptionFontSizeLarge" | "switcherCaptionLineHeightSmall" | "switcherCaptionLineHeightMedium" | "switcherCaptionLineHeightLarge" | "switcherCaptionGapSmall" | "switcherCaptionGapMedium" | "switcherCaptionGapLarge" | "switcherButtonPaddingXSmall" | "switcherButtonPaddingXMedium" | "switcherButtonPaddingXLarge" | "switcherButtonPaddingYSmall" | "switcherButtonPaddingYMedium" | "switcherButtonPaddingYLarge" | "switcherButtonLineHeightSmall" | "switcherButtonLineHeightMedium" | "switcherButtonLineHeightLarge" | "switcherButtonFontSizeSmall" | "switcherButtonFontSizeMedium" | "switcherButtonFontSizeLarge" | "switcherButtonBorderRadiusSmall" | "switcherButtonBorderRadiusMedium" | "switcherButtonBorderRadiusLarge" | "switcherButtonBorderWidth" | "switcherBtnDisabledBorderColor" | "switcherButtonDisabledBorderColor" | "switcherButtonCheckedDisabledShadow" | "mobilePopupTopPadding" | "mobilePopupContainerBottomPadding" | "mobilePopupHeaderPadding" | "mobilePopupFooterPadding" | "mobilePopupContainerBorderRadius" | "mobilePopupHeaderFontSize" | "mobilePopupHeaderLineHeight" | "mobilePopupHeaderFontWeight" | "mobilePopupHeaderChildPadding" | "mobilePopupOuterIndentY" | "scrollContainerScrollBarSize" | "scrollContainerScrollBarHoverSize" | "scrollContainerScrollBarColor" | "scrollContainerScrollBarInvertColor" | "scrollContainerScrollBarOffsetY" | "dropdownMenuScrollContainerScrollBarOffsetY" | "passwordInputVisibilityIconColor" | "passwordInputVisibilityIconOpacity" | "passwordInputVisibilityIconHoverColor" | "passwordInputVisibilityIconHoverOpacity" | "globalLoaderColor" | "globalLoaderHeight" | "globalLoaderWidth" | "globalLoaderPosition" | "globalLoaderTop" | "globalLoaderLeft" | "globalLoaderBottom" | "globalLoaderRight" | "globalLoaderBackgroundColor" | "globalLoaderTransitionToSpinnerDuration" | "globalLoaderSpinnerAnimationDuration" | "globalLoaderSlowAnimationDuration" | "globalLoaderTransitionFromSpinnerDuration" | "fileUploaderWidth" | "fileUploaderBg" | "fileUploaderUploadButtonBg" | "fileUploaderFontSize" | "fileUploaderPaddingXSmall" | "fileUploaderPaddingXMedium" | "fileUploaderPaddingXLarge" | "fileUploaderFontSizeSmall" | "fileUploaderFontSizeMedium" | "fileUploaderFontSizeLarge" | "fileUploaderLineHeight" | "fileUploaderLineHeightSmall" | "fileUploaderLineHeightMedium" | "fileUploaderLineHeightLarge" | "fileUploaderPaddingYSmall" | "fileUploaderPaddingYMedium" | "fileUploaderPaddingYLarge" | "fileUploaderTextColorDefault" | "fileUploaderPaddingX" | "fileUploaderPaddingY" | "fileUploaderBorderRadius" | "fileUploaderBorderColor" | "fileUploaderBorderWidth" | "fileUploaderDisabledBorder" | "fileUploaderBorderStyle" | "fileUploaderBorderColorFocus" | "fileUploaderLinkColor" | "fileUploaderAfterLinkColor" | "fileUploaderIconSize" | "fileUploaderIconColor" | "fileUploaderIconHoverColor" | "fileUploaderBorderColorError" | "fileUploaderBorderColorWarning" | "fileUploaderDisabledBg" | "fileUploaderDisabledBgClip" | "fileUploaderDisabledBorderColor" | "fileUploaderDisabledTextColor" | "fileUploaderDisabledLinkColor" | "fileUploaderDisabledIconColor" | "fileUploaderLinkHoverTextDecoration" | "fileUploaderHoveredBg" | "fileUploaderHoveredBorderColor" | "fileUploaderIconGapSmall" | "fileUploaderIconGapMedium" | "fileUploaderIconGapLarge" | "fileUploaderDragOverBorderColor" | "fileUploaderDragOverShadow" | "closeBtnIconColor" | "closeBtnIconDisabledColor" | "closeBtnIconHoverColor" | "closeBtnIconBorderRadius" | "closeBtnIconFocusShadow" | "internalMenuPaddingY" | "autocompleteMenuOffsetY" | "comboboxMenuOffsetY" | "miniModalHeaderPaddingBottom" | "miniModalBodyPaddingTop" | "miniModalBodyPaddingBottom" | "miniModalHeaderPaddingTop" | "miniModalActionGap" | "miniModalCancelIndent" | "miniModalFooterPaddingTop" | "miniModalFooterPaddingBottom" | "miniModalTitleMarginTop" | "miniModalHeightMobile" | "miniModalMarginTopMobile" | "miniModalMarginLeftMobile" | "miniModalMarginRightMobile" | "miniModalFooterPaddingMobile" | "miniModalHeaderPaddingMobile" | "miniModalBodyPaddingMobile" | "validationsTextColorError" | "validationsTextColorWarning")[];
 export declare const CALLS_COUNT: number;
 export declare const EXECUTION_TIME: number;

package/cjs/internal/ZIndex/ZIndex.d.ts

@@ -23,19 +23,22 @@ export interface ZIndexProps extends React.HTMLAttributes<HTMLDivElement> {
 declare type DefaultProps = Required<Pick<ZIndexProps, 'delta' | 'priority' | 'style' | 'applyZIndex' | 'coverChildren' | 'createStackingContext' | 'useWrapper'>>;
 interface ZIndexState {
     zIndex: number;
+    savedZIndexContext: {
+        parentLayerZIndex: number;
+        maxZIndex: number;
+    } | null;
 }
 export declare class ZIndex extends React.Component<ZIndexProps, ZIndexState> {
     static __KONTUR_REACT_UI__: string;
     static displayName: string;
     static defaultProps: DefaultProps;
-    state: {
-        zIndex: number;
-    };
+    state: ZIndexState;
     private getProps;
     static propTypes: {
         delta(props: ZIndexProps): Error | undefined;
     };
     private setRootNode;
+    private zIndexContext;
     constructor(props: ZIndexProps);
     componentDidUpdate(prevProps: Readonly<ZIndexProps>): void;
     componentWillUnmount(): void;
@@ -43,5 +46,6 @@ export declare class ZIndex extends React.Component<ZIndexProps, ZIndexState> {
     private wrapperRef;
     private calcZIndex;
     private increment;
+    private tryGetContextByDOM;
 }
 export {};

package/cjs/internal/ZIndex/ZIndex.js

@@ -4,10 +4,15 @@ var _globalObject = require("@skbkontur/global-object");
 var _callChildRef = require("../../lib/callChildRef/callChildRef");
 var _rootNode = require("../../lib/rootNode");
 var _createPropsGetter = require("../../lib/createPropsGetter");
+var _isInstanceOf = require("../../lib/isInstanceOf");
+var _Loader = require("../../components/Loader");
+var _RenderContainer = require("../RenderContainer");
 
 var _ZIndexStorage = require("./ZIndexStorage");var _excluded = ["style", "children", "delta", "priority", "applyZIndex", "coverChildren", "createStackingContext", "wrapperRef", "useWrapper"];var _class, _class2, _temp;
 
-var ZIndexContext = /*#__PURE__*/_react.default.createContext({ parentLayerZIndex: 0, maxZIndex: Infinity });
+var DEFAULT_ZINDEX_CONTEXT = { parentLayerZIndex: 0, maxZIndex: Infinity };
+
+var ZIndexContext = /*#__PURE__*/_react.default.createContext(DEFAULT_ZINDEX_CONTEXT);
 
 ZIndexContext.displayName = 'ZIndexContext';var
 
@@ -43,6 +48,7 @@ ZIndexContext.displayName = 'ZIndexContext';var
 
 
 
+
 
 
 ZIndex = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(ZIndex, _React$Component);
@@ -75,11 +81,15 @@ ZIndex = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/functi
 
 
 
+
+
 
 
 
   function ZIndex(props) {var _this;
-    _this = _React$Component.call(this, props) || this;_this.state = { zIndex: 0 };_this.getProps = (0, _createPropsGetter.createPropsGetter)(ZIndex.defaultProps);_this.
+    _this = _React$Component.call(this, props) || this;_this.state = { zIndex: 0, savedZIndexContext: null };_this.getProps = (0, _createPropsGetter.createPropsGetter)(ZIndex.defaultProps);_this.zIndexContext = null;_this.
+
+
 
 
 
@@ -148,6 +158,7 @@ ZIndex = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/functi
       var wrapperRef = _this.props.wrapperRef;
       _this.setRootNode(element);
       wrapperRef && (0, _callChildRef.callChildRef)(wrapperRef, element);
+      element && _this.tryGetContextByDOM(element);
     };_this.
 
 
@@ -168,4 +179,31 @@ ZIndex = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/functi
       var _this$getProps = _this.getProps(),priority = _this$getProps.priority,delta = _this$getProps.delta;
 
       return (0, _ZIndexStorage.incrementZIndex)(priority, delta);
-    };_this.state.zIndex = _this.increment();return _this;}var _proto = ZIndex.prototype;_proto.componentDidUpdate = function componentDidUpdate(prevProps) {if (prevProps.priority !== this.props.priority || prevProps.delta !== this.props.delta) {(0, _ZIndexStorage.removeZIndex)(this.state.zIndex);this.setState({ zIndex: this.increment() });}};_proto.componentWillUnmount = function componentWillUnmount() {(0, _ZIndexStorage.removeZIndex)(this.state.zIndex);};_proto.render = function render() {var _this2 = this;var _this$getProps2 = this.getProps(),style = _this$getProps2.style,children = _this$getProps2.children,delta = _this$getProps2.delta,priority = _this$getProps2.priority,applyZIndex = _this$getProps2.applyZIndex,coverChildren = _this$getProps2.coverChildren,createStackingContext = _this$getProps2.createStackingContext,wrapperRef = _this$getProps2.wrapperRef,useWrapper = _this$getProps2.useWrapper,rest = (0, _objectWithoutPropertiesLoose2.default)(_this$getProps2, _excluded);var wrapperStyle = {};return /*#__PURE__*/_react.default.createElement(ZIndexContext.Consumer, null, function (_ref) {var parentLayerZIndex = _ref.parentLayerZIndex,maxZIndex = _ref.maxZIndex;var zIndexContextValue = { parentLayerZIndex: parentLayerZIndex, maxZIndex: maxZIndex };if (applyZIndex) {var newZIndex = _this2.calcZIndex(parentLayerZIndex, maxZIndex);wrapperStyle.zIndex = newZIndex;zIndexContextValue = coverChildren ? { parentLayerZIndex: parentLayerZIndex, maxZIndex: newZIndex } : { parentLayerZIndex: newZIndex, maxZIndex: Number.isFinite(maxZIndex) ? newZIndex : Infinity };if (createStackingContext) {(0, _globalObject.isBrowser)(_globalObject.globalObject) && 'isolation' in _globalObject.globalObject.document.body.style ? wrapperStyle.isolation = 'isolate' : wrapperStyle.transform = 'rotate(0)';}}var child = !useWrapper ? children : /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({ style: (0, _extends2.default)({}, style, wrapperStyle), ref: _this2.wrapperRef }, rest), children);return /*#__PURE__*/_react.default.createElement(ZIndexContext.Provider, { value: zIndexContextValue }, child);});};_proto.calcZIndex = function calcZIndex(parentLayerZIndex, maxZIndex) {var newZIndex = this.state.zIndex;if (Number.isFinite(maxZIndex)) {var allowedValuesIntervalLength = maxZIndex - parentLayerZIndex;var scale = _ZIndexStorage.upperBorder / allowedValuesIntervalLength;newZIndex = Math.ceil(newZIndex / scale);}newZIndex += parentLayerZIndex;return newZIndex;};return ZIndex;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'ZIndex', _class2.displayName = 'ZIndex', _class2.defaultProps = { delta: 10, priority: 0, style: {}, applyZIndex: true, coverChildren: false, createStackingContext: false, useWrapper: true }, _class2.propTypes = { delta: function delta(props) {if ((props.delta || _class2.defaultProps.delta) <= 0) {return new Error("[ZIndex]: Prop 'delta' must be greater than 0, received " + props.delta);}if (Math.trunc(props.delta || _class2.defaultProps.delta) !== props.delta) {return new Error("[ZIndex]: Prop 'delta' must be integer, received " + props.delta);}} }, _temp)) || _class;exports.ZIndex = ZIndex;
+    };_this.
+
+    tryGetContextByDOM = function (element) {
+      if (DEFAULT_ZINDEX_CONTEXT === _this.zIndexContext && _this.state.savedZIndexContext === null) {var _element$parentElemen;
+        var savedZIndexContext = DEFAULT_ZINDEX_CONTEXT;
+        var portal = (_element$parentElemen = element.parentElement) == null ? void 0 : _element$parentElemen.closest("[" + _RenderContainer.PORTAL_OUTLET_ATTR + "]");
+
+        if ((0, _isInstanceOf.isInstanceOf)(portal, _globalObject.globalObject.HTMLElement)) {var _noscript$parentEleme;
+          var portalID = portal.getAttribute(_RenderContainer.PORTAL_OUTLET_ATTR);
+          var noscript = document.querySelector("noscript[" + _RenderContainer.PORTAL_INLET_ATTR + "=\"" + portalID + "\"]");
+          var parent = noscript == null ? void 0 : (_noscript$parentEleme = noscript.parentElement) == null ? void 0 : _noscript$parentEleme.closest('[style*=z-index]');
+
+          if ((0, _isInstanceOf.isInstanceOf)(parent, _globalObject.globalObject.HTMLElement)) {var _parent$parentElement;
+            var newZIndex = Number(parent.style.zIndex || 0);
+
+            var maxZIndex = Infinity;
+
+            if (((_parent$parentElement = parent.parentElement) == null ? void 0 : _parent$parentElement.dataset.tid) === _Loader.LoaderDataTids.veil) {
+              maxZIndex = _this.calcZIndex(newZIndex, maxZIndex);
+            }
+
+            savedZIndexContext = { maxZIndex: maxZIndex, parentLayerZIndex: newZIndex };
+          }
+        }
+
+        _this.setState({ savedZIndexContext: savedZIndexContext });
+      }
+    };_this.state.zIndex = _this.increment();return _this;}var _proto = ZIndex.prototype;_proto.componentDidUpdate = function componentDidUpdate(prevProps) {if (prevProps.priority !== this.props.priority || prevProps.delta !== this.props.delta) {(0, _ZIndexStorage.removeZIndex)(this.state.zIndex);this.setState({ zIndex: this.increment() });}};_proto.componentWillUnmount = function componentWillUnmount() {(0, _ZIndexStorage.removeZIndex)(this.state.zIndex);};_proto.render = function render() {var _this2 = this;var _this$getProps2 = this.getProps(),style = _this$getProps2.style,children = _this$getProps2.children,delta = _this$getProps2.delta,priority = _this$getProps2.priority,applyZIndex = _this$getProps2.applyZIndex,coverChildren = _this$getProps2.coverChildren,createStackingContext = _this$getProps2.createStackingContext,wrapperRef = _this$getProps2.wrapperRef,useWrapper = _this$getProps2.useWrapper,rest = (0, _objectWithoutPropertiesLoose2.default)(_this$getProps2, _excluded);var wrapperStyle = {};return /*#__PURE__*/_react.default.createElement(ZIndexContext.Consumer, null, function (context) {_this2.zIndexContext = context;var _ref = _this2.state.savedZIndexContext || context,parentLayerZIndex = _ref.parentLayerZIndex,maxZIndex = _ref.maxZIndex;var zIndexContextValue = { parentLayerZIndex: parentLayerZIndex, maxZIndex: maxZIndex };var newZIndex = 0;if (applyZIndex) {newZIndex = _this2.calcZIndex(parentLayerZIndex, maxZIndex);wrapperStyle.zIndex = newZIndex;zIndexContextValue = coverChildren ? { parentLayerZIndex: parentLayerZIndex, maxZIndex: newZIndex } : { parentLayerZIndex: newZIndex, maxZIndex: Number.isFinite(maxZIndex) ? newZIndex : Infinity };if (createStackingContext) {(0, _globalObject.isBrowser)(_globalObject.globalObject) && 'isolation' in _globalObject.globalObject.document.body.style ? wrapperStyle.isolation = 'isolate' : wrapperStyle.transform = 'rotate(0)';}}var child = !useWrapper ? children : /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({ style: (0, _extends2.default)({}, style, wrapperStyle), ref: _this2.wrapperRef }, rest), children);return /*#__PURE__*/_react.default.createElement(ZIndexContext.Provider, { value: zIndexContextValue }, child);});};_proto.calcZIndex = function calcZIndex(parentLayerZIndex, maxZIndex) {var newZIndex = this.state.zIndex;if (Number.isFinite(maxZIndex)) {var allowedValuesIntervalLength = maxZIndex - parentLayerZIndex;var scale = _ZIndexStorage.upperBorder / allowedValuesIntervalLength;newZIndex = Math.ceil(newZIndex / scale);}newZIndex += parentLayerZIndex;return newZIndex;};return ZIndex;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'ZIndex', _class2.displayName = 'ZIndex', _class2.defaultProps = { delta: 10, priority: 0, style: {}, applyZIndex: true, coverChildren: false, createStackingContext: false, useWrapper: true }, _class2.propTypes = { delta: function delta(props) {if ((props.delta || _class2.defaultProps.delta) <= 0) {return new Error("[ZIndex]: Prop 'delta' must be greater than 0, received " + props.delta);}if (Math.trunc(props.delta || _class2.defaultProps.delta) !== props.delta) {return new Error("[ZIndex]: Prop 'delta' must be integer, received " + props.delta);}} }, _temp)) || _class;exports.ZIndex = ZIndex;

package/cjs/internal/ZIndex/ZIndex.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ZIndex.tsx"],"names":["ZIndexContext","React","createContext","parentLayerZIndex","maxZIndex","Infinity","displayName","ZIndex","rootNode","props","state","zIndex","getProps","defaultProps","wrapperRef","element","setRootNode","increment","priority","delta","componentDidUpdate","prevProps","setState","componentWillUnmount","render","style","children","applyZIndex","coverChildren","createStackingContext","useWrapper","rest","wrapperStyle","zIndexContextValue","newZIndex","calcZIndex","Number","isFinite","globalObject","document","body","isolation","transform","child","allowedValuesIntervalLength","scale","upperBorder","Math","ceil","Component","__KONTUR_REACT_UI__","propTypes","Error","trunc"],"mappings":"wcAAA;AACA;;AAEA;AACA;AACA;;AAEA,gD;;AAEA,IAAMA,aAAa,gBAAGC,eAAMC,aAAN,CAAoB,EAAEC,iBAAiB,EAAE,CAArB,EAAwBC,SAAS,EAAEC,QAAnC,EAApB,CAAtB;;AAEAL,aAAa,CAACM,WAAd,GAA4B,eAA5B,C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCaC,M,OADZC,kB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkCC,kBAAYC,KAAZ,EAAgC;AAC9B,wCAAMA,KAAN,UAD8B,MAnBzBC,KAmByB,GAnBjB,EACbC,MAAM,EAAE,CADK,EAmBiB,OAfxBC,QAewB,GAfb,0CAAkBL,MAAM,CAACM,YAAzB,CAea;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkExBC,IAAAA,UAlEwB,GAkEX,UAACC,OAAD,EAAoC;AACvD,UAAQD,UAAR,GAAuB,MAAKL,KAA5B,CAAQK,UAAR;AACA,YAAKE,WAAL,CAAiBD,OAAjB;AACAD,MAAAA,UAAU,IAAI,gCAAaA,UAAb,EAAyBC,OAAzB,CAAd;AACD,KAtE+B;;;;;;;;;;;;;;;;AAsFxBE,IAAAA,SAtFwB,GAsFZ,YAAM;AACxB,2BAA4B,MAAKL,QAAL,EAA5B,CAAQM,QAAR,kBAAQA,QAAR,CAAkBC,KAAlB,kBAAkBA,KAAlB;;AAEA,aAAO,oCAAgBD,QAAhB,EAA0BC,KAA1B,CAAP;AACD,KA1F+B,CAE9B,MAAKT,KAAL,CAAWC,MAAX,GAAoB,MAAKM,SAAL,EAApB,CAF8B,aAG/B,C,qCAEMG,kB,GAAP,4BAA0BC,SAA1B,EAA4D,CAC1D,IAAIA,SAAS,CAACH,QAAV,KAAuB,KAAKT,KAAL,CAAWS,QAAlC,IAA8CG,SAAS,CAACF,KAAV,KAAoB,KAAKV,KAAL,CAAWU,KAAjF,EAAwF,CACtF,iCAAa,KAAKT,KAAL,CAAWC,MAAxB,EACA,KAAKW,QAAL,CAAc,EAAEX,MAAM,EAAE,KAAKM,SAAL,EAAV,EAAd,EACD,CACF,C,QAEMM,oB,GAAP,gCAA8B,CAC5B,iCAAa,KAAKb,KAAL,CAAWC,MAAxB,EACD,C,QAEMa,M,GAAP,kBAAgB,mBACd,sBAWI,KAAKZ,QAAL,EAXJ,CACEa,KADF,mBACEA,KADF,CAEEC,QAFF,mBAEEA,QAFF,CAGEP,KAHF,mBAGEA,KAHF,CAIED,QAJF,mBAIEA,QAJF,CAKES,WALF,mBAKEA,WALF,CAMEC,aANF,mBAMEA,aANF,CAOEC,qBAPF,mBAOEA,qBAPF,CAQEf,UARF,mBAQEA,UARF,CASEgB,UATF,mBASEA,UATF,CAUKC,IAVL,2EAaA,IAAMC,YAAiC,GAAG,EAA1C,CAEA,oBACE,6BAAC,aAAD,CAAe,QAAf,QACG,gBAAsC,KAAnC7B,iBAAmC,QAAnCA,iBAAmC,CAAhBC,SAAgB,QAAhBA,SAAgB,CACrC,IAAI6B,kBAAkB,GAAG,EAAE9B,iBAAiB,EAAjBA,iBAAF,EAAqBC,SAAS,EAATA,SAArB,EAAzB,CAEA,IAAIuB,WAAJ,EAAiB,CACf,IAAMO,SAAS,GAAG,MAAI,CAACC,UAAL,CAAgBhC,iBAAhB,EAAmCC,SAAnC,CAAlB,CACA4B,YAAY,CAACrB,MAAb,GAAsBuB,SAAtB,CAEAD,kBAAkB,GAAGL,aAAa,GAC9B,EAAEzB,iBAAiB,EAAjBA,iBAAF,EAAqBC,SAAS,EAAE8B,SAAhC,EAD8B,GAE9B,EAAE/B,iBAAiB,EAAE+B,SAArB,EAAgC9B,SAAS,EAAEgC,MAAM,CAACC,QAAP,CAAgBjC,SAAhB,IAA6B8B,SAA7B,GAAyC7B,QAApF,EAFJ,CAIA,IAAIwB,qBAAJ,EAA2B,CACzB,6BAAUS,0BAAV,KAA2B,eAAeA,2BAAaC,QAAb,CAAsBC,IAAtB,CAA2Bf,KAArE,GACKO,YAAY,CAACS,SAAb,GAAyB,SAD9B,GAEKT,YAAY,CAACU,SAAb,GAAyB,WAF9B,CAGD,CACF,CAED,IAAMC,KAAK,GAAG,CAACb,UAAD,GACZJ,QADY,gBAGZ,6DAAK,KAAK,6BAAOD,KAAP,EAAiBO,YAAjB,CAAV,EAA2C,GAAG,EAAE,MAAI,CAAClB,UAArD,IAAqEiB,IAArE,GACGL,QADH,CAHF,CAQA,oBAAO,6BAAC,aAAD,CAAe,QAAf,IAAwB,KAAK,EAAEO,kBAA/B,IAAoDU,KAApD,CAAP,CACD,CA5BH,CADF,CAgCD,C,QAQOR,U,GAAR,oBAAmBhC,iBAAnB,EAA8CC,SAA9C,EAAiE,CAC/D,IAAI8B,SAAS,GAAG,KAAKxB,KAAL,CAAWC,MAA3B,CAEA,IAAIyB,MAAM,CAACC,QAAP,CAAgBjC,SAAhB,CAAJ,EAAgC,CAC9B,IAAMwC,2BAA2B,GAAGxC,SAAS,GAAGD,iBAAhD,CACA,IAAM0C,KAAK,GAAGC,6BAAcF,2BAA5B,CACAV,SAAS,GAAGa,IAAI,CAACC,IAAL,CAAUd,SAAS,GAAGW,KAAtB,CAAZ,CACD,CAEDX,SAAS,IAAI/B,iBAAb,CAEA,OAAO+B,SAAP,CACD,C,iBArHyBjC,eAAMgD,S,WAClBC,mB,GAAsB,Q,UACtB5C,W,GAAc,Q,UAEdO,Y,GAA6B,EACzCM,KAAK,EAAE,EADkC,EAEzCD,QAAQ,EAAE,CAF+B,EAGzCO,KAAK,EAAE,EAHkC,EAIzCE,WAAW,EAAE,IAJ4B,EAKzCC,aAAa,EAAE,KAL0B,EAMzCC,qBAAqB,EAAE,KANkB,EAOzCC,UAAU,EAAE,IAP6B,E,UAgB7BqB,S,GAAY,EACxBhC,KADwB,iBAClBV,KADkB,EACE,CACxB,IAAI,CAACA,KAAK,CAACU,KAAN,IAAeZ,OAAM,CAACM,YAAP,CAAoBM,KAApC,KAA8C,CAAlD,EAAqD,CACnD,OAAO,IAAIiC,KAAJ,8DAAqE3C,KAAK,CAACU,KAA3E,CAAP,CACD,CACD,IAAI4B,IAAI,CAACM,KAAL,CAAW5C,KAAK,CAACU,KAAN,IAAeZ,OAAM,CAACM,YAAP,CAAoBM,KAA9C,MAAyDV,KAAK,CAACU,KAAnE,EAA0E,CACxE,OAAO,IAAIiC,KAAJ,uDAA8D3C,KAAK,CAACU,KAApE,CAAP,CACD,CACF,CARuB,E","sourcesContent":["import React from 'react';\nimport { globalObject, isBrowser } from '@skbkontur/global-object';\n\nimport { callChildRef } from '../../lib/callChildRef/callChildRef';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nimport { incrementZIndex, removeZIndex, upperBorder, LayerComponentName } from './ZIndexStorage';\n\nconst ZIndexContext = React.createContext({ parentLayerZIndex: 0, maxZIndex: Infinity });\n\nZIndexContext.displayName = 'ZIndexContext';\n\nexport interface ZIndexProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Приращение к z-index\n   */\n  delta?: number;\n  priority?: number | LayerComponentName;\n  style?: React.CSSProperties;\n  createStackingContext?: boolean;\n  coverChildren?: boolean;\n  applyZIndex?: boolean;\n  className?: string;\n  wrapperRef?: React.Ref<HTMLDivElement> | undefined | null;\n\n  /**\n   * Явно указывает, что вложенные элементы должны быть обёрнуты в `<div/>`.\n   * Для случаев, когда необходимо задать **только** контекст для области.\n   *\n   * @default true\n   */\n  useWrapper?: boolean;\n}\n\ntype DefaultProps = Required<\n  Pick<\n    ZIndexProps,\n    'delta' | 'priority' | 'style' | 'applyZIndex' | 'coverChildren' | 'createStackingContext' | 'useWrapper'\n  >\n>;\n\ninterface ZIndexState {\n  zIndex: number;\n}\n\n@rootNode\nexport class ZIndex extends React.Component<ZIndexProps, ZIndexState> {\n  public static __KONTUR_REACT_UI__ = 'ZIndex';\n  public static displayName = 'ZIndex';\n\n  public static defaultProps: DefaultProps = {\n    delta: 10,\n    priority: 0,\n    style: {},\n    applyZIndex: true,\n    coverChildren: false,\n    createStackingContext: false,\n    useWrapper: true,\n  };\n\n  public state = {\n    zIndex: 0,\n  };\n\n  private getProps = createPropsGetter(ZIndex.defaultProps);\n\n  public static propTypes = {\n    delta(props: ZIndexProps) {\n      if ((props.delta || ZIndex.defaultProps.delta) <= 0) {\n        return new Error(`[ZIndex]: Prop 'delta' must be greater than 0, received ${props.delta}`);\n      }\n      if (Math.trunc(props.delta || ZIndex.defaultProps.delta) !== props.delta) {\n        return new Error(`[ZIndex]: Prop 'delta' must be integer, received ${props.delta}`);\n      }\n    },\n  };\n\n  private setRootNode!: TSetRootNode;\n\n  constructor(props: ZIndexProps) {\n    super(props);\n    this.state.zIndex = this.increment();\n  }\n\n  public componentDidUpdate(prevProps: Readonly<ZIndexProps>) {\n    if (prevProps.priority !== this.props.priority || prevProps.delta !== this.props.delta) {\n      removeZIndex(this.state.zIndex);\n      this.setState({ zIndex: this.increment() });\n    }\n  }\n\n  public componentWillUnmount() {\n    removeZIndex(this.state.zIndex);\n  }\n\n  public render() {\n    const {\n      style,\n      children,\n      delta,\n      priority,\n      applyZIndex,\n      coverChildren,\n      createStackingContext,\n      wrapperRef,\n      useWrapper,\n      ...rest\n    } = this.getProps();\n\n    const wrapperStyle: React.CSSProperties = {};\n\n    return (\n      <ZIndexContext.Consumer>\n        {({ parentLayerZIndex, maxZIndex }) => {\n          let zIndexContextValue = { parentLayerZIndex, maxZIndex };\n\n          if (applyZIndex) {\n            const newZIndex = this.calcZIndex(parentLayerZIndex, maxZIndex);\n            wrapperStyle.zIndex = newZIndex;\n\n            zIndexContextValue = coverChildren\n              ? { parentLayerZIndex, maxZIndex: newZIndex }\n              : { parentLayerZIndex: newZIndex, maxZIndex: Number.isFinite(maxZIndex) ? newZIndex : Infinity };\n\n            if (createStackingContext) {\n              isBrowser(globalObject) && 'isolation' in globalObject.document.body.style\n                ? (wrapperStyle.isolation = 'isolate')\n                : (wrapperStyle.transform = 'rotate(0)');\n            }\n          }\n\n          const child = !useWrapper ? (\n            children\n          ) : (\n            <div style={{ ...style, ...wrapperStyle }} ref={this.wrapperRef} {...rest}>\n              {children}\n            </div>\n          );\n\n          return <ZIndexContext.Provider value={zIndexContextValue}>{child}</ZIndexContext.Provider>;\n        }}\n      </ZIndexContext.Consumer>\n    );\n  }\n\n  private wrapperRef = (element: HTMLDivElement | null) => {\n    const { wrapperRef } = this.props;\n    this.setRootNode(element);\n    wrapperRef && callChildRef(wrapperRef, element);\n  };\n\n  private calcZIndex(parentLayerZIndex: number, maxZIndex: number) {\n    let newZIndex = this.state.zIndex;\n\n    if (Number.isFinite(maxZIndex)) {\n      const allowedValuesIntervalLength = maxZIndex - parentLayerZIndex;\n      const scale = upperBorder / allowedValuesIntervalLength;\n      newZIndex = Math.ceil(newZIndex / scale);\n    }\n\n    newZIndex += parentLayerZIndex;\n\n    return newZIndex;\n  }\n\n  private increment = () => {\n    const { priority, delta } = this.getProps();\n\n    return incrementZIndex(priority, delta);\n  };\n}\n"]}
+{"version":3,"sources":["ZIndex.tsx"],"names":["DEFAULT_ZINDEX_CONTEXT","parentLayerZIndex","maxZIndex","Infinity","ZIndexContext","React","createContext","displayName","ZIndex","rootNode","props","state","zIndex","savedZIndexContext","getProps","defaultProps","zIndexContext","wrapperRef","element","setRootNode","tryGetContextByDOM","increment","priority","delta","portal","parentElement","closest","PORTAL_OUTLET_ATTR","globalObject","HTMLElement","portalID","getAttribute","noscript","document","querySelector","PORTAL_INLET_ATTR","parent","newZIndex","Number","style","dataset","tid","LoaderDataTids","veil","calcZIndex","setState","componentDidUpdate","prevProps","componentWillUnmount","render","children","applyZIndex","coverChildren","createStackingContext","useWrapper","rest","wrapperStyle","context","zIndexContextValue","isFinite","body","isolation","transform","child","allowedValuesIntervalLength","scale","upperBorder","Math","ceil","Component","__KONTUR_REACT_UI__","propTypes","Error","trunc"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { globalObject, isBrowser } from '@skbkontur/global-object';\n\nimport { callChildRef } from '../../lib/callChildRef/callChildRef';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isInstanceOf } from '../../lib/isInstanceOf';\nimport { LoaderDataTids } from '../../components/Loader';\nimport { PORTAL_INLET_ATTR, PORTAL_OUTLET_ATTR } from '../RenderContainer';\n\nimport { incrementZIndex, removeZIndex, upperBorder, LayerComponentName } from './ZIndexStorage';\n\nconst DEFAULT_ZINDEX_CONTEXT = { parentLayerZIndex: 0, maxZIndex: Infinity };\n\nconst ZIndexContext = React.createContext(DEFAULT_ZINDEX_CONTEXT);\n\nZIndexContext.displayName = 'ZIndexContext';\n\nexport interface ZIndexProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Приращение к z-index\n   */\n  delta?: number;\n  priority?: number | LayerComponentName;\n  style?: React.CSSProperties;\n  createStackingContext?: boolean;\n  coverChildren?: boolean;\n  applyZIndex?: boolean;\n  className?: string;\n  wrapperRef?: React.Ref<HTMLDivElement> | undefined | null;\n\n  /**\n   * Явно указывает, что вложенные элементы должны быть обёрнуты в `<div/>`.\n   * Для случаев, когда необходимо задать **только** контекст для области.\n   *\n   * @default true\n   */\n  useWrapper?: boolean;\n}\n\ntype DefaultProps = Required<\n  Pick<\n    ZIndexProps,\n    'delta' | 'priority' | 'style' | 'applyZIndex' | 'coverChildren' | 'createStackingContext' | 'useWrapper'\n  >\n>;\n\ninterface ZIndexState {\n  zIndex: number;\n  savedZIndexContext: { parentLayerZIndex: number; maxZIndex: number } | null;\n}\n\n@rootNode\nexport class ZIndex extends React.Component<ZIndexProps, ZIndexState> {\n  public static __KONTUR_REACT_UI__ = 'ZIndex';\n  public static displayName = 'ZIndex';\n\n  public static defaultProps: DefaultProps = {\n    delta: 10,\n    priority: 0,\n    style: {},\n    applyZIndex: true,\n    coverChildren: false,\n    createStackingContext: false,\n    useWrapper: true,\n  };\n\n  public state: ZIndexState = {\n    zIndex: 0,\n    savedZIndexContext: null,\n  };\n\n  private getProps = createPropsGetter(ZIndex.defaultProps);\n\n  public static propTypes = {\n    delta(props: ZIndexProps) {\n      if ((props.delta || ZIndex.defaultProps.delta) <= 0) {\n        return new Error(`[ZIndex]: Prop 'delta' must be greater than 0, received ${props.delta}`);\n      }\n      if (Math.trunc(props.delta || ZIndex.defaultProps.delta) !== props.delta) {\n        return new Error(`[ZIndex]: Prop 'delta' must be integer, received ${props.delta}`);\n      }\n    },\n  };\n\n  private setRootNode!: TSetRootNode;\n  private zIndexContext: { parentLayerZIndex: number; maxZIndex: number } | null = null;\n\n  constructor(props: ZIndexProps) {\n    super(props);\n    this.state.zIndex = this.increment();\n  }\n\n  public componentDidUpdate(prevProps: Readonly<ZIndexProps>) {\n    if (prevProps.priority !== this.props.priority || prevProps.delta !== this.props.delta) {\n      removeZIndex(this.state.zIndex);\n      this.setState({ zIndex: this.increment() });\n    }\n  }\n\n  public componentWillUnmount() {\n    removeZIndex(this.state.zIndex);\n  }\n\n  public render() {\n    const {\n      style,\n      children,\n      delta,\n      priority,\n      applyZIndex,\n      coverChildren,\n      createStackingContext,\n      wrapperRef,\n      useWrapper,\n      ...rest\n    } = this.getProps();\n\n    const wrapperStyle: React.CSSProperties = {};\n\n    return (\n      <ZIndexContext.Consumer>\n        {(context) => {\n          this.zIndexContext = context;\n          const { parentLayerZIndex, maxZIndex } = this.state.savedZIndexContext || context;\n          let zIndexContextValue = { parentLayerZIndex, maxZIndex };\n          let newZIndex = 0;\n          if (applyZIndex) {\n            newZIndex = this.calcZIndex(parentLayerZIndex, maxZIndex);\n            wrapperStyle.zIndex = newZIndex;\n\n            zIndexContextValue = coverChildren\n              ? { parentLayerZIndex, maxZIndex: newZIndex }\n              : { parentLayerZIndex: newZIndex, maxZIndex: Number.isFinite(maxZIndex) ? newZIndex : Infinity };\n\n            if (createStackingContext) {\n              isBrowser(globalObject) && 'isolation' in globalObject.document.body.style\n                ? (wrapperStyle.isolation = 'isolate')\n                : (wrapperStyle.transform = 'rotate(0)');\n            }\n          }\n\n          const child = !useWrapper ? (\n            children\n          ) : (\n            <div style={{ ...style, ...wrapperStyle }} ref={this.wrapperRef} {...rest}>\n              {children}\n            </div>\n          );\n\n          return <ZIndexContext.Provider value={zIndexContextValue}>{child}</ZIndexContext.Provider>;\n        }}\n      </ZIndexContext.Consumer>\n    );\n  }\n\n  private wrapperRef = (element: HTMLDivElement | null) => {\n    const { wrapperRef } = this.props;\n    this.setRootNode(element);\n    wrapperRef && callChildRef(wrapperRef, element);\n    element && this.tryGetContextByDOM(element);\n  };\n\n  private calcZIndex(parentLayerZIndex: number, maxZIndex: number) {\n    let newZIndex = this.state.zIndex;\n\n    if (Number.isFinite(maxZIndex)) {\n      const allowedValuesIntervalLength = maxZIndex - parentLayerZIndex;\n      const scale = upperBorder / allowedValuesIntervalLength;\n      newZIndex = Math.ceil(newZIndex / scale);\n    }\n\n    newZIndex += parentLayerZIndex;\n\n    return newZIndex;\n  }\n\n  private increment = () => {\n    const { priority, delta } = this.getProps();\n\n    return incrementZIndex(priority, delta);\n  };\n\n  private tryGetContextByDOM = (element: HTMLDivElement) => {\n    if (DEFAULT_ZINDEX_CONTEXT === this.zIndexContext && this.state.savedZIndexContext === null) {\n      let savedZIndexContext = DEFAULT_ZINDEX_CONTEXT;\n      const portal = element.parentElement?.closest(`[${PORTAL_OUTLET_ATTR}]`);\n\n      if (isInstanceOf(portal, globalObject.HTMLElement)) {\n        const portalID = portal.getAttribute(PORTAL_OUTLET_ATTR);\n        const noscript = document.querySelector(`noscript[${PORTAL_INLET_ATTR}=\"${portalID}\"]`);\n        const parent = noscript?.parentElement?.closest('[style*=z-index]');\n\n        if (isInstanceOf(parent, globalObject.HTMLElement)) {\n          const newZIndex = Number(parent.style.zIndex || 0);\n\n          let maxZIndex = Infinity;\n\n          if (parent.parentElement?.dataset.tid === LoaderDataTids.veil) {\n            maxZIndex = this.calcZIndex(newZIndex, maxZIndex);\n          }\n\n          savedZIndexContext = { maxZIndex, parentLayerZIndex: newZIndex };\n        }\n      }\n\n      this.setState({ savedZIndexContext });\n    }\n  };\n}\n"]}

package/cjs/internal/themes/DarkTheme.d.ts

@@ -138,6 +138,8 @@ export declare class DarkTheme extends DarkTheme_base {
     static fileUploaderDisabledTextColor: string;
     static fileUploaderDisabledLinkColor: string;
     static fileUploaderDisabledIconColor: string;
+    static validationsTextColorError: string;
+    static validationsTextColorWarning: string;
 }
 export declare const DarkThemeInternal: typeof DarkTheme;
 export {};

package/cjs/internal/themes/DarkTheme.js

@@ -238,10 +238,15 @@ DarkTheme = /*#__PURE__*/function (_ref) {(0, _inheritsLoose2.default)(DarkTheme
 
 
 
+
+
+
+
+
 
 
     //#endregion
-  }]);return DarkTheme;}( /*#__PURE__*/function () {function _class() {}return _class;}());exports.DarkTheme = DarkTheme;DarkTheme.grayXLight = '#313131';DarkTheme.gray = 'rgba(255, 255, 255, 0.48)';DarkTheme.grayDark = '#e1e1e1';DarkTheme.green = '#5f9c20';DarkTheme.greenDark = '#538a1b';DarkTheme.red = '#ee5042';DarkTheme.redDark = '#dd473b';DarkTheme.yellowXxLight = '#ffe0c3';DarkTheme.yellow = '#ffa236';DarkTheme.yellowDark = '#ea7324';DarkTheme.warningMain = '#ffa236';DarkTheme.errorMain = '#ee5042';DarkTheme.errorText = '#ffa236';DarkTheme.borderColorFocusLight = '#1260ae';DarkTheme.borderColorGrayLight = 'rgba(255, 255, 255, 0.16)';DarkTheme.borderColorDisabled = 'rgba(255, 255, 255, 0.16)';DarkTheme.placeholderColor = 'rgba(255, 255, 255, 0.32)';DarkTheme.placeholderColorLight = 'rgba(255, 255, 255, 0.16)';DarkTheme.textColorDefault = 'rgba(255, 255, 255, 0.865)';DarkTheme.textColorDisabled = 'rgba(255, 255, 255, 0.32)';DarkTheme.textColorDisabledContrast = 'rgba(255, 255, 255, 0.48)';DarkTheme.textColorInvert = 'rgba(255, 255, 255, 0.865)';DarkTheme.bgDisabled = '#434343';DarkTheme.bgDefault = '#1f1f1f';DarkTheme.bgSecondary = '#333333';DarkTheme.outlineColorFocus = '#1f1f1f';DarkTheme.linkColor = '#51adff';DarkTheme.linkHoverColor = '#2291ff';DarkTheme.linkActiveColor = '#1f87ef';DarkTheme.linkSuccessColor = '#78bf2b';DarkTheme.linkSuccessHoverColor = '#6cad26';DarkTheme.linkSuccessActiveColor = '#5f9c20';DarkTheme.linkDangerColor = '#ff887b';DarkTheme.linkDangerHoverColor = '#ff5a49';DarkTheme.linkDangerActiveColor = '#ee5042';DarkTheme.fixedPanelShadow = '0px 0px 16px 1px rgba(0, 0, 0, 0.4)';DarkTheme.linkFocusOutlineColor = 'transparent';DarkTheme.btnInsetColor = '#1f1f1f';DarkTheme.btnDefaultBg = '#282828';DarkTheme.btnDefaultHoverBg = 'none';DarkTheme.btnDefaultActiveBg = '#1a1a1a';DarkTheme.btnSuccessBg = '#5f9c20';DarkTheme.btnSuccessBorderColor = '#5f9c20';DarkTheme.btnSuccessActiveBg = '#3a6710';DarkTheme.btnSuccessActiveBorderColor = '#3a6710';DarkTheme.btnPrimaryBg = '#1f87ef';DarkTheme.btnPrimaryBorderColor = '#1f87ef';DarkTheme.btnPrimaryActiveBg = '#1261ae';DarkTheme.btnPrimaryActiveBorderColor = '#1261ae';DarkTheme.btnDangerBg = '#ee5042';DarkTheme.btnDangerBorderColor = '#ee5042';DarkTheme.btnDangerActiveBg = '#a92a27';DarkTheme.btnDangerActiveBorderColor = '#a92a27';DarkTheme.btnPayBg = '#ffa236';DarkTheme.btnPayHoverBg = '#ff8227';DarkTheme.btnPayHoverBorderColor = '#ff8227';DarkTheme.btnPayTextColor = '#222222';DarkTheme.btnPayActiveBg = '#d46421';DarkTheme.btnPayActiveBorderColor = '#d46421';DarkTheme.btnPayBorderColor = '#ffa236';DarkTheme.tooltipCloseBtnColor = 'rgba(255, 255, 255, 0.32)';DarkTheme.tooltipCloseBtnHoverColor = 'rgba(255, 255, 255, 0.865)';DarkTheme.tooltipBg = '#333333';DarkTheme.modalBackBg = 'rgba(255, 255, 255, 0.865)';DarkTheme.modalCloseButtonColor = 'rgba(255, 255, 255, 0.32)';DarkTheme.modalCloseButtonHoverColor = 'rgba(255, 255, 255, 0.865)';DarkTheme.modalFooterBg = '#434343';DarkTheme.sidePageFooterPanelBg = ' #434343';DarkTheme.sidePageBackingBg = 'rgba(255, 255, 255, 0.865)';DarkTheme.sidePageCloseButtonColor = 'rgba(255, 255, 255, 0.32)';DarkTheme.sidePageCloseButtonHoverColor = 'rgba(255, 255, 255, 0.865)';DarkTheme.calendarCellWeekendColor = '#ff887b';DarkTheme.calendarCellTodayBorder = '1px solid rgba(255, 255, 255, 0.48)';DarkTheme.calendarCellSelectedBgColor = 'rgba(255, 255, 255, 0.16)';DarkTheme.calendarMonthTitleBorderBottomColor = 'rgba(255, 255, 255, 0.08)';DarkTheme.pagingPageLinkHoverBg = 'rgba(255, 255, 255, 0.8)';DarkTheme.pagingPageLinkActiveBg = 'rgba(255, 255, 255, 0.16)';DarkTheme.pagingPageLinkDisabledActiveBg = 'rgba(255, 255, 255, 0.08)';DarkTheme.toastLinkColor = '#51adff';DarkTheme.toastCloseColor = 'rgba(255, 255, 255, 0.6)';DarkTheme.menuItemCommentColor = 'rgba(255, 255, 255, 0.48)';DarkTheme.menuSeparatorBorderColor = 'rgba(255, 255, 255, 0.08)';DarkTheme.toggleBorderColor = 'rgba(255, 255, 255, 0.32)';DarkTheme.toggleDisabledHandleBg = '#525252';DarkTheme.toggleBaseBg = 'rgba(255, 255, 255, 0.04)';DarkTheme.toggleBgDisabledChecked = 'rgba(255, 255, 255, 0.48)';DarkTheme.inputBg = 'rgba(255, 255, 255, 0.04)';DarkTheme.inputColorScheme = 'dark';DarkTheme.dateSelectMenuItemBgSelected = 'rgba(255, 255, 255, 0.08)';DarkTheme.pickerTodayWrapperBorderTop = '1px solid rgba(255, 255, 255, 0.08)';DarkTheme.dateInputComponentSelectedBgColor = '#1c7edf';DarkTheme.hintBgColor = 'rgba(67, 67, 67, 0.92)';DarkTheme.loaderBg = 'rgba(51, 51, 51, 0.8)';DarkTheme.dropdownMenuSelectedBg = 'rgba(255, 255, 255, 0.08)';DarkTheme.textareaBg = '#1f1f1f';DarkTheme.passwordInputVisibilityIconOpacity = '1';DarkTheme.radioBgColor = 'rgba(255, 255, 255, 0.04)';DarkTheme.radioBorderColor = 'rgba(255, 255, 255, 0.32)';DarkTheme.checkboxBg = 'rgba(255, 255, 255, 0.04)';DarkTheme.tokenShadowDisabled = 'none';DarkTheme.switcherButtonCheckedDisabledShadow = 'none';DarkTheme.fileUploaderBg = 'rgba(255, 255, 255, 0.04)';DarkTheme.fileUploaderTextColorDefault = '#fff';DarkTheme.fileUploaderBorderColor = 'rgba(255, 255, 255, 0.32)';DarkTheme.fileUploaderBorderColorFocus = '#1f87ef';DarkTheme.fileUploaderLinkColor = '#51adff';DarkTheme.fileUploaderIconColor = 'rgba(255, 255, 255, 0.48)';DarkTheme.fileUploaderIconHoverColor = 'rgba(255, 255, 255, 0.80)';DarkTheme.fileUploaderBorderColorError = '#ee5042';DarkTheme.fileUploaderBorderColorWarning = '#ffa236';DarkTheme.fileUploaderDisabledBg = 'rgba(255, 255, 255, 0.16)';DarkTheme.fileUploaderDisabledBorderColor = 'rgba(255, 255, 255, 0.32)';DarkTheme.fileUploaderDisabledTextColor = 'rgba(255, 255, 255, 0.32)';DarkTheme.fileUploaderDisabledLinkColor = 'rgba(255, 255, 255, 0.32)';DarkTheme.fileUploaderDisabledIconColor = 'rgba(255, 255, 255, 0.32)';
+  }]);return DarkTheme;}( /*#__PURE__*/function () {function _class() {}return _class;}());exports.DarkTheme = DarkTheme;DarkTheme.grayXLight = '#313131';DarkTheme.gray = 'rgba(255, 255, 255, 0.48)';DarkTheme.grayDark = '#e1e1e1';DarkTheme.green = '#5f9c20';DarkTheme.greenDark = '#538a1b';DarkTheme.red = '#ee5042';DarkTheme.redDark = '#dd473b';DarkTheme.yellowXxLight = '#ffe0c3';DarkTheme.yellow = '#ffa236';DarkTheme.yellowDark = '#ea7324';DarkTheme.warningMain = '#ffa236';DarkTheme.errorMain = '#ee5042';DarkTheme.errorText = '#ffa236';DarkTheme.borderColorFocusLight = '#1260ae';DarkTheme.borderColorGrayLight = 'rgba(255, 255, 255, 0.16)';DarkTheme.borderColorDisabled = 'rgba(255, 255, 255, 0.16)';DarkTheme.placeholderColor = 'rgba(255, 255, 255, 0.32)';DarkTheme.placeholderColorLight = 'rgba(255, 255, 255, 0.16)';DarkTheme.textColorDefault = 'rgba(255, 255, 255, 0.865)';DarkTheme.textColorDisabled = 'rgba(255, 255, 255, 0.32)';DarkTheme.textColorDisabledContrast = 'rgba(255, 255, 255, 0.48)';DarkTheme.textColorInvert = 'rgba(255, 255, 255, 0.865)';DarkTheme.bgDisabled = '#434343';DarkTheme.bgDefault = '#1f1f1f';DarkTheme.bgSecondary = '#333333';DarkTheme.outlineColorFocus = '#1f1f1f';DarkTheme.linkColor = '#51adff';DarkTheme.linkHoverColor = '#2291ff';DarkTheme.linkActiveColor = '#1f87ef';DarkTheme.linkSuccessColor = '#78bf2b';DarkTheme.linkSuccessHoverColor = '#6cad26';DarkTheme.linkSuccessActiveColor = '#5f9c20';DarkTheme.linkDangerColor = '#ff887b';DarkTheme.linkDangerHoverColor = '#ff5a49';DarkTheme.linkDangerActiveColor = '#ee5042';DarkTheme.fixedPanelShadow = '0px 0px 16px 1px rgba(0, 0, 0, 0.4)';DarkTheme.linkFocusOutlineColor = 'transparent';DarkTheme.btnInsetColor = '#1f1f1f';DarkTheme.btnDefaultBg = '#282828';DarkTheme.btnDefaultHoverBg = 'none';DarkTheme.btnDefaultActiveBg = '#1a1a1a';DarkTheme.btnSuccessBg = '#5f9c20';DarkTheme.btnSuccessBorderColor = '#5f9c20';DarkTheme.btnSuccessActiveBg = '#3a6710';DarkTheme.btnSuccessActiveBorderColor = '#3a6710';DarkTheme.btnPrimaryBg = '#1f87ef';DarkTheme.btnPrimaryBorderColor = '#1f87ef';DarkTheme.btnPrimaryActiveBg = '#1261ae';DarkTheme.btnPrimaryActiveBorderColor = '#1261ae';DarkTheme.btnDangerBg = '#ee5042';DarkTheme.btnDangerBorderColor = '#ee5042';DarkTheme.btnDangerActiveBg = '#a92a27';DarkTheme.btnDangerActiveBorderColor = '#a92a27';DarkTheme.btnPayBg = '#ffa236';DarkTheme.btnPayHoverBg = '#ff8227';DarkTheme.btnPayHoverBorderColor = '#ff8227';DarkTheme.btnPayTextColor = '#222222';DarkTheme.btnPayActiveBg = '#d46421';DarkTheme.btnPayActiveBorderColor = '#d46421';DarkTheme.btnPayBorderColor = '#ffa236';DarkTheme.tooltipCloseBtnColor = 'rgba(255, 255, 255, 0.32)';DarkTheme.tooltipCloseBtnHoverColor = 'rgba(255, 255, 255, 0.865)';DarkTheme.tooltipBg = '#333333';DarkTheme.modalBackBg = 'rgba(255, 255, 255, 0.865)';DarkTheme.modalCloseButtonColor = 'rgba(255, 255, 255, 0.32)';DarkTheme.modalCloseButtonHoverColor = 'rgba(255, 255, 255, 0.865)';DarkTheme.modalFooterBg = '#434343';DarkTheme.sidePageFooterPanelBg = ' #434343';DarkTheme.sidePageBackingBg = 'rgba(255, 255, 255, 0.865)';DarkTheme.sidePageCloseButtonColor = 'rgba(255, 255, 255, 0.32)';DarkTheme.sidePageCloseButtonHoverColor = 'rgba(255, 255, 255, 0.865)';DarkTheme.calendarCellWeekendColor = '#ff887b';DarkTheme.calendarCellTodayBorder = '1px solid rgba(255, 255, 255, 0.48)';DarkTheme.calendarCellSelectedBgColor = 'rgba(255, 255, 255, 0.16)';DarkTheme.calendarMonthTitleBorderBottomColor = 'rgba(255, 255, 255, 0.08)';DarkTheme.pagingPageLinkHoverBg = 'rgba(255, 255, 255, 0.8)';DarkTheme.pagingPageLinkActiveBg = 'rgba(255, 255, 255, 0.16)';DarkTheme.pagingPageLinkDisabledActiveBg = 'rgba(255, 255, 255, 0.08)';DarkTheme.toastLinkColor = '#51adff';DarkTheme.toastCloseColor = 'rgba(255, 255, 255, 0.6)';DarkTheme.menuItemCommentColor = 'rgba(255, 255, 255, 0.48)';DarkTheme.menuSeparatorBorderColor = 'rgba(255, 255, 255, 0.08)';DarkTheme.toggleBorderColor = 'rgba(255, 255, 255, 0.32)';DarkTheme.toggleDisabledHandleBg = '#525252';DarkTheme.toggleBaseBg = 'rgba(255, 255, 255, 0.04)';DarkTheme.toggleBgDisabledChecked = 'rgba(255, 255, 255, 0.48)';DarkTheme.inputBg = 'rgba(255, 255, 255, 0.04)';DarkTheme.inputColorScheme = 'dark';DarkTheme.dateSelectMenuItemBgSelected = 'rgba(255, 255, 255, 0.08)';DarkTheme.pickerTodayWrapperBorderTop = '1px solid rgba(255, 255, 255, 0.08)';DarkTheme.dateInputComponentSelectedBgColor = '#1c7edf';DarkTheme.hintBgColor = 'rgba(67, 67, 67, 0.92)';DarkTheme.loaderBg = 'rgba(51, 51, 51, 0.8)';DarkTheme.dropdownMenuSelectedBg = 'rgba(255, 255, 255, 0.08)';DarkTheme.textareaBg = '#1f1f1f';DarkTheme.passwordInputVisibilityIconOpacity = '1';DarkTheme.radioBgColor = 'rgba(255, 255, 255, 0.04)';DarkTheme.radioBorderColor = 'rgba(255, 255, 255, 0.32)';DarkTheme.checkboxBg = 'rgba(255, 255, 255, 0.04)';DarkTheme.tokenShadowDisabled = 'none';DarkTheme.switcherButtonCheckedDisabledShadow = 'none';DarkTheme.fileUploaderBg = 'rgba(255, 255, 255, 0.04)';DarkTheme.fileUploaderTextColorDefault = '#fff';DarkTheme.fileUploaderBorderColor = 'rgba(255, 255, 255, 0.32)';DarkTheme.fileUploaderBorderColorFocus = '#1f87ef';DarkTheme.fileUploaderLinkColor = '#51adff';DarkTheme.fileUploaderIconColor = 'rgba(255, 255, 255, 0.48)';DarkTheme.fileUploaderIconHoverColor = 'rgba(255, 255, 255, 0.80)';DarkTheme.fileUploaderBorderColorError = '#ee5042';DarkTheme.fileUploaderBorderColorWarning = '#ffa236';DarkTheme.fileUploaderDisabledBg = 'rgba(255, 255, 255, 0.16)';DarkTheme.fileUploaderDisabledBorderColor = 'rgba(255, 255, 255, 0.32)';DarkTheme.fileUploaderDisabledTextColor = 'rgba(255, 255, 255, 0.32)';DarkTheme.fileUploaderDisabledLinkColor = 'rgba(255, 255, 255, 0.32)';DarkTheme.fileUploaderDisabledIconColor = 'rgba(255, 255, 255, 0.32)';DarkTheme.validationsTextColorError = '#ff887b';DarkTheme.validationsTextColorWarning = '#fdd481';
 
 var DarkThemeInternal = Object.setPrototypeOf(
 (0, _ThemeHelpers.exposeGetters)(DarkTheme),