@heliux-org/design-system-core 0.0.478-single-row-select-updates → 0.0.478-testBuild

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 (28) hide show
  1. package/dist/ExpandedContent.js +1 -1
  2. package/dist/ExpandedContent.js.map +1 -1
  3. package/dist/Row.js +1 -1
  4. package/dist/Row.js.map +1 -1
  5. package/dist/components/CopyToClipboard/CopyToClipboard.js +27 -0
  6. package/dist/components/CopyToClipboard/CopyToClipboard.js.map +1 -0
  7. package/dist/components/NewTable/components/Row/InternalRowBase.js +1 -2
  8. package/dist/components/NewTable/components/Row/InternalRowBase.js.map +1 -1
  9. package/dist/esm/components/CopyToClipboard/CopyToClipboard.d.ts +11 -0
  10. package/dist/esm/components/CopyToClipboard/CopyToClipboard.d.ts.map +1 -0
  11. package/dist/esm/components/NewTable/components/Row/InternalRowBase.d.ts.map +1 -1
  12. package/dist/esm/src/components/NewTable/components/Row/InternalRowBase.js +1 -1
  13. package/dist/esm/src/components/NewTable/components/Row/InternalRowBase.js.map +1 -1
  14. package/dist/main.js +1 -1
  15. package/dist/main.js.map +1 -1
  16. package/dist/mocked_classnames_esm/components/CopyToClipboard/CopyToClipboard.d.ts +11 -0
  17. package/dist/mocked_classnames_esm/components/CopyToClipboard/CopyToClipboard.d.ts.map +1 -0
  18. package/dist/mocked_classnames_esm/components/NewTable/components/Row/InternalRowBase.d.ts.map +1 -1
  19. package/dist/mocked_classnames_esm/src/components/NewTable/components/Row/InternalRowBase.js +1 -1
  20. package/dist/mocked_classnames_esm/src/components/NewTable/components/Row/InternalRowBase.js.map +1 -1
  21. package/dist/types/components/CopyToClipboard/CopyToClipboard.d.ts +11 -0
  22. package/dist/types/components/CopyToClipboard/CopyToClipboard.d.ts.map +1 -0
  23. package/dist/types/components/NewTable/components/Row/InternalRowBase.d.ts.map +1 -1
  24. package/package.json +2 -2
  25. package/src/components/CopyToClipboard/CopyToClipboard.tsx +50 -0
  26. package/src/components/CopyToClipboard/__stories__/CopyToClipboard.mdx +21 -0
  27. package/src/components/CopyToClipboard/__stories__/CopyToClipboard.stories.tsx +12 -0
  28. package/src/components/NewTable/components/Row/InternalRowBase.tsx +1 -2
