@gfazioli/mantine-clock 3.0.0 → 4.0.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.
Files changed (44) hide show
  1. package/README.md +9 -3
  2. package/dist/cjs/Clock.cjs +48 -535
  3. package/dist/cjs/Clock.cjs.map +1 -1
  4. package/dist/cjs/ClockDigital.cjs +22 -25
  5. package/dist/cjs/ClockDigital.cjs.map +1 -1
  6. package/dist/cjs/ClockDigitalMediaVariables.cjs +76 -0
  7. package/dist/cjs/ClockDigitalMediaVariables.cjs.map +1 -0
  8. package/dist/cjs/ClockFaceStatic.cjs +96 -0
  9. package/dist/cjs/ClockFaceStatic.cjs.map +1 -0
  10. package/dist/cjs/RealClock.cjs +379 -0
  11. package/dist/cjs/RealClock.cjs.map +1 -0
  12. package/dist/cjs/clock-utils.cjs +63 -0
  13. package/dist/cjs/clock-utils.cjs.map +1 -0
  14. package/dist/cjs/geometry.cjs +2 -2
  15. package/dist/cjs/geometry.cjs.map +1 -1
  16. package/dist/cjs/hooks/use-clock-count-down.cjs +2 -2
  17. package/dist/cjs/hooks/use-clock-count-down.cjs.map +1 -1
  18. package/dist/cjs/hooks/use-clock.cjs +2 -2
  19. package/dist/cjs/hooks/use-clock.cjs.map +1 -1
  20. package/dist/esm/Clock.mjs +47 -534
  21. package/dist/esm/Clock.mjs.map +1 -1
  22. package/dist/esm/ClockDigital.mjs +23 -26
  23. package/dist/esm/ClockDigital.mjs.map +1 -1
  24. package/dist/esm/ClockDigitalMediaVariables.mjs +74 -0
  25. package/dist/esm/ClockDigitalMediaVariables.mjs.map +1 -0
  26. package/dist/esm/ClockFaceStatic.mjs +94 -0
  27. package/dist/esm/ClockFaceStatic.mjs.map +1 -0
  28. package/dist/esm/RealClock.mjs +377 -0
  29. package/dist/esm/RealClock.mjs.map +1 -0
  30. package/dist/esm/clock-utils.mjs +56 -0
  31. package/dist/esm/clock-utils.mjs.map +1 -0
  32. package/dist/esm/geometry.mjs +2 -2
  33. package/dist/esm/geometry.mjs.map +1 -1
  34. package/dist/esm/hooks/use-clock-count-down.mjs +2 -2
  35. package/dist/esm/hooks/use-clock-count-down.mjs.map +1 -1
  36. package/dist/esm/hooks/use-clock.mjs +2 -2
  37. package/dist/esm/hooks/use-clock.mjs.map +1 -1
  38. package/dist/types/Clock.d.ts +3 -3
  39. package/dist/types/ClockDigital.d.ts +5 -5
  40. package/dist/types/ClockDigitalMediaVariables.d.ts +9 -0
  41. package/dist/types/ClockFaceStatic.d.ts +18 -0
  42. package/dist/types/RealClock.d.ts +12 -0
  43. package/dist/types/clock-utils.d.ts +23 -0
  44. package/package.json +7 -1
package/README.md CHANGED
@@ -19,6 +19,7 @@
19
19
  ## Overview
20
20
 
21
21
  This component is created on top of the [Mantine](https://mantine.dev/) library.
22
+ It requires **Mantine 9.x** and **React 19**.
22
23
 
23
24
  [Mantine Clock](https://gfazioli.github.io/mantine-clock/) delivers both an analog Clock component and time-management hooks tailored for React applications.
24
25
 
@@ -229,11 +230,16 @@ function ControllableCountdown() {
229
230
 
230
231
  - **Real-time Updates**: Automatic time synchronization with configurable frequency
231
232
  - **Timezone Support**: Global timezone compatibility with IANA timezone database
232
- - **Customizable Styling**: Full control over appearance and theming
233
+ - **Clock.Digital**: Compound component for digital clock display with AM/PM, date, and custom separators
234
+ - **Responsive Size**: Breakpoint-based responsive sizing (`{ base: "sm", md: "lg" }`) using Mantine's native CSS media queries
235
+ - **Clock Shapes**: Circle and rounded-rectangle (Apple Watch style) with configurable aspect ratio
236
+ - **Sector Arcs**: Visual arcs aligned to seconds, minutes, and hours hands
237
+ - **Custom Hand Rendering**: Full control via render props for hour, minute, and second hands
238
+ - **Mount Animation**: Entrance animation from 12:00 to current time
239
+ - **Countdown Timer**: `useClockCountDown` hook with target dates, durations, and completion callbacks
240
+ - **Customizable Styling**: Full control over appearance via Styles API and CSS variables
233
241
  - **TypeScript Support**: Complete type definitions for better developer experience
234
242
  - **Accessibility**: Built with WCAG compliance and screen reader support
235
- - **Performance Optimized**: Efficient updates with minimal re-renders
236
- - **Responsive Design**: Adapts to different screen sizes automatically
237
243
 
238
244
  ## Sponsor
239
245