@janovix/blocks 1.0.0-rc.5 → 1.0.0-rc.6

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/README.md CHANGED
@@ -162,17 +162,18 @@ interface Language {
162
162
 
163
163
  ### AvatarEditor
164
164
 
165
- An interactive avatar editor with zoom, rotation, and flip controls.
165
+ An interactive avatar editor with zoom, rotation, and drag controls.
166
166
 
167
167
  **Features:**
168
168
 
169
- - Image zoom (0.1x - 3x)
170
- - Image rotation (0° - 360°)
171
- - Horizontal/vertical flip
172
- - Real-time preview
173
- - Customizable size
174
- - Mouse wheel zoom support
175
- - Drag to reposition
169
+ - Image zoom via UI buttons and slider (0.5x - 3x)
170
+ - Image rotation in 15° increments (0° - 360°)
171
+ - Drag to reposition image
172
+ - Real-time preview with circular crop
173
+ - Customizable editor size
174
+ - Optional grid overlay for alignment
175
+ - Reset all transforms
176
+ - Touch-optimized controls for mobile
176
177
 
177
178
  **Usage:**
178
179
 
package/dist/index.cjs CHANGED
@@ -9669,6 +9669,12 @@ function AvatarEditor({
9669
9669
  setPosition({ x: 0, y: 0 });
9670
9670
  };
9671
9671
  img.src = imageSource;
9672
+ } else {
9673
+ setImage(null);
9674
+ setImageLoaded(false);
9675
+ setZoom(1);
9676
+ setRotation(0);
9677
+ setPosition({ x: 0, y: 0 });
9672
9678
  }
9673
9679
  }, [imageSource]);
9674
9680
  const generateOutput = React32.useCallback(() => {
@@ -10992,18 +10998,32 @@ function NotificationsWidget({
10992
10998
  const config = typeConfig[notification.type || "info"];
10993
10999
  const Icon = config.icon;
10994
11000
  const hasLink = !!notification.href;
11001
+ const handleClick = () => handleNotificationClick(notification);
11002
+ const handleKeyDown = (e) => {
11003
+ if (e.key === "Enter" || e.key === " ") {
11004
+ e.preventDefault();
11005
+ handleNotificationClick(notification);
11006
+ }
11007
+ };
11008
+ const MotionElement = hasLink ? react.motion.button : react.motion.div;
11009
+ const interactionProps = hasLink ? {
11010
+ role: "button",
11011
+ tabIndex: 0,
11012
+ onClick: handleClick,
11013
+ onKeyDown: handleKeyDown
11014
+ } : {};
10995
11015
  return /* @__PURE__ */ jsxRuntime.jsxs(
10996
- react.motion.div,
11016
+ MotionElement,
10997
11017
  {
10998
11018
  initial: { opacity: 0, y: -10 },
10999
11019
  animate: { opacity: 1, y: 0 },
11000
11020
  className: cn(
11001
- "relative flex gap-3 px-4 py-3 transition-colors group",
11021
+ "relative flex gap-3 px-4 py-3 transition-colors group w-full text-left border-0 bg-transparent",
11002
11022
  hasLink && "cursor-pointer hover:bg-muted/50",
11003
11023
  !hasLink && "cursor-default",
11004
11024
  !notification.read && "bg-primary/5"
11005
11025
  ),
11006
- onClick: () => handleNotificationClick(notification),
11026
+ ...interactionProps,
11007
11027
  children: [
11008
11028
  /* @__PURE__ */ jsxRuntime.jsx(
11009
11029
  "div",