@kaushverse/pickify 1.1.3 → 1.1.4

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 (5) hide show
  1. package/dist/index.d.mts +7 -4
  2. package/dist/index.d.ts +7 -4
  3. package/dist/index.js +30 -28
  4. package/dist/index.mjs +30 -28
  5. package/package.json +1 -1
package/dist/index.d.mts CHANGED
@@ -130,22 +130,25 @@ declare function MultiPickerModal({ visible, setVisible, selectedValues, options
130
130
 
131
131
  type Action = {
132
132
  icon: string;
133
- onPress: () => void;
133
+ onPress?: () => void;
134
+ navigateTo?: () => void;
135
+ color?: string;
136
+ iconColor?: string;
134
137
  };
135
138
  type FloatingButtonStyles = {
136
139
  container?: ViewStyle;
137
140
  mainButton?: ViewStyle;
138
141
  secondaryButton?: ViewStyle;
139
- mainIcon?: TextStyle;
140
- secondaryIcon?: TextStyle;
141
142
  };
142
143
  type Props = {
143
144
  actions: Action[];
144
145
  mode?: "vertical" | "horizontal" | "circle";
145
146
  radius?: number;
146
- renderIcon?: IconRenderer;
147
+ renderMainIcon?: IconRenderer;
148
+ renderItemIcon?: IconRenderer;
147
149
  styles?: FloatingButtonStyles;
148
150
  style?: ViewStyle;
151
+ mainIconName?: string;
149
152
  };
150
153
  declare class FloatingButton extends React$1.Component<Props> {
151
154
  animation: Animated.Value;
package/dist/index.d.ts CHANGED
@@ -130,22 +130,25 @@ declare function MultiPickerModal({ visible, setVisible, selectedValues, options
130
130
 
131
131
  type Action = {
132
132
  icon: string;
133
- onPress: () => void;
133
+ onPress?: () => void;
134
+ navigateTo?: () => void;
135
+ color?: string;
136
+ iconColor?: string;
134
137
  };
135
138
  type FloatingButtonStyles = {
136
139
  container?: ViewStyle;
137
140
  mainButton?: ViewStyle;
138
141
  secondaryButton?: ViewStyle;
139
- mainIcon?: TextStyle;
140
- secondaryIcon?: TextStyle;
141
142
  };
142
143
  type Props = {
143
144
  actions: Action[];
144
145
  mode?: "vertical" | "horizontal" | "circle";
145
146
  radius?: number;
146
- renderIcon?: IconRenderer;
147
+ renderMainIcon?: IconRenderer;
148
+ renderItemIcon?: IconRenderer;
147
149
  styles?: FloatingButtonStyles;
148
150
  style?: ViewStyle;
151
+ mainIconName?: string;
149
152
  };
150
153
  declare class FloatingButton extends React$1.Component<Props> {
151
154
  animation: Animated.Value;
package/dist/index.js CHANGED
@@ -597,7 +597,7 @@ var FloatingButton = class extends import_react4.default.Component {
597
597
  mode = "vertical",
598
598
  radius = 100,
599
599
  actions,
600
- renderIcon,
600
+ renderItemIcon,
601
601
  styles: styles2
602
602
  } = this.props;
603
603
  let translateX = 0;
@@ -609,8 +609,9 @@ var FloatingButton = class extends import_react4.default.Component {
609
609
  translateX = -60 * (index + 1);
610
610
  }
611
611
  if (mode === "circle") {
612
- const angle = index / actions.length * Math.PI;
613
- translateX = radius * Math.cos(angle);
612
+ const angleStep = Math.PI / 2;
613
+ const angle = index / (actions.length - 1 || 1) * angleStep;
614
+ translateX = -radius * Math.cos(angle);
614
615
  translateY = -radius * Math.sin(angle);
615
616
  }
616
617
  const animStyle = {
@@ -641,16 +642,22 @@ var FloatingButton = class extends import_react4.default.Component {
641
642
  {
642
643
  onPress: () => {
643
644
  this.toggleMenu();
644
- action.onPress();
645
+ action.onPress?.();
646
+ action.navigateTo?.();
645
647
  },
646
648
  children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
647
649
  import_react_native5.Animated.View,
648
650
  {
649
- style: [defaultStyles4.secondary, styles2?.secondaryButton, animStyle],
650
- children: renderIcon?.({
651
+ style: [
652
+ defaultStyles4.secondary,
653
+ styles2?.secondaryButton,
654
+ { backgroundColor: action.color || "#F02A4B" },
655
+ animStyle
656
+ ],
657
+ children: renderItemIcon?.({
651
658
  name: action.icon,
652
659
  size: 20,
653
- color: "#FFF"
660
+ color: action.iconColor || "#FFF"
654
661
  })
655
662
  }
656
663
  )
@@ -659,7 +666,7 @@ var FloatingButton = class extends import_react4.default.Component {
659
666
  );
660
667
  };
661
668
  render() {
662
- const { actions, renderIcon, styles: styles2, style } = this.props;
669
+ const { actions, renderMainIcon, styles: styles2, style, mainIconName } = this.props;
663
670
  const rotation = {
664
671
  transform: [
665
672
  {
@@ -670,26 +677,21 @@ var FloatingButton = class extends import_react4.default.Component {
670
677
  }
671
678
  ]
672
679
  };
673
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
674
- import_react_native5.View,
675
- {
676
- style: [defaultStyles4.container, styles2?.container, this.props.style],
677
- children: [
678
- actions.map(this.renderAction),
679
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react_native5.TouchableWithoutFeedback, { onPress: this.toggleMenu, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
680
- import_react_native5.Animated.View,
681
- {
682
- style: [defaultStyles4.button, styles2?.mainButton, rotation],
683
- children: renderIcon?.({
684
- name: "plus",
685
- size: 26,
686
- color: "#FFF"
687
- })
688
- }
689
- ) })
690
- ]
691
- }
692
- );
680
+ const mainIcon = mainIconName || "add";
681
+ return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react_native5.View, { style: [defaultStyles4.container, styles2?.container, style], children: [
682
+ actions.map(this.renderAction),
683
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react_native5.TouchableWithoutFeedback, { onPress: this.toggleMenu, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
684
+ import_react_native5.Animated.View,
685
+ {
686
+ style: [defaultStyles4.button, styles2?.mainButton, rotation],
687
+ children: renderMainIcon?.({
688
+ name: mainIcon,
689
+ size: 26,
690
+ color: "#FFF"
691
+ })
692
+ }
693
+ ) })
694
+ ] });
693
695
  }
694
696
  };
695
697
  var defaultStyles4 = import_react_native5.StyleSheet.create({
package/dist/index.mjs CHANGED
@@ -580,7 +580,7 @@ var FloatingButton = class extends React4.Component {
580
580
  mode = "vertical",
581
581
  radius = 100,
582
582
  actions,
583
- renderIcon,
583
+ renderItemIcon,
584
584
  styles: styles2
585
585
  } = this.props;
586
586
  let translateX = 0;
@@ -592,8 +592,9 @@ var FloatingButton = class extends React4.Component {
592
592
  translateX = -60 * (index + 1);
593
593
  }
594
594
  if (mode === "circle") {
595
- const angle = index / actions.length * Math.PI;
596
- translateX = radius * Math.cos(angle);
595
+ const angleStep = Math.PI / 2;
596
+ const angle = index / (actions.length - 1 || 1) * angleStep;
597
+ translateX = -radius * Math.cos(angle);
597
598
  translateY = -radius * Math.sin(angle);
598
599
  }
599
600
  const animStyle = {
@@ -624,16 +625,22 @@ var FloatingButton = class extends React4.Component {
624
625
  {
625
626
  onPress: () => {
626
627
  this.toggleMenu();
627
- action.onPress();
628
+ action.onPress?.();
629
+ action.navigateTo?.();
628
630
  },
629
631
  children: /* @__PURE__ */ jsx5(
630
632
  Animated2.View,
631
633
  {
632
- style: [defaultStyles4.secondary, styles2?.secondaryButton, animStyle],
633
- children: renderIcon?.({
634
+ style: [
635
+ defaultStyles4.secondary,
636
+ styles2?.secondaryButton,
637
+ { backgroundColor: action.color || "#F02A4B" },
638
+ animStyle
639
+ ],
640
+ children: renderItemIcon?.({
634
641
  name: action.icon,
635
642
  size: 20,
636
- color: "#FFF"
643
+ color: action.iconColor || "#FFF"
637
644
  })
638
645
  }
639
646
  )
@@ -642,7 +649,7 @@ var FloatingButton = class extends React4.Component {
642
649
  );
643
650
  };
644
651
  render() {
645
- const { actions, renderIcon, styles: styles2, style } = this.props;
652
+ const { actions, renderMainIcon, styles: styles2, style, mainIconName } = this.props;
646
653
  const rotation = {
647
654
  transform: [
648
655
  {
@@ -653,26 +660,21 @@ var FloatingButton = class extends React4.Component {
653
660
  }
654
661
  ]
655
662
  };
656
- return /* @__PURE__ */ jsxs5(
657
- View5,
658
- {
659
- style: [defaultStyles4.container, styles2?.container, this.props.style],
660
- children: [
661
- actions.map(this.renderAction),
662
- /* @__PURE__ */ jsx5(TouchableWithoutFeedback, { onPress: this.toggleMenu, children: /* @__PURE__ */ jsx5(
663
- Animated2.View,
664
- {
665
- style: [defaultStyles4.button, styles2?.mainButton, rotation],
666
- children: renderIcon?.({
667
- name: "plus",
668
- size: 26,
669
- color: "#FFF"
670
- })
671
- }
672
- ) })
673
- ]
674
- }
675
- );
663
+ const mainIcon = mainIconName || "add";
664
+ return /* @__PURE__ */ jsxs5(View5, { style: [defaultStyles4.container, styles2?.container, style], children: [
665
+ actions.map(this.renderAction),
666
+ /* @__PURE__ */ jsx5(TouchableWithoutFeedback, { onPress: this.toggleMenu, children: /* @__PURE__ */ jsx5(
667
+ Animated2.View,
668
+ {
669
+ style: [defaultStyles4.button, styles2?.mainButton, rotation],
670
+ children: renderMainIcon?.({
671
+ name: mainIcon,
672
+ size: 26,
673
+ color: "#FFF"
674
+ })
675
+ }
676
+ ) })
677
+ ] });
676
678
  }
677
679
  };
678
680
  var defaultStyles4 = StyleSheet5.create({
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kaushverse/pickify",
3
- "version": "1.1.3",
3
+ "version": "1.1.4",
4
4
  "description": "A fully customizable React Native picker with search, multi-select, grouping, and async support.",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",