aport-tools 4.1.23 → 4.1.24

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.
package/dist/index.js CHANGED
@@ -1,4 +1,4 @@
1
- /*! aport-tools v4.1.23 | ISC */
1
+ /*! aport-tools v4.1.24 | ISC */
2
2
  'use strict';
3
3
 
4
4
  var React = require('react');
@@ -365,173 +365,62 @@ var styles$6 = reactNative.StyleSheet.create({
365
365
  }
366
366
  });
367
367
 
368
- // src/components/Button.tsx
369
- /**
370
- * Determines the styles based on the button type and whether it is disabled.
371
- *
372
- * @param type - The type of the button ('submit', 'button', 'cancel').
373
- * @param disabled - Whether the button is disabled.
374
- * @param themeColors - The theme colors.
375
- * @returns The computed style for the button.
376
- */
377
- function typeStyles(type, disabled, themeColors) {
378
- switch (type) {
379
- case 'submit':
380
- return {
381
- backgroundColor: "rgba(".concat(themeColors === null || themeColors === void 0 ? void 0 : themeColors.primary.rgb.r, ", ").concat(themeColors === null || themeColors === void 0 ? void 0 : themeColors.primary.rgb.g, ", ").concat(themeColors === null || themeColors === void 0 ? void 0 : themeColors.primary.rgb.b, ", ").concat(disabled ? 0.5 : 1, ")"),
382
- borderWidth: 2,
383
- borderColor: themeColors === null || themeColors === void 0 ? void 0 : themeColors.primary.hex
384
- };
385
- case 'button':
386
- return {
387
- backgroundColor: themeColors === null || themeColors === void 0 ? void 0 : themeColors.primary.hex,
388
- borderColor: themeColors === null || themeColors === void 0 ? void 0 : themeColors.secondary.hex,
389
- opacity: disabled ? 0.5 : 1,
390
- borderWidth: 2
391
- };
392
- case 'cancel':
393
- return {
394
- backgroundColor: themeColors === null || themeColors === void 0 ? void 0 : themeColors.background.hex,
395
- borderWidth: 0
396
- };
397
- default:
398
- return {};
368
+ // src/forms/FormContext.tsx
369
+ var FormContext = /*#__PURE__*/React.createContext(undefined);
370
+ var useFormContext = function useFormContext() {
371
+ var context = React.useContext(FormContext);
372
+ if (!context) {
373
+ throw new Error("useFormContext must be used within a Form");
399
374
  }
400
- }
401
- /**
402
- * Button component that adapts its styles based on the current theme.
403
- * Supports dynamic styling, full-width option, rounded corners, and different types.
404
- *
405
- * @param disabled - If true, the button is disabled and not pressable.
406
- * @param isFullWidth - If true, the button expands to full width of its container.
407
- * @param children - Text content of the button.
408
- * @param onPress - Function to call when the button is pressed.
409
- * @param rounded - If true, the button has rounded corners.
410
- * @param borderRadius - Custom border radius value. Overrides the `rounded` prop if provided.
411
- * @param type - Specifies the button type for styling ('submit', 'button', 'cancel').
412
- */
413
- var Button = function Button(_a) {
414
- var children = _a.children,
415
- _b = _a.disabled,
416
- disabled = _b === void 0 ? false : _b,
417
- _c = _a.type,
418
- type = _c === void 0 ? 'button' : _c,
419
- _d = _a.rounded,
420
- rounded = _d === void 0 ? true : _d,
421
- _e = _a.borderRadius,
422
- borderRadius = _e === void 0 ? 30 : _e,
423
- _f = _a.isFullWidth,
424
- isFullWidth = _f === void 0 ? false : _f,
425
- _g = _a.loading,
426
- loading = _g === void 0 ? false : _g,
427
- onPress = _a.onPress;
428
- var theme = React.useContext(ThemeContext).theme;
429
- var colors = theme.colors;
430
- var computedStyles = React.useMemo(function () {
431
- return reactNative.StyleSheet.flatten([styles$5.button, typeStyles(type, disabled, colors), rounded && {
432
- borderRadius: borderRadius
433
- }, isFullWidth && {
434
- width: '100%'
435
- }, (disabled || loading) && styles$5.disabled]);
436
- }, [type, disabled, loading, rounded, borderRadius, isFullWidth, colors]);
437
- var textColor = React.useMemo(function () {
438
- return {
439
- color: colors.textButton.hex
440
- };
441
- }, [type, colors]);
442
- return /*#__PURE__*/React.createElement(reactNative.TouchableOpacity, {
443
- style: computedStyles,
444
- disabled: disabled || loading,
445
- onPress: onPress,
446
- activeOpacity: 0.7
447
- }, loading ? (
448
- /*#__PURE__*/
449
- // Show loading spinner if loading
450
- React.createElement(reactNative.ActivityIndicator, {
451
- size: "small",
452
- color: colors.textButton.hex
453
- })) : (/*#__PURE__*/React.createElement(reactNative.Text, {
454
- style: textColor
455
- }, Array.isArray(children) ? children.join('').toUpperCase() : children === null || children === void 0 ? void 0 : children.toUpperCase())));
375
+ return context;
456
376
  };
457
- var styles$5 = reactNative.StyleSheet.create({
458
- button: {
459
- justifyContent: 'center',
460
- alignItems: 'center',
461
- paddingVertical: 10,
462
- paddingHorizontal: 20
463
- },
464
- disabled: {
465
- opacity: 0.6
466
- }
467
- });
468
-
469
- // src/cards/Card.tsx
470
- /**
471
- * Card component that adapts its styles based on the current theme.
472
- * Supports dynamic styling, shadows, and press animations.
473
- *
474
- * @param children - The content to be displayed inside the Card.
475
- * @param style - Additional styles to apply to the Card.
476
- * @param onPress - Function to execute when the Card is pressed.
477
- * @param pressable - Determines if the Card is pressable. Defaults to false.
478
- * @param borderRadius - Border radius of the Card. Defaults to 12.
479
- * @param elevation - Elevation for Android shadow. Overrides default.
480
- * @param shadowProps - Custom shadow properties for iOS. Overrides defaults.
481
- */
482
- var Card = function Card(_a) {
377
+ var Form = function Form(_a) {
483
378
  var children = _a.children,
484
- style = _a.style,
485
- onPress = _a.onPress,
486
- _b = _a.pressable,
487
- pressable = _b === void 0 ? false : _b,
488
- _c = _a.borderRadius,
489
- borderRadius = _c === void 0 ? 12 : _c,
490
- _d = _a.elevation,
491
- elevation = _d === void 0 ? 4 : _d,
492
- _e = _a.shadowProps,
493
- shadowProps = _e === void 0 ? {} : _e;
494
- var theme = React.useContext(ThemeContext).theme;
495
- var colors = theme.colors;
496
- // Animation state for pressable effect
497
- // Default shadow styles (improved platform-specific handling)
498
- var defaultShadow = reactNative.Platform.select({
499
- ios: {
500
- shadowColor: (shadowProps === null || shadowProps === void 0 ? void 0 : shadowProps.shadowColor) || colors.text.hex,
501
- // Defaulting to theme text color
502
- shadowOffset: (shadowProps === null || shadowProps === void 0 ? void 0 : shadowProps.shadowOffset) || {
503
- width: 0,
504
- height: 2
505
- },
506
- shadowOpacity: (shadowProps === null || shadowProps === void 0 ? void 0 : shadowProps.shadowOpacity) || 0.1,
507
- shadowRadius: (shadowProps === null || shadowProps === void 0 ? void 0 : shadowProps.shadowRadius) || 4
508
- },
509
- android: {
510
- elevation: elevation // Only applies to Android
379
+ onSubmit = _a.onSubmit;
380
+ var _b = React.useState({}),
381
+ formValues = _b[0],
382
+ setFormValues = _b[1];
383
+ var _c = React.useState({}),
384
+ errors = _c[0],
385
+ setErrors = _c[1];
386
+ var setFormValue = function setFormValue(name, value) {
387
+ setFormValues(function (prev) {
388
+ var _a;
389
+ return __assign(__assign({}, prev), (_a = {}, _a[name] = value, _a));
390
+ });
391
+ };
392
+ var handleSubmit = function handleSubmit() {
393
+ return __awaiter(void 0, void 0, void 0, function () {
394
+ var validationErrors;
395
+ return __generator(this, function (_a) {
396
+ switch (_a.label) {
397
+ case 0:
398
+ return [4 /*yield*/, onSubmit(formValues)];
399
+ case 1:
400
+ validationErrors = _a.sent();
401
+ // Set the validation errors in state
402
+ setErrors(validationErrors);
403
+ // Prevent submission if there are any errors
404
+ if (Object.keys(validationErrors).length > 0) {
405
+ return [2 /*return*/]; // Prevent submission
406
+ }
407
+ // If no errors, continue submission process (e.g., calling an API, navigating, etc.)
408
+ console.log('Form submitted successfully:', formValues);
409
+ return [2 /*return*/];
410
+ }
411
+ });
412
+ });
413
+ };
414
+ return /*#__PURE__*/React.createElement(FormContext.Provider, {
415
+ value: {
416
+ formValues: formValues,
417
+ setFormValue: setFormValue,
418
+ errors: errors,
419
+ setErrors: setErrors,
420
+ handleSubmit: handleSubmit
511
421
  }
512
- });
513
- var cardStyles = [styles$4.container, {
514
- borderRadius: borderRadius,
515
- backgroundColor: colors.body.hex
516
- }, defaultShadow,
517
- // Dynamic shadows based on platform
518
- style // External styles
519
- ];
520
- return pressable ? (/*#__PURE__*/React.createElement(reactNative.TouchableOpacity, {
521
- activeOpacity: 0.8,
522
- onPress: onPress,
523
- style: cardStyles
524
- }, children)) : (/*#__PURE__*/React.createElement(reactNative.View, {
525
- style: cardStyles
526
- }, children));
422
+ }, children);
527
423
  };
528
- var styles$4 = reactNative.StyleSheet.create({
529
- container: {
530
- padding: 16,
531
- borderRadius: 12
532
- // Shadows handled dynamically with platform logic
533
- }
534
- });
535
424
 
536
425
  // src/fonts/Text.tsx
537
426
  /**
@@ -597,83 +486,29 @@ reactNative.StyleSheet.create({
597
486
  // Define any default styles if needed
598
487
  });
599
488
 
600
- var FormContext = /*#__PURE__*/React.createContext(undefined);
601
- var useFormContext = function useFormContext() {
602
- var context = React.useContext(FormContext);
603
- if (!context) {
604
- throw new Error("useFormContext must be used within a Form");
605
- }
606
- return context;
607
- };
608
- var Form = function Form(_a) {
609
- var children = _a.children,
610
- onSubmit = _a.onSubmit;
611
- var _b = React.useState({}),
612
- formValues = _b[0],
613
- setFormValues = _b[1];
614
- var _c = React.useState({}),
615
- errors = _c[0],
616
- setErrors = _c[1];
617
- var setFormValue = function setFormValue(name, value) {
618
- setFormValues(function (prev) {
619
- var _a;
620
- return __assign(__assign({}, prev), (_a = {}, _a[name] = value, _a));
621
- });
622
- };
623
- var handleSubmit = function handleSubmit(event) {
624
- return __awaiter(void 0, void 0, void 0, function () {
625
- var validationErrors;
626
- return __generator(this, function (_a) {
627
- switch (_a.label) {
628
- case 0:
629
- event.preventDefault(); // Prevent native submission
630
- return [4 /*yield*/, onSubmit(formValues)];
631
- case 1:
632
- validationErrors = _a.sent();
633
- setErrors(validationErrors);
634
- if (Object.keys(validationErrors).length > 0) {
635
- return [2 /*return*/]; // Do not proceed if there are validation errors
636
- }
637
- return [2 /*return*/];
638
- }
639
- });
640
- });
641
- };
642
- return /*#__PURE__*/React.createElement(FormContext.Provider, {
643
- value: {
644
- formValues: formValues,
645
- setFormValue: setFormValue,
646
- errors: errors,
647
- handleSubmit: handleSubmit
648
- }
649
- }, /*#__PURE__*/React.createElement("form", {
650
- onSubmit: handleSubmit
651
- }, children));
652
- };
653
-
654
489
  // src/forms/ErrorList.tsx
655
490
  var ErrorList = function ErrorList(_a) {
656
491
  var errors = _a.errors;
657
492
  var theme = React.useContext(ThemeContext).theme;
658
493
  var colors = theme.colors;
659
494
  return /*#__PURE__*/React.createElement(reactNative.View, {
660
- style: styles$3.container
495
+ style: styles$5.container
661
496
  }, errors.map(function (error, index) {
662
497
  return /*#__PURE__*/React.createElement(reactNative.View, {
663
498
  key: index,
664
- style: styles$3.errorItem
499
+ style: styles$5.errorItem
665
500
  }, /*#__PURE__*/React.createElement(Text, {
666
- style: [styles$3.bullet, {
501
+ style: [styles$5.bullet, {
667
502
  color: colors.error.hex
668
503
  }]
669
504
  }, "\u2022"), /*#__PURE__*/React.createElement(Text, {
670
- style: [styles$3.errorText, {
505
+ style: [styles$5.errorText, {
671
506
  color: colors.error.hex
672
507
  }]
673
508
  }, error));
674
509
  }));
675
510
  };
676
- var styles$3 = reactNative.StyleSheet.create({
511
+ var styles$5 = reactNative.StyleSheet.create({
677
512
  container: {
678
513
  marginTop: 4
679
514
  },
@@ -708,13 +543,13 @@ var Input = function Input(_a) {
708
543
  setFormValue(name, text);
709
544
  };
710
545
  return /*#__PURE__*/React.createElement(reactNative.View, {
711
- style: styles$2.container
546
+ style: styles$4.container
712
547
  }, /*#__PURE__*/React.createElement(Text, {
713
- style: [styles$2.label, {
548
+ style: [styles$4.label, {
714
549
  color: colors.text.hex
715
550
  }]
716
551
  }, label), /*#__PURE__*/React.createElement(reactNative.TextInput, __assign({
717
- style: [styles$2.input, {
552
+ style: [styles$4.input, {
718
553
  backgroundColor: colors.body.hex,
719
554
  borderColor: formErrors[name] ? colors.error.hex : '#CCC',
720
555
  color: colors.text.hex
@@ -727,7 +562,7 @@ var Input = function Input(_a) {
727
562
  errors: formErrors[name]
728
563
  })));
729
564
  };
730
- var styles$2 = reactNative.StyleSheet.create({
565
+ var styles$4 = reactNative.StyleSheet.create({
731
566
  container: {
732
567
  marginBottom: 16
733
568
  },
@@ -758,11 +593,11 @@ var TextArea = function TextArea(_a) {
758
593
  setFormValue(name, text);
759
594
  };
760
595
  return /*#__PURE__*/React.createElement(reactNative.View, {
761
- style: styles$1.container
596
+ style: styles$3.container
762
597
  }, /*#__PURE__*/React.createElement(Text, {
763
- style: styles$1.label
598
+ style: styles$3.label
764
599
  }, label), /*#__PURE__*/React.createElement(reactNative.TextInput, __assign({
765
- style: [styles$1.textArea, style],
600
+ style: [styles$3.textArea, style],
766
601
  value: formValues[name] || '',
767
602
  onChangeText: handleChange,
768
603
  placeholder: label,
@@ -775,7 +610,7 @@ var TextArea = function TextArea(_a) {
775
610
  errors: formErrors[name]
776
611
  })));
777
612
  };
778
- var styles$1 = reactNative.StyleSheet.create({
613
+ var styles$3 = reactNative.StyleSheet.create({
779
614
  container: {
780
615
  marginBottom: 16
781
616
  },
@@ -804,18 +639,194 @@ var Label = function Label(_a) {
804
639
  var theme = React.useContext(ThemeContext).theme;
805
640
  var colors = theme.colors;
806
641
  return /*#__PURE__*/React.createElement(Text, {
807
- style: [styles.label, style, {
642
+ style: [styles$2.label, style, {
808
643
  color: colors.text.hex
809
644
  }]
810
645
  }, text);
811
646
  };
812
- var styles = reactNative.StyleSheet.create({
647
+ var styles$2 = reactNative.StyleSheet.create({
813
648
  label: {
814
649
  marginBottom: 4,
815
650
  fontWeight: '500'
816
651
  }
817
652
  });
818
653
 
654
+ // src/components/Button.tsx
655
+ /**
656
+ * Determines the styles based on the button type and whether it is disabled.
657
+ *
658
+ * @param type - The type of the button ('submit', 'button', 'cancel').
659
+ * @param disabled - Whether the button is disabled.
660
+ * @param themeColors - The theme colors.
661
+ * @returns The computed style for the button.
662
+ */
663
+ function typeStyles(type, disabled, themeColors) {
664
+ switch (type) {
665
+ case 'submit':
666
+ return {
667
+ backgroundColor: "rgba(".concat(themeColors === null || themeColors === void 0 ? void 0 : themeColors.primary.rgb.r, ", ").concat(themeColors === null || themeColors === void 0 ? void 0 : themeColors.primary.rgb.g, ", ").concat(themeColors === null || themeColors === void 0 ? void 0 : themeColors.primary.rgb.b, ", ").concat(disabled ? 0.5 : 1, ")"),
668
+ borderWidth: 2,
669
+ borderColor: themeColors === null || themeColors === void 0 ? void 0 : themeColors.primary.hex
670
+ };
671
+ case 'button':
672
+ return {
673
+ backgroundColor: themeColors === null || themeColors === void 0 ? void 0 : themeColors.primary.hex,
674
+ borderColor: themeColors === null || themeColors === void 0 ? void 0 : themeColors.secondary.hex,
675
+ opacity: disabled ? 0.5 : 1,
676
+ borderWidth: 2
677
+ };
678
+ case 'cancel':
679
+ return {
680
+ backgroundColor: themeColors === null || themeColors === void 0 ? void 0 : themeColors.background.hex,
681
+ borderWidth: 0
682
+ };
683
+ default:
684
+ return {};
685
+ }
686
+ }
687
+ /**
688
+ * Button component that adapts its styles based on the current theme.
689
+ * Supports dynamic styling, full-width option, rounded corners, and different types.
690
+ *
691
+ * @param disabled - If true, the button is disabled and not pressable.
692
+ * @param isFullWidth - If true, the button expands to full width of its container.
693
+ * @param children - Text content of the button.
694
+ * @param onPress - Function to call when the button is pressed.
695
+ * @param rounded - If true, the button has rounded corners.
696
+ * @param borderRadius - Custom border radius value. Overrides the `rounded` prop if provided.
697
+ * @param type - Specifies the button type for styling ('submit', 'button', 'cancel').
698
+ */
699
+ var Button = function Button(_a) {
700
+ var children = _a.children,
701
+ _b = _a.disabled,
702
+ disabled = _b === void 0 ? false : _b,
703
+ _c = _a.type,
704
+ type = _c === void 0 ? 'button' : _c,
705
+ _d = _a.rounded,
706
+ rounded = _d === void 0 ? true : _d,
707
+ _e = _a.borderRadius,
708
+ borderRadius = _e === void 0 ? 30 : _e,
709
+ _f = _a.isFullWidth,
710
+ isFullWidth = _f === void 0 ? false : _f,
711
+ _g = _a.loading,
712
+ loading = _g === void 0 ? false : _g,
713
+ onPress = _a.onPress;
714
+ var theme = React.useContext(ThemeContext).theme;
715
+ var colors = theme.colors;
716
+ var handleSubmit = useFormContext().handleSubmit;
717
+ var computedStyles = React.useMemo(function () {
718
+ return reactNative.StyleSheet.flatten([styles$1.button, typeStyles(type, disabled, colors), rounded && {
719
+ borderRadius: borderRadius
720
+ }, isFullWidth && {
721
+ width: '100%'
722
+ }, (disabled || loading) && styles$1.disabled]);
723
+ }, [type, disabled, loading, rounded, borderRadius, isFullWidth, colors]);
724
+ var textColor = React.useMemo(function () {
725
+ return {
726
+ color: colors.textButton.hex
727
+ };
728
+ }, [type, colors]);
729
+ var handlePress = function handlePress() {
730
+ if (type === 'submit') {
731
+ handleSubmit(); // Call the form's submit handler
732
+ } else if (onPress) {
733
+ onPress(); // Call a custom handler if needed
734
+ }
735
+ };
736
+ return /*#__PURE__*/React.createElement(reactNative.TouchableOpacity, {
737
+ style: computedStyles,
738
+ disabled: disabled || loading,
739
+ onPress: handlePress,
740
+ activeOpacity: 0.7
741
+ }, loading ? (
742
+ /*#__PURE__*/
743
+ // Show loading spinner if loading
744
+ React.createElement(reactNative.ActivityIndicator, {
745
+ size: "small",
746
+ color: colors.textButton.hex
747
+ })) : (/*#__PURE__*/React.createElement(reactNative.Text, {
748
+ style: textColor
749
+ }, Array.isArray(children) ? children.join('').toUpperCase() : children === null || children === void 0 ? void 0 : children.toUpperCase())));
750
+ };
751
+ var styles$1 = reactNative.StyleSheet.create({
752
+ button: {
753
+ justifyContent: 'center',
754
+ alignItems: 'center',
755
+ paddingVertical: 10,
756
+ paddingHorizontal: 20
757
+ },
758
+ disabled: {
759
+ opacity: 0.6
760
+ }
761
+ });
762
+
763
+ // src/cards/Card.tsx
764
+ /**
765
+ * Card component that adapts its styles based on the current theme.
766
+ * Supports dynamic styling, shadows, and press animations.
767
+ *
768
+ * @param children - The content to be displayed inside the Card.
769
+ * @param style - Additional styles to apply to the Card.
770
+ * @param onPress - Function to execute when the Card is pressed.
771
+ * @param pressable - Determines if the Card is pressable. Defaults to false.
772
+ * @param borderRadius - Border radius of the Card. Defaults to 12.
773
+ * @param elevation - Elevation for Android shadow. Overrides default.
774
+ * @param shadowProps - Custom shadow properties for iOS. Overrides defaults.
775
+ */
776
+ var Card = function Card(_a) {
777
+ var children = _a.children,
778
+ style = _a.style,
779
+ onPress = _a.onPress,
780
+ _b = _a.pressable,
781
+ pressable = _b === void 0 ? false : _b,
782
+ _c = _a.borderRadius,
783
+ borderRadius = _c === void 0 ? 12 : _c,
784
+ _d = _a.elevation,
785
+ elevation = _d === void 0 ? 4 : _d,
786
+ _e = _a.shadowProps,
787
+ shadowProps = _e === void 0 ? {} : _e;
788
+ var theme = React.useContext(ThemeContext).theme;
789
+ var colors = theme.colors;
790
+ // Animation state for pressable effect
791
+ // Default shadow styles (improved platform-specific handling)
792
+ var defaultShadow = reactNative.Platform.select({
793
+ ios: {
794
+ shadowColor: (shadowProps === null || shadowProps === void 0 ? void 0 : shadowProps.shadowColor) || colors.text.hex,
795
+ // Defaulting to theme text color
796
+ shadowOffset: (shadowProps === null || shadowProps === void 0 ? void 0 : shadowProps.shadowOffset) || {
797
+ width: 0,
798
+ height: 2
799
+ },
800
+ shadowOpacity: (shadowProps === null || shadowProps === void 0 ? void 0 : shadowProps.shadowOpacity) || 0.1,
801
+ shadowRadius: (shadowProps === null || shadowProps === void 0 ? void 0 : shadowProps.shadowRadius) || 4
802
+ },
803
+ android: {
804
+ elevation: elevation // Only applies to Android
805
+ }
806
+ });
807
+ var cardStyles = [styles.container, {
808
+ borderRadius: borderRadius,
809
+ backgroundColor: colors.body.hex
810
+ }, defaultShadow,
811
+ // Dynamic shadows based on platform
812
+ style // External styles
813
+ ];
814
+ return pressable ? (/*#__PURE__*/React.createElement(reactNative.TouchableOpacity, {
815
+ activeOpacity: 0.8,
816
+ onPress: onPress,
817
+ style: cardStyles
818
+ }, children)) : (/*#__PURE__*/React.createElement(reactNative.View, {
819
+ style: cardStyles
820
+ }, children));
821
+ };
822
+ var styles = reactNative.StyleSheet.create({
823
+ container: {
824
+ padding: 16,
825
+ borderRadius: 12
826
+ // Shadows handled dynamically with platform logic
827
+ }
828
+ });
829
+
819
830
  exports.Button = Button;
820
831
  exports.Card = Card;
821
832
  exports.ErrorList = ErrorList;