@zag-js/clipboard 0.49.0 → 0.51.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/dist/index.d.mts CHANGED
@@ -28,6 +28,7 @@ interface PublicContext extends CommonProperties {
28
28
  onStatusChange?: (details: CopyStatusDetails) => void;
29
29
  /**
30
30
  * The timeout for the copy operation
31
+ * @default 3000
31
32
  */
32
33
  timeout: number;
33
34
  }
@@ -74,8 +75,8 @@ declare function connect<T extends PropTypes>(state: State, send: Send, normaliz
74
75
 
75
76
  declare function machine(userContext: UserDefinedContext): _zag_js_core.Machine<MachineContext, MachineState, _zag_js_core.StateMachine.AnyEventObject>;
76
77
 
77
- declare const props: ("value" | "timeout" | "id" | "ids" | "onStatusChange" | "getRootNode")[];
78
- declare const contextProps: <Props extends UserDefinedContext>(props: Props) => [UserDefinedContext, Omit<Props, "value" | "timeout" | "id" | "ids" | "onStatusChange" | "getRootNode">];
78
+ declare const props: ("value" | "timeout" | "id" | "getRootNode" | "ids" | "onStatusChange")[];
79
+ declare const contextProps: <Props extends UserDefinedContext>(props: Props) => [UserDefinedContext, Omit<Props, "value" | "timeout" | "id" | "getRootNode" | "ids" | "onStatusChange">];
79
80
  declare const indicatorProps: "copied"[];
80
81
  declare const splitIndicatorProps: <Props extends IndicatorProps>(props: Props) => [IndicatorProps, Omit<Props, "copied">];
81
82
 
package/dist/index.d.ts CHANGED
@@ -28,6 +28,7 @@ interface PublicContext extends CommonProperties {
28
28
  onStatusChange?: (details: CopyStatusDetails) => void;
29
29
  /**
30
30
  * The timeout for the copy operation
31
+ * @default 3000
31
32
  */
32
33
  timeout: number;
33
34
  }
@@ -74,8 +75,8 @@ declare function connect<T extends PropTypes>(state: State, send: Send, normaliz
74
75
 
75
76
  declare function machine(userContext: UserDefinedContext): _zag_js_core.Machine<MachineContext, MachineState, _zag_js_core.StateMachine.AnyEventObject>;
76
77
 
77
- declare const props: ("value" | "timeout" | "id" | "ids" | "onStatusChange" | "getRootNode")[];
78
- declare const contextProps: <Props extends UserDefinedContext>(props: Props) => [UserDefinedContext, Omit<Props, "value" | "timeout" | "id" | "ids" | "onStatusChange" | "getRootNode">];
78
+ declare const props: ("value" | "timeout" | "id" | "getRootNode" | "ids" | "onStatusChange")[];
79
+ declare const contextProps: <Props extends UserDefinedContext>(props: Props) => [UserDefinedContext, Omit<Props, "value" | "timeout" | "id" | "getRootNode" | "ids" | "onStatusChange">];
79
80
  declare const indicatorProps: "copied"[];
80
81
  declare const splitIndicatorProps: <Props extends IndicatorProps>(props: Props) => [IndicatorProps, Omit<Props, "copied">];
81
82
 
package/dist/index.js CHANGED
@@ -1,247 +1,2 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: true });
9
- };
10
- var __copyProps = (to, from, except, desc) => {
11
- if (from && typeof from === "object" || typeof from === "function") {
12
- for (let key of __getOwnPropNames(from))
13
- if (!__hasOwnProp.call(to, key) && key !== except)
14
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
- }
16
- return to;
17
- };
18
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
-
20
- // src/index.ts
21
- var src_exports = {};
22
- __export(src_exports, {
23
- anatomy: () => anatomy,
24
- connect: () => connect,
25
- contextProps: () => contextProps,
26
- indicatorProps: () => indicatorProps,
27
- machine: () => machine,
28
- props: () => props,
29
- splitIndicatorProps: () => splitIndicatorProps
30
- });
31
- module.exports = __toCommonJS(src_exports);
32
-
33
- // src/clipboard.anatomy.ts
34
- var import_anatomy = require("@zag-js/anatomy");
35
- var anatomy = (0, import_anatomy.createAnatomy)("clipboard").parts("root", "control", "trigger", "indicator", "input", "label");
36
- var parts = anatomy.build();
37
-
38
- // src/clipboard.connect.ts
39
- var import_dom_query2 = require("@zag-js/dom-query");
40
-
41
- // src/clipboard.dom.ts
42
- var import_dom_query = require("@zag-js/dom-query");
43
- var import_utils = require("@zag-js/utils");
44
- var dom = (0, import_dom_query.createScope)({
45
- getRootId: (ctx) => ctx.ids?.root ?? `clip-${ctx.id}`,
46
- getInputId: (ctx) => ctx.ids?.input ?? `clip-input-${ctx.id}`,
47
- getLabelId: (ctx) => ctx.ids?.label ?? `clip-label-${ctx.id}`,
48
- getInputEl: (ctx) => dom.getById(ctx, dom.getInputId(ctx)),
49
- writeToClipboard: (ctx) => copyText(dom.getDoc(ctx), ctx.value)
50
- });
51
- function createNode(doc, text) {
52
- const node = doc.createElement("pre");
53
- Object.assign(node.style, {
54
- width: "1px",
55
- height: "1px",
56
- position: "fixed",
57
- top: "5px"
58
- });
59
- node.textContent = text;
60
- return node;
61
- }
62
- function copyNode(node) {
63
- const win = (0, import_dom_query.getWindow)(node);
64
- const selection = win.getSelection();
65
- if (selection == null) {
66
- return Promise.reject(new Error());
67
- }
68
- selection.removeAllRanges();
69
- const doc = node.ownerDocument;
70
- const range = doc.createRange();
71
- range.selectNodeContents(node);
72
- selection.addRange(range);
73
- doc.execCommand("copy");
74
- selection.removeAllRanges();
75
- return Promise.resolve();
76
- }
77
- function copyText(doc, text) {
78
- const win = doc.defaultView || window;
79
- if ((0, import_utils.hasProp)(win.navigator, "clipboard")) {
80
- return win.navigator.clipboard.writeText(text);
81
- }
82
- if (!doc.body) {
83
- return Promise.reject(new Error());
84
- }
85
- const node = createNode(doc, text);
86
- doc.body.appendChild(node);
87
- copyNode(node);
88
- doc.body.removeChild(node);
89
- return Promise.resolve();
90
- }
91
-
92
- // src/clipboard.connect.ts
93
- function connect(state, send, normalize) {
94
- const copied = state.matches("copied");
95
- return {
96
- copied,
97
- value: state.context.value,
98
- setValue(value) {
99
- send({ type: "VALUE.SET", value });
100
- },
101
- copy() {
102
- send({ type: "COPY" });
103
- },
104
- rootProps: normalize.element({
105
- ...parts.root.attrs,
106
- "data-copied": (0, import_dom_query2.dataAttr)(copied),
107
- id: dom.getRootId(state.context)
108
- }),
109
- labelProps: normalize.label({
110
- ...parts.label.attrs,
111
- htmlFor: dom.getInputId(state.context),
112
- "data-copied": (0, import_dom_query2.dataAttr)(copied),
113
- id: dom.getLabelId(state.context)
114
- }),
115
- controlProps: normalize.element({
116
- ...parts.control.attrs,
117
- "data-copied": (0, import_dom_query2.dataAttr)(copied)
118
- }),
119
- inputProps: normalize.input({
120
- ...parts.input.attrs,
121
- defaultValue: state.context.value,
122
- "data-copied": (0, import_dom_query2.dataAttr)(copied),
123
- readOnly: true,
124
- "data-readonly": "true",
125
- id: dom.getInputId(state.context),
126
- onFocus(event) {
127
- event.currentTarget.select();
128
- },
129
- onCopy() {
130
- send({ type: "INPUT.COPY" });
131
- }
132
- }),
133
- triggerProps: normalize.button({
134
- ...parts.trigger.attrs,
135
- "aria-label": copied ? "Copied to clipboard" : "Copy to clipboard",
136
- "data-copied": (0, import_dom_query2.dataAttr)(copied),
137
- onClick() {
138
- send({ type: "COPY" });
139
- }
140
- }),
141
- getIndicatorProps(props2) {
142
- return normalize.element({
143
- ...parts.indicator.attrs,
144
- hidden: props2.copied !== copied
145
- });
146
- }
147
- };
148
- }
149
-
150
- // src/clipboard.machine.ts
151
- var import_core = require("@zag-js/core");
152
- var import_utils2 = require("@zag-js/utils");
153
- function machine(userContext) {
154
- const ctx = (0, import_utils2.compact)(userContext);
155
- return (0, import_core.createMachine)(
156
- {
157
- id: "clipboard",
158
- initial: "idle",
159
- context: {
160
- value: "",
161
- timeout: 3e3,
162
- ...ctx
163
- },
164
- watch: {
165
- value: ["syncInputElement"]
166
- },
167
- on: {
168
- "VALUE.SET": {
169
- actions: ["setValue"]
170
- },
171
- COPY: {
172
- target: "copied",
173
- actions: ["copyToClipboard", "invokeOnCopy"]
174
- }
175
- },
176
- states: {
177
- idle: {
178
- on: {
179
- "INPUT.COPY": {
180
- target: "copied",
181
- actions: ["invokeOnCopy"]
182
- }
183
- }
184
- },
185
- copied: {
186
- after: {
187
- COPY_TIMEOUT: "idle"
188
- },
189
- on: {
190
- COPY: {
191
- target: "copied",
192
- actions: ["copyToClipboard", "invokeOnCopy"]
193
- },
194
- "INPUT.COPY": {
195
- actions: ["invokeOnCopy"]
196
- }
197
- }
198
- }
199
- }
200
- },
201
- {
202
- actions: {
203
- setValue(ctx2, evt) {
204
- ctx2.value = evt.value;
205
- },
206
- copyToClipboard(ctx2) {
207
- dom.writeToClipboard(ctx2);
208
- },
209
- invokeOnCopy(ctx2) {
210
- ctx2.onStatusChange?.({ copied: true });
211
- },
212
- syncInputElement(ctx2) {
213
- dom.setValue(dom.getInputEl(ctx2), ctx2.value);
214
- }
215
- },
216
- delays: {
217
- COPY_TIMEOUT: (ctx2) => ctx2.timeout
218
- }
219
- }
220
- );
221
- }
222
-
223
- // src/clipboard.props.ts
224
- var import_types = require("@zag-js/types");
225
- var import_utils3 = require("@zag-js/utils");
226
- var props = (0, import_types.createProps)()([
227
- "getRootNode",
228
- "id",
229
- "ids",
230
- "value",
231
- "timeout",
232
- "onStatusChange"
233
- ]);
234
- var contextProps = (0, import_utils3.createSplitProps)(props);
235
- var indicatorProps = (0, import_types.createProps)()(["copied"]);
236
- var splitIndicatorProps = (0, import_utils3.createSplitProps)(indicatorProps);
237
- // Annotate the CommonJS export names for ESM import in node:
238
- 0 && (module.exports = {
239
- anatomy,
240
- connect,
241
- contextProps,
242
- indicatorProps,
243
- machine,
244
- props,
245
- splitIndicatorProps
246
- });
1
+ "use strict";var __defProp=Object.defineProperty;var __getOwnPropDesc=Object.getOwnPropertyDescriptor;var __getOwnPropNames=Object.getOwnPropertyNames;var __hasOwnProp=Object.prototype.hasOwnProperty;var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:true})};var __copyProps=(to,from,except,desc)=>{if(from&&typeof from==="object"||typeof from==="function"){for(let key of __getOwnPropNames(from))if(!__hasOwnProp.call(to,key)&&key!==except)__defProp(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable})}return to};var __toCommonJS=mod=>__copyProps(__defProp({},"__esModule",{value:true}),mod);var src_exports={};__export(src_exports,{anatomy:()=>anatomy,connect:()=>connect,contextProps:()=>contextProps,indicatorProps:()=>indicatorProps,machine:()=>machine,props:()=>props,splitIndicatorProps:()=>splitIndicatorProps});module.exports=__toCommonJS(src_exports);var import_anatomy=require("@zag-js/anatomy");var anatomy=(0,import_anatomy.createAnatomy)("clipboard").parts("root","control","trigger","indicator","input","label");var parts=anatomy.build();var import_dom_query2=require("@zag-js/dom-query");var import_dom_query=require("@zag-js/dom-query");var dom=(0,import_dom_query.createScope)({getRootId:ctx=>ctx.ids?.root??`clip-${ctx.id}`,getInputId:ctx=>ctx.ids?.input??`clip-input-${ctx.id}`,getLabelId:ctx=>ctx.ids?.label??`clip-label-${ctx.id}`,getInputEl:ctx=>dom.getById(ctx,dom.getInputId(ctx)),writeToClipboard:ctx=>copyText(dom.getDoc(ctx),ctx.value)});function createNode(doc,text){const node=doc.createElement("pre");Object.assign(node.style,{width:"1px",height:"1px",position:"fixed",top:"5px"});node.textContent=text;return node}function copyNode(node){const win=(0,import_dom_query.getWindow)(node);const selection=win.getSelection();if(selection==null){return Promise.reject(new Error)}selection.removeAllRanges();const doc=node.ownerDocument;const range=doc.createRange();range.selectNodeContents(node);selection.addRange(range);doc.execCommand("copy");selection.removeAllRanges();return Promise.resolve()}function copyText(doc,text){const win=doc.defaultView||window;if(win.navigator.clipboard?.writeText!==void 0){return win.navigator.clipboard.writeText(text)}if(!doc.body){return Promise.reject(new Error)}const node=createNode(doc,text);doc.body.appendChild(node);copyNode(node);doc.body.removeChild(node);return Promise.resolve()}function connect(state,send,normalize){const copied=state.matches("copied");return{copied,value:state.context.value,setValue(value){send({type:"VALUE.SET",value})},copy(){send({type:"COPY"})},rootProps:normalize.element({...parts.root.attrs,"data-copied":(0,import_dom_query2.dataAttr)(copied),id:dom.getRootId(state.context)}),labelProps:normalize.label({...parts.label.attrs,htmlFor:dom.getInputId(state.context),"data-copied":(0,import_dom_query2.dataAttr)(copied),id:dom.getLabelId(state.context)}),controlProps:normalize.element({...parts.control.attrs,"data-copied":(0,import_dom_query2.dataAttr)(copied)}),inputProps:normalize.input({...parts.input.attrs,defaultValue:state.context.value,"data-copied":(0,import_dom_query2.dataAttr)(copied),readOnly:true,"data-readonly":"true",id:dom.getInputId(state.context),onFocus(event){event.currentTarget.select()},onCopy(){send({type:"INPUT.COPY"})}}),triggerProps:normalize.button({...parts.trigger.attrs,"aria-label":copied?"Copied to clipboard":"Copy to clipboard","data-copied":(0,import_dom_query2.dataAttr)(copied),onClick(){send({type:"COPY"})}}),getIndicatorProps(props2){return normalize.element({...parts.indicator.attrs,hidden:props2.copied!==copied})}}}var import_core=require("@zag-js/core");var import_utils=require("@zag-js/utils");function machine(userContext){const ctx=(0,import_utils.compact)(userContext);return(0,import_core.createMachine)({id:"clipboard",initial:"idle",context:{value:"",timeout:3e3,...ctx},watch:{value:["syncInputElement"]},on:{"VALUE.SET":{actions:["setValue"]},COPY:{target:"copied",actions:["copyToClipboard","invokeOnCopy"]}},states:{idle:{on:{"INPUT.COPY":{target:"copied",actions:["invokeOnCopy"]}}},copied:{after:{COPY_TIMEOUT:"idle"},on:{COPY:{target:"copied",actions:["copyToClipboard","invokeOnCopy"]},"INPUT.COPY":{actions:["invokeOnCopy"]}}}}},{actions:{setValue(ctx2,evt){ctx2.value=evt.value},copyToClipboard(ctx2){dom.writeToClipboard(ctx2)},invokeOnCopy(ctx2){ctx2.onStatusChange?.({copied:true})},syncInputElement(ctx2){dom.setValue(dom.getInputEl(ctx2),ctx2.value)}},delays:{COPY_TIMEOUT:ctx2=>ctx2.timeout}})}var import_types=require("@zag-js/types");var import_utils2=require("@zag-js/utils");var props=(0,import_types.createProps)()(["getRootNode","id","ids","value","timeout","onStatusChange"]);var contextProps=(0,import_utils2.createSplitProps)(props);var indicatorProps=(0,import_types.createProps)()(["copied"]);var splitIndicatorProps=(0,import_utils2.createSplitProps)(indicatorProps);0&&(module.exports={anatomy,connect,contextProps,indicatorProps,machine,props,splitIndicatorProps});
247
2
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/clipboard.anatomy.ts","../src/clipboard.connect.ts","../src/clipboard.dom.ts","../src/clipboard.machine.ts","../src/clipboard.props.ts"],"sourcesContent":["export { anatomy } from \"./clipboard.anatomy\"\nexport { connect } from \"./clipboard.connect\"\nexport { machine } from \"./clipboard.machine\"\nexport * from \"./clipboard.props\"\nexport type {\n MachineApi as Api,\n UserDefinedContext as Context,\n CopyStatusDetails,\n ElementIds,\n IndicatorProps,\n} from \"./clipboard.types\"\n","import { createAnatomy } from \"@zag-js/anatomy\"\n\nexport const anatomy = createAnatomy(\"clipboard\").parts(\"root\", \"control\", \"trigger\", \"indicator\", \"input\", \"label\")\n\nexport const parts = anatomy.build()\n","import { dataAttr } from \"@zag-js/dom-query\"\nimport type { NormalizeProps, PropTypes } from \"@zag-js/types\"\nimport { parts } from \"./clipboard.anatomy\"\nimport type { MachineApi, Send, State } from \"./clipboard.types\"\nimport { dom } from \"./clipboard.dom\"\n\nexport function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): MachineApi<T> {\n const copied = state.matches(\"copied\")\n\n return {\n copied,\n value: state.context.value,\n setValue(value) {\n send({ type: \"VALUE.SET\", value })\n },\n copy() {\n send({ type: \"COPY\" })\n },\n rootProps: normalize.element({\n ...parts.root.attrs,\n \"data-copied\": dataAttr(copied),\n id: dom.getRootId(state.context),\n }),\n labelProps: normalize.label({\n ...parts.label.attrs,\n htmlFor: dom.getInputId(state.context),\n \"data-copied\": dataAttr(copied),\n id: dom.getLabelId(state.context),\n }),\n controlProps: normalize.element({\n ...parts.control.attrs,\n \"data-copied\": dataAttr(copied),\n }),\n inputProps: normalize.input({\n ...parts.input.attrs,\n defaultValue: state.context.value,\n \"data-copied\": dataAttr(copied),\n readOnly: true,\n \"data-readonly\": \"true\",\n id: dom.getInputId(state.context),\n onFocus(event) {\n event.currentTarget.select()\n },\n onCopy() {\n send({ type: \"INPUT.COPY\" })\n },\n }),\n triggerProps: normalize.button({\n ...parts.trigger.attrs,\n \"aria-label\": copied ? \"Copied to clipboard\" : \"Copy to clipboard\",\n \"data-copied\": dataAttr(copied),\n onClick() {\n send({ type: \"COPY\" })\n },\n }),\n getIndicatorProps(props) {\n return normalize.element({\n ...parts.indicator.attrs,\n hidden: props.copied !== copied,\n })\n },\n }\n}\n","import { createScope, getWindow } from \"@zag-js/dom-query\"\nimport { hasProp } from \"@zag-js/utils\"\nimport type { MachineContext as Ctx } from \"./clipboard.types\"\n\nexport const dom = createScope({\n getRootId: (ctx: Ctx) => ctx.ids?.root ?? `clip-${ctx.id}`,\n getInputId: (ctx: Ctx) => ctx.ids?.input ?? `clip-input-${ctx.id}`,\n getLabelId: (ctx: Ctx) => ctx.ids?.label ?? `clip-label-${ctx.id}`,\n getInputEl: (ctx: Ctx) => dom.getById<HTMLInputElement>(ctx, dom.getInputId(ctx)),\n writeToClipboard: (ctx: Ctx) => copyText(dom.getDoc(ctx), ctx.value),\n})\n\nfunction createNode(doc: Document, text: string): HTMLElement {\n const node = doc.createElement(\"pre\")\n Object.assign(node.style, {\n width: \"1px\",\n height: \"1px\",\n position: \"fixed\",\n top: \"5px\",\n })\n node.textContent = text\n return node\n}\n\nfunction copyNode(node: HTMLElement): Promise<void> {\n const win = getWindow(node)\n\n const selection = win.getSelection()\n\n if (selection == null) {\n return Promise.reject(new Error())\n }\n\n selection.removeAllRanges()\n\n const doc = node.ownerDocument\n\n const range = doc.createRange()\n range.selectNodeContents(node)\n selection.addRange(range)\n\n doc.execCommand(\"copy\")\n selection.removeAllRanges()\n\n return Promise.resolve()\n}\n\nfunction copyText(doc: Document, text: string): Promise<void> {\n const win = doc.defaultView || window\n\n if (hasProp(win.navigator, \"clipboard\")) {\n return win.navigator.clipboard.writeText(text)\n }\n\n if (!doc.body) {\n return Promise.reject(new Error())\n }\n\n const node = createNode(doc, text)\n\n doc.body.appendChild(node)\n copyNode(node)\n doc.body.removeChild(node)\n\n return Promise.resolve()\n}\n","import { createMachine } from \"@zag-js/core\"\nimport { compact } from \"@zag-js/utils\"\nimport { dom } from \"./clipboard.dom\"\nimport type { MachineContext, MachineState, UserDefinedContext } from \"./clipboard.types\"\n\nexport function machine(userContext: UserDefinedContext) {\n const ctx = compact(userContext)\n return createMachine<MachineContext, MachineState>(\n {\n id: \"clipboard\",\n initial: \"idle\",\n context: {\n value: \"\",\n timeout: 3000,\n ...ctx,\n },\n watch: {\n value: [\"syncInputElement\"],\n },\n on: {\n \"VALUE.SET\": {\n actions: [\"setValue\"],\n },\n COPY: {\n target: \"copied\",\n actions: [\"copyToClipboard\", \"invokeOnCopy\"],\n },\n },\n states: {\n idle: {\n on: {\n \"INPUT.COPY\": {\n target: \"copied\",\n actions: [\"invokeOnCopy\"],\n },\n },\n },\n copied: {\n after: {\n COPY_TIMEOUT: \"idle\",\n },\n on: {\n COPY: {\n target: \"copied\",\n actions: [\"copyToClipboard\", \"invokeOnCopy\"],\n },\n \"INPUT.COPY\": {\n actions: [\"invokeOnCopy\"],\n },\n },\n },\n },\n },\n {\n actions: {\n setValue(ctx, evt) {\n ctx.value = evt.value\n },\n copyToClipboard(ctx) {\n dom.writeToClipboard(ctx)\n },\n invokeOnCopy(ctx) {\n ctx.onStatusChange?.({ copied: true })\n },\n syncInputElement(ctx) {\n dom.setValue(dom.getInputEl(ctx), ctx.value)\n },\n },\n delays: {\n COPY_TIMEOUT: (ctx) => ctx.timeout,\n },\n },\n )\n}\n","import { createProps } from \"@zag-js/types\"\nimport type { IndicatorProps, UserDefinedContext } from \"./clipboard.types\"\nimport { createSplitProps } from \"@zag-js/utils\"\n\nexport const props = createProps<UserDefinedContext>()([\n \"getRootNode\",\n \"id\",\n \"ids\",\n \"value\",\n \"timeout\",\n \"onStatusChange\",\n])\nexport const contextProps = createSplitProps<UserDefinedContext>(props)\n\nexport const indicatorProps = createProps<IndicatorProps>()([\"copied\"])\nexport const splitIndicatorProps = createSplitProps<IndicatorProps>(indicatorProps)\n"],"mappings":"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","names":["import_dom_query","props","import_utils","ctx","import_utils"]}
1
+ {"version":3,"sources":["../src/index.ts","../src/clipboard.anatomy.ts","../src/clipboard.connect.ts","../src/clipboard.dom.ts","../src/clipboard.machine.ts","../src/clipboard.props.ts"],"sourcesContent":["export { anatomy } from \"./clipboard.anatomy\"\nexport { connect } from \"./clipboard.connect\"\nexport { machine } from \"./clipboard.machine\"\nexport * from \"./clipboard.props\"\nexport type {\n MachineApi as Api,\n UserDefinedContext as Context,\n CopyStatusDetails,\n ElementIds,\n IndicatorProps,\n} from \"./clipboard.types\"\n","import { createAnatomy } from \"@zag-js/anatomy\"\n\nexport const anatomy = createAnatomy(\"clipboard\").parts(\"root\", \"control\", \"trigger\", \"indicator\", \"input\", \"label\")\n\nexport const parts = anatomy.build()\n","import { dataAttr } from \"@zag-js/dom-query\"\nimport type { NormalizeProps, PropTypes } from \"@zag-js/types\"\nimport { parts } from \"./clipboard.anatomy\"\nimport type { MachineApi, Send, State } from \"./clipboard.types\"\nimport { dom } from \"./clipboard.dom\"\n\nexport function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): MachineApi<T> {\n const copied = state.matches(\"copied\")\n\n return {\n copied,\n value: state.context.value,\n setValue(value) {\n send({ type: \"VALUE.SET\", value })\n },\n copy() {\n send({ type: \"COPY\" })\n },\n rootProps: normalize.element({\n ...parts.root.attrs,\n \"data-copied\": dataAttr(copied),\n id: dom.getRootId(state.context),\n }),\n labelProps: normalize.label({\n ...parts.label.attrs,\n htmlFor: dom.getInputId(state.context),\n \"data-copied\": dataAttr(copied),\n id: dom.getLabelId(state.context),\n }),\n controlProps: normalize.element({\n ...parts.control.attrs,\n \"data-copied\": dataAttr(copied),\n }),\n inputProps: normalize.input({\n ...parts.input.attrs,\n defaultValue: state.context.value,\n \"data-copied\": dataAttr(copied),\n readOnly: true,\n \"data-readonly\": \"true\",\n id: dom.getInputId(state.context),\n onFocus(event) {\n event.currentTarget.select()\n },\n onCopy() {\n send({ type: \"INPUT.COPY\" })\n },\n }),\n triggerProps: normalize.button({\n ...parts.trigger.attrs,\n \"aria-label\": copied ? \"Copied to clipboard\" : \"Copy to clipboard\",\n \"data-copied\": dataAttr(copied),\n onClick() {\n send({ type: \"COPY\" })\n },\n }),\n getIndicatorProps(props) {\n return normalize.element({\n ...parts.indicator.attrs,\n hidden: props.copied !== copied,\n })\n },\n }\n}\n","import { createScope, getWindow } from \"@zag-js/dom-query\"\nimport type { MachineContext as Ctx } from \"./clipboard.types\"\n\nexport const dom = createScope({\n getRootId: (ctx: Ctx) => ctx.ids?.root ?? `clip-${ctx.id}`,\n getInputId: (ctx: Ctx) => ctx.ids?.input ?? `clip-input-${ctx.id}`,\n getLabelId: (ctx: Ctx) => ctx.ids?.label ?? `clip-label-${ctx.id}`,\n getInputEl: (ctx: Ctx) => dom.getById<HTMLInputElement>(ctx, dom.getInputId(ctx)),\n writeToClipboard: (ctx: Ctx) => copyText(dom.getDoc(ctx), ctx.value),\n})\n\nfunction createNode(doc: Document, text: string): HTMLElement {\n const node = doc.createElement(\"pre\")\n Object.assign(node.style, {\n width: \"1px\",\n height: \"1px\",\n position: \"fixed\",\n top: \"5px\",\n })\n node.textContent = text\n return node\n}\n\nfunction copyNode(node: HTMLElement): Promise<void> {\n const win = getWindow(node)\n\n const selection = win.getSelection()\n\n if (selection == null) {\n return Promise.reject(new Error())\n }\n\n selection.removeAllRanges()\n\n const doc = node.ownerDocument\n\n const range = doc.createRange()\n range.selectNodeContents(node)\n selection.addRange(range)\n\n doc.execCommand(\"copy\")\n selection.removeAllRanges()\n\n return Promise.resolve()\n}\n\nfunction copyText(doc: Document, text: string): Promise<void> {\n const win = doc.defaultView || window\n\n if (win.navigator.clipboard?.writeText !== undefined) {\n return win.navigator.clipboard.writeText(text)\n }\n\n if (!doc.body) {\n return Promise.reject(new Error())\n }\n\n const node = createNode(doc, text)\n\n doc.body.appendChild(node)\n copyNode(node)\n doc.body.removeChild(node)\n\n return Promise.resolve()\n}\n","import { createMachine } from \"@zag-js/core\"\nimport { compact } from \"@zag-js/utils\"\nimport { dom } from \"./clipboard.dom\"\nimport type { MachineContext, MachineState, UserDefinedContext } from \"./clipboard.types\"\n\nexport function machine(userContext: UserDefinedContext) {\n const ctx = compact(userContext)\n return createMachine<MachineContext, MachineState>(\n {\n id: \"clipboard\",\n initial: \"idle\",\n context: {\n value: \"\",\n timeout: 3000,\n ...ctx,\n },\n watch: {\n value: [\"syncInputElement\"],\n },\n on: {\n \"VALUE.SET\": {\n actions: [\"setValue\"],\n },\n COPY: {\n target: \"copied\",\n actions: [\"copyToClipboard\", \"invokeOnCopy\"],\n },\n },\n states: {\n idle: {\n on: {\n \"INPUT.COPY\": {\n target: \"copied\",\n actions: [\"invokeOnCopy\"],\n },\n },\n },\n copied: {\n after: {\n COPY_TIMEOUT: \"idle\",\n },\n on: {\n COPY: {\n target: \"copied\",\n actions: [\"copyToClipboard\", \"invokeOnCopy\"],\n },\n \"INPUT.COPY\": {\n actions: [\"invokeOnCopy\"],\n },\n },\n },\n },\n },\n {\n actions: {\n setValue(ctx, evt) {\n ctx.value = evt.value\n },\n copyToClipboard(ctx) {\n dom.writeToClipboard(ctx)\n },\n invokeOnCopy(ctx) {\n ctx.onStatusChange?.({ copied: true })\n },\n syncInputElement(ctx) {\n dom.setValue(dom.getInputEl(ctx), ctx.value)\n },\n },\n delays: {\n COPY_TIMEOUT: (ctx) => ctx.timeout,\n },\n },\n )\n}\n","import { createProps } from \"@zag-js/types\"\nimport type { IndicatorProps, UserDefinedContext } from \"./clipboard.types\"\nimport { createSplitProps } from \"@zag-js/utils\"\n\nexport const props = createProps<UserDefinedContext>()([\n \"getRootNode\",\n \"id\",\n \"ids\",\n \"value\",\n \"timeout\",\n \"onStatusChange\",\n])\nexport const contextProps = createSplitProps<UserDefinedContext>(props)\n\nexport const indicatorProps = createProps<IndicatorProps>()([\"copied\"])\nexport const splitIndicatorProps = createSplitProps<IndicatorProps>(indicatorProps)\n"],"mappings":"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","names":["import_dom_query","props","ctx","import_utils"]}
package/dist/index.mjs CHANGED
@@ -1,214 +1,2 @@
1
- // src/clipboard.anatomy.ts
2
- import { createAnatomy } from "@zag-js/anatomy";
3
- var anatomy = createAnatomy("clipboard").parts("root", "control", "trigger", "indicator", "input", "label");
4
- var parts = anatomy.build();
5
-
6
- // src/clipboard.connect.ts
7
- import { dataAttr } from "@zag-js/dom-query";
8
-
9
- // src/clipboard.dom.ts
10
- import { createScope, getWindow } from "@zag-js/dom-query";
11
- import { hasProp } from "@zag-js/utils";
12
- var dom = createScope({
13
- getRootId: (ctx) => ctx.ids?.root ?? `clip-${ctx.id}`,
14
- getInputId: (ctx) => ctx.ids?.input ?? `clip-input-${ctx.id}`,
15
- getLabelId: (ctx) => ctx.ids?.label ?? `clip-label-${ctx.id}`,
16
- getInputEl: (ctx) => dom.getById(ctx, dom.getInputId(ctx)),
17
- writeToClipboard: (ctx) => copyText(dom.getDoc(ctx), ctx.value)
18
- });
19
- function createNode(doc, text) {
20
- const node = doc.createElement("pre");
21
- Object.assign(node.style, {
22
- width: "1px",
23
- height: "1px",
24
- position: "fixed",
25
- top: "5px"
26
- });
27
- node.textContent = text;
28
- return node;
29
- }
30
- function copyNode(node) {
31
- const win = getWindow(node);
32
- const selection = win.getSelection();
33
- if (selection == null) {
34
- return Promise.reject(new Error());
35
- }
36
- selection.removeAllRanges();
37
- const doc = node.ownerDocument;
38
- const range = doc.createRange();
39
- range.selectNodeContents(node);
40
- selection.addRange(range);
41
- doc.execCommand("copy");
42
- selection.removeAllRanges();
43
- return Promise.resolve();
44
- }
45
- function copyText(doc, text) {
46
- const win = doc.defaultView || window;
47
- if (hasProp(win.navigator, "clipboard")) {
48
- return win.navigator.clipboard.writeText(text);
49
- }
50
- if (!doc.body) {
51
- return Promise.reject(new Error());
52
- }
53
- const node = createNode(doc, text);
54
- doc.body.appendChild(node);
55
- copyNode(node);
56
- doc.body.removeChild(node);
57
- return Promise.resolve();
58
- }
59
-
60
- // src/clipboard.connect.ts
61
- function connect(state, send, normalize) {
62
- const copied = state.matches("copied");
63
- return {
64
- copied,
65
- value: state.context.value,
66
- setValue(value) {
67
- send({ type: "VALUE.SET", value });
68
- },
69
- copy() {
70
- send({ type: "COPY" });
71
- },
72
- rootProps: normalize.element({
73
- ...parts.root.attrs,
74
- "data-copied": dataAttr(copied),
75
- id: dom.getRootId(state.context)
76
- }),
77
- labelProps: normalize.label({
78
- ...parts.label.attrs,
79
- htmlFor: dom.getInputId(state.context),
80
- "data-copied": dataAttr(copied),
81
- id: dom.getLabelId(state.context)
82
- }),
83
- controlProps: normalize.element({
84
- ...parts.control.attrs,
85
- "data-copied": dataAttr(copied)
86
- }),
87
- inputProps: normalize.input({
88
- ...parts.input.attrs,
89
- defaultValue: state.context.value,
90
- "data-copied": dataAttr(copied),
91
- readOnly: true,
92
- "data-readonly": "true",
93
- id: dom.getInputId(state.context),
94
- onFocus(event) {
95
- event.currentTarget.select();
96
- },
97
- onCopy() {
98
- send({ type: "INPUT.COPY" });
99
- }
100
- }),
101
- triggerProps: normalize.button({
102
- ...parts.trigger.attrs,
103
- "aria-label": copied ? "Copied to clipboard" : "Copy to clipboard",
104
- "data-copied": dataAttr(copied),
105
- onClick() {
106
- send({ type: "COPY" });
107
- }
108
- }),
109
- getIndicatorProps(props2) {
110
- return normalize.element({
111
- ...parts.indicator.attrs,
112
- hidden: props2.copied !== copied
113
- });
114
- }
115
- };
116
- }
117
-
118
- // src/clipboard.machine.ts
119
- import { createMachine } from "@zag-js/core";
120
- import { compact } from "@zag-js/utils";
121
- function machine(userContext) {
122
- const ctx = compact(userContext);
123
- return createMachine(
124
- {
125
- id: "clipboard",
126
- initial: "idle",
127
- context: {
128
- value: "",
129
- timeout: 3e3,
130
- ...ctx
131
- },
132
- watch: {
133
- value: ["syncInputElement"]
134
- },
135
- on: {
136
- "VALUE.SET": {
137
- actions: ["setValue"]
138
- },
139
- COPY: {
140
- target: "copied",
141
- actions: ["copyToClipboard", "invokeOnCopy"]
142
- }
143
- },
144
- states: {
145
- idle: {
146
- on: {
147
- "INPUT.COPY": {
148
- target: "copied",
149
- actions: ["invokeOnCopy"]
150
- }
151
- }
152
- },
153
- copied: {
154
- after: {
155
- COPY_TIMEOUT: "idle"
156
- },
157
- on: {
158
- COPY: {
159
- target: "copied",
160
- actions: ["copyToClipboard", "invokeOnCopy"]
161
- },
162
- "INPUT.COPY": {
163
- actions: ["invokeOnCopy"]
164
- }
165
- }
166
- }
167
- }
168
- },
169
- {
170
- actions: {
171
- setValue(ctx2, evt) {
172
- ctx2.value = evt.value;
173
- },
174
- copyToClipboard(ctx2) {
175
- dom.writeToClipboard(ctx2);
176
- },
177
- invokeOnCopy(ctx2) {
178
- ctx2.onStatusChange?.({ copied: true });
179
- },
180
- syncInputElement(ctx2) {
181
- dom.setValue(dom.getInputEl(ctx2), ctx2.value);
182
- }
183
- },
184
- delays: {
185
- COPY_TIMEOUT: (ctx2) => ctx2.timeout
186
- }
187
- }
188
- );
189
- }
190
-
191
- // src/clipboard.props.ts
192
- import { createProps } from "@zag-js/types";
193
- import { createSplitProps } from "@zag-js/utils";
194
- var props = createProps()([
195
- "getRootNode",
196
- "id",
197
- "ids",
198
- "value",
199
- "timeout",
200
- "onStatusChange"
201
- ]);
202
- var contextProps = createSplitProps(props);
203
- var indicatorProps = createProps()(["copied"]);
204
- var splitIndicatorProps = createSplitProps(indicatorProps);
205
- export {
206
- anatomy,
207
- connect,
208
- contextProps,
209
- indicatorProps,
210
- machine,
211
- props,
212
- splitIndicatorProps
213
- };
1
+ import{createAnatomy}from"@zag-js/anatomy";var anatomy=createAnatomy("clipboard").parts("root","control","trigger","indicator","input","label");var parts=anatomy.build();import{dataAttr}from"@zag-js/dom-query";import{createScope,getWindow}from"@zag-js/dom-query";var dom=createScope({getRootId:ctx=>ctx.ids?.root??`clip-${ctx.id}`,getInputId:ctx=>ctx.ids?.input??`clip-input-${ctx.id}`,getLabelId:ctx=>ctx.ids?.label??`clip-label-${ctx.id}`,getInputEl:ctx=>dom.getById(ctx,dom.getInputId(ctx)),writeToClipboard:ctx=>copyText(dom.getDoc(ctx),ctx.value)});function createNode(doc,text){const node=doc.createElement("pre");Object.assign(node.style,{width:"1px",height:"1px",position:"fixed",top:"5px"});node.textContent=text;return node}function copyNode(node){const win=getWindow(node);const selection=win.getSelection();if(selection==null){return Promise.reject(new Error)}selection.removeAllRanges();const doc=node.ownerDocument;const range=doc.createRange();range.selectNodeContents(node);selection.addRange(range);doc.execCommand("copy");selection.removeAllRanges();return Promise.resolve()}function copyText(doc,text){const win=doc.defaultView||window;if(win.navigator.clipboard?.writeText!==void 0){return win.navigator.clipboard.writeText(text)}if(!doc.body){return Promise.reject(new Error)}const node=createNode(doc,text);doc.body.appendChild(node);copyNode(node);doc.body.removeChild(node);return Promise.resolve()}function connect(state,send,normalize){const copied=state.matches("copied");return{copied,value:state.context.value,setValue(value){send({type:"VALUE.SET",value})},copy(){send({type:"COPY"})},rootProps:normalize.element({...parts.root.attrs,"data-copied":dataAttr(copied),id:dom.getRootId(state.context)}),labelProps:normalize.label({...parts.label.attrs,htmlFor:dom.getInputId(state.context),"data-copied":dataAttr(copied),id:dom.getLabelId(state.context)}),controlProps:normalize.element({...parts.control.attrs,"data-copied":dataAttr(copied)}),inputProps:normalize.input({...parts.input.attrs,defaultValue:state.context.value,"data-copied":dataAttr(copied),readOnly:true,"data-readonly":"true",id:dom.getInputId(state.context),onFocus(event){event.currentTarget.select()},onCopy(){send({type:"INPUT.COPY"})}}),triggerProps:normalize.button({...parts.trigger.attrs,"aria-label":copied?"Copied to clipboard":"Copy to clipboard","data-copied":dataAttr(copied),onClick(){send({type:"COPY"})}}),getIndicatorProps(props2){return normalize.element({...parts.indicator.attrs,hidden:props2.copied!==copied})}}}import{createMachine}from"@zag-js/core";import{compact}from"@zag-js/utils";function machine(userContext){const ctx=compact(userContext);return createMachine({id:"clipboard",initial:"idle",context:{value:"",timeout:3e3,...ctx},watch:{value:["syncInputElement"]},on:{"VALUE.SET":{actions:["setValue"]},COPY:{target:"copied",actions:["copyToClipboard","invokeOnCopy"]}},states:{idle:{on:{"INPUT.COPY":{target:"copied",actions:["invokeOnCopy"]}}},copied:{after:{COPY_TIMEOUT:"idle"},on:{COPY:{target:"copied",actions:["copyToClipboard","invokeOnCopy"]},"INPUT.COPY":{actions:["invokeOnCopy"]}}}}},{actions:{setValue(ctx2,evt){ctx2.value=evt.value},copyToClipboard(ctx2){dom.writeToClipboard(ctx2)},invokeOnCopy(ctx2){ctx2.onStatusChange?.({copied:true})},syncInputElement(ctx2){dom.setValue(dom.getInputEl(ctx2),ctx2.value)}},delays:{COPY_TIMEOUT:ctx2=>ctx2.timeout}})}import{createProps}from"@zag-js/types";import{createSplitProps}from"@zag-js/utils";var props=createProps()(["getRootNode","id","ids","value","timeout","onStatusChange"]);var contextProps=createSplitProps(props);var indicatorProps=createProps()(["copied"]);var splitIndicatorProps=createSplitProps(indicatorProps);export{anatomy,connect,contextProps,indicatorProps,machine,props,splitIndicatorProps};
214
2
  //# sourceMappingURL=index.mjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/clipboard.anatomy.ts","../src/clipboard.connect.ts","../src/clipboard.dom.ts","../src/clipboard.machine.ts","../src/clipboard.props.ts"],"sourcesContent":["import { createAnatomy } from \"@zag-js/anatomy\"\n\nexport const anatomy = createAnatomy(\"clipboard\").parts(\"root\", \"control\", \"trigger\", \"indicator\", \"input\", \"label\")\n\nexport const parts = anatomy.build()\n","import { dataAttr } from \"@zag-js/dom-query\"\nimport type { NormalizeProps, PropTypes } from \"@zag-js/types\"\nimport { parts } from \"./clipboard.anatomy\"\nimport type { MachineApi, Send, State } from \"./clipboard.types\"\nimport { dom } from \"./clipboard.dom\"\n\nexport function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): MachineApi<T> {\n const copied = state.matches(\"copied\")\n\n return {\n copied,\n value: state.context.value,\n setValue(value) {\n send({ type: \"VALUE.SET\", value })\n },\n copy() {\n send({ type: \"COPY\" })\n },\n rootProps: normalize.element({\n ...parts.root.attrs,\n \"data-copied\": dataAttr(copied),\n id: dom.getRootId(state.context),\n }),\n labelProps: normalize.label({\n ...parts.label.attrs,\n htmlFor: dom.getInputId(state.context),\n \"data-copied\": dataAttr(copied),\n id: dom.getLabelId(state.context),\n }),\n controlProps: normalize.element({\n ...parts.control.attrs,\n \"data-copied\": dataAttr(copied),\n }),\n inputProps: normalize.input({\n ...parts.input.attrs,\n defaultValue: state.context.value,\n \"data-copied\": dataAttr(copied),\n readOnly: true,\n \"data-readonly\": \"true\",\n id: dom.getInputId(state.context),\n onFocus(event) {\n event.currentTarget.select()\n },\n onCopy() {\n send({ type: \"INPUT.COPY\" })\n },\n }),\n triggerProps: normalize.button({\n ...parts.trigger.attrs,\n \"aria-label\": copied ? \"Copied to clipboard\" : \"Copy to clipboard\",\n \"data-copied\": dataAttr(copied),\n onClick() {\n send({ type: \"COPY\" })\n },\n }),\n getIndicatorProps(props) {\n return normalize.element({\n ...parts.indicator.attrs,\n hidden: props.copied !== copied,\n })\n },\n }\n}\n","import { createScope, getWindow } from \"@zag-js/dom-query\"\nimport { hasProp } from \"@zag-js/utils\"\nimport type { MachineContext as Ctx } from \"./clipboard.types\"\n\nexport const dom = createScope({\n getRootId: (ctx: Ctx) => ctx.ids?.root ?? `clip-${ctx.id}`,\n getInputId: (ctx: Ctx) => ctx.ids?.input ?? `clip-input-${ctx.id}`,\n getLabelId: (ctx: Ctx) => ctx.ids?.label ?? `clip-label-${ctx.id}`,\n getInputEl: (ctx: Ctx) => dom.getById<HTMLInputElement>(ctx, dom.getInputId(ctx)),\n writeToClipboard: (ctx: Ctx) => copyText(dom.getDoc(ctx), ctx.value),\n})\n\nfunction createNode(doc: Document, text: string): HTMLElement {\n const node = doc.createElement(\"pre\")\n Object.assign(node.style, {\n width: \"1px\",\n height: \"1px\",\n position: \"fixed\",\n top: \"5px\",\n })\n node.textContent = text\n return node\n}\n\nfunction copyNode(node: HTMLElement): Promise<void> {\n const win = getWindow(node)\n\n const selection = win.getSelection()\n\n if (selection == null) {\n return Promise.reject(new Error())\n }\n\n selection.removeAllRanges()\n\n const doc = node.ownerDocument\n\n const range = doc.createRange()\n range.selectNodeContents(node)\n selection.addRange(range)\n\n doc.execCommand(\"copy\")\n selection.removeAllRanges()\n\n return Promise.resolve()\n}\n\nfunction copyText(doc: Document, text: string): Promise<void> {\n const win = doc.defaultView || window\n\n if (hasProp(win.navigator, \"clipboard\")) {\n return win.navigator.clipboard.writeText(text)\n }\n\n if (!doc.body) {\n return Promise.reject(new Error())\n }\n\n const node = createNode(doc, text)\n\n doc.body.appendChild(node)\n copyNode(node)\n doc.body.removeChild(node)\n\n return Promise.resolve()\n}\n","import { createMachine } from \"@zag-js/core\"\nimport { compact } from \"@zag-js/utils\"\nimport { dom } from \"./clipboard.dom\"\nimport type { MachineContext, MachineState, UserDefinedContext } from \"./clipboard.types\"\n\nexport function machine(userContext: UserDefinedContext) {\n const ctx = compact(userContext)\n return createMachine<MachineContext, MachineState>(\n {\n id: \"clipboard\",\n initial: \"idle\",\n context: {\n value: \"\",\n timeout: 3000,\n ...ctx,\n },\n watch: {\n value: [\"syncInputElement\"],\n },\n on: {\n \"VALUE.SET\": {\n actions: [\"setValue\"],\n },\n COPY: {\n target: \"copied\",\n actions: [\"copyToClipboard\", \"invokeOnCopy\"],\n },\n },\n states: {\n idle: {\n on: {\n \"INPUT.COPY\": {\n target: \"copied\",\n actions: [\"invokeOnCopy\"],\n },\n },\n },\n copied: {\n after: {\n COPY_TIMEOUT: \"idle\",\n },\n on: {\n COPY: {\n target: \"copied\",\n actions: [\"copyToClipboard\", \"invokeOnCopy\"],\n },\n \"INPUT.COPY\": {\n actions: [\"invokeOnCopy\"],\n },\n },\n },\n },\n },\n {\n actions: {\n setValue(ctx, evt) {\n ctx.value = evt.value\n },\n copyToClipboard(ctx) {\n dom.writeToClipboard(ctx)\n },\n invokeOnCopy(ctx) {\n ctx.onStatusChange?.({ copied: true })\n },\n syncInputElement(ctx) {\n dom.setValue(dom.getInputEl(ctx), ctx.value)\n },\n },\n delays: {\n COPY_TIMEOUT: (ctx) => ctx.timeout,\n },\n },\n )\n}\n","import { createProps } from \"@zag-js/types\"\nimport type { IndicatorProps, UserDefinedContext } from \"./clipboard.types\"\nimport { createSplitProps } from \"@zag-js/utils\"\n\nexport const props = createProps<UserDefinedContext>()([\n \"getRootNode\",\n \"id\",\n \"ids\",\n \"value\",\n \"timeout\",\n \"onStatusChange\",\n])\nexport const contextProps = createSplitProps<UserDefinedContext>(props)\n\nexport const indicatorProps = createProps<IndicatorProps>()([\"copied\"])\nexport const splitIndicatorProps = createSplitProps<IndicatorProps>(indicatorProps)\n"],"mappings":"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","names":["props","ctx"]}
