@zag-js/clipboard 1.35.3 → 1.37.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.
@@ -37,8 +37,9 @@ var import_dom_query = require("@zag-js/dom-query");
37
37
  var import_clipboard = require("./clipboard.anatomy.js");
38
38
  var dom = __toESM(require("./clipboard.dom.js"));
39
39
  function connect(service, normalize) {
40
- const { state, send, context, scope } = service;
40
+ const { state, send, context, scope, prop } = service;
41
41
  const copied = state.matches("copied");
42
+ const translations = prop("translations");
42
43
  return {
43
44
  copied,
44
45
  value: context.get("value"),
@@ -89,7 +90,7 @@ function connect(service, normalize) {
89
90
  return normalize.button({
90
91
  ...import_clipboard.parts.trigger.attrs,
91
92
  type: "button",
92
- "aria-label": copied ? "Copied to clipboard" : "Copy to clipboard",
93
+ "aria-label": translations.triggerLabel?.(copied),
93
94
  "data-copied": (0, import_dom_query.dataAttr)(copied),
94
95
  onClick() {
95
96
  send({ type: "COPY" });
@@ -3,8 +3,9 @@ import { dataAttr } from "@zag-js/dom-query";
3
3
  import { parts } from "./clipboard.anatomy.mjs";
4
4
  import * as dom from "./clipboard.dom.mjs";
5
5
  function connect(service, normalize) {
6
- const { state, send, context, scope } = service;
6
+ const { state, send, context, scope, prop } = service;
7
7
  const copied = state.matches("copied");
8
+ const translations = prop("translations");
8
9
  return {
9
10
  copied,
10
11
  value: context.get("value"),
@@ -55,7 +56,7 @@ function connect(service, normalize) {
55
56
  return normalize.button({
56
57
  ...parts.trigger.attrs,
57
58
  type: "button",
58
- "aria-label": copied ? "Copied to clipboard" : "Copy to clipboard",
59
+ "aria-label": translations.triggerLabel?.(copied),
59
60
  "data-copied": dataAttr(copied),
60
61
  onClick() {
61
62
  send({ type: "COPY" });
@@ -42,7 +42,11 @@ var machine = (0, import_core.createMachine)({
42
42
  return {
43
43
  timeout: 3e3,
44
44
  defaultValue: "",
45
- ...props
45
+ ...props,
46
+ translations: {
47
+ triggerLabel: (copied) => copied ? "Copied to clipboard" : "Copy to clipboard",
48
+ ...props.translations
49
+ }
46
50
  };
47
51
  },
48
52
  initialState() {
@@ -8,7 +8,11 @@ var machine = createMachine({
8
8
  return {
9
9
  timeout: 3e3,
10
10
  defaultValue: "",
11
- ...props
11
+ ...props,
12
+ translations: {
13
+ triggerLabel: (copied) => copied ? "Copied to clipboard" : "Copy to clipboard",
14
+ ...props.translations
15
+ }
12
16
  };
13
17
  },
14
18
  initialState() {
@@ -36,7 +36,8 @@ var props = (0, import_types.createProps)()([
36
36
  "defaultValue",
37
37
  "timeout",
38
38
  "onStatusChange",
39
- "onValueChange"
39
+ "onValueChange",
40
+ "translations"
40
41
  ]);
41
42
  var contextProps = (0, import_utils.createSplitProps)(props);
42
43
  var indicatorProps = (0, import_types.createProps)()(["copied"]);
@@ -9,7 +9,8 @@ var props = createProps()([
9
9
  "defaultValue",
10
10
  "timeout",
11
11
  "onStatusChange",
12
- "onValueChange"
12
+ "onValueChange",
13
+ "translations"
13
14
  ]);
14
15
  var contextProps = createSplitProps(props);
15
16
  var indicatorProps = createProps()(["copied"]);
@@ -7,12 +7,19 @@ interface CopyStatusDetails {
7
7
  interface ValueChangeDetails {
8
8
  value: string;
9
9
  }
10
+ interface IntlTranslations {
11
+ triggerLabel?: ((copied: boolean) => string) | undefined;
12
+ }
10
13
  type ElementIds = Partial<{
11
14
  root: string;
12
15
  input: string;
13
16
  label: string;
14
17
  }>;
15
18
  interface ClipboardProps extends CommonProperties {
19
+ /**
20
+ * Specifies the localized strings that identifies the accessibility elements and their states
21
+ */
22
+ translations?: IntlTranslations | undefined;
16
23
  /**
17
24
  * The ids of the elements in the clipboard. Useful for composition.
18
25
  */
@@ -42,7 +49,7 @@ interface ClipboardProps extends CommonProperties {
42
49
  }
43
50
  interface ClipboardSchema {
44
51
  state: "idle" | "copied";
45
- props: RequiredBy<ClipboardProps, "timeout">;
52
+ props: RequiredBy<ClipboardProps, "timeout" | "translations">;
46
53
  context: {
47
54
  value: string;
48
55
  };
@@ -80,4 +87,4 @@ interface ClipboardApi<T extends PropTypes = PropTypes> {
80
87
  getIndicatorProps: (props: IndicatorProps) => T["element"];
81
88
  }
82
89
 
83
- export type { ClipboardApi, ClipboardMachine, ClipboardProps, ClipboardSchema, ClipboardService, CopyStatusDetails, ElementIds, IndicatorProps, ValueChangeDetails };
90
+ export type { ClipboardApi, ClipboardMachine, ClipboardProps, ClipboardSchema, ClipboardService, CopyStatusDetails, ElementIds, IndicatorProps, IntlTranslations, ValueChangeDetails };
@@ -7,12 +7,19 @@ interface CopyStatusDetails {
7
7
  interface ValueChangeDetails {
8
8
  value: string;
9
9
  }
10
+ interface IntlTranslations {
11
+ triggerLabel?: ((copied: boolean) => string) | undefined;
12
+ }
10
13
  type ElementIds = Partial<{
11
14
  root: string;
12
15
  input: string;
13
16
  label: string;
14
17
  }>;
15
18
  interface ClipboardProps extends CommonProperties {
19
+ /**
20
+ * Specifies the localized strings that identifies the accessibility elements and their states
21
+ */
22
+ translations?: IntlTranslations | undefined;
16
23
  /**
17
24
  * The ids of the elements in the clipboard. Useful for composition.
18
25
  */
@@ -42,7 +49,7 @@ interface ClipboardProps extends CommonProperties {
42
49
  }
43
50
  interface ClipboardSchema {
44
51
  state: "idle" | "copied";
45
- props: RequiredBy<ClipboardProps, "timeout">;
52
+ props: RequiredBy<ClipboardProps, "timeout" | "translations">;
46
53
  context: {
47
54
  value: string;
48
55
  };
@@ -80,4 +87,4 @@ interface ClipboardApi<T extends PropTypes = PropTypes> {
80
87
  getIndicatorProps: (props: IndicatorProps) => T["element"];
81
88
  }
82
89
 
83
- export type { ClipboardApi, ClipboardMachine, ClipboardProps, ClipboardSchema, ClipboardService, CopyStatusDetails, ElementIds, IndicatorProps, ValueChangeDetails };
90
+ export type { ClipboardApi, ClipboardMachine, ClipboardProps, ClipboardSchema, ClipboardService, CopyStatusDetails, ElementIds, IndicatorProps, IntlTranslations, ValueChangeDetails };
package/dist/index.d.mts CHANGED
@@ -2,7 +2,7 @@ export { anatomy } from './clipboard.anatomy.mjs';
2
2
  export { connect } from './clipboard.connect.mjs';
3
3
  export { machine } from './clipboard.machine.mjs';
4
4
  export { contextProps, indicatorProps, props, splitIndicatorProps } from './clipboard.props.mjs';
5
- export { ClipboardApi as Api, CopyStatusDetails, ElementIds, IndicatorProps, ClipboardMachine as Machine, ClipboardProps as Props, ClipboardService as Service, ValueChangeDetails } from './clipboard.types.mjs';
5
+ export { ClipboardApi as Api, CopyStatusDetails, ElementIds, IndicatorProps, IntlTranslations, ClipboardMachine as Machine, ClipboardProps as Props, ClipboardService as Service, ValueChangeDetails } from './clipboard.types.mjs';
6
6
  import '@zag-js/anatomy';
7
7
  import '@zag-js/types';
8
8
  import '@zag-js/core';
package/dist/index.d.ts CHANGED
@@ -2,7 +2,7 @@ export { anatomy } from './clipboard.anatomy.js';
2
2
  export { connect } from './clipboard.connect.js';
3
3
  export { machine } from './clipboard.machine.js';
4
4
  export { contextProps, indicatorProps, props, splitIndicatorProps } from './clipboard.props.js';
5
- export { ClipboardApi as Api, CopyStatusDetails, ElementIds, IndicatorProps, ClipboardMachine as Machine, ClipboardProps as Props, ClipboardService as Service, ValueChangeDetails } from './clipboard.types.js';
5
+ export { ClipboardApi as Api, CopyStatusDetails, ElementIds, IndicatorProps, IntlTranslations, ClipboardMachine as Machine, ClipboardProps as Props, ClipboardService as Service, ValueChangeDetails } from './clipboard.types.js';
6
6
  import '@zag-js/anatomy';
7
7
  import '@zag-js/types';
8
8
  import '@zag-js/core';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zag-js/clipboard",
3
- "version": "1.35.3",
3
+ "version": "1.37.0",
4
4
  "description": "Core logic for the clipboard widget implemented as a state machine",
5
5
  "keywords": [
6
6
  "js",
@@ -27,11 +27,11 @@
27
27
  "url": "https://github.com/chakra-ui/zag/issues"
28
28
  },
29
29
  "dependencies": {
30
- "@zag-js/anatomy": "1.35.3",
31
- "@zag-js/core": "1.35.3",
32
- "@zag-js/dom-query": "1.35.3",
33
- "@zag-js/utils": "1.35.3",
34
- "@zag-js/types": "1.35.3"
30
+ "@zag-js/anatomy": "1.37.0",
31
+ "@zag-js/core": "1.37.0",
32
+ "@zag-js/dom-query": "1.37.0",
33
+ "@zag-js/utils": "1.37.0",
34
+ "@zag-js/types": "1.37.0"
35
35
  },
36
36
  "devDependencies": {
37
37
  "clean-package": "2.2.0"