@kubit-ui-web/react-components 2.0.0-beta.1 → 2.0.0-beta.10

package/dist/cjs/components/popover/styles/keyframes.css

@@ -1,421 +1 @@
-/**
- * CSS animations for popover positioning
- * Each animation corresponds to a specific body position from positionStyles.ts
- */
-
-/* ========================================
-   CENTER POSITION ANIMATIONS
-   ======================================== */
-
-/* Center position - scales from center */
-@keyframes popover-enter-center {
-  from {
-    opacity: 0;
-    transform: translate(-50%, -50%) scale(0.8);
-  }
-  to {
-    opacity: 1;
-    transform: translate(-50%, -50%) scale(1);
-  }
-}
-
-@keyframes popover-exit-center {
-  from {
-    opacity: 1;
-    transform: translate(-50%, -50%) scale(1);
-  }
-  to {
-    opacity: 0;
-    transform: translate(-50%, -50%) scale(0.8);
-  }
-}
-
-/* ========================================
-   TOP POSITION ANIMATIONS
-   ======================================== */
-
-/* Top center - slides down and fades in */
-@keyframes popover-enter-top {
-  from {
-    opacity: 0;
-    transform: translateX(-50%) translateY(-20px);
-  }
-  to {
-    opacity: 1;
-    transform: translateX(-50%) translateY(0);
-  }
-}
-
-@keyframes popover-exit-top {
-  from {
-    opacity: 1;
-    transform: translateX(-50%) translateY(0);
-  }
-  to {
-    opacity: 0;
-    transform: translateX(-50%) translateY(-20px);
-  }
-}
-
-/* Top start (left) - slides down only (same as top) */
-@keyframes popover-enter-top-start {
-  from {
-    opacity: 0;
-    transform: translateY(-20px);
-  }
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-
-@keyframes popover-exit-top-start {
-  from {
-    opacity: 1;
-    transform: translateY(0);
-  }
-  to {
-    opacity: 0;
-    transform: translateY(-20px);
-  }
-}
-
-/* Top end (right) - slides down only (same as top) */
-@keyframes popover-enter-top-end {
-  from {
-    opacity: 0;
-    transform: translateY(-20px);
-  }
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-
-@keyframes popover-exit-top-end {
-  from {
-    opacity: 1;
-    transform: translateY(0);
-  }
-  to {
-    opacity: 0;
-    transform: translateY(-20px);
-  }
-}
-
-/* ========================================
-   BOTTOM POSITION ANIMATIONS
-   ======================================== */
-
-/* Bottom center - slides up and fades in */
-@keyframes popover-enter-bottom {
-  from {
-    opacity: 0;
-    transform: translateX(-50%) translateY(20px);
-  }
-  to {
-    opacity: 1;
-    transform: translateX(-50%) translateY(0);
-  }
-}
-
-@keyframes popover-exit-bottom {
-  from {
-    opacity: 1;
-    transform: translateX(-50%) translateY(0);
-  }
-  to {
-    opacity: 0;
-    transform: translateX(-50%) translateY(20px);
-  }
-}
-
-/* Bottom start (left) - slides up only (same as bottom) */
-@keyframes popover-enter-bottom-start {
-  from {
-    opacity: 0;
-    transform: translateY(20px);
-  }
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-
-@keyframes popover-exit-bottom-start {
-  from {
-    opacity: 1;
-    transform: translateY(0);
-  }
-  to {
-    opacity: 0;
-    transform: translateY(20px);
-  }
-}
-
-/* Bottom end (right) - slides up only (same as bottom) */
-@keyframes popover-enter-bottom-end {
-  from {
-    opacity: 0;
-    transform: translateY(20px);
-  }
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-
-@keyframes popover-exit-bottom-end {
-  from {
-    opacity: 1;
-    transform: translateY(0);
-  }
-  to {
-    opacity: 0;
-    transform: translateY(20px);
-  }
-}
-
-/* ========================================
-   LEFT POSITION ANIMATIONS
-   ======================================== */
-
-/* Left center - slides right and fades in */
-@keyframes popover-enter-left {
-  from {
-    opacity: 0;
-    transform: translateY(-50%) translateX(-20px);
-  }
-  to {
-    opacity: 1;
-    transform: translateY(-50%) translateX(0);
-  }
-}
-
-@keyframes popover-exit-left {
-  from {
-    opacity: 1;
-    transform: translateY(-50%) translateX(0);
-  }
-  to {
-    opacity: 0;
-    transform: translateY(-50%) translateX(-20px);
-  }
-}
-
-/* Left start (top) - slides right only (same as left) */
-@keyframes popover-enter-left-start {
-  from {
-    opacity: 0;
-    transform: translateX(-20px);
-  }
-  to {
-    opacity: 1;
-    transform: translateX(0);
-  }
-}
-
-@keyframes popover-exit-left-start {
-  from {
-    opacity: 1;
-    transform: translateX(0);
-  }
-  to {
-    opacity: 0;
-    transform: translateX(-20px);
-  }
-}
-
-/* Left end (bottom) - slides right only (same as left) */
-@keyframes popover-enter-left-end {
-  from {
-    opacity: 0;
-    transform: translateX(-20px);
-  }
-  to {
-    opacity: 1;
-    transform: translateX(0);
-  }
-}
-
-@keyframes popover-exit-left-end {
-  from {
-    opacity: 1;
-    transform: translateX(0);
-  }
-  to {
-    opacity: 0;
-    transform: translateX(-20px);
-  }
-}
-
-/* ========================================
-   RIGHT POSITION ANIMATIONS
-   ======================================== */
-
-/* Right center - slides left and fades in */
-@keyframes popover-enter-right {
-  from {
-    opacity: 0;
-    transform: translateY(-50%) translateX(20px);
-  }
-  to {
-    opacity: 1;
-    transform: translateY(-50%) translateX(0);
-  }
-}
-
-@keyframes popover-exit-right {
-  from {
-    opacity: 1;
-    transform: translateY(-50%) translateX(0);
-  }
-  to {
-    opacity: 0;
-    transform: translateY(-50%) translateX(20px);
-  }
-}
-
-/* Right start (top) - slides left only (same as right) */
-@keyframes popover-enter-right-start {
-  from {
-    opacity: 0;
-    transform: translateX(20px);
-  }
-  to {
-    opacity: 1;
-    transform: translateX(0);
-  }
-}
-
-@keyframes popover-exit-right-start {
-  from {
-    opacity: 1;
-    transform: translateX(0);
-  }
-  to {
-    opacity: 0;
-    transform: translateX(20px);
-  }
-}
-
-/* Right end (bottom) - slides left only (same as right) */
-@keyframes popover-enter-right-end {
-  from {
-    opacity: 0;
-    transform: translateX(20px);
-  }
-  to {
-    opacity: 1;
-    transform: translateX(0);
-  }
-}
-
-@keyframes popover-exit-right-end {
-  from {
-    opacity: 1;
-    transform: translateX(0);
-  }
-  to {
-    opacity: 0;
-    transform: translateX(20px);
-  }
-}
-
-/* ========================================
-   NOTE: No default animation needed
-   ======================================== */
-/* When no placement is specified, center animation is used as fallback */
-
-/* ========================================
-   UTILITY CLASSES FOR APPLYING ANIMATIONS
-   ======================================== */
-
-/* Animation duration and timing */
-.popover-animate {
-  animation-duration: 200ms;
-  animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
-  animation-fill-mode: forwards;
-}
-
-/* Enter animations by position */
-.popover-enter-center {
-  animation-name: popover-enter-center;
-}
-.popover-enter-top {
-  animation-name: popover-enter-top;
-}
-.popover-enter-top-start {
-  animation-name: popover-enter-top-start;
-}
-.popover-enter-top-end {
-  animation-name: popover-enter-top-end;
-}
-.popover-enter-bottom {
-  animation-name: popover-enter-bottom;
-}
-.popover-enter-bottom-start {
-  animation-name: popover-enter-bottom-start;
-}
-.popover-enter-bottom-end {
-  animation-name: popover-enter-bottom-end;
-}
-.popover-enter-left {
-  animation-name: popover-enter-left;
-}
-.popover-enter-left-start {
-  animation-name: popover-enter-left-start;
-}
-.popover-enter-left-end {
-  animation-name: popover-enter-left-end;
-}
-.popover-enter-right {
-  animation-name: popover-enter-right;
-}
-.popover-enter-right-start {
-  animation-name: popover-enter-right-start;
-}
-.popover-enter-right-end {
-  animation-name: popover-enter-right-end;
-}
-
-/* Exit animations by position */
-.popover-exit-center {
-  animation-name: popover-exit-center;
-}
-.popover-exit-top {
-  animation-name: popover-exit-top;
-}
-.popover-exit-top-start {
-  animation-name: popover-exit-top-start;
-}
-.popover-exit-top-end {
-  animation-name: popover-exit-top-end;
-}
-.popover-exit-bottom {
-  animation-name: popover-exit-bottom;
-}
-.popover-exit-bottom-start {
-  animation-name: popover-exit-bottom-start;
-}
-.popover-exit-bottom-end {
-  animation-name: popover-exit-bottom-end;
-}
-.popover-exit-left {
-  animation-name: popover-exit-left;
-}
-.popover-exit-left-start {
-  animation-name: popover-exit-left-start;
-}
-.popover-exit-left-end {
-  animation-name: popover-exit-left-end;
-}
-.popover-exit-right {
-  animation-name: popover-exit-right;
-}
-.popover-exit-right-start {
-  animation-name: popover-exit-right-start;
-}
-.popover-exit-right-end {
-  animation-name: popover-exit-right-end;
-}
+@keyframes popover-enter-center{0%{opacity:0;transform:translate(-50%,-50%) scale(.8)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes popover-exit-center{0%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-50%) scale(.8)}}@keyframes popover-enter-top{0%{opacity:0;transform:translateX(-50%) translateY(-20px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}@keyframes popover-exit-top{0%{opacity:1;transform:translateX(-50%) translateY(0)}to{opacity:0;transform:translateX(-50%) translateY(-20px)}}@keyframes popover-enter-top-start{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes popover-exit-top-start{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-20px)}}@keyframes popover-enter-top-end{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes popover-exit-top-end{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-20px)}}@keyframes popover-enter-bottom{0%{opacity:0;transform:translateX(-50%) translateY(20px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}@keyframes popover-exit-bottom{0%{opacity:1;transform:translateX(-50%) translateY(0)}to{opacity:0;transform:translateX(-50%) translateY(20px)}}@keyframes popover-enter-bottom-start{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes popover-exit-bottom-start{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(20px)}}@keyframes popover-enter-bottom-end{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes popover-exit-bottom-end{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(20px)}}@keyframes popover-enter-left{0%{opacity:0;transform:translateY(-50%) translateX(-20px)}to{opacity:1;transform:translateY(-50%) translateX(0)}}@keyframes popover-exit-left{0%{opacity:1;transform:translateY(-50%) translateX(0)}to{opacity:0;transform:translateY(-50%) translateX(-20px)}}@keyframes popover-enter-left-start{0%{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}@keyframes popover-exit-left-start{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-20px)}}@keyframes popover-enter-left-end{0%{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}@keyframes popover-exit-left-end{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-20px)}}@keyframes popover-enter-right{0%{opacity:0;transform:translateY(-50%) translateX(20px)}to{opacity:1;transform:translateY(-50%) translateX(0)}}@keyframes popover-exit-right{0%{opacity:1;transform:translateY(-50%) translateX(0)}to{opacity:0;transform:translateY(-50%) translateX(20px)}}@keyframes popover-enter-right-start{0%{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}@keyframes popover-exit-right-start{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(20px)}}@keyframes popover-enter-right-end{0%{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}@keyframes popover-exit-right-end{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(20px)}}.popover-animate{animation-duration:.2s;animation-fill-mode:forwards;animation-timing-function:cubic-bezier(.16,1,.3,1)}.popover-enter-center{animation-name:popover-enter-center}.popover-enter-top{animation-name:popover-enter-top}.popover-enter-top-start{animation-name:popover-enter-top-start}.popover-enter-top-end{animation-name:popover-enter-top-end}.popover-enter-bottom{animation-name:popover-enter-bottom}.popover-enter-bottom-start{animation-name:popover-enter-bottom-start}.popover-enter-bottom-end{animation-name:popover-enter-bottom-end}.popover-enter-left{animation-name:popover-enter-left}.popover-enter-left-start{animation-name:popover-enter-left-start}.popover-enter-left-end{animation-name:popover-enter-left-end}.popover-enter-right{animation-name:popover-enter-right}.popover-enter-right-start{animation-name:popover-enter-right-start}.popover-enter-right-end{animation-name:popover-enter-right-end}.popover-exit-center{animation-name:popover-exit-center}.popover-exit-top{animation-name:popover-exit-top}.popover-exit-top-start{animation-name:popover-exit-top-start}.popover-exit-top-end{animation-name:popover-exit-top-end}.popover-exit-bottom{animation-name:popover-exit-bottom}.popover-exit-bottom-start{animation-name:popover-exit-bottom-start}.popover-exit-bottom-end{animation-name:popover-exit-bottom-end}.popover-exit-left{animation-name:popover-exit-left}.popover-exit-left-start{animation-name:popover-exit-left-start}.popover-exit-left-end{animation-name:popover-exit-left-end}.popover-exit-right{animation-name:popover-exit-right}.popover-exit-right-start{animation-name:popover-exit-right-start}.popover-exit-right-end{animation-name:popover-exit-right-end}

package/dist/cjs/components/popover/styles/popover-arrow.css

@@ -1,42 +1 @@
-/* ============================================= */
-/* PopoverV2 Arrow Styles */
-/* ============================================= */
-
-/* Arrow base styles */
-[data-kbt-id='popover-arrow'] {
-  position: absolute;
-  transform: rotate(45deg);
-  z-index: -1;
-}
-
-/* Arrow positioning based on placement */
-[data-kbt-id='popover-arrow'][data-kbt-placement^='top'] {
-  bottom: calc(-1 * var(--arrow-size, 8px) / 2);
-  left: 50%;
-  transform: translateX(-50%) rotate(45deg);
-}
-
-[data-kbt-id='popover-arrow'][data-kbt-placement^='bottom'] {
-  top: calc(-1 * var(--arrow-size, 8px) / 2);
-  left: 50%;
-  transform: translateX(-50%) rotate(45deg);
-}
-
-[data-kbt-id='popover-arrow'][data-kbt-placement^='left'] {
-  right: calc(-1 * var(--arrow-size, 8px) / 2);
-  top: 50%;
-  transform: translateY(-50%) rotate(45deg);
-}
-
-[data-kbt-id='popover-arrow'][data-kbt-placement^='right'] {
-  left: calc(-1 * var(--arrow-size, 8px) / 2);
-  top: 50%;
-  transform: translateY(-50%) rotate(45deg);
-}
-
-/* Center placement arrow - default to bottom position */
-[data-kbt-id='popover-arrow'][data-kbt-placement='center'] {
-  top: calc(-1 * var(--arrow-size, 8px) / 2);
-  left: 50%;
-  transform: translateX(-50%) rotate(45deg);
-}
+[data-kbt-id=popover-arrow]{position:absolute;transform:rotate(45deg);z-index:-1}[data-kbt-id=popover-arrow][data-kbt-placement^=top]{bottom:calc(var(--arrow-size, 8px)*-1/2);left:50%;transform:translateX(-50%) rotate(45deg)}[data-kbt-id=popover-arrow][data-kbt-placement^=bottom]{left:50%;top:calc(var(--arrow-size, 8px)*-1/2);transform:translateX(-50%) rotate(45deg)}[data-kbt-id=popover-arrow][data-kbt-placement^=left]{right:calc(var(--arrow-size, 8px)*-1/2);top:50%;transform:translateY(-50%) rotate(45deg)}[data-kbt-id=popover-arrow][data-kbt-placement^=right]{left:calc(var(--arrow-size, 8px)*-1/2);top:50%;transform:translateY(-50%) rotate(45deg)}[data-kbt-id=popover-arrow][data-kbt-placement=center]{left:50%;top:calc(var(--arrow-size, 8px)*-1/2);transform:translateX(-50%) rotate(45deg)}

package/dist/cjs/components/popover/styles/popover.css

@@ -1,189 +1 @@
-/**
- * PopoverV2 Main Styles
- * Contains animation logic and positioning styles
- */
-
-/* Import all animation keyframes */
-@import './keyframes.css';
-
-/* Popover Animation Styles */
-/* ============================================= */
-
-/* Base animation properties - ALWAYS applied (even with disableAnimations=true) */
-/* This allows additionalClasses to work properly */
-[data-kbt-id='popover'][data-kbt-placement] {
-  animation-duration: 500ms;
-  animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
-  animation-fill-mode: forwards;
-  animation-iteration-count: 1;
-}
-
-/* Opening animations based on placement - ONLY when animations are enabled */
-[data-kbt-id='popover'][data-kbt-closing='false']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  --animation-prefix: 'popover-enter-';
-}
-
-[data-kbt-id='popover'][data-kbt-placement='center'][data-kbt-closing='false']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: popover-enter-center;
-}
-
-[data-kbt-id='popover'][data-kbt-placement^='top'][data-kbt-closing='false']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: var(--animation-name, popover-enter-top);
-}
-
-[data-kbt-id='popover'][data-kbt-placement='top-start'][data-kbt-closing='false']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: popover-enter-top-start;
-}
-
-[data-kbt-id='popover'][data-kbt-placement='top-end'][data-kbt-closing='false']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: popover-enter-top-end;
-}
-
-[data-kbt-id='popover'][data-kbt-placement^='bottom'][data-kbt-closing='false']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: var(--animation-name, popover-enter-bottom);
-}
-
-[data-kbt-id='popover'][data-kbt-placement='bottom-start'][data-kbt-closing='false']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: popover-enter-bottom-start;
-}
-
-[data-kbt-id='popover'][data-kbt-placement='bottom-end'][data-kbt-closing='false']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: popover-enter-bottom-end;
-}
-
-[data-kbt-id='popover'][data-kbt-placement^='left'][data-kbt-closing='false']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: var(--animation-name, popover-enter-left);
-}
-
-[data-kbt-id='popover'][data-kbt-placement='left-start'][data-kbt-closing='false']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: popover-enter-left-start;
-}
-
-[data-kbt-id='popover'][data-kbt-placement='left-end'][data-kbt-closing='false']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: popover-enter-left-end;
-}
-
-[data-kbt-id='popover'][data-kbt-placement^='right'][data-kbt-closing='false']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: var(--animation-name, popover-enter-right);
-}
-
-[data-kbt-id='popover'][data-kbt-placement='right-start'][data-kbt-closing='false']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: popover-enter-right-start;
-}
-
-[data-kbt-id='popover'][data-kbt-placement='right-end'][data-kbt-closing='false']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: popover-enter-right-end;
-}
-
-/* Closing animations based on placement - ONLY when animations are enabled */
-[data-kbt-id='popover'][data-kbt-closing='true']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  --animation-prefix: 'popover-exit-';
-}
-
-[data-kbt-id='popover'][data-kbt-placement='center'][data-kbt-closing='true']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: popover-exit-center;
-}
-
-[data-kbt-id='popover'][data-kbt-placement^='top'][data-kbt-closing='true']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: var(--exit-animation-name, popover-exit-top);
-}
-
-[data-kbt-id='popover'][data-kbt-placement='top-start'][data-kbt-closing='true']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: popover-exit-top-start;
-}
-
-[data-kbt-id='popover'][data-kbt-placement='top-end'][data-kbt-closing='true']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: popover-exit-top-end;
-}
-
-[data-kbt-id='popover'][data-kbt-placement^='bottom'][data-kbt-closing='true']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: var(--exit-animation-name, popover-exit-bottom);
-}
-
-[data-kbt-id='popover'][data-kbt-placement='bottom-start'][data-kbt-closing='true']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: popover-exit-bottom-start;
-}
-
-[data-kbt-id='popover'][data-kbt-placement='bottom-end'][data-kbt-closing='true']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: popover-exit-bottom-end;
-}
-
-[data-kbt-id='popover'][data-kbt-placement^='left'][data-kbt-closing='true']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: var(--exit-animation-name, popover-exit-left);
-}
-
-[data-kbt-id='popover'][data-kbt-placement='left-start'][data-kbt-closing='true']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: popover-exit-left-start;
-}
-
-[data-kbt-id='popover'][data-kbt-placement='left-end'][data-kbt-closing='true']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: popover-exit-left-end;
-}
-
-[data-kbt-id='popover'][data-kbt-placement^='right'][data-kbt-closing='true']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: var(--exit-animation-name, popover-exit-right);
-}
-
-[data-kbt-id='popover'][data-kbt-placement='right-start'][data-kbt-closing='true']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: popover-exit-right-start;
-}
-
-[data-kbt-id='popover'][data-kbt-placement='right-end'][data-kbt-closing='true']:not(
-    [data-kbt-disable-animations='true']
-  ) {
-  animation-name: popover-exit-right-end;
-}
+@import "./keyframes.css";[data-kbt-id=popover][data-kbt-placement]{animation-duration:.5s;animation-fill-mode:forwards;animation-iteration-count:1;animation-timing-function:cubic-bezier(.16,1,.3,1)}[data-kbt-id=popover][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){--animation-prefix:"popover-enter-"}[data-kbt-id=popover][data-kbt-placement=center][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:popover-enter-center}[data-kbt-id=popover][data-kbt-placement^=top][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:var(--animation-name,popover-enter-top)}[data-kbt-id=popover][data-kbt-placement=top-start][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:popover-enter-top-start}[data-kbt-id=popover][data-kbt-placement=top-end][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:popover-enter-top-end}[data-kbt-id=popover][data-kbt-placement^=bottom][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:var(--animation-name,popover-enter-bottom)}[data-kbt-id=popover][data-kbt-placement=bottom-start][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:popover-enter-bottom-start}[data-kbt-id=popover][data-kbt-placement=bottom-end][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:popover-enter-bottom-end}[data-kbt-id=popover][data-kbt-placement^=left][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:var(--animation-name,popover-enter-left)}[data-kbt-id=popover][data-kbt-placement=left-start][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:popover-enter-left-start}[data-kbt-id=popover][data-kbt-placement=left-end][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:popover-enter-left-end}[data-kbt-id=popover][data-kbt-placement^=right][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:var(--animation-name,popover-enter-right)}[data-kbt-id=popover][data-kbt-placement=right-start][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:popover-enter-right-start}[data-kbt-id=popover][data-kbt-placement=right-end][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:popover-enter-right-end}[data-kbt-id=popover][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){--animation-prefix:"popover-exit-"}[data-kbt-id=popover][data-kbt-placement=center][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:popover-exit-center}[data-kbt-id=popover][data-kbt-placement^=top][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:var(--exit-animation-name,popover-exit-top)}[data-kbt-id=popover][data-kbt-placement=top-start][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:popover-exit-top-start}[data-kbt-id=popover][data-kbt-placement=top-end][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:popover-exit-top-end}[data-kbt-id=popover][data-kbt-placement^=bottom][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:var(--exit-animation-name,popover-exit-bottom)}[data-kbt-id=popover][data-kbt-placement=bottom-start][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:popover-exit-bottom-start}[data-kbt-id=popover][data-kbt-placement=bottom-end][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:popover-exit-bottom-end}[data-kbt-id=popover][data-kbt-placement^=left][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:var(--exit-animation-name,popover-exit-left)}[data-kbt-id=popover][data-kbt-placement=left-start][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:popover-exit-left-start}[data-kbt-id=popover][data-kbt-placement=left-end][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:popover-exit-left-end}[data-kbt-id=popover][data-kbt-placement^=right][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:var(--exit-animation-name,popover-exit-right)}[data-kbt-id=popover][data-kbt-placement=right-start][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:popover-exit-right-start}[data-kbt-id=popover][data-kbt-placement=right-end][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:popover-exit-right-end}

