@dynamic-framework/ui-react 1.7.1 → 1.7.2
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.esm.js +8 -8
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +8 -8
- package/dist/index.js.map +1 -1
- package/dist/types/components/DQuickActionButton.d.ts +2 -1
- package/dist/types/components/DQuickActionCheck.d.ts +2 -1
- package/dist/types/components/DQuickActionSelect.d.ts +2 -1
- package/dist/types/components/DQuickActionSwitch.d.ts +2 -1
- package/dist/types/stories/components/DInputSelect.stories.d.ts +1 -0
- package/package.json +2 -2
package/dist/index.js
CHANGED
|
@@ -1164,7 +1164,7 @@ function DProgress({ currentValue, minValue = 0, maxValue = 100, hideCurrentValu
|
|
|
1164
1164
|
return (jsxRuntime.jsx("div", { className: "progress", children: jsxRuntime.jsx("div", { className: classNames__default["default"](generateClasses), role: "progressbar", "aria-label": "Progress bar", style: { width: `${currentValue}%` }, "aria-valuenow": currentValue, "aria-valuemin": minValue, "aria-valuemax": maxValue, children: !hideCurrentValue && formatProgress }) }));
|
|
1165
1165
|
}
|
|
1166
1166
|
|
|
1167
|
-
function DQuickActionButton({ line1, line2, actionLinkText, actionLinkTheme = 'secondary', actionIcon, secondaryActionIcon, actionIconFamilyClass, actionIconFamilyPrefix, representativeImage, representativeIcon, representativeIconTheme = 'secondary', representativeIconHasCircle = false, representativeIconFamilyClass, representativeIconFamilyPrefix, onClick, onClickSecondary, style, }) {
|
|
1167
|
+
function DQuickActionButton({ line1, line2, className, actionLinkText, actionLinkTheme = 'secondary', actionIcon, secondaryActionIcon, actionIconFamilyClass, actionIconFamilyPrefix, representativeImage, representativeIcon, representativeIconTheme = 'secondary', representativeIconHasCircle = false, representativeIconFamilyClass, representativeIconFamilyPrefix, onClick, onClickSecondary, style, }) {
|
|
1168
1168
|
const globalClickHandler = react.useCallback(() => {
|
|
1169
1169
|
if (actionLinkText) {
|
|
1170
1170
|
return;
|
|
@@ -1181,20 +1181,20 @@ function DQuickActionButton({ line1, line2, actionLinkText, actionLinkTheme = 's
|
|
|
1181
1181
|
onClickSecondary === null || onClickSecondary === void 0 ? void 0 : onClickSecondary();
|
|
1182
1182
|
}, [onClickSecondary]);
|
|
1183
1183
|
const Tag = react.useMemo(() => (actionLinkText ? 'div' : 'button'), [actionLinkText]);
|
|
1184
|
-
return (jsxRuntime.jsxs(Tag, { className: "d-quick-action-button
|
|
1184
|
+
return (jsxRuntime.jsxs(Tag, { className: classNames__default["default"]('d-quick-action-button', className), onClick: !actionLinkText ? globalClickHandler : undefined, style: style, children: [representativeIcon && (jsxRuntime.jsx(DIcon, { className: "d-quick-action-button-representative-icon", size: representativeIconHasCircle
|
|
1185
1185
|
? `var(--${PREFIX_BS}quick-action-button-representative-icon-size)`
|
|
1186
1186
|
: `var(--${PREFIX_BS}quick-action-button-representative-image-size)`, icon: representativeIcon, hasCircle: representativeIconHasCircle, theme: representativeIconTheme, familyClass: representativeIconFamilyClass, familyPrefix: representativeIconFamilyPrefix })), representativeImage && (jsxRuntime.jsx("img", { className: "d-quick-action-button-representative-image", src: representativeImage, alt: "" })), jsxRuntime.jsx("div", { className: "d-quick-action-button-content", children: jsxRuntime.jsxs("div", { className: "d-quick-action-button-text", children: [jsxRuntime.jsx("span", { className: "d-quick-action-button-line1", children: line1 }), jsxRuntime.jsx("small", { className: "d-quick-action-button-line2", children: line2 })] }) }), secondaryActionIcon && (jsxRuntime.jsx(DButton, { className: "d-quick-action-button-secondary-action-link", type: "button", variant: "link", iconStart: secondaryActionIcon, iconStartFamilyClass: actionIconFamilyClass, iconStartFamilyPrefix: actionIconFamilyPrefix, theme: actionLinkTheme, onClick: secondaryActionLinkClickHandler, isStopPropagationEnabled: true })), actionLinkText && !actionIcon && (jsxRuntime.jsx(DButton, { className: "d-quick-action-button-action-link", type: "button", variant: "link", theme: actionLinkTheme, text: actionLinkText, onClick: actionLinkClickHandler, isStopPropagationEnabled: true })), actionIcon && !actionLinkText && (jsxRuntime.jsx(DIcon, { className: "d-quick-action-button-action-icon", icon: actionIcon, size: `var(--${PREFIX_BS}quick-action-button-action-icon-size)`, familyClass: actionIconFamilyClass, familyPrefix: actionIconFamilyPrefix }))] }));
|
|
1187
1187
|
}
|
|
1188
1188
|
|
|
1189
|
-
function DQuickActionCheck({ id, name, value, line1, line2, line3, isChecked, onChange, }) {
|
|
1189
|
+
function DQuickActionCheck({ id, name, value, line1, line2, line3, className, isChecked, onChange, }) {
|
|
1190
1190
|
const changeHandler = react.useCallback((event) => {
|
|
1191
1191
|
event.stopPropagation();
|
|
1192
1192
|
onChange === null || onChange === void 0 ? void 0 : onChange(event);
|
|
1193
1193
|
}, [onChange]);
|
|
1194
|
-
return (jsxRuntime.jsxs("label", { className: "d-quick-action-check
|
|
1194
|
+
return (jsxRuntime.jsxs("label", { className: classNames__default["default"]('d-quick-action-check', className), htmlFor: id, children: [jsxRuntime.jsx(DInputCheck, { id: id, type: "radio", name: name, value: value, isChecked: isChecked, onChange: changeHandler }), jsxRuntime.jsxs("div", { className: "d-quick-action-check-detail", children: [jsxRuntime.jsx("span", { className: "d-quick-action-check-line1", children: line1 }), jsxRuntime.jsx("span", { className: "d-quick-action-check-line2", children: line2 })] }), jsxRuntime.jsx("span", { className: "d-quick-action-check-line3", children: line3 })] }));
|
|
1195
1195
|
}
|
|
1196
1196
|
|
|
1197
|
-
function DQuickActionSelect({ id, name, value, line1, line2, isSelected = false, onChange, }) {
|
|
1197
|
+
function DQuickActionSelect({ id, name, value, line1, line2, className, isSelected = false, onChange, }) {
|
|
1198
1198
|
const innerRef = react.useRef(null);
|
|
1199
1199
|
const changeHandler = react.useCallback((event) => {
|
|
1200
1200
|
event.stopPropagation();
|
|
@@ -1205,15 +1205,15 @@ function DQuickActionSelect({ id, name, value, line1, line2, isSelected = false,
|
|
|
1205
1205
|
innerRef.current.checked = isSelected;
|
|
1206
1206
|
}
|
|
1207
1207
|
}, [isSelected]);
|
|
1208
|
-
return (jsxRuntime.jsxs("label", { className: "d-quick-action-select
|
|
1208
|
+
return (jsxRuntime.jsxs("label", { className: classNames__default["default"]('d-quick-action-select', className), htmlFor: id, children: [jsxRuntime.jsx("input", { ref: innerRef, id: id, type: "radio", name: name, value: value, onChange: changeHandler }), jsxRuntime.jsx("span", { className: "d-quick-action-select-line1", children: line1 }), jsxRuntime.jsx("span", { className: "d-quick-action-select-line2", children: line2 })] }));
|
|
1209
1209
|
}
|
|
1210
1210
|
|
|
1211
|
-
function DQuickActionSwitch({ id, name, label, hint, isChecked, isDisabled, onClick, }) {
|
|
1211
|
+
function DQuickActionSwitch({ id, name, label, hint, className, isChecked, isDisabled, onClick, }) {
|
|
1212
1212
|
const clickHandler = react.useCallback((event) => {
|
|
1213
1213
|
event.stopPropagation();
|
|
1214
1214
|
onClick === null || onClick === void 0 ? void 0 : onClick(isChecked);
|
|
1215
1215
|
}, [isChecked, onClick]);
|
|
1216
|
-
return (jsxRuntime.jsxs("button", { className: "d-quick-action-switch
|
|
1216
|
+
return (jsxRuntime.jsxs("button", { className: classNames__default["default"]('d-quick-action-switch', className), type: "button", onClick: clickHandler, children: [jsxRuntime.jsxs("div", { className: "d-quick-action-switch-content", children: [jsxRuntime.jsx(DInputSwitch, { id: id, name: name, isDisabled: isDisabled, isChecked: isChecked, isReadonly: true }), jsxRuntime.jsx("label", { className: "d-quick-action-switch-label", htmlFor: id, children: label })] }), jsxRuntime.jsx("div", { className: "d-quick-action-switch-hint", children: hint })] }));
|
|
1217
1217
|
}
|
|
1218
1218
|
|
|
1219
1219
|
function DSkeleton({ speed = 2, viewBox, backgroundColor, foregroundColor, children, }) {
|