1
+ {"version":3,"sources":["../src/clipboard.anatomy.ts","../src/clipboard.connect.ts","../src/clipboard.dom.ts","../src/clipboard.machine.ts","../src/clipboard.props.ts"],"sourcesContent":["import { createAnatomy } from \"@zag-js/anatomy\"\n\nexport const anatomy = createAnatomy(\"clipboard\").parts(\"root\", \"control\", \"trigger\", \"indicator\", \"input\", \"label\")\n\nexport const parts = anatomy.build()\n","import { dataAttr } from \"@zag-js/dom-query\"\nimport type { NormalizeProps, PropTypes } from \"@zag-js/types\"\nimport { parts } from \"./clipboard.anatomy\"\nimport type { MachineApi, Send, State } from \"./clipboard.types\"\nimport { dom } from \"./clipboard.dom\"\n\nexport function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): MachineApi<T> {\n const copied = state.matches(\"copied\")\n\n return {\n copied,\n value: state.context.value,\n setValue(value) {\n send({ type: \"VALUE.SET\", value })\n },\n copy() {\n send({ type: \"COPY\" })\n },\n rootProps: normalize.element({\n ...parts.root.attrs,\n \"data-copied\": dataAttr(copied),\n id: dom.getRootId(state.context),\n }),\n labelProps: normalize.label({\n ...parts.label.attrs,\n htmlFor: dom.getInputId(state.context),\n \"data-copied\": dataAttr(copied),\n id: dom.getLabelId(state.context),\n }),\n controlProps: normalize.element({\n ...parts.control.attrs,\n \"data-copied\": dataAttr(copied),\n }),\n inputProps: normalize.input({\n ...parts.input.attrs,\n defaultValue: state.context.value,\n \"data-copied\": dataAttr(copied),\n readOnly: true,\n \"data-readonly\": \"true\",\n id: dom.getInputId(state.context),\n onFocus(event) {\n event.currentTarget.select()\n },\n onCopy() {\n send({ type: \"INPUT.COPY\" })\n },\n }),\n triggerProps: normalize.button({\n ...parts.trigger.attrs,\n \"aria-label\": copied ? \"Copied to clipboard\" : \"Copy to clipboard\",\n \"data-copied\": dataAttr(copied),\n onClick() {\n send({ type: \"COPY\" })\n },\n }),\n getIndicatorProps(props) {\n return normalize.element({\n ...parts.indicator.attrs,\n hidden: props.copied !== copied,\n })\n },\n }\n}\n","import { createScope, getWindow } from \"@zag-js/dom-query\"\nimport type { MachineContext as Ctx } from \"./clipboard.types\"\n\nexport const dom = createScope({\n getRootId: (ctx: Ctx) => ctx.ids?.root ?? `clip-${ctx.id}`,\n getInputId: (ctx: Ctx) => ctx.ids?.input ?? `clip-input-${ctx.id}`,\n getLabelId: (ctx: Ctx) => ctx.ids?.label ?? `clip-label-${ctx.id}`,\n getInputEl: (ctx: Ctx) => dom.getById<HTMLInputElement>(ctx, dom.getInputId(ctx)),\n writeToClipboard: (ctx: Ctx) => copyText(dom.getDoc(ctx), ctx.value),\n})\n\nfunction createNode(doc: Document, text: string): HTMLElement {\n const node = doc.createElement(\"pre\")\n Object.assign(node.style, {\n width: \"1px\",\n height: \"1px\",\n position: \"fixed\",\n top: \"5px\",\n })\n node.textContent = text\n return node\n}\n\nfunction copyNode(node: HTMLElement): Promise<void> {\n const win = getWindow(node)\n\n const selection = win.getSelection()\n\n if (selection == null) {\n return Promise.reject(new Error())\n }\n\n selection.removeAllRanges()\n\n const doc = node.ownerDocument\n\n const range = doc.createRange()\n range.selectNodeContents(node)\n selection.addRange(range)\n\n doc.execCommand(\"copy\")\n selection.removeAllRanges()\n\n return Promise.resolve()\n}\n\nfunction copyText(doc: Document, text: string): Promise<void> {\n const win = doc.defaultView || window\n\n if (win.navigator.clipboard?.writeText !== undefined) {\n return win.navigator.clipboard.writeText(text)\n }\n\n if (!doc.body) {\n return Promise.reject(new Error())\n }\n\n const node = createNode(doc, text)\n\n doc.body.appendChild(node)\n copyNode(node)\n doc.body.removeChild(node)\n\n return Promise.resolve()\n}\n","import { createMachine } from \"@zag-js/core\"\nimport { compact } from \"@zag-js/utils\"\nimport { dom } from \"./clipboard.dom\"\nimport type { MachineContext, MachineState, UserDefinedContext } from \"./clipboard.types\"\n\nexport function machine(userContext: UserDefinedContext) {\n const ctx = compact(userContext)\n return createMachine<MachineContext, MachineState>(\n {\n id: \"clipboard\",\n initial: \"idle\",\n context: {\n value: \"\",\n timeout: 3000,\n ...ctx,\n },\n watch: {\n value: [\"syncInputElement\"],\n },\n on: {\n \"VALUE.SET\": {\n actions: [\"setValue\"],\n },\n COPY: {\n target: \"copied\",\n actions: [\"copyToClipboard\", \"invokeOnCopy\"],\n },\n },\n states: {\n idle: {\n on: {\n \"INPUT.COPY\": {\n target: \"copied\",\n actions: [\"invokeOnCopy\"],\n },\n },\n },\n copied: {\n after: {\n COPY_TIMEOUT: \"idle\",\n },\n on: {\n COPY: {\n target: \"copied\",\n actions: [\"copyToClipboard\", \"invokeOnCopy\"],\n },\n \"INPUT.COPY\": {\n actions: [\"invokeOnCopy\"],\n },\n },\n },\n },\n },\n {\n actions: {\n setValue(ctx, evt) {\n ctx.value = evt.value\n },\n copyToClipboard(ctx) {\n dom.writeToClipboard(ctx)\n },\n invokeOnCopy(ctx) {\n ctx.onStatusChange?.({ copied: true })\n },\n syncInputElement(ctx) {\n dom.setValue(dom.getInputEl(ctx), ctx.value)\n },\n },\n delays: {\n COPY_TIMEOUT: (ctx) => ctx.timeout,\n },\n },\n )\n}\n","import { createProps } from \"@zag-js/types\"\nimport type { IndicatorProps, UserDefinedContext } from \"./clipboard.types\"\nimport { createSplitProps } from \"@zag-js/utils\"\n\nexport const props = createProps<UserDefinedContext>()([\n \"getRootNode\",\n \"id\",\n \"ids\",\n \"value\",\n \"timeout\",\n \"onStatusChange\",\n])\nexport const contextProps = createSplitProps<UserDefinedContext>(props)\n\nexport const indicatorProps = createProps<IndicatorProps>()([\"copied\"])\nexport const splitIndicatorProps = createSplitProps<IndicatorProps>(indicatorProps)\n"],"mappings":"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","names":["props","ctx"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zag-js/clipboard",
3
- "version": "0.49.0",
3
+ "version": "0.51.0",
4
4
  "description": "Core logic for the clipboard widget implemented as a state machine",
5
5
  "keywords": [
6
6
  "js",
@@ -28,11 +28,11 @@
28
28
  "url": "https://github.com/chakra-ui/zag/issues"
29
29
  },
30
30
  "dependencies": {
31
- "@zag-js/anatomy": "0.49.0",
32
- "@zag-js/core": "0.49.0",
33
- "@zag-js/dom-query": "0.49.0",
34
- "@zag-js/utils": "0.49.0",
35
- "@zag-js/types": "0.49.0"
31
+ "@zag-js/anatomy": "0.51.0",
32
+ "@zag-js/dom-query": "0.51.0",
33
+ "@zag-js/utils": "0.51.0",
34
+ "@zag-js/types": "0.51.0",
35
+ "@zag-js/core": "0.51.0"
36
36
  },
37
37
  "devDependencies": {
38
38
  "clean-package": "2.2.0"
@@ -1,5 +1,4 @@
1
1
  import { createScope, getWindow } from "@zag-js/dom-query"
2
- import { hasProp } from "@zag-js/utils"
3
2
  import type { MachineContext as Ctx } from "./clipboard.types"
4
3
 
5
4
  export const dom = createScope({
@@ -48,7 +47,7 @@ function copyNode(node: HTMLElement): Promise<void> {
48
47
  function copyText(doc: Document, text: string): Promise<void> {
49
48
  const win = doc.defaultView || window
50
49
 
51
- if (hasProp(win.navigator, "clipboard")) {
50
+ if (win.navigator.clipboard?.writeText !== undefined) {
52
51
  return win.navigator.clipboard.writeText(text)
53
52
  }
54
53
 
@@ -26,6 +26,7 @@ interface PublicContext extends CommonProperties {
26
26
  onStatusChange?: (details: CopyStatusDetails) => void
27
27
  /**
28
28
  * The timeout for the copy operation
29
+ * @default 3000
29
30
  */
30
31
  timeout: number
31
32
  }