@umami/react-zen 0.198.0 → 0.200.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.
package/dist/index.css CHANGED
@@ -3530,37 +3530,35 @@ body a.Button_button__NGQyO {
3530
3530
  transition: max-height 0.5s ease-out;
3531
3531
  }
3532
3532
 
3533
+ /* virtual-css:css:94870e251b7b77526d8ae103079be601 */
3534
+ .Heading_heading__MGIyZ {
3535
+ color: var(--heading-color);
3536
+ font-weight: var(--font-weight-bold);
3537
+ line-height: 1.2;
3538
+ }
3539
+
3533
3540
  /* virtual-css:css:190b71b0b870ea6c0882d0c839c39b19 */
3534
- .Dialog_dialog__OWY2M {
3541
+ .Dialog_dialog__NjJlM {
3542
+ padding: var(--spacing-6);
3543
+ box-shadow: var(--box-shadow-4);
3544
+ background: var(--background-color);
3545
+ border: var(--border);
3546
+ border-radius: var(--border-radius);
3535
3547
  position: relative;
3536
3548
  outline: none;
3537
- max-height: 100vh;
3538
- max-width: 100vw;
3539
3549
  overflow: auto;
3540
3550
  }
3541
- .Dialog_title__MzNlY {
3551
+ .Dialog_title__YjdmY {
3542
3552
  font-size: var(--font-size-5);
3543
3553
  font-weight: 700;
3544
3554
  margin-bottom: var(--spacing-3);
3545
3555
  }
3546
- .Dialog_modal__ZWZjN {
3547
- padding: var(--spacing-6);
3548
- box-shadow: var(--box-shadow-4);
3549
- background: var(--background-color);
3550
- border: var(--border);
3551
- border-radius: var(--border-radius);
3552
- }
3553
- .Dialog_menu__NWYyN {
3554
- padding: var(--spacing-2);
3555
- box-shadow: var(--box-shadow-3);
3556
- background: var(--background-color);
3557
- border: var(--border);
3558
- border-radius: var(--border-radius);
3559
- }
3560
- .Dialog_sheet__MmJjY {
3556
+ .Dialog_dialog__NjJlM.Dialog_sheet__ZjQ1M {
3561
3557
  background: var(--background-color);
3562
3558
  width: 100%;
3563
3559
  height: 100%;
3560
+ padding: 0;
3561
+ border: 0;
3564
3562
  border-radius: 0;
3565
3563
  box-shadow: none;
3566
3564
  z-index: 9999;
@@ -4161,13 +4159,6 @@ body a.Button_button__NGQyO {
4161
4159
  transform: translate(-50%, calc(-100% - 10px));
4162
4160
  }
4163
4161
 
4164
- /* virtual-css:css:94870e251b7b77526d8ae103079be601 */
4165
- .Heading_heading__MGIyZ {
4166
- color: var(--heading-color);
4167
- font-weight: var(--font-weight-bold);
4168
- line-height: 1.2;
4169
- }
4170
-
4171
4162
  /* virtual-css:css:d6c8f45fae43d995517dd77d33fd2f76 */
4172
4163
  .HoverTrigger_wrapper__NGFlN {
4173
4164
  transform: translateY(-10px);
@@ -4315,7 +4306,7 @@ body a.Button_button__NGQyO {
4315
4306
  }
4316
4307
 
4317
4308
  /* virtual-css:css:593a0302ed618f22d0e6c3631ec684d2 */
4318
- .Modal_overlay__MzBhO {
4309
+ .Modal_overlay__MDExM {
4319
4310
  position: fixed;
4320
4311
  top: 0;
4321
4312
  left: 0;
@@ -4328,17 +4319,17 @@ body a.Button_button__NGQyO {
4328
4319
  --modal-offset: 50%;
4329
4320
  z-index: 9999;
4330
4321
  }
4331
- .Modal_overlay__MzBhO[data-entering] {
4332
- animation: Modal_modal-fade-in__OTcxN 200ms;
4322
+ .Modal_overlay__MDExM[data-entering] {
4323
+ animation: Modal_modal-fade-in__ZDY2M 200ms;
4333
4324
  }
4334
- .Modal_overlay__MzBhO[data-exiting] {
4335
- animation: Modal_modal-fade-in__OTcxN 200ms reverse ease-in;
4325
+ .Modal_overlay__MDExM[data-exiting] {
4326
+ animation: Modal_modal-fade-in__ZDY2M 200ms reverse ease-in;
4336
4327
  }
4337
- .Modal_modal__YTU3M {
4328
+ .Modal_modal__YTc0N {
4338
4329
  position: relative;
4339
4330
  z-index: 9999;
4340
4331
  }
4341
- .Modal_modal__YTU3M.Modal_left__ZDU0O {
4332
+ .Modal_modal__YTc0N.Modal_left__MTJkM {
4342
4333
  position: absolute;
4343
4334
  top: 0;
4344
4335
  left: 0;
@@ -4346,7 +4337,7 @@ body a.Button_button__NGQyO {
4346
4337
  margin: auto;
4347
4338
  width: calc(100dvw - var(--modal-offset, 0));
4348
4339
  }
4349
- .Modal_modal__YTU3M.Modal_right__MGFhO {
4340
+ .Modal_modal__YTc0N.Modal_right__MTgyY {
4350
4341
  position: absolute;
4351
4342
  top: 0;
4352
4343
  right: 0;
@@ -4354,7 +4345,7 @@ body a.Button_button__NGQyO {
4354
4345
  margin: auto;
4355
4346
  width: calc(100dvw - var(--modal-offset, 0));
4356
4347
  }
4357
- .Modal_modal__YTU3M.Modal_top__OTY4M {
4348
+ .Modal_modal__YTc0N.Modal_top__ZjhhZ {
4358
4349
  position: absolute;
4359
4350
  top: 0;
4360
4351
  left: 0;
@@ -4362,7 +4353,7 @@ body a.Button_button__NGQyO {
4362
4353
  margin: auto;
4363
4354
  height: calc(100dvh - var(--modal-offset, 0));
4364
4355
  }
4365
- .Modal_modal__YTU3M.Modal_bottom__NjY4N {
4356
+ .Modal_modal__YTc0N.Modal_bottom__NWMzZ {
4366
4357
  position: absolute;
4367
4358
  left: 0;
4368
4359
  right: 0;
@@ -4370,41 +4361,42 @@ body a.Button_button__NGQyO {
4370
4361
  margin: auto;
4371
4362
  height: calc(100dvh - var(--modal-offset, 0));
4372
4363
  }
4373
- .Modal_modal__YTU3M.Modal_fullscreen__YTNkZ {
4364
+ .Modal_modal__YTc0N.Modal_fullscreen__MzNlO {
4374
4365
  width: 100dvw;
4375
4366
  height: 100dvh;
4367
+ border-radius: 0;
4376
4368
  }
4377
- .Modal_modal__YTU3M.Modal_center__ZTViM[data-entering] {
4378
- animation: Modal_modal-zoom__MjY4Y 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
4369
+ .Modal_modal__YTc0N.Modal_center__YzA4O[data-entering] {
4370
+ animation: Modal_modal-zoom__YjI0Z 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
4379
4371
  }
4380
- .Modal_modal__YTU3M.Modal_left__ZDU0O[data-entering] {
4381
- animation: Modal_modal-left__YTc0N 200ms ease-out;
4372
+ .Modal_modal__YTc0N.Modal_left__MTJkM[data-entering] {
4373
+ animation: Modal_modal-left__YzdjM 200ms ease-out;
4382
4374
  }
4383
- .Modal_modal__YTU3M.Modal_left__ZDU0O[data-exiting] {
4384
- animation: Modal_modal-left__YTc0N 200ms reverse ease-out;
4375
+ .Modal_modal__YTc0N.Modal_left__MTJkM[data-exiting] {
4376
+ animation: Modal_modal-left__YzdjM 200ms reverse ease-out;
4385
4377
  }
4386
- .Modal_modal__YTU3M.Modal_right__MGFhO[data-entering] {
4387
- animation: Modal_modal-right__MWY0Z 200ms ease-out;
4378
+ .Modal_modal__YTc0N.Modal_right__MTgyY[data-entering] {
4379
+ animation: Modal_modal-right__MjdlN 200ms ease-out;
4388
4380
  }
4389
- .Modal_modal__YTU3M.Modal_right__MGFhO[data-exiting] {
4390
- animation: Modal_modal-right__MWY0Z 200ms reverse ease-in;
4381
+ .Modal_modal__YTc0N.Modal_right__MTgyY[data-exiting] {
4382
+ animation: Modal_modal-right__MjdlN 200ms reverse ease-in;
4391
4383
  }
4392
- .Modal_modal__YTU3M.Modal_top__OTY4M[data-entering] {
4393
- animation: Modal_modal-top__OTQ2M 200ms ease-out;
4384
+ .Modal_modal__YTc0N.Modal_top__ZjhhZ[data-entering] {
4385
+ animation: Modal_modal-top__ZTg5M 200ms ease-out;
4394
4386
  }
4395
- .Modal_modal__YTU3M.Modal_top__OTY4M[data-exiting] {
4396
- animation: Modal_modal-top__OTQ2M 200ms reverse ease-in;
4387
+ .Modal_modal__YTc0N.Modal_top__ZjhhZ[data-exiting] {
4388
+ animation: Modal_modal-top__ZTg5M 200ms reverse ease-in;
4397
4389
  }
4398
- .Modal_modal__YTU3M.Modal_bottom__NjY4N[data-entering] {
4399
- animation: Modal_modal-bottom__NDlkZ 200ms ease-out;
4390
+ .Modal_modal__YTc0N.Modal_bottom__NWMzZ[data-entering] {
4391
+ animation: Modal_modal-bottom__YjQ3N 200ms ease-out;
4400
4392
  }
4401
- .Modal_modal__YTU3M.Modal_bottom__NjY4N[data-exiting] {
4402
- animation: Modal_modal-bottom__NDlkZ 200ms reverse ease-in;
4393
+ .Modal_modal__YTc0N.Modal_bottom__NWMzZ[data-exiting] {
4394
+ animation: Modal_modal-bottom__YjQ3N 200ms reverse ease-in;
4403
4395
  }
4404
- .Modal_modal__YTU3M.Modal_fullscreen__YTNkZ[data-entering] {
4405
- animation: Modal_modal-fade-in__OTcxN 200ms ease-out;
4396
+ .Modal_modal__YTc0N.Modal_fullscreen__MzNlO[data-entering] {
4397
+ animation: Modal_modal-fade-in__ZDY2M 200ms ease-out;
4406
4398
  }
4407
- @keyframes Modal_modal-fade-in__OTcxN {
4399
+ @keyframes Modal_modal-fade-in__ZDY2M {
4408
4400
  from {
4409
4401
  opacity: 0;
4410
4402
  }
@@ -4412,7 +4404,7 @@ body a.Button_button__NGQyO {
4412
4404
  opacity: 1;
4413
4405
  }
4414
4406
  }
4415
- @keyframes Modal_modal-zoom__MjY4Y {
4407
+ @keyframes Modal_modal-zoom__YjI0Z {
4416
4408
  from {
4417
4409
  transform: scale(0.8);
4418
4410
  }
@@ -4420,7 +4412,7 @@ body a.Button_button__NGQyO {
4420
4412
  transform: scale(1);
4421
4413
  }
4422
4414
  }
4423
- @keyframes Modal_modal-left__YTc0N {
4415
+ @keyframes Modal_modal-left__YzdjM {
4424
4416
  from {
4425
4417
  transform: translateX(-100%);
4426
4418
  }
@@ -4428,7 +4420,7 @@ body a.Button_button__NGQyO {
4428
4420
  transform: translateX(0);
4429
4421
  }
4430
4422
  }
4431
- @keyframes Modal_modal-right__MWY0Z {
4423
+ @keyframes Modal_modal-right__MjdlN {
4432
4424
  from {
4433
4425
  transform: translateX(100%);
4434
4426
  }
@@ -4436,7 +4428,7 @@ body a.Button_button__NGQyO {
4436
4428
  transform: translateX(0);
4437
4429
  }
4438
4430
  }
4439
- @keyframes Modal_modal-top__OTQ2M {
4431
+ @keyframes Modal_modal-top__ZTg5M {
4440
4432
  from {
4441
4433
  transform: translateY(-100%);
4442
4434
  }
@@ -4444,7 +4436,7 @@ body a.Button_button__NGQyO {
4444
4436
  transform: translateX(0);
4445
4437
  }
4446
4438
  }
4447
- @keyframes Modal_modal-bottom__NDlkZ {
4439
+ @keyframes Modal_modal-bottom__YjQ3N {
4448
4440
  from {
4449
4441
  transform: translateY(100%);
4450
4442
  }
package/dist/index.d.mts CHANGED
@@ -285,7 +285,7 @@ declare function AlertBanner({ title, description, icon, variant, align, allowCl
285
285
 
286
286
  interface DialogProps extends DialogProps$1 {
287
287
  title?: ReactNode;
288
- variant?: 'modal' | 'menu' | 'sheet' | 'none';
288
+ variant?: 'sheet';
289
289
  }
290
290
  declare function Dialog({ title, variant, children, className, ...props }: DialogProps): react.JSX.Element;
291
291
 
@@ -556,13 +556,13 @@ interface SubmenuTriggerProps extends SubmenuTriggerProps$1 {
556
556
  declare function SubMenuTrigger({ children, ...props }: SubmenuTriggerProps): react.JSX.Element;
557
557
 
558
558
  interface ModalProps extends ModalOverlayProps {
559
- position?: 'center' | 'top' | 'bottom' | 'left' | 'right' | 'fullscreen';
559
+ placement?: 'center' | 'top' | 'bottom' | 'left' | 'right' | 'fullscreen';
560
560
  offset?: string;
561
561
  children?: ReactNode | ((values: ModalRenderProps & {
562
562
  defaultChildren: ReactNode;
563
563
  }) => ReactNode);
564
564
  }
565
- declare function Modal({ position, offset, children, className, style, ...props }: ModalProps): react.JSX.Element;
565
+ declare function Modal({ placement, offset, children, className, style, ...props }: ModalProps): react.JSX.Element;
566
566
 
567
567
  type NavigationContext = {
568
568
  activeMenu: string;
package/dist/index.d.ts CHANGED
@@ -285,7 +285,7 @@ declare function AlertBanner({ title, description, icon, variant, align, allowCl
285
285
 
286
286
  interface DialogProps extends DialogProps$1 {
287
287
  title?: ReactNode;
288
- variant?: 'modal' | 'menu' | 'sheet' | 'none';
288
+ variant?: 'sheet';
289
289
  }
290
290
  declare function Dialog({ title, variant, children, className, ...props }: DialogProps): react.JSX.Element;
291
291
 
@@ -556,13 +556,13 @@ interface SubmenuTriggerProps extends SubmenuTriggerProps$1 {
556
556
  declare function SubMenuTrigger({ children, ...props }: SubmenuTriggerProps): react.JSX.Element;
557
557
 
558
558
  interface ModalProps extends ModalOverlayProps {
559
- position?: 'center' | 'top' | 'bottom' | 'left' | 'right' | 'fullscreen';
559
+ placement?: 'center' | 'top' | 'bottom' | 'left' | 'right' | 'fullscreen';
560
560
  offset?: string;
561
561
  children?: ReactNode | ((values: ModalRenderProps & {
562
562
  defaultChildren: ReactNode;
563
563
  }) => ReactNode);
564
564
  }
565
- declare function Modal({ position, offset, children, className, style, ...props }: ModalProps): react.JSX.Element;
565
+ declare function Modal({ placement, offset, children, className, style, ...props }: ModalProps): react.JSX.Element;
566
566
 
567
567
  type NavigationContext = {
568
568
  activeMenu: string;