@plasmicpkgs/react-aria 0.0.98 → 0.0.100

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.
@@ -1,9 +1,9 @@
1
1
  'use strict';
2
2
 
3
+ var host = require('@plasmicapp/host');
3
4
  var React = require('react');
4
5
  var reactAria = require('react-aria');
5
6
  var reactAriaComponents = require('react-aria-components');
6
- var host = require('@plasmicapp/host');
7
7
  var registerComponent = require('@plasmicapp/host/registerComponent');
8
8
  var utils = require('@react-aria/utils');
9
9
  var flattenChildren = require('react-keyed-flatten-children');
@@ -660,24 +660,73 @@ const BUTTON_VARIANTS = [
660
660
  ];
661
661
  const { variants: variants$h, withObservedValues: withObservedValues$e } = pickAriaComponentVariants(BUTTON_VARIANTS);
662
662
  const BaseButton = React__default.default.forwardRef(function BaseButtonInner(props, ref) {
663
- const _a = props, { submitsForm, resetsForm, children, plasmicUpdateVariant } = _a, rest = __objRest$m(_a, ["submitsForm", "resetsForm", "children", "plasmicUpdateVariant"]);
664
- const type = submitsForm ? "submit" : resetsForm ? "reset" : "button";
665
- const mergedProps = reactAria.mergeProps(rest, {
666
- type,
663
+ const { href } = props;
664
+ if (href) {
665
+ return /* @__PURE__ */ React__default.default.createElement(
666
+ LinkButton,
667
+ {
668
+ props,
669
+ ref
670
+ }
671
+ );
672
+ } else {
673
+ const _a = props, { submitsForm, resetsForm, children, plasmicUpdateVariant } = _a, rest = __objRest$m(_a, ["submitsForm", "resetsForm", "children", "plasmicUpdateVariant"]);
674
+ const type = submitsForm ? "submit" : resetsForm ? "reset" : "button";
675
+ const buttonProps = reactAria.mergeProps(rest, {
676
+ type,
677
+ style: COMMON_STYLES,
678
+ ref
679
+ });
680
+ return /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.Button, __spreadValues$q({}, buttonProps), ({ isHovered, isPressed, isFocused, isFocusVisible, isDisabled }) => withObservedValues$e(
681
+ children,
682
+ {
683
+ hovered: isHovered,
684
+ pressed: isPressed,
685
+ focused: isFocused,
686
+ focusVisible: isFocusVisible,
687
+ disabled: isDisabled
688
+ },
689
+ plasmicUpdateVariant
690
+ ));
691
+ }
692
+ });
693
+ function LinkButton({
694
+ props,
695
+ ref
696
+ }) {
697
+ const _a = props, { href, children, plasmicUpdateVariant } = _a, rest = __objRest$m(_a, ["href", "children", "plasmicUpdateVariant"]);
698
+ const PlasmicLink = host.usePlasmicLink();
699
+ const { linkProps, isPressed } = reactAria.useLink(props, ref);
700
+ const { hoverProps, isHovered } = reactAria.useHover(props);
701
+ const { focusProps, isFocused, isFocusVisible } = reactAria.useFocusRing();
702
+ const combinedLinkProps = reactAria.mergeProps(linkProps, hoverProps, focusProps, {
703
+ href,
704
+ className: props.className,
705
+ style: COMMON_STYLES,
667
706
  ref
668
707
  });
669
- return /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.Button, __spreadProps$m(__spreadValues$q({}, mergedProps), { style: COMMON_STYLES }), ({ isHovered, isPressed, isFocused, isFocusVisible, isDisabled }) => withObservedValues$e(
670
- children,
671
- {
672
- hovered: isHovered,
673
- pressed: isPressed,
674
- focused: isFocused,
675
- focusVisible: isFocusVisible,
676
- disabled: isDisabled
677
- },
678
- plasmicUpdateVariant
679
- ));
680
- });
708
+ return /* @__PURE__ */ React__default.default.createElement(
709
+ PlasmicLink,
710
+ __spreadProps$m(__spreadValues$q({}, combinedLinkProps), {
711
+ "data-focused": isFocused || void 0,
712
+ "data-hovered": isHovered || void 0,
713
+ "data-pressed": isPressed || void 0,
714
+ "data-focus-visible": isFocusVisible || void 0,
715
+ "data-disabled": props.isDisabled || void 0
716
+ }),
717
+ withObservedValues$e(
718
+ children,
719
+ {
720
+ hovered: isHovered,
721
+ pressed: isPressed,
722
+ focused: isFocused,
723
+ focusVisible: isFocusVisible,
724
+ disabled: !!rest.isDisabled
725
+ },
726
+ plasmicUpdateVariant
727
+ )
728
+ );
729
+ }
681
730
  const BUTTON_COMPONENT_NAME = makeComponentName("button");
682
731
  function registerButton(loader, overrides) {
683
732
  registerComponentHelper(
@@ -690,11 +739,18 @@ function registerButton(loader, overrides) {
690
739
  importName: "BaseButton",
691
740
  variants: variants$h,
692
741
  defaultStyles: {
693
- borderWidth: "1px",
694
- borderStyle: "solid",
742
+ // Ensure consistent design across rendered elements (button, anchor tag).
743
+ backgroundColor: "#EFEFEF",
695
744
  borderColor: "black",
745
+ borderStyle: "solid",
746
+ borderWidth: "1px",
747
+ color: "#000000",
748
+ cursor: "pointer",
749
+ fontFamily: "Arial",
750
+ fontSize: "1rem",
751
+ lineHeight: "1.2",
696
752
  padding: "2px 10px",
697
- cursor: "pointer"
753
+ textDecorationLine: "none"
698
754
  },
699
755
  props: __spreadProps$m(__spreadValues$q({}, getCommonProps("button", [
700
756
  "autoFocus",
@@ -709,11 +765,22 @@ function registerButton(loader, overrides) {
709
765
  value: "Button"
710
766
  }
711
767
  },
768
+ href: {
769
+ type: "href",
770
+ description: "The URL this button navigates to. If present, this button is an <a> element."
771
+ },
772
+ target: {
773
+ type: "choice",
774
+ options: ["_blank", "_self", "_parent", "_top"],
775
+ description: "Same as target attribute of <a> element. Only applies when the href prop is present.",
776
+ hidden: (props) => !props.href,
777
+ defaultValueHint: "_self"
778
+ },
712
779
  submitsForm: {
713
780
  type: "boolean",
714
781
  displayName: "Submits form?",
715
782
  defaultValueHint: false,
716
- hidden: (props) => Boolean(props.resetsForm),
783
+ hidden: (props) => Boolean(props.resetsForm) || Boolean(props.href),
717
784
  description: "Whether clicking this button should submit the enclosing form.",
718
785
  advanced: true
719
786
  },
@@ -721,7 +788,7 @@ function registerButton(loader, overrides) {
721
788
  type: "boolean",
722
789
  displayName: "Resets form?",
723
790
  defaultValueHint: false,
724
- hidden: (props) => Boolean(props.submitsForm),
791
+ hidden: (props) => Boolean(props.submitsForm) || Boolean(props.href),
725
792
  description: "Whether clicking this button should reset the enclosing form.",
726
793
  advanced: true
727
794
  },
@@ -2568,77 +2635,6 @@ var __objRest$b = (source, exclude) => {
2568
2635
  }
2569
2636
  return target;
2570
2637
  };
2571
- function BaseHeading(_a) {
2572
- var _b = _a, { children } = _b, rest = __objRest$b(_b, ["children"]);
2573
- return /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.Heading, __spreadProps$c(__spreadValues$e({}, rest), { style: COMMON_STYLES }), children);
2574
- }
2575
- const HEADING_COMPONENT_NAME = makeComponentName("heading");
2576
- function registerHeading(loader, overrides) {
2577
- return registerComponentHelper(
2578
- loader,
2579
- BaseHeading,
2580
- {
2581
- name: HEADING_COMPONENT_NAME,
2582
- displayName: "Aria Heading",
2583
- importPath: "@plasmicpkgs/react-aria/skinny/registerHeading",
2584
- importName: "BaseHeading",
2585
- defaultStyles: {
2586
- fontSize: "20px",
2587
- fontWeight: "bold",
2588
- marginBottom: "10px"
2589
- },
2590
- props: {
2591
- children: {
2592
- type: "slot",
2593
- mergeWithParent: true,
2594
- defaultValue: {
2595
- type: "text",
2596
- value: "Heading"
2597
- }
2598
- },
2599
- slot: {
2600
- type: "string",
2601
- defaultValue: "title",
2602
- hidden: () => true
2603
- }
2604
- },
2605
- trapsFocus: true
2606
- },
2607
- overrides
2608
- );
2609
- }
2610
-
2611
- var __defProp$d = Object.defineProperty;
2612
- var __defProps$b = Object.defineProperties;
2613
- var __getOwnPropDescs$b = Object.getOwnPropertyDescriptors;
2614
- var __getOwnPropSymbols$d = Object.getOwnPropertySymbols;
2615
- var __hasOwnProp$d = Object.prototype.hasOwnProperty;
2616
- var __propIsEnum$d = Object.prototype.propertyIsEnumerable;
2617
- var __defNormalProp$d = (obj, key, value) => key in obj ? __defProp$d(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
2618
- var __spreadValues$d = (a, b) => {
2619
- for (var prop in b || (b = {}))
2620
- if (__hasOwnProp$d.call(b, prop))
2621
- __defNormalProp$d(a, prop, b[prop]);
2622
- if (__getOwnPropSymbols$d)
2623
- for (var prop of __getOwnPropSymbols$d(b)) {
2624
- if (__propIsEnum$d.call(b, prop))
2625
- __defNormalProp$d(a, prop, b[prop]);
2626
- }
2627
- return a;
2628
- };
2629
- var __spreadProps$b = (a, b) => __defProps$b(a, __getOwnPropDescs$b(b));
2630
- var __objRest$a = (source, exclude) => {
2631
- var target = {};
2632
- for (var prop in source)
2633
- if (__hasOwnProp$d.call(source, prop) && exclude.indexOf(prop) < 0)
2634
- target[prop] = source[prop];
2635
- if (source != null && __getOwnPropSymbols$d)
2636
- for (var prop of __getOwnPropSymbols$d(source)) {
2637
- if (exclude.indexOf(prop) < 0 && __propIsEnum$d.call(source, prop))
2638
- target[prop] = source[prop];
2639
- }
2640
- return target;
2641
- };
2642
2638
  const BaseModal = React.forwardRef(
2643
2639
  function BaseModalInner(props, ref) {
2644
2640
  var _b, _c, _d;
@@ -2650,7 +2646,7 @@ const BaseModal = React.forwardRef(
2650
2646
  resetClassName,
2651
2647
  setControlContextData,
2652
2648
  isDismissable
2653
- } = _a, rest = __objRest$a(_a, [
2649
+ } = _a, rest = __objRest$b(_a, [
2654
2650
  "children",
2655
2651
  "modalOverlayClass",
2656
2652
  "className",
@@ -2690,7 +2686,7 @@ const BaseModal = React.forwardRef(
2690
2686
  }));
2691
2687
  return /* @__PURE__ */ React__default.default.createElement(
2692
2688
  reactAriaComponents.ModalOverlay,
2693
- __spreadProps$b(__spreadValues$d({}, mergedProps), {
2689
+ __spreadProps$c(__spreadValues$e({}, mergedProps), {
2694
2690
  className: `${resetClassName} ${modalOverlayClass}`
2695
2691
  }),
2696
2692
  /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.Modal, { className }, children)
@@ -2709,8 +2705,9 @@ const MODAL_DEFAULT_SLOT_CONTENT = {
2709
2705
  },
2710
2706
  children: [
2711
2707
  {
2712
- type: "component",
2713
- name: HEADING_COMPONENT_NAME
2708
+ type: "text",
2709
+ value: "Heading",
2710
+ tag: "h2"
2714
2711
  },
2715
2712
  {
2716
2713
  type: "text",
@@ -2812,46 +2809,46 @@ function registerModal(loader, overrides) {
2812
2809
  );
2813
2810
  }
2814
2811
 
2815
- var __defProp$c = Object.defineProperty;
2816
- var __defProps$a = Object.defineProperties;
2817
- var __getOwnPropDescs$a = Object.getOwnPropertyDescriptors;
2818
- var __getOwnPropSymbols$c = Object.getOwnPropertySymbols;
2819
- var __hasOwnProp$c = Object.prototype.hasOwnProperty;
2820
- var __propIsEnum$c = Object.prototype.propertyIsEnumerable;
2821
- var __defNormalProp$c = (obj, key, value) => key in obj ? __defProp$c(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
2822
- var __spreadValues$c = (a, b) => {
2812
+ var __defProp$d = Object.defineProperty;
2813
+ var __defProps$b = Object.defineProperties;
2814
+ var __getOwnPropDescs$b = Object.getOwnPropertyDescriptors;
2815
+ var __getOwnPropSymbols$d = Object.getOwnPropertySymbols;
2816
+ var __hasOwnProp$d = Object.prototype.hasOwnProperty;
2817
+ var __propIsEnum$d = Object.prototype.propertyIsEnumerable;
2818
+ var __defNormalProp$d = (obj, key, value) => key in obj ? __defProp$d(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
2819
+ var __spreadValues$d = (a, b) => {
2823
2820
  for (var prop in b || (b = {}))
2824
- if (__hasOwnProp$c.call(b, prop))
2825
- __defNormalProp$c(a, prop, b[prop]);
2826
- if (__getOwnPropSymbols$c)
2827
- for (var prop of __getOwnPropSymbols$c(b)) {
2828
- if (__propIsEnum$c.call(b, prop))
2829
- __defNormalProp$c(a, prop, b[prop]);
2821
+ if (__hasOwnProp$d.call(b, prop))
2822
+ __defNormalProp$d(a, prop, b[prop]);
2823
+ if (__getOwnPropSymbols$d)
2824
+ for (var prop of __getOwnPropSymbols$d(b)) {
2825
+ if (__propIsEnum$d.call(b, prop))
2826
+ __defNormalProp$d(a, prop, b[prop]);
2830
2827
  }
2831
2828
  return a;
2832
2829
  };
2833
- var __spreadProps$a = (a, b) => __defProps$a(a, __getOwnPropDescs$a(b));
2834
- var __objRest$9 = (source, exclude) => {
2830
+ var __spreadProps$b = (a, b) => __defProps$b(a, __getOwnPropDescs$b(b));
2831
+ var __objRest$a = (source, exclude) => {
2835
2832
  var target = {};
2836
2833
  for (var prop in source)
2837
- if (__hasOwnProp$c.call(source, prop) && exclude.indexOf(prop) < 0)
2834
+ if (__hasOwnProp$d.call(source, prop) && exclude.indexOf(prop) < 0)
2838
2835
  target[prop] = source[prop];
2839
- if (source != null && __getOwnPropSymbols$c)
2840
- for (var prop of __getOwnPropSymbols$c(source)) {
2841
- if (exclude.indexOf(prop) < 0 && __propIsEnum$c.call(source, prop))
2836
+ if (source != null && __getOwnPropSymbols$d)
2837
+ for (var prop of __getOwnPropSymbols$d(source)) {
2838
+ if (exclude.indexOf(prop) < 0 && __propIsEnum$d.call(source, prop))
2842
2839
  target[prop] = source[prop];
2843
2840
  }
2844
2841
  return target;
2845
2842
  };
2846
2843
  function BaseDialogTrigger(props) {
2847
2844
  var _b, _c, _d;
2848
- const _a = props, { trigger, dialog, isOpen } = _a, rest = __objRest$9(_a, ["trigger", "dialog", "isOpen"]);
2845
+ const _a = props, { trigger, dialog, isOpen } = _a, rest = __objRest$a(_a, ["trigger", "dialog", "isOpen"]);
2849
2846
  const { isSelected, selectedSlotName } = (_c = (_b = host.usePlasmicCanvasComponentInfo) == null ? void 0 : _b(props)) != null ? _c : {};
2850
2847
  const isAutoOpen = selectedSlotName !== "trigger" && isSelected;
2851
- const mergedProps = __spreadProps$a(__spreadValues$c({}, rest), {
2848
+ const mergedProps = __spreadProps$b(__spreadValues$d({}, rest), {
2852
2849
  isOpen: (_d = isAutoOpen || isOpen) != null ? _d : false
2853
2850
  });
2854
- return /* @__PURE__ */ React__default.default.createElement(PlasmicDialogTriggerContext.Provider, { value: mergedProps }, /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.DialogTrigger, __spreadValues$c({}, mergedProps), trigger, dialog));
2851
+ return /* @__PURE__ */ React__default.default.createElement(PlasmicDialogTriggerContext.Provider, { value: mergedProps }, /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.DialogTrigger, __spreadValues$d({}, mergedProps), trigger, dialog));
2855
2852
  }
2856
2853
  function registerDialogTrigger(loader, overrides) {
2857
2854
  registerComponentHelper(
@@ -2922,6 +2919,77 @@ function registerDialogTrigger(loader, overrides) {
2922
2919
  );
2923
2920
  }
2924
2921
 
2922
+ var __defProp$c = Object.defineProperty;
2923
+ var __defProps$a = Object.defineProperties;
2924
+ var __getOwnPropDescs$a = Object.getOwnPropertyDescriptors;
2925
+ var __getOwnPropSymbols$c = Object.getOwnPropertySymbols;
2926
+ var __hasOwnProp$c = Object.prototype.hasOwnProperty;
2927
+ var __propIsEnum$c = Object.prototype.propertyIsEnumerable;
2928
+ var __defNormalProp$c = (obj, key, value) => key in obj ? __defProp$c(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
2929
+ var __spreadValues$c = (a, b) => {
2930
+ for (var prop in b || (b = {}))
2931
+ if (__hasOwnProp$c.call(b, prop))
2932
+ __defNormalProp$c(a, prop, b[prop]);
2933
+ if (__getOwnPropSymbols$c)
2934
+ for (var prop of __getOwnPropSymbols$c(b)) {
2935
+ if (__propIsEnum$c.call(b, prop))
2936
+ __defNormalProp$c(a, prop, b[prop]);
2937
+ }
2938
+ return a;
2939
+ };
2940
+ var __spreadProps$a = (a, b) => __defProps$a(a, __getOwnPropDescs$a(b));
2941
+ var __objRest$9 = (source, exclude) => {
2942
+ var target = {};
2943
+ for (var prop in source)
2944
+ if (__hasOwnProp$c.call(source, prop) && exclude.indexOf(prop) < 0)
2945
+ target[prop] = source[prop];
2946
+ if (source != null && __getOwnPropSymbols$c)
2947
+ for (var prop of __getOwnPropSymbols$c(source)) {
2948
+ if (exclude.indexOf(prop) < 0 && __propIsEnum$c.call(source, prop))
2949
+ target[prop] = source[prop];
2950
+ }
2951
+ return target;
2952
+ };
2953
+ function BaseHeading(_a) {
2954
+ var _b = _a, { children } = _b, rest = __objRest$9(_b, ["children"]);
2955
+ return /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.Heading, __spreadProps$a(__spreadValues$c({}, rest), { style: COMMON_STYLES }), children);
2956
+ }
2957
+ const HEADING_COMPONENT_NAME = makeComponentName("heading");
2958
+ function registerHeading(loader, overrides) {
2959
+ return registerComponentHelper(
2960
+ loader,
2961
+ BaseHeading,
2962
+ {
2963
+ name: HEADING_COMPONENT_NAME,
2964
+ displayName: "Aria Heading (deprecated)",
2965
+ importPath: "@plasmicpkgs/react-aria/skinny/registerHeading",
2966
+ importName: "BaseHeading",
2967
+ defaultStyles: {
2968
+ fontSize: "20px",
2969
+ fontWeight: "bold",
2970
+ marginBottom: "10px"
2971
+ },
2972
+ props: {
2973
+ children: {
2974
+ type: "slot",
2975
+ mergeWithParent: true,
2976
+ defaultValue: {
2977
+ type: "text",
2978
+ value: "Heading"
2979
+ }
2980
+ },
2981
+ slot: {
2982
+ type: "string",
2983
+ defaultValue: "title",
2984
+ hidden: () => true
2985
+ }
2986
+ },
2987
+ trapsFocus: true
2988
+ },
2989
+ overrides
2990
+ );
2991
+ }
2992
+
2925
2993
  var __defProp$b = Object.defineProperty;
2926
2994
  var __getOwnPropSymbols$b = Object.getOwnPropertySymbols;
2927
2995
  var __hasOwnProp$b = Object.prototype.hasOwnProperty;