{
  "version": 3,
  "sources": ["ssg:https://framerusercontent.com/modules/9N50PMbCaZNc8J76vXRL/zbPz4O3CnWxY2tjbhM7b/TextMask.js"],
  "sourcesContent": ["import { jsx as _jsx } from \"react/jsx-runtime\";\nimport { addPropertyControls, ControlType } from \"framer\"; /**\n                                                           * TEXTMASK\n                                                           * By Benjamin den Boer\n                                                           * @benjaminnathan\n                                                           *\n                                                           * @framerIntrinsicWidth 260\n                                                           * @framerIntrinsicHeight 200\n                                                           * @framerDisableUnlink\n                                                           *\n                                                           * @framerSupportedLayoutWidth any-prefer-fixed\n                                                           * @framerSupportedLayoutHeight any\n                                                           */\nexport default function TextMask(props) {\n  const {\n    textContent,\n    image,\n    bgSizeType,\n    bgSize,\n    bgPosX,\n    bgPosY,\n    font,\n    padding,\n    paddingPerSide,\n    paddingTop,\n    paddingRight,\n    paddingBottom,\n    paddingLeft\n  } = props;\n  const {\n    color,\n    fontSize,\n    fontFamily,\n    fontWeight,\n    fontStyle,\n    textAlign,\n    letterSpacing,\n    whiteSpace,\n    lineHeight,\n    lineHeightPixels,\n    lineHeightType\n  } = font;\n  const backgroundSizeValue = props.bgSizeType === \"cover\" || props.bgSizeType === \"contain\" ? bgSizeType : `${bgSize}%`;\n  const paddingValue = paddingPerSide ? `${paddingTop}px ${paddingRight}px ${paddingBottom}px ${paddingLeft}px` : `${padding}px`;\n  return /*#__PURE__*/_jsx(\"h1\", {\n    style: {\n      backgroundImage: image && `url(${image.src})`,\n      backgroundSize: backgroundSizeValue,\n      backgroundRepeat: \"no-repeat\",\n      backgroundPosition: `${bgPosX}% ${bgPosY}%`,\n      backgroundClip: image && \"text\",\n      WebkitBackgroundClip: image && \"text\",\n      WebkitTextFillColor: image && \"transparent\",\n      textFillColor: image && \"transparent\",\n      color,\n      fontSize,\n      fontFamily: `\"${fontFamily}\", sans-serif`,\n      fontStyle,\n      fontWeight,\n      textAlign,\n      letterSpacing,\n      whiteSpace,\n      lineHeight: lineHeightType ? lineHeight : `${lineHeightPixels}px`,\n      margin: 0,\n      padding: paddingValue\n    },\n    children: textContent\n  });\n}\n; /* Default Properties */\nTextMask.defaultProps = {\n  textContent: \"Hello\",\n  bgSize: 100,\n  bgPosX: 0,\n  bgPosY: 0,\n  font: {\n    fontSize: 100,\n    lineHeight: 1,\n    lineHeightType: true\n  }\n};\nTextMask.displayName = \"Text Mask\"; /* Property Controls */\naddPropertyControls(TextMask, {\n  textContent: {\n    type: ControlType.String,\n    title: \"Text\",\n    defaultValue: \"Hello\"\n  },\n  image: {\n    type: ControlType.ResponsiveImage,\n    title: \"Image\"\n  },\n  bgSizeType: {\n    type: ControlType.Enum,\n    options: [\"cover\", \"contain\", \"percentage\"],\n    optionTitles: [\"Cover\", \"Contain\", \"Percentage\"],\n    title: \"Background\",\n    defaultValue: \"cover\"\n  },\n  bgSize: {\n    type: ControlType.Number,\n    min: 0,\n    max: 200,\n    defaultValue: 100,\n    unit: \"%\",\n    title: \"Size\",\n    hidden: props => props.bgSizeType === \"cover\" || props.bgSizeType === \"contain\"\n  },\n  bgPosX: {\n    type: ControlType.Number,\n    min: 0,\n    max: 100,\n    defaultValue: 0,\n    unit: \"%\",\n    title: \"Offset X\"\n  },\n  bgPosY: {\n    type: ControlType.Number,\n    min: 0,\n    max: 100,\n    defaultValue: 0,\n    unit: \"%\",\n    title: \"Offset Y\"\n  },\n  font: {\n    type: ControlType.Object,\n    controls: {\n      color: {\n        type: ControlType.Color,\n        defaultValue: \"#888\"\n      },\n      fontSize: {\n        type: ControlType.Number,\n        title: \"Size\",\n        min: 0,\n        displayStepper: true,\n        step: 1,\n        defaultValue: 100\n      },\n      fontFamily: {\n        type: ControlType.String,\n        title: \"Font\",\n        defaultValue: \"Inter\"\n      },\n      fontWeight: {\n        type: ControlType.Enum,\n        title: \"Weight\",\n        options: [100, 200, 300, 400, 500, 600, 700, 800, 900],\n        defaultValue: 400\n      },\n      fontStyle: {\n        type: ControlType.Enum,\n        title: \"Style\",\n        options: [\"normal\", \"italic\", \"oblique\"],\n        optionTitles: [\"Normal\", \"Italic\", \"Oblique\"],\n        defaultValue: \"normal\"\n      },\n      textAlign: {\n        type: ControlType.Enum,\n        displaySegmentedControl: true,\n        title: \"Align\",\n        options: [\"left\", \"center\", \"right\"],\n        optionTitles: [\"Left\", \"Center\", \"Right\"],\n        defaultValue: \"center\"\n      },\n      whiteSpace: {\n        type: ControlType.Enum,\n        title: \"Space\",\n        options: [\"normal\", \"nowrap\", \"pre\", \"pre-wrap\", \"preline\", \"break-spaces\"],\n        optionTitles: [\"Normal\", \"No Wrap\", \"Pre\", \"Pre Wrap\", \"Preline\", \"Break Spaces\"],\n        defaultValue: \"center\"\n      },\n      letterSpacing: {\n        type: ControlType.Number,\n        title: \"Letter\",\n        min: -100,\n        max: 100,\n        displayStepper: true,\n        step: .1,\n        defaultValue: 0\n      },\n      lineHeight: {\n        type: ControlType.Number,\n        title: \"Line\",\n        min: -500,\n        max: 500,\n        displayStepper: true,\n        step: .1,\n        defaultValue: 1,\n        hidden: props => !props.lineHeightType\n      },\n      lineHeightPixels: {\n        type: ControlType.Number,\n        title: \"Line\",\n        min: -500,\n        max: 500,\n        displayStepper: true,\n        step: .1,\n        defaultValue: 100,\n        hidden: props => props.lineHeightType\n      },\n      lineHeightType: {\n        type: ControlType.Boolean,\n        title: \" \",\n        enabledTitle: \"em\",\n        disabledTitle: \"px\",\n        defaultValue: true\n      }\n    }\n  },\n  padding: {\n    title: \"Padding\",\n    type: ControlType.FusedNumber,\n    toggleKey: \"paddingPerSide\",\n    toggleTitles: [\"Padding\", \"Padding per side\"],\n    defaultValue: 0,\n    valueKeys: [\"paddingTop\", \"paddingRight\", \"paddingBottom\", \"paddingLeft\"],\n    valueLabels: [\"T\", \"R\", \"B\", \"L\"],\n    min: 0\n  }\n});\nexport const __FramerMetadata__ = {\n  \"exports\": {\n    \"default\": {\n      \"type\": \"reactComponent\",\n      \"name\": \"TextMask\",\n      \"slots\": [],\n      \"annotations\": {\n        \"framerSupportedLayoutHeight\": \"any\",\n        \"framerContractVersion\": \"1\",\n        \"framerDisableUnlink\": \"*\",\n        \"framerIntrinsicHeight\": \"200\",\n        \"framerIntrinsicWidth\": \"260\",\n        \"framerSupportedLayoutWidth\": \"any-prefer-fixed\"\n      }\n    },\n    \"__FramerMetadata__\": {\n      \"type\": \"variable\"\n    }\n  }\n};\n//# sourceMappingURL=./TextMask.map"],
  "mappings": "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",
  "names": ["TextMask", "props", "textContent", "image", "bgSizeType", "bgSize", "bgPosX", "bgPosY", "font", "padding", "paddingPerSide", "paddingTop", "paddingRight", "paddingBottom", "paddingLeft", "color", "fontSize", "fontFamily", "fontWeight", "fontStyle", "textAlign", "letterSpacing", "whiteSpace", "lineHeight", "lineHeightPixels", "lineHeightType", "backgroundSizeValue", "paddingValue", "p", "addPropertyControls", "ControlType"]
}