package/dist/cjs/components/radioButton/radioButtonStandAlone.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../_virtual/jsx-runtime.js"),s=require("../label/labelStandAlone.js"),r=require("../renderIf/renderIf.js"),t=require("../text/text.js"),i=require("../../lib/hooks/useId/useId.js"),a=require("../../lib/utils/classNames/classNames.js"),n=require("../../lib/utils/pickCustomAttributes/pickCustomAttributes.js"),o=require("../../lib/utils/process/processText/processText.js"),l=require("../elementOrIcon/elementOrIcon.js"),d=require("./utils/aria.utils.js");exports.RadioButtonStandAlone=({altVariant:c=!1,checked:u,cssClasses:x,disabled:m,error:j,errorAriaLiveType:b,errorIcon:p,errorMessage:R,id:h,label:I,lastChild:E,name:g,onBlur:v,onChange:N,screenReaderId:T,state:f,subTitle:y,tabIndex:A,value:C,...q})=>{let k=i.useId("RadioButton");k=h??k;const B=o.processText(y).id&&`${k}__description`,_=R&&`${k}__error`,S={"data-state":f},M=n.pickCustomAttributes(S),O=q["data-testid"]??"radio-button";return e.jsxRuntimeExports.jsxs("div",{className:x?.rowcontainer,"data-testid":O,...M,style:{display:I?"grid":"block",marginBottom:E?0:void 0},children:[e.jsxRuntimeExports.jsx("div",{...M,className:x?.radiobuttoncontainer,children:e.jsxRuntimeExports.jsx("input",{"aria-describedby":d.buildAriaLabelledBy({descriptionId:B,error:j,errorMessage:R,errorMessageId:_,screenReaderId:T}),"aria-hidden":q["aria-hidden"],"aria-label":q["aria-label"],"aria-labelledby":q["aria-labelledby"],checked:u,className:a.classNames(x?.radio_button,{"global-focus-visible":!!c}),"data-testid":`${O}-input`,disabled:m,id:k,name:g,tabIndex:A,type:"radio",value:C,onBlur:v,onChange:N,...M})}),e.jsxRuntimeExports.jsxs("div",{className:x?.infocontainer,children:[e.jsxRuntimeExports.jsx(r.RenderIf,{condition:!!I?.content,children:e.jsxRuntimeExports.jsx("div",{className:x?.labelcontainer,children:e.jsxRuntimeExports.jsx(s.LabelStandAlone,{cursor:m?"default":"pointer",customAttributes:S,inputId:k,textCssClasses:a.classNames(x?.label,{[`${x?.speciallabel}`]:!!y}),...I,children:I?.content})})}),e.jsxRuntimeExports.jsx(r.RenderIf,{condition:!!o.processText(y).children,children:"string"==typeof o.processText(y)?e.jsxRuntimeExports.jsx(t.Text,{additionalClasses:{text:x?.sublabel},...o.processText(y),id:B}):e.jsxRuntimeExports.jsx("div",{id:B,children:o.processText(y).children})}),e.jsxRuntimeExports.jsx(r.RenderIf,{condition:!(!j||!R),children:e.jsxRuntimeExports.jsx("div",{"aria-live":b,className:x?.errormessagecontainer,id:_,...M,children:e.jsxRuntimeExports.jsxs(t.Text,{additionalClasses:{text:x?.errormessage},customAttributes:S,children:[e.jsxRuntimeExports.jsx(r.RenderIf,{condition:!!p,children:e.jsxRuntimeExports.jsx("span",{...M,className:x?.errormessageiconcontainer,children:e.jsxRuntimeExports.jsx(l.ElementOrIcon,{className:x?.errormessageicon,customAttributes:S,...p})})}),R]})})})]})]})};
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../_virtual/jsx-runtime.js"),s=require("react"),t=require("../label/labelStandAlone.js"),r=require("../text/text.js"),i=require("../../lib/components/elementOrIcon/elementOrIcon.js"),a=require("../../lib/utils/classNames/classNames.js"),l=require("../../lib/utils/pickCustomAttributes/pickCustomAttributes.js"),o=require("../../lib/utils/process/processText/processText.js"),n=require("./utils/aria.utils.js");exports.RadioButtonStandAlone=({altVariant:d=!1,checked:c,cssClasses:u,disabled:x,error:m,errorAriaLiveType:b,errorIcon:p,errorMessage:j,id:h,label:g,lastChild:R,name:v,onBlur:E,onChange:I,screenReaderId:N,state:T,subTitle:y,tabIndex:A,value:C,...q})=>{let k=`radiobutton-${s.useId().replace(/:/g,"")}`;k=h??k;const _=o.processText(y).id&&`${k}__description`,f=j&&`${k}__error`,B={"data-state":T},S=l.pickCustomAttributes(B),$=q["data-testid"]??"radio-button";return e.jsxRuntimeExports.jsxs("div",{className:u?.rowcontainer,"data-testid":$,...S,style:{display:g?"grid":"block",marginBottom:R?0:void 0},children:[e.jsxRuntimeExports.jsx("div",{...S,className:u?.radiobuttoncontainer,children:e.jsxRuntimeExports.jsx("input",{"aria-describedby":n.buildAriaLabelledBy({descriptionId:_,error:m,errorMessage:j,errorMessageId:f,screenReaderId:N}),"aria-hidden":q["aria-hidden"],"aria-label":q["aria-label"],"aria-labelledby":q["aria-labelledby"],checked:c,className:a.classNames(u?.radio_button,{"global-focus-visible":!!d}),"data-testid":`${$}-input`,disabled:x,id:k,name:v,tabIndex:A,type:"radio",value:C,onBlur:E,onChange:I,...S})}),e.jsxRuntimeExports.jsxs("div",{className:u?.infocontainer,children:[!!g?.content&&e.jsxRuntimeExports.jsx("div",{className:u?.labelcontainer,children:e.jsxRuntimeExports.jsx(t.LabelStandAlone,{cursor:x?"default":"pointer",customAttributes:B,inputId:k,textCssClasses:a.classNames(u?.label,{[`${u?.speciallabel}`]:!!y}),...g,children:g?.content})}),!!o.processText(y).children&&("string"==typeof o.processText(y)?e.jsxRuntimeExports.jsx(r.Text,{additionalClasses:{text:u?.sublabel},...o.processText(y),id:_}):e.jsxRuntimeExports.jsx("div",{id:_,children:o.processText(y).children})),!(!m||!j)&&e.jsxRuntimeExports.jsx("div",{"aria-live":b,className:u?.errormessagecontainer,id:f,...S,children:e.jsxRuntimeExports.jsxs(r.Text,{additionalClasses:{text:u?.errormessage},customAttributes:B,children:[!!p&&e.jsxRuntimeExports.jsx("span",{...S,className:u?.errormessageiconcontainer,children:e.jsxRuntimeExports.jsx(i.ElementOrIcon,{className:u?.errormessageicon,customAttributes:B,...p})}),j]})})]})]})};