@devtools-ui/copy-to-clipboard 0.4.0 → 0.4.1-next.0

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.
package/README.md ADDED
@@ -0,0 +1,99 @@
1
+ # @devtools-ui/copy-to-clipboard
2
+
3
+ ## Overview
4
+
5
+ `@devtools-ui/copy-to-clipboard` is a component package designed to be leveraged by a [Player-UI assets plugin](https://player-ui.github.io/next/plugins).
6
+
7
+ It provides a CopyToClipboard component that can be used to copy a data binding content to the clipboard.
8
+
9
+ ## Installation
10
+
11
+ To install `@devtools-ui/copy-to-clipboard`, you can use pnpm or yarn:
12
+
13
+ ```sh
14
+ pnpm i @devtools-ui/copy-to-clipboard
15
+ ```
16
+
17
+ or
18
+
19
+ ```sh
20
+ yarn add @devtools-ui/copy-to-clipboard
21
+ ```
22
+
23
+ ## Usage
24
+
25
+ You can leverage this asset through the `@devtools-ui/plugin`:
26
+
27
+ ```ts
28
+ import { CopyToClipboard } from "@devtools-ui/plugin";
29
+
30
+ // and use it to define your Player-UI content:
31
+ myFlow = {
32
+ id: "my_flow",
33
+ views: [
34
+ <CopyToClipboard binding={b`my_binding`}>
35
+ <CopyToClipboard.Label>Copy to clipboard</CopyToClipboard.Label>
36
+ </CopyToClipboard>,
37
+ ],
38
+ };
39
+ ```
40
+
41
+ For more information on how to author Player-UI content using DSL, please check our [Player-UI docs](https://player-ui.github.io/next/dsl#tsxjsx-content-authoring-player-dsl).
42
+
43
+ Or, your can leverage this asset in your own plugin:
44
+
45
+ ```ts
46
+ // TransformPlugin.ts
47
+ import type { Player, PlayerPlugin } from "@player-ui/player";
48
+ import { AssetTransformPlugin } from "@player-ui/asset-transform-plugin";
49
+ import { copyToClipboardTransform } from "@devtools-ui/copy-to-clipboard";
50
+
51
+ export class TransformsPlugin implements PlayerPlugin {
52
+ name = "my-plugin-transforms";
53
+
54
+ apply(player: Player) {
55
+ player.registerPlugin(
56
+ new AssetTransformPlugin([
57
+ [{ type: "copy-to-clipboard" }, copyToClipboardTransform],
58
+ ])
59
+ );
60
+ }
61
+ }
62
+ ```
63
+
64
+ ```ts
65
+ // AssetRegistryPlugin.ts
66
+ import React from "react";
67
+ import type { Player } from "@player-ui/player";
68
+ import type {
69
+ ExtendedPlayerPlugin,
70
+ ReactPlayer,
71
+ ReactPlayerPlugin,
72
+ } from "@player-ui/react";
73
+ import { AssetProviderPlugin } from "@player-ui/asset-provider-plugin-react";
74
+ import { TransformsPlugin } from "./TransformPlugin";
75
+ import {
76
+ CopyToClipboardAsset,
77
+ CopyToClipboardComponent,
78
+ } from "@devtools-ui/copy-to-clipboard";
79
+
80
+ export class AssetsRegistryPlugin
81
+ implements ReactPlayerPlugin, ExtendedPlayerPlugin<[CopyToClipboardAsset]>
82
+ {
83
+ name = "my-plugin";
84
+
85
+ applyReact(reactPlayer: ReactPlayer) {
86
+ reactPlayer.registerPlugin(
87
+ new AssetProviderPlugin([["copy-to-clipboard", CopyToClipboardComponent]])
88
+ );
89
+ }
90
+
91
+ apply(player: Player) {
92
+ player.registerPlugin(new TransformsPlugin());
93
+ }
94
+ }
95
+ ```
96
+
97
+ ## Contributing
98
+
99
+ We welcome contributions to `@devtools-ui/copy-to-clipboard`!
@@ -71,17 +71,17 @@ var CopyToClipboardComponent = (props) => {
71
71
 
72
72
  // ../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/copy-to-clipboard/src/dsl/index.tsx
73
73
  var import_react4 = __toESM(require("react"));
74
- var import_dsl = require("@player-tools/dsl");
74
+ var import_react_dsl = require("@player-lang/react-dsl");
75
75
  var import_collection = require("@devtools-ui/collection");
76
76
  var import_text = require("@devtools-ui/text");
77
77
  var CopyToClipboard2 = (props) => {
78
78
  const { binding, children, ...rest } = props;
79
- return /* @__PURE__ */ import_react4.default.createElement(import_dsl.Asset, { type: "copy-to-clipboard", ...rest }, binding && /* @__PURE__ */ import_react4.default.createElement("property", { name: "binding" }, binding.toValue()), children);
79
+ return /* @__PURE__ */ import_react4.default.createElement(import_react_dsl.Asset, { type: "copy-to-clipboard", ...rest }, binding && /* @__PURE__ */ import_react4.default.createElement("property", { name: "binding" }, binding.toValue()), children);
80
80
  };
81
81
  var CollectionComp = (props) => {
82
82
  return /* @__PURE__ */ import_react4.default.createElement(import_collection.Collection, null, /* @__PURE__ */ import_react4.default.createElement(import_collection.Collection.Values, null, props.children));
83
83
  };
84
- CopyToClipboard2.Label = (0, import_dsl.createSlot)({
84
+ CopyToClipboard2.Label = (0, import_react_dsl.createSlot)({
85
85
  name: "label",
86
86
  TextComp: import_text.Text,
87
87
  CollectionComp,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/copy-to-clipboard/src/index.ts","../../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/copy-to-clipboard/src/component/index.tsx","../../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/copy-to-clipboard/src/dsl/index.tsx","../../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/copy-to-clipboard/src/transform/index.ts"],"sourcesContent":["export * from \"./types\";\nexport * from \"./component\";\nexport * from \"./dsl\";\nexport * from \"./transform\";\n","import { ReactAsset } from \"@player-ui/react\";\nimport React, { useCallback } from \"react\";\nimport type { TransformedCopyToClipboard } from \"../types\";\nimport { CopyToClipboard } from \"react-copy-to-clipboard\";\nimport { useToast, Button } from \"@chakra-ui/react\";\n\nexport const CopyToClipboardComponent = (props: TransformedCopyToClipboard) => {\n const { label, data } = props;\n const toast = useToast();\n const handleCopy = useCallback(\n (_: string, result: boolean) => {\n if (result) {\n toast({\n title: \"Data copied to clipboard\",\n description: \"Data copied successfully\",\n status: \"success\",\n duration: 3000,\n isClosable: true,\n });\n } else {\n toast({\n title: \"Failed to copy\",\n description: \"Failed to copy data to clipboard\",\n status: \"error\",\n duration: 3000,\n isClosable: true,\n });\n }\n },\n [toast]\n );\n\n return (\n <CopyToClipboard text={data} onCopy={handleCopy}>\n <Button>{label && <ReactAsset {...label.asset} />}</Button>\n </CopyToClipboard>\n );\n};\n","import React from \"react\";\nimport {\n AssetPropsWithChildren,\n Asset,\n createSlot,\n BindingTemplateInstance,\n} from \"@player-tools/dsl\";\nimport type { Asset as AssetType } from \"@player-ui/player\";\nimport { Collection } from \"@devtools-ui/collection\";\nimport { Text } from \"@devtools-ui/text\";\nimport type { CopyToClipboardAsset } from \"../types\";\n\n/**\n * Defines the component DSL representation, so users of this plugin can author Player-UI\n * content leveraging .jsx/.tsx syntax.\n */\nexport const CopyToClipboard = (\n props: Omit<AssetPropsWithChildren<CopyToClipboardAsset>, \"binding\"> & {\n /** The binding */\n binding?: BindingTemplateInstance;\n }\n) => {\n const { binding, children, ...rest } = props;\n\n return (\n <Asset type=\"copy-to-clipboard\" {...rest}>\n {binding && <property name=\"binding\">{binding.toValue()}</property>}\n {children}\n </Asset>\n );\n};\n\nconst CollectionComp = (props: AssetPropsWithChildren<AssetType>) => {\n return (\n <Collection>\n <Collection.Values>{props.children}</Collection.Values>\n </Collection>\n );\n};\n\nCopyToClipboard.Label = createSlot({\n name: \"label\",\n TextComp: Text,\n CollectionComp,\n isArray: false,\n wrapInAsset: true,\n});\n","import type { TransformFunction, Resolve } from \"@player-ui/player\";\nimport { CopyToClipboardAsset, TransformedCopyToClipboard } from \"../types\";\n\nconst getData = (\n asset: CopyToClipboardAsset,\n options: Resolve.NodeResolveOptions\n): string => {\n if (asset.binding === undefined) {\n return \"\";\n }\n const obj = options.data.model.get(asset.binding, {\n includeInvalid: true,\n formatted: false,\n });\n return typeof obj === \"string\" ? obj : JSON.stringify(obj, null, 2);\n};\n\n/**\n * Platform-agnostic transform function that takes the properties we get from the Player Content (DSL > JSON)\n * and embeds Player state and methods:\n */\nexport const copyToClipboardTransform: TransformFunction<\n CopyToClipboardAsset,\n TransformedCopyToClipboard\n> = (asset, options) => ({\n ...asset,\n data: getData(asset, options),\n});\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA,yBAAAA;AAAA,EAAA;AAAA;AAAA;AAAA;;;ACAA,mBAA2B;AAC3B,IAAAC,gBAAmC;AAEnC,qCAAgC;AAChC,IAAAA,gBAAiC;AAE1B,IAAM,2BAA2B,CAAC,UAAsC;AAC7E,QAAM,EAAE,OAAO,KAAK,IAAI;AACxB,QAAM,YAAQ,wBAAS;AACvB,QAAM,iBAAa;AAAA,IACjB,CAAC,GAAW,WAAoB;AAC9B,UAAI,QAAQ;AACV,cAAM;AAAA,UACJ,OAAO;AAAA,UACP,aAAa;AAAA,UACb,QAAQ;AAAA,UACR,UAAU;AAAA,UACV,YAAY;AAAA,QACd,CAAC;AAAA,MACH,OAAO;AACL,cAAM;AAAA,UACJ,OAAO;AAAA,UACP,aAAa;AAAA,UACb,QAAQ;AAAA,UACR,UAAU;AAAA,UACV,YAAY;AAAA,QACd,CAAC;AAAA,MACH;AAAA,IACF;AAAA,IACA,CAAC,KAAK;AAAA,EACR;AAEA,SACE,8BAAAC,QAAA,cAAC,kDAAgB,MAAM,MAAM,QAAQ,cACnC,8BAAAA,QAAA,cAAC,4BAAQ,SAAS,8BAAAA,QAAA,cAAC,2BAAY,GAAG,MAAM,OAAO,CAAG,CACpD;AAEJ;;;ACrCA,IAAAC,gBAAkB;AAClB,iBAKO;AAEP,wBAA2B;AAC3B,kBAAqB;AAOd,IAAMC,mBAAkB,CAC7B,UAIG;AACH,QAAM,EAAE,SAAS,UAAU,GAAG,KAAK,IAAI;AAEvC,SACE,8BAAAC,QAAA,cAAC,oBAAM,MAAK,qBAAqB,GAAG,QACjC,WAAW,8BAAAA,QAAA,cAAC,cAAS,MAAK,aAAW,QAAQ,QAAQ,CAAE,GACvD,QACH;AAEJ;AAEA,IAAM,iBAAiB,CAAC,UAA6C;AACnE,SACE,8BAAAA,QAAA,cAAC,oCACC,8BAAAA,QAAA,cAAC,6BAAW,QAAX,MAAmB,MAAM,QAAS,CACrC;AAEJ;AAEAD,iBAAgB,YAAQ,uBAAW;AAAA,EACjC,MAAM;AAAA,EACN,UAAU;AAAA,EACV;AAAA,EACA,SAAS;AAAA,EACT,aAAa;AACf,CAAC;;;AC3CD,IAAM,UAAU,CACd,OACA,YACW;AACX,MAAI,MAAM,YAAY,QAAW;AAC/B,WAAO;AAAA,EACT;AACA,QAAM,MAAM,QAAQ,KAAK,MAAM,IAAI,MAAM,SAAS;AAAA,IAChD,gBAAgB;AAAA,IAChB,WAAW;AAAA,EACb,CAAC;AACD,SAAO,OAAO,QAAQ,WAAW,MAAM,KAAK,UAAU,KAAK,MAAM,CAAC;AACpE;AAMO,IAAM,2BAGT,CAAC,OAAO,aAAa;AAAA,EACvB,GAAG;AAAA,EACH,MAAM,QAAQ,OAAO,OAAO;AAC9B;","names":["CopyToClipboard","import_react","React","import_react","CopyToClipboard","React"]}
1
+ {"version":3,"sources":["../../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/copy-to-clipboard/src/index.ts","../../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/copy-to-clipboard/src/component/index.tsx","../../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/copy-to-clipboard/src/dsl/index.tsx","../../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/copy-to-clipboard/src/transform/index.ts"],"sourcesContent":["export * from \"./types\";\nexport * from \"./component\";\nexport * from \"./dsl\";\nexport * from \"./transform\";\n","import { ReactAsset } from \"@player-ui/react\";\nimport React, { useCallback } from \"react\";\nimport type { TransformedCopyToClipboard } from \"../types\";\nimport { CopyToClipboard } from \"react-copy-to-clipboard\";\nimport { useToast, Button } from \"@chakra-ui/react\";\n\nexport const CopyToClipboardComponent = (props: TransformedCopyToClipboard) => {\n const { label, data } = props;\n const toast = useToast();\n const handleCopy = useCallback(\n (_: string, result: boolean) => {\n if (result) {\n toast({\n title: \"Data copied to clipboard\",\n description: \"Data copied successfully\",\n status: \"success\",\n duration: 3000,\n isClosable: true,\n });\n } else {\n toast({\n title: \"Failed to copy\",\n description: \"Failed to copy data to clipboard\",\n status: \"error\",\n duration: 3000,\n isClosable: true,\n });\n }\n },\n [toast]\n );\n\n return (\n <CopyToClipboard text={data} onCopy={handleCopy}>\n <Button>{label && <ReactAsset {...label.asset} />}</Button>\n </CopyToClipboard>\n );\n};\n","import React from \"react\";\nimport {\n AssetPropsWithChildren,\n Asset,\n createSlot,\n BindingTemplateInstance,\n} from \"@player-lang/react-dsl\";\nimport type { Asset as AssetType } from \"@player-ui/player\";\nimport { Collection } from \"@devtools-ui/collection\";\nimport { Text } from \"@devtools-ui/text\";\nimport type { CopyToClipboardAsset } from \"../types\";\n\n/**\n * Defines the component DSL representation, so users of this plugin can author Player-UI\n * content leveraging .jsx/.tsx syntax.\n */\nexport const CopyToClipboard = (\n props: Omit<AssetPropsWithChildren<CopyToClipboardAsset>, \"binding\"> & {\n /** The binding */\n binding?: BindingTemplateInstance;\n }\n) => {\n const { binding, children, ...rest } = props;\n\n return (\n <Asset type=\"copy-to-clipboard\" {...rest}>\n {binding && <property name=\"binding\">{binding.toValue()}</property>}\n {children}\n </Asset>\n );\n};\n\nconst CollectionComp = (props: AssetPropsWithChildren<AssetType>) => {\n return (\n <Collection>\n <Collection.Values>{props.children}</Collection.Values>\n </Collection>\n );\n};\n\nCopyToClipboard.Label = createSlot({\n name: \"label\",\n TextComp: Text,\n CollectionComp,\n isArray: false,\n wrapInAsset: true,\n});\n","import type { TransformFunction, Resolve } from \"@player-ui/player\";\nimport { CopyToClipboardAsset, TransformedCopyToClipboard } from \"../types\";\n\nconst getData = (\n asset: CopyToClipboardAsset,\n options: Resolve.NodeResolveOptions\n): string => {\n if (asset.binding === undefined) {\n return \"\";\n }\n const obj = options.data.model.get(asset.binding, {\n includeInvalid: true,\n formatted: false,\n });\n return typeof obj === \"string\" ? obj : JSON.stringify(obj, null, 2);\n};\n\n/**\n * Platform-agnostic transform function that takes the properties we get from the Player Content (DSL > JSON)\n * and embeds Player state and methods:\n */\nexport const copyToClipboardTransform: TransformFunction<\n CopyToClipboardAsset,\n TransformedCopyToClipboard\n> = (asset, options) => ({\n ...asset,\n data: getData(asset, options),\n});\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA,yBAAAA;AAAA,EAAA;AAAA;AAAA;AAAA;;;ACAA,mBAA2B;AAC3B,IAAAC,gBAAmC;AAEnC,qCAAgC;AAChC,IAAAA,gBAAiC;AAE1B,IAAM,2BAA2B,CAAC,UAAsC;AAC7E,QAAM,EAAE,OAAO,KAAK,IAAI;AACxB,QAAM,YAAQ,wBAAS;AACvB,QAAM,iBAAa;AAAA,IACjB,CAAC,GAAW,WAAoB;AAC9B,UAAI,QAAQ;AACV,cAAM;AAAA,UACJ,OAAO;AAAA,UACP,aAAa;AAAA,UACb,QAAQ;AAAA,UACR,UAAU;AAAA,UACV,YAAY;AAAA,QACd,CAAC;AAAA,MACH,OAAO;AACL,cAAM;AAAA,UACJ,OAAO;AAAA,UACP,aAAa;AAAA,UACb,QAAQ;AAAA,UACR,UAAU;AAAA,UACV,YAAY;AAAA,QACd,CAAC;AAAA,MACH;AAAA,IACF;AAAA,IACA,CAAC,KAAK;AAAA,EACR;AAEA,SACE,8BAAAC,QAAA,cAAC,kDAAgB,MAAM,MAAM,QAAQ,cACnC,8BAAAA,QAAA,cAAC,4BAAQ,SAAS,8BAAAA,QAAA,cAAC,2BAAY,GAAG,MAAM,OAAO,CAAG,CACpD;AAEJ;;;ACrCA,IAAAC,gBAAkB;AAClB,uBAKO;AAEP,wBAA2B;AAC3B,kBAAqB;AAOd,IAAMC,mBAAkB,CAC7B,UAIG;AACH,QAAM,EAAE,SAAS,UAAU,GAAG,KAAK,IAAI;AAEvC,SACE,8BAAAC,QAAA,cAAC,0BAAM,MAAK,qBAAqB,GAAG,QACjC,WAAW,8BAAAA,QAAA,cAAC,cAAS,MAAK,aAAW,QAAQ,QAAQ,CAAE,GACvD,QACH;AAEJ;AAEA,IAAM,iBAAiB,CAAC,UAA6C;AACnE,SACE,8BAAAA,QAAA,cAAC,oCACC,8BAAAA,QAAA,cAAC,6BAAW,QAAX,MAAmB,MAAM,QAAS,CACrC;AAEJ;AAEAD,iBAAgB,YAAQ,6BAAW;AAAA,EACjC,MAAM;AAAA,EACN,UAAU;AAAA,EACV;AAAA,EACA,SAAS;AAAA,EACT,aAAa;AACf,CAAC;;;AC3CD,IAAM,UAAU,CACd,OACA,YACW;AACX,MAAI,MAAM,YAAY,QAAW;AAC/B,WAAO;AAAA,EACT;AACA,QAAM,MAAM,QAAQ,KAAK,MAAM,IAAI,MAAM,SAAS;AAAA,IAChD,gBAAgB;AAAA,IAChB,WAAW;AAAA,EACb,CAAC;AACD,SAAO,OAAO,QAAQ,WAAW,MAAM,KAAK,UAAU,KAAK,MAAM,CAAC;AACpE;AAMO,IAAM,2BAGT,CAAC,OAAO,aAAa;AAAA,EACvB,GAAG;AAAA,EACH,MAAM,QAAQ,OAAO,OAAO;AAC9B;","names":["CopyToClipboard","import_react","React","import_react","CopyToClipboard","React"]}
@@ -36,7 +36,7 @@ import React2 from "react";
36
36
  import {
37
37
  Asset,
38
38
  createSlot
39
- } from "@player-tools/dsl";
39
+ } from "@player-lang/react-dsl";
40
40
  import { Collection } from "@devtools-ui/collection";
41
41
  import { Text } from "@devtools-ui/text";
42
42
  var CopyToClipboard2 = (props) => {
package/dist/index.mjs CHANGED
@@ -36,7 +36,7 @@ import React2 from "react";
36
36
  import {
37
37
  Asset,
38
38
  createSlot
39
- } from "@player-tools/dsl";
39
+ } from "@player-lang/react-dsl";
40
40
  import { Collection } from "@devtools-ui/collection";
41
41
  import { Text } from "@devtools-ui/text";
42
42
  var CopyToClipboard2 = (props) => {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/copy-to-clipboard/src/component/index.tsx","../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/copy-to-clipboard/src/dsl/index.tsx","../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/copy-to-clipboard/src/transform/index.ts"],"sourcesContent":["import { ReactAsset } from \"@player-ui/react\";\nimport React, { useCallback } from \"react\";\nimport type { TransformedCopyToClipboard } from \"../types\";\nimport { CopyToClipboard } from \"react-copy-to-clipboard\";\nimport { useToast, Button } from \"@chakra-ui/react\";\n\nexport const CopyToClipboardComponent = (props: TransformedCopyToClipboard) => {\n const { label, data } = props;\n const toast = useToast();\n const handleCopy = useCallback(\n (_: string, result: boolean) => {\n if (result) {\n toast({\n title: \"Data copied to clipboard\",\n description: \"Data copied successfully\",\n status: \"success\",\n duration: 3000,\n isClosable: true,\n });\n } else {\n toast({\n title: \"Failed to copy\",\n description: \"Failed to copy data to clipboard\",\n status: \"error\",\n duration: 3000,\n isClosable: true,\n });\n }\n },\n [toast]\n );\n\n return (\n <CopyToClipboard text={data} onCopy={handleCopy}>\n <Button>{label && <ReactAsset {...label.asset} />}</Button>\n </CopyToClipboard>\n );\n};\n","import React from \"react\";\nimport {\n AssetPropsWithChildren,\n Asset,\n createSlot,\n BindingTemplateInstance,\n} from \"@player-tools/dsl\";\nimport type { Asset as AssetType } from \"@player-ui/player\";\nimport { Collection } from \"@devtools-ui/collection\";\nimport { Text } from \"@devtools-ui/text\";\nimport type { CopyToClipboardAsset } from \"../types\";\n\n/**\n * Defines the component DSL representation, so users of this plugin can author Player-UI\n * content leveraging .jsx/.tsx syntax.\n */\nexport const CopyToClipboard = (\n props: Omit<AssetPropsWithChildren<CopyToClipboardAsset>, \"binding\"> & {\n /** The binding */\n binding?: BindingTemplateInstance;\n }\n) => {\n const { binding, children, ...rest } = props;\n\n return (\n <Asset type=\"copy-to-clipboard\" {...rest}>\n {binding && <property name=\"binding\">{binding.toValue()}</property>}\n {children}\n </Asset>\n );\n};\n\nconst CollectionComp = (props: AssetPropsWithChildren<AssetType>) => {\n return (\n <Collection>\n <Collection.Values>{props.children}</Collection.Values>\n </Collection>\n );\n};\n\nCopyToClipboard.Label = createSlot({\n name: \"label\",\n TextComp: Text,\n CollectionComp,\n isArray: false,\n wrapInAsset: true,\n});\n","import type { TransformFunction, Resolve } from \"@player-ui/player\";\nimport { CopyToClipboardAsset, TransformedCopyToClipboard } from \"../types\";\n\nconst getData = (\n asset: CopyToClipboardAsset,\n options: Resolve.NodeResolveOptions\n): string => {\n if (asset.binding === undefined) {\n return \"\";\n }\n const obj = options.data.model.get(asset.binding, {\n includeInvalid: true,\n formatted: false,\n });\n return typeof obj === \"string\" ? obj : JSON.stringify(obj, null, 2);\n};\n\n/**\n * Platform-agnostic transform function that takes the properties we get from the Player Content (DSL > JSON)\n * and embeds Player state and methods:\n */\nexport const copyToClipboardTransform: TransformFunction<\n CopyToClipboardAsset,\n TransformedCopyToClipboard\n> = (asset, options) => ({\n ...asset,\n data: getData(asset, options),\n});\n"],"mappings":";AAAA,SAAS,kBAAkB;AAC3B,OAAO,SAAS,mBAAmB;AAEnC,SAAS,uBAAuB;AAChC,SAAS,UAAU,cAAc;AAE1B,IAAM,2BAA2B,CAAC,UAAsC;AAC7E,QAAM,EAAE,OAAO,KAAK,IAAI;AACxB,QAAM,QAAQ,SAAS;AACvB,QAAM,aAAa;AAAA,IACjB,CAAC,GAAW,WAAoB;AAC9B,UAAI,QAAQ;AACV,cAAM;AAAA,UACJ,OAAO;AAAA,UACP,aAAa;AAAA,UACb,QAAQ;AAAA,UACR,UAAU;AAAA,UACV,YAAY;AAAA,QACd,CAAC;AAAA,MACH,OAAO;AACL,cAAM;AAAA,UACJ,OAAO;AAAA,UACP,aAAa;AAAA,UACb,QAAQ;AAAA,UACR,UAAU;AAAA,UACV,YAAY;AAAA,QACd,CAAC;AAAA,MACH;AAAA,IACF;AAAA,IACA,CAAC,KAAK;AAAA,EACR;AAEA,SACE,oCAAC,mBAAgB,MAAM,MAAM,QAAQ,cACnC,oCAAC,cAAQ,SAAS,oCAAC,cAAY,GAAG,MAAM,OAAO,CAAG,CACpD;AAEJ;;;ACrCA,OAAOA,YAAW;AAClB;AAAA,EAEE;AAAA,EACA;AAAA,OAEK;AAEP,SAAS,kBAAkB;AAC3B,SAAS,YAAY;AAOd,IAAMC,mBAAkB,CAC7B,UAIG;AACH,QAAM,EAAE,SAAS,UAAU,GAAG,KAAK,IAAI;AAEvC,SACE,gBAAAD,OAAA,cAAC,SAAM,MAAK,qBAAqB,GAAG,QACjC,WAAW,gBAAAA,OAAA,cAAC,cAAS,MAAK,aAAW,QAAQ,QAAQ,CAAE,GACvD,QACH;AAEJ;AAEA,IAAM,iBAAiB,CAAC,UAA6C;AACnE,SACE,gBAAAA,OAAA,cAAC,kBACC,gBAAAA,OAAA,cAAC,WAAW,QAAX,MAAmB,MAAM,QAAS,CACrC;AAEJ;AAEAC,iBAAgB,QAAQ,WAAW;AAAA,EACjC,MAAM;AAAA,EACN,UAAU;AAAA,EACV;AAAA,EACA,SAAS;AAAA,EACT,aAAa;AACf,CAAC;;;AC3CD,IAAM,UAAU,CACd,OACA,YACW;AACX,MAAI,MAAM,YAAY,QAAW;AAC/B,WAAO;AAAA,EACT;AACA,QAAM,MAAM,QAAQ,KAAK,MAAM,IAAI,MAAM,SAAS;AAAA,IAChD,gBAAgB;AAAA,IAChB,WAAW;AAAA,EACb,CAAC;AACD,SAAO,OAAO,QAAQ,WAAW,MAAM,KAAK,UAAU,KAAK,MAAM,CAAC;AACpE;AAMO,IAAM,2BAGT,CAAC,OAAO,aAAa;AAAA,EACvB,GAAG;AAAA,EACH,MAAM,QAAQ,OAAO,OAAO;AAC9B;","names":["React","CopyToClipboard"]}
1
+ {"version":3,"sources":["../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/copy-to-clipboard/src/component/index.tsx","../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/copy-to-clipboard/src/dsl/index.tsx","../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/copy-to-clipboard/src/transform/index.ts"],"sourcesContent":["import { ReactAsset } from \"@player-ui/react\";\nimport React, { useCallback } from \"react\";\nimport type { TransformedCopyToClipboard } from \"../types\";\nimport { CopyToClipboard } from \"react-copy-to-clipboard\";\nimport { useToast, Button } from \"@chakra-ui/react\";\n\nexport const CopyToClipboardComponent = (props: TransformedCopyToClipboard) => {\n const { label, data } = props;\n const toast = useToast();\n const handleCopy = useCallback(\n (_: string, result: boolean) => {\n if (result) {\n toast({\n title: \"Data copied to clipboard\",\n description: \"Data copied successfully\",\n status: \"success\",\n duration: 3000,\n isClosable: true,\n });\n } else {\n toast({\n title: \"Failed to copy\",\n description: \"Failed to copy data to clipboard\",\n status: \"error\",\n duration: 3000,\n isClosable: true,\n });\n }\n },\n [toast]\n );\n\n return (\n <CopyToClipboard text={data} onCopy={handleCopy}>\n <Button>{label && <ReactAsset {...label.asset} />}</Button>\n </CopyToClipboard>\n );\n};\n","import React from \"react\";\nimport {\n AssetPropsWithChildren,\n Asset,\n createSlot,\n BindingTemplateInstance,\n} from \"@player-lang/react-dsl\";\nimport type { Asset as AssetType } from \"@player-ui/player\";\nimport { Collection } from \"@devtools-ui/collection\";\nimport { Text } from \"@devtools-ui/text\";\nimport type { CopyToClipboardAsset } from \"../types\";\n\n/**\n * Defines the component DSL representation, so users of this plugin can author Player-UI\n * content leveraging .jsx/.tsx syntax.\n */\nexport const CopyToClipboard = (\n props: Omit<AssetPropsWithChildren<CopyToClipboardAsset>, \"binding\"> & {\n /** The binding */\n binding?: BindingTemplateInstance;\n }\n) => {\n const { binding, children, ...rest } = props;\n\n return (\n <Asset type=\"copy-to-clipboard\" {...rest}>\n {binding && <property name=\"binding\">{binding.toValue()}</property>}\n {children}\n </Asset>\n );\n};\n\nconst CollectionComp = (props: AssetPropsWithChildren<AssetType>) => {\n return (\n <Collection>\n <Collection.Values>{props.children}</Collection.Values>\n </Collection>\n );\n};\n\nCopyToClipboard.Label = createSlot({\n name: \"label\",\n TextComp: Text,\n CollectionComp,\n isArray: false,\n wrapInAsset: true,\n});\n","import type { TransformFunction, Resolve } from \"@player-ui/player\";\nimport { CopyToClipboardAsset, TransformedCopyToClipboard } from \"../types\";\n\nconst getData = (\n asset: CopyToClipboardAsset,\n options: Resolve.NodeResolveOptions\n): string => {\n if (asset.binding === undefined) {\n return \"\";\n }\n const obj = options.data.model.get(asset.binding, {\n includeInvalid: true,\n formatted: false,\n });\n return typeof obj === \"string\" ? obj : JSON.stringify(obj, null, 2);\n};\n\n/**\n * Platform-agnostic transform function that takes the properties we get from the Player Content (DSL > JSON)\n * and embeds Player state and methods:\n */\nexport const copyToClipboardTransform: TransformFunction<\n CopyToClipboardAsset,\n TransformedCopyToClipboard\n> = (asset, options) => ({\n ...asset,\n data: getData(asset, options),\n});\n"],"mappings":";AAAA,SAAS,kBAAkB;AAC3B,OAAO,SAAS,mBAAmB;AAEnC,SAAS,uBAAuB;AAChC,SAAS,UAAU,cAAc;AAE1B,IAAM,2BAA2B,CAAC,UAAsC;AAC7E,QAAM,EAAE,OAAO,KAAK,IAAI;AACxB,QAAM,QAAQ,SAAS;AACvB,QAAM,aAAa;AAAA,IACjB,CAAC,GAAW,WAAoB;AAC9B,UAAI,QAAQ;AACV,cAAM;AAAA,UACJ,OAAO;AAAA,UACP,aAAa;AAAA,UACb,QAAQ;AAAA,UACR,UAAU;AAAA,UACV,YAAY;AAAA,QACd,CAAC;AAAA,MACH,OAAO;AACL,cAAM;AAAA,UACJ,OAAO;AAAA,UACP,aAAa;AAAA,UACb,QAAQ;AAAA,UACR,UAAU;AAAA,UACV,YAAY;AAAA,QACd,CAAC;AAAA,MACH;AAAA,IACF;AAAA,IACA,CAAC,KAAK;AAAA,EACR;AAEA,SACE,oCAAC,mBAAgB,MAAM,MAAM,QAAQ,cACnC,oCAAC,cAAQ,SAAS,oCAAC,cAAY,GAAG,MAAM,OAAO,CAAG,CACpD;AAEJ;;;ACrCA,OAAOA,YAAW;AAClB;AAAA,EAEE;AAAA,EACA;AAAA,OAEK;AAEP,SAAS,kBAAkB;AAC3B,SAAS,YAAY;AAOd,IAAMC,mBAAkB,CAC7B,UAIG;AACH,QAAM,EAAE,SAAS,UAAU,GAAG,KAAK,IAAI;AAEvC,SACE,gBAAAD,OAAA,cAAC,SAAM,MAAK,qBAAqB,GAAG,QACjC,WAAW,gBAAAA,OAAA,cAAC,cAAS,MAAK,aAAW,QAAQ,QAAQ,CAAE,GACvD,QACH;AAEJ;AAEA,IAAM,iBAAiB,CAAC,UAA6C;AACnE,SACE,gBAAAA,OAAA,cAAC,kBACC,gBAAAA,OAAA,cAAC,WAAW,QAAX,MAAmB,MAAM,QAAS,CACrC;AAEJ;AAEAC,iBAAgB,QAAQ,WAAW;AAAA,EACjC,MAAM;AAAA,EACN,UAAU;AAAA,EACV;AAAA,EACA,SAAS;AAAA,EACT,aAAa;AACf,CAAC;;;AC3CD,IAAM,UAAU,CACd,OACA,YACW;AACX,MAAI,MAAM,YAAY,QAAW;AAC/B,WAAO;AAAA,EACT;AACA,QAAM,MAAM,QAAQ,KAAK,MAAM,IAAI,MAAM,SAAS;AAAA,IAChD,gBAAgB;AAAA,IAChB,WAAW;AAAA,EACb,CAAC;AACD,SAAO,OAAO,QAAQ,WAAW,MAAM,KAAK,UAAU,KAAK,MAAM,CAAC;AACpE;AAMO,IAAM,2BAGT,CAAC,OAAO,aAAa;AAAA,EACvB,GAAG;AAAA,EACH,MAAM,QAAQ,OAAO,OAAO;AAC9B;","names":["React","CopyToClipboard"]}
package/package.json CHANGED
@@ -1,10 +1,16 @@
1
1
  {
2
+ "sideEffects": false,
3
+ "files": [
4
+ "dist",
5
+ "src",
6
+ "types"
7
+ ],
2
8
  "name": "@devtools-ui/copy-to-clipboard",
3
- "version": "0.4.0",
9
+ "version": "0.4.1-next.0",
4
10
  "main": "dist/cjs/index.cjs",
5
11
  "dependencies": {
6
- "@devtools-ui/text": "0.4.0",
7
- "@devtools-ui/collection": "0.4.0",
12
+ "@devtools-ui/text": "0.4.1-next.0",
13
+ "@devtools-ui/collection": "0.4.1-next.0",
8
14
  "@chakra-ui/react": "^2.8.2",
9
15
  "@emotion/react": "^11.11.4",
10
16
  "@emotion/styled": "^11.11.0",
@@ -18,7 +24,6 @@
18
24
  },
19
25
  "module": "dist/index.legacy-esm.js",
20
26
  "types": "types/index.d.ts",
21
- "sideEffects": false,
22
27
  "exports": {
23
28
  "./package.json": "./package.json",
24
29
  "./dist/index.css": "./dist/index.css",
@@ -28,16 +33,11 @@
28
33
  "default": "./dist/cjs/index.cjs"
29
34
  }
30
35
  },
31
- "files": [
32
- "dist",
33
- "src",
34
- "types"
35
- ],
36
36
  "peerDependencies": {
37
- "@player-tools/dsl": "0.7.0-next.3",
38
- "@player-ui/asset-transform-plugin": "0.9.1-next.0",
39
- "@player-ui/player": "0.9.1-next.0",
40
- "@player-ui/react": "0.9.1-next.0",
41
- "@player-ui/types": "0.9.1-next.0"
37
+ "@player-lang/react-dsl": "1.0.1",
38
+ "@player-ui/asset-transform-plugin": "0.15.5",
39
+ "@player-ui/player": "0.15.5",
40
+ "@player-ui/react": "0.15.5",
41
+ "@player-ui/types": "0.15.5"
42
42
  }
43
43
  }
@@ -1,6 +1,6 @@
1
1
  import React from "react";
2
2
  import { describe, expect, test } from "vitest";
3
- import { render, binding as b } from "@player-tools/dsl";
3
+ import { render, binding as b } from "@player-lang/react-dsl";
4
4
  import { CopyToClipboard } from "../";
5
5
 
6
6
  describe("DSL: CopyToClipboard", () => {
package/src/dsl/index.tsx CHANGED
@@ -4,7 +4,7 @@ import {
4
4
  Asset,
5
5
  createSlot,
6
6
  BindingTemplateInstance,
7
- } from "@player-tools/dsl";
7
+ } from "@player-lang/react-dsl";
8
8
  import type { Asset as AssetType } from "@player-ui/player";
9
9
  import { Collection } from "@devtools-ui/collection";
10
10
  import { Text } from "@devtools-ui/text";
@@ -1,5 +1,5 @@
1
1
  import React from "react";
2
- import { AssetPropsWithChildren, BindingTemplateInstance } from "@player-tools/dsl";
2
+ import { AssetPropsWithChildren, BindingTemplateInstance } from "@player-lang/react-dsl";
3
3
  import type { CopyToClipboardAsset } from "../types";
4
4
  /**
5
5
  * Defines the component DSL representation, so users of this plugin can author Player-UI