@pixum/combobox 5.3.2-alpha.139 → 5.3.2-alpha.145

package/lib/index.d.ts

@@ -1,3 +1,4 @@
 import { ComboBox } from './ComboBox';
 export default ComboBox;
 export * from './types';
+export { ComboBoxSlotContainer } from './partials';

package/lib/index.js

@@ -1,4 +1,5 @@
 import { ComboBox } from './ComboBox';
 export default ComboBox;
 export * from './types';
+export { ComboBoxSlotContainer } from './partials';
 //# sourceMappingURL=index.js.map

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,eAAe,QAAQ,CAAA;AACvB,cAAc,SAAS,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,eAAe,QAAQ,CAAA;AACvB,cAAc,SAAS,CAAA;AACvB,OAAO,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAA"}

package/lib/partials/ComboBoxSlotContainer.d.ts

@@ -0,0 +1,29 @@
+import type { ReactNode } from 'react';
+import '../styles.css';
+/**
+ * Styled container for optionsSlot content.
+ *
+ * Applies the standard ComboBox dropdown appearance — white background,
+ * border, border-radius, box-shadow and top margin — so consumers don't
+ * have to replicate it in every optionsSlot implementation.
+ *
+ * Use it as the outermost wrapper of your optionsSlot:
+ *
+ * ```tsx
+ * import ComboBox, { ComboBoxSlotContainer } from '@pixum/combobox'
+ *
+ * <ComboBox
+ *   optionsSlot={
+ *     <ComboBoxSlotContainer>
+ *       <MyCustomOptionsList />
+ *     </ComboBoxSlotContainer>
+ *   }
+ * />
+ * ```
+ *
+ * @param children - The slot content to render inside the container
+ * @returns A styled wrapper div matching the ComboBox dropdown look
+ */
+export declare function ComboBoxSlotContainer({ children }: {
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;

package/lib/partials/ComboBoxSlotContainer.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import '../styles.css';
+/**
+ * Styled container for optionsSlot content.
+ *
+ * Applies the standard ComboBox dropdown appearance — white background,
+ * border, border-radius, box-shadow and top margin — so consumers don't
+ * have to replicate it in every optionsSlot implementation.
+ *
+ * Use it as the outermost wrapper of your optionsSlot:
+ *
+ * ```tsx
+ * import ComboBox, { ComboBoxSlotContainer } from '@pixum/combobox'
+ *
+ * <ComboBox
+ *   optionsSlot={
+ *     <ComboBoxSlotContainer>
+ *       <MyCustomOptionsList />
+ *     </ComboBoxSlotContainer>
+ *   }
+ * />
+ * ```
+ *
+ * @param children - The slot content to render inside the container
+ * @returns A styled wrapper div matching the ComboBox dropdown look
+ */
+export function ComboBoxSlotContainer({ children }) {
+    return _jsx("div", { className: "combobox__slot-container", children: children });
+}
+//# sourceMappingURL=ComboBoxSlotContainer.js.map

package/lib/partials/ComboBoxSlotContainer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ComboBoxSlotContainer.js","sourceRoot":"","sources":["../../src/partials/ComboBoxSlotContainer.tsx"],"names":[],"mappings":";AACA,OAAO,eAAe,CAAA;AAEtB;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,MAAM,UAAU,qBAAqB,CAAC,EAAE,QAAQ,EAA2B;IACzE,OAAO,cAAK,SAAS,EAAC,0BAA0B,YAAE,QAAQ,GAAO,CAAA;AACnE,CAAC"}

package/lib/partials/index.d.ts

@@ -1,3 +1,4 @@
 export * from './ComboBoxOptions';
 export * from './ComboBoxOptionsWithGrouping';
 export * from './ComboBoxOptionsItems';
+export * from './ComboBoxSlotContainer';

package/lib/partials/index.js

@@ -1,4 +1,5 @@
 export * from './ComboBoxOptions';
 export * from './ComboBoxOptionsWithGrouping';
 export * from './ComboBoxOptionsItems';
+export * from './ComboBoxSlotContainer';
 //# sourceMappingURL=index.js.map

package/lib/partials/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/partials/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAA;AACjC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,wBAAwB,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/partials/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAA;AACjC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,wBAAwB,CAAA;AACtC,cAAc,yBAAyB,CAAA"}

package/lib/styles.css

@@ -1 +1 @@
-.combobox{position:relative;width:100%}.combobox .combobox--headline[class*=text--]+*{margin-top:var(--spacing)}.combobox .combobox--header,.combobox .combobox__options,.combobox__bottom-sheet .combobox__options{position:relative}.combobox__bottom-sheet .combobox--header{align-items:flex-start;height:auto;margin:var(--spacing-5) auto var(--spacing-2);padding:0 var(--spacing-2);width:100%}.combobox .combobox__options,.combobox__bottom-sheet .combobox__options{background-color:var(--color-surface,#fff);display:flex;flex-direction:column;max-height:none;overflow:scroll;width:100%}.combobox .combobox__option-wrapper,.combobox__bottom-sheet .combobox__option-wrapper{touch-action:manipulation;-webkit-tap-highlight-color:transparent;cursor:pointer;-webkit-user-select:none;user-select:none}.combobox .combobox__options .combobox__sticky-header,.combobox__bottom-sheet .combobox__options .combobox__sticky-header{background-color:var(--color-surface);border-bottom:1px solid var(--color-dim);padding:var(--spacing-1_25) var(--spacing-2);position:-webkit-sticky;position:sticky;top:0}.combobox__options .text--caption{color:var(--color-on-secondary)}.combobox .combobox__options .item-header,.combobox__bottom-sheet .combobox__options .item-header{display:flex;justify-content:space-between}.combobox .combobox__options .combobox__option-details,.combobox__bottom-sheet .combobox__options .combobox__option-details{background-color:var(--color-surface);bottom:0;padding-left:var(--spacing);padding-right:var(--spacing);position:-webkit-sticky;position:sticky}.combobox .combobox--no-results-text,.combobox__bottom-sheet .combobox--no-results-text{padding:var(--spacing-2) var(--spacing);text-align:center}@media screen and (min-width:960px){.combobox .combobox{background-color:var(--color-surface,#fff);border-radius:12px;margin-top:var(--spacing)}.combobox .combobox__options{border-radius:12px;margin-top:var(--spacing);max-height:330px;overflow:auto;position:absolute}}
+.combobox{position:relative;width:100%}.combobox .combobox--headline[class*=text--]+*{margin-top:var(--spacing)}.combobox .combobox--header,.combobox .combobox__options,.combobox__bottom-sheet .combobox__options{position:relative}.combobox__bottom-sheet .combobox--header{align-items:flex-start;height:auto;margin:var(--spacing-5) auto var(--spacing-2);padding:0 var(--spacing-2);width:100%}.combobox .combobox__options,.combobox__bottom-sheet .combobox__options{display:flex;flex-direction:column;max-height:none;overflow:scroll;width:100%}.combobox .combobox__option-wrapper,.combobox__bottom-sheet .combobox__option-wrapper{touch-action:manipulation;-webkit-tap-highlight-color:transparent;cursor:pointer;-webkit-user-select:none;user-select:none}.combobox .combobox__options .combobox__sticky-header,.combobox__bottom-sheet .combobox__options .combobox__sticky-header{background-color:var(--color-surface);border-bottom:1px solid var(--color-dim);padding:var(--spacing-1_25) var(--spacing-2);position:-webkit-sticky;position:sticky;top:0}.combobox__options .text--caption{color:var(--color-on-secondary)}.combobox .combobox__options .item-header,.combobox__bottom-sheet .combobox__options .item-header{display:flex;justify-content:space-between}.combobox .combobox__options .combobox__option-details,.combobox__bottom-sheet .combobox__options .combobox__option-details{background-color:var(--color-surface);bottom:0;padding-left:var(--spacing);padding-right:var(--spacing);position:-webkit-sticky;position:sticky}.combobox .combobox--no-results-text,.combobox__bottom-sheet .combobox--no-results-text{padding:var(--spacing-2) var(--spacing);text-align:center}@media screen and (min-width:960px){.combobox .combobox__options{border-radius:12px;margin-top:var(--spacing);max-height:330px;overflow:auto;position:absolute}}.combobox__slot-container{background-color:var(--color-surface,#fff);border:1px solid var(--color-dim,#e0e0e0);border-radius:12px;box-shadow:0 4px 12px #00000014;margin-top:var(--spacing,8px)}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pixum/combobox",
-  "version": "5.3.2-alpha.139+e1b33763c",
+  "version": "5.3.2-alpha.145+1d6d8fabc",
   "main": "lib/index.js",
   "module": "lib/index.js",
   "license": "UNLICENSED",
@@ -18,5 +18,5 @@
   "sideEffects": [
     "*.css"
   ],
-  "gitHead": "e1b33763c620f070f3fba987611be5f9fe946635"
+  "gitHead": "1d6d8fabcca4e4b4813454da2281904a9108d18c"
 }