@plasmicpkgs/react-aria 0.0.150 → 0.0.152

package/skinny/common-7f948fa5.cjs.js

@@ -0,0 +1,659 @@
+'use strict';
+
+var host = require('@plasmicapp/host');
+var registerComponent = require('@plasmicapp/host/registerComponent');
+var React = require('react');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var registerComponent__default = /*#__PURE__*/_interopDefault(registerComponent);
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+var __defProp$1 = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$1 = Object.getOwnPropertySymbols;
+var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
+var __propIsEnum$1 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$1 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$1.call(b, prop))
+      __defNormalProp$1(a, prop, b[prop]);
+  if (__getOwnPropSymbols$1)
+    for (var prop of __getOwnPropSymbols$1(b)) {
+      if (__propIsEnum$1.call(b, prop))
+        __defNormalProp$1(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp$1.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols$1)
+    for (var prop of __getOwnPropSymbols$1(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$1.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+const isBrowser = typeof window !== "undefined";
+const useIsomorphicLayoutEffect = isBrowser ? React__default.default.useLayoutEffect : React__default.default.useEffect;
+function useIsOpen({
+  triggerSlotName,
+  isOpen,
+  props
+}) {
+  var _a, _b;
+  const { __plasmic_selection_prop__, plasmicNotifyAutoOpenedContent } = props;
+  const canvasContext = host.usePlasmicCanvasContext();
+  const { isSelected, selectedSlotName } = (_b = (_a = host.usePlasmicCanvasComponentInfo) == null ? void 0 : _a({ __plasmic_selection_prop__ })) != null ? _b : {};
+  if (!canvasContext) {
+    return isOpen;
+  }
+  const isTriggerSlotSelected = isDefined(selectedSlotName) && selectedSlotName === triggerSlotName;
+  const isAutoOpenedBySelection = isSelected && !isTriggerSlotSelected;
+  if (isAutoOpenedBySelection && !isOpen) {
+    plasmicNotifyAutoOpenedContent == null ? void 0 : plasmicNotifyAutoOpenedContent();
+  }
+  return Boolean(isAutoOpenedBySelection || isOpen);
+}
+function useAutoOpen({
+  props,
+  open,
+  close
+}) {
+  var _a, _b, _c;
+  const inPlasmicCanvas = !!host.usePlasmicCanvasContext();
+  const isSelected = (_c = (_b = (_a = host.usePlasmicCanvasComponentInfo) == null ? void 0 : _a(props)) == null ? void 0 : _b.isSelected) != null ? _c : false;
+  const { plasmicNotifyAutoOpenedContent } = props;
+  React.useEffect(() => {
+    if (!inPlasmicCanvas) {
+      return;
+    }
+    if (isSelected) {
+      open == null ? void 0 : open();
+      plasmicNotifyAutoOpenedContent == null ? void 0 : plasmicNotifyAutoOpenedContent();
+    } else {
+      close == null ? void 0 : close();
+    }
+  }, [
+    isSelected,
+    inPlasmicCanvas,
+    plasmicNotifyAutoOpenedContent,
+    open,
+    close
+  ]);
+}
+function registerComponentHelper(loader, component, meta, overrides) {
+  if (overrides) {
+    meta = __spreadProps(__spreadValues$1(__spreadValues$1({}, meta), overrides), {
+      props: __spreadValues$1(__spreadValues$1({}, meta.props), overrides.props)
+    });
+    if (overrides.parentComponentName) {
+      meta.name = makeChildComponentName(
+        overrides.parentComponentName,
+        meta.name
+      );
+    }
+  }
+  if (loader) {
+    loader.registerComponent(component, meta);
+  } else {
+    registerComponent__default.default(component, meta);
+  }
+  return meta;
+}
+function makeComponentName(name) {
+  return `plasmic-react-aria-${name}`;
+}
+function makeChildComponentName(fullParentName, fullChildName) {
+  if (!fullParentName) {
+    return fullChildName;
+  }
+  return `${fullParentName}-${fullChildName.replace(
+    "plasmic-react-aria-",
+    ""
+  )}`;
+}
+function extractPlasmicDataProps(props) {
+  return Object.fromEntries(
+    Object.entries(props).filter(([key]) => key.startsWith("data-plasmic-"))
+  );
+}
+function isDefined(thing) {
+  return thing !== void 0 && thing !== null;
+}
+function filterHoverProps(props) {
+  const _a = props, otherProps = __objRest(_a, [
+    "onHoverStart",
+    "onHoverChange",
+    "onHoverEnd"
+  ]);
+  return otherProps;
+}
+
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+function hasParent(_props, ctx) {
+  return isDefined(ctx == null ? void 0 : ctx.parent) === true;
+}
+function isParentReadOnly(_props, ctx) {
+  var _a;
+  return ((_a = ctx == null ? void 0 : ctx.parent) == null ? void 0 : _a.isReadOnly) === true;
+}
+function isParentDisabled(_props, ctx) {
+  var _a;
+  return ((_a = ctx == null ? void 0 : ctx.parent) == null ? void 0 : _a.isDisabled) === true;
+}
+function resolveAutoComplete(autoCompleteProp) {
+  if (typeof autoCompleteProp === "string") {
+    return autoCompleteProp;
+  }
+  if (!autoCompleteProp || !Array.isArray(autoCompleteProp) || autoCompleteProp.includes("off")) {
+    return void 0;
+  }
+  if (autoCompleteProp.includes("off")) {
+    return "off";
+  }
+  if (autoCompleteProp.includes("on") && autoCompleteProp.length === 1) {
+    return "on";
+  }
+  return autoCompleteProp.filter((x) => x !== "on").join(" ");
+}
+function createIdProp(componentName) {
+  return {
+    type: "string",
+    description: `Sets the HTML id attribute on the root element of the ${componentName}.`,
+    advanced: true
+  };
+}
+function createNameProp() {
+  return {
+    type: "string",
+    description: "Name for this field if it is part of a form",
+    displayName: "Form field key",
+    hidden: hasParent,
+    advanced: true
+  };
+}
+function createDisabledProp(componentName) {
+  return {
+    displayName: "Disabled",
+    type: "boolean",
+    description: `Whether the ${componentName} is read-only and unfocusable`,
+    defaultValueHint: false,
+    hidden: isParentDisabled
+  };
+}
+function createReadOnlyProp(componentName) {
+  return {
+    displayName: "Read only",
+    type: "boolean",
+    description: `Whether the value of this ${componentName} can be changed by the user. Unlike disabled, read-only does not prevent the user from interacting with the component (such as focus).`,
+    defaultValueHint: false,
+    advanced: true,
+    hidden: isParentReadOnly
+  };
+}
+function createRequiredProp(componentName) {
+  return {
+    displayName: "Required",
+    type: "boolean",
+    description: `Whether user input is required on the ${componentName} before form submission.`,
+    defaultValueHint: false,
+    advanced: true,
+    // hidden: hasParent,
+    hidden: () => true
+    // hiding required prop until the release of Aria Forms
+  };
+}
+function createAutoFocusProp(componentName) {
+  return {
+    type: "boolean",
+    description: `Whether the ${componentName} should be focused when rendered`,
+    defaultValueHint: false,
+    advanced: true,
+    hidden: hasParent
+  };
+}
+function createAriaLabelProp(componentName) {
+  return {
+    type: "string",
+    displayName: "ARIA label",
+    description: `Assistive technology uses this if there is no visible label for this ${componentName}`,
+    advanced: true,
+    hidden: hasParent
+  };
+}
+function createInitialValueProp(componentName) {
+  return {
+    type: "string",
+    editOnly: true,
+    displayName: "Initial value",
+    uncontrolledProp: "defaultValue",
+    description: `The default value of the ${componentName}`,
+    hidden: hasParent
+  };
+}
+function createMaxLengthProp() {
+  return {
+    type: "number",
+    description: "The maximum number of characters supported by the input",
+    advanced: true,
+    hidden: hasParent
+  };
+}
+function createMinLengthProp() {
+  return {
+    type: "number",
+    description: "The minimum number of characters supported by the input",
+    advanced: true,
+    hidden: hasParent
+  };
+}
+function createPatternProp() {
+  return {
+    type: "string",
+    description: "Regex pattern that the value of the input must match to be valid",
+    helpText: "For more information about writing Regular Expressions (regex), visit [Regexr](https://regexr.com/)",
+    validator: (value) => {
+      try {
+        new RegExp(value);
+        return true;
+      } catch (_err) {
+        return "Invalid Regex";
+      }
+    },
+    advanced: true,
+    hidden: hasParent
+  };
+}
+function createInputTypeProp() {
+  return {
+    type: "choice",
+    defaultValueHint: "text",
+    options: ["text", "search", "url", "tel", "email", "password"],
+    description: "The type of data that an input field is expected to handle. It influences the input's behavior, validation, and the kind of interface provided to the user.",
+    advanced: true,
+    hidden: hasParent
+  };
+}
+function createInputModeProp() {
+  return {
+    type: "choice",
+    description: "hint to browsers as to the type of virtual keyboard configuration to use when editing this element or its contents.",
+    options: [
+      "none",
+      "text",
+      "tel",
+      "url",
+      "email",
+      "numeric",
+      "decimal",
+      "search"
+    ],
+    hidden: hasParent
+  };
+}
+function createAutoCompleteProp() {
+  return {
+    type: "choice",
+    advanced: true,
+    multiSelect: true,
+    hidden: hasParent,
+    description: "Guidance as to the type of data expected in the field",
+    helpText: "Learn more about the available options on the [MDN guide](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete#values)",
+    options: [
+      "on",
+      "off",
+      "name",
+      "honorific-prefix",
+      "given-name",
+      "additional-name",
+      "family-name",
+      "honorific-suffix",
+      "nickname",
+      "email",
+      "username",
+      "new-password",
+      "current-password",
+      "one-time-code",
+      "organization-title",
+      "organization",
+      "street-address",
+      "shipping",
+      "billing",
+      "address-line1",
+      "address-line2",
+      "address-line3",
+      "address-level4",
+      "address-level3",
+      "address-level2",
+      "address-level1",
+      "country",
+      "country-name",
+      "postal-code",
+      "cc-name",
+      "cc-given-name",
+      "cc-additional-name",
+      "cc-family-name",
+      "cc-number",
+      "cc-exp",
+      "cc-exp-month",
+      "cc-exp-year",
+      "cc-csc",
+      "cc-type",
+      "transaction-currency",
+      "transaction-amount",
+      "language",
+      "bday",
+      "bday-day",
+      "bday-month",
+      "bday-year",
+      "sex",
+      "tel",
+      "tel-country-code",
+      "tel-national",
+      "tel-area-code",
+      "tel-local",
+      "tel-local-suffix",
+      "tel-local-prefix",
+      "tel-extension",
+      "impp",
+      "url",
+      "photo",
+      "webauthn"
+    ]
+  };
+}
+function createValidationBehaviorProp() {
+  return {
+    type: "choice",
+    options: ["native", "aria"],
+    description: "Whether to use native HTML form validation to prevent form submission when the value is missing or invalid, or mark the field as required or invalid via ARIA.",
+    defaultValueHint: "native",
+    advanced: true,
+    hidden: hasParent
+  };
+}
+function createOnChangeProp(argType = "string") {
+  return {
+    type: "eventHandler",
+    argTypes: [{ name: "value", type: argType }],
+    hidden: hasParent
+  };
+}
+function createOnFocusProp() {
+  return {
+    type: "eventHandler",
+    argTypes: [{ name: "focusEvent", type: "object" }],
+    advanced: true,
+    hidden: hasParent
+  };
+}
+function createOnBlurProp() {
+  return {
+    type: "eventHandler",
+    argTypes: [{ name: "focusEvent", type: "object" }],
+    advanced: true,
+    hidden: hasParent
+  };
+}
+function createOnFocusChangeProp() {
+  return {
+    type: "eventHandler",
+    argTypes: [{ name: "isFocused", type: "boolean" }],
+    advanced: true,
+    hidden: hasParent
+  };
+}
+function createOnKeyDownProp() {
+  return {
+    type: "eventHandler",
+    argTypes: [{ name: "keyboardEvent", type: "object" }],
+    advanced: true,
+    hidden: hasParent
+  };
+}
+function createOnKeyUpProp() {
+  return {
+    type: "eventHandler",
+    argTypes: [{ name: "keyboardEvent", type: "object" }],
+    advanced: true,
+    hidden: hasParent
+  };
+}
+function createOnCopyProp() {
+  return {
+    type: "eventHandler",
+    argTypes: [{ name: "clipbordEvent", type: "object" }],
+    advanced: true,
+    hidden: hasParent
+  };
+}
+function createOnCutProp() {
+  return {
+    type: "eventHandler",
+    argTypes: [{ name: "clipbordEvent", type: "object" }],
+    advanced: true,
+    hidden: hasParent
+  };
+}
+function createOnPasteProp() {
+  return {
+    type: "eventHandler",
+    argTypes: [{ name: "clipbordEvent", type: "object" }],
+    advanced: true,
+    hidden: hasParent
+  };
+}
+function createOnCompositionStartProp() {
+  return {
+    type: "eventHandler",
+    argTypes: [{ name: "compositionEvent", type: "object" }],
+    advanced: true,
+    hidden: hasParent
+  };
+}
+function createOnCompositionEndProp() {
+  return {
+    type: "eventHandler",
+    argTypes: [{ name: "compositionEvent", type: "object" }],
+    advanced: true,
+    hidden: hasParent
+  };
+}
+function createOnCompositionUpdateProp() {
+  return {
+    type: "eventHandler",
+    argTypes: [{ name: "compositionEvent", type: "object" }],
+    advanced: true,
+    hidden: hasParent
+  };
+}
+function createOnSelectProp() {
+  return {
+    type: "eventHandler",
+    argTypes: [{ name: "selectionEvent", type: "object" }],
+    advanced: true,
+    hidden: hasParent
+  };
+}
+function createOnBeforeInputProp() {
+  return {
+    type: "eventHandler",
+    argTypes: [{ name: "inputEvent", type: "object" }],
+    advanced: true,
+    hidden: hasParent
+  };
+}
+function createOnInputProp() {
+  return {
+    type: "eventHandler",
+    argTypes: [{ name: "inputEvent", type: "object" }],
+    advanced: true,
+    hidden: hasParent
+  };
+}
+function createPlaceholderProp() {
+  return {
+    type: "string"
+  };
+}
+function createPlacementProp(componentName, overrides) {
+  return __spreadValues({
+    type: "choice",
+    description: `Default placement of the ${componentName} relative to the trigger, if there is enough space`,
+    options: [
+      "bottom",
+      "bottom left",
+      "bottom right",
+      "bottom start",
+      "bottom end",
+      "top",
+      "top left",
+      "top right",
+      "top start",
+      "top end",
+      "left",
+      "left top",
+      "left bottom",
+      "start",
+      "start top",
+      "start bottom",
+      "right",
+      "right top",
+      "right bottom",
+      "end",
+      "end top",
+      "end bottom"
+    ]
+  }, overrides != null ? overrides : {});
+}
+function createOffsetProp(componentName, overrides) {
+  return __spreadValues({
+    type: "number",
+    displayName: "Offset",
+    description: `Additional offset applied along the main axis between the ${componentName} and its trigger`,
+    advanced: true
+  }, overrides != null ? overrides : {});
+}
+function createContainerPaddingProp(componentName, overrides) {
+  return __spreadValues({
+    type: "number",
+    description: `The padding that should be applied between the ${componentName} and its surrounding container. This affects the positioning breakpoints that determine when it will attempt to flip.`,
+    advanced: true
+  }, overrides != null ? overrides : {});
+}
+function createCrossOffsetProp(componentName, overrides) {
+  return __spreadValues({
+    type: "number",
+    description: `The additional offset applied along the cross axis between the ${componentName} and its anchor element.`,
+    advanced: true
+  }, overrides != null ? overrides : {});
+}
+function getCommonOverlayProps(componentName, overrides) {
+  const commonProps = {
+    placement: createPlacementProp(componentName, overrides["placement"]),
+    offset: createOffsetProp(componentName, overrides["offset"]),
+    containerPadding: createContainerPaddingProp(
+      componentName,
+      overrides["containerPadding"]
+    ),
+    crossOffset: createCrossOffsetProp(
+      componentName,
+      overrides["crossOffset"]
+    )
+  };
+  return commonProps;
+}
+const arrowDown = {
+  type: "hbox",
+  children: [],
+  styles: {
+    width: 0,
+    height: 0,
+    padding: 0,
+    borderLeftWidth: "5px",
+    borderRightWidth: "5px",
+    borderTopWidth: "5px",
+    borderLeftStyle: "solid",
+    borderRightStyle: "solid",
+    borderTopStyle: "solid",
+    borderLeftColor: "transparent",
+    borderRightColor: "transparent",
+    borderTopColor: "black"
+  }
+};
+const COMMON_STYLES = { boxSizing: "border-box" };
+function commonInputEventHandlerProps() {
+  return {
+    // Events supported uniformly by all three
+    onChange: createOnChangeProp("string"),
+    onFocus: createOnFocusProp(),
+    onBlur: createOnBlurProp(),
+    onKeyDown: createOnKeyDownProp(),
+    onKeyUp: createOnKeyUpProp(),
+    onCopy: createOnCopyProp(),
+    onCut: createOnCutProp(),
+    onPaste: createOnPasteProp(),
+    onCompositionStart: createOnCompositionStartProp(),
+    onCompositionEnd: createOnCompositionEndProp(),
+    onCompositionUpdate: createOnCompositionUpdateProp(),
+    onSelect: createOnSelectProp(),
+    onBeforeInput: createOnBeforeInputProp(),
+    onInput: createOnInputProp()
+  };
+}
+
+exports.COMMON_STYLES = COMMON_STYLES;
+exports.arrowDown = arrowDown;
+exports.commonInputEventHandlerProps = commonInputEventHandlerProps;
+exports.createAriaLabelProp = createAriaLabelProp;
+exports.createAutoCompleteProp = createAutoCompleteProp;
+exports.createAutoFocusProp = createAutoFocusProp;
+exports.createDisabledProp = createDisabledProp;
+exports.createIdProp = createIdProp;
+exports.createInitialValueProp = createInitialValueProp;
+exports.createInputModeProp = createInputModeProp;
+exports.createInputTypeProp = createInputTypeProp;
+exports.createMaxLengthProp = createMaxLengthProp;
+exports.createMinLengthProp = createMinLengthProp;
+exports.createNameProp = createNameProp;
+exports.createOnFocusChangeProp = createOnFocusChangeProp;
+exports.createPatternProp = createPatternProp;
+exports.createPlaceholderProp = createPlaceholderProp;
+exports.createReadOnlyProp = createReadOnlyProp;
+exports.createRequiredProp = createRequiredProp;
+exports.createValidationBehaviorProp = createValidationBehaviorProp;
+exports.extractPlasmicDataProps = extractPlasmicDataProps;
+exports.filterHoverProps = filterHoverProps;
+exports.getCommonOverlayProps = getCommonOverlayProps;
+exports.hasParent = hasParent;
+exports.isDefined = isDefined;
+exports.makeChildComponentName = makeChildComponentName;
+exports.makeComponentName = makeComponentName;
+exports.registerComponentHelper = registerComponentHelper;
+exports.resolveAutoComplete = resolveAutoComplete;
+exports.useAutoOpen = useAutoOpen;
+exports.useIsOpen = useIsOpen;
+exports.useIsomorphicLayoutEffect = useIsomorphicLayoutEffect;
+//# sourceMappingURL=common-7f948fa5.cjs.js.map