@sunggang/ui-lib 0.1.35 → 0.1.38

package/index.esm.css

@@ -1413,134 +1413,170 @@ video {
   animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
 }
 
-@import url('react-date-range/dist/styles.css');
-@import url('react-date-range/dist/theme/default.css');
 /* gary */
+
 .first\:rounded-l-md:first-child {
   border-top-left-radius: calc(var(--radius) - 2px);
   border-bottom-left-radius: calc(var(--radius) - 2px);
 }
+
 .first\:border-l:first-child {
   border-left-width: 1px;
 }
+
 .last\:rounded-r-md:last-child {
   border-top-right-radius: calc(var(--radius) - 2px);
   border-bottom-right-radius: calc(var(--radius) - 2px);
 }
+
 .focus-within\:relative:focus-within {
   position: relative;
 }
+
 .focus-within\:z-20:focus-within {
   z-index: 20;
 }
+
 .hover\:bg-\[\#000\]:hover {
   --tw-bg-opacity: 1;
   background-color: rgb(0 0 0 / var(--tw-bg-opacity));
 }
+
 .hover\:bg-\[\#D9D9D9\]:hover {
   --tw-bg-opacity: 1;
   background-color: rgb(217 217 217 / var(--tw-bg-opacity));
 }
+
 .hover\:bg-accent:hover {
   background-color: hsl(var(--accent));
 }
+
 .hover\:bg-destructive\/90:hover {
   background-color: hsl(var(--destructive) / 0.9);
 }
+
 .hover\:bg-primary\/90:hover {
   background-color: hsl(var(--primary) / 0.9);
 }
+
 .hover\:bg-secondary\/80:hover {
   background-color: hsl(var(--secondary) / 0.8);
 }
+
 .hover\:text-\[\#fff\]:hover {
   --tw-text-opacity: 1;
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }
+
 .hover\:text-accent-foreground:hover {
   color: hsl(var(--accent-foreground));
 }
+
 .hover\:underline:hover {
   text-decoration-line: underline;
 }
+
 .hover\:opacity-100:hover {
   opacity: 1;
 }
+
 .focus\:bg-\[\#000\]:focus {
   --tw-bg-opacity: 1;
   background-color: rgb(0 0 0 / var(--tw-bg-opacity));
 }
+
 .focus\:text-\[\#fff\]:focus {
   --tw-text-opacity: 1;
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }
+
 .focus-visible\:outline-none:focus-visible {
   outline: 2px solid transparent;
   outline-offset: 2px;
 }
+
 .focus-visible\:ring-1:focus-visible {
   --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
   --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
   box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
 }
+
 .focus-visible\:ring-2:focus-visible {
   --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
   --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
   box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
 }
+
 .focus-visible\:ring-ring:focus-visible {
   --tw-ring-color: hsl(var(--ring));
 }
+
 .focus-visible\:ring-offset-2:focus-visible {
   --tw-ring-offset-width: 2px;
 }
+
 .focus-visible\:ring-offset-background:focus-visible {
   --tw-ring-offset-color: hsl(var(--background));
 }
+
 .disabled\:pointer-events-none:disabled {
   pointer-events: none;
 }
+
 .disabled\:cursor-not-allowed:disabled {
   cursor: not-allowed;
 }
+
 .disabled\:opacity-50:disabled {
   opacity: 0.5;
 }
+
 .has-\[\:disabled\]\:opacity-50:has(:disabled) {
   opacity: 0.5;
 }
+
 .aria-selected\:bg-accent[aria-selected="true"] {
   background-color: hsl(var(--accent));
 }
+
 .aria-selected\:bg-accent\/50[aria-selected="true"] {
   background-color: hsl(var(--accent) / 0.5);
 }
+
 .aria-selected\:text-accent-foreground[aria-selected="true"] {
   color: hsl(var(--accent-foreground));
 }
+
 .aria-selected\:text-muted-foreground[aria-selected="true"] {
   color: hsl(var(--muted-foreground));
 }
+
 .aria-selected\:opacity-100[aria-selected="true"] {
   opacity: 1;
 }
+
 .aria-selected\:opacity-30[aria-selected="true"] {
   opacity: 0.3;
 }