package/dist/mocked_classnames_esm/components/CopyToClipboard/CopyToClipboard.d.ts ADDED
@@ -0,0 +1,11 @@
1
+ import React from 'react';
2
+ type CopyToClipboardProps = {
3
+ textToCopy: string;
4
+ preCopyTooltipContent?: string;
5
+ postCopyTooltipMessage?: string;
6
+ onClick?: () => void;
7
+ resetDelayMs?: number;
8
+ };
9
+ declare const CopyToClipboard: React.FC<CopyToClipboardProps>;
10
+ export default CopyToClipboard;
11
+ //# sourceMappingURL=CopyToClipboard.d.ts.map
package/dist/mocked_classnames_esm/components/CopyToClipboard/CopyToClipboard.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CopyToClipboard.d.ts","sourceRoot":"","sources":["../../../../src/components/CopyToClipboard/CopyToClipboard.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAEnD,KAAK,oBAAoB,GAAG;IACxB,UAAU,EAAE,MAAM,CAAC;IACnB,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,QAAA,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAmCnD,CAAC;AAEF,eAAe,eAAe,CAAC"}
package/dist/mocked_classnames_esm/components/NewTable/components/Row/InternalRowBase.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"InternalRowBase.d.ts","sourceRoot":"","sources":["../../../../../../src/components/NewTable/components/Row/InternalRowBase.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC;AAGnD,QAAA,MAAM,eAAe,oCAIlB,oBAAoB,qDAoBtB,CAAC;AAEF,eAAe,eAAe,CAAC"}
1
+ {"version":3,"file":"InternalRowBase.d.ts","sourceRoot":"","sources":["../../../../../../src/components/NewTable/components/Row/InternalRowBase.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC;AAGnD,QAAA,MAAM,eAAe,oCAIlB,oBAAoB,qDAmBtB,CAAC;AAEF,eAAe,eAAe,CAAC"}
package/dist/mocked_classnames_esm/src/components/NewTable/components/Row/InternalRowBase.js CHANGED
@@ -1,2 +1,2 @@
1
- import{defineProperty as o}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import{__rest as i}from"../../../../../_virtual/_tslib.js";import{jsx as r}from"@emotion/react/jsx-runtime";import s from"classnames";import e from"./Row.module.scss.js";import{useRowContext as a}from"./RowContext.js";var l=function(l){var t=l.className,m=l.onClick,c=i(l,["className","onClick"]),n=a(),d=n.disabled,p=n.isClicked;return r("tr",Object.assign({onClick:m,"aria-disabled":d,tabIndex:m?0:void 0,className:s(o(o(o({},e.disabledRow,d),e.clickableRow,!!m),e.clickedRow,p),t)},c))};export{l as default};
1
+ import{defineProperty as o}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import{__rest as r}from"../../../../../_virtual/_tslib.js";import{jsx as s}from"@emotion/react/jsx-runtime";import a from"classnames";import e from"./Row.module.scss.js";import{useRowContext as i}from"./RowContext.js";var l=function(l){var t=l.className,m=l.onClick,n=r(l,["className","onClick"]),c=i().disabled;return s("tr",Object.assign({onClick:m,"aria-disabled":c,tabIndex:m?0:void 0,className:a(o(o({},e.disabledRow,c),e.clickableRow,!!m),t)},n))};export{l as default};
2
2
  //# sourceMappingURL=InternalRowBase.js.map
package/dist/mocked_classnames_esm/src/components/NewTable/components/Row/InternalRowBase.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"InternalRowBase.js","sources":["../../../../../../../src/components/NewTable/components/Row/InternalRowBase.tsx"],"sourcesContent":["import React from 'react';\nimport cx from 'classnames';\n\nimport styles from './Row.module.scss'; // Ensure this path is correct\nimport { InternalRowBaseProps } from './Row.types';\nimport { useRowContext } from './RowContext';\n\nconst InternalRowBase = ({\n className,\n onClick,\n ...rest\n}: InternalRowBaseProps) => {\n const { disabled, isClicked } = useRowContext();\n \n // Assume that `theme` class (e.g., `theme-dark`, `theme-light`) is set on a higher-level component, like `<body>` or `<div id=\"root\">`\n return (\n <tr\n onClick={onClick}\n aria-disabled={disabled}\n tabIndex={onClick ? 0 : undefined}\n className={cx(\n {\n [styles.disabledRow]: disabled,\n [styles.clickableRow]: !!onClick,\n [styles.clickedRow]: isClicked,\n },\n className,\n )}\n {...rest}\n />\n );\n};\n\nexport default InternalRowBase;\n"],"names":["InternalRowBase","_a","className","onClick","rest","__rest","_useRowContext","useRowContext","disabled","isClicked","_jsx","tabIndex","undefined","cx","_defineProperty","styles","disabledRow","clickableRow","clickedRow"],"mappings":"gTAOA,IAAMA,EAAkB,SAACC,OACvBC,EACOD,EADPC,UACAC,EAAOF,EAAPE,QACGC,EAAIC,EAAAJ,EAHgB,yBAKvBK,EAAgCC,IAAxBC,EAAQF,EAARE,SAAUC,EAASH,EAATG,UAGlB,OACEC,sBACEP,QAASA,EACM,gBAAAK,EACfG,SAAUR,EAAU,OAAIS,EACxBV,UAAWW,EAAEC,EAAAA,EAAAA,EAERC,GAAAA,EAAOC,YAAcR,GACrBO,EAAOE,eAAiBd,GACxBY,EAAOG,WAAaT,GAEvBP,IAEEE,GAGV"}
1
+ {"version":3,"file":"InternalRowBase.js","sources":["../../../../../../../src/components/NewTable/components/Row/InternalRowBase.tsx"],"sourcesContent":["import React from 'react';\nimport cx from 'classnames';\n\nimport styles from './Row.module.scss'; // Ensure this path is correct\nimport { InternalRowBaseProps } from './Row.types';\nimport { useRowContext } from './RowContext';\n\nconst InternalRowBase = ({\n className,\n onClick,\n ...rest\n}: InternalRowBaseProps) => {\n const { disabled } = useRowContext();\n \n // Assume that `theme` class (e.g., `theme-dark`, `theme-light`) is set on a higher-level component, like `<body>` or `<div id=\"root\">`\n return (\n <tr\n onClick={onClick}\n aria-disabled={disabled}\n tabIndex={onClick ? 0 : undefined}\n className={cx(\n {\n [styles.disabledRow]: disabled,\n [styles.clickableRow]: !!onClick,\n },\n className,\n )}\n {...rest}\n />\n );\n};\n\nexport default InternalRowBase;\n"],"names":["InternalRowBase","_a","className","onClick","rest","__rest","disabled","useRowContext","_jsx","tabIndex","undefined","cx","_defineProperty","styles","disabledRow","clickableRow"],"mappings":"gTAOA,IAAMA,EAAkB,SAACC,OACvBC,EACOD,EADPC,UACAC,EAAOF,EAAPE,QACGC,EAAIC,EAAAJ,EAHgB,yBAKfK,EAAaC,IAAbD,SAGR,OACEE,sBACEL,QAASA,EACM,gBAAAG,EACfG,SAAUN,EAAU,OAAIO,EACxBR,UAAWS,EAAEC,EAAAA,EAAA,CAAA,EAERC,EAAOC,YAAcR,GACrBO,EAAOE,eAAiBZ,GAE3BD,IAEEE,GAGV"}
package/dist/types/components/CopyToClipboard/CopyToClipboard.d.ts ADDED
@@ -0,0 +1,11 @@
1
+ import React from 'react';
2
+ type CopyToClipboardProps = {
3
+ textToCopy: string;
4
+ preCopyTooltipContent?: string;
5
+ postCopyTooltipMessage?: string;
6
+ onClick?: () => void;
7
+ resetDelayMs?: number;
8
+ };
9
+ declare const CopyToClipboard: React.FC<CopyToClipboardProps>;
10
+ export default CopyToClipboard;
11
+ //# sourceMappingURL=CopyToClipboard.d.ts.map
package/dist/types/components/CopyToClipboard/CopyToClipboard.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CopyToClipboard.d.ts","sourceRoot":"","sources":["../../../../src/components/CopyToClipboard/CopyToClipboard.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAEnD,KAAK,oBAAoB,GAAG;IACxB,UAAU,EAAE,MAAM,CAAC;IACnB,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,QAAA,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAmCnD,CAAC;AAEF,eAAe,eAAe,CAAC"}
package/dist/types/components/NewTable/components/Row/InternalRowBase.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"InternalRowBase.d.ts","sourceRoot":"","sources":["../../../../../../src/components/NewTable/components/Row/InternalRowBase.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC;AAGnD,QAAA,MAAM,eAAe,oCAIlB,oBAAoB,qDAoBtB,CAAC;AAEF,eAAe,eAAe,CAAC"}
1
+ {"version":3,"file":"InternalRowBase.d.ts","sourceRoot":"","sources":["../../../../../../src/components/NewTable/components/Row/InternalRowBase.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC;AAGnD,QAAA,MAAM,eAAe,oCAIlB,oBAAoB,qDAmBtB,CAAC;AAEF,eAAe,eAAe,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@heliux-org/design-system-core",
3
- "version": "0.0.478-single-row-select-updates",
3
+ "version": "0.0.478-testBuild",
4
4
  "description": "Official Heliux design system resources for application development in React.js",
5
5
  "main": "./dist/main.js",
6
6
  "types": "./dist/types/index.d.ts",
@@ -310,5 +310,5 @@
310
310
  }
311
311
  },
