@kopexa/editable-text 0.0.27 → 0.0.29
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/chunk-7R3VDDDJ.mjs +22 -0
- package/dist/{chunk-BPK7SFVL.mjs → chunk-LLKYOZXL.mjs} +15 -9
- package/dist/editable-text.js +31 -9
- package/dist/editable-text.mjs +2 -1
- package/dist/index.js +31 -9
- package/dist/index.mjs +2 -1
- package/dist/messages.d.mts +16 -0
- package/dist/messages.d.ts +16 -0
- package/dist/messages.js +45 -0
- package/dist/messages.mjs +7 -0
- package/package.json +6 -4
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
// src/messages.ts
|
|
4
|
+
import { defineMessages } from "@kopexa/i18n";
|
|
5
|
+
var messages = defineMessages({
|
|
6
|
+
edit: {
|
|
7
|
+
id: "editable-text.edit",
|
|
8
|
+
defaultMessage: "Edit"
|
|
9
|
+
},
|
|
10
|
+
save: {
|
|
11
|
+
id: "editable-text.save",
|
|
12
|
+
defaultMessage: "Save"
|
|
13
|
+
},
|
|
14
|
+
cancel: {
|
|
15
|
+
id: "editable-text.cancel",
|
|
16
|
+
defaultMessage: "Cancel"
|
|
17
|
+
}
|
|
18
|
+
});
|
|
19
|
+
|
|
20
|
+
export {
|
|
21
|
+
messages
|
|
22
|
+
};
|
|
@@ -1,7 +1,12 @@
|
|
|
1
1
|
"use client";
|
|
2
|
+
import {
|
|
3
|
+
messages
|
|
4
|
+
} from "./chunk-7R3VDDDJ.mjs";
|
|
2
5
|
|
|
3
6
|
// src/editable-text.tsx
|
|
7
|
+
import { useSafeIntl } from "@kopexa/i18n";
|
|
4
8
|
import { editableText } from "@kopexa/theme";
|
|
9
|
+
import { Tooltip } from "@kopexa/tooltip";
|
|
5
10
|
import {
|
|
6
11
|
useCallback,
|
|
7
12
|
useEffect,
|
|
@@ -81,6 +86,7 @@ var EditableText = ({
|
|
|
81
86
|
inputProps,
|
|
82
87
|
textareaProps
|
|
83
88
|
}) => {
|
|
89
|
+
const intl = useSafeIntl();
|
|
84
90
|
const [isEditing, setIsEditing] = useState(false);
|
|
85
91
|
const [editedValue, setEditedValue] = useState(value);
|
|
86
92
|
const inputRef = useRef(null);
|
|
@@ -208,43 +214,43 @@ var EditableText = ({
|
|
|
208
214
|
}
|
|
209
215
|
),
|
|
210
216
|
showButtons && /* @__PURE__ */ jsxs("div", { className: styles.actions(), children: [
|
|
211
|
-
/* @__PURE__ */ jsx(
|
|
217
|
+
/* @__PURE__ */ jsx(Tooltip, { content: intl.formatMessage(messages.save), children: /* @__PURE__ */ jsx(
|
|
212
218
|
"button",
|
|
213
219
|
{
|
|
214
220
|
type: "button",
|
|
215
221
|
onClick: handleSave,
|
|
216
222
|
className: styles.saveButton(),
|
|
217
223
|
"data-editable-text-action": "save",
|
|
218
|
-
"aria-label":
|
|
224
|
+
"aria-label": intl.formatMessage(messages.save),
|
|
219
225
|
children: /* @__PURE__ */ jsx(CheckIcon, {})
|
|
220
226
|
}
|
|
221
|
-
),
|
|
222
|
-
/* @__PURE__ */ jsx(
|
|
227
|
+
) }),
|
|
228
|
+
/* @__PURE__ */ jsx(Tooltip, { content: intl.formatMessage(messages.cancel), children: /* @__PURE__ */ jsx(
|
|
223
229
|
"button",
|
|
224
230
|
{
|
|
225
231
|
type: "button",
|
|
226
232
|
onClick: handleCancel,
|
|
227
233
|
className: styles.cancelButton(),
|
|
228
234
|
"data-editable-text-action": "cancel",
|
|
229
|
-
"aria-label":
|
|
235
|
+
"aria-label": intl.formatMessage(messages.cancel),
|
|
230
236
|
children: /* @__PURE__ */ jsx(XIcon, {})
|
|
231
237
|
}
|
|
232
|
-
)
|
|
238
|
+
) })
|
|
233
239
|
] })
|
|
234
240
|
] });
|
|
235
241
|
}
|
|
236
242
|
const displayValue = value || placeholder;
|
|
237
243
|
const isEmpty = !value && placeholder;
|
|
238
|
-
const editButton = showButtons && !disabled && /* @__PURE__ */ jsx(
|
|
244
|
+
const editButton = showButtons && !disabled && /* @__PURE__ */ jsx(Tooltip, { content: intl.formatMessage(messages.edit), children: /* @__PURE__ */ jsx(
|
|
239
245
|
"button",
|
|
240
246
|
{
|
|
241
247
|
type: "button",
|
|
242
248
|
onClick: handleEditClick,
|
|
243
249
|
className: styles.editButton(),
|
|
244
|
-
"aria-label":
|
|
250
|
+
"aria-label": intl.formatMessage(messages.edit),
|
|
245
251
|
children: /* @__PURE__ */ jsx(EditIcon, {})
|
|
246
252
|
}
|
|
247
|
-
);
|
|
253
|
+
) });
|
|
248
254
|
return /* @__PURE__ */ jsxs("div", { className: styles.root({ className }), children: [
|
|
249
255
|
/* @__PURE__ */ jsxs(
|
|
250
256
|
Component,
|
package/dist/editable-text.js
CHANGED
|
@@ -25,8 +25,29 @@ __export(editable_text_exports, {
|
|
|
25
25
|
EditableText: () => EditableText
|
|
26
26
|
});
|
|
27
27
|
module.exports = __toCommonJS(editable_text_exports);
|
|
28
|
+
var import_i18n2 = require("@kopexa/i18n");
|
|
28
29
|
var import_theme = require("@kopexa/theme");
|
|
30
|
+
var import_tooltip = require("@kopexa/tooltip");
|
|
29
31
|
var import_react = require("react");
|
|
32
|
+
|
|
33
|
+
// src/messages.ts
|
|
34
|
+
var import_i18n = require("@kopexa/i18n");
|
|
35
|
+
var messages = (0, import_i18n.defineMessages)({
|
|
36
|
+
edit: {
|
|
37
|
+
id: "editable-text.edit",
|
|
38
|
+
defaultMessage: "Edit"
|
|
39
|
+
},
|
|
40
|
+
save: {
|
|
41
|
+
id: "editable-text.save",
|
|
42
|
+
defaultMessage: "Save"
|
|
43
|
+
},
|
|
44
|
+
cancel: {
|
|
45
|
+
id: "editable-text.cancel",
|
|
46
|
+
defaultMessage: "Cancel"
|
|
47
|
+
}
|
|
48
|
+
});
|
|
49
|
+
|
|
50
|
+
// src/editable-text.tsx
|
|
30
51
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
31
52
|
var EditIcon = () => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
32
53
|
"svg",
|
|
@@ -100,6 +121,7 @@ var EditableText = ({
|
|
|
100
121
|
inputProps,
|
|
101
122
|
textareaProps
|
|
102
123
|
}) => {
|
|
124
|
+
const intl = (0, import_i18n2.useSafeIntl)();
|
|
103
125
|
const [isEditing, setIsEditing] = (0, import_react.useState)(false);
|
|
104
126
|
const [editedValue, setEditedValue] = (0, import_react.useState)(value);
|
|
105
127
|
const inputRef = (0, import_react.useRef)(null);
|
|
@@ -227,43 +249,43 @@ var EditableText = ({
|
|
|
227
249
|
}
|
|
228
250
|
),
|
|
229
251
|
showButtons && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: styles.actions(), children: [
|
|
230
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
252
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tooltip.Tooltip, { content: intl.formatMessage(messages.save), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
231
253
|
"button",
|
|
232
254
|
{
|
|
233
255
|
type: "button",
|
|
234
256
|
onClick: handleSave,
|
|
235
257
|
className: styles.saveButton(),
|
|
236
258
|
"data-editable-text-action": "save",
|
|
237
|
-
"aria-label":
|
|
259
|
+
"aria-label": intl.formatMessage(messages.save),
|
|
238
260
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CheckIcon, {})
|
|
239
261
|
}
|
|
240
|
-
),
|
|
241
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
262
|
+
) }),
|
|
263
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tooltip.Tooltip, { content: intl.formatMessage(messages.cancel), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
242
264
|
"button",
|
|
243
265
|
{
|
|
244
266
|
type: "button",
|
|
245
267
|
onClick: handleCancel,
|
|
246
268
|
className: styles.cancelButton(),
|
|
247
269
|
"data-editable-text-action": "cancel",
|
|
248
|
-
"aria-label":
|
|
270
|
+
"aria-label": intl.formatMessage(messages.cancel),
|
|
249
271
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(XIcon, {})
|
|
250
272
|
}
|
|
251
|
-
)
|
|
273
|
+
) })
|
|
252
274
|
] })
|
|
253
275
|
] });
|
|
254
276
|
}
|
|
255
277
|
const displayValue = value || placeholder;
|
|
256
278
|
const isEmpty = !value && placeholder;
|
|
257
|
-
const editButton = showButtons && !disabled && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
279
|
+
const editButton = showButtons && !disabled && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tooltip.Tooltip, { content: intl.formatMessage(messages.edit), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
258
280
|
"button",
|
|
259
281
|
{
|
|
260
282
|
type: "button",
|
|
261
283
|
onClick: handleEditClick,
|
|
262
284
|
className: styles.editButton(),
|
|
263
|
-
"aria-label":
|
|
285
|
+
"aria-label": intl.formatMessage(messages.edit),
|
|
264
286
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(EditIcon, {})
|
|
265
287
|
}
|
|
266
|
-
);
|
|
288
|
+
) });
|
|
267
289
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: styles.root({ className }), children: [
|
|
268
290
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
269
291
|
Component,
|
package/dist/editable-text.mjs
CHANGED
package/dist/index.js
CHANGED
|
@@ -26,8 +26,29 @@ __export(index_exports, {
|
|
|
26
26
|
module.exports = __toCommonJS(index_exports);
|
|
27
27
|
|
|
28
28
|
// src/editable-text.tsx
|
|
29
|
+
var import_i18n2 = require("@kopexa/i18n");
|
|
29
30
|
var import_theme = require("@kopexa/theme");
|
|
31
|
+
var import_tooltip = require("@kopexa/tooltip");
|
|
30
32
|
var import_react = require("react");
|
|
33
|
+
|
|
34
|
+
// src/messages.ts
|
|
35
|
+
var import_i18n = require("@kopexa/i18n");
|
|
36
|
+
var messages = (0, import_i18n.defineMessages)({
|
|
37
|
+
edit: {
|
|
38
|
+
id: "editable-text.edit",
|
|
39
|
+
defaultMessage: "Edit"
|
|
40
|
+
},
|
|
41
|
+
save: {
|
|
42
|
+
id: "editable-text.save",
|
|
43
|
+
defaultMessage: "Save"
|
|
44
|
+
},
|
|
45
|
+
cancel: {
|
|
46
|
+
id: "editable-text.cancel",
|
|
47
|
+
defaultMessage: "Cancel"
|
|
48
|
+
}
|
|
49
|
+
});
|
|
50
|
+
|
|
51
|
+
// src/editable-text.tsx
|
|
31
52
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
32
53
|
var EditIcon = () => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
33
54
|
"svg",
|
|
@@ -101,6 +122,7 @@ var EditableText = ({
|
|
|
101
122
|
inputProps,
|
|
102
123
|
textareaProps
|
|
103
124
|
}) => {
|
|
125
|
+
const intl = (0, import_i18n2.useSafeIntl)();
|
|
104
126
|
const [isEditing, setIsEditing] = (0, import_react.useState)(false);
|
|
105
127
|
const [editedValue, setEditedValue] = (0, import_react.useState)(value);
|
|
106
128
|
const inputRef = (0, import_react.useRef)(null);
|
|
@@ -228,43 +250,43 @@ var EditableText = ({
|
|
|
228
250
|
}
|
|
229
251
|
),
|
|
230
252
|
showButtons && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: styles.actions(), children: [
|
|
231
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
253
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tooltip.Tooltip, { content: intl.formatMessage(messages.save), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
232
254
|
"button",
|
|
233
255
|
{
|
|
234
256
|
type: "button",
|
|
235
257
|
onClick: handleSave,
|
|
236
258
|
className: styles.saveButton(),
|
|
237
259
|
"data-editable-text-action": "save",
|
|
238
|
-
"aria-label":
|
|
260
|
+
"aria-label": intl.formatMessage(messages.save),
|
|
239
261
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CheckIcon, {})
|
|
240
262
|
}
|
|
241
|
-
),
|
|
242
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
263
|
+
) }),
|
|
264
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tooltip.Tooltip, { content: intl.formatMessage(messages.cancel), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
243
265
|
"button",
|
|
244
266
|
{
|
|
245
267
|
type: "button",
|
|
246
268
|
onClick: handleCancel,
|
|
247
269
|
className: styles.cancelButton(),
|
|
248
270
|
"data-editable-text-action": "cancel",
|
|
249
|
-
"aria-label":
|
|
271
|
+
"aria-label": intl.formatMessage(messages.cancel),
|
|
250
272
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(XIcon, {})
|
|
251
273
|
}
|
|
252
|
-
)
|
|
274
|
+
) })
|
|
253
275
|
] })
|
|
254
276
|
] });
|
|
255
277
|
}
|
|
256
278
|
const displayValue = value || placeholder;
|
|
257
279
|
const isEmpty = !value && placeholder;
|
|
258
|
-
const editButton = showButtons && !disabled && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
280
|
+
const editButton = showButtons && !disabled && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tooltip.Tooltip, { content: intl.formatMessage(messages.edit), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
259
281
|
"button",
|
|
260
282
|
{
|
|
261
283
|
type: "button",
|
|
262
284
|
onClick: handleEditClick,
|
|
263
285
|
className: styles.editButton(),
|
|
264
|
-
"aria-label":
|
|
286
|
+
"aria-label": intl.formatMessage(messages.edit),
|
|
265
287
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(EditIcon, {})
|
|
266
288
|
}
|
|
267
|
-
);
|
|
289
|
+
) });
|
|
268
290
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: styles.root({ className }), children: [
|
|
269
291
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
270
292
|
Component,
|
package/dist/index.mjs
CHANGED
package/dist/messages.js
ADDED
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
"use strict";
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
20
|
+
|
|
21
|
+
// src/messages.ts
|
|
22
|
+
var messages_exports = {};
|
|
23
|
+
__export(messages_exports, {
|
|
24
|
+
messages: () => messages
|
|
25
|
+
});
|
|
26
|
+
module.exports = __toCommonJS(messages_exports);
|
|
27
|
+
var import_i18n = require("@kopexa/i18n");
|
|
28
|
+
var messages = (0, import_i18n.defineMessages)({
|
|
29
|
+
edit: {
|
|
30
|
+
id: "editable-text.edit",
|
|
31
|
+
defaultMessage: "Edit"
|
|
32
|
+
},
|
|
33
|
+
save: {
|
|
34
|
+
id: "editable-text.save",
|
|
35
|
+
defaultMessage: "Save"
|
|
36
|
+
},
|
|
37
|
+
cancel: {
|
|
38
|
+
id: "editable-text.cancel",
|
|
39
|
+
defaultMessage: "Cancel"
|
|
40
|
+
}
|
|
41
|
+
});
|
|
42
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
43
|
+
0 && (module.exports = {
|
|
44
|
+
messages
|
|
45
|
+
});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kopexa/editable-text",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.29",
|
|
4
4
|
"description": "Inline editable text component",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"editable-text",
|
|
@@ -28,11 +28,13 @@
|
|
|
28
28
|
"peerDependencies": {
|
|
29
29
|
"react": ">=19.0.0-rc.0",
|
|
30
30
|
"react-dom": ">=19.0.0-rc.0",
|
|
31
|
-
"@kopexa/theme": "17.
|
|
31
|
+
"@kopexa/theme": "17.26.1",
|
|
32
|
+
"@kopexa/tooltip": "17.2.29",
|
|
33
|
+
"@kopexa/i18n": "17.11.0"
|
|
32
34
|
},
|
|
33
35
|
"dependencies": {
|
|
34
|
-
"@kopexa/
|
|
35
|
-
"@kopexa/
|
|
36
|
+
"@kopexa/shared-utils": "17.0.64",
|
|
37
|
+
"@kopexa/react-utils": "17.1.6"
|
|
36
38
|
},
|
|
37
39
|
"clean-package": "../../../clean-package.config.json",
|
|
38
40
|
"module": "dist/index.mjs",
|