+
 .data-\[state\=checked\]\:translate-x-4[data-state=checked] {
   --tw-translate-x: 1rem;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
+
 .data-\[state\=unchecked\]\:translate-x-0[data-state=unchecked] {
   --tw-translate-x: 0px;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
+
 .data-\[state\=checked\]\:bg-primary[data-state=checked] {
   background-color: hsl(var(--primary));
 }
+
 .data-\[state\=unchecked\]\:bg-input[data-state=unchecked] {
   background-color: hsl(var(--input));
 }
+
 .data-\[state\=open\]\:animate-in[data-state=open] {
   animation-name: enter;
   animation-duration: 150ms;
@@ -1550,6 +1586,7 @@ video {
   --tw-enter-translate-x: initial;
   --tw-enter-translate-y: initial;
 }
+
 .data-\[state\=closed\]\:animate-out[data-state=closed] {
   animation-name: exit;
   animation-duration: 150ms;
@@ -1559,30 +1596,39 @@ video {
   --tw-exit-translate-x: initial;
   --tw-exit-translate-y: initial;
 }
+
 .data-\[state\=closed\]\:fade-out-0[data-state=closed] {
   --tw-exit-opacity: 0;
 }
+
 .data-\[state\=open\]\:fade-in-0[data-state=open] {
   --tw-enter-opacity: 0;
 }
+
 .data-\[state\=closed\]\:zoom-out-95[data-state=closed] {
   --tw-exit-scale: .95;
 }
+
 .data-\[state\=open\]\:zoom-in-95[data-state=open] {
   --tw-enter-scale: .95;
 }
+
 .data-\[side\=bottom\]\:slide-in-from-top-2[data-side=bottom] {
   --tw-enter-translate-y: -0.5rem;
 }
+
 .data-\[side\=left\]\:slide-in-from-right-2[data-side=left] {
   --tw-enter-translate-x: 0.5rem;
 }
+
 .data-\[side\=right\]\:slide-in-from-left-2[data-side=right] {
   --tw-enter-translate-x: -0.5rem;
 }
+
 .data-\[side\=top\]\:slide-in-from-bottom-2[data-side=top] {
   --tw-enter-translate-y: 0.5rem;
 }
+
 @media (min-width: 640px) {
 
   .sm\:flex-row {
@@ -1601,6 +1647,7 @@ video {
     margin-bottom: calc(0px * var(--tw-space-y-reverse));
   }
 }
+
 @media (min-width: 1024px) {
 
   .lg\:flex {
@@ -1612,31 +1659,39 @@ video {
     padding-right: 2rem;
   }
 }
+
 .\[\&\:has\(\>\.day-range-end\)\]\:rounded-r-md:has(>.day-range-end) {
   border-top-right-radius: calc(var(--radius) - 2px);
   border-bottom-right-radius: calc(var(--radius) - 2px);
 }
+
 .\[\&\:has\(\>\.day-range-start\)\]\:rounded-l-md:has(>.day-range-start) {
   border-top-left-radius: calc(var(--radius) - 2px);
   border-bottom-left-radius: calc(var(--radius) - 2px);
 }
+
 .\[\&\:has\(\[aria-selected\]\)\]\:rounded-md:has([aria-selected]) {
   border-radius: calc(var(--radius) - 2px);
 }
+
 .\[\&\:has\(\[aria-selected\]\)\]\:bg-accent:has([aria-selected]) {
   background-color: hsl(var(--accent));
 }
+
 .first\:\[\&\:has\(\[aria-selected\]\)\]\:rounded-l-md:has([aria-selected]):first-child {
   border-top-left-radius: calc(var(--radius) - 2px);
   border-bottom-left-radius: calc(var(--radius) - 2px);
 }
+
 .last\:\[\&\:has\(\[aria-selected\]\)\]\:rounded-r-md:has([aria-selected]):last-child {
   border-top-right-radius: calc(var(--radius) - 2px);
   border-bottom-right-radius: calc(var(--radius) - 2px);
 }
+
 .\[\&\:has\(\[aria-selected\]\.day-outside\)\]\:bg-accent\/50:has([aria-selected].day-outside) {
   background-color: hsl(var(--accent) / 0.5);
 }
+
 .\[\&\:has\(\[aria-selected\]\.day-range-end\)\]\:rounded-r-md:has([aria-selected].day-range-end) {
   border-top-right-radius: calc(var(--radius) - 2px);
   border-bottom-right-radius: calc(var(--radius) - 2px);
@@ -1649,3 +1704,583 @@ video {
  * .container {
  * }
 */
+
+.rdrCalendarWrapper{
+  color: #000000;
+  font-size: 12px;
+}
+
+.rdrDateDisplayWrapper{
+  background-color: rgb(239, 242, 247);
+}
+
+.rdrDateDisplay{
+  margin: 0.833em;
+}
+
+.rdrDateDisplayItem{
+  border-radius: 4px;
+  background-color: rgb(255, 255, 255);
+  box-shadow: 0 1px 2px 0 rgba(35, 57, 66, 0.21);
+  border: 1px solid transparent;
+}
+
+.rdrDateDisplayItem input{
+    cursor: pointer;
+    height: 2.5em;
+    line-height: 2.5em;
+    border: 0px;
+    background: transparent;
+    width: 100%;
+    color: #849095;
+  }
+
+.rdrDateDisplayItemActive{
+  border-color: currentColor;
+}
+
+.rdrDateDisplayItemActive input{
+    color: #7d888d
+  }
+
+.rdrMonthAndYearWrapper {
+  align-items: center;
+  height: 60px;
+  padding-top: 10px;
+}
+
+.rdrMonthAndYearPickers{
+  font-weight: 600;
+}
+
+.rdrMonthAndYearPickers select{
+    -moz-appearance: none;
+         appearance: none;
+    -webkit-appearance: none;
+    border: 0;
+    background: transparent;
+    padding: 10px 30px 10px 10px;
+    border-radius: 4px;
+    outline: 0;
+    color: #3e484f;
+    background: url("data:image/svg+xml;utf8,<svg width='9px' height='6px' viewBox='0 0 9 6' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'><g id='Artboard' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' transform='translate(-636.000000, -171.000000)' fill-opacity='0.368716033'><g id='input' transform='translate(172.000000, 37.000000)' fill='%230E242F' fill-rule='nonzero'><g id='Group-9' transform='translate(323.000000, 127.000000)'><path d='M142.280245,7.23952813 C141.987305,6.92353472 141.512432,6.92361662 141.219585,7.23971106 C140.926739,7.5558055 140.926815,8.06821394 141.219755,8.38420735 L145.498801,13 L149.780245,8.38162071 C150.073185,8.0656273 150.073261,7.55321886 149.780415,7.23712442 C149.487568,6.92102998 149.012695,6.92094808 148.719755,7.23694149 L145.498801,10.7113732 L142.280245,7.23952813 Z' id='arrow'></path></g></g></g></svg>") no-repeat;
+    background-position: right 8px center;
+    cursor: pointer;
+    text-align: center
+  }
+
+.rdrMonthAndYearPickers select:hover{
+      background-color: rgba(0,0,0,0.07);
+    }
+
+.rdrMonthPicker, .rdrYearPicker{
+  margin: 0 5px
+}
+
+.rdrNextPrevButton {
+  display: block;
+  width: 24px;
+  height: 24px;
+  margin: 0 0.833em;
+  padding: 0;
+  border: 0;
+  border-radius: 5px;
+  background: #EFF2F7
+}
+
+.rdrNextPrevButton:hover{
+    background: #E1E7F0;
+  }
+
+.rdrNextPrevButton i {
+    display: block;
+    width: 0;
+    height: 0;
+    padding: 0;
+    text-align: center;
+    border-style: solid;
+    margin: auto;
+    transform: translate(-3px, 0px);
+  }
+
+.rdrPprevButton i {
+    border-width: 4px 6px 4px 4px;
+    border-color: transparent rgb(52, 73, 94) transparent transparent;
+    transform: translate(-3px, 0px);
+  }
+
+.rdrNextButton i {
+    margin: 0 0 0 7px;
+    border-width: 4px 4px 4px 6px;
+    border-color: transparent transparent transparent rgb(52, 73, 94);
+    transform: translate(3px, 0px);
+  }
+
+.rdrWeekDays {
+  padding: 0 0.833em;
+}
+
+.rdrMonth{
+  padding: 0 0.833em 1.666em 0.833em;
+}
+
+.rdrMonth .rdrWeekDays {
+    padding: 0;
+  }
+
+.rdrMonths.rdrMonthsVertical .rdrMonth:first-child .rdrMonthName{
+  display: none;
+}
+
+.rdrWeekDay {
+  font-weight: 400;
+  line-height: 2.667em;
+  color: rgb(132, 144, 149);
+}
+
+.rdrDay {
+  background: transparent;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+  border: 0;
+  padding: 0;
+  line-height: 3.000em;
+  height: 3.000em;
+  text-align: center;
+  color: #1d2429
+}
+
+.rdrDay:focus {
+    outline: 0;
+  }
+
+.rdrDayNumber {
+  outline: 0;
+  font-weight: 300;
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  top: 5px;
+  bottom: 5px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.rdrDayToday .rdrDayNumber span{
+  font-weight: 500
+}
+
+.rdrDayToday .rdrDayNumber span:after{
+    content: '';
+    position: absolute;
+    bottom: 4px;
+    left: 50%;
+    transform: translate(-50%, 0);
+    width: 18px;
+    height: 2px;
+    border-radius: 2px;
+    background: #3d91ff;
+  }
+
+.rdrDayToday:not(.rdrDayPassive) .rdrInRange ~ .rdrDayNumber span:after,.rdrDayToday:not(.rdrDayPassive) .rdrStartEdge ~ .rdrDayNumber span:after,.rdrDayToday:not(.rdrDayPassive) .rdrEndEdge ~ .rdrDayNumber span:after,.rdrDayToday:not(.rdrDayPassive) .rdrSelected ~ .rdrDayNumber span:after{
+      background: #fff;
+    }
+
+.rdrDay:not(.rdrDayPassive) .rdrInRange ~ .rdrDayNumber span,.rdrDay:not(.rdrDayPassive) .rdrStartEdge ~ .rdrDayNumber span,.rdrDay:not(.rdrDayPassive) .rdrEndEdge ~ .rdrDayNumber span,.rdrDay:not(.rdrDayPassive) .rdrSelected ~ .rdrDayNumber span{
+          color: rgba(255, 255, 255, 0.85);
+        }
+
+.rdrSelected, .rdrInRange, .rdrStartEdge, .rdrEndEdge{
+  background: currentColor;
+  position: absolute;
+  top: 5px;
+  left: 0;
+  right: 0;
+  bottom: 5px;
+}
+
+.rdrSelected{
+  left: 2px;
+  right: 2px;
+}
+
+.rdrInRange{}
+
+.rdrStartEdge{
+  border-top-left-radius: 1.042em;
+  border-bottom-left-radius: 1.042em;
+  left: 2px;
+}
+
+.rdrEndEdge{
+  border-top-right-radius: 1.042em;
+  border-bottom-right-radius: 1.042em;
+  right: 2px;
+}
+
+.rdrSelected{
+  border-radius: 1.042em;
+}
+
+.rdrDayStartOfMonth .rdrInRange, .rdrDayStartOfMonth .rdrEndEdge, .rdrDayStartOfWeek .rdrInRange, .rdrDayStartOfWeek .rdrEndEdge{
+    border-top-left-radius: 1.042em;
+    border-bottom-left-radius: 1.042em;
+    left: 2px;
+  }
+
+.rdrDayEndOfMonth .rdrInRange,  .rdrDayEndOfMonth .rdrStartEdge,  .rdrDayEndOfWeek .rdrInRange,  .rdrDayEndOfWeek .rdrStartEdge{
+    border-top-right-radius: 1.042em;
+    border-bottom-right-radius: 1.042em;
+    right: 2px;
+  }
+
+.rdrDayStartOfMonth .rdrDayInPreview, .rdrDayStartOfMonth .rdrDayEndPreview, .rdrDayStartOfWeek .rdrDayInPreview, .rdrDayStartOfWeek .rdrDayEndPreview{
+    border-top-left-radius: 1.333em;
+    border-bottom-left-radius: 1.333em;
+    border-left-width: 1px;
+    left: 0px;
+  }
+
+.rdrDayEndOfMonth .rdrDayInPreview, .rdrDayEndOfMonth .rdrDayStartPreview, .rdrDayEndOfWeek .rdrDayInPreview, .rdrDayEndOfWeek .rdrDayStartPreview{
+   border-top-right-radius: 1.333em;
+   border-bottom-right-radius: 1.333em;
+   border-right-width: 1px;
+   right: 0px;
+ }
+
+.rdrDayStartPreview, .rdrDayInPreview, .rdrDayEndPreview{
+  background: rgba(255, 255, 255, 0.09);
+  position: absolute;
+  top: 3px;
+  left: 0px;
+  right: 0px;
+  bottom: 3px;
+  pointer-events: none;
+  border: 0px solid currentColor;
+  z-index: 1;
+}
+
+.rdrDayStartPreview{
+  border-top-width: 1px;
+  border-left-width: 1px;
+  border-bottom-width: 1px;
+  border-top-left-radius: 1.333em;
+  border-bottom-left-radius: 1.333em;
+  left: 0px;
+}
+
+.rdrDayInPreview{
+  border-top-width: 1px;
+  border-bottom-width: 1px;
+}
+
+.rdrDayEndPreview{
+  border-top-width: 1px;
+  border-right-width: 1px;
+  border-bottom-width: 1px;
+  border-top-right-radius: 1.333em;
+  border-bottom-right-radius: 1.333em;
+  right: 0px;
+}
+
+.rdrDefinedRangesWrapper{
+  font-size: 12px;
+  width: 226px;
+  border-right: solid 1px #eff2f7;
+  background: #fff;
+}
+
+.rdrDefinedRangesWrapper .rdrStaticRangeSelected{
+    color: currentColor;
+    font-weight: 600;
+  }
+
+.rdrStaticRange{
+  border: 0;
+  cursor: pointer;
+  display: block;
+  outline: 0;
+  border-bottom: 1px solid #eff2f7;
+  padding: 0;
+  background: #fff
+}
+
+.rdrStaticRange:hover .rdrStaticRangeLabel,.rdrStaticRange:focus .rdrStaticRangeLabel{
+      background: #eff2f7;
+    }
+
+.rdrStaticRangeLabel{
+  display: block;
+  outline: 0;
+  line-height: 18px;
+  padding: 10px 20px;
+  text-align: left;
+}
+
+.rdrInputRanges{
+  padding: 10px 0;
+}
+
+.rdrInputRange{
+  align-items: center;
+  padding: 5px 20px;
+}
+
+.rdrInputRangeInput{
+  width: 30px;
+  height: 30px;
+  line-height: 30px;
+  border-radius: 4px;
+  text-align: center;
+  border: solid 1px rgb(222, 231, 235);
+  margin-right: 10px;
+  color: rgb(108, 118, 122)
+}
+
+.rdrInputRangeInput:focus, .rdrInputRangeInput:hover{
+    border-color: rgb(180, 191, 196);
+    outline: 0;
+    color: #333;
+  }
+
+.rdrCalendarWrapper:not(.rdrDateRangeWrapper) .rdrDayHovered .rdrDayNumber:after{
+  content: '';
+  border: 1px solid currentColor;
+  border-radius: 1.333em;
+  position: absolute;
+  top: -2px;
+  bottom: -2px;
+  left: 0px;
+  right: 0px;
+  background: transparent;
+}
+
+.rdrDayPassive{
+  pointer-events: none;
+}
+
+.rdrDayPassive .rdrDayNumber span{
+    color: #d5dce0;
+  }
+
+.rdrDayPassive .rdrInRange, .rdrDayPassive .rdrStartEdge, .rdrDayPassive .rdrEndEdge, .rdrDayPassive .rdrSelected, .rdrDayPassive .rdrDayStartPreview, .rdrDayPassive .rdrDayInPreview, .rdrDayPassive .rdrDayEndPreview{
+    display: none;
+  }
+
+.rdrDayDisabled {
+  background-color: rgb(248, 248, 248);
+}
+
+.rdrDayDisabled .rdrDayNumber span{
+    color: #aeb9bf;
+  }
+
+.rdrDayDisabled .rdrInRange, .rdrDayDisabled .rdrStartEdge, .rdrDayDisabled .rdrEndEdge, .rdrDayDisabled .rdrSelected, .rdrDayDisabled .rdrDayStartPreview, .rdrDayDisabled .rdrDayInPreview, .rdrDayDisabled .rdrDayEndPreview{
+    filter: grayscale(100%) opacity(60%);
+  }
+
+.rdrMonthName{
+  text-align: left;
+  font-weight: 600;
+  color: #849095;
+  padding: 0.833em;
+}
+
+.rdrCalendarWrapper {
+  box-sizing: border-box;
+  background: #ffffff;
+  display: inline-flex;
+  flex-direction: column;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+}
+
+.rdrDateDisplay{
+  display: flex;
+  justify-content: space-between;
+}
+
+.rdrDateDisplayItem{
+  flex: 1 1;
+  width: 0;
+  text-align: center;
+  color: inherit;
+}
+
+.rdrDateDisplayItem + .rdrDateDisplayItem{
+    margin-left: 0.833em;
+  }
+
+.rdrDateDisplayItem input{
+    text-align: inherit
+  }
+
+.rdrDateDisplayItem input:disabled{
+      cursor: default;
+    }
+
+.rdrDateDisplayItemActive{}
+
+.rdrMonthAndYearWrapper {
+  box-sizing: inherit;
+  display: flex;
+  justify-content: space-between;
+}
+
+.rdrMonthAndYearPickers{
+  flex: 1 1 auto;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.rdrMonthPicker{}
+
+.rdrYearPicker{}
+
+.rdrNextPrevButton {
+  box-sizing: inherit;
+  cursor: pointer;
+  outline: none;
+}
+
+.rdrPprevButton {}
+
+.rdrNextButton {}
+
+.rdrMonths{
+  display: flex;
+}
+
+.rdrMonthsVertical{
+  flex-direction: column;
+}
+
+.rdrMonthsHorizontal > div > div > div{
+  display: flex;
+  flex-direction: row;
+}
+
+.rdrMonth{
+  width: 27.667em;
+}
+
+.rdrWeekDays{
+  display: flex;
+}
+
+.rdrWeekDay {
+  flex-basis: calc(100% / 7);
+  box-sizing: inherit;
+  text-align: center;
+}
+
+.rdrDays{
+  display: flex;
+  flex-wrap: wrap;
+}
+
+.rdrDateDisplayWrapper{}
+
+.rdrMonthName{}
+
+.rdrInfiniteMonths{
+  overflow: auto;
+}
+
+.rdrDateRangeWrapper{
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+}
+
+.rdrDateInput {
+  position: relative;
+}
+
+.rdrDateInput input {
+    outline: none;
+  }
+
+.rdrDateInput .rdrWarning {
+    position: absolute;
+    font-size: 1.6em;
+    line-height: 1.6em;
+    top: 0;
+    right: .25em;
+    color: #FF0000;
+  }
+
+.rdrDay {
+  box-sizing: inherit;
+  width: calc(100% / 7);
+  position: relative;
+  font: inherit;
+  cursor: pointer;
+}
+
+.rdrDayNumber {
+  display: block;
+  position: relative;
+}
+
+.rdrDayNumber span{
+    color: #1d2429;
+  }
+
+.rdrDayDisabled {
+  cursor: not-allowed;
+}
+
+@supports (-ms-ime-align: auto) {
+  .rdrDay {
+    flex-basis: 14.285% !important;
+  }
+}
+
+.rdrSelected, .rdrInRange, .rdrStartEdge, .rdrEndEdge{
+  pointer-events: none;
+}
+
+.rdrInRange{}
+
+.rdrDayStartPreview, .rdrDayInPreview, .rdrDayEndPreview{
+  pointer-events: none;
+}
+
+.rdrDayHovered{}
+
+.rdrDayActive{}
+
+.rdrDateRangePickerWrapper{
+  display: inline-flex;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+}
+
+.rdrDefinedRangesWrapper{}
+
+.rdrStaticRanges{
+  display: flex;
+  flex-direction: column;
+}
+
+.rdrStaticRange{
+  font-size: inherit;
+}
+
+.rdrStaticRangeLabel{}
+
+.rdrInputRanges{}
+
+.rdrInputRange{
+  display: flex;
+}
+
+.rdrInputRangeInput{}

package/index.esm.js

@@ -12,10 +12,84 @@ import { DayPicker } from 'react-day-picker';
 import { zhTW } from 'date-fns/locale';
 import * as PopoverPrimitive from '@radix-ui/react-popover';
 import { Calendar as Calendar$2, DateRange } from 'react-date-range';
-import * as locales from 'react-date-range/dist/locale';
+import require$$0 from 'date-fns/locale/af';
+import require$$1 from 'date-fns/locale/ar-DZ';
+import require$$2 from 'date-fns/locale/ar-SA';
+import require$$3 from 'date-fns/locale/be';
+import require$$4 from 'date-fns/locale/bg';
+import require$$5 from 'date-fns/locale/bn';
+import require$$6 from 'date-fns/locale/ca';
+import require$$7 from 'date-fns/locale/cs';
+import require$$8 from 'date-fns/locale/cy';
+import require$$9 from 'date-fns/locale/da';
+import require$$10 from 'date-fns/locale/de';
+import require$$11 from 'date-fns/locale/el';
+import require$$12 from 'date-fns/locale/en-AU';
+import require$$13 from 'date-fns/locale/en-CA';
+import require$$14 from 'date-fns/locale/en-GB';
+import require$$15 from 'date-fns/locale/en-US';
+import require$$16 from 'date-fns/locale/eo';
+import require$$17 from 'date-fns/locale/es';
+import require$$18 from 'date-fns/locale/et';
+import require$$19 from 'date-fns/locale/fa-IR';
+import require$$20 from 'date-fns/locale/fi';
+import require$$21 from 'date-fns/locale/fr';
+import require$$22 from 'date-fns/locale/fr-CA';
+import require$$23 from 'date-fns/locale/gl';
+import require$$24 from 'date-fns/locale/gu';
+import require$$25 from 'date-fns/locale/he';
+import require$$26 from 'date-fns/locale/hi';
+import require$$27 from 'date-fns/locale/hr';
+import require$$28 from 'date-fns/locale/hu';
+import require$$29 from 'date-fns/locale/hy';
+import require$$30 from 'date-fns/locale/id';
+import require$$31 from 'date-fns/locale/is';
+import require$$32 from 'date-fns/locale/it';
+import require$$33 from 'date-fns/locale/ja';
+import require$$34 from 'date-fns/locale/ka';
+import require$$35 from 'date-fns/locale/kk';
+import require$$36 from 'date-fns/locale/ko';
+import require$$37 from 'date-fns/locale/lt';
+import require$$38 from 'date-fns/locale/lv';
+import require$$39 from 'date-fns/locale/ms';
+import require$$40 from 'date-fns/locale/nb';
+import require$$41 from 'date-fns/locale/nl';
+import require$$42 from 'date-fns/locale/nn';
+import require$$43 from 'date-fns/locale/pl';
+import require$$44 from 'date-fns/locale/pt';
+import require$$45 from 'date-fns/locale/pt-BR';
+import require$$46 from 'date-fns/locale/ro';
+import require$$47 from 'date-fns/locale/ru';
+import require$$48 from 'date-fns/locale/sk';
+import require$$49 from 'date-fns/locale/sl';
+import require$$50 from 'date-fns/locale/sr';
+import require$$51 from 'date-fns/locale/sr-Latn';
+import require$$52 from 'date-fns/locale/sv';
+import require$$53 from 'date-fns/locale/ta';
+import require$$54 from 'date-fns/locale/te';
+import require$$55 from 'date-fns/locale/th';
+import require$$56 from 'date-fns/locale/tr';
+import require$$57 from 'date-fns/locale/ug';
+import require$$58 from 'date-fns/locale/uk';
+import require$$59 from 'date-fns/locale/vi';
+import require$$60 from 'date-fns/locale/zh-CN';
+import require$$61 from 'date-fns/locale/zh-TW';
 import format$1 from 'date-fns/format';
-import 'react-date-range/dist/styles.css';
-import 'react-date-range/dist/theme/default.css';
+
+function _mergeNamespaces(n, m) {
+  m.forEach(function (e) {
+    e && typeof e !== 'string' && !Array.isArray(e) && Object.keys(e).forEach(function (k) {
+      if (k !== 'default' && !(k in n)) {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  });
+  return Object.freeze(n);
+}
 
 var styles = {};
 
@@ -45,6 +119,9 @@ function Spin(props) {
 }
 
 var commonjsGlobal = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
+function getDefaultExportFromCjs(x) {
+    return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, "default") ? x["default"] : x;
+}
 
 var propTypes = {
     exports: {}
@@ -70523,6 +70600,460 @@ function DateRangePicker(param) {
     });
 }
 
+var locale = {};
+
+(function (exports) {
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "af", {
+    enumerable: true,
+    get: function get() {
+        return _af.default;
+    }
+});
+Object.defineProperty(exports, "arDZ", {
+    enumerable: true,
+    get: function get() {
+        return _arDZ.default;
+    }
+});
+Object.defineProperty(exports, "arSA", {
+    enumerable: true,
+    get: function get() {
+        return _arSA.default;
+    }
+});
+Object.defineProperty(exports, "be", {
+    enumerable: true,
+    get: function get() {
+        return _be.default;
+    }
+});
+Object.defineProperty(exports, "bg", {
+    enumerable: true,
+    get: function get() {
+        return _bg.default;
+    }
+});
+Object.defineProperty(exports, "bn", {
+    enumerable: true,
+    get: function get() {
+        return _bn.default;
+    }
+});
+Object.defineProperty(exports, "ca", {
+    enumerable: true,
+    get: function get() {
+        return _ca.default;
+    }
+});
+Object.defineProperty(exports, "cs", {
+    enumerable: true,
+    get: function get() {
+        return _cs.default;
+    }
+});
+Object.defineProperty(exports, "cy", {
+    enumerable: true,
+    get: function get() {
+        return _cy.default;
+    }
+});
+Object.defineProperty(exports, "da", {
+    enumerable: true,
+    get: function get() {
+        return _da.default;
+    }
+});
+Object.defineProperty(exports, "de", {
+    enumerable: true,
+    get: function get() {
+        return _de.default;
+    }
+});
+Object.defineProperty(exports, "el", {
+    enumerable: true,
+    get: function get() {
+        return _el.default;
+    }
+});
+Object.defineProperty(exports, "enAU", {
+    enumerable: true,
+    get: function get() {
+        return _enAU.default;
+    }
+});
+Object.defineProperty(exports, "enCA", {
+    enumerable: true,
+    get: function get() {
+        return _enCA.default;
+    }
+});
+Object.defineProperty(exports, "enGB", {
+    enumerable: true,
+    get: function get() {
+        return _enGB.default;
+    }
+});
+Object.defineProperty(exports, "enUS", {
+    enumerable: true,
+    get: function get() {
+        return _enUS.default;
+    }
+});
+Object.defineProperty(exports, "eo", {
+    enumerable: true,
+    get: function get() {
+        return _eo.default;
+    }
+});
+Object.defineProperty(exports, "es", {
+    enumerable: true,
+    get: function get() {
+        return _es.default;
+    }
+});
+Object.defineProperty(exports, "et", {
+    enumerable: true,
+    get: function get() {
+        return _et.default;
+    }
+});
+Object.defineProperty(exports, "faIR", {
+    enumerable: true,
+    get: function get() {
+        return _faIR.default;
+    }
+});
+Object.defineProperty(exports, "fi", {
+    enumerable: true,
+    get: function get() {
+        return _fi.default;
+    }
+});
+Object.defineProperty(exports, "fr", {
+    enumerable: true,
+    get: function get() {
+        return _fr.default;
+    }
+});
+Object.defineProperty(exports, "frCA", {
+    enumerable: true,
+    get: function get() {
+        return _frCA.default;
+    }
+});
+Object.defineProperty(exports, "gl", {
+    enumerable: true,
+    get: function get() {
+        return _gl.default;
+    }
+});
+Object.defineProperty(exports, "gu", {
+    enumerable: true,
+    get: function get() {
+        return _gu.default;
+    }
+});
+Object.defineProperty(exports, "he", {
+    enumerable: true,
+    get: function get() {
+        return _he.default;
+    }
+});
+Object.defineProperty(exports, "hi", {
+    enumerable: true,
+    get: function get() {
+        return _hi.default;
+    }
+});
+Object.defineProperty(exports, "hr", {
+    enumerable: true,
+    get: function get() {
+        return _hr.default;
+    }
+});
+Object.defineProperty(exports, "hu", {
+    enumerable: true,
+    get: function get() {
+        return _hu.default;
+    }
+});
+Object.defineProperty(exports, "hy", {
+    enumerable: true,
+    get: function get() {
+        return _hy.default;
+    }
+});
+Object.defineProperty(exports, "id", {
+    enumerable: true,
+    get: function get() {
+        return _id.default;
+    }
+});
+Object.defineProperty(exports, "is", {
+    enumerable: true,
+    get: function get() {
+        return _is.default;
+    }
+});
+Object.defineProperty(exports, "it", {
+    enumerable: true,
+    get: function get() {
+        return _it.default;
+    }
+});
+Object.defineProperty(exports, "ja", {
+    enumerable: true,
+    get: function get() {
+        return _ja.default;
+    }
+});
+Object.defineProperty(exports, "ka", {
+    enumerable: true,
+    get: function get() {
+        return _ka.default;
+    }
+});
+Object.defineProperty(exports, "kk", {
+    enumerable: true,
+    get: function get() {
+        return _kk.default;
+    }
+});
+Object.defineProperty(exports, "ko", {
+    enumerable: true,
+    get: function get() {
+        return _ko.default;
+    }
+});
+Object.defineProperty(exports, "lt", {
+    enumerable: true,
+    get: function get() {
+        return _lt.default;
+    }
+});
+Object.defineProperty(exports, "lv", {
+    enumerable: true,
+    get: function get() {
+        return _lv.default;
+    }
+});
+Object.defineProperty(exports, "ms", {
+    enumerable: true,
+    get: function get() {
+        return _ms.default;
+    }
+});
+Object.defineProperty(exports, "nb", {
+    enumerable: true,
+    get: function get() {
+        return _nb.default;
+    }
+});
+Object.defineProperty(exports, "nl", {
+    enumerable: true,
+    get: function get() {
+        return _nl.default;
+    }
+});
+Object.defineProperty(exports, "nn", {
+    enumerable: true,
+    get: function get() {
+        return _nn.default;
+    }
+});
+Object.defineProperty(exports, "pl", {
+    enumerable: true,
+    get: function get() {
+        return _pl.default;
+    }
+});
+Object.defineProperty(exports, "pt", {
+    enumerable: true,
+    get: function get() {
+        return _pt.default;
+    }
+});
+Object.defineProperty(exports, "ptBR", {
+    enumerable: true,
+    get: function get() {
+        return _ptBR.default;
+    }
+});
+Object.defineProperty(exports, "ro", {
+    enumerable: true,
+    get: function get() {
+        return _ro.default;
+    }
+});
+Object.defineProperty(exports, "ru", {
+    enumerable: true,
+    get: function get() {
+        return _ru.default;
+    }
+});
+Object.defineProperty(exports, "sk", {
+    enumerable: true,
+    get: function get() {
+        return _sk.default;
+    }
+});
+Object.defineProperty(exports, "sl", {
+    enumerable: true,
+    get: function get() {
+        return _sl.default;
+    }
+});
+Object.defineProperty(exports, "sr", {
+    enumerable: true,
+    get: function get() {
+        return _sr.default;
+    }
+});
+Object.defineProperty(exports, "srLatn", {
+    enumerable: true,
+    get: function get() {
+        return _srLatn.default;
+    }
+});
+Object.defineProperty(exports, "sv", {
+    enumerable: true,
+    get: function get() {
+        return _sv.default;
+    }
+});
+Object.defineProperty(exports, "ta", {
+    enumerable: true,
+    get: function get() {
+        return _ta.default;
+    }
+});
+Object.defineProperty(exports, "te", {
+    enumerable: true,
+    get: function get() {
+        return _te.default;
+    }
+});
+Object.defineProperty(exports, "th", {
+    enumerable: true,
+    get: function get() {
+        return _th.default;
+    }
+});
+Object.defineProperty(exports, "tr", {
+    enumerable: true,
+    get: function get() {
+        return _tr.default;
+    }
+});
+Object.defineProperty(exports, "ug", {
+    enumerable: true,
+    get: function get() {
+        return _ug.default;
+    }
+});
+Object.defineProperty(exports, "uk", {
+    enumerable: true,
+    get: function get() {
+        return _uk.default;
+    }
+});
+Object.defineProperty(exports, "vi", {
+    enumerable: true,
+    get: function get() {
+        return _vi.default;
+    }
+});
+Object.defineProperty(exports, "zhCN", {
+    enumerable: true,
+    get: function get() {
+        return _zhCN.default;
+    }
+});
+Object.defineProperty(exports, "zhTW", {
+    enumerable: true,
+    get: function get() {
+        return _zhTW.default;
+    }
+});
+var _af = _interopRequireDefault(require$$0);
+var _arDZ = _interopRequireDefault(require$$1);
+var _arSA = _interopRequireDefault(require$$2);
+var _be = _interopRequireDefault(require$$3);
+var _bg = _interopRequireDefault(require$$4);
+var _bn = _interopRequireDefault(require$$5);
+var _ca = _interopRequireDefault(require$$6);
+var _cs = _interopRequireDefault(require$$7);
+var _cy = _interopRequireDefault(require$$8);
+var _da = _interopRequireDefault(require$$9);
+var _de = _interopRequireDefault(require$$10);
+var _el = _interopRequireDefault(require$$11);
+var _enAU = _interopRequireDefault(require$$12);
+var _enCA = _interopRequireDefault(require$$13);
+var _enGB = _interopRequireDefault(require$$14);
+var _enUS = _interopRequireDefault(require$$15);
+var _eo = _interopRequireDefault(require$$16);
+var _es = _interopRequireDefault(require$$17);
+var _et = _interopRequireDefault(require$$18);
+var _faIR = _interopRequireDefault(require$$19);
+var _fi = _interopRequireDefault(require$$20);
+var _fr = _interopRequireDefault(require$$21);
+var _frCA = _interopRequireDefault(require$$22);
+var _gl = _interopRequireDefault(require$$23);
+var _gu = _interopRequireDefault(require$$24);
+var _he = _interopRequireDefault(require$$25);
+var _hi = _interopRequireDefault(require$$26);
+var _hr = _interopRequireDefault(require$$27);
+var _hu = _interopRequireDefault(require$$28);
+var _hy = _interopRequireDefault(require$$29);
+var _id = _interopRequireDefault(require$$30);
+var _is = _interopRequireDefault(require$$31);
+var _it = _interopRequireDefault(require$$32);
+var _ja = _interopRequireDefault(require$$33);
+var _ka = _interopRequireDefault(require$$34);
+var _kk = _interopRequireDefault(require$$35);
+var _ko = _interopRequireDefault(require$$36);
+var _lt = _interopRequireDefault(require$$37);
+var _lv = _interopRequireDefault(require$$38);
+var _ms = _interopRequireDefault(require$$39);
+var _nb = _interopRequireDefault(require$$40);
+var _nl = _interopRequireDefault(require$$41);
+var _nn = _interopRequireDefault(require$$42);
+var _pl = _interopRequireDefault(require$$43);
+var _pt = _interopRequireDefault(require$$44);
+var _ptBR = _interopRequireDefault(require$$45);
+var _ro = _interopRequireDefault(require$$46);
+var _ru = _interopRequireDefault(require$$47);
+var _sk = _interopRequireDefault(require$$48);
+var _sl = _interopRequireDefault(require$$49);
+var _sr = _interopRequireDefault(require$$50);
+var _srLatn = _interopRequireDefault(require$$51);
+var _sv = _interopRequireDefault(require$$52);
+var _ta = _interopRequireDefault(require$$53);
+var _te = _interopRequireDefault(require$$54);
+var _th = _interopRequireDefault(require$$55);
+var _tr = _interopRequireDefault(require$$56);
+var _ug = _interopRequireDefault(require$$57);
+var _uk = _interopRequireDefault(require$$58);
+var _vi = _interopRequireDefault(require$$59);
+var _zhCN = _interopRequireDefault(require$$60);
+var _zhTW = _interopRequireDefault(require$$61);
+function _interopRequireDefault(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+}(locale));
+
+var index = /*@__PURE__*/getDefaultExportFromCjs(locale);
+
+var locales = /*#__PURE__*/_mergeNamespaces({
+  __proto__: null,
+  'default': index
+}, [locale]);
+
 function _array_like_to_array(arr, len) {
     if (len == null || len > arr.length) len = arr.length;
     for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sunggang/ui-lib",
-  "version": "0.1.35",
+  "version": "0.1.38",
   "dependencies": {
     "@radix-ui/react-popover": "^1.0.7",
     "@radix-ui/react-slot": "^1.0.2",

package/src/components/ui/reactDateRange.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import 'react-date-range/dist/styles.css';
-import 'react-date-range/dist/theme/default.css';
+import './assets/css/react_date_range_theme_default.css';
+import './assets/css/react_date_range_styles.css';
 interface ItemType {
     label?: string;
     name?: string;