@mrshmllw/smores-react 2.1.23 → 2.1.26

package/dist/Toggle/Toggle.d.ts

@@ -1,7 +1,7 @@
 import { FC } from 'react';
 declare type Props = {
     /** unique ID */
-    id: string;
+    id?: string;
     /** checked flag  */
     checked: boolean;
     /** onToggle listener  */

package/dist/Toggle/Toggle.stories.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 declare const _default: {
     title: string;
     component: React.FC<{
-        id: string;
+        id?: string | undefined;
         checked: boolean;
         onToggle: () => void;
     }>;

package/dist/index.d.ts

@@ -22,6 +22,7 @@ export * from './Pagination';
 export * from './RadioButton';
 export * from './Row';
 export * from './SearchInput';
+export * from './SupportMessage';
 export * from './Tag';
 export * from './Text';
 export * from './Textarea';

package/dist/index.js

@@ -22,6 +22,7 @@ export * from './Pagination';
 export * from './RadioButton';
 export * from './Row';
 export * from './SearchInput';
+export * from './SupportMessage';
 export * from './Tag';
 export * from './Text';
 export * from './Textarea';

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA;AAC3B,cAAc,kBAAkB,CAAA;AAChC,cAAc,OAAO,CAAA;AACrB,cAAc,UAAU,CAAA;AACxB,cAAc,QAAQ,CAAA;AACtB,cAAc,YAAY,CAAA;AAC1B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,QAAQ,CAAA;AACtB,cAAc,4BAA4B,CAAA;AAC1C,cAAc,cAAc,CAAA;AAC5B,cAAc,WAAW,CAAA;AACzB,cAAc,YAAY,CAAA;AAC1B,cAAc,SAAS,CAAA;AACvB,cAAc,QAAQ,CAAA;AACtB,cAAc,eAAe,CAAA;AAC7B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,UAAU,CAAA;AACxB,cAAc,WAAW,CAAA;AACzB,cAAc,SAAS,CAAA;AACvB,cAAc,eAAe,CAAA;AAC7B,cAAc,cAAc,CAAA;AAC5B,cAAc,eAAe,CAAA;AAC7B,cAAc,OAAO,CAAA;AACrB,cAAc,eAAe,CAAA;AAC7B,cAAc,OAAO,CAAA;AACrB,cAAc,QAAQ,CAAA;AACtB,cAAc,YAAY,CAAA;AAC1B,cAAc,aAAa,CAAA;AAC3B,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA;AAC3B,cAAc,kBAAkB,CAAA;AAChC,cAAc,OAAO,CAAA;AACrB,cAAc,UAAU,CAAA;AACxB,cAAc,QAAQ,CAAA;AACtB,cAAc,YAAY,CAAA;AAC1B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,QAAQ,CAAA;AACtB,cAAc,4BAA4B,CAAA;AAC1C,cAAc,cAAc,CAAA;AAC5B,cAAc,WAAW,CAAA;AACzB,cAAc,YAAY,CAAA;AAC1B,cAAc,SAAS,CAAA;AACvB,cAAc,QAAQ,CAAA;AACtB,cAAc,eAAe,CAAA;AAC7B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,UAAU,CAAA;AACxB,cAAc,WAAW,CAAA;AACzB,cAAc,SAAS,CAAA;AACvB,cAAc,eAAe,CAAA;AAC7B,cAAc,cAAc,CAAA;AAC5B,cAAc,eAAe,CAAA;AAC7B,cAAc,OAAO,CAAA;AACrB,cAAc,eAAe,CAAA;AAC7B,cAAc,kBAAkB,CAAA;AAChC,cAAc,OAAO,CAAA;AACrB,cAAc,QAAQ,CAAA;AACtB,cAAc,YAAY,CAAA;AAC1B,cAAc,aAAa,CAAA;AAC3B,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA"}

package/dist/setupTests.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/setupTests.js

@@ -0,0 +1,2 @@
+import '@testing-library/jest-dom';
+//# sourceMappingURL=setupTests.js.map

package/dist/setupTests.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"setupTests.js","sourceRoot":"","sources":["../src/setupTests.ts"],"names":[],"mappings":"AAAA,OAAO,2BAA2B,CAAA"}

package/dist/utils/deprecated.d.ts

@@ -0,0 +1,9 @@
+export declare const isLocal: boolean;
+declare type UseDeprecatedWarningParams = {
+    enabled?: boolean;
+    title: string;
+    message: string;
+    componentProps?: Record<string, any>;
+};
+export declare const useDeprecatedWarning: ({ enabled, title, message, componentProps, }: UseDeprecatedWarningParams) => void;
+export {};

package/dist/utils/deprecated.js

@@ -0,0 +1,30 @@
+import { useEffect } from 'react';
+const env = process.env.REACT_APP_NODE_ENV || process.env.ENV;
+export const isLocal = env === 'local';
+const stripUndefinedProps = (props) => {
+    const propKeys = Object.keys(props);
+    return propKeys.reduce((acc, key) => {
+        if (props[key] !== undefined) {
+            acc[key] = props[key];
+        }
+        return acc;
+    }, {});
+};
+export const useDeprecatedWarning = ({ enabled = true, title, message, componentProps, }) => {
+    useEffect(() => {
+        if (isLocal && enabled) {
+            const logs = [
+                `%c[Deprecated] ${title}`,
+                'font-weight:bold;',
+                '\n',
+                '\n',
+                message,
+            ];
+            if (componentProps) {
+                logs.push('\n', '\n', 'Component props:', stripUndefinedProps(componentProps));
+            }
+            console.warn(...logs);
+        }
+    }, [enabled]);
+};
+//# sourceMappingURL=deprecated.js.map

package/dist/utils/deprecated.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"deprecated.js","sourceRoot":"","sources":["../../src/utils/deprecated.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,MAAM,GAAG,GAAG,OAAO,CAAC,GAAG,CAAC,kBAAkB,IAAI,OAAO,CAAC,GAAG,CAAC,GAAG,CAAA;AAE7D,MAAM,CAAC,MAAM,OAAO,GAAG,GAAG,KAAK,OAAO,CAAA;AAEtC,MAAM,mBAAmB,GAAG,CAAC,KAA8B,EAAE,EAAE;IAC7D,MAAM,QAAQ,GAAG,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;IAEnC,OAAO,QAAQ,CAAC,MAAM,CAA0B,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE;QAC3D,IAAI,KAAK,CAAC,GAAG,CAAC,KAAK,SAAS,EAAE;YAC5B,GAAG,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,CAAA;SACtB;QACD,OAAO,GAAG,CAAA;IACZ,CAAC,EAAE,EAAE,CAAC,CAAA;AACR,CAAC,CAAA;AASD,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,EACnC,OAAO,GAAG,IAAI,EACd,KAAK,EACL,OAAO,EACP,cAAc,GACa,EAAQ,EAAE;IACrC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,OAAO,IAAI,OAAO,EAAE;YACtB,MAAM,IAAI,GAAU;gBAClB,kBAAkB,KAAK,EAAE;gBACzB,mBAAmB;gBACnB,IAAI;gBACJ,IAAI;gBACJ,OAAO;aACR,CAAA;YAED,IAAI,cAAc,EAAE;gBAClB,IAAI,CAAC,IAAI,CACP,IAAI,EACJ,IAAI,EACJ,kBAAkB,EAClB,mBAAmB,CAAC,cAAc,CAAC,CACpC,CAAA;aACF;YAED,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,CAAA;SACtB;IACH,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAA;AACf,CAAC,CAAA"}

package/dist/utils/id.d.ts

@@ -0,0 +1,2 @@
+export declare const smoresIdPrefix = "MM_SMORES";
+export declare const useUniqueId: (id?: string) => string;

package/dist/utils/id.js

@@ -0,0 +1,13 @@
+import { useMemo } from 'react';
+let idCount = 0;
+export const smoresIdPrefix = 'MM_SMORES';
+const createId = () => {
+    const id = `${smoresIdPrefix}_${idCount}`;
+    idCount += 1;
+    return id;
+};
+export const useUniqueId = (id) => {
+    const returnedId = useMemo(() => id || createId(), [id]);
+    return returnedId;
+};
+//# sourceMappingURL=id.js.map

package/dist/utils/id.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"id.js","sourceRoot":"","sources":["../../src/utils/id.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AAE/B,IAAI,OAAO,GAAG,CAAC,CAAA;AAEf,MAAM,CAAC,MAAM,cAAc,GAAG,WAAW,CAAA;AAEzC,MAAM,QAAQ,GAAG,GAAW,EAAE;IAC5B,MAAM,EAAE,GAAG,GAAG,cAAc,IAAI,OAAO,EAAE,CAAA;IACzC,OAAO,IAAI,CAAC,CAAA;IAEZ,OAAO,EAAE,CAAA;AACX,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAAW,EAAE,EAAE;IACzC,MAAM,UAAU,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,EAAE,IAAI,QAAQ,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,CAAA;IAExD,OAAO,UAAU,CAAA;AACnB,CAAC,CAAA"}

package/dist/utils/id.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/utils/id.test.js

@@ -0,0 +1,30 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { renderHook } from '@testing-library/react-hooks';
+import { smoresIdPrefix, useUniqueId } from './id';
+describe('useUniqueId', () => {
+    it('should persist the same id across render', () => __awaiter(void 0, void 0, void 0, function* () {
+        const hook = renderHook(() => useUniqueId());
+        expect(hook.result.current).toBe(`${smoresIdPrefix}_0`);
+        hook.rerender();
+        expect(hook.result.current).toBe(`${smoresIdPrefix}_0`);
+    }));
+    it('should have different id if called from different instance', () => __awaiter(void 0, void 0, void 0, function* () {
+        const hook1 = renderHook(() => useUniqueId());
+        const hook2 = renderHook(() => useUniqueId());
+        expect(hook1.result.current).not.toBe(hook2.result.current);
+    }));
+    it('should keep to provided id if present', () => __awaiter(void 0, void 0, void 0, function* () {
+        const someRandomId = 'someRandomId';
+        const hook = renderHook(() => useUniqueId(someRandomId));
+        expect(hook.result.current).toBe(someRandomId);
+    }));
+});
+//# sourceMappingURL=id.test.js.map

package/dist/utils/id.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"id.test.js","sourceRoot":"","sources":["../../src/utils/id.test.ts"],"names":[],"mappings":";;;;;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAA;AAEzD,OAAO,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,MAAM,CAAA;AAElD,QAAQ,CAAC,aAAa,EAAE,GAAG,EAAE;IAC3B,EAAE,CAAC,0CAA0C,EAAE,GAAS,EAAE;QACxD,MAAM,IAAI,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,WAAW,EAAE,CAAC,CAAA;QAE5C,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,cAAc,IAAI,CAAC,CAAA;QACvD,IAAI,CAAC,QAAQ,EAAE,CAAA;QACf,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,cAAc,IAAI,CAAC,CAAA;IACzD,CAAC,CAAA,CAAC,CAAA;IAEF,EAAE,CAAC,4DAA4D,EAAE,GAAS,EAAE;QAC1E,MAAM,KAAK,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,WAAW,EAAE,CAAC,CAAA;QAC7C,MAAM,KAAK,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,WAAW,EAAE,CAAC,CAAA;QAE7C,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAA;IAC7D,CAAC,CAAA,CAAC,CAAA;IAEF,EAAE,CAAC,uCAAuC,EAAE,GAAS,EAAE;QACrD,MAAM,YAAY,GAAG,cAAc,CAAA;QACnC,MAAM,IAAI,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,WAAW,CAAC,YAAY,CAAC,CAAC,CAAA;QAExD,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,CAAA;IAChD,CAAC,CAAA,CAAC,CAAA;AACJ,CAAC,CAAC,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mrshmllw/smores-react",
-  "version": "2.1.23",
+  "version": "2.1.26",
   "main": "./dist/index.js",
   "description": "Collection of React components used by Marshmallow Technology",
   "keywords": [
@@ -39,25 +39,29 @@
     "@storybook/storybook-deployer": "^2.8.7",
     "@testing-library/jest-dom": "^5.11.4",
     "@testing-library/react": "^12.0.0",
-    "@types/jest": "^26.0.14",
+    "@testing-library/react-hooks": "^8.0.0",
+    "@types/jest": "^28.1.1",
+    "@types/node": "^17.0.35",
     "@types/react": "^17.0.0",
     "@types/react-dom": "^17.0.9",
     "@types/styled-components": "^5.1.3",
-    "@typescript-eslint/eslint-plugin": "^4.3.0",
-    "@typescript-eslint/parser": "^4.3.0",
+    "@types/testing-library__jest-dom": "^5.14.3",
+    "@types/testing-library__react": "^10.2.0",
+    "@typescript-eslint/eslint-plugin": "^5.28.0",
+    "@typescript-eslint/parser": "^5.28.0",
     "babel-eslint": "^10.1.0",
     "babel-jest": "^28.0.3",
     "babel-loader": "^8.1.0",
     "eslint": "^7.9.0",
     "eslint-config-prettier": "^8.2.0",
-    "eslint-plugin-jest": "^26.0.0",
+    "eslint-plugin-jest": "^26.5.3",
     "eslint-plugin-react": "^7.29.2",
     "eslint-plugin-react-hooks": "^4.1.2",
     "husky": "^8.0.1",
     "jest": "^28.0.3",
     "jest-environment-jsdom": "^28.1.0",
     "jest-styled-components": "^7.0.3",
-    "lint-staged": "^12.0.2",
+    "lint-staged": "^13.0.0",
     "prettier": "^2.1.2",
     "storybook-addon-performance": "^0.16.1"
   },

package/dist/CheckBoxGroup/CheckBox.d.ts

@@ -1,9 +0,0 @@
-import { FC, ReactNode } from 'react';
-declare type Props = {
-    id: string;
-    checked: boolean;
-    children: ReactNode;
-    toggle: () => void;
-};
-export declare const CheckBox: FC<Props>;
-export {};

package/dist/CheckBoxGroup/CheckBox.js

@@ -1,67 +0,0 @@
-import React from 'react';
-import styled from 'styled-components';
-import { Text } from '../Text';
-import { theme } from '../theme';
-export const CheckBox = ({ id, checked, children, toggle }) => (React.createElement(BoxContainer, { id: id },
-    React.createElement(Text, { tag: "span", typo: "base" }, children),
-    React.createElement("input", { type: "checkbox", checked: checked, onChange: toggle }),
-    React.createElement(Checkmark, null)));
-const Checkmark = styled.span `
-  position: absolute;
-  left: 0;
-  width: 24px;
-  height: 24px;
-  border: solid 1px ${theme.colors.secondary};
-  box-sizing: border-box;
-  border-radius: 1px;
-
-  &:after {
-    content: '';
-    position: absolute;
-    display: none;
-    top: 3px;
-    left: 7px;
-    width: 5px;
-    height: 12px;
-    border: solid white;
-    border-width: 0 2px 2px 0;
-    -webkit-transform: rotate(45deg);
-    -ms-transform: rotate(45deg);
-    transform: rotate(45deg);
-  }
-`;
-const BoxContainer = styled.label `
-  position: relative;
-  display: flex;
-  align-items: flex-start;
-  padding-left: 32px;
-  user-select: none;
-  cursor: pointer;
-
-  input {
-    position: absolute;
-    opacity: 0;
-    cursor: pointer;
-
-    &:checked ~ ${Checkmark} {
-      background-color: ${theme.colors.secondary};
-      border: solid 1px ${theme.colors.secondary};
-    }
-
-    &:checked ~ ${Checkmark}:after {
-      display: block;
-    }
-  }
-
-  &:hover {
-    ${Checkmark} {
-      background-color: ${theme.colors.background};
-      border: solid 1px ${theme.colors.secondary};
-    }
-  }
-
-  @media (min-width: 768px) {
-    padding-left: 32px;
-  }
-`;
-//# sourceMappingURL=CheckBox.js.map

package/dist/CheckBoxGroup/CheckBox.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CheckBox.js","sourceRoot":"","sources":["../../src/CheckBoxGroup/CheckBox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAA;AAC5C,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAShC,MAAM,CAAC,MAAM,QAAQ,GAAc,CAAC,EAAE,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CACxE,oBAAC,YAAY,IAAC,EAAE,EAAE,EAAE;IAClB,oBAAC,IAAI,IAAC,GAAG,EAAC,MAAM,EAAC,IAAI,EAAC,MAAM,IACzB,QAAQ,CACJ;IAEP,+BAAO,IAAI,EAAC,UAAU,EAAC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,GAAI;IAC7D,oBAAC,SAAS,OAAG,CACA,CAChB,CAAA;AAED,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAAA;;;;;sBAKP,KAAK,CAAC,MAAM,CAAC,SAAS;;;;;;;;;;;;;;;;;;CAkB3C,CAAA;AAED,MAAM,YAAY,GAAG,MAAM,CAAC,KAAK,CAAA;;;;;;;;;;;;;kBAaf,SAAS;0BACD,KAAK,CAAC,MAAM,CAAC,SAAS;0BACtB,KAAK,CAAC,MAAM,CAAC,SAAS;;;kBAG9B,SAAS;;;;;;MAMrB,SAAS;0BACW,KAAK,CAAC,MAAM,CAAC,UAAU;0BACvB,KAAK,CAAC,MAAM,CAAC,SAAS;;;;;;;CAO/C,CAAA"}