@tomny-dev/uzi 0.2.7 → 0.2.8-pr.26.85.2.13577b0

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.
@@ -1 +1 @@
1
- {"version":3,"file":"index12.js","names":[],"sources":["../src/components/modal/modal.module.css"],"sourcesContent":[".portalLayer {\n position: fixed;\n inset: 0;\n z-index: 100;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 16px;\n}\n\n.backdrop {\n position: absolute;\n inset: 0;\n background: rgba(0, 0, 0, 0.55);\n}\n\n.backdrop[data-state=\"open\"] {\n animation: backdropFadeIn 160ms ease;\n}\n\n.backdrop[data-state=\"closed\"] {\n animation: backdropFadeOut 140ms ease;\n}\n\n.overlayContent {\n position: relative;\n z-index: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n max-width: 100%;\n max-height: 100%;\n outline: none;\n}\n\n.overlayContent[data-state=\"open\"] {\n animation: modalContentIn 180ms ease;\n}\n\n.overlayContent[data-state=\"closed\"] {\n animation: modalContentOut 140ms ease;\n}\n\n.modal {\n background: var(--background);\n border: 1px solid var(--border);\n border-radius: 14px;\n padding: 24px;\n width: min(500px, 100%);\n box-shadow: 0 24px 64px rgba(0, 0, 0, 0.55);\n display: flex;\n flex-direction: column;\n gap: 0;\n}\n\n/* Size variants */\n.size-sm { width: min(380px, 100%); }\n.size-md { width: min(500px, 100%); }\n.size-lg { width: min(640px, 100%); }\n.size-xl { width: min(900px, 100%); }\n\n.header {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n gap: 12px;\n margin-bottom: 16px;\n}\n\n.titles {\n display: flex;\n flex-direction: column;\n gap: 3px;\n}\n\n.title {\n font-weight: 700;\n font-size: 16px;\n color: var(--foreground);\n line-height: 1.3;\n}\n\n.subtitle {\n font-size: 13px;\n color: var(--muted-foreground);\n line-height: 1.4;\n}\n\n.closeButton {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 28px;\n height: 28px;\n flex-shrink: 0;\n background: transparent;\n border: 1px solid transparent;\n border-radius: 6px;\n color: var(--muted-foreground);\n cursor: pointer;\n transition: background 0.12s, color 0.12s;\n padding: 0;\n}\n\n.closeButton:hover {\n background: color-mix(in srgb, var(--foreground) 7%, transparent);\n color: var(--foreground);\n}\n\n.closeButton:focus-visible {\n outline: var(--focus-ring);\n outline-offset: var(--focus-ring-offset);\n}\n\n.body {\n display: flex;\n flex-direction: column;\n gap: 12px;\n}\n\n.footer {\n display: flex;\n gap: 8px;\n margin-top: 20px;\n}\n\n@keyframes backdropFadeIn {\n from {\n opacity: 0;\n }\n\n to {\n opacity: 1;\n }\n}\n\n@keyframes backdropFadeOut {\n from {\n opacity: 1;\n }\n\n to {\n opacity: 0;\n }\n}\n\n@keyframes modalContentIn {\n from {\n opacity: 0;\n transform: translateY(6px) scale(0.98);\n }\n\n to {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n}\n\n@keyframes modalContentOut {\n from {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n\n to {\n opacity: 0;\n transform: translateY(4px) scale(0.98);\n }\n}\n"],"mappings":""}
1
+ {"version":3,"file":"index12.js","names":[],"sources":["../src/components/modal/modal.module.css"],"sourcesContent":[".portalLayer {\n --uzi-modal-viewport-margin: 32px;\n\n position: fixed;\n inset: 0;\n z-index: 100;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 16px;\n}\n\n.backdrop {\n position: absolute;\n inset: 0;\n background: rgba(0, 0, 0, 0.55);\n}\n\n.backdrop[data-state=\"open\"] {\n animation: backdropFadeIn 160ms ease;\n}\n\n.backdrop[data-state=\"closed\"] {\n animation: backdropFadeOut 140ms ease;\n}\n\n.overlayContent {\n position: relative;\n z-index: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n max-width: 100%;\n max-height: 100%;\n outline: none;\n}\n\n.overlayContent[data-state=\"open\"] {\n animation: modalContentIn 180ms ease;\n}\n\n.overlayContent[data-state=\"closed\"] {\n animation: modalContentOut 140ms ease;\n}\n\n.modal {\n background: var(--background);\n border: 1px solid var(--border);\n border-radius: 14px;\n max-height: calc(100vh - var(--uzi-modal-viewport-margin));\n max-height: calc(100dvh - var(--uzi-modal-viewport-margin));\n overflow: hidden;\n box-shadow: 0 24px 64px rgba(0, 0, 0, 0.55);\n display: flex;\n flex-direction: column;\n gap: 0;\n}\n\n/* Size variants */\n.size-sm { width: min(380px, calc(100vw - var(--uzi-modal-viewport-margin))); }\n.size-md { width: min(500px, calc(100vw - var(--uzi-modal-viewport-margin))); }\n.size-lg { width: min(640px, calc(100vw - var(--uzi-modal-viewport-margin))); }\n.size-xl { width: min(900px, calc(100vw - var(--uzi-modal-viewport-margin))); }\n\n.header {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n gap: 12px;\n padding: 24px 24px 0;\n margin-bottom: 16px;\n}\n\n.titles {\n display: flex;\n flex-direction: column;\n gap: 3px;\n}\n\n.title {\n font-weight: 700;\n font-size: 16px;\n color: var(--foreground);\n line-height: 1.3;\n}\n\n.subtitle {\n font-size: 13px;\n color: var(--muted-foreground);\n line-height: 1.4;\n}\n\n.closeButton {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 28px;\n height: 28px;\n flex-shrink: 0;\n background: transparent;\n border: 1px solid transparent;\n border-radius: 6px;\n color: var(--muted-foreground);\n cursor: pointer;\n transition: background 0.12s, color 0.12s;\n padding: 0;\n}\n\n.closeButton:hover {\n background: color-mix(in srgb, var(--foreground) 7%, transparent);\n color: var(--foreground);\n}\n\n.closeButton:focus-visible {\n outline: var(--focus-ring);\n outline-offset: var(--focus-ring-offset);\n}\n\n.body {\n display: flex;\n flex-direction: column;\n gap: 12px;\n min-height: 0;\n overflow-y: auto;\n padding: 0 24px;\n}\n\n.body:last-child {\n padding-bottom: 24px;\n}\n\n.footer {\n display: flex;\n gap: 8px;\n padding: 0 24px 24px;\n margin-top: 20px;\n}\n\n@keyframes backdropFadeIn {\n from {\n opacity: 0;\n }\n\n to {\n opacity: 1;\n }\n}\n\n@keyframes backdropFadeOut {\n from {\n opacity: 1;\n }\n\n to {\n opacity: 0;\n }\n}\n\n@keyframes modalContentIn {\n from {\n opacity: 0;\n transform: translateY(6px) scale(0.98);\n }\n\n to {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n}\n\n@keyframes modalContentOut {\n from {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n\n to {\n opacity: 0;\n transform: translateY(4px) scale(0.98);\n }\n}\n"],"mappings":""}
@@ -1 +1 @@
1
- {"version":3,"file":"index13.cjs","names":[],"sources":["../src/components/modal/modal.module.css"],"sourcesContent":[".portalLayer {\n position: fixed;\n inset: 0;\n z-index: 100;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 16px;\n}\n\n.backdrop {\n position: absolute;\n inset: 0;\n background: rgba(0, 0, 0, 0.55);\n}\n\n.backdrop[data-state=\"open\"] {\n animation: backdropFadeIn 160ms ease;\n}\n\n.backdrop[data-state=\"closed\"] {\n animation: backdropFadeOut 140ms ease;\n}\n\n.overlayContent {\n position: relative;\n z-index: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n max-width: 100%;\n max-height: 100%;\n outline: none;\n}\n\n.overlayContent[data-state=\"open\"] {\n animation: modalContentIn 180ms ease;\n}\n\n.overlayContent[data-state=\"closed\"] {\n animation: modalContentOut 140ms ease;\n}\n\n.modal {\n background: var(--background);\n border: 1px solid var(--border);\n border-radius: 14px;\n padding: 24px;\n width: min(500px, 100%);\n box-shadow: 0 24px 64px rgba(0, 0, 0, 0.55);\n display: flex;\n flex-direction: column;\n gap: 0;\n}\n\n/* Size variants */\n.size-sm { width: min(380px, 100%); }\n.size-md { width: min(500px, 100%); }\n.size-lg { width: min(640px, 100%); }\n.size-xl { width: min(900px, 100%); }\n\n.header {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n gap: 12px;\n margin-bottom: 16px;\n}\n\n.titles {\n display: flex;\n flex-direction: column;\n gap: 3px;\n}\n\n.title {\n font-weight: 700;\n font-size: 16px;\n color: var(--foreground);\n line-height: 1.3;\n}\n\n.subtitle {\n font-size: 13px;\n color: var(--muted-foreground);\n line-height: 1.4;\n}\n\n.closeButton {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 28px;\n height: 28px;\n flex-shrink: 0;\n background: transparent;\n border: 1px solid transparent;\n border-radius: 6px;\n color: var(--muted-foreground);\n cursor: pointer;\n transition: background 0.12s, color 0.12s;\n padding: 0;\n}\n\n.closeButton:hover {\n background: color-mix(in srgb, var(--foreground) 7%, transparent);\n color: var(--foreground);\n}\n\n.closeButton:focus-visible {\n outline: var(--focus-ring);\n outline-offset: var(--focus-ring-offset);\n}\n\n.body {\n display: flex;\n flex-direction: column;\n gap: 12px;\n}\n\n.footer {\n display: flex;\n gap: 8px;\n margin-top: 20px;\n}\n\n@keyframes backdropFadeIn {\n from {\n opacity: 0;\n }\n\n to {\n opacity: 1;\n }\n}\n\n@keyframes backdropFadeOut {\n from {\n opacity: 1;\n }\n\n to {\n opacity: 0;\n }\n}\n\n@keyframes modalContentIn {\n from {\n opacity: 0;\n transform: translateY(6px) scale(0.98);\n }\n\n to {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n}\n\n@keyframes modalContentOut {\n from {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n\n to {\n opacity: 0;\n transform: translateY(4px) scale(0.98);\n }\n}\n"],"mappings":""}
1
+ {"version":3,"file":"index13.cjs","names":[],"sources":["../src/components/modal/modal.module.css"],"sourcesContent":[".portalLayer {\n --uzi-modal-viewport-margin: 32px;\n\n position: fixed;\n inset: 0;\n z-index: 100;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 16px;\n}\n\n.backdrop {\n position: absolute;\n inset: 0;\n background: rgba(0, 0, 0, 0.55);\n}\n\n.backdrop[data-state=\"open\"] {\n animation: backdropFadeIn 160ms ease;\n}\n\n.backdrop[data-state=\"closed\"] {\n animation: backdropFadeOut 140ms ease;\n}\n\n.overlayContent {\n position: relative;\n z-index: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n max-width: 100%;\n max-height: 100%;\n outline: none;\n}\n\n.overlayContent[data-state=\"open\"] {\n animation: modalContentIn 180ms ease;\n}\n\n.overlayContent[data-state=\"closed\"] {\n animation: modalContentOut 140ms ease;\n}\n\n.modal {\n background: var(--background);\n border: 1px solid var(--border);\n border-radius: 14px;\n max-height: calc(100vh - var(--uzi-modal-viewport-margin));\n max-height: calc(100dvh - var(--uzi-modal-viewport-margin));\n overflow: hidden;\n box-shadow: 0 24px 64px rgba(0, 0, 0, 0.55);\n display: flex;\n flex-direction: column;\n gap: 0;\n}\n\n/* Size variants */\n.size-sm { width: min(380px, calc(100vw - var(--uzi-modal-viewport-margin))); }\n.size-md { width: min(500px, calc(100vw - var(--uzi-modal-viewport-margin))); }\n.size-lg { width: min(640px, calc(100vw - var(--uzi-modal-viewport-margin))); }\n.size-xl { width: min(900px, calc(100vw - var(--uzi-modal-viewport-margin))); }\n\n.header {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n gap: 12px;\n padding: 24px 24px 0;\n margin-bottom: 16px;\n}\n\n.titles {\n display: flex;\n flex-direction: column;\n gap: 3px;\n}\n\n.title {\n font-weight: 700;\n font-size: 16px;\n color: var(--foreground);\n line-height: 1.3;\n}\n\n.subtitle {\n font-size: 13px;\n color: var(--muted-foreground);\n line-height: 1.4;\n}\n\n.closeButton {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 28px;\n height: 28px;\n flex-shrink: 0;\n background: transparent;\n border: 1px solid transparent;\n border-radius: 6px;\n color: var(--muted-foreground);\n cursor: pointer;\n transition: background 0.12s, color 0.12s;\n padding: 0;\n}\n\n.closeButton:hover {\n background: color-mix(in srgb, var(--foreground) 7%, transparent);\n color: var(--foreground);\n}\n\n.closeButton:focus-visible {\n outline: var(--focus-ring);\n outline-offset: var(--focus-ring-offset);\n}\n\n.body {\n display: flex;\n flex-direction: column;\n gap: 12px;\n min-height: 0;\n overflow-y: auto;\n padding: 0 24px;\n}\n\n.body:last-child {\n padding-bottom: 24px;\n}\n\n.footer {\n display: flex;\n gap: 8px;\n padding: 0 24px 24px;\n margin-top: 20px;\n}\n\n@keyframes backdropFadeIn {\n from {\n opacity: 0;\n }\n\n to {\n opacity: 1;\n }\n}\n\n@keyframes backdropFadeOut {\n from {\n opacity: 1;\n }\n\n to {\n opacity: 0;\n }\n}\n\n@keyframes modalContentIn {\n from {\n opacity: 0;\n transform: translateY(6px) scale(0.98);\n }\n\n to {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n}\n\n@keyframes modalContentOut {\n from {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n\n to {\n opacity: 0;\n transform: translateY(4px) scale(0.98);\n }\n}\n"],"mappings":""}
package/dist/style.css CHANGED
@@ -435,6 +435,8 @@ body {
435
435
  gap: 4px;
436
436
  }