312
312
  "keywords": [],
313
- "gitHead": "424f790673169c9ddc46bcde13cf4cf070f9237e"
313
+ "gitHead": "8b81f785e8fb46642693a9a5e7c2dfcb253f7a2a"
314
314
  }
package/src/components/CopyToClipboard/CopyToClipboard.tsx ADDED
@@ -0,0 +1,50 @@
1
+ import Icon from '../Icon/Icon';
2
+ import Tooltip from '../Tooltip/Tooltip';
3
+ import React, { useState, useEffect } from 'react';
4
+
5
+ type CopyToClipboardProps = {
6
+ textToCopy: string;
7
+ preCopyTooltipContent?: string;
8
+ postCopyTooltipMessage?: string;
9
+ onClick?: () => void;
10
+ resetDelayMs?: number;
11
+ };
12
+
13
+ const CopyToClipboard: React.FC<CopyToClipboardProps> = ({
14
+ textToCopy = '',
15
+ preCopyTooltipContent,
16
+ postCopyTooltipMessage = 'Copied',
17
+ onClick,
18
+ resetDelayMs = 2000,
19
+ }) => {
20
+ const [copied, setCopied] = useState(false);
21
+
22
+ useEffect(() => {
23
+ let timeout: NodeJS.Timeout;
24
+ if (copied) {
25
+ timeout = setTimeout(() => setCopied(false), resetDelayMs);
26
+ }
27
+ return () => clearTimeout(timeout);
28
+ }, [copied, resetDelayMs]);
29
+
30
+ const handleCopy = () => {
31
+ navigator.clipboard.writeText(textToCopy)
32
+ setCopied(true);
33
+ onClick?.();
34
+ };
35
+
36
+ return (
37
+ <Tooltip content={copied ? postCopyTooltipMessage : preCopyTooltipContent}>
38
+ <Icon
39
+ icon=""
40
+ iconType={Icon.type.PATH}
41
+ iconPath={copied ? "ic_checkmark_16" : "ic_view_double_24"}
42
+ customColor={copied ? "green" : undefined}
43
+ clickable={!copied}
44
+ onClick={!copied ? handleCopy : undefined}
45
+ />
46
+ </Tooltip>
47
+ );
48
+ };
49
+
50
+ export default CopyToClipboard;
package/src/components/CopyToClipboard/__stories__/CopyToClipboard.mdx ADDED
@@ -0,0 +1,21 @@
1
+ import { Meta, Story, Canvas } from "@storybook/addon-docs/blocks";
2
+ import { Overview } from "./CopyToClipboard.stories";
3
+ import * as CopyToClipboardStories from "./CopyToClipboard.stories";
4
+
5
+ <Meta title="Navigation/CopyToClipboard" of={CopyToClipboardStories} />
6
+
7
+ # CopyToClipboard
8
+
9
+ CopyToClipboard components displays a list of CopyToClipboard and a form to post a new one.
10
+
11
+ - [Overview](#overview)
12
+ - [Usage](#usage)
13
+ - [Props](#props)
14
+
15
+ ## Overview
16
+
17
+ <Canvas of={Overview} />
18
+
19
+ ## Props
20
+
21
+ <PropsTable />
package/src/components/CopyToClipboard/__stories__/CopyToClipboard.stories.tsx ADDED
@@ -0,0 +1,12 @@
1
+ import React from "react";
2
+ import CopyToClipboard from "../CopyToClipboard";
3
+
4
+ export default {
5
+ title: "Navigation/Copy To Clipboard",
6
+ component: CopyToClipboard,
7
+ };
8
+
9
+ export const Overview = {
10
+ render: () => <CopyToClipboard textToCopy="HX-00001-11" preCopyTooltipContent="Copy to clipboard" postCopyTooltipMessage="Copied!" />,
11
+ name: "Overview",
12
+ };
package/src/components/NewTable/components/Row/InternalRowBase.tsx CHANGED
@@ -10,7 +10,7 @@ const InternalRowBase = ({
10
10
  onClick,
11
11
  ...rest
12
12
  }: InternalRowBaseProps) => {
13
- const { disabled, isClicked } = useRowContext();
13
+ const { disabled } = useRowContext();
14
14
 
15
15
  // Assume that `theme` class (e.g., `theme-dark`, `theme-light`) is set on a higher-level component, like `<body>` or `<div id="root">`
16
16
  return (
@@ -22,7 +22,6 @@ const InternalRowBase = ({
22
22
  {
23
23
  [styles.disabledRow]: disabled,
24
24
  [styles.clickableRow]: !!onClick,
25
- [styles.clickedRow]: isClicked,
26
25
  },
27
26
  className,
28
27
  )}