react-bootstrap-plugins 1.0.5 → 2.0.0

package/dist/css/datepicker.css

@@ -1,299 +1 @@
-/* ==========================================================================
-   Custom DatePicker — Bootstrap 5 design tokens
-   Zero dependencies.  Calendar grid + time picker + year picker + datetime combo.
-   Popover is portaled to document.body — positioning is set inline by JS.
-   ========================================================================== */
-
-/* --- Popover container --- */
-.datepicker-popover {
-  border-radius: var(--bs-border-radius, 0.375rem);
-  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
-  user-select: none;
-  -webkit-user-select: none;
-}
-
-.datepicker-popover--wide {
-  min-width: 420px;
-}
-
-/* --- Calendar panel --- */
-.datepicker-calendar {
-  min-width: 260px;
-}
-
-/* 7-column day-of-week header + day grid */
-.datepicker-days-header,
-.datepicker-days-grid {
-  display: grid;
-  grid-template-columns: repeat(7, 1fr);
-  gap: 2px;
-}
-
-/* Day-of-week label */
-.datepicker-day-label {
-  font-size: 0.7rem;
-  font-weight: 600;
-  color: var(--bs-secondary-color, #6c757d);
-  text-transform: uppercase;
-  text-align: center;
-  padding: 2px 0;
-  width: 34px;
-}
-
-/* Individual day cell */
-.datepicker-day {
-  width: 34px;
-  height: 34px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  font-size: 0.8rem;
-  font-weight: 400;
-  color: var(--bs-body-color, #212529);
-  background: transparent;
-  border: none;
-  border-radius: var(--bs-border-radius-sm, 0.25rem);
-  cursor: pointer;
-  transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out;
-  padding: 0;
-  margin: 0 auto;
-}
-
-.datepicker-day:hover:not(:disabled):not(.datepicker-day--selected) {
-  background-color: var(--bs-primary-bg-subtle, #cfe2ff);
-}
-
-/* Today */
-.datepicker-day--today {
-  font-weight: 700;
-  border: 1px solid var(--bs-border-color, #dee2e6);
-}
-
-/* Selected (Bootstrap primary) */
-.datepicker-day--selected {
-  background-color: var(--bs-primary, #0d6efd) !important;
-  color: #fff !important;
-  font-weight: 600;
-}
-
-/* Outside current month */
-.datepicker-day--outside {
-  color: var(--bs-tertiary-color, #adb5bd);
-  opacity: 0.45;
-  pointer-events: none;
-}
-
-/* Disabled (outside min/max range) */
-.datepicker-day--disabled {
-  color: var(--bs-tertiary-color, #adb5bd);
-  opacity: 0.35;
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-/* --- Year picker --- */
-.datepicker-year-picker {
-  min-width: 260px;
-}
-
-/* 4-column year grid */
-.datepicker-year-grid {
-  display: grid;
-  grid-template-columns: repeat(4, 1fr);
-  gap: 6px;
-}
-
-.datepicker-year-cell {
-  font-size: 0.85rem;
-  padding: 6px 4px;
-  text-align: center;
-}
-
-/* --- Time panel --- */
-.datepicker-time {
-  min-width: 120px;
-}
-
-/* Three-column scrollable time picker */
-.datepicker-time-col {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  flex: 0 0 auto;
-  width: 52px;
-}
-
-.datepicker-time-col-label {
-  font-size: 0.6rem;
-  font-weight: 600;
-  color: var(--bs-secondary-color, #6c757d);
-  text-transform: uppercase;
-  letter-spacing: 0.04em;
-  margin-bottom: 2px;
-  user-select: none;
-  -webkit-user-select: none;
-}
-
-.datepicker-time-col-scroll {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: 1px;
-  overflow-y: scroll;
-  scrollbar-width: none;          /* Firefox */
-  -ms-overflow-style: none;       /* IE/Edge */
-  height: 220px;
-  scroll-behavior: smooth;
-}
-
-.datepicker-time-col-scroll::-webkit-scrollbar {
-  display: none;                  /* Chrome/Safari/Opera */
-}
-
-.datepicker-time-item {
-  width: 44px;
-  height: 30px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  font-size: 0.82rem;
-  font-weight: 500;
-  color: var(--bs-body-color, #212529);
-  background: transparent;
-  border: none;
-  border-radius: var(--bs-border-radius-sm, 0.25rem);
-  cursor: pointer;
-  transition: background-color 0.1s ease, color 0.1s ease;
-  padding: 0;
-  flex-shrink: 0;
-}
-
-.datepicker-time-item:hover {
-  background-color: var(--bs-primary-bg-subtle, #cfe2ff);
-}
-
-.datepicker-time-item.active {
-  background-color: var(--bs-primary, #0d6efd);
-  color: #fff;
-  font-weight: 600;
-}
-
-/* AM/PM items — slightly taller since only 2 */
-.datepicker-time-item--ampm {
-  height: 36px;
-  width: 46px;
-  font-size: 0.78rem;
-}
-
-.datepicker-time-separator {
-  font-size: 1.1rem;
-  font-weight: 600;
-  color: var(--bs-body-color, #212529);
-  align-self: center;
-  margin-top: 14px;
-  flex: 0 0 auto;
-}
-
-/* Footer bar (Today/Now + Clear) */
-.datepicker-footer {
-  border-bottom-left-radius: var(--bs-border-radius, 0.375rem);
-  border-bottom-right-radius: var(--bs-border-radius, 0.375rem);
-}
-
-/* --- Dark mode --- */
-[data-bs-theme="dark"] .datepicker-popover {
-  background-color: var(--bs-body-bg, #212529);
-  border-color: var(--bs-border-color, #495057);
-}
-
-[data-bs-theme="dark"] .datepicker-day:hover:not(:disabled):not(.datepicker-day--selected) {
-  background-color: var(--bs-primary-bg-subtle, #2c3e50);
-}
-
-[data-bs-theme="dark"] .datepicker-time-item:hover {
-  background-color: var(--bs-primary-bg-subtle, #2c3e50);
-}
-
-[data-bs-theme="dark"] .datepicker-time-item.active {
-  background-color: var(--bs-primary, #0d6efd);
-  color: #fff;
-}
-
-[data-bs-theme="dark"] .datepicker-footer {
-  border-top-color: var(--bs-border-color, #495057);
-}
-
-/* ==========================================================================
-   Mobile responsive — adapts layout and sizing for small screens
-   ========================================================================== */
-
-@media (max-width: 575.98px) {
-  /* Popover: never wider than the viewport */
-  .datepicker-popover {
-    max-width: calc(100vw - 8px) !important;
-    overflow-x: hidden;
-  }
-
-  /* Stack calendar + time vertically in datetime mode */
-  .datepicker-popover--wide .d-flex.flex-row {
-    flex-direction: column !important;
-  }
-
-  /* Hide vertical divider between calendar and time */
-  .datepicker-popover--wide .vr {
-    display: none;
-  }
-
-  /* Slightly smaller day cells to fit narrow screens */
-  .datepicker-day {
-    width: 28px;
-    height: 28px;
-    font-size: 0.72rem;
-  }
-
-  .datepicker-day-label {
-    width: 28px;
-    font-size: 0.62rem;
-  }
-
-  /* Reduce calendar min-width */
-  .datepicker-calendar,
-  .datepicker-year-picker {
-    min-width: 210px;
-  }
-
-  /* Time columns — stack more compactly */
-  .datepicker-time-col-scroll {
-    height: 200px;
-  }
-
-  .datepicker-time-item {
-    width: 38px;
-    height: 26px;
-    font-size: 0.75rem;
-  }
-
-  .datepicker-time-item--ampm {
-    width: 40px;
-    height: 32px;
-  }
-
-  .datepicker-time-separator {
-    font-size: 1rem;
-    margin-top: 12px;
-  }
-
-  /* Increase touch target for footer buttons */
-  .datepicker-footer .btn {
-    font-size: 0.8rem;
-    padding: 6px 8px;
-    min-height: 34px;
-  }
-
-  /* Year grid cells — slightly roomier for tap */
-  .datepicker-year-cell {
-    font-size: 0.8rem;
-    padding: 8px 4px;
-    min-height: 34px;
-  }
-}
+.input-group>.datepicker-wrapper,.input-group>.searchselect-wrapper{flex:auto;width:1%;min-width:0;position:relative}.input-group>.datepicker-wrapper:not(:first-child) .form-control,.input-group>.searchselect-wrapper:not(:first-child) .form-select{border-top-left-radius:0;border-bottom-left-radius:0}.input-group>.datepicker-wrapper:not(:last-child) .form-control,.input-group>.searchselect-wrapper:not(:last-child) .form-select{border-top-right-radius:0;border-bottom-right-radius:0}.datepicker-popover{border-radius:var(--bs-border-radius,.375rem);-webkit-user-select:none;user-select:none;box-shadow:0 .5rem 1rem #00000026}.datepicker-popover--wide{min-width:420px}.datepicker-calendar{min-width:260px}.datepicker-days-header,.datepicker-days-grid{grid-template-columns:repeat(7,1fr);gap:2px;display:grid}.datepicker-day-label{color:var(--bs-secondary-color,#6c757d);text-transform:uppercase;text-align:center;width:34px;padding:2px 0;font-size:.7rem;font-weight:600}.datepicker-day{width:34px;height:34px;color:var(--bs-body-color,#212529);border-radius:var(--bs-border-radius-sm,.25rem);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;margin:0 auto;padding:0;font-size:.8rem;font-weight:400;transition:background-color .15s ease-in-out,color .15s ease-in-out;display:flex}.datepicker-day:hover:not(:disabled):not(.datepicker-day--selected){background-color:var(--bs-primary-bg-subtle,#cfe2ff)}.datepicker-day--today{border:1px solid var(--bs-border-color,#dee2e6);font-weight:700}.datepicker-day--selected{font-weight:600;background-color:var(--bs-primary,#0d6efd)!important;color:#fff!important}.datepicker-day--outside{color:var(--bs-tertiary-color,#adb5bd);opacity:.45;pointer-events:none}.datepicker-day--disabled{color:var(--bs-tertiary-color,#adb5bd);opacity:.35;cursor:not-allowed;pointer-events:none}.datepicker-year-picker{min-width:260px}.datepicker-year-grid{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.datepicker-year-cell{text-align:center;padding:6px 4px;font-size:.85rem}.datepicker-time{min-width:120px}.datepicker-time-col{flex-direction:column;flex:none;align-items:center;width:52px;display:flex}.datepicker-time-col-label{color:var(--bs-secondary-color,#6c757d);text-transform:uppercase;letter-spacing:.04em;-webkit-user-select:none;user-select:none;margin-bottom:2px;font-size:.6rem;font-weight:600}.datepicker-time-col-scroll{scrollbar-width:none;-ms-overflow-style:none;scroll-behavior:smooth;flex-direction:column;align-items:center;gap:1px;height:220px;display:flex;overflow-y:scroll}.datepicker-time-col-scroll::-webkit-scrollbar{display:none}.datepicker-time-item{width:44px;height:30px;color:var(--bs-body-color,#212529);border-radius:var(--bs-border-radius-sm,.25rem);cursor:pointer;background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;padding:0;font-size:.82rem;font-weight:500;transition:background-color .1s,color .1s;display:flex}.datepicker-time-item:hover{background-color:var(--bs-primary-bg-subtle,#cfe2ff)}.datepicker-time-item.active{background-color:var(--bs-primary,#0d6efd);color:#fff;font-weight:600}.datepicker-time-item--ampm{width:46px;height:36px;font-size:.78rem}.datepicker-time-separator{color:var(--bs-body-color,#212529);flex:none;align-self:center;margin-top:14px;font-size:1.1rem;font-weight:600}.datepicker-footer{border-bottom-left-radius:var(--bs-border-radius,.375rem);border-bottom-right-radius:var(--bs-border-radius,.375rem)}[data-bs-theme=dark] .datepicker-popover{background-color:var(--bs-body-bg,#212529);border-color:var(--bs-border-color,#495057)}[data-bs-theme=dark] .datepicker-day:hover:not(:disabled):not(.datepicker-day--selected),[data-bs-theme=dark] .datepicker-time-item:hover{background-color:var(--bs-primary-bg-subtle,#2c3e50)}[data-bs-theme=dark] .datepicker-time-item.active{background-color:var(--bs-primary,#0d6efd);color:#fff}[data-bs-theme=dark] .datepicker-footer{border-top-color:var(--bs-border-color,#495057)}@media (max-width:575.98px){.datepicker-popover{overflow-x:hidden;max-width:calc(100vw - 8px)!important}.datepicker-popover--wide .d-flex.flex-row{flex-direction:column!important}.datepicker-popover--wide .vr{display:none}.datepicker-day{width:28px;height:28px;font-size:.72rem}.datepicker-day-label{width:28px;font-size:.62rem}.datepicker-calendar,.datepicker-year-picker{min-width:210px}.datepicker-time-col-scroll{height:200px}.datepicker-time-item{width:38px;height:26px;font-size:.75rem}.datepicker-time-item--ampm{width:40px;height:32px}.datepicker-time-separator{margin-top:12px;font-size:1rem}.datepicker-footer .btn{min-height:34px;padding:6px 8px;font-size:.8rem}.datepicker-year-cell{min-height:34px;padding:8px 4px;font-size:.8rem}}

package/dist/css/plugins.css

@@ -0,0 +1 @@
+.input-group>.datepicker-wrapper,.input-group>.searchselect-wrapper{flex:auto;width:1%;min-width:0;position:relative}.input-group>.datepicker-wrapper:not(:first-child) .form-control,.input-group>.searchselect-wrapper:not(:first-child) .form-select{border-top-left-radius:0;border-bottom-left-radius:0}.input-group>.datepicker-wrapper:not(:last-child) .form-control,.input-group>.searchselect-wrapper:not(:last-child) .form-select{border-top-right-radius:0;border-bottom-right-radius:0}.datepicker-popover{border-radius:var(--bs-border-radius,.375rem);-webkit-user-select:none;user-select:none;box-shadow:0 .5rem 1rem #00000026}.datepicker-popover--wide{min-width:420px}.datepicker-calendar{min-width:260px}.datepicker-days-header,.datepicker-days-grid{grid-template-columns:repeat(7,1fr);gap:2px;display:grid}.datepicker-day-label{color:var(--bs-secondary-color,#6c757d);text-transform:uppercase;text-align:center;width:34px;padding:2px 0;font-size:.7rem;font-weight:600}.datepicker-day{width:34px;height:34px;color:var(--bs-body-color,#212529);border-radius:var(--bs-border-radius-sm,.25rem);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;margin:0 auto;padding:0;font-size:.8rem;font-weight:400;transition:background-color .15s ease-in-out,color .15s ease-in-out;display:flex}.datepicker-day:hover:not(:disabled):not(.datepicker-day--selected){background-color:var(--bs-primary-bg-subtle,#cfe2ff)}.datepicker-day--today{border:1px solid var(--bs-border-color,#dee2e6);font-weight:700}.datepicker-day--selected{font-weight:600;background-color:var(--bs-primary,#0d6efd)!important;color:#fff!important}.datepicker-day--outside{color:var(--bs-tertiary-color,#adb5bd);opacity:.45;pointer-events:none}.datepicker-day--disabled{color:var(--bs-tertiary-color,#adb5bd);opacity:.35;cursor:not-allowed;pointer-events:none}.datepicker-year-picker{min-width:260px}.datepicker-year-grid{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.datepicker-year-cell{text-align:center;padding:6px 4px;font-size:.85rem}.datepicker-time{min-width:120px}.datepicker-time-col{flex-direction:column;flex:none;align-items:center;width:52px;display:flex}.datepicker-time-col-label{color:var(--bs-secondary-color,#6c757d);text-transform:uppercase;letter-spacing:.04em;-webkit-user-select:none;user-select:none;margin-bottom:2px;font-size:.6rem;font-weight:600}.datepicker-time-col-scroll{scrollbar-width:none;-ms-overflow-style:none;scroll-behavior:smooth;flex-direction:column;align-items:center;gap:1px;height:220px;display:flex;overflow-y:scroll}.datepicker-time-col-scroll::-webkit-scrollbar{display:none}.datepicker-time-item{width:44px;height:30px;color:var(--bs-body-color,#212529);border-radius:var(--bs-border-radius-sm,.25rem);cursor:pointer;background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;padding:0;font-size:.82rem;font-weight:500;transition:background-color .1s,color .1s;display:flex}.datepicker-time-item:hover{background-color:var(--bs-primary-bg-subtle,#cfe2ff)}.datepicker-time-item.active{background-color:var(--bs-primary,#0d6efd);color:#fff;font-weight:600}.datepicker-time-item--ampm{width:46px;height:36px;font-size:.78rem}.datepicker-time-separator{color:var(--bs-body-color,#212529);flex:none;align-self:center;margin-top:14px;font-size:1.1rem;font-weight:600}.datepicker-footer{border-bottom-left-radius:var(--bs-border-radius,.375rem);border-bottom-right-radius:var(--bs-border-radius,.375rem)}[data-bs-theme=dark] .datepicker-popover{background-color:var(--bs-body-bg,#212529);border-color:var(--bs-border-color,#495057)}[data-bs-theme=dark] .datepicker-day:hover:not(:disabled):not(.datepicker-day--selected),[data-bs-theme=dark] .datepicker-time-item:hover{background-color:var(--bs-primary-bg-subtle,#2c3e50)}[data-bs-theme=dark] .datepicker-time-item.active{background-color:var(--bs-primary,#0d6efd);color:#fff}[data-bs-theme=dark] .datepicker-footer{border-top-color:var(--bs-border-color,#495057)}@media (max-width:575.98px){.datepicker-popover{overflow-x:hidden;max-width:calc(100vw - 8px)!important}.datepicker-popover--wide .d-flex.flex-row{flex-direction:column!important}.datepicker-popover--wide .vr{display:none}.datepicker-day{width:28px;height:28px;font-size:.72rem}.datepicker-day-label{width:28px;font-size:.62rem}.datepicker-calendar,.datepicker-year-picker{min-width:210px}.datepicker-time-col-scroll{height:200px}.datepicker-time-item{width:38px;height:26px;font-size:.75rem}.datepicker-time-item--ampm{width:40px;height:32px}.datepicker-time-separator{margin-top:12px;font-size:1rem}.datepicker-footer .btn{min-height:34px;padding:6px 8px;font-size:.8rem}.datepicker-year-cell{min-height:34px;padding:8px 4px;font-size:.8rem}}

package/dist/index.cjs

@@ -1,2 +1,2 @@
-'use strict';var chunkKZEOI42M_cjs=require('./chunk-KZEOI42M.cjs'),chunkMQRJBL7S_cjs=require('./chunk-MQRJBL7S.cjs');require('./chunk-QQNPKA7A.cjs');var chunk2JC4VIKL_cjs=require('./chunk-2JC4VIKL.cjs'),chunkJ4TRPVD4_cjs=require('./chunk-J4TRPVD4.cjs');Object.defineProperty(exports,"DatePicker",{enumerable:true,get:function(){return chunkKZEOI42M_cjs.a}});Object.defineProperty(exports,"SearchSelect",{enumerable:true,get:function(){return chunkMQRJBL7S_cjs.a}});Object.defineProperty(exports,"Label",{enumerable:true,get:function(){return chunk2JC4VIKL_cjs.a}});Object.defineProperty(exports,"TableLoading",{enumerable:true,get:function(){return chunkJ4TRPVD4_cjs.a}});//# sourceMappingURL=index.cjs.map
-//# sourceMappingURL=index.cjs.map
+'use strict';var chunkGZ2D7HTS_cjs=require('./chunk-GZ2D7HTS.cjs'),chunkAWU5XGMI_cjs=require('./chunk-AWU5XGMI.cjs');require('./chunk-NPQQDBFB.cjs');var chunk2Q4NZKMX_cjs=require('./chunk-2Q4NZKMX.cjs'),chunk5IOLZUVD_cjs=require('./chunk-5IOLZUVD.cjs');Object.defineProperty(exports,"DatePicker",{enumerable:true,get:function(){return chunkGZ2D7HTS_cjs.a}});Object.defineProperty(exports,"SearchSelect",{enumerable:true,get:function(){return chunkAWU5XGMI_cjs.a}});Object.defineProperty(exports,"Label",{enumerable:true,get:function(){return chunk2Q4NZKMX_cjs.a}});Object.defineProperty(exports,"TableLoading",{enumerable:true,get:function(){return chunk5IOLZUVD_cjs.a}});//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IiIsImZpbGUiOiJpbmRleC5janMifQ==

package/dist/index.d.cts

@@ -0,0 +1,5 @@
+export { DatePicker, DatePickerChangeEvent, DatePickerProps } from './DatePicker.cjs';
+export { SearchSelect, SearchSelectProps } from './SearchSelect.cjs';
+export { Label, LabelProps } from './Label.cjs';
+export { TableLoading, TableLoadingProps } from './TableLoading.cjs';
+import 'react';

package/dist/index.d.ts

@@ -1,13 +1,5 @@
-// Generated by scripts/copy-types.mjs — do not edit by hand.
-
-export { DatePicker } from './DatePicker.js'
-export type { DatePickerProps } from './DatePicker.js'
-
-export { SearchSelect } from './SearchSelect.js'
-export type { SearchSelectProps } from './SearchSelect.js'
-
-export { Label } from './Label.js'
-export type { LabelProps } from './Label.js'
-
-export { TableLoading } from './TableLoading.js'
-export type { TableLoadingProps } from './TableLoading.js'
+export { DatePicker, DatePickerChangeEvent, DatePickerProps } from './DatePicker.js';
+export { SearchSelect, SearchSelectProps } from './SearchSelect.js';
+export { Label, LabelProps } from './Label.js';
+export { TableLoading, TableLoadingProps } from './TableLoading.js';
+import 'react';

package/dist/index.js

@@ -1,2 +1,2 @@
-export{a as DatePicker}from'./chunk-MTRPXJ3C.js';export{a as SearchSelect}from'./chunk-XFHLZ7I3.js';import'./chunk-46AJ2Q5H.js';export{a as Label}from'./chunk-W6UBCMKG.js';export{a as TableLoading}from'./chunk-WPTHY5AJ.js';//# sourceMappingURL=index.js.map
-//# sourceMappingURL=index.js.map
+export{a as DatePicker}from'./chunk-ES5ABK5L.js';export{a as SearchSelect}from'./chunk-ZCAQ7S2A.js';import'./chunk-RR7TBRGI.js';export{a as Label}from'./chunk-HYB5IGJK.js';export{a as TableLoading}from'./chunk-7LXLWNUR.js';//# sourceMappingURL=index.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IiIsImZpbGUiOiJpbmRleC5qcyJ9

package/docs/DATEPICKER.md

@@ -17,7 +17,7 @@ import { DatePicker } from 'react-bootstrap-plugins/DatePicker'
 import { DatePicker } from 'react-bootstrap-plugins'
 
 // Required CSS (import once, anywhere in your app)
-import 'react-bootstrap-plugins/css/datepicker.css'
+import 'react-bootstrap-plugins/css/plugins.css'
 ```
 
 ---
@@ -27,7 +27,7 @@ import 'react-bootstrap-plugins/css/datepicker.css'
 ```jsx
 import { useState } from 'react'
 import { DatePicker } from 'react-bootstrap-plugins'
-import 'react-bootstrap-plugins/css/datepicker.css'
+import 'react-bootstrap-plugins/css/plugins.css'
 
 function MyForm() {
   const [date, setDate] = useState(null)
@@ -131,7 +131,7 @@ DatePicker requires a small CSS file for its popover calendar layout. Import it
 
 ```js
 // Recommended — uses the package exports map
-import 'react-bootstrap-plugins/css/datepicker.css'
+import 'react-bootstrap-plugins/css/plugins.css'
 ```
 
 For troubleshooting CSS import issues, see the [main README](./README.md#css-imports).

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-bootstrap-plugins",
-  "version": "1.0.5",
+  "version": "2.0.0",
   "description": "Production-grade Bootstrap 5 UI plugins for React — DatePicker, SearchSelect, Label, TableLoading, and more. Zero runtime dependencies beyond React.",
   "license": "MIT",
   "author": {
@@ -62,23 +62,27 @@
         "default": "./dist/TableLoading.cjs"
       }
     },
+    "./css/plugins.css": "./dist/css/plugins.css",
     "./css/datepicker.css": "./dist/css/datepicker.css"
   },
   "sideEffects": [
     "*.css",
-    "./dist/css/*.css"
+    "./dist/css/plugins.css",
+    "./dist/css/datepicker.css"
+  ],
+  "browserslist": [
+    "defaults and fully supports es6-module",
+    "maintained node versions"
   ],
   "files": [
     "docs",
     "dist",
-    "src",
     "LICENSE",
-    "README.md",
-    "CHANGELOG.md"
+    "README.md"
   ],
   "scripts": {
-    "build": "tsup && node scripts/copy-types.mjs && rm -rf dist/css && cp -r src/css dist/css",
-    "build:types": "node scripts/copy-types.mjs",
+    "build": "tsup && node scripts/build-css.mjs",
+    "build:types": "tsup --dts-only",
     "dev": "tsup --watch",
     "prepublishOnly": "pnpm run build",
     "lint": "echo 'Lint passed'",
@@ -124,10 +128,10 @@
       "optional": false
     }
   },
-  "dependencies": {},
   "devDependencies": {
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.0",
+    "lightningcss": "^1.32.0",
     "tsup": "^8.3.0",
     "typescript": "^5.6.0"
   },

package/dist/DatePicker.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"DatePicker.cjs"}

package/dist/DatePicker.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"DatePicker.js"}

package/dist/Label.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"Label.cjs"}

package/dist/Label.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"Label.js"}

package/dist/SearchSelect.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"SearchSelect.cjs"}

package/dist/SearchSelect.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"SearchSelect.js"}

package/dist/TableLoading.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"TableLoading.cjs"}

package/dist/TableLoading.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"TableLoading.js"}

package/dist/chunk-2JC4VIKL.cjs

@@ -1,2 +0,0 @@
-'use strict';var e=require('react'),jsxRuntime=require('react/jsx-runtime');function _interopNamespace(e){if(e&&e.__esModule)return e;var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var e__namespace=/*#__PURE__*/_interopNamespace(e);var a=e__namespace.forwardRef(({className:l,hf:t="default",required:r=true,label:o="Title"},b)=>jsxRuntime.jsxs("label",{htmlFor:t,className:l,ref:b,children:[o,r?jsxRuntime.jsx("b",{className:"text-danger",children:"*"}):""]}));a.displayName="Label";var d=a;exports.a=a;exports.b=d;//# sourceMappingURL=chunk-2JC4VIKL.cjs.map
-//# sourceMappingURL=chunk-2JC4VIKL.cjs.map

package/dist/chunk-2JC4VIKL.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/Label.jsx"],"names":["Label","e","className","hf","required","label","ref","jsxs","jsx","Label_default"],"mappings":"kbAUA,IAAMA,CAAAA,CAAcC,YAAA,CAAA,UAAA,CAAW,CAAC,CAAE,SAAA,CAAAC,CAAAA,CAAW,EAAA,CAAAC,CAAAA,CAAK,SAAA,CAAW,SAAAC,CAAAA,CAAW,IAAA,CAAM,KAAA,CAAAC,CAAAA,CAAQ,OAAQ,CAAA,CAAGC,IAE7FC,eAAAA,CAAC,OAAA,CAAA,CAAM,QAASJ,CAAAA,CAAI,SAAA,CAAWD,EAAW,GAAA,CAAKI,CAAAA,CAC5C,QAAA,CAAA,CAAAD,CAAAA,CAAOD,CAAAA,CAAWI,cAAAA,CAAC,KAAE,SAAA,CAAU,aAAA,CAAc,QAAA,CAAA,GAAA,CAAC,CAAA,CAAO,EAAA,CAAA,CACxD,CAEH,EAEDR,CAAAA,CAAM,WAAA,CAAc,OAAA,CAGpB,IAAOS,CAAAA,CAAQT","file":"chunk-2JC4VIKL.cjs","sourcesContent":["import * as React from 'react'\n\n/**\n * A simple Bootstrap-styled form label with an optional required indicator.\n *\n * @param {string}  [className]      - Additional CSS classes\n * @param {string}  [hf='default']   - htmlFor attribute (associates label with input ID)\n * @param {boolean} [required=true]  - Whether to show the required asterisk\n * @param {string}  [label='Title']  - Label text content\n */\nconst Label = React.forwardRef(({ className, hf = 'default', required = true, label = 'Title' }, ref) => {\n  return (\n    <label htmlFor={hf} className={className} ref={ref}>\n      {label}{required ? <b className=\"text-danger\">*</b> : ''}\n    </label>\n  )\n})\n\nLabel.displayName = 'Label'\n\nexport { Label }\nexport default Label\n"]}

package/dist/chunk-46AJ2Q5H.js

@@ -1,2 +0,0 @@
-function f(...t){let s=[];for(let e of t)if(e){if(typeof e=="string")s.push(e);else if(Array.isArray(e)){let o=f(...e);o&&s.push(o);}else if(typeof e=="object")for(let[o,n]of Object.entries(e))n&&s.push(o);}return s.join(" ")}export{f as a};//# sourceMappingURL=chunk-46AJ2Q5H.js.map
-//# sourceMappingURL=chunk-46AJ2Q5H.js.map

package/dist/chunk-46AJ2Q5H.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/lib/cn.js"],"names":["cn","args","classes","arg","nested","key","value"],"mappings":"AAeO,SAASA,CAAAA,CAAAA,GAAMC,CAAAA,CAAM,CAC1B,IAAMC,CAAAA,CAAU,EAAC,CAEjB,IAAA,IAAWC,CAAAA,IAAOF,CAAAA,CAChB,GAAKE,CAAAA,CAAAA,CAEL,GAAI,OAAOA,CAAAA,EAAQ,QAAA,CACjBD,CAAAA,CAAQ,IAAA,CAAKC,CAAG,CAAA,CAAA,KAAA,GACP,KAAA,CAAM,OAAA,CAAQA,CAAG,CAAA,CAAG,CAC7B,IAAMC,CAAAA,CAASJ,CAAAA,CAAG,GAAGG,CAAG,CAAA,CACpBC,CAAAA,EAAQF,CAAAA,CAAQ,IAAA,CAAKE,CAAM,EACjC,CAAA,KAAA,GAAW,OAAOD,CAAAA,EAAQ,QAAA,CACxB,IAAA,GAAW,CAACE,CAAAA,CAAKC,CAAK,CAAA,GAAK,MAAA,CAAO,OAAA,CAAQH,CAAG,CAAA,CACvCG,CAAAA,EAAOJ,CAAAA,CAAQ,IAAA,CAAKG,CAAG,EAAA,CAKjC,OAAOH,CAAAA,CAAQ,IAAA,CAAK,GAAG,CACzB","file":"chunk-46AJ2Q5H.js","sourcesContent":["/**\n * Utility for conditionally joining CSS class names together.\n * Filters out falsy values and joins with space.\n *\n * @param  {...any} args - Class name strings, objects, or arrays\n * @returns {string} Joined class string\n *\n * @example\n * cn('btn', isActive && 'btn-primary', 'px-3')\n * // => 'btn btn-primary px-3'\n *\n * @example\n * cn('base-class', { 'active': isActive, 'disabled': isDisabled })\n * // => 'base-class active'  (when isActive=true, isDisabled=false)\n */\nexport function cn(...args) {\n  const classes = []\n\n  for (const arg of args) {\n    if (!arg) continue\n\n    if (typeof arg === 'string') {\n      classes.push(arg)\n    } else if (Array.isArray(arg)) {\n      const nested = cn(...arg)\n      if (nested) classes.push(nested)\n    } else if (typeof arg === 'object') {\n      for (const [key, value] of Object.entries(arg)) {\n        if (value) classes.push(key)\n      }\n    }\n  }\n\n  return classes.join(' ')\n}\n"]}

package/dist/chunk-J4TRPVD4.cjs

@@ -1,2 +0,0 @@
-'use strict';require('react');var jsxRuntime=require('react/jsx-runtime');var e=({rows:l=5,columns:o=4})=>jsxRuntime.jsx(jsxRuntime.Fragment,{children:Array.from({length:l},(p,r)=>jsxRuntime.jsx("tr",{children:Array.from({length:o},(s,t)=>jsxRuntime.jsx("td",{className:"placeholder-glow",children:jsxRuntime.jsx("span",{className:"placeholder rounded py-2 col-12",style:{height:14,display:"block"}})},t))},r))});e.displayName="TableLoading";var c=e;exports.a=e;exports.b=c;//# sourceMappingURL=chunk-J4TRPVD4.cjs.map
-//# sourceMappingURL=chunk-J4TRPVD4.cjs.map

package/dist/chunk-J4TRPVD4.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/TableLoading.jsx"],"names":["TableLoading","rows","columns","jsx","Fragment","_","c","TableLoading_default"],"mappings":"0EAsBA,IAAMA,CAAAA,CAAe,CAAC,CAAE,IAAA,CAAAC,CAAAA,CAAO,CAAA,CAAG,QAAAC,CAAAA,CAAU,CAAE,CAAA,GAC5CC,cAAAA,CAAAC,mBAAAA,CAAA,CACG,QAAA,CAAA,KAAA,CAAM,IAAA,CAAK,CAAE,MAAA,CAAQH,CAAK,CAAA,CAAG,CAACI,CAAAA,CAAG,CAAA,GAChCF,cAAAA,CAAC,IAAA,CAAA,CACE,eAAM,IAAA,CAAK,CAAE,MAAA,CAAQD,CAAQ,CAAA,CAAG,CAACG,CAAAA,CAAGC,CAAAA,GACnCH,eAAC,IAAA,CAAA,CAAW,SAAA,CAAU,kBAAA,CACpB,QAAA,CAAAA,cAAAA,CAAC,MAAA,CAAA,CACC,SAAA,CAAU,iCAAA,CACV,MAAO,CAAE,MAAA,CAAQ,EAAA,CAAI,OAAA,CAAS,OAAQ,CAAA,CACxC,CAAA,CAAA,CAJOG,CAKT,CACD,CAAA,CAAA,CARM,CAST,CACD,CAAA,CACH,EAGFN,CAAAA,CAAa,WAAA,CAAc,cAAA,KAGpBO,CAAAA,CAAQP","file":"chunk-J4TRPVD4.cjs","sourcesContent":["import * as React from 'react'\n\n/**\n * Bootstrap 5 placeholder loading rows for table `<tbody>` elements.\n * Renders a grid of shimmer placeholders matching the table column count.\n *\n * @param {number} [rows=5]    - Number of placeholder rows to render\n * @param {number} [columns=4] - Number of placeholder columns per row\n *\n * @example\n * // Inside a table\n * <table className=\"table\">\n *   <thead><tr><th>Name</th><th>Class</th><th>Status</th></tr></thead>\n *   <tbody>\n *     {loading ? (\n *       <TableLoading rows={8} columns={3} />\n *     ) : (\n *       data.map(row => <tr key={row.id}>...</tr>)\n *     )}\n *   </tbody>\n * </table>\n */\nconst TableLoading = ({ rows = 5, columns = 4 }) => (\n  <>\n    {Array.from({ length: rows }, (_, r) => (\n      <tr key={r}>\n        {Array.from({ length: columns }, (_, c) => (\n          <td key={c} className=\"placeholder-glow\">\n            <span\n              className=\"placeholder rounded py-2 col-12\"\n              style={{ height: 14, display: 'block' }}\n            />\n          </td>\n        ))}\n      </tr>\n    ))}\n  </>\n)\n\nTableLoading.displayName = 'TableLoading'\n\nexport { TableLoading }\nexport default TableLoading\n"]}

package/dist/chunk-KZEOI42M.cjs

@@ -1,2 +0,0 @@
-'use strict';var chunkQQNPKA7A_cjs=require('./chunk-QQNPKA7A.cjs'),i=require('react'),reactDom=require('react-dom'),jsxRuntime=require('react/jsx-runtime');function _interopNamespace(e){if(e&&e.__esModule)return e;var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var i__namespace=/*#__PURE__*/_interopNamespace(i);var Ce=["Su","Mo","Tu","We","Th","Fr","Sa"],Ee=["January","February","March","April","May","June","July","August","September","October","November","December"],Ae=Array.from({length:60},(n,t)=>t),g=12,V=(n,t)=>new Date(n,t+1,0).getDate(),ne=(n,t)=>n&&t&&n.getFullYear()===t.getFullYear()&&n.getMonth()===t.getMonth()&&n.getDate()===t.getDate(),Ie=(n,t,r)=>!(t&&n<new Date(t.getFullYear(),t.getMonth(),t.getDate())||r&&n>new Date(r.getFullYear(),r.getMonth(),r.getDate())),Te=(n,t)=>{let r=new Date(n,t,1).getDay(),m=V(n,t),p=[],b=V(n,t-1);for(let d=r-1;d>=0;d--){let D=b-d;p.push({day:D,date:new Date(n,t-1,D),isOutside:true});}for(let d=1;d<=m;d++)p.push({day:d,date:new Date(n,t,d),isOutside:false});let y=42-p.length;for(let d=1;d<=y;d++)p.push({day:d,date:new Date(n,t+1,d),isOutside:true});return p},L=(n,t,r)=>{if(!n||isNaN(n.getTime()))return "";let m=n.getFullYear(),p=String(n.getMonth()+1).padStart(2,"0"),b=String(n.getDate()).padStart(2,"0"),y=n.getHours(),d=String(n.getMinutes()).padStart(2,"0"),D=y>=12?"PM":"AM";y=y%12||12;let k=String(y).padStart(2,"0");if(r)return r.replace("yyyy",m).replace("MM",p).replace("dd",b).replace("hh",k).replace("mm",d).replace("aa",D);switch(t){case "time":return `${k}:${d} ${D}`;case "datetime":return `${m}-${p}-${b} ${k}:${d} ${D}`;default:return `${m}-${p}-${b}`}},O=(n,t,r="date")=>({target:{value:n,name:t,type:r},preventDefault:()=>{},stopPropagation:()=>{},nativeEvent:null}),Fe={date:300,time:300,datetime:400,year:250},Oe=n=>{if(!n)return document.documentElement;let t=n.parentElement;for(;t;){let r=window.getComputedStyle(t),m=r.overflowY||r.overflow;if(m==="auto"||m==="scroll")return t;t=t.parentElement;}return document.documentElement},$e=(n,t)=>{if(!n)return {};let r=n.getBoundingClientRect(),m=t||300,p=window.innerHeight-r.bottom,b=r.top,y=p<m&&b>p,d=Math.max(r.width,window.innerWidth<576?220:260);return {position:"fixed",top:y?Math.max(4,r.top-m-4):r.bottom+4,left:Math.max(4,Math.min(r.left,window.innerWidth-d-4)),minWidth:d,maxWidth:window.innerWidth-8,zIndex:1070}},se=i__namespace.forwardRef(({className:n,mode:t="date",selected:r,value:m,onChange:p,dateFormat:b,placeholderText:y,size:d,isClearable:D=false,disabled:k=false,minDate:q,maxDate:z,timeIntervals:We=5,timezone:_e="Kampala",id:re,name:N,...ie},$)=>{let oe=e=>{if(!e)return null;if(e instanceof Date)return isNaN(e.getTime())?null:e;if(typeof e=="string"||typeof e=="number"){let a=new Date(e);if(!isNaN(a.getTime()))return a;if(typeof e=="string"){let l=e.match(/^(\d{1,2}):(\d{2})\s*(AM|PM)$/i);if(l){let c=parseInt(l[1],10),h=parseInt(l[2],10),_=l[3].toUpperCase();c===12&&_==="AM"&&(c=0),c!==12&&_==="PM"&&(c+=12);let X=new Date;return new Date(X.getFullYear(),X.getMonth(),X.getDate(),c,h,0,0)}let u=e.match(/^(\d{4})-(\d{2})-(\d{2})\s+(\d{1,2}):(\d{2})\s*(AM|PM)$/i);if(u){let c=parseInt(u[4],10),h=parseInt(u[5],10),_=u[6].toUpperCase();return c===12&&_==="AM"&&(c=0),c!==12&&_==="PM"&&(c+=12),new Date(parseInt(u[1]),parseInt(u[2])-1,parseInt(u[3]),c,h,0,0)}}return null}return null},o=i__namespace.useMemo(()=>oe(r??m),[r instanceof Date?r.getTime():r,m instanceof Date?m.getTime():m]),Z=t==="date"||t==="datetime",S=t==="time"||t==="datetime",[R,I]=i__namespace.useState(false),[x,K]=i__namespace.useState(()=>o?o.getFullYear():new Date().getFullYear()),[v,J]=i__namespace.useState(()=>o?o.getMonth():new Date().getMonth()),[w,P]=i__namespace.useState(o),[Y,ee]=i__namespace.useState(()=>o&&o.getHours()%12||12),[C,te]=i__namespace.useState(()=>o?o.getMinutes():0),[E,ae]=i__namespace.useState(()=>o&&o.getHours()>=12?"PM":"AM"),[U,T]=i__namespace.useState(false),[j,B]=i__namespace.useState(()=>Math.floor((o?o.getFullYear():new Date().getFullYear())/g)*g),[ce,le]=i__namespace.useState({}),F=i__namespace.useRef(null),H=i__namespace.useRef(null),G=i__namespace.useRef(null);i__namespace.useEffect(()=>{let e=document.createElement("div");return e.className="datepicker-portal-root",document.body.appendChild(e),G.current=e,()=>{e.parentNode&&document.body.removeChild(e),G.current=null;}},[]),i__namespace.useEffect(()=>{o&&!isNaN(o.getTime())?(P(o),K(o.getFullYear()),J(o.getMonth()),ee(o.getHours()%12||12),te(o.getMinutes()),ae(o.getHours()>=12?"PM":"AM"),B(Math.floor(o.getFullYear()/g)*g)):P(null);},[o]),i__namespace.useEffect(()=>{if(!R)return;let e=()=>H.current?H.current.getBoundingClientRect().height:Fe[U?"year":t]||300,a=Oe(F.current),l=()=>{requestAnimationFrame(()=>{le($e(F.current,e()));});};return l(),a.addEventListener("scroll",l,{passive:true}),window.addEventListener("resize",l),()=>{a.removeEventListener("scroll",l),window.removeEventListener("resize",l);}},[R,t,U]),i__namespace.useEffect(()=>{if(!R)return;let e=a=>{H.current&&!H.current.contains(a.target)&&F.current&&!F.current.contains(a.target)&&(I(false),T(false));};return document.addEventListener("mousedown",e),()=>document.removeEventListener("mousedown",e)},[R]);let A=(e,a,l,u)=>{let c=new Date(e),h=a%12;return u==="PM"&&(h+=12),h===12&&u==="AM"&&(h=0),c.setHours(h,l,0,0),c},W=e=>{if(!e||isNaN(e.getTime()))return;let a=L(e,t,b);p?.(O(a,N,t));},de=e=>{if(!e){p?.(O(null,N,t)),I(false),T(false);return}W(e),t==="date"&&(I(false),T(false));},ue=e=>{if(P(e),t==="date")de(e);else if(t==="datetime"){let a=A(e,Y,C,E);W(a);}},pe=Te(x,v),me=()=>{let e=x,a=v;v===0?(e=x-1,a=11):a=v-1,K(e),J(a);let l=w||new Date,u=V(e,a),c=new Date(e,a,Math.min(l.getDate(),u));P(c),W(S?A(c,Y,C,E):c);},fe=()=>{let e=x,a=v;v===11?(e=x+1,a=0):a=v+1,K(e),J(a);let l=w||new Date,u=V(e,a),c=new Date(e,a,Math.min(l.getDate(),u));P(c),W(S?A(c,Y,C,E):c);},be=new Date,ge=q?new Date(q.getFullYear(),q.getMonth(),q.getDate()):null,ye=z?new Date(z.getFullYear(),z.getMonth(),z.getDate()):null,ve=e=>{if(ee(e),S){let a=A(w||new Date,e,C,E);p?.(O(L(a,t,b),N,t));}},we=e=>{if(te(e),S){let a=A(w||new Date,Y,e,E);p?.(O(L(a,t,b),N,t));}},he=e=>{if(ae(e),S){let a=A(w||new Date,Y,C,e);p?.(O(L(a,t,b),N,t));}},Me=()=>{B(Math.floor(x/g)*g),T(true);},De=e=>{K(e),T(false);let a=w||new Date,l=V(e,v),u=new Date(e,v,Math.min(a.getDate(),l));P(u),W(S?A(u,Y,C,E):u);},Q=Math.floor(j/g)*g,ke=Array.from({length:g},(e,a)=>Q+a),Ne=e=>{e.stopPropagation(),P(null),p?.(O(null,N));},Se=e=>{e.key==="Escape"&&(I(false),T(false),F.current?.blur()),(e.key==="ArrowDown"||e.key==="Enter"||e.key===" ")&&(e.preventDefault(),I(true));},Re=i__namespace.useCallback(e=>{F.current=e,typeof $=="function"?$(e):$&&($.current=e);},[$]),xe=y??(t==="time"?"Select time":t==="datetime"?"Select date & time":"Select date"),Pe=jsxRuntime.jsxs("div",{ref:H,className:chunkQQNPKA7A_cjs.a("datepicker-popover card border shadow-sm",t==="datetime"&&"datepicker-popover--wide"),style:ce,children:[U&&Z&&jsxRuntime.jsxs("div",{className:"datepicker-year-picker p-3",children:[jsxRuntime.jsxs("div",{className:"d-flex align-items-center justify-content-between mb-2",children:[jsxRuntime.jsx("button",{type:"button",className:"btn btn-sm btn-outline-secondary border-0 px-1",onClick:()=>B(j-g),"aria-label":"Previous years",children:"\u2039"}),jsxRuntime.jsxs("span",{className:"fw-semibold small",children:[Q," \u2013 ",Q+g-1]}),jsxRuntime.jsx("button",{type:"button",className:"btn btn-sm btn-outline-secondary border-0 px-1",onClick:()=>B(j+g),"aria-label":"Next years",children:"\u203A"})]}),jsxRuntime.jsx("div",{className:"datepicker-year-grid",children:ke.map(e=>{let a=e===new Date().getFullYear(),l=w&&e===w.getFullYear();return jsxRuntime.jsx("button",{type:"button",className:chunkQQNPKA7A_cjs.a("datepicker-year-cell btn btn-sm",l&&"btn-primary",!l&&a&&"btn-outline-primary",!l&&!a&&"btn-light border"),onClick:()=>De(e),children:e},e)})})]}),!U&&jsxRuntime.jsx(jsxRuntime.Fragment,{children:jsxRuntime.jsxs("div",{className:chunkQQNPKA7A_cjs.a("d-flex",t==="datetime"?"flex-row":"flex-column"),children:[Z&&jsxRuntime.jsxs("div",{className:"datepicker-calendar p-2",children:[jsxRuntime.jsxs("div",{className:"d-flex align-items-center justify-content-between mb-2",children:[jsxRuntime.jsx("button",{type:"button",className:"btn btn-sm btn-outline-secondary border-0 px-1",onClick:me,"aria-label":"Previous month",children:"\u2039"}),jsxRuntime.jsxs("div",{className:"d-flex align-items-center gap-1",children:[jsxRuntime.jsx("span",{className:"fw-semibold small",children:Ee[v]}),jsxRuntime.jsx("button",{type:"button",className:"btn btn-sm btn-link text-decoration-none text-primary fw-semibold small p-0",onClick:Me,"aria-label":"Choose year",children:x})]}),jsxRuntime.jsx("button",{type:"button",className:"btn btn-sm btn-outline-secondary border-0 px-1",onClick:fe,"aria-label":"Next month",children:"\u203A"})]}),jsxRuntime.jsx("div",{className:"datepicker-days-header",children:Ce.map(e=>jsxRuntime.jsx("div",{className:"datepicker-day-label",children:e},e))}),jsxRuntime.jsx("div",{className:"datepicker-days-grid",children:pe.map((e,a)=>{let l=ne(e.date,be),u=w&&ne(e.date,w),c=Ie(e.date,ge,ye),h=e.isOutside||!c;return jsxRuntime.jsx("button",{type:"button",disabled:h,className:chunkQQNPKA7A_cjs.a("datepicker-day",l&&"datepicker-day--today",u&&"datepicker-day--selected",e.isOutside&&"datepicker-day--outside",!c&&"datepicker-day--disabled"),onClick:()=>ue(e.date),tabIndex:e.isOutside?-1:0,children:e.day},a)})})]}),t==="datetime"&&jsxRuntime.jsx("div",{className:"vr mx-1 my-2"}),S&&jsxRuntime.jsxs("div",{className:"datepicker-time p-2 d-flex flex-column",style:{minWidth:180},children:[t==="datetime"&&jsxRuntime.jsx("div",{className:"small fw-semibold text-muted text-center mb-1",children:"Time"}),jsxRuntime.jsxs("div",{className:"d-flex justify-content-center gap-2",children:[jsxRuntime.jsxs("div",{className:"datepicker-time-col",children:[jsxRuntime.jsx("div",{className:"datepicker-time-col-label",children:"Hour"}),jsxRuntime.jsx("div",{className:"datepicker-time-col-scroll",children:Array.from({length:12},(e,a)=>a+1).map(e=>jsxRuntime.jsx("button",{type:"button",className:chunkQQNPKA7A_cjs.a("datepicker-time-item",e===Y&&"active"),onClick:()=>ve(e),children:String(e).padStart(2,"0")},e))})]}),jsxRuntime.jsx("span",{className:"datepicker-time-separator",children:":"}),jsxRuntime.jsxs("div",{className:"datepicker-time-col",children:[jsxRuntime.jsx("div",{className:"datepicker-time-col-label",children:"Min"}),jsxRuntime.jsx("div",{className:"datepicker-time-col-scroll",children:Ae.map(e=>jsxRuntime.jsx("button",{type:"button",className:chunkQQNPKA7A_cjs.a("datepicker-time-item",e===C&&"active"),onClick:()=>we(e),children:String(e).padStart(2,"0")},e))})]}),jsxRuntime.jsxs("div",{className:"datepicker-time-col",children:[jsxRuntime.jsx("div",{className:"datepicker-time-col-label",children:"\xA0"}),jsxRuntime.jsx("div",{className:"d-flex flex-column gap-1 mt-1",children:["AM","PM"].map(e=>jsxRuntime.jsx("button",{type:"button",className:chunkQQNPKA7A_cjs.a("datepicker-time-item","datepicker-time-item--ampm",E===e&&"active"),onClick:()=>he(e),children:e},e))})]})]})]})]})})]});return jsxRuntime.jsxs("div",{className:"position-relative d-inline-block w-100",style:{minWidth:0},children:[jsxRuntime.jsxs("div",{className:"position-relative",children:[jsxRuntime.jsx("input",{ref:Re,id:re,name:N,type:"text",readOnly:true,disabled:k,className:chunkQQNPKA7A_cjs.a("form-control",d==="sm"&&"form-control-sm",d==="lg"&&"form-control-lg","pe-5",n),placeholder:xe,value:L(o,t,b),onClick:()=>!k&&I(!R),onKeyDown:Se,"aria-haspopup":"dialog","aria-expanded":R,autoComplete:"off",...ie}),D&&o&&!k&&jsxRuntime.jsx("button",{type:"button",className:"btn btn-sm btn-link position-absolute top-50 end-0 translate-middle-y pe-2 text-secondary",style:{zIndex:2},onClick:Ne,tabIndex:-1,"aria-label":"Clear",children:"\xD7"})]}),R&&!k&&G.current&&reactDom.createPortal(Pe,G.current)]})});se.displayName="DatePicker";var qe=se;exports.a=se;exports.b=qe;//# sourceMappingURL=chunk-KZEOI42M.cjs.map
-//# sourceMappingURL=chunk-KZEOI42M.cjs.map