@vkontakte/vkui 4.33.3 → 4.34.1

package/src/testing/utils.tsx

@@ -5,6 +5,7 @@ import { AdaptivityProps } from "../components/AdaptivityProvider/AdaptivityCont
 import { ImgOnlyAttributes } from "../lib/utils";
 import { ScrollContext } from "../components/AppRoot/ScrollContext";
 import { act } from "react-dom/test-utils";
+import { HasChildren } from "../types";
 
 export function fakeTimers() {
   beforeEach(() => jest.useFakeTimers());
@@ -115,10 +116,7 @@ export function baselineComponent<Props extends BasicProps>(
 }
 
 type RectOptions = { x?: number; y?: number; w?: number; h?: number };
-export function mockRect(
-  el: HTMLElement | ({} & any),
-  { x = 0, y = 0, w = 0, h = 0 }: RectOptions
-) {
+export function mockRect(el: any, { x = 0, y = 0, w = 0, h = 0 }: RectOptions) {
   if (!el) {
     return;
   }
@@ -139,7 +137,7 @@ export function mockRect(
 
 export const mockScrollContext = (
   getY: () => number
-): [React.FC, jest.Mock] => {
+): [React.ComponentType<HasChildren>, jest.Mock] => {
   const getScroll = () => ({ x: 0, y: getY() });
   const scrollTo = jest.fn();
   const isScrollLock = false;

package/src/tokenized/index.ts

@@ -10,12 +10,24 @@ export type { FormLayoutGroupProps } from "../components/FormLayoutGroup/FormLay
 export { Button } from "../components/Button/Button";
 export type { ButtonProps } from "../components/Button/Button";
 
+export { MiniInfoCell } from "../components/MiniInfoCell/MiniInfoCell";
+export type { MiniInfoCellProps } from "../components/MiniInfoCell/MiniInfoCell";
+
+export { Gradient } from "../components/Gradient/Gradient";
+export type { GradientProps } from "../components/Gradient/Gradient";
+
 export { Card } from "../components/Card/Card";
 export type { CardProps } from "../components/Card/Card";
 
 export { CardScroll } from "../components/CardScroll/CardScroll";
 export type { CardScrollProps } from "../components/CardScroll/CardScroll";
 
+export { Group } from "../components/Group/Group";
+export type { GroupProps } from "../components/Group/Group";
+
+export { Cell } from "../components/Cell/Cell";
+export type { CellProps } from "../components/Cell/Cell";
+
 export { GridAvatar } from "../components/GridAvatar/GridAvatar";
 export type { GridAvatarProps } from "../components/GridAvatar/GridAvatar";
 
@@ -31,6 +43,15 @@ export type { InitialsAvatarProps } from "../components/InitialsAvatar/InitialsA
 export { InfoRow } from "../components/InfoRow/InfoRow";
 export type { InfoRowProps } from "../components/InfoRow/InfoRow";
 
+export { ModalCardBase } from "../components/ModalCardBase/ModalCardBase";
+export type { ModalCardBaseProps } from "../components/ModalCardBase/ModalCardBase";
+
+export { ModalCard } from "../components/ModalCard/ModalCard";
+export type { ModalCardProps } from "../components/ModalCard/ModalCard";
+
+export { Link } from "../components/Link/Link";
+export type { LinkProps } from "../components/Link/Link";
+
 export { ButtonGroup } from "../components/ButtonGroup/ButtonGroup";
 export type { ButtonGroupProps } from "../components/ButtonGroup/ButtonGroup";
 
@@ -46,6 +67,9 @@ export type { RadioProps } from "../components/Radio/Radio";
 export { RadioGroup } from "../components/RadioGroup/RadioGroup";
 export type { RadioGroupProps } from "../components/RadioGroup/RadioGroup";
 
+export { RichCell } from "../components/RichCell/RichCell";
+export type { RichCellProps } from "../components/RichCell/RichCell";
+
 export { SegmentedControl } from "../components/SegmentedControl/SegmentedControl";
 export type {
   SegmentedControlProps,
@@ -68,6 +92,12 @@ export type { SubheadProps } from "../components/Typography/Subhead/Subhead";
 export { CellButton } from "../components/CellButton/CellButton";
 export type { CellButtonProps } from "../components/CellButton/CellButton";
 
+export { ScreenSpinner } from "../components/ScreenSpinner/ScreenSpinner";
+export type { ScreenSpinnerProps } from "../components/ScreenSpinner/ScreenSpinner";
+
+export { Dropdown } from "../components/Dropdown/Dropdown";
+export type { DropdownProps } from "../components/Dropdown/Dropdown";
+
 export { Pagination } from "../components/Pagination/Pagination";
 export type { PaginationProps } from "../components/Pagination/Pagination";
 
@@ -101,12 +131,18 @@ export type { SliderProps } from "../components/Slider/Slider";
 export { RangeSlider } from "../components/RangeSlider/RangeSlider";
 export type { RangeSliderProps } from "../components/RangeSlider/RangeSlider";
 
+export { Placeholder } from "../components/Placeholder/Placeholder";
+export type { PlaceholderProps } from "../components/Placeholder/Placeholder";
+
 export { Input } from "../components/Input/Input";
 export type { InputProps } from "../components/Input/Input";
 
 export { File } from "../components/File/File";
 export type { FileProps } from "../components/File/File";
 
+export { CardGrid } from "../components/CardGrid/CardGrid";
+export type { CardGridProps } from "../components/CardGrid/CardGrid";
+
 export { FocusVisible } from "../components/FocusVisible/FocusVisible";
 export type { FocusVisibleProps } from "../components/FocusVisible/FocusVisible";
 
@@ -143,6 +179,9 @@ export type { CheckboxProps } from "../components/Checkbox/Checkbox";
 export { ChipsInput } from "../components/ChipsInput/ChipsInput";
 export type { ChipsInputProps } from "../components/ChipsInput/ChipsInput";
 
+export { Separator } from "../components/Separator/Separator";
+export type { SeparatorProps } from "../components/Separator/Separator";
+
 export { ChipsSelect } from "../components/ChipsSelect/ChipsSelect";
 export type { ChipsSelectProps } from "../components/ChipsSelect/ChipsSelect";
 
@@ -190,3 +229,6 @@ export type { DateRangeInputProps } from "../components/DateRangeInput/DateRange
 
 export { Footer } from "../components/Footer/Footer";
 export type { FooterProps } from "../components/Footer/Footer";
+
+export { Tabbar } from "../components/Tabbar/Tabbar";
+export type { TabbarProps } from "../components/Tabbar/Tabbar";

package/src/types.ts

@@ -6,6 +6,10 @@ export type AnyFunction = (...args: any[]) => any;
 
 export type AlignType = "left" | "center" | "right";
 
+export interface HasChildren {
+  children?: React.ReactNode;
+}
+
 export interface HasRootRef<T> {
   getRootRef?: React.Ref<T>;
 }

package/stylelint.config.js

@@ -5,7 +5,8 @@ module.exports = {
   extends: ["stylelint-config-standard", "stylelint-config-prettier"],
   plugins: [
     "stylelint-value-no-unknown-custom-properties",
-    "./tasks/styleint-atomic",
+    "./tasks/stylelint-atomic",
+    "./tasks/stylelint-bad-multiplication",
   ],
   rules: {
     indentation: null,
@@ -16,6 +17,25 @@ module.exports = {
     "no-descending-specificity": null,
     "no-duplicate-selectors": null,
     "value-keyword-case": null,
+    "selector-class-pattern": null,
+    "custom-property-pattern": null,
+    "value-no-vendor-prefix": null,
+    "property-no-vendor-prefix": null,
+    "alpha-value-notation": "number",
+    /**
+     * https://caniuse.com/mdn-css_types_color_hsl_space_separated_parameters
+     */
+    "color-function-notation": "legacy",
+    /**
+     * // In Selectors Level 3, only a single simple selector was allowed as the argument to :not(), whereas Selectors Level 4 allows a selector list.
+     */
+    "selector-not-notation": "simple",
+    "function-no-unknown": [
+      true,
+      {
+        ignoreFunctions: ["constant"],
+      },
+    ],
     "length-zero-no-unit": [
       true,
       {
@@ -42,5 +62,6 @@ module.exports = {
         severity: "warning",
       },
     ],
+    "vkui/bad-multiplication": true,
   },
 };

package/tasks/{styleint-atomic.js → stylelint-atomic.js}

@@ -33,7 +33,7 @@ module.exports = stylelint.createPlugin(ruleName, function () {
               selTarget = "";
               return;
             }
-            selTarget += String(selector);
+            selTarget += String(selector.value || "");
             if (selector.type === "class") {
               const ruleCmp = selector.value.split(/(--|__)/g)[0];
               hasComponentScope = hasComponentScope || ruleCmp === cssCmp;

package/tasks/stylelint-bad-multiplication.js

@@ -0,0 +1,69 @@
+const stylelint = require("stylelint");
+const valueParser = require("postcss-value-parser");
+
+const MATCH_CALC = /((?:-(moz|webkit)-)?calc)/i;
+
+const ruleName = "vkui/bad-multiplication";
+const messages = stylelint.utils.ruleMessages(ruleName, {});
+const meta = {
+  url: "https://github.com/VKCOM/VKUI/pull/2741",
+};
+
+const searchBadMultiplication = (node) => {
+  let lastWord = "";
+
+  return node.nodes.some((nodeValue) => {
+    if (nodeValue.type === "function") {
+      if (searchBadMultiplication(nodeValue)) {
+        return true;
+      }
+    }
+
+    if (nodeValue.type === "word") {
+      if (lastWord.endsWith("*") && nodeValue.value.startsWith("-")) {
+        return true;
+      }
+    }
+
+    if (nodeValue.type !== "space") {
+      lastWord = nodeValue.value;
+    }
+  });
+};
+
+module.exports = stylelint.createPlugin(ruleName, function () {
+  /**
+   * @param {import('postcss').Root} root
+   */
+  function stylelintRule(root, result) {
+    root.walkRules((node) => {
+      node.each((childNode) => {
+        if (childNode.type === "decl") {
+          valueParser(childNode.value).walk((valueNode) => {
+            if (
+              valueNode.type !== "function" ||
+              !MATCH_CALC.test(valueNode.value)
+            ) {
+              return;
+            }
+
+            if (searchBadMultiplication(valueNode)) {
+              stylelint.utils.report({
+                ruleName,
+                node: childNode,
+                result,
+                message: `Bad multiplication, swap operands`,
+              });
+            }
+          });
+        }
+      });
+    });
+  }
+
+  return stylelintRule;
+});
+
+module.exports.ruleName = ruleName;
+module.exports.messages = messages;
+module.exports.meta = meta;

package/CONTRIBUTING.md

@@ -1,66 +0,0 @@
-## Разработка
-
-1. Склонировать репозиторий и перейти в созданную директорию.
-2. Установить зависимости: `yarn install`.
-3. Поднять локально документацию с лайврелоадом: `yarn styleguide`. Свойства и методы компонента в режиме разработки по умолчанию не генерируются; если они вам нужны, используйте команду `yarn styleguide:props`.
-
-Документация будет доступна на `http://localhost:6060`. В ней ведётся вся разработка. Для удобства можно сразу перейти на страницу разрабатываемого компонента (`http://localhost:6060/#/UsersStack`)
-
-## Чеклист для компонента
-
-### Организационные моменты
-
-- Один pull request — одна фича или багфикс. Рефакторинги выносим отдельно
-- Дизайн компонента описан в [Figma](https://www.figma.com/@vk)
-- Компонент находится в своей папке в `src/components` и не делит её с другими публичными компонентами (один файл — один компонент)
-- У компонента есть понятная документация, описанная в директории компонента в файле `Readme.md`. Файл подключается в `styleguide/config.js`
-- Вся документация и предупреждения в коде компонента (`warnOnce`) написаны на русском языке
-- Вся стилизация — в соответствующем `.css` файле. Файл подключается в `src/styles/components.css`
-
-### Требования к разработке
-
-- CSS-классы компонента передаем через `vkuiClass="Cmp"`
-- CSS-классы названы по БЭМ: `.Component__element-name--modificator`. [Гайд по написанию стилей](https://github.com/VKCOM/VKUI/blob/master/CSS_GUIDE.md)
-- Свойства `className` и `style` навешиваются на корневой элемент компонента
-- Свойства, не используемые в коде компонента, навешиваются на **главный** элемент компонента. По умолчанию главным является корневой элемент:
-
-```jsx
-(props) => <div {...props} vkuiClass="Component" />;
-```
-
-Бывают случаи, например, поле ввода, когда главным является именно `input`, а не обёртка:
-
-```jsx
-const Input: React.FC<InputProps> = ({
-  mode,
-  style,
-  className,
-  ...restProps
-}) => {
-  return (
-    <div
-      vkuiClass={classNames("Input", `Input--${mode}`)}
-      className={className}
-      style={style}
-    >
-      <input {...restProps} />
-    </div>
-  );
-};
-```
-
-- Компонент корректно отрисовывается, если не передавать никаких свойств. Вместо `defaultProps`, [deprecated для функциональных компонентов](https://github.com/facebook/react/pull/16210), используем спред:
-
-```jsx
-const Cmp: React.FC<CmpProps> = ({
-  mode = "default",
-  ...restProps,
-}) => <div vkuiClass={classNames("Cmp", `Cmp--${mode}`)} {...restProps} />;
-```
-
-- Для цветов используются цветовые токены. Старые компоненты поддерживают [Appearance](https://github.com/VKCOM/Appearance) и [vkui-tokens](https://github.com/VKCOM/vkui-tokens), новые — только vkui-tokens. [Гайд по миграции](https://github.com/VKCOM/VKUI/blob/master/VKUI_TOKENS_MIGRATION_GUIDE.md)
-- Для типографии используются компоненты [Typography](https://vkcom.github.io/VKUI/#!/Typography) там, где это возможно
-- Добавлен `export` компонента и его свойств в `src/index.ts`
-- Компонент покрыт юнит- и скриншотными тестами. [Гайд по тестированию](./TESTING.md)
-- Компонент корректно отображается на всех платформах, размерах и цветовых схемах. В styleguide для всех этих параметров есть переключатели
-- Код корректно работает на [поддерживаемых нами браузерах](https://github.com/VKCOM/VKUI#%D0%B1%D1%80%D0%B0%D1%83%D0%B7%D0%B5%D1%80%D1%8B)

package/CSS_GUIDE.md

@@ -1,145 +0,0 @@
-# Гайд по написанию стилей
-
-## Соглашения
-
-- Используем БЭМ-нотацию
-- Блок начинается с заглавной буквы: `.Checkbox`
-- Многословный блок разделяется через camelCase: `.SimpleCheckbox`
-- Элемент от блока отделяется двумя подчеркиваниями: `.Checkbox__in`
-- Многословные элементы разделяются через kebab-case: `.Banner__before-title`
-- Модификатор отделяется двумя дефисами: `.Input--plain`
-- Многословные модификаторы разделяются через kebab-case или camelCase: `.Checkbox--sizeX-regular`
-
-### Связность стилей
-
-Если компонент состоит из других компонентов, то для их модификации используем БЭМ-миксин. Пример:
-
-```tsx
-// Button.tsx
-<button vkuiClass="Button">
-  <Text vkuiClass="Button__text">{children}</Text>
-</button>
-```
-
-```css
-/* Button.css */
-.Button__text {
-  margin: 4px 0;
-}
-```
-
-Если в компонент прокидываются другие компоненты извне, то для их модификации используем обращение к блоку. Пример:
-
-```tsx
-// Cell.tsx
-<div vkuiClass="Cell">
-  {before} {/* В before может быть <Icon /> или <Avatar /> */}
-</div>
-```
-
-```css
-/* Cell.css */
-.Cell .Icon {
-  margin-right: 10px;
-}
-
-.Cell .Avatar {
-  margin-right: 8px;
-}
-```
-
-Таких ситуаций стоит избегать, так как подобное связывание лишает нас возможности в будущем хешировать имена классов с
-помощью css-modules.
-
-## Проблемы
-
-### Конфликт стилей блока и миксина
-
-```css
-/* Text.css */
-.Text {
-  margin: 0;
-}
-```
-
-```css
-/* Button.css */
-.Button__text {
-  margin: 4px 0;
-}
-```
-
-Вес селекторов одинаковый, поэтому применится последний по порядку. Рассчитывать на порядок сложно, так как он может
-меняться, если собирать стили вебпаком.
-
-#### Решение
-
-Избегать правил на блоке, которые могут быть в миксине.
-
-Список правил, которых стоит избегать:
-
-- display;
-- margin;
-- position;
-- left, right, top, bottom;
-- transform: translate
-
-### Сброс стилей
-
-Допустим, мы делаем компонент типографики. Для семантики мы даём возможность рендерить
-любой html-элемент. В итоге, если пользователь рендерит, допустим, `h1`, у него появляются
-дефолтные браузерные `margin`. Наше решение такое:
-
-```css
-/* Title.css */
-
-.Title {
-  /*...*/
-  margin: 0; /* или любое другое значение, диктуемое дизайном */
-}
-```
-
-Решение приводит нас к предыдущей проблеме.
-
-#### Решение
-
-В таком случае необходимо снабдить компонент режимом `withSpaces`, который
-если `false`, то никакие `margin` на блок не навешиваются.
-
-### Нормализация стилей
-
-Допустим, мы делаем компонент кнопки. Согласно дизайну, кнопка может быть ссылкой. Поэтому
-Button мы тоже наделяем возможностью рендерить любой html-элемент, в том числе `a`. В силу
-ряда стилей нам необходимо, что кнопка не была инлайновой. Поэтому мы пишем следующее:
-
-```css
-/* Button.css */
-
-.Button {
-  /* ... */
-  display: inline-block;
-}
-```
-
-Теперь те, кто хочет скрыть кнопку, используя миксин, столкнутся с проблемой конфликта
-блока и миксина.
-
-#### Решение
-
-В данном случае мы можем только порекомендовать разработчикам оборачивать кнопку
-в условный `div`.
-
-### Обращения к элементам другого блока
-
-```css
-/* Banner.css */
-.Banner .Button__in {
-  padding-top: 4px;
-}
-```
-
-Мы завязываемся на реализацию другого компонента. Это плохо, так как реализация может меняться.
-
-#### Решение
-
-Не обращаться к элементам другого блока

package/TESTING.md

@@ -1,58 +0,0 @@
-Мы используем три вида тестов:
-
-**Юнит-тесты** на jest в файлах `moduleName.test.ts` [пример](./src/helpers/getClassName.test.ts)
-
-**Компонентные тесты** на jest + [react-testing-library](https://testing-library.com/docs/react-testing-library/example-intro) + [jest-dom](https://github.com/testing-library/jest-dom#table-of-contents) в `ComponentName.test.tsx` [пример](./src/components/Checkbox/Checkbox.test.tsx)
-
-**Скриншотные тесты** на jest + [playwright](https://playwright.dev/#?path=docs/api.md) + [jest-playwright](https://github.com/playwright-community/jest-playwright) в `ComponentName.e2e.tsx` [пример](./src/components/Checkbox/Checkbox.e2e.tsx).
-
-Чтобы запускать скриншотные тесты локально, нужно установить:
-
-- [git-lfs](https://git-lfs.github.com) — чтобы от эталонных скриншотов не раздувало репозиторий
-- [докер](https://www.docker.com/products/docker-desktop) — чтобы платформа не влияла на рендеринг шрифтов. На линуксе докер не нужен.
-
-## Команды
-
-- `yarn test:unit` — только быстрые юниты + компонентные;
-- `yarn test:unit:quick` — только юниты + компонентные тесты на незакоммиченные изменения;
-- `yarn test:e2e` — только браузерные тесты;
-
-Все команды работают в интерактивном режиме с опцией `--watch` (`yarn test:unit --watch`).
-
-Чтобы обновить скриншоты, установите докер и git-lfs и запустите `yarn test:e2e -u`.
-
-## Покрытие
-
-Чтобы сгенерировать карту покрытия в `coverage/lcov/index.html`:
-
-- Только юнитами — просто `yarn test:unit`
-- Только E2E — `yarn test:e2e && yarn test:combine-coverage`
-- Совмещенного — `&& yarn test:e2e && yarn test:unit:ci && yarn test:combine-coverage`
-
-## `describeScreenshotFuzz`
-
-Функция `describeScreenshotFuzz` из [`/testing/utils`](./src/testing/e2e/utils.tsx) помогает быстро заскриншотить все состояния компонента в разных темах и на разных платформах:
-
-```ts
-describe("Button", () => {
-  describeScreenshotFuzz(
-    // Можем передать компонент или вот так добавить дефолтные пропы для скриншотов
-    (props: ButtonProps) => <Button {...props}>Кнопка</Button>,
-    // Описание комбинаций пропов — по элементу массива на независимый набор
-    [
-      // mode и disabled влияют на цвет, но не на размер
-      { mode: ["primary", "secondary"], disabled: [undefined, true] },
-      // size влияет на размер, но не на цвет
-      { size: ["s", "m", "l"] },
-    ]
-  );
-  // всего 2 * 2 + 3 = 7 состояний:
-  // mode="primary"
-  // mode="primary" disabled
-  // mode="secondary"
-  // mode="secondary" disabled
-  // size="s"
-  // size="m"
-  // size="l"
-});
-```

package/VKUI_TOKENS_MIGRATION_GUIDE.md

@@ -1,76 +0,0 @@
-# Гайд по переводу компонента на vkui-tokens
-
-## Текущее положение дел
-
-Обычно стили компонента выглядят так:
-
-```css
-/* Button.css */
-
-.Button {
-  background: var(--button_primary_background); /* Кроссплатформенные стили */
-}
-
-.Button--ios {
-  border-radius: 10px; /* Стили для vk ios */
-}
-
-.Button--android {
-  border-radius: 8px; /* Стили для vk android */
-}
-
-.Button--vkcom {
-  border-radius: 4px; /* Стили для vkcom */
-}
-```
-
-`--button_primary_background` — токен из [Appearance](https://github.com/VKCOM/Appearance).
-
-## Внедрение vkui-tokens
-
-### Промежуточный вариант
-
-Промежуточный вариант позволяет пользователям использовать либо Appearance, либо vkui-tokens.
-
-```css
-/* Button.css */
-
-.Button {
-  background-color: var(
-    --button_primary_background,
-    var(--vkui--color_background_accent)
-  );
-  border-radius: var(--vkui--size_border_radius--regular);
-}
-```
-
-Если создаётся новый компонент, то там Appearance можно уже не использовать:
-
-```css
-/* Button.css */
-
-.Button {
-  background-color: var(--vkui--color_background_accent);
-  border-radius: var(--vkui--size_border_radius--regular);
-}
-```
-
-#### Чеклист перевода компонента на vkui-tokens
-
-- В стилях компонента не осталось платформенных селекторов типа `.Button--ios`, `.Button--vkcom`, `.Button--android`
-- Если в стилях встречаются токены из Appearance, то их нужно не удалять, а дополнять фоллбэком на соответствующий токен из vkui-tokens
-- В tsx компонента не осталось логики, которая зависит от платформы
-- Компонент добавлен в `src/tokenized/index.ts` (в `src/index.ts` он так же должен быть)
-
-### После отказа от Appearance
-
-В следующей мажорной версии мы откажемся от Appearance. После отказа останутся только токены из vkui-tokens:
-
-```css
-/* Button.css */
-
-.Button {
-  background-color: var(--vkui--color_background_accent);
-  border-radius: var(--vkui--size_border_radius--regular);
-}
-```

package/dist/cjs/appearance/constants.d.ts

@@ -1 +0,0 @@
-export declare const tabbarHeight = 48;

package/dist/cjs/components/ActionSheet/ActionSheet.d.ts

@@ -1,29 +0,0 @@
-import * as React from "react";
-import { PopupDirection, ToggleRef } from "./types";
-import "./ActionSheet.css";
-export interface ActionSheetProps extends React.HTMLAttributes<HTMLDivElement> {
-    header?: React.ReactNode;
-    text?: React.ReactNode;
-    /**
-     * Закрыть попап по клику снаружи. В v5 будет обязательным.
-     */
-    onClose?: VoidFunction;
-    /**
-     * Элемент, рядом с которым вылезает попап на десктопе.
-     * Лучше передавать RefObject c current.
-     * В v5 будет обязательным.
-     */
-    toggleRef?: ToggleRef;
-    /**
-     * Направление на десктопе
-     */
-    popupDirection?: PopupDirection;
-    /**
-     * Только iOS. В v5 будет обязательным.
-     */
-    iosCloseItem?: React.ReactNode;
-}
-/**
- * @see https://vkcom.github.io/VKUI/#/ActionSheet
- */
-export declare const ActionSheet: React.FC<ActionSheetProps>;

package/dist/cjs/components/ActionSheet/ActionSheetContext.d.ts

@@ -1,8 +0,0 @@
-import * as React from "react";
-export declare type ActionType<T> = (event: React.MouseEvent<T>) => void;
-export declare type ItemClickHandler<T extends Element = Element> = (action: ActionType<T> | undefined, immediateAction: ActionType<T> | undefined, autoclose: boolean) => (event: React.MouseEvent) => void;
-export declare type ActionSheetContextType<T extends Element = Element> = {
-    onItemClick?: ItemClickHandler<T>;
-    isDesktop?: boolean;
-};
-export declare const ActionSheetContext: React.Context<ActionSheetContextType<any>>;

package/dist/cjs/components/ActionSheet/ActionSheetDropdown.d.ts

@@ -1,4 +0,0 @@
-import * as React from "react";
-import { SharedDropdownProps } from "./types";
-import "./ActionSheet.css";
-export declare const ActionSheetDropdown: React.FC<SharedDropdownProps>;

package/dist/cjs/components/ActionSheet/ActionSheetDropdownDesktop.d.ts

@@ -1,4 +0,0 @@
-import * as React from "react";
-import { SharedDropdownProps } from "./types";
-import "./ActionSheet.css";
-export declare const ActionSheetDropdownDesktop: React.FC<SharedDropdownProps>;