@infonomic/uikit 5.36.0 → 5.36.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/components/button/combo-button.d.ts +5 -1
  2. package/dist/components/button/combo-button.d.ts.map +1 -1
  3. package/dist/components/button/combo-button.js +5 -5
  4. package/package.json +1 -1
  5. package/src/components/button/combo-button.tsx +13 -4
  6. package/src/components/button/combo-buttons.stories.tsx +3 -1
package/dist/components/button/combo-button.d.ts CHANGED
@@ -6,6 +6,10 @@ export type ComboButtonProps = ButtonProps & {
6
6
  }[];
7
7
  onButtonClick?: () => void;
8
8
  onOptionSelect?: (value: string) => void;
9
+ children?: React.ReactNode;
10
+ align?: 'start' | 'center' | 'end';
11
+ dataSide?: 'top' | 'bottom' | 'left' | 'right';
12
+ sideOffset?: number;
9
13
  };
10
- export declare const ComboButton: ({ options, onButtonClick, onOptionSelect, ...rest }: ComboButtonProps) => import("react").JSX.Element;
14
+ export declare const ComboButton: ({ options, onButtonClick, onOptionSelect, children, align, dataSide, sideOffset, ...rest }: ComboButtonProps) => import("react").JSX.Element;
11
15
  //# sourceMappingURL=combo-button.d.ts.map
package/dist/components/button/combo-button.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"combo-button.d.ts","sourceRoot":"","sources":["../../../src/components/button/combo-button.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,UAAU,CAAA;AAGnD,MAAM,MAAM,gBAAgB,GAAG,WAAW,GAAG;IAC3C,OAAO,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAA;IAC3C,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAC1B,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CACzC,CAAA;AAED,eAAO,MAAM,WAAW,GAAI,qDAKzB,gBAAgB,gCAiClB,CAAA"}
1
+ {"version":3,"file":"combo-button.d.ts","sourceRoot":"","sources":["../../../src/components/button/combo-button.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,UAAU,CAAA;AAGnD,MAAM,MAAM,gBAAgB,GAAG,WAAW,GAAG;IAC3C,OAAO,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAA;IAC3C,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAC1B,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACxC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAA;IAClC,QAAQ,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAA;IAC9C,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB,CAAA;AAGD,eAAO,MAAM,WAAW,GAAI,4FASzB,gBAAgB,gCAiClB,CAAA"}
package/dist/components/button/combo-button.js CHANGED
@@ -4,14 +4,14 @@ import { ChevronDownIcon } from "../../icons/chevron-down-icon.js";
4
4
  import { Dropdown } from "../dropdown/dropdown.js";
5
5
  import { Button } from "./button.js";
6
6
  import combo_button_module from "./combo-button.module.js";
7
- const ComboButton = ({ options, onButtonClick, onOptionSelect, ...rest })=>/*#__PURE__*/ jsxs("div", {
7
+ const ComboButton = ({ options, onButtonClick, onOptionSelect, children, align = 'end', dataSide = 'top', sideOffset = 5, ...rest })=>/*#__PURE__*/ jsxs("div", {
8
8
  className: classnames('combo-button-wrapper', combo_button_module["combo-button-wrapper"]),
9
9
  children: [
10
10
  /*#__PURE__*/ jsx(Button, {
11
11
  className: classnames('combo-button-button', combo_button_module["combo-button-button"]),
12
12
  ...rest,
13
13
  onClick: onButtonClick,
14
- children: "Combo Button"
14
+ children: children
15
15
  }),
16
16
  /*#__PURE__*/ jsxs(Dropdown.Root, {
17
17
  children: [
@@ -29,9 +29,9 @@ const ComboButton = ({ options, onButtonClick, onOptionSelect, ...rest })=>/*#__
29
29
  /*#__PURE__*/ jsx(Dropdown.Portal, {
30
30
  children: /*#__PURE__*/ jsx(Dropdown.Content, {
31
31
  className: classnames('combo-button-options', combo_button_module["combo-button-options"]),
32
- align: "end",
33
- "data-side": "top",
34
- sideOffset: 5,
32
+ align: align,
33
+ "data-side": dataSide,
34
+ sideOffset: sideOffset,
35
35
  children: options.map((option)=>/*#__PURE__*/ jsx(Dropdown.Item, {
36
36
  onSelect: ()=>onOptionSelect?.(option.value),
37
37
  children: /*#__PURE__*/ jsx("div", {
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@infonomic/uikit",
3
3
  "private": false,
4
4
  "license": "MIT",
5
- "version": "5.36.0",
5
+ "version": "5.36.1",
6
6
  "type": "module",
7
7
  "description": "Infonomic UI kit is a collection of reusable UI components and utilities for React and Astro.",
8
8
  "keywords": [
package/src/components/button/combo-button.tsx CHANGED
@@ -9,18 +9,27 @@ export type ComboButtonProps = ButtonProps & {
9
9
  options: { label: string; value: string }[]
10
10
  onButtonClick?: () => void
11
11
  onOptionSelect?: (value: string) => void
12
+ children?: React.ReactNode
13
+ align?: 'start' | 'center' | 'end'
14
+ dataSide?: 'top' | 'bottom' | 'left' | 'right'
15
+ sideOffset?: number
12
16
  }
13
17
 
18
+
14
19
  export const ComboButton = ({
15
20
  options,
16
21
  onButtonClick,
17
22
  onOptionSelect,
23
+ children,
24
+ align = 'end',
25
+ dataSide = 'top',
26
+ sideOffset = 5,
18
27
  ...rest
19
28
  }: ComboButtonProps) => {
20
29
  return (
21
30
  <div className={cx('combo-button-wrapper', styles['combo-button-wrapper'])}>
22
31
  <Button className={cx('combo-button-button', styles['combo-button-button'])} {...rest} onClick={onButtonClick}>
23
- Combo Button
32
+ {children}
24
33
  </Button>
25
34
  <DropdownComponent.Root>
26
35
  <DropdownComponent.Trigger asChild>
@@ -32,9 +41,9 @@ export const ComboButton = ({
32
41
  <DropdownComponent.Portal>
33
42
  <DropdownComponent.Content
34
43
  className={cx('combo-button-options', styles['combo-button-options'])}
35
- align="end"
36
- data-side="top"
37
- sideOffset={5}
44
+ align={align}
45
+ data-side={dataSide}
46
+ sideOffset={sideOffset}
38
47
  >
39
48
  {options.map((option) => (
40
49
  <DropdownComponent.Item
package/src/components/button/combo-buttons.stories.tsx CHANGED
@@ -24,7 +24,9 @@ const ComboButtonDemo = (): React.JSX.Element => {
24
24
  <div className="ml-12 mb-6">
25
25
  <h2 style={{ fontSize: '1.2rem', margin: '1rem 0' }}>Combo Button</h2>
26
26
  <div className="flex items-center gap-4 mb-6">
27
- <ComboButton size="sm" options={options} onButtonClick={handleButtonClick} onOptionSelect={handleOptionSelect} />
27
+ <ComboButton size="sm" options={options} onButtonClick={handleButtonClick} onOptionSelect={handleOptionSelect} >
28
+ Combo Button
29
+ </ComboButton>
28
30
  </div>
29
31
  </div>
30
32
  </div>