437
437
  .uzi-modal-module__portalLayer__t7blc {
438
+ --uzi-modal-viewport-margin: 32px;
439
+
438
440
  position: fixed;
439
441
  inset: 0;
440
442
  z-index: 100;
@@ -481,8 +483,9 @@ body {
481
483
  background: var(--background);
482
484
  border: 1px solid var(--border);
483
485
  border-radius: 14px;
484
- padding: 24px;
485
- width: min(500px, 100%);
486
+ max-height: calc(100vh - var(--uzi-modal-viewport-margin));
487
+ max-height: calc(100dvh - var(--uzi-modal-viewport-margin));
488
+ overflow: hidden;
486
489
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.55);
487
490
  display: flex;
488
491
  flex-direction: column;
@@ -490,16 +493,17 @@ body {
490
493
  }
491
494
 
492
495
  /* Size variants */
493
- .uzi-modal-module__size-sm__Uu9je { width: min(380px, 100%); }
494
- .uzi-modal-module__size-md__TiiWy { width: min(500px, 100%); }
495
- .uzi-modal-module__size-lg__BrTIO { width: min(640px, 100%); }
496
- .uzi-modal-module__size-xl__sj0mh { width: min(900px, 100%); }
496
+ .uzi-modal-module__size-sm__Uu9je { width: min(380px, calc(100vw - var(--uzi-modal-viewport-margin))); }
497
+ .uzi-modal-module__size-md__TiiWy { width: min(500px, calc(100vw - var(--uzi-modal-viewport-margin))); }
498
+ .uzi-modal-module__size-lg__BrTIO { width: min(640px, calc(100vw - var(--uzi-modal-viewport-margin))); }
499
+ .uzi-modal-module__size-xl__sj0mh { width: min(900px, calc(100vw - var(--uzi-modal-viewport-margin))); }
497
500
 
498
501
  .uzi-modal-module__header__PmCaO {
499
502
  display: flex;
500
503
  align-items: flex-start;
501
504
  justify-content: space-between;
502
505
  gap: 12px;
506
+ padding: 24px 24px 0;
503
507
  margin-bottom: 16px;
504
508
  }
505
509
 
@@ -552,11 +556,19 @@ body {
552
556
  display: flex;
553
557
  flex-direction: column;
554
558
  gap: 12px;
559
+ min-height: 0;
560
+ overflow-y: auto;
561
+ padding: 0 24px;
562
+ }
563
+
564
+ .uzi-modal-module__body__km6FQ:last-child {
565
+ padding-bottom: 24px;
555
566
  }
556
567
 
557
568
  .uzi-modal-module__footer__jWLTv {
558
569
  display: flex;
559
570
  gap: 8px;
571
+ padding: 0 24px 24px;
560
572
  margin-top: 20px;
561
573
  }
562
574
 
package/package.json CHANGED
@@ -1,8 +1,16 @@
1
1
  {
2
2
  "name": "@tomny-dev/uzi",
3
- "version": "0.2.7",
3
+ "version": "0.2.8-pr.26.85.2.13577b0",
4
4
  "description": "Rapid-fire React UI components. Ship faster, build more.",
5
5
  "type": "module",
6
+ "repository": {
7
+ "type": "git",
8
+ "url": "git+https://github.com/tomny-dev/uzi.git"
9
+ },
10
+ "bugs": {
11
+ "url": "https://github.com/tomny-dev/uzi/issues"
12
+ },
13
+ "homepage": "https://github.com/tomny-dev/uzi#readme",
6
14
  "publishConfig": {
7
15
  "access": "public"
8
16
  },
@@ -30,6 +38,12 @@
30
38
  "node": ">=18",
31
39
  "pnpm": ">=8"
32
40
  },
41
+ "scripts": {
42
+ "build": "vite build && vite build --config vite.server.config.ts && tsc -p tsconfig.build.json",
43
+ "dev": "vite build --watch",
44
+ "lint": "tsc --noEmit",
45
+ "test": "vitest run"
46
+ },
33
47
  "peerDependencies": {
34
48
  "react": "^18.0.0 || ^19.0.0",
35
49
  "react-dom": "^18.0.0 || ^19.0.0"
@@ -54,11 +68,5 @@
54
68
  "vite-plugin-css-injected-by-js": "^5.0.1",
55
69
  "vitest": "^4.1.9"
56
70
  },
57
- "types": "./dist/index.d.ts",
58
- "scripts": {
59
- "build": "vite build && vite build --config vite.server.config.ts && tsc -p tsconfig.build.json",
60
- "dev": "vite build --watch",
61
- "lint": "tsc --noEmit",
62
- "test": "vitest run"
63
- }
64
- }
71
+ "types": "./dist/index.d.ts"
72
+ }