@licklist/design 0.70.5-dev.3 → 0.70.6-dev.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/iframe/event/ticket-description/TicketDescription.d.ts.map +1 -1
- package/dist/iframe/event/ticket-description/TicketDescription.js +43 -32
- package/dist/styles/iframe-events/TicketDescription.scss +1 -1
- package/dist/tiptap-editor/TipTapEditor.d.ts +2 -1
- package/dist/tiptap-editor/TipTapEditor.d.ts.map +1 -1
- package/dist/tiptap-editor/TipTapEditor.js +32 -2
- package/package.json +2 -2
- package/src/iframe/event/ticket-description/TicketDescription.tsx +35 -22
- package/src/styles/iframe-events/TicketDescription.scss +1 -1
- package/src/tiptap-editor/TipTapEditor.tsx +8 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TicketDescription.d.ts","sourceRoot":"","sources":["../../../../src/iframe/event/ticket-description/TicketDescription.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,SAAS,EAAY,MAAM,OAAO,CAAA;AAE1D,OAAO,EACL,KAAK,EAEN,MAAM,sDAAsD,CAAA;AAK7D,UAAU,sBAAsB;IAC9B,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,EAAE,MAAM,CAAA;IACnB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,MAAM,EAAE,KAAK,EAAE,GAAG,IAAI,CAAA;IACtB,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB;AAID,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,WAAW,EACX,SAAc,EACd,MAAM,EACN,KAAK,EACL,UAAkB,EAClB,SAAgB,GACjB,EAAE,sBAAsB,
|
|
1
|
+
{"version":3,"file":"TicketDescription.d.ts","sourceRoot":"","sources":["../../../../src/iframe/event/ticket-description/TicketDescription.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,SAAS,EAAY,MAAM,OAAO,CAAA;AAE1D,OAAO,EACL,KAAK,EAEN,MAAM,sDAAsD,CAAA;AAK7D,UAAU,sBAAsB;IAC9B,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,EAAE,MAAM,CAAA;IACnB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,MAAM,EAAE,KAAK,EAAE,GAAG,IAAI,CAAA;IACtB,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB;AAID,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,WAAW,EACX,SAAc,EACd,MAAM,EACN,KAAK,EACL,UAAkB,EAClB,SAAgB,GACjB,EAAE,sBAAsB,2CAiDxB"}
|
|
@@ -56,40 +56,11 @@ var DESCRIPTION_MAX_LENGTH = 120;
|
|
|
56
56
|
function TicketDescription(param) {
|
|
57
57
|
var title = param.title, description = param.description, _param_className = param.className, className = _param_className === void 0 ? '' : _param_className, images = param.images, price = param.price, _param_isRequired = param.isRequired, isRequired = _param_isRequired === void 0 ? false : _param_isRequired, _param_canExpand = param.canExpand, canExpand = _param_canExpand === void 0 ? true : _param_canExpand;
|
|
58
58
|
var _useState = _sliced_to_array(useState(false), 2), isDescriptionExpanded = _useState[0], setIsDescriptionExpanded = _useState[1];
|
|
59
|
-
var showDescription = !!description;
|
|
60
59
|
var wrapperClasses = clsx('ticket-description', className);
|
|
61
60
|
var imageSrc = images ? MediaService.getImageSrc(images, THUMBNAIL_IMAGE_SIZE) : null;
|
|
62
61
|
var descriptionWrapperStyle = {
|
|
63
62
|
'--description-wrapper-height': 'inherit'
|
|
64
63
|
};
|
|
65
|
-
var renderDescription = function() {
|
|
66
|
-
return /*#__PURE__*/ jsx("div", {
|
|
67
|
-
className: "description-content",
|
|
68
|
-
children: /*#__PURE__*/ jsxs("div", {
|
|
69
|
-
className: "d-flex flex-column",
|
|
70
|
-
children: [
|
|
71
|
-
/*#__PURE__*/ jsxs("div", {
|
|
72
|
-
className: "product-title",
|
|
73
|
-
children: [
|
|
74
|
-
title,
|
|
75
|
-
" ",
|
|
76
|
-
isRequired && /*#__PURE__*/ jsx("span", {
|
|
77
|
-
children: "*"
|
|
78
|
-
})
|
|
79
|
-
]
|
|
80
|
-
}),
|
|
81
|
-
showDescription && /*#__PURE__*/ jsx(TipTapEditor, {
|
|
82
|
-
viewMode: true,
|
|
83
|
-
disabled: true,
|
|
84
|
-
content: description,
|
|
85
|
-
editorStyle: {
|
|
86
|
-
backgroundColor: 'transparent'
|
|
87
|
-
}
|
|
88
|
-
})
|
|
89
|
-
]
|
|
90
|
-
})
|
|
91
|
-
});
|
|
92
|
-
};
|
|
93
64
|
return /*#__PURE__*/ jsxs("div", {
|
|
94
65
|
className: wrapperClasses,
|
|
95
66
|
children: [
|
|
@@ -110,17 +81,57 @@ function TicketDescription(param) {
|
|
|
110
81
|
className: "ticket-description__container",
|
|
111
82
|
isExpanded: isDescriptionExpanded,
|
|
112
83
|
setIsExpanded: setIsDescriptionExpanded,
|
|
113
|
-
children:
|
|
114
|
-
|
|
84
|
+
children: /*#__PURE__*/ jsx(Description, {
|
|
85
|
+
title: title,
|
|
86
|
+
isRequired: isRequired,
|
|
87
|
+
description: description
|
|
88
|
+
})
|
|
89
|
+
}) : /*#__PURE__*/ jsx(Description, {
|
|
90
|
+
title: title,
|
|
91
|
+
isRequired: isRequired,
|
|
92
|
+
description: description
|
|
93
|
+
})
|
|
115
94
|
]
|
|
116
95
|
})
|
|
117
96
|
}),
|
|
118
97
|
price && /*#__PURE__*/ jsx("div", {
|
|
119
|
-
className: clsx(
|
|
98
|
+
className: clsx({
|
|
99
|
+
'mt-5': description
|
|
100
|
+
}),
|
|
120
101
|
children: price
|
|
121
102
|
})
|
|
122
103
|
]
|
|
123
104
|
});
|
|
124
105
|
}
|
|
106
|
+
var Description = function(param) {
|
|
107
|
+
var title = param.title, isRequired = param.isRequired, description = param.description;
|
|
108
|
+
return /*#__PURE__*/ jsx("div", {
|
|
109
|
+
className: "description-content",
|
|
110
|
+
children: /*#__PURE__*/ jsxs("div", {
|
|
111
|
+
className: "d-flex flex-column",
|
|
112
|
+
children: [
|
|
113
|
+
/*#__PURE__*/ jsxs("div", {
|
|
114
|
+
className: "product-title",
|
|
115
|
+
children: [
|
|
116
|
+
title,
|
|
117
|
+
" ",
|
|
118
|
+
isRequired && /*#__PURE__*/ jsx("span", {
|
|
119
|
+
children: "*"
|
|
120
|
+
})
|
|
121
|
+
]
|
|
122
|
+
}),
|
|
123
|
+
!!description && /*#__PURE__*/ jsx(TipTapEditor, {
|
|
124
|
+
viewMode: true,
|
|
125
|
+
disabled: true,
|
|
126
|
+
content: description,
|
|
127
|
+
editorStyle: {
|
|
128
|
+
backgroundColor: 'transparent'
|
|
129
|
+
},
|
|
130
|
+
hideEmptyEditor: true
|
|
131
|
+
})
|
|
132
|
+
]
|
|
133
|
+
})
|
|
134
|
+
});
|
|
135
|
+
};
|
|
125
136
|
|
|
126
137
|
export { TicketDescription };
|
|
@@ -7,6 +7,7 @@ export interface TipTapEditorProps {
|
|
|
7
7
|
editorStyle?: React.CSSProperties;
|
|
8
8
|
className?: string;
|
|
9
9
|
id?: string;
|
|
10
|
+
hideEmptyEditor?: boolean;
|
|
10
11
|
}
|
|
11
|
-
export declare function TipTapEditor({ viewMode, withEmoji, content, onUpdate, disabled, editorStyle, className, id, }: TipTapEditorProps): import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
export declare function TipTapEditor({ viewMode, withEmoji, content, onUpdate, disabled, editorStyle, className, id, hideEmptyEditor, }: TipTapEditorProps): import("react/jsx-runtime").JSX.Element;
|
|
12
13
|
//# sourceMappingURL=TipTapEditor.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TipTapEditor.d.ts","sourceRoot":"","sources":["../../src/tiptap-editor/TipTapEditor.tsx"],"names":[],"mappings":"AAuBA,MAAM,WAAW,iBAAiB;IAChC,QAAQ,EAAE,OAAO,CAAA;IACjB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAA;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,WAAW,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;IACjC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,EAAE,CAAC,EAAE,MAAM,CAAA;
|
|
1
|
+
{"version":3,"file":"TipTapEditor.d.ts","sourceRoot":"","sources":["../../src/tiptap-editor/TipTapEditor.tsx"],"names":[],"mappings":"AAuBA,MAAM,WAAW,iBAAiB;IAChC,QAAQ,EAAE,OAAO,CAAA;IACjB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAA;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,WAAW,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;IACjC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,eAAe,CAAC,EAAE,OAAO,CAAA;CAC1B;AA0BD,wBAAgB,YAAY,CAAC,EAC3B,QAAQ,EACR,SAAiB,EACjB,OAAO,EACP,QAAQ,EACR,QAAgB,EAChB,WAAW,EACX,SAAS,EACT,EAAE,EACF,eAAuB,GACxB,EAAE,iBAAiB,2CAgDnB"}
|
|
@@ -21,6 +21,34 @@ import clsx from 'clsx';
|
|
|
21
21
|
import { TipTapMenu } from './TipTapMenu/TipTapMenu.js';
|
|
22
22
|
import { EmojiReplacer } from './TipTapMenu/extensions/EmojiReplacer.js';
|
|
23
23
|
|
|
24
|
+
function _define_property(obj, key, value) {
|
|
25
|
+
if (key in obj) {
|
|
26
|
+
Object.defineProperty(obj, key, {
|
|
27
|
+
value: value,
|
|
28
|
+
enumerable: true,
|
|
29
|
+
configurable: true,
|
|
30
|
+
writable: true
|
|
31
|
+
});
|
|
32
|
+
} else {
|
|
33
|
+
obj[key] = value;
|
|
34
|
+
}
|
|
35
|
+
return obj;
|
|
36
|
+
}
|
|
37
|
+
function _object_spread(target) {
|
|
38
|
+
for(var i = 1; i < arguments.length; i++){
|
|
39
|
+
var source = arguments[i] != null ? arguments[i] : {};
|
|
40
|
+
var ownKeys = Object.keys(source);
|
|
41
|
+
if (typeof Object.getOwnPropertySymbols === "function") {
|
|
42
|
+
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
|
|
43
|
+
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
|
|
44
|
+
}));
|
|
45
|
+
}
|
|
46
|
+
ownKeys.forEach(function(key) {
|
|
47
|
+
_define_property(target, key, source[key]);
|
|
48
|
+
});
|
|
49
|
+
}
|
|
50
|
+
return target;
|
|
51
|
+
}
|
|
24
52
|
var DEFAULT_CONTENT = '<p></p>';
|
|
25
53
|
var EXTENSIONS = [
|
|
26
54
|
Blockquote,
|
|
@@ -44,7 +72,7 @@ var EXTENSIONS = [
|
|
|
44
72
|
EmojiReplacer
|
|
45
73
|
];
|
|
46
74
|
function TipTapEditor(param) {
|
|
47
|
-
var viewMode = param.viewMode, _param_withEmoji = param.withEmoji, withEmoji = _param_withEmoji === void 0 ? false : _param_withEmoji, content = param.content, onUpdate = param.onUpdate, _param_disabled = param.disabled, disabled = _param_disabled === void 0 ? false : _param_disabled, editorStyle = param.editorStyle, className = param.className, id = param.id;
|
|
75
|
+
var viewMode = param.viewMode, _param_withEmoji = param.withEmoji, withEmoji = _param_withEmoji === void 0 ? false : _param_withEmoji, content = param.content, onUpdate = param.onUpdate, _param_disabled = param.disabled, disabled = _param_disabled === void 0 ? false : _param_disabled, editorStyle = param.editorStyle, className = param.className, id = param.id, _param_hideEmptyEditor = param.hideEmptyEditor, hideEmptyEditor = _param_hideEmptyEditor === void 0 ? false : _param_hideEmptyEditor;
|
|
48
76
|
var editor = useEditor({
|
|
49
77
|
extensions: EXTENSIONS,
|
|
50
78
|
editable: !disabled,
|
|
@@ -81,7 +109,9 @@ function TipTapEditor(param) {
|
|
|
81
109
|
/*#__PURE__*/ jsx(EditorContent, {
|
|
82
110
|
name: "editor",
|
|
83
111
|
className: clsx(!viewMode ? 'editor editor-with-menu' : 'editor-without-menu', disabled && 'editor-disabled', className),
|
|
84
|
-
style: editorStyle,
|
|
112
|
+
style: _object_spread({}, editorStyle, hideEmptyEditor ? {
|
|
113
|
+
display: (editor === null || editor === void 0 ? void 0 : editor.isEmpty) ? 'none' : 'block'
|
|
114
|
+
} : {}),
|
|
85
115
|
editor: editor
|
|
86
116
|
})
|
|
87
117
|
]
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@licklist/design",
|
|
3
|
-
"version": "0.70.
|
|
3
|
+
"version": "0.70.6-dev.0",
|
|
4
4
|
"repository": {
|
|
5
5
|
"type": "git",
|
|
6
6
|
"url": "git+ssh://git@bitbucket.org/artelogicsoft/licklist_design.git"
|
|
@@ -208,4 +208,4 @@
|
|
|
208
208
|
"yarn": "4.4.0"
|
|
209
209
|
},
|
|
210
210
|
"stableVersion": "0.69.1-dev.3"
|
|
211
|
-
}
|
|
211
|
+
}
|
|
@@ -30,7 +30,6 @@ export function TicketDescription({
|
|
|
30
30
|
canExpand = true,
|
|
31
31
|
}: TicketDescriptionProps) {
|
|
32
32
|
const [isDescriptionExpanded, setIsDescriptionExpanded] = useState(false)
|
|
33
|
-
const showDescription = !!description
|
|
34
33
|
|
|
35
34
|
const wrapperClasses = clsx('ticket-description', className)
|
|
36
35
|
|
|
@@ -42,24 +41,6 @@ export function TicketDescription({
|
|
|
42
41
|
'--description-wrapper-height': 'inherit',
|
|
43
42
|
} as CSSProperties
|
|
44
43
|
|
|
45
|
-
const renderDescription = () => (
|
|
46
|
-
<div className='description-content'>
|
|
47
|
-
<div className='d-flex flex-column'>
|
|
48
|
-
<div className='product-title'>
|
|
49
|
-
{title} {isRequired && <span>*</span>}
|
|
50
|
-
</div>
|
|
51
|
-
{showDescription && (
|
|
52
|
-
<TipTapEditor
|
|
53
|
-
viewMode
|
|
54
|
-
disabled
|
|
55
|
-
content={description}
|
|
56
|
-
editorStyle={{ backgroundColor: 'transparent' }}
|
|
57
|
-
/>
|
|
58
|
-
)}
|
|
59
|
-
</div>
|
|
60
|
-
</div>
|
|
61
|
-
)
|
|
62
|
-
|
|
63
44
|
return (
|
|
64
45
|
<div className={wrapperClasses}>
|
|
65
46
|
<div
|
|
@@ -78,14 +59,46 @@ export function TicketDescription({
|
|
|
78
59
|
isExpanded={isDescriptionExpanded}
|
|
79
60
|
setIsExpanded={setIsDescriptionExpanded}
|
|
80
61
|
>
|
|
81
|
-
|
|
62
|
+
<Description
|
|
63
|
+
title={title}
|
|
64
|
+
isRequired={isRequired}
|
|
65
|
+
description={description}
|
|
66
|
+
/>
|
|
82
67
|
</TextExpand>
|
|
83
68
|
) : (
|
|
84
|
-
|
|
69
|
+
<Description
|
|
70
|
+
title={title}
|
|
71
|
+
isRequired={isRequired}
|
|
72
|
+
description={description}
|
|
73
|
+
/>
|
|
85
74
|
)}
|
|
86
75
|
</div>
|
|
87
76
|
</div>
|
|
88
|
-
{price && <div className={clsx(
|
|
77
|
+
{price && <div className={clsx({ 'mt-5': description })}>{price}</div>}
|
|
89
78
|
</div>
|
|
90
79
|
)
|
|
91
80
|
}
|
|
81
|
+
|
|
82
|
+
const Description = ({
|
|
83
|
+
title,
|
|
84
|
+
isRequired,
|
|
85
|
+
description,
|
|
86
|
+
}: Pick<TicketDescriptionProps, 'title' | 'isRequired' | 'description'>) => (
|
|
87
|
+
<div className='description-content'>
|
|
88
|
+
<div className='d-flex flex-column'>
|
|
89
|
+
<div className='product-title'>
|
|
90
|
+
{title} {isRequired && <span>*</span>}
|
|
91
|
+
</div>
|
|
92
|
+
|
|
93
|
+
{!!description && (
|
|
94
|
+
<TipTapEditor
|
|
95
|
+
viewMode
|
|
96
|
+
disabled
|
|
97
|
+
content={description}
|
|
98
|
+
editorStyle={{ backgroundColor: 'transparent' }}
|
|
99
|
+
hideEmptyEditor
|
|
100
|
+
/>
|
|
101
|
+
)}
|
|
102
|
+
</div>
|
|
103
|
+
</div>
|
|
104
|
+
)
|
|
@@ -30,6 +30,7 @@ export interface TipTapEditorProps {
|
|
|
30
30
|
editorStyle?: React.CSSProperties
|
|
31
31
|
className?: string
|
|
32
32
|
id?: string
|
|
33
|
+
hideEmptyEditor?: boolean
|
|
33
34
|
}
|
|
34
35
|
|
|
35
36
|
const DEFAULT_CONTENT = '<p></p>'
|
|
@@ -65,6 +66,7 @@ export function TipTapEditor({
|
|
|
65
66
|
editorStyle,
|
|
66
67
|
className,
|
|
67
68
|
id,
|
|
69
|
+
hideEmptyEditor = false,
|
|
68
70
|
}: TipTapEditorProps) {
|
|
69
71
|
const editor = useEditor(
|
|
70
72
|
{
|
|
@@ -103,7 +105,12 @@ export function TipTapEditor({
|
|
|
103
105
|
disabled && 'editor-disabled',
|
|
104
106
|
className,
|
|
105
107
|
)}
|
|
106
|
-
style={
|
|
108
|
+
style={{
|
|
109
|
+
...editorStyle,
|
|
110
|
+
...(hideEmptyEditor
|
|
111
|
+
? { display: editor?.isEmpty ? 'none' : 'block' }
|
|
112
|
+
: {}),
|
|
113
|
+
}}
|
|
107
114
|
editor={editor}
|
|
108
115
|
/>
|
|
109
116
|
</div>
|