https://ki-admin-react-tailwind.vercel.app/assets/index-DcH-sHcQ.js

1import{j as e}from"./index-BYTsMFJV.js";import{a as d}from"./BriefcaseMetal.es-Cskfq8ci.js";import{B as l}from"./Breadcrumb-DONwcLnw.js";import{P as r}from"./CodeBlock-BfPGtk3f.js";import{c as a}from"./chunk-QNLCCAKT-D9OEvnc5.js";import{c as s}from"./chunk-C6WKGNND-D5nI-7qz.js";import{c as o}from"./chunk-SAEUDNWW-BTNhm6aT.js";import"./AppRoutes-m5gnORHH.js";import"./IconCheck-Dp20lYz9.js";import"./IconCopy-BNzj11z2.js";const t=`<div className="container-fluid">
2  <Row>
3    <Col md="6">
4      <Card>
5        <Card.Header>
6          <h5>Select by class</h5>
7        </Card.Header>
8        <Card.Body>
9          <select className="select1 form-control" multiple>
10            <option value="1">One</option>
11            <option value="2">Two</option>
12            <option value="3">Three</option>
13          </select>
14        </Card.Body>
15      </Card>
16    </Col>
17  </Row>
18</div>`,c=`.dual-listbox .dual-listbox__button {
19  border-radius: 5px;
20  background-color: rgba(var(--primary), 0.9);
21  padding: 7px 12px;
22}
23.dual-listbox .dual-listbox__button:hover {
24  background-color: rgba(var(--primary), 1);
25  transition: all 0.3s ease;
26}
27.dual-listbox .dual-listbox__item--selected {
28  background-color: rgba(var(--primary), 0.1);
29  color: rgba(var(--primary), 1);
30}`,i=`.dual-listbox {
31  width: 100%;
32
33  .dual-listbox__container {
34    display: flex;
35    justify-content: space-between;
36  }
37
38  .dual-listbox__search {
39    padding: 0.4rem 0.75rem;
40    border: 1px solid var(--border_color);
41    border-radius: 0.3rem;
42
43    &:focus {
44      box-shadow: 0 0 0 0.25rem rgba(var(--primary), 0.3);
45      border-color: rgba(var(--primary), 1);
46    }
47  }
48}`,n=`var dlb4 = new DualListbox(".select4", {
49  showSortButtons: true,
50});
51
52var sources = document.querySelectorAll(".source");
53sources.forEach(source => {
54  source.addEventListener("click", e => {
55    document
56      .querySelector("." + e.currentTarget.dataset.source)
57      .classList.toggle("open");
58  });
59});`,y=()=>e.jsxs("div",{className:"container-fluid",children:[e.jsx(l,{mainTitle:"Prismjs",title:"Advance Ui",path:["Prismjs"],Icon:d}),e.jsxs("div",{className:"grid grid-cols-12 gap-x-6",children:[e.jsxs("div",{className:"col-span-12 xl:col-span-6",children:[e.jsxs(a,{className:"card dark:bg-[var(--bs-body-bg)]",children:[e.jsx(s,{className:"card-header p-0 border-b border-default-200",children:e.jsx("h5",{className:"text-h5 font-semibold dark:text-white/75",children:"Dual Listboxes - HTML"})}),e.jsx(o,{children:e.jsx(r,{code:t,language:"html",copyButton:!1})})]}),e.jsxs(a,{className:"card dark:bg-[var(--bs-body-bg)]",children:[e.jsx(s,{className:"card-header p-0 border-b border-default-200",children:e.jsx("h5",{className:"text-h5 font-semibold dark:text-white/75",children:"Dual Listboxes - CSS"})}),e.jsx(o,{children:e.jsx(r,{code:c,language:"css",copyButton:!1})})]})]}),e.jsxs("div",{className:"col-span-12 xl:col-span-6",children:[e.jsxs(a,{className:"card dark:bg-[var(--bs-body-bg)]",children:[e.jsx(s,{className:"card-header p-0 border-b border-default-200",children:e.jsx("h5",{className:"text-h5 font-semibold dark:text-white/75",children:"Dual Listboxes - SCSS"})}),e.jsx(o,{children:e.jsx(r,{code:i,language:"css",copyButton:!1})})]}),e.jsxs(a,{className:"card dark:bg-[var(--bs-body-bg)]",children:[e.jsx(s,{className:"card-header p-0 border-b border-default-200",children:e.jsx("h5",{className:"text-h5 font-semibold dark:text-white/75",children:"Dual Listboxes - JavaScript"})}),e.jsx(o,{children:e.jsx(r,{code:n,language:"javascript",copyButton:!1})})]})]})]})]});export{y as default};