@snack-uikit/accordion 0.4.1 → 0.5.0

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# 0.5.0 (2023-12-14)
+
+
+### BREAKING CHANGES
+
+
+* **FF-3729:** replace enum with unions ([910db4a](https://github.com/cloud-ru-tech/snack-uikit/commit/910db4aa8231ccbc58e538e5c5c1f461b1dec275))
+
+
+
+
 ## 0.4.1 (2023-12-06)
 
 ### Only dependencies have been changed

package/README.md

@@ -7,25 +7,24 @@
 
 ## Example 
 
-```typescript
+```tsx
+import { AccordionPrimary } from '@snack-uikit/accordion'
 
-  import {AccordionPrimary} from '@snack-uikit/accordion'
+function Example() {
 
-  function Example() {
-  
-  // ...some actions
+// ...some actions
 
-  return (
-    <AccordionPrimary >
-      <AccordionPrimary.CollapseBlock title={title} description={description} actions={actions}>
-        <Content />
-      </AccordionPrimary.CollapseBlock>
+return (
+  <AccordionPrimary >
+    <AccordionPrimary.CollapseBlock title={title} description={description} actions={actions}>
+      <Content />
+    </AccordionPrimary.CollapseBlock>
 
-      <AccordionPrimary.CollapseBlock title={title} description={description} actions={actions}>
-        <Content />
-      </AccordionPrimary.CollapseBlock>
-    </AccordionPrimary>
-  )}
+    <AccordionPrimary.CollapseBlock title={title} description={description} actions={actions}>
+      <Content />
+    </AccordionPrimary.CollapseBlock>
+  </AccordionPrimary>
+)}
 ```
 
 
@@ -41,7 +40,7 @@
 | expandedDefault | `string \| string[]` | - | Начальное состояние |
 | expanded | `string \| string[]` | - | Controlled состояние |
 | onExpandedChange | `((value: string) => void) \| ((value: string[]) => void)` | - | Controlled обработчик измения состояния |
-| selectionMode | enum SelectionMode: `"single"`, `"multiple"` | - | Режим работы аккордиона |
+| selectionMode | "single" \| "multiple" | - | Режим работы аккордиона |
 ## AccordionSecondary
 ### Props
 | name | type | default value | description |
@@ -51,7 +50,7 @@
 | expandedDefault | `string \| string[]` | - | Начальное состояние |
 | expanded | `string \| string[]` | - | Controlled состояние |
 | onExpandedChange | `((value: string) => void) \| ((value: string[]) => void)` | - | Controlled обработчик измения состояния |
-| selectionMode | enum SelectionMode: `"single"`, `"multiple"` | - | Режим работы аккордиона |
+| selectionMode | "single" \| "multiple" | - | Режим работы аккордиона |
 
 
 [//]: DOCUMENTATION_SECTION_END

package/dist/components/AccordionPrimary/AccordionPrimary.d.ts

@@ -1,5 +1,2 @@
 import { AccordionProps } from '../../types';
 export declare function AccordionPrimary({ className, ...rest }: AccordionProps): import("react/jsx-runtime").JSX.Element;
-export declare namespace AccordionPrimary {
-    var selectionModes: typeof import("@snack-uikit/toggles/dist/constants").SelectionMode;
-}

package/dist/components/AccordionPrimary/AccordionPrimary.js

@@ -11,11 +11,9 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import cn from 'classnames';
-import { ToggleGroup } from '@snack-uikit/toggles';
 import { Accordion } from '../../helperComponents';
 import styles from './styles.module.css';
 export function AccordionPrimary(_a) {
     var { className } = _a, rest = __rest(_a, ["className"]);
     return _jsx(Accordion, Object.assign({ className: cn(styles.accordionPrimary, className) }, rest));
 }
-AccordionPrimary.selectionModes = ToggleGroup.selectionModes;

package/dist/components/AccordionSecondary/AccordionSecondary.d.ts

@@ -1,5 +1,2 @@
 import { AccordionProps } from '../../types';
 export declare function AccordionSecondary({ className, ...rest }: AccordionProps): import("react/jsx-runtime").JSX.Element;
-export declare namespace AccordionSecondary {
-    var selectionModes: typeof import("@snack-uikit/toggles/dist/constants").SelectionMode;
-}

package/dist/components/AccordionSecondary/AccordionSecondary.js

@@ -11,11 +11,9 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import cn from 'classnames';
-import { ToggleGroup } from '@snack-uikit/toggles';
 import { Accordion } from '../../helperComponents';
 import styles from './styles.module.css';
 export function AccordionSecondary(_a) {
     var { className } = _a, rest = __rest(_a, ["className"]);
     return _jsx(Accordion, Object.assign({ className: cn(styles.accordionSecondary, className) }, rest));
 }
-AccordionSecondary.selectionModes = ToggleGroup.selectionModes;

package/dist/constants.d.ts

@@ -0,0 +1,4 @@
+export declare const SELECTION_MODE: {
+    readonly Single: "single";
+    readonly Multiple: "multiple";
+};

package/dist/constants.js

@@ -0,0 +1,4 @@
+export const SELECTION_MODE = {
+    Single: 'single',
+    Multiple: 'multiple',
+};

package/dist/helperComponents/Accordion/Accordion.js

@@ -13,7 +13,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { ToggleGroup } from '@snack-uikit/toggles';
 import { extractSupportProps } from '@snack-uikit/utils';
 export function Accordion(_a) {
-    var { children, expanded, onExpandedChange, expandedDefault, selectionMode = ToggleGroup.selectionModes.Single, className } = _a, rest = __rest(_a, ["children", "expanded", "onExpandedChange", "expandedDefault", "selectionMode", "className"]);
+    var { children, expanded, onExpandedChange, expandedDefault, selectionMode = 'single', className } = _a, rest = __rest(_a, ["children", "expanded", "onExpandedChange", "expandedDefault", "selectionMode", "className"]);
     return (
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
     // @ts-ignore

package/dist/helperComponents/CollapseBlockHeader/CollapseBlockHeader.js

@@ -5,5 +5,5 @@ import { Typography } from '@snack-uikit/typography';
 import { TEST_IDS } from '../../testIds';
 import styles from './styles.module.css';
 export function CollapseBlockHeader({ title, description, tip }) {
-    return (_jsxs(_Fragment, { children: [_jsxs("div", Object.assign({ className: styles.headline }, { children: [_jsx(Typography.SansTitleM, Object.assign({ className: styles.title, "data-test-id": TEST_IDS.title }, { children: _jsx(TruncateString, { text: title, maxLines: 1 }) })), tip && _jsx(QuestionTooltip, { size: QuestionTooltip.sizes.S, tip: tip, triggerDataTestId: TEST_IDS.tooltip })] })), description && (_jsx(Typography.SansBodyM, Object.assign({ className: styles.subtitle, "data-test-id": TEST_IDS.description }, { children: _jsx(TruncateString, { text: description, maxLines: 2 }) })))] }));
+    return (_jsxs(_Fragment, { children: [_jsxs("div", Object.assign({ className: styles.headline }, { children: [_jsx(Typography.SansTitleM, Object.assign({ className: styles.title, "data-test-id": TEST_IDS.title }, { children: _jsx(TruncateString, { text: title, maxLines: 1 }) })), tip && _jsx(QuestionTooltip, { size: 's', tip: tip, triggerDataTestId: TEST_IDS.tooltip })] })), description && (_jsx(Typography.SansBodyM, Object.assign({ className: styles.subtitle, "data-test-id": TEST_IDS.description }, { children: _jsx(TruncateString, { text: description, maxLines: 2 }) })))] }));
 }

package/dist/helperComponents/CollapseBlockHeaderContainer/CollapseBlockHeaderContainer.js

@@ -17,5 +17,5 @@ export function CollapseBlockHeaderContainer({ children, toggleExpanded, expande
     }, [functionLayoutRef]);
     return (
     // eslint-disable-next-line jsx-a11y/no-static-element-interactions
-    _jsxs("div", Object.assign({ className: styles.header, "data-test-id": TEST_IDS.header, onClick: toggleExpanded }, { children: [_jsx("div", Object.assign({ className: styles.text, style: { '--width': width } }, { children: children })), _jsxs("div", Object.assign({ className: styles.functionLayout, ref: functionLayoutRef }, { children: [actions, _jsx(ButtonFunction, { className: styles.button, "data-expanded": expanded || undefined, icon: _jsx(ChevronDownSVG, {}), size: ButtonFunction.sizes.Xs, "data-test-id": TEST_IDS.chevron })] }))] })));
+    _jsxs("div", Object.assign({ className: styles.header, "data-test-id": TEST_IDS.header, onClick: toggleExpanded }, { children: [_jsx("div", Object.assign({ className: styles.text, style: { '--width': width } }, { children: children })), _jsxs("div", Object.assign({ className: styles.functionLayout, ref: functionLayoutRef }, { children: [actions, _jsx(ButtonFunction, { className: styles.button, "data-expanded": expanded || undefined, icon: _jsx(ChevronDownSVG, {}), size: 'xs', "data-test-id": TEST_IDS.chevron })] }))] })));
 }

package/dist/types.d.ts

@@ -1,6 +1,6 @@
 import { ReactElement, ReactNode } from 'react';
-import { ToggleGroup } from '@snack-uikit/toggles';
 import { WithSupportProps } from '@snack-uikit/utils';
+import { SELECTION_MODE } from './constants';
 export type CollapseBlockProps = WithSupportProps<{
     /** Уникальный id блока */
     id: string;
@@ -26,7 +26,7 @@ export type AccordionProps = WithSupportProps<{
     /** Controlled обработчик измения состояния */
     onExpandedChange?(value: (string | undefined) | string): void;
     /** Режим работы аккордиона */
-    selectionMode?: typeof ToggleGroup.selectionModes.Single;
+    selectionMode?: typeof SELECTION_MODE.Single;
 } | {
     /** Начальное состояние */
     expandedDefault?: string[];
@@ -35,5 +35,5 @@ export type AccordionProps = WithSupportProps<{
     /** Controlled обработчик измения состояния */
     onExpandedChange?(value: (string[] | undefined) | string[]): void;
     /** Режим работы аккордиона */
-    selectionMode: typeof ToggleGroup.selectionModes.Multiple;
+    selectionMode: typeof SELECTION_MODE.Multiple;
 });

package/package.json

@@ -4,7 +4,7 @@
     "access": "public"
   },
   "title": "Accordion",
-  "version": "0.4.1",
+  "version": "0.5.0",
   "sideEffects": [
     "*.css",
     "*.woff",
@@ -32,14 +32,14 @@
   "license": "Apache-2.0",
   "scripts": {},
   "dependencies": {
-    "@snack-uikit/button": "0.14.1",
+    "@snack-uikit/button": "0.15.0",
     "@snack-uikit/icons": "0.19.0",
-    "@snack-uikit/toggles": "0.8.1",
-    "@snack-uikit/tooltip": "0.9.1",
-    "@snack-uikit/truncate-string": "0.3.1",
-    "@snack-uikit/typography": "0.5.1",
-    "@snack-uikit/utils": "3.1.0",
+    "@snack-uikit/toggles": "0.9.0",
+    "@snack-uikit/tooltip": "0.10.0",
+    "@snack-uikit/truncate-string": "0.4.0",
+    "@snack-uikit/typography": "0.6.0",
+    "@snack-uikit/utils": "3.2.0",
     "classnames": "2.3.2"
   },
-  "gitHead": "76a159dde7baccf49dc7b11e1fd7abc31424b42f"
+  "gitHead": "bd39c5e674f3b91b0e2487782a04b15034cf3d8b"
 }

package/src/components/AccordionPrimary/AccordionPrimary.tsx

@@ -1,7 +1,5 @@
 import cn from 'classnames';
 
-import { ToggleGroup } from '@snack-uikit/toggles';
-
 import { Accordion } from '../../helperComponents';
 import { AccordionProps } from '../../types';
 import styles from './styles.module.scss';
@@ -9,5 +7,3 @@ import styles from './styles.module.scss';
 export function AccordionPrimary({ className, ...rest }: AccordionProps) {
   return <Accordion className={cn(styles.accordionPrimary, className)} {...rest} />;
 }
-
-AccordionPrimary.selectionModes = ToggleGroup.selectionModes;

package/src/components/AccordionSecondary/AccordionSecondary.tsx

@@ -1,7 +1,5 @@
 import cn from 'classnames';
 
-import { ToggleGroup } from '@snack-uikit/toggles';
-
 import { Accordion } from '../../helperComponents';
 import { AccordionProps } from '../../types';
 import styles from './styles.module.scss';
@@ -9,5 +7,3 @@ import styles from './styles.module.scss';
 export function AccordionSecondary({ className, ...rest }: AccordionProps) {
   return <Accordion className={cn(styles.accordionSecondary, className)} {...rest} />;
 }
-
-AccordionSecondary.selectionModes = ToggleGroup.selectionModes;

package/src/constants.ts

@@ -0,0 +1,4 @@
+export const SELECTION_MODE = {
+  Single: 'single',
+  Multiple: 'multiple',
+} as const;

package/src/helperComponents/Accordion/Accordion.tsx

@@ -8,7 +8,7 @@ export function Accordion({
   expanded,
   onExpandedChange,
   expandedDefault,
-  selectionMode = ToggleGroup.selectionModes.Single,
+  selectionMode = 'single',
   className,
   ...rest
 }: AccordionProps) {

package/src/helperComponents/CollapseBlockHeader/CollapseBlockHeader.tsx

@@ -22,7 +22,7 @@ export function CollapseBlockHeader({ title, description, tip }: CollapseBlockHe
           <TruncateString text={title} maxLines={1} />
         </Typography.SansTitleM>
 
-        {tip && <QuestionTooltip size={QuestionTooltip.sizes.S} tip={tip} triggerDataTestId={TEST_IDS.tooltip} />}
+        {tip && <QuestionTooltip size='s' tip={tip} triggerDataTestId={TEST_IDS.tooltip} />}
       </div>
 
       {description && (

package/src/helperComponents/CollapseBlockHeaderContainer/CollapseBlockHeaderContainer.tsx

@@ -47,7 +47,7 @@ export function CollapseBlockHeaderContainer({
           className={styles.button}
           data-expanded={expanded || undefined}
           icon={<ChevronDownSVG />}
-          size={ButtonFunction.sizes.Xs}
+          size='xs'
           data-test-id={TEST_IDS.chevron}
         />
       </div>

package/src/types.ts

@@ -1,8 +1,9 @@
 import { ReactElement, ReactNode } from 'react';
 
-import { ToggleGroup } from '@snack-uikit/toggles';
 import { WithSupportProps } from '@snack-uikit/utils';
 
+import { SELECTION_MODE } from './constants';
+
 export type CollapseBlockProps = WithSupportProps<{
   /** Уникальный id блока */
   id: string;
@@ -31,7 +32,7 @@ export type AccordionProps = WithSupportProps<{
         /** Controlled обработчик измения состояния */
         onExpandedChange?(value: (string | undefined) | string): void;
         /** Режим работы аккордиона */
-        selectionMode?: typeof ToggleGroup.selectionModes.Single;
+        selectionMode?: typeof SELECTION_MODE.Single;
       }
     | {
         /** Начальное состояние */
@@ -41,6 +42,6 @@ export type AccordionProps = WithSupportProps<{
         /** Controlled обработчик измения состояния */
         onExpandedChange?(value: (string[] | undefined) | string[]): void;
         /** Режим работы аккордиона */
-        selectionMode: typeof ToggleGroup.selectionModes.Multiple;
+        selectionMode: typeof SELECTION_MODE.Multiple;
       }
   );