@spaced-out/ui-design-system 0.4.13 → 0.4.15-beta.0

package/lib/utils/string/index.d.ts

@@ -0,0 +1,2 @@
+export * from './string';
+//# sourceMappingURL=index.d.ts.map

package/lib/utils/string/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/utils/string/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC"}

package/lib/utils/string/string.d.ts

@@ -0,0 +1,6 @@
+export declare const capitalize: (word: string) => string;
+export declare const escapeRegExp: (str: string) => string;
+export declare const formatWord: (word: string, count: number) => string;
+export declare const truncateString: (inputString: string, maxLength: number) => string;
+export declare const appendPx: (value?: number | string) => string;
+//# sourceMappingURL=string.d.ts.map

package/lib/utils/string/string.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"string.d.ts","sourceRoot":"","sources":["../../../src/utils/string/string.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,UAAU,GAAI,MAAM,MAAM,KAAG,MAOzC,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,KAAK,MAAM,KAAG,MAAyD,CAAC;AAErG,eAAO,MAAM,UAAU,GAAI,MAAM,MAAM,EAAE,OAAO,MAAM,KAAG,MAAyC,CAAC;AAEnG,eAAO,MAAM,cAAc,GAAI,aAAa,MAAM,EAAE,WAAW,MAAM,KAAG,MAKvE,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,QAAQ,MAAM,GAAG,MAAM,KAAG,MAKlD,CAAC"}

package/lib/utils/token-list-input/token-list-input.d.ts

@@ -0,0 +1,15 @@
+import type * as React from 'react';
+type V = {
+    key: string;
+    label: string;
+    arbitrary?: boolean;
+    multiarbitrary?: boolean;
+};
+type Group<V> = {
+    options: Array<V>;
+    groupTitle?: React.ReactNode;
+};
+export declare const getFirstOption: (options: Array<V>) => V | null;
+export declare const getFirstOptionFromGroup: (groupTitleOptions: Array<Group<V>>) => V | null;
+export {};
+//# sourceMappingURL=token-list-input.d.ts.map

package/lib/utils/token-list-input/token-list-input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"token-list-input.d.ts","sourceRoot":"","sources":["../../../src/utils/token-list-input/token-list-input.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAGpC,KAAK,CAAC,GAAG;IACP,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B,CAAC;AAEF,KAAK,KAAK,CAAC,CAAC,IAAI;IACd,OAAO,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC;IAClB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC9B,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,SAAS,KAAK,CAAC,CAAC,CAAC,KAAG,CAAC,GAAG,IAMtD,CAAC;AAEF,eAAO,MAAM,uBAAuB,GAAI,mBAAmB,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAG,CAAC,GAAG,IAQhF,CAAC"}

package/lib/utils/token-list-input/token-list-input.js

@@ -4,8 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getFirstOptionFromGroup = exports.getFirstOption = void 0;
-var React = _interopRequireWildcard(require("react"));
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const getFirstOption = options => {
   // pick the first option from the options
   if (options.length > 0) {

package/lib/utils/tokens/index.d.ts

@@ -0,0 +1,2 @@
+export * from './tokens';
+//# sourceMappingURL=index.d.ts.map

package/lib/utils/tokens/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/utils/tokens/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC"}

package/lib/utils/tokens/tokens.d.ts

@@ -0,0 +1,41 @@
+type TokenObject = {
+    [key: string]: string;
+};
+export type SortOrder = 'asc' | 'desc';
+export type SortBy = 'name' | 'value';
+export type TableDataItem = {
+    id: string | number;
+    name: string;
+    value: string;
+    demo: string;
+};
+export type TableData = Array<TableDataItem>;
+export type DataVariation = {
+    title: string;
+    description: string;
+};
+export declare const dataVariations: Array<DataVariation>;
+/**
+ *
+ * This function takes in an object containing key-value pairs of tokens,
+ * where values are strings representing numerical
+ * values with optional percentage or viewport units. It also takes in an optional
+ * sort order ('asc' or 'desc') and an optional sort by parameter ('name' or 'value').
+ *
+ * The function sorts the tokens by either their key names (if sortBy='name') or their
+ * numerical values (if sortBy='value'). The sort order can be specified as
+ * ascending (order='asc') or descending (order='desc').
+ *
+ * The function handles values with different units by comparing their numerical values.
+ * If both values have the same unit, their numerical values are compared directly.
+ * If their units are different, tokens with percentage values are considered greater than
+ * those with viewport units, and tokens without a percentage or viewport unit are compared
+ * based on their numerical values.
+ *
+ */
+export declare const getSortedTokenNames: (obj: TokenObject, order?: SortOrder, sortBy?: SortBy) => Array<string>;
+export declare const filterTableDataBySearchText: (TABLE_DATA: TableData, searchText: string) => TableData;
+export declare const getRandomDataVariation: () => DataVariation;
+export declare const handleDownload: (filePath: string, fileName: string) => void;
+export {};
+//# sourceMappingURL=tokens.d.ts.map

package/lib/utils/tokens/tokens.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokens.d.ts","sourceRoot":"","sources":["../../../src/utils/tokens/tokens.ts"],"names":[],"mappings":"AAAA,KAAK,WAAW,GAAG;IACjB,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;CACvB,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG,KAAK,GAAG,MAAM,CAAC;AAEvC,MAAM,MAAM,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC;AAEtC,MAAM,MAAM,aAAa,GAAG;IAC1B,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC;AAE7C,MAAM,MAAM,aAAa,GAAG;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,aAAa,CA0G/C,CAAC;AAEF;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,mBAAmB,GAAI,KAAK,WAAW,EAAE,QAAO,SAAiB,EAAE,SAAQ,MAAgB,KAAG,KAAK,CAAC,MAAM,CAqDtH,CAAC;AAEF,eAAO,MAAM,2BAA2B,GAAI,YAAY,SAAS,EAAE,YAAY,MAAM,KAAG,SAYvF,CAAC;AAEF,eAAO,MAAM,sBAAsB,QAAO,aAGzC,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,UAAU,MAAM,EAAE,UAAU,MAAM,SAchE,CAAC"}

package/package.json

@@ -1,15 +1,18 @@
 {
   "name": "@spaced-out/ui-design-system",
-  "version": "0.4.13",
-  "main": "index.js",
+  "version": "0.4.15-beta.0",
+  "main": "lib/index.js",
+  "types": "lib/index.d.ts",
   "description": "Sense UI components library",
   "author": {
     "name": "Spaced Out"
   },
   "license": "UNLICENSED",
   "scripts": {
-    "build": "rimraf lib && yarn build:style-variables && gulp build",
+    "build": "yarn build:style-variables && gulp build && yarn build:types",
     "build:style-variables": "rimraf src/styles/variables && style-dictionary build --config ./config.js",
+    "build:types": "tsc --project tsconfig.declaration.json && cp src/types/flow-to-typescript-codemod.d.ts lib/ ",
+    "prebuild": "rimraf lib",
     "storybook": "yarn build:style-variables && storybook dev --host genesis.proxysense.co --port 6006",
     "storybook:export": "yarn build:style-variables && rimraf storybook-static && storybook build",
     "build-storybook": "yarn build:style-variables && rimraf storybook-static && storybook build",
@@ -19,16 +22,23 @@
     "release": "yarn build:changelog && yarn publish",
     "build:changelog": "standard-version",
     "build:no-bump-changelog": "standard-version --skip.bump --skip.commit --skip.tag",
-    "flow": "flow",
-    "flow:all": "flow --show-all-errors",
-    "flow:json": "flow --json --pretty",
-    "flow:version": "flow version",
-    "lint": "eslint 'src/**/*.{js,jsx}'",
-    "lint:fix": "eslint --fix 'src/**/*.{js,jsx}'",
-    "lint:strict": "eslint --quiet 'src/**/*.{js,jsx}' && echo 'ok!'",
+    "flow": "tsc --noEmit",
+    "flow:all": "tsc --noEmit --listFiles",
+    "flow:json": "tsc --noEmit --pretty",
+    "flow:version": "tsc --version",
+    "lint": "eslint 'src/**/*.{ts,tsx}'",
+    "lint:fix": "eslint --fix 'src/**/*.{ts,tsx}'",
+    "lint:strict": "eslint --quiet 'src/**/*.{ts,tsx}' && echo 'ok!'",
     "spell-check": "cspell \"**\"",
     "test": "test-storybook",
-    "visual-test": "npx chromatic --project-token=f0e2813801c4"
+    "visual-test": "npx chromatic --project-token=f0e2813801c4",
+    "typescriptify": "node ../flow-to-typescript-codemod/bin.js",
+    "fix:forwardref": "node scripts/fix-all-forwardref.js",
+    "fix:forwardref:file": "node scripts/fix-forwardref-simple.js",
+    "fix:forwardref:check": "yarn flow && echo '✅ Type checking completed'",
+    "fix:unused": "node scripts/fix-unused-variables-targeted.js",
+    "fix:unused:all": "node scripts/fix-unused-variables.js",
+    "fix:all": "yarn fix:forwardref && yarn fix:unused  && yarn fix:forwardref:check"
   },
   "keywords": [
     "React",
@@ -58,10 +68,10 @@
   "devDependencies": {
     "@babel/cli": "^7.18.10",
     "@babel/core": "^7.18.13",
-    "@babel/eslint-parser": "^7.18.9",
-    "@babel/eslint-plugin": "^7.18.10",
+    "@babel/eslint-parser": "^7.28.0",
+    "@babel/eslint-plugin": "^7.25.9",
     "@babel/preset-env": "^7.18.10",
-    "@babel/preset-flow": "^7.18.6",
+    "@babel/preset-typescript": "^7.27.1",
     "@babel/preset-react": "^7.18.6",
     "@commitlint/cli": "^17.1.2",
     "@commitlint/config-conventional": "^17.1.0",
@@ -80,16 +90,18 @@
     "chalk": "^5.0.1",
     "chromatic": "^6.11.4",
     "cspell": "^9.1.2",
-    "eslint": "^8.22.0",
-    "eslint-plugin-flowtype": "^8.0.3",
-    "eslint-plugin-import": "^2.26.0",
-    "eslint-plugin-jest": "^26.8.3",
-    "eslint-plugin-react": "^7.30.1",
-    "eslint-plugin-react-hooks": "^4.6.0",
-    "eslint-plugin-simple-import-sort": "^8.0.0",
-    "eslint-plugin-storybook": "^9.0.10",
-    "eslint-plugin-unused-imports": "^2.0.0",
+    "eslint": "^9.9.0",
+    "typescript-eslint": "^8.8.0",
+    "eslint-plugin-ft-flow": "^3.0.11",
+    "eslint-plugin-import": "^2.32.0",
+    "eslint-plugin-jest": "^29.0.1",
+    "eslint-plugin-react": "^7.37.5",
+    "eslint-plugin-react-hooks": "^5.2.0",
+    "eslint-plugin-simple-import-sort": "^12.1.1",
+    "eslint-plugin-storybook": "^9.1.2",
+    "eslint-plugin-unused-imports": "^4.1.4",
     "flow-bin": "^0.184.0",
+    "globals": "^16.3.0",
     "gulp": "^4.0.2",
     "gulp-babel": "^8.0.0",
     "gulp-rename": "^2.0.0",
@@ -108,7 +120,22 @@
     "storybook": "^9.0.10",
     "storybook-css-modules": "^1.0.8",
     "storybook-vscode-component": "^1.0.9",
-    "style-dictionary": "^3.7.1"
+    "style-dictionary": "^3.7.1",
+    "@types/babel-plugin-macros": "~3.1.3",
+    "@types/babel__core": "~7.20.5",
+    "@types/babel__preset-env": "~7.10.0",
+    "@types/eslint": "~9.6.1",
+    "@types/gulp": "~4.0.17",
+    "@types/gulp-babel": "~6.1.33",
+    "@types/gulp-rename": "~2.0.6",
+    "@types/invariant": "~2.2.37",
+    "@types/lint-staged": "~13.3.0",
+    "@types/lodash": "~4.17.20",
+    "@types/react": "~19.1.9",
+    "@types/react-dom": "~19.1.7",
+    "@types/react-window": "~1.8.8",
+    "@types/standard-version": "~7.1.3",
+    "typescript": "^5.9.2"
   },
   "homepage": "https://spaced-out.github.io/ui-design-system",
   "repository": {

package/tsconfig.declaration.json

@@ -0,0 +1,11 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "noEmit": false,
+    "emitDeclarationOnly": true,
+    "declaration": true,
+    "declarationMap": true,
+    "outDir": "./lib",
+    "noEmitOnError": false,
+  },
+}

package/tsconfig.json

@@ -0,0 +1,41 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "flow-to-typescript-codemod": [
+        "./src/types/flow-to-typescript-codemod.d.ts"
+      ]
+    },
+    "esModuleInterop": true,
+    "forceConsistentCasingInFileNames": true,
+    "isolatedModules": true,
+    "jsx": "react",
+    "moduleResolution": "node",
+    "noEmit": true,
+    "noFallthroughCasesInSwitch": true,
+    "noImplicitAny": false,
+    "noImplicitReturns": false,
+    "noImplicitThis": true,
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "resolveJsonModule": true,
+    "strict": true,
+    "rootDir": "./src",
+    "types": ["node"],
+    "target": "es2019",
+    "module": "commonjs",
+    "alwaysStrict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "skipLibCheck": true,
+    "typeRoots": ["./src/types/**/*", "./node_modules/@types"]
+  },
+  "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.d.ts", "src/types/**/*"],
+  "exclude": [
+    "**/__tests__/**",
+    "**/*.test.ts",
+    "**/*.test.tsx",
+    "**/*.stories.tsx",
+    "**/*.stories.module.css",
+    "src/stories/**"
+  ]
+}

package/.eslintignore

@@ -1,2 +0,0 @@
-/src/assets/fontawesome/
-node_modules/

package/.eslintrc.yml

@@ -1,122 +0,0 @@
-{
-  'root': true,
-  'env': {'browser': true, 'node': true, 'es2020': true},
-  'parser': '@babel/eslint-parser',
-  'plugins':
-    ['flowtype', '@babel', 'react', 'import', 'unused-imports', 'react-hooks','simple-import-sort'],
-  'settings': {'react': {'version': 'detect'}},
-  'globals': {'Iterator': 'readonly'},
-  'rules':
-    {
-      'arrow-body-style': ['warn', 'as-needed'],
-      'curly': ['warn', 'all'],
-      comma-spacing: ["warn", { "before": false, "after": true }],
-      'eol-last': 'warn',
-      'eqeqeq': ['error', 'always', {'null': 'ignore'}],
-      indent: ["error", 2],
-      'max-params': ['warn', {'max': 4}],
-      'no-alert': 'warn',
-      'no-console': ['error', {allow: ['warn', 'error']}],
-
-      'no-const-assign': 'error',
-      'no-dupe-args': 'error',
-      'no-dupe-keys': 'error',
-      'no-duplicate-case': 'error',
-      'no-dupe-class-members': 'error',
-      'no-empty-function': 'warn',
-      'no-empty-pattern': 'error',
-      'no-eval': 'error',
-      'no-extend-native': 'error',
-      'no-extra-boolean-cast': 'error',
-      'no-fallthrough': 'error',
-      'no-floating-decimal': 'error',
-      'no-inner-declarations': 'error',
-      'no-loop-func': 'error',
-      'no-mixed-requires': 'off',
-      'no-nested-ternary': 'off',
-      'no-new-symbol': 'error',
-      'no-redeclare': 'error',
-      'no-restricted-globals': ['error', 'event', 'location'],
-      'no-sparse-arrays': 'error',
-      'no-tabs': 'warn',
-      'no-this-before-super': 'error',
-      'no-trailing-spaces': 'warn',
-      'no-underscore-dangle': 'off',
-      'no-unmodified-loop-condition': 'warn',
-      'no-undef': ['error', {'typeof': true}],
-      'no-unreachable': 'warn',
-      'unused-imports/no-unused-imports': 'error',
-      'unused-imports/no-unused-vars':
-        [
-          'warn',
-          {
-            'vars': 'all',
-            'varsIgnorePattern': '^_',
-            'args': 'after-used',
-            'argsIgnorePattern': '^_',
-          },
-        ],
-      'no-useless-constructor': 'error',
-      'no-var': 'error',
-      'no-with': 'error',
-      'object-shorthand': 'error',
-      'prefer-arrow-callback': 'error',
-      'prefer-const': 'warn',
-      'prefer-spread': 'warn',
-      'quotes': ['warn', 'single', {'allowTemplateLiterals': true}],
-      'require-yield': 'error',
-      'rest-spread-spacing': 'error',
-      'strict': ['warn', 'never'],
-
-      'import/newline-after-import': ['warn', {'count': 2}],
-      'import/no-duplicates': 'error',
-
-      'react/jsx-no-undef': 'error',
-      'react/jsx-pascal-case': 'warn',
-      'react/jsx-uses-react': 'error',
-      'react/jsx-uses-vars': 'error',
-      'react/no-array-index-key': 'warn',
-      'react/no-deprecated': 'error',
-      'react/no-direct-mutation-state': 'error',
-      'react/no-string-refs': 'warn',
-      'react/prop-types': 'off',
-      'react/react-in-jsx-scope': 'error',
-
-      'flowtype/define-flow-type': 'error',
-      'flowtype/delimiter-dangle': ['warn', 'always-multiline'],
-      'flowtype/no-existential-type': 'warn',
-      'flowtype/no-weak-types': 'warn',
-      'flowtype/semi': ['warn', 'always'],
-
-      'react-hooks/rules-of-hooks': 'error',
-      "simple-import-sort/imports": "error",
-      "simple-import-sort/exports": "error"
-    },
-  'overrides':
-    [
-      {
-        'files': ['**/__tests__/*.js', '**/__tests__/*.jsx'],
-        'env': {'jest': true},
-        'plugins': ['jest'],
-      },
-      {'files': ['**/*.stories.jsx'], 'rules': {'semi': ['warn', 'always']}},
-      {
-        "files": ["*.js", "*.jsx", "*.ts", "*.tsx"],
-        "rules": {
-          "simple-import-sort/imports": [
-            "error",
-            {
-              "groups": [
-                ["^react", "^@?\\w"],
-                ["^(@|components)(/.*|$)"],
-                ["^\\u0000"],
-                ["^\\.\\.(?!/?$)", "^\\.\\./?$"],
-                ["^\\./(?=.*/)(?!/?$)", "^\\.(?!/?$)", "^\\./?$"],
-                ["^.+\\.?(css)$"]
-              ]
-            }
-          ]
-        }
-      }
-    ],
-}

package/lib/components/Accordion/Accordion.js.flow

@@ -1,116 +0,0 @@
-// @flow strict
-
-import * as React from 'react';
-
-import classify from '../../utils/classify';
-import {Button} from '../Button';
-import {Toggle} from '../Toggle';
-
-import css from './Accordion.module.css';
-
-
-export type AccordionClassNames = $ReadOnly<{
-  wrapper?: string,
-  headerWrapper?: string,
-  header?: string,
-  content?: string,
-}>;
-
-export type AccordionPropsType = {
-  id: string,
-  header: React.Node,
-  children: React.Node,
-  classNames?: AccordionClassNames,
-  isOpen?: boolean,
-  disabled?: boolean,
-  showToggle?: boolean,
-  onChange?: ?(id?: string, isOpen: boolean) => mixed,
-  onToggle?: ?(id?: string, checked?: boolean) => mixed,
-};
-
-export const Accordion: React$AbstractComponent<
-  AccordionPropsType,
-  HTMLDivElement,
-> = React.forwardRef<AccordionPropsType, HTMLDivElement>(
-  (
-    {
-      id,
-      header,
-      onChange,
-      onToggle,
-      disabled = false,
-      classNames,
-      isOpen = false,
-      showToggle = false,
-      children,
-    }: AccordionPropsType,
-    ref,
-  ) => {
-    const [accordionIsOpen, setAccordionIsOpen] = React.useState(isOpen);
-
-    const [checked, setChecked] = React.useState<boolean>(false);
-
-    const handleToggle = () => {
-      setChecked(!checked);
-      onToggle?.(id, !checked);
-    };
-
-    const handleAccordionClick = () => {
-      if (!disabled) {
-        onChange?.(id, !accordionIsOpen);
-        setAccordionIsOpen((prev) => !prev);
-      }
-    };
-
-    React.useEffect(() => {
-      setAccordionIsOpen(isOpen);
-    }, [isOpen]);
-
-    return (
-      <div
-        ref={ref}
-        data-testid="Accordion"
-        className={classify(css.wrapper, classNames?.wrapper)}
-      >
-        <div
-          className={classify(css.headerWrapper, classNames?.headerWrapper)}
-          onClick={handleAccordionClick}
-        >
-          <div className={classify(css.header, classNames?.header)}>
-            {showToggle && (
-              <div
-                onClick={(e) => {
-                  e.stopPropagation(); // prevent toggle click from triggering accordion toggle
-                }}
-              >
-                <Toggle
-                  checked={checked}
-                  onChange={handleToggle}
-                  ariaLabel={'toggle'}
-                />
-              </div>
-            )}
-            {header}
-          </div>
-          <Button
-            iconLeftName={accordionIsOpen ? 'chevron-up' : 'chevron-down'}
-            disabled={disabled}
-            size="small"
-            type="ghost"
-            className={css.icon}
-            ariaLabel={'Collapse button'}
-            // we are not defining onClick here as we are using onClick of the parent here.
-          />
-        </div>
-
-        {accordionIsOpen && (
-          <div className={classify(css.content, classNames?.content)}>
-            {children}
-          </div>
-        )}
-      </div>
-    );
-  },
-);
-
-Accordion.displayName = 'Accordion';

package/lib/components/Accordion/AccordionGroup.js.flow

@@ -1,75 +0,0 @@
-// @flow strict
-
-import * as React from 'react';
-
-import classify from '../../utils/classify';
-
-import css from './AccordionGroup.module.css';
-
-
-export type AccordionGroupClassNames = $ReadOnly<{
-  wrapper?: string,
-}>;
-
-export type AccordionGroupPropsType = {
-  children: React.Node,
-  onAccordionClick?: (id: string, isOpen: boolean) => mixed,
-  onToggle?: (id: string, checked?: boolean) => mixed,
-  enabledToggleIds?: Array<string>,
-  initialOpenId?: string,
-  classNames?: AccordionGroupClassNames,
-};
-
-export const AccordionGroup = ({
-  children,
-  onAccordionClick,
-  onToggle,
-  enabledToggleIds = [],
-  initialOpenId = '',
-  classNames,
-}: AccordionGroupPropsType): React.Node => {
-  const [openId, setOpenedId] = React.useState(initialOpenId);
-  const [checks, setChecks] = React.useState(enabledToggleIds);
-  const handleAccordionChange = (id, isOpen) => {
-    setOpenedId(isOpen ? id : '');
-    onAccordionClick?.(id, isOpen);
-  };
-  const handleToggle = (id, checked) => {
-    setChecks((prev) =>
-      checked ? [...prev, id] : prev.filter((x) => x !== id),
-    );
-    setOpenedId((prev) => (checked ? id : prev === id ? '' : prev));
-    onToggle?.(id, checked);
-  };
-  const enhancedChildren = React.Children.map(children, (child) => {
-    if (!React.isValidElement(child)) {
-      return null;
-    }
-
-    const childId = child.props.id;
-
-    const isDisabled = !checks.includes(childId);
-
-    const isOpen = openId === childId;
-
-    return React.cloneElement(child, {
-      classNames: {
-        headerWrapper: css.accordionHeaderWrapper,
-        wrapper: css.accordionWrapper,
-      },
-      onChange: handleAccordionChange,
-      onToggle: handleToggle,
-      showToggle: true,
-      disabled: isDisabled,
-      isOpen,
-    });
-  });
-
-  return (
-    <div className={classify(css.wrapper, classNames?.wrapper)}>
-      {enhancedChildren}
-    </div>
-  );
-};
-
-AccordionGroup.displayName = 'AccordionGroup';

package/lib/components/Accordion/index.js.flow

@@ -1,4 +0,0 @@
-// @flow strict
-
-export * from './Accordion';
-export * from './AccordionGroup';