@sunggang/ui-lib 0.4.11 → 0.4.12

package/DropImage.cjs.js

@@ -16287,7 +16287,7 @@ function _object_spread_props$1(target, source) {
     return target;
 }
 var PrimaryDragDropImage = function(param) {
-    var imageUrls = param.imageUrls, handleRemove = param.handleRemove, isDropDisabled = param.isDropDisabled, _param_maxTotalImages = param.maxTotalImages, maxTotalImages = _param_maxTotalImages === void 0 ? 1 : _param_maxTotalImages, _param_showLimitWarning = param.showLimitWarning, showLimitWarning = _param_showLimitWarning === void 0 ? false : _param_showLimitWarning;
+    var imageUrls = param.imageUrls, handleRemove = param.handleRemove, isDropDisabled = param.isDropDisabled; param.maxTotalImages; var _param_showLimitWarning = param.showLimitWarning, showLimitWarning = _param_showLimitWarning === void 0 ? false : _param_showLimitWarning;
     return /*#__PURE__*/ jsxRuntime.jsx(ConnectedDroppable, {
         droppableId: "droppable-imageUrls",
         direction: "horizontal",
@@ -16336,13 +16336,9 @@ var PrimaryDragDropImage = function(param) {
                             provided.placeholder
                         ]
                     }),
-                    showLimitWarning && /*#__PURE__*/ jsxRuntime.jsxs("div", {
+                    showLimitWarning && /*#__PURE__*/ jsxRuntime.jsx("div", {
                         className: "pt-1 text-[#F24822] font-medium",
-                        children: [
-                            "註：已到達最大上傳量",
-                            maxTotalImages,
-                            "張，請刪除部分照片再上傳。"
-                        ]
+                        children: "若需要更換照片，請先刪除目前照片，再重新執行上傳作業。"
                     })
                 ]
             }));
@@ -16461,7 +16457,7 @@ function _unsupported_iterable_to_array(o, minLen) {
     if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
 }
 var DropImage = function(param) {
-    var _param_preview = param.preview, preview = _param_preview === void 0 ? true : _param_preview, setFiles = param.setFiles, imageUrls = param.imageUrls, setImageUrls = param.setImageUrls, _param_imageStyleType = param.imageStyleType, imageStyleType = _param_imageStyleType === void 0 ? "base" : _param_imageStyleType, _param_limitSize = param.limitSize, limitSize = _param_limitSize === void 0 ? 0 : _param_limitSize, _param_maxFiles = param.maxFiles, maxFiles = _param_maxFiles === void 0 ? 10 : _param_maxFiles, _param_maxTotalImages = param.maxTotalImages, maxTotalImages = _param_maxTotalImages === void 0 ? 10 : _param_maxTotalImages;
+    var _param_preview = param.preview, preview = _param_preview === void 0 ? true : _param_preview, setFiles = param.setFiles, imageUrls = param.imageUrls, setImageUrls = param.setImageUrls, _param_imageStyleType = param.imageStyleType, imageStyleType = _param_imageStyleType === void 0 ? "base" : _param_imageStyleType, _param_limitSize = param.limitSize, limitSize = _param_limitSize === void 0 ? 0 : _param_limitSize, _param_maxFiles = param.maxFiles, maxFiles = _param_maxFiles === void 0 ? 10 : _param_maxFiles, _param_maxTotalImages = param.maxTotalImages, maxTotalImages = _param_maxTotalImages === void 0 ? 10 : _param_maxTotalImages, _param_showLimitWarning = param.showLimitWarning, showLimitWarning = _param_showLimitWarning === void 0 ? false : _param_showLimitWarning;
     var _useState = _sliced_to_array(React.useState([]), 2), previewFiles = _useState[0], setPreviewFiles = _useState[1];
     var _useState1 = _sliced_to_array(React.useState(null), 2), uploadError = _useState1[0], setUploadError = _useState1[1];
     React.useEffect(function() {
@@ -16815,7 +16811,7 @@ var DropImage = function(param) {
                                 imageUrls: previewFiles,
                                 handleRemove: handleRemove,
                                 maxTotalImages: maxTotalImages,
-                                showLimitWarning: !canUploadMore
+                                showLimitWarning: showLimitWarning
                             })
                         ]
                     })

package/DropImage.esm.js

@@ -16277,7 +16277,7 @@ function _object_spread_props$1(target, source) {
     return target;
 }
 var PrimaryDragDropImage = function(param) {
-    var imageUrls = param.imageUrls, handleRemove = param.handleRemove, isDropDisabled = param.isDropDisabled, _param_maxTotalImages = param.maxTotalImages, maxTotalImages = _param_maxTotalImages === void 0 ? 1 : _param_maxTotalImages, _param_showLimitWarning = param.showLimitWarning, showLimitWarning = _param_showLimitWarning === void 0 ? false : _param_showLimitWarning;
+    var imageUrls = param.imageUrls, handleRemove = param.handleRemove, isDropDisabled = param.isDropDisabled; param.maxTotalImages; var _param_showLimitWarning = param.showLimitWarning, showLimitWarning = _param_showLimitWarning === void 0 ? false : _param_showLimitWarning;
     return /*#__PURE__*/ jsx(ConnectedDroppable, {
         droppableId: "droppable-imageUrls",
         direction: "horizontal",
@@ -16326,13 +16326,9 @@ var PrimaryDragDropImage = function(param) {
                             provided.placeholder
                         ]
                     }),
-                    showLimitWarning && /*#__PURE__*/ jsxs("div", {
+                    showLimitWarning && /*#__PURE__*/ jsx("div", {
                         className: "pt-1 text-[#F24822] font-medium",
-                        children: [
-                            "註：已到達最大上傳量",
-                            maxTotalImages,
-                            "張，請刪除部分照片再上傳。"
-                        ]
+                        children: "若需要更換照片，請先刪除目前照片，再重新執行上傳作業。"
                     })
                 ]
             }));
@@ -16451,7 +16447,7 @@ function _unsupported_iterable_to_array(o, minLen) {
     if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
 }
 var DropImage = function(param) {
-    var _param_preview = param.preview, preview = _param_preview === void 0 ? true : _param_preview, setFiles = param.setFiles, imageUrls = param.imageUrls, setImageUrls = param.setImageUrls, _param_imageStyleType = param.imageStyleType, imageStyleType = _param_imageStyleType === void 0 ? "base" : _param_imageStyleType, _param_limitSize = param.limitSize, limitSize = _param_limitSize === void 0 ? 0 : _param_limitSize, _param_maxFiles = param.maxFiles, maxFiles = _param_maxFiles === void 0 ? 10 : _param_maxFiles, _param_maxTotalImages = param.maxTotalImages, maxTotalImages = _param_maxTotalImages === void 0 ? 10 : _param_maxTotalImages;
+    var _param_preview = param.preview, preview = _param_preview === void 0 ? true : _param_preview, setFiles = param.setFiles, imageUrls = param.imageUrls, setImageUrls = param.setImageUrls, _param_imageStyleType = param.imageStyleType, imageStyleType = _param_imageStyleType === void 0 ? "base" : _param_imageStyleType, _param_limitSize = param.limitSize, limitSize = _param_limitSize === void 0 ? 0 : _param_limitSize, _param_maxFiles = param.maxFiles, maxFiles = _param_maxFiles === void 0 ? 10 : _param_maxFiles, _param_maxTotalImages = param.maxTotalImages, maxTotalImages = _param_maxTotalImages === void 0 ? 10 : _param_maxTotalImages, _param_showLimitWarning = param.showLimitWarning, showLimitWarning = _param_showLimitWarning === void 0 ? false : _param_showLimitWarning;
     var _useState = _sliced_to_array(useState([]), 2), previewFiles = _useState[0], setPreviewFiles = _useState[1];
     var _useState1 = _sliced_to_array(useState(null), 2), uploadError = _useState1[0], setUploadError = _useState1[1];
     useEffect(function() {
@@ -16805,7 +16801,7 @@ var DropImage = function(param) {
                                 imageUrls: previewFiles,
                                 handleRemove: handleRemove,
                                 maxTotalImages: maxTotalImages,
-                                showLimitWarning: !canUploadMore
+                                showLimitWarning: showLimitWarning
                             })
                         ]
                     })

package/baseSwitch.cjs.js

@@ -23422,7 +23422,7 @@ var BaseSwitch = /*#__PURE__*/ React__namespace.forwardRef(function(_param, ref)
                         className: "inline-flex items-center gap-2",
                         children: [
                             /*#__PURE__*/ jsxRuntime.jsx(SwitchPrimitives__namespace.Root, _object_spread_props(_object_spread({
-                                className: utils.cn("ui-switch-root", "peer inline-flex shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2", "disabled:cursor-not-allowed disabled:opacity-50", "data-[state=unchecked]:bg-gray-200", bgColor, sizeClass[size].root)
+                                className: utils.cn("peer inline-flex shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50", bgColor, sizeClass[size].root, "data-[state=unchecked]:bg-input")
                             }, props), {
                                 ref: ref,
                                 checked: field.value,
@@ -23430,7 +23430,7 @@ var BaseSwitch = /*#__PURE__*/ React__namespace.forwardRef(function(_param, ref)
                                 id: item === null || item === void 0 ? void 0 : item.id,
                                 disabled: item === null || item === void 0 ? void 0 : item.disable,
                                 children: /*#__PURE__*/ jsxRuntime.jsx(SwitchPrimitives__namespace.Thumb, {
-                                    className: utils.cn("ui-switch-thumb", "pointer-events-none block rounded-full bg-white shadow-lg ring-0 transition-transform", "data-[state=unchecked]:translate-x-1", sizeClass[size].thumb)
+                                    className: utils.cn("pointer-events-none block rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=unchecked]:translate-x-1", sizeClass[size].thumb)
                                 })
                             })),
                             (item === null || item === void 0 ? void 0 : item.labelRight) && /*#__PURE__*/ jsxRuntime.jsx("span", {

package/baseSwitch.esm.js

@@ -23393,7 +23393,7 @@ var BaseSwitch = /*#__PURE__*/ React.forwardRef(function(_param, ref) {
                         className: "inline-flex items-center gap-2",
                         children: [
                             /*#__PURE__*/ jsx$1(SwitchPrimitives.Root, _object_spread_props(_object_spread({
-                                className: cn("ui-switch-root", "peer inline-flex shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2", "disabled:cursor-not-allowed disabled:opacity-50", "data-[state=unchecked]:bg-gray-200", bgColor, sizeClass[size].root)
+                                className: cn("peer inline-flex shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50", bgColor, sizeClass[size].root, "data-[state=unchecked]:bg-input")
                             }, props), {
                                 ref: ref,
                                 checked: field.value,
@@ -23401,7 +23401,7 @@ var BaseSwitch = /*#__PURE__*/ React.forwardRef(function(_param, ref) {
                                 id: item === null || item === void 0 ? void 0 : item.id,
                                 disabled: item === null || item === void 0 ? void 0 : item.disable,
                                 children: /*#__PURE__*/ jsx$1(SwitchPrimitives.Thumb, {
-                                    className: cn("ui-switch-thumb", "pointer-events-none block rounded-full bg-white shadow-lg ring-0 transition-transform", "data-[state=unchecked]:translate-x-1", sizeClass[size].thumb)
+                                    className: cn("pointer-events-none block rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=unchecked]:translate-x-1", sizeClass[size].thumb)
                                 })
                             })),
                             (item === null || item === void 0 ? void 0 : item.labelRight) && /*#__PURE__*/ jsx$1("span", {

package/index.cjs.css

@@ -3126,9 +3126,6 @@ video {
 .\[module\:ui\/template\~TemplateBinding\#callback\] {
   module: ui/template~TemplateBinding#callback;
 }
-
-/* Import all UI component styles */
-@import './styles/index.css';
 .file\:border-0::file-selector-button {
   border-width: 0px;
 }
@@ -3569,10 +3566,6 @@ video {
   --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
   box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
 }
-.focus-visible\:ring-blue-500:focus-visible {
-  --tw-ring-opacity: 1;
-  --tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity, 1));
-}
 .focus-visible\:ring-ring:focus-visible {
   --tw-ring-color: hsl(var(--ring));
 }
@@ -3686,10 +3679,6 @@ video {
 .data-\[state\=selected\]\:bg-muted[data-state="selected"] {
   background-color: hsl(var(--muted));
 }
-.data-\[state\=unchecked\]\:bg-gray-200[data-state="unchecked"] {
-  --tw-bg-opacity: 1;
-  background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1));
-}
 .data-\[state\=unchecked\]\:bg-input[data-state="unchecked"] {
   background-color: hsl(var(--input));
 }

package/index.esm.css

@@ -3126,9 +3126,6 @@ video {
 .\[module\:ui\/template\~TemplateBinding\#callback\] {
   module: ui/template~TemplateBinding#callback;
 }
-
-/* Import all UI component styles */
-@import './styles/index.css';
 .file\:border-0::file-selector-button {
   border-width: 0px;
 }
@@ -3569,10 +3566,6 @@ video {
   --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
   box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
 }
-.focus-visible\:ring-blue-500:focus-visible {
-  --tw-ring-opacity: 1;
-  --tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity, 1));
-}
 .focus-visible\:ring-ring:focus-visible {
   --tw-ring-color: hsl(var(--ring));
 }
@@ -3686,10 +3679,6 @@ video {
 .data-\[state\=selected\]\:bg-muted[data-state="selected"] {
   background-color: hsl(var(--muted));
 }
-.data-\[state\=unchecked\]\:bg-gray-200[data-state="unchecked"] {
-  --tw-bg-opacity: 1;
-  background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1));
-}
 .data-\[state\=unchecked\]\:bg-input[data-state="unchecked"] {
   background-color: hsl(var(--input));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sunggang/ui-lib",
-  "version": "0.4.11",
+  "version": "0.4.12",
   "main": "./index.cjs.js",
   "module": "./index.esm.js",
   "types": "./dist/src/index.d.ts",

package/src/lib/DropImage/index.stories.d.ts

@@ -7,6 +7,7 @@ export interface ImageItem {
 }
 export interface DropImageProps {
     preview: boolean;
+    showLimitWarning?: boolean;
     limitSize?: number;
     maxFiles?: number;
     maxTotalImages?: number;