@teambit/component.ui.component-compare.version-picker 0.0.0-1907599d05327d861524936122c9509a6ae21da7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (14) hide show
  1. package/component-compare-version-picker.module.scss +67 -0
  2. package/component-compare-version-picker.tsx +131 -0
  3. package/dist/component-compare-version-picker.d.ts +11 -0
  4. package/dist/component-compare-version-picker.js +95 -0
  5. package/dist/component-compare-version-picker.js.map +1 -0
  6. package/dist/component-compare-version-picker.module.scss +67 -0
  7. package/dist/index.d.ts +2 -0
  8. package/dist/index.js +6 -0
  9. package/dist/index.js.map +1 -0
  10. package/dist/preview-1752267760470.js +7 -0
  11. package/index.ts +2 -0
  12. package/package.json +56 -0
  13. package/types/asset.d.ts +29 -0
  14. package/types/style.d.ts +42 -0
package/component-compare-version-picker.module.scss ADDED
@@ -0,0 +1,67 @@
1
+ @import '@teambit/ui-foundation.ui.constants.z-indexes/z-indexes.module.scss';
2
+
3
+ .componentCompareVersionPicker {
4
+ display: flex;
5
+ flex-direction: row;
6
+ padding: 8px 0px;
7
+ flex-wrap: wrap;
8
+ align-items: center;
9
+ }
10
+
11
+ .componentCompareVersionMenu {
12
+ left: 0;
13
+ min-width: 400px;
14
+ }
15
+ .showMenuOverNav {
16
+ z-index: $modal-z-index + 1 !important;
17
+ }
18
+
19
+ .dropdownContainer {
20
+ display: flex;
21
+ align-items: center;
22
+ }
23
+
24
+ .componentCompareVersionPlaceholder {
25
+ display: flex;
26
+ align-items: center;
27
+ justify-content: space-between;
28
+ }
29
+
30
+ .componentCompareVersionContainer {
31
+ display: flex;
32
+ min-width: 0;
33
+ align-items: center;
34
+ font-size: 14px;
35
+
36
+ &.left {
37
+ padding-right: 16px;
38
+ }
39
+ &.right {
40
+ padding-left: 16px;
41
+ }
42
+ }
43
+
44
+ .componentCompareDropdown {
45
+ width: 100%;
46
+ }
47
+ .arrowContainer {
48
+ height: 60%;
49
+ align-self: center;
50
+ display: flex;
51
+ img {
52
+ display: flex;
53
+ align-self: center;
54
+ height: 100%;
55
+ }
56
+ }
57
+
58
+ .titleText {
59
+ display: flex;
60
+ align-self: center;
61
+ font-size: 16px;
62
+ font-weight: bold;
63
+ }
64
+
65
+ .rightPad {
66
+ padding-right: 8px;
67
+ }
package/component-compare-version-picker.tsx ADDED
@@ -0,0 +1,131 @@
1
+ import React, { HTMLAttributes } from 'react';
2
+ import { DetailedVersion, VersionDropdown } from '@teambit/component.ui.version-dropdown';
3
+ import { useUpdatedUrlFromQuery } from '@teambit/component.ui.component-compare.hooks.use-component-compare-url';
4
+ import { useComponentCompare } from '@teambit/component.ui.component-compare.context';
5
+ import { UseComponentType } from '@teambit/component';
6
+ import classNames from 'classnames';
7
+ import * as semver from 'semver';
8
+
9
+ import styles from './component-compare-version-picker.module.scss';
10
+
11
+ export type ComponentCompareVersionPickerProps = {
12
+ customUseComponent?: UseComponentType;
13
+ host: string;
14
+ baseVersion?: string;
15
+ compareVersion?: string;
16
+ compareHasLocalChanges?: boolean;
17
+ componentId: string;
18
+ } & HTMLAttributes<HTMLDivElement>;
19
+
20
+ export function ComponentCompareVersionPicker({
21
+ className,
22
+ compareVersion: compareVersionFromProps,
23
+ baseVersion: baseVersionFromProps,
24
+ componentId: componentIdFromProps,
25
+ compareHasLocalChanges,
26
+ }: ComponentCompareVersionPickerProps) {
27
+ const componentCompare = useComponentCompare();
28
+ const compare = componentCompare?.compare?.model;
29
+ const componentId = componentIdFromProps || compare?.id.toStringWithoutVersion();
30
+ const compareVersion = compareHasLocalChanges ? 'workspace' : compareVersionFromProps || compare?.version;
31
+ const baseVersion = baseVersionFromProps || componentCompare?.base?.model.version;
32
+
33
+ const componentLogs = componentCompare?.compare?.model;
34
+ const loadingLogs = !componentCompare?.compare?.model.logs;
35
+
36
+ const useVersions = React.useCallback(
37
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
38
+ (filter: (version: string) => boolean = (version) => true) =>
39
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
40
+ (props?: { skip?: boolean }) => {
41
+ return {
42
+ loading: loadingLogs,
43
+ ...componentLogs,
44
+ snaps: (componentLogs?.logs || [])
45
+ .map((snap) => ({ ...snap, version: snap.hash }))
46
+ .filter((log) => {
47
+ if (log.tag) return false;
48
+ const version = log.hash;
49
+ return compareHasLocalChanges || filter?.(version);
50
+ }),
51
+ tags: (componentLogs?.logs || [])
52
+ .map((tag) => ({ ...tag, version: tag.tag as string }))
53
+ .filter((log) => {
54
+ if (!log.tag) return false;
55
+ const version = log.tag;
56
+ return compareHasLocalChanges || filter?.(version);
57
+ }),
58
+ };
59
+ },
60
+ [componentId, compareHasLocalChanges, loadingLogs, componentLogs?.logs?.length]
61
+ );
62
+
63
+ const { tags, snaps, loading } = useVersions()();
64
+
65
+ const useVersion = (filter?: (version: string) => boolean) => (props?: { version?: string; skip?: boolean }) => {
66
+ const { version, skip } = props || {};
67
+ const versionData = useVersions(filter)({ skip });
68
+ const isTag = React.useMemo(() => semver.valid(version), [loading, version]);
69
+ if (isTag) {
70
+ return React.useMemo(
71
+ () => versionData?.tags?.find((tag) => tag.tag === version),
72
+ [loading, tags?.length, version]
73
+ );
74
+ }
75
+ return React.useMemo(
76
+ () => versionData?.snaps?.find((snap) => snap.version === version),
77
+ [loading, snaps?.length, version]
78
+ );
79
+ };
80
+
81
+ const useCompareVersion = React.useCallback(
82
+ (props?: { version?: string; skip?: boolean }) => {
83
+ const { version } = props || {};
84
+ const isTag = semver.valid(version);
85
+ if (isTag) {
86
+ return tags?.find((tag) => tag.tag === version);
87
+ }
88
+ return snaps?.find((snap) => snap.version === version);
89
+ },
90
+ [tags.length, snaps.length, loading]
91
+ );
92
+
93
+ return (
94
+ <div className={styles.componentCompareVersionPicker}>
95
+ <div className={classNames(styles.dropdownContainer)}>
96
+ <span className={classNames(styles.rightPad, styles.titleText)}>Comparing</span>
97
+ <VersionDropdown
98
+ className={classNames(styles.componentCompareVersionContainer, styles.left, className)}
99
+ dropdownClassName={styles.componentCompareDropdown}
100
+ placeholderClassName={styles.componentCompareVersionPlaceholder}
101
+ menuClassName={classNames(styles.componentCompareVersionMenu, styles.showMenuOverNav)}
102
+ currentVersion={baseVersion as string}
103
+ overrideVersionHref={(_baseVersion) => {
104
+ return useUpdatedUrlFromQuery({ baseVersion: _baseVersion });
105
+ }}
106
+ disabled={(compare?.logs?.length ?? 0) < 2}
107
+ hasMoreVersions={(compare?.logs?.length ?? 0) > 1}
108
+ showVersionDetails={true}
109
+ useComponentVersions={useVersions((version) => version !== compare?.id.version)}
110
+ useCurrentVersionLog={useVersion((version) => version !== compare?.id.version)}
111
+ PlaceholderComponent={DetailedVersion}
112
+ />
113
+ </div>
114
+ <div className={styles.dropdownContainer}>
115
+ <span className={styles.titleText}>with</span>
116
+ <VersionDropdown
117
+ className={classNames(styles.componentCompareVersionContainer, styles.right)}
118
+ dropdownClassName={styles.componentCompareDropdown}
119
+ placeholderClassName={styles.componentCompareVersionPlaceholder}
120
+ menuClassName={styles.componentCompareVersionMenu}
121
+ disabled={true}
122
+ currentVersion={compareVersion as string}
123
+ PlaceholderComponent={DetailedVersion}
124
+ useCurrentVersionLog={useCompareVersion}
125
+ useComponentVersions={useVersions()}
126
+ showVersionDetails={true}
127
+ />
128
+ </div>
129
+ </div>
130
+ );
131
+ }
package/dist/component-compare-version-picker.d.ts ADDED
@@ -0,0 +1,11 @@
1
+ import React, { HTMLAttributes } from 'react';
2
+ import { UseComponentType } from '@teambit/component';
3
+ export type ComponentCompareVersionPickerProps = {
4
+ customUseComponent?: UseComponentType;
5
+ host: string;
6
+ baseVersion?: string;
7
+ compareVersion?: string;
8
+ compareHasLocalChanges?: boolean;
9
+ componentId: string;
10
+ } & HTMLAttributes<HTMLDivElement>;
11
+ export declare function ComponentCompareVersionPicker({ className, compareVersion: compareVersionFromProps, baseVersion: baseVersionFromProps, componentId: componentIdFromProps, compareHasLocalChanges, }: ComponentCompareVersionPickerProps): React.JSX.Element;
package/dist/component-compare-version-picker.js ADDED
@@ -0,0 +1,95 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || function (mod) {
19
+ if (mod && mod.__esModule) return mod;
20
+ var result = {};
21
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
+ __setModuleDefault(result, mod);
23
+ return result;
24
+ };
25
+ var __importDefault = (this && this.__importDefault) || function (mod) {
26
+ return (mod && mod.__esModule) ? mod : { "default": mod };
27
+ };
28
+ Object.defineProperty(exports, "__esModule", { value: true });
29
+ exports.ComponentCompareVersionPicker = ComponentCompareVersionPicker;
30
+ const react_1 = __importDefault(require("react"));
31
+ const component_ui_version_dropdown_1 = require("@teambit/component.ui.version-dropdown");
32
+ const component_ui_component_compare_hooks_use_component_compare_url_1 = require("@teambit/component.ui.component-compare.hooks.use-component-compare-url");
33
+ const component_ui_component_compare_context_1 = require("@teambit/component.ui.component-compare.context");
34
+ const classnames_1 = __importDefault(require("classnames"));
35
+ const semver = __importStar(require("semver"));
36
+ const component_compare_version_picker_module_scss_1 = __importDefault(require("./component-compare-version-picker.module.scss"));
37
+ function ComponentCompareVersionPicker({ className, compareVersion: compareVersionFromProps, baseVersion: baseVersionFromProps, componentId: componentIdFromProps, compareHasLocalChanges, }) {
38
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j;
39
+ const componentCompare = (0, component_ui_component_compare_context_1.useComponentCompare)();
40
+ const compare = (_a = componentCompare === null || componentCompare === void 0 ? void 0 : componentCompare.compare) === null || _a === void 0 ? void 0 : _a.model;
41
+ const componentId = componentIdFromProps || (compare === null || compare === void 0 ? void 0 : compare.id.toStringWithoutVersion());
42
+ const compareVersion = compareHasLocalChanges ? 'workspace' : compareVersionFromProps || (compare === null || compare === void 0 ? void 0 : compare.version);
43
+ const baseVersion = baseVersionFromProps || ((_b = componentCompare === null || componentCompare === void 0 ? void 0 : componentCompare.base) === null || _b === void 0 ? void 0 : _b.model.version);
44
+ const componentLogs = (_c = componentCompare === null || componentCompare === void 0 ? void 0 : componentCompare.compare) === null || _c === void 0 ? void 0 : _c.model;
45
+ const loadingLogs = !((_d = componentCompare === null || componentCompare === void 0 ? void 0 : componentCompare.compare) === null || _d === void 0 ? void 0 : _d.model.logs);
46
+ const useVersions = react_1.default.useCallback(
47
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
48
+ (filter = (version) => true) =>
49
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
50
+ (props) => {
51
+ return Object.assign(Object.assign({ loading: loadingLogs }, componentLogs), { snaps: ((componentLogs === null || componentLogs === void 0 ? void 0 : componentLogs.logs) || [])
52
+ .map((snap) => (Object.assign(Object.assign({}, snap), { version: snap.hash })))
53
+ .filter((log) => {
54
+ if (log.tag)
55
+ return false;
56
+ const version = log.hash;
57
+ return compareHasLocalChanges || (filter === null || filter === void 0 ? void 0 : filter(version));
58
+ }), tags: ((componentLogs === null || componentLogs === void 0 ? void 0 : componentLogs.logs) || [])
59
+ .map((tag) => (Object.assign(Object.assign({}, tag), { version: tag.tag })))
60
+ .filter((log) => {
61
+ if (!log.tag)
62
+ return false;
63
+ const version = log.tag;
64
+ return compareHasLocalChanges || (filter === null || filter === void 0 ? void 0 : filter(version));
65
+ }) });
66
+ }, [componentId, compareHasLocalChanges, loadingLogs, (_e = componentLogs === null || componentLogs === void 0 ? void 0 : componentLogs.logs) === null || _e === void 0 ? void 0 : _e.length]);
67
+ const { tags, snaps, loading } = useVersions()();
68
+ const useVersion = (filter) => (props) => {
69
+ const { version, skip } = props || {};
70
+ const versionData = useVersions(filter)({ skip });
71
+ const isTag = react_1.default.useMemo(() => semver.valid(version), [loading, version]);
72
+ if (isTag) {
73
+ return react_1.default.useMemo(() => { var _a; return (_a = versionData === null || versionData === void 0 ? void 0 : versionData.tags) === null || _a === void 0 ? void 0 : _a.find((tag) => tag.tag === version); }, [loading, tags === null || tags === void 0 ? void 0 : tags.length, version]);
74
+ }
75
+ return react_1.default.useMemo(() => { var _a; return (_a = versionData === null || versionData === void 0 ? void 0 : versionData.snaps) === null || _a === void 0 ? void 0 : _a.find((snap) => snap.version === version); }, [loading, snaps === null || snaps === void 0 ? void 0 : snaps.length, version]);
76
+ };
77
+ const useCompareVersion = react_1.default.useCallback((props) => {
78
+ const { version } = props || {};
79
+ const isTag = semver.valid(version);
80
+ if (isTag) {
81
+ return tags === null || tags === void 0 ? void 0 : tags.find((tag) => tag.tag === version);
82
+ }
83
+ return snaps === null || snaps === void 0 ? void 0 : snaps.find((snap) => snap.version === version);
84
+ }, [tags.length, snaps.length, loading]);
85
+ return (react_1.default.createElement("div", { className: component_compare_version_picker_module_scss_1.default.componentCompareVersionPicker },
86
+ react_1.default.createElement("div", { className: (0, classnames_1.default)(component_compare_version_picker_module_scss_1.default.dropdownContainer) },
87
+ react_1.default.createElement("span", { className: (0, classnames_1.default)(component_compare_version_picker_module_scss_1.default.rightPad, component_compare_version_picker_module_scss_1.default.titleText) }, "Comparing"),
88
+ react_1.default.createElement(component_ui_version_dropdown_1.VersionDropdown, { className: (0, classnames_1.default)(component_compare_version_picker_module_scss_1.default.componentCompareVersionContainer, component_compare_version_picker_module_scss_1.default.left, className), dropdownClassName: component_compare_version_picker_module_scss_1.default.componentCompareDropdown, placeholderClassName: component_compare_version_picker_module_scss_1.default.componentCompareVersionPlaceholder, menuClassName: (0, classnames_1.default)(component_compare_version_picker_module_scss_1.default.componentCompareVersionMenu, component_compare_version_picker_module_scss_1.default.showMenuOverNav), currentVersion: baseVersion, overrideVersionHref: (_baseVersion) => {
89
+ return (0, component_ui_component_compare_hooks_use_component_compare_url_1.useUpdatedUrlFromQuery)({ baseVersion: _baseVersion });
90
+ }, disabled: ((_g = (_f = compare === null || compare === void 0 ? void 0 : compare.logs) === null || _f === void 0 ? void 0 : _f.length) !== null && _g !== void 0 ? _g : 0) < 2, hasMoreVersions: ((_j = (_h = compare === null || compare === void 0 ? void 0 : compare.logs) === null || _h === void 0 ? void 0 : _h.length) !== null && _j !== void 0 ? _j : 0) > 1, showVersionDetails: true, useComponentVersions: useVersions((version) => version !== (compare === null || compare === void 0 ? void 0 : compare.id.version)), useCurrentVersionLog: useVersion((version) => version !== (compare === null || compare === void 0 ? void 0 : compare.id.version)), PlaceholderComponent: component_ui_version_dropdown_1.DetailedVersion })),
91
+ react_1.default.createElement("div", { className: component_compare_version_picker_module_scss_1.default.dropdownContainer },
92
+ react_1.default.createElement("span", { className: component_compare_version_picker_module_scss_1.default.titleText }, "with"),
93
+ react_1.default.createElement(component_ui_version_dropdown_1.VersionDropdown, { className: (0, classnames_1.default)(component_compare_version_picker_module_scss_1.default.componentCompareVersionContainer, component_compare_version_picker_module_scss_1.default.right), dropdownClassName: component_compare_version_picker_module_scss_1.default.componentCompareDropdown, placeholderClassName: component_compare_version_picker_module_scss_1.default.componentCompareVersionPlaceholder, menuClassName: component_compare_version_picker_module_scss_1.default.componentCompareVersionMenu, disabled: true, currentVersion: compareVersion, PlaceholderComponent: component_ui_version_dropdown_1.DetailedVersion, useCurrentVersionLog: useCompareVersion, useComponentVersions: useVersions(), showVersionDetails: true }))));
94
+ }
95
+ //# sourceMappingURL=component-compare-version-picker.js.map
package/dist/component-compare-version-picker.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"component-compare-version-picker.js","sourceRoot":"","sources":["../component-compare-version-picker.tsx"],"names":[],"mappings":"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"}
package/dist/component-compare-version-picker.module.scss ADDED
@@ -0,0 +1,67 @@
1
+ @import '@teambit/ui-foundation.ui.constants.z-indexes/z-indexes.module.scss';
2
+
3
+ .componentCompareVersionPicker {
4
+ display: flex;
5
+ flex-direction: row;
6
+ padding: 8px 0px;
7
+ flex-wrap: wrap;
8
+ align-items: center;
9
+ }
10
+
11
+ .componentCompareVersionMenu {
12
+ left: 0;
13
+ min-width: 400px;
14
+ }
15
+ .showMenuOverNav {
16
+ z-index: $modal-z-index + 1 !important;
17
+ }
18
+
19
+ .dropdownContainer {
20
+ display: flex;
21
+ align-items: center;
22
+ }
23
+
24
+ .componentCompareVersionPlaceholder {
25
+ display: flex;
26
+ align-items: center;
27
+ justify-content: space-between;
28
+ }
29
+
30
+ .componentCompareVersionContainer {
31
+ display: flex;
32
+ min-width: 0;
33
+ align-items: center;
34
+ font-size: 14px;
35
+
36
+ &.left {
37
+ padding-right: 16px;
38
+ }
39
+ &.right {
40
+ padding-left: 16px;
41
+ }
42
+ }
43
+
44
+ .componentCompareDropdown {
45
+ width: 100%;
46
+ }
47
+ .arrowContainer {
48
+ height: 60%;
49
+ align-self: center;
50
+ display: flex;
51
+ img {
52
+ display: flex;
53
+ align-self: center;
54
+ height: 100%;
55
+ }
56
+ }
57
+
58
+ .titleText {
59
+ display: flex;
60
+ align-self: center;
61
+ font-size: 16px;
62
+ font-weight: bold;
63
+ }
64
+
65
+ .rightPad {
66
+ padding-right: 8px;
67
+ }
package/dist/index.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ export { ComponentCompareVersionPicker } from './component-compare-version-picker';
2
+ export type { ComponentCompareVersionPickerProps } from './component-compare-version-picker';
package/dist/index.js ADDED
@@ -0,0 +1,6 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.ComponentCompareVersionPicker = void 0;
4
+ var component_compare_version_picker_1 = require("./component-compare-version-picker");
5
+ Object.defineProperty(exports, "ComponentCompareVersionPicker", { enumerable: true, get: function () { return component_compare_version_picker_1.ComponentCompareVersionPicker; } });
6
+ //# sourceMappingURL=index.js.map
package/dist/index.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":";;;AAAA,uFAAmF;AAA1E,iJAAA,6BAA6B,OAAA"}
package/dist/preview-1752267760470.js ADDED
@@ -0,0 +1,7 @@
1
+ ;
2
+ ;
3
+
4
+ export const compositions = [];
5
+ export const overview = [];
6
+
7
+ export const compositions_metadata = {"compositions":[]};
package/index.ts ADDED
@@ -0,0 +1,2 @@
1
+ export { ComponentCompareVersionPicker } from './component-compare-version-picker';
2
+ export type { ComponentCompareVersionPickerProps } from './component-compare-version-picker';
package/package.json ADDED
@@ -0,0 +1,56 @@
1
+ {
2
+ "name": "@teambit/component.ui.component-compare.version-picker",
3
+ "version": "0.0.0-1907599d05327d861524936122c9509a6ae21da7",
4
+ "homepage": "https://bit.cloud/teambit/component/ui/component-compare/version-picker",
5
+ "main": "dist/index.js",
6
+ "componentId": {
7
+ "scope": "teambit.component",
8
+ "name": "ui/component-compare/version-picker",
9
+ "version": "1907599d05327d861524936122c9509a6ae21da7"
10
+ },
11
+ "dependencies": {
12
+ "classnames": "2.2.6",
13
+ "semver": "7.7.1",
14
+ "core-js": "^3.0.0",
15
+ "@teambit/ui-foundation.ui.constants.z-indexes": "0.0.504",
16
+ "@teambit/component.ui.component-compare.hooks.use-component-compare-url": "0.0.13",
17
+ "@teambit/component.ui.component-compare.context": "0.0.0-7c47c29b5cd9231a833d4cca0f632dfeaba76844",
18
+ "@teambit/component.ui.version-dropdown": "0.0.891"
19
+ },
20
+ "devDependencies": {
21
+ "@types/classnames": "2.2.11",
22
+ "@types/react": "^17.0.8",
23
+ "@types/semver": "7.5.8",
24
+ "@types/mocha": "9.1.0",
25
+ "@types/node": "12.20.4",
26
+ "@types/react-dom": "^17.0.5",
27
+ "@types/jest": "^26.0.0",
28
+ "@babel/runtime": "7.20.0",
29
+ "@types/testing-library__jest-dom": "5.9.5"
30
+ },
31
+ "peerDependencies": {
32
+ "react": "^16.8.0 || ^17.0.0",
33
+ "react-dom": "^16.8.0 || ^17.0.0"
34
+ },
35
+ "license": "Apache-2.0",
36
+ "optionalDependencies": {},
37
+ "peerDependenciesMeta": {},
38
+ "private": false,
39
+ "engines": {
40
+ "node": ">=12.22.0"
41
+ },
42
+ "repository": {
43
+ "type": "git",
44
+ "url": "https://github.com/teambit/bit"
45
+ },
46
+ "keywords": [
47
+ "bit",
48
+ "components",
49
+ "collaboration",
50
+ "web",
51
+ "react",
52
+ "react-components",
53
+ "angular",
54
+ "angular-components"
55
+ ]
56
+ }
package/types/asset.d.ts ADDED
@@ -0,0 +1,29 @@
1
+ declare module '*.png' {
2
+ const value: any;
3
+ export = value;
4
+ }
5
+ declare module '*.svg' {
6
+ import type { FunctionComponent, SVGProps } from 'react';
7
+
8
+ export const ReactComponent: FunctionComponent<SVGProps<SVGSVGElement> & { title?: string }>;
9
+ const src: string;
10
+ export default src;
11
+ }
12
+
13
+ // @TODO Gilad
14
+ declare module '*.jpg' {
15
+ const value: any;
16
+ export = value;
17
+ }
18
+ declare module '*.jpeg' {
19
+ const value: any;
20
+ export = value;
21
+ }
22
+ declare module '*.gif' {
23
+ const value: any;
24
+ export = value;
25
+ }
26
+ declare module '*.bmp' {
27
+ const value: any;
28
+ export = value;
29
+ }
package/types/style.d.ts ADDED
@@ -0,0 +1,42 @@
1
+ declare module '*.module.css' {
2
+ const classes: { readonly [key: string]: string };
3
+ export default classes;
4
+ }
5
+ declare module '*.module.scss' {
6
+ const classes: { readonly [key: string]: string };
7
+ export default classes;
8
+ }
9
+ declare module '*.module.sass' {
10
+ const classes: { readonly [key: string]: string };
11
+ export default classes;
12
+ }
13
+
14
+ declare module '*.module.less' {
15
+ const classes: { readonly [key: string]: string };
16
+ export default classes;
17
+ }
18
+
19
+ declare module '*.less' {
20
+ const classes: { readonly [key: string]: string };
21
+ export default classes;
22
+ }
23
+
24
+ declare module '*.css' {
25
+ const classes: { readonly [key: string]: string };
26
+ export default classes;
27
+ }
28
+
29
+ declare module '*.sass' {
30
+ const classes: { readonly [key: string]: string };
31
+ export default classes;
32
+ }
33
+
34
+ declare module '*.scss' {
35
+ const classes: { readonly [key: string]: string };
36
+ export default classes;
37
+ }
38
+
39
+ declare module '*.mdx' {
40
+ const component: any;
41
+ export default component;
42
+ }