unframer 2.0.0 → 2.0.1
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/framer.d.ts.map +1 -1
- package/dist/framer.js +901 -710
- package/dist/framer.js.map +1 -1
- package/esm/framer.d.ts.map +1 -1
- package/esm/framer.js +347 -162
- package/esm/framer.js.map +1 -1
- package/package.json +1 -1
- package/src/framer.js +390 -168
package/dist/framer.js
CHANGED
|
@@ -47,15 +47,15 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
47
47
|
};
|
|
48
48
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
49
49
|
exports.ComponentPresetsProvider = exports.ComponentPresetsConsumer = exports.ComponentContainerContext = exports.complex = exports.combinedCSSRulesForPreview = exports.ColorMixModelType = exports.ColorFormat = exports.color = exports.Color = exports.collectVisualStyleFromProps = exports.clamp = exports.circOut = exports.circInOut = exports.circIn = exports.checkTargetForNewValues = exports.CanvasStore = exports.cancelSync = exports.cancelFrame = exports.callEach = exports.calculateRect = exports.calcLength = exports.buildTransform = exports.BoxShadow = exports.BezierAnimator = exports.backOut = exports.backInOut = exports.backIn = exports.backgroundImageFromProps = exports.BackgroundImage = exports.AutomaticLayoutIds = exports.AnyInterpolation = exports.anticipate = exports.annotateTypeOnStringify = exports.animations = exports.animationControls = exports.animateVisualElement = exports.animateValue = exports.AnimateSharedLayout = exports.AnimatePresence = exports.animate = exports.Animatable = exports.AnchorLinkTarget = exports.addScaleCorrector = exports.addPropertyControls = exports.addPointerInfo = exports.addPointerEvent = exports.addFonts = exports.addActionControls = exports._injectRuntime = exports.combinedCSSRules = void 0;
|
|
50
|
-
exports.
|
|
51
|
-
exports.
|
|
52
|
-
exports.
|
|
53
|
-
exports.
|
|
54
|
-
exports.
|
|
55
|
-
exports.
|
|
56
|
-
exports.wrap = exports.withVariantFX = exports.withVariantAppearEffect = exports.withStyleAppearEffect = exports.withShape = exports.withPath = exports.withParallaxTransform = exports.WithOverride = exports.withOpacity = exports.WithNavigator = exports.withMeasuredSize = exports.withMappedReactProps = exports.withGeneratedLayoutId = exports.withFX = exports.withCSS = exports.WindowContext = exports.warning = exports.visualElementStore = void 0;
|
|
50
|
+
exports.easeOut = exports.easeInOut = exports.easeIn = exports.Draggable = exports.DragControls = exports.domMax = exports.domAnimation = exports.DOM = exports.distance2D = exports.distance = exports.dispatchKeyDownEvent = exports.disableInstantTransitions = exports.DimensionType = exports.devicePresets = exports.DeviceCodeComponent = exports.Device = exports.LayoutGroupContext = exports.DeprecatedLayoutGroupContext = exports.DeprecatedFrameWithEvents = exports.DeprecatedComponentContainer = exports.delay = exports.degreesToRadians = exports.defaultDeviceProps = exports.debounce = exports.DataObserverContext = exports.DataObserver = exports.DataContext = exports.Data = exports.CycleVariantState = exports.cx = exports.CustomProperties = exports.CustomCursorHost = exports.cubicBezier = exports.cssBackgroundSize = exports.createScopedAnimate = exports.createMotionComponent = exports.createFramerPageLink = exports.createDomMotionComponent = exports.createDesignComponent = exports.createData = exports.createBox = exports.convertPropsToDeviceOptions = exports.convertPresentationTree = exports.ConvertColor = exports.ControlType = exports.Container = exports.ConstraintValues = exports.constraintsEnabled = exports.ConstraintMask = exports.ComponentViewportProvider = void 0;
|
|
51
|
+
exports.invariant = exports.interpolate = exports.InternalID = exports.installFlexboxGapWorkaroundIfNeeded = exports.injectComponentCSSRules = exports.inferInitialRouteFromPath = exports.imageUrlForAsset = exports.imagePatternPropsForFill = exports.Image = exports.gradientForShape = exports.getWhereExpressionFromPathVariables = exports.getPropertyControls = exports.getMergedConstraintsProps = exports.getMeasurableCodeComponentChildren = exports.getFontsFromSharedStyle = exports.getFontsFromComponentPreset = exports.getFonts = exports.getDevicePreset = exports.getComponentSize = exports.GeneratedComponentContext = exports.GamepadContext = exports.FrameWithMotion = exports.FramerEventSession = exports.FramerEventListener = exports.FramerEvent = exports.framerAppearTransformTemplateToken = exports.framerAppearIdKey = exports.framerAppearEffects = exports.framerAppearAnimationScriptKey = exports.FramerAnimation = exports.frameFromElements = exports.frameFromElement = exports.frameData = exports.frame = exports.Frame = exports.fraction = exports.FormPlainTextInput = exports.FormContainer = exports.FormButton = exports.forceLayerBackingWithCSSProperties = exports.fontStore = exports.FontSourceNames = exports.Floating = exports.FlatTree = exports.finiteNumber = exports.filterProps = exports.executeInRenderEnvironment = exports.ErrorPlaceholder = exports.environment = exports.EmptyState = void 0;
|
|
52
|
+
exports.motionValue = exports.MotionValue = exports.MotionSetup = exports.MotionGlobalConfig = exports.MotionContext = exports.MotionConfigContext = exports.MotionConfig = exports.motion = exports.modulate = exports.mix = exports.mirrorEasing = exports.memoize = exports.makeUseVisualState = exports.makePaddingString = exports.MainLoop = exports.m = exports.localShadowFrame = exports.localPackageFallbackIdentifier = exports.loadJSON = exports.loadFont = exports.Link = exports.LinearGradient = exports.Line = exports.LibraryFeaturesProvider = exports.LazyValue = exports.LazyMotion = exports.lazy = exports.LayoutIdContext = exports.LayoutGroup = exports.Layer = exports.isValidMotionProp = exports.isStraightCurve = exports.isShallowEqualArray = exports.isRelativeNumber = exports.isReactDefinition = exports.isOverride = exports.isOfAnnotatedType = exports.isMotionValue = exports.isMotionComponent = exports.isGapEnabled = exports.isFramerPageLink = exports.isFramerGamepadKeydownData = exports.isFractionDimension = exports.isFiniteNumber = exports.isEqual = exports.isDragActive = exports.isDesignDefinition = exports.isBrowser = exports.isAnimatable = exports.inView = void 0;
|
|
53
|
+
exports.Shadow = exports.setGlobalRenderEnvironment = exports.scrollInfo = exports.scroll = exports.Scroll = exports.roundWithOffset = exports.roundedNumberString = exports.roundedNumber = exports.RichText = exports.reverseEasing = exports.resolvePageScope = exports.resolveMotionValue = exports.ResolveLinks = exports.resolveLink = exports.Reorder = exports.RenderTarget = exports.RenderNodeProvider = exports.removeHiddenBreakpointLayers = exports.Rect = exports.RadialGradient = exports.QueryEngine = exports.px = exports.propsForLink = exports.PropertyStore = exports.PropertyOverrides = exports.progress = exports.print = exports.PresenceContext = exports.Polygon = exports.Point = exports.pipe = exports.PathVariablesContext = exports.PathSegment = exports.pathDefaults = exports.parseFramerPageLink = exports.ParentSizeState = exports.PageRoot = exports.PageEffectsProvider = exports.Page = exports.paddingFromProps = exports.optimizedAppearDataAttribute = exports.optimizeAppearTransformTemplate = exports.optimizeAppear = exports.ObservableObject = exports.NotFoundError = exports.Navigation = exports.NavigationTransitionType = exports.NavigationConsumer = exports.NavigationCallbackProvider = exports.NavigateTo = void 0;
|
|
54
|
+
exports.useHydratedBreakpointVariants = exports.useHotkey = exports.useGamepad = exports.useForceUpdate = exports.useElementScroll = exports.useDynamicRefs = exports.useDragControls = exports.useDomEvent = exports.useDataRecord = exports.useCycle = exports.useCustomCursors = exports.useCurrentRouteId = exports.useCurrentPathVariables = exports.useConstant = exports.useComponentViewport = exports.useBreakpointVariants = exports.useAnimationFrame = exports.useAnimationControls = exports.useAnimation = exports.useDeprecatedAnimatedState = exports.useAnimatedState = exports.useAnimate = exports.useAddVariantProps = exports.useActiveVariantCallback = exports.useActiveTargetCallback = exports.unwrapMotionComponent = exports.transformTemplate = exports.transformString = exports.transform = exports.toSVGPath = exports.toJustifyOrAlignment = exports.toFlexDirection = exports.throttle = exports.Text = exports.systemFontFamilyName = exports.sync = exports.SwitchLayoutGroupContext = exports.SVG = exports.StyleSheetContext = exports.steps = exports.startOptimizedAppearAnimation = exports.startAnimation = exports.stagger = exports.Stack = exports.SSRVariants = exports.SpringAnimator = exports.spring = exports.Size = exports.shouldOpenLinkInNewTab = exports.sharedSVGManager = void 0;
|
|
55
|
+
exports.ValueInterpolation = exports.useWillChange = exports.useViewportScroll = exports.useVelocity = exports.useVariantState = exports.useUnmountEffect = exports.useTransform = exports.useTime = exports.useSpring = exports.useScroll = exports.useRouter = exports.useRouteHandler = exports.useRouteElementId = exports.useRouteAnchor = exports.useRoute = exports.useResetProjection = exports.useRenderEnvironment = exports.useReducedMotionConfig = exports.useReducedMotion = exports.useQueryData = exports.useQueryCount = exports.useProvidedWindow = exports.usePrototypeNavigate = exports.usePresence = exports.usePageEffects = exports.useOverlayState = exports.useOnVariantChange = exports.useOnCurrentTargetChange = exports.useOnAppear = exports.useObserveData = exports.useNavigation = exports.useNavigate = exports.useMotionValueEvent = exports.useMotionValue = exports.useMotionTemplate = exports.useMeasureLayout = exports.useLocalizationInfo = exports.useLocaleInfo = exports.useLocaleCode = exports.useLocale = exports.useIsPresent = exports.useIsOnFramerCanvas = exports.useIsomorphicLayoutEffect = exports.useIsInCurrentNavigationTarget = exports.useInView = exports.useDeprecatedInvertedScale = exports.useInvertedScale = exports.useInstantTransition = exports.useInstantLayoutTransition = exports.useInitialRouteComponent = void 0;
|
|
56
|
+
exports.wrap = exports.withVariantFX = exports.withVariantAppearEffect = exports.withStyleAppearEffect = exports.withShape = exports.withPath = exports.withParallaxTransform = exports.WithOverride = exports.withOpacity = exports.WithNavigator = exports.withMeasuredSize = exports.withMappedReactProps = exports.withGeneratedLayoutId = exports.withFX = exports.withCSS = exports.WindowContext = exports.warning = exports.visualElementStore = exports.VisualElement = exports.version = exports.VectorGroup = exports.Vector = exports.VariantSelector = exports.valueToDimensionType = void 0;
|
|
57
57
|
// @ts-nocheck
|
|
58
|
-
// https :https://app.framerstatic.com/chunk-
|
|
58
|
+
// https :https://app.framerstatic.com/chunk-O7E5UDPD.js
|
|
59
59
|
const react_1 = require("react");
|
|
60
60
|
const react_2 = require("react");
|
|
61
61
|
const react_3 = require("react");
|
|
@@ -75,28 +75,28 @@ const react_15 = require("react");
|
|
|
75
75
|
const react_16 = require("react");
|
|
76
76
|
const react_17 = require("react");
|
|
77
77
|
const react_18 = __importStar(require("react"));
|
|
78
|
-
const react_19 = require("react");
|
|
78
|
+
const react_19 = __importDefault(require("react"));
|
|
79
79
|
const react_20 = require("react");
|
|
80
80
|
const react_21 = require("react");
|
|
81
|
-
const React4 = __importStar(require("react"));
|
|
82
81
|
const react_22 = require("react");
|
|
83
|
-
const
|
|
82
|
+
const React4 = __importStar(require("react"));
|
|
84
83
|
const react_23 = require("react");
|
|
85
|
-
const
|
|
84
|
+
const React3 = __importStar(require("react"));
|
|
86
85
|
const react_24 = require("react");
|
|
87
|
-
const
|
|
86
|
+
const React2 = __importStar(require("react"));
|
|
88
87
|
const react_25 = require("react");
|
|
89
|
-
const
|
|
88
|
+
const React5 = __importStar(require("react"));
|
|
90
89
|
const react_26 = require("react");
|
|
90
|
+
const React6 = __importStar(require("react"));
|
|
91
91
|
const react_27 = require("react");
|
|
92
|
-
const React7 = __importStar(require("react"));
|
|
93
92
|
const react_28 = require("react");
|
|
93
|
+
const React7 = __importStar(require("react"));
|
|
94
94
|
const react_29 = require("react");
|
|
95
|
-
const React8 = __importStar(require("react"));
|
|
96
95
|
const react_30 = require("react");
|
|
96
|
+
const React8 = __importStar(require("react"));
|
|
97
97
|
const react_31 = require("react");
|
|
98
|
-
const React9 = __importStar(require("react"));
|
|
99
98
|
const react_32 = require("react");
|
|
99
|
+
const React9 = __importStar(require("react"));
|
|
100
100
|
const react_33 = require("react");
|
|
101
101
|
const react_34 = require("react");
|
|
102
102
|
const react_35 = require("react");
|
|
@@ -107,9 +107,10 @@ const react_39 = require("react");
|
|
|
107
107
|
const react_40 = require("react");
|
|
108
108
|
const react_41 = require("react");
|
|
109
109
|
const react_42 = require("react");
|
|
110
|
-
const React10 = __importStar(require("react"));
|
|
111
110
|
const react_43 = require("react");
|
|
111
|
+
const React10 = __importStar(require("react"));
|
|
112
112
|
const react_44 = require("react");
|
|
113
|
+
const react_45 = require("react");
|
|
113
114
|
const React11 = __importStar(require("react"));
|
|
114
115
|
var __create = Object.create;
|
|
115
116
|
var __defProp = Object.defineProperty;
|
|
@@ -1944,7 +1945,7 @@ var MotionValue = class {
|
|
|
1944
1945
|
* @internal
|
|
1945
1946
|
*/
|
|
1946
1947
|
constructor(init, options = {}) {
|
|
1947
|
-
this.version = '11.0.11-sync.
|
|
1948
|
+
this.version = '11.0.11-sync.5';
|
|
1948
1949
|
this.canTrackVelocity = false;
|
|
1949
1950
|
this.events = {};
|
|
1950
1951
|
this.updateAndNotify = (v, render = true) => {
|
|
@@ -3338,7 +3339,7 @@ function updateMotionValuesFromProps(element, next, prev) {
|
|
|
3338
3339
|
willChange.add(key7);
|
|
3339
3340
|
}
|
|
3340
3341
|
if (false) {
|
|
3341
|
-
warnOnce(nextValue.version === '11.0.11-sync.
|
|
3342
|
+
warnOnce(nextValue.version === '11.0.11-sync.5', `Attempting to mix Framer Motion versions ${nextValue.version} with 11.0.11-sync.5 may not work as expected.`);
|
|
3342
3343
|
}
|
|
3343
3344
|
}
|
|
3344
3345
|
else if (isMotionValue(prevValue)) {
|
|
@@ -3372,6 +3373,12 @@ function updateMotionValuesFromProps(element, next, prev) {
|
|
|
3372
3373
|
}
|
|
3373
3374
|
var featureNames = Object.keys(featureDefinitions);
|
|
3374
3375
|
var numFeatures = featureNames.length;
|
|
3376
|
+
function getClosestProjectingNode(visualElement) {
|
|
3377
|
+
if (!visualElement) {
|
|
3378
|
+
return void 0;
|
|
3379
|
+
}
|
|
3380
|
+
return visualElement.options.allowProjection !== false ? visualElement.projection : getClosestProjectingNode(visualElement.parent);
|
|
3381
|
+
}
|
|
3375
3382
|
var propEventHandlers = [
|
|
3376
3383
|
'AnimationStart',
|
|
3377
3384
|
'AnimationComplete',
|
|
@@ -3529,7 +3536,7 @@ var VisualElement = class {
|
|
|
3529
3536
|
}
|
|
3530
3537
|
}
|
|
3531
3538
|
if ((this.type === 'html' || this.type === 'svg') && !this.projection && ProjectionNodeConstructor) {
|
|
3532
|
-
this.projection = new ProjectionNodeConstructor(this.latestValues, this.parent
|
|
3539
|
+
this.projection = new ProjectionNodeConstructor(this.latestValues, getClosestProjectingNode(this.parent));
|
|
3533
3540
|
const { layoutId, layout: layout2, drag: drag2, dragConstraints, layoutScroll, layoutRoot, } = renderedProps;
|
|
3534
3541
|
this.projection.setOptions({
|
|
3535
3542
|
layoutId,
|
|
@@ -5524,7 +5531,10 @@ function buildProjectionTransform(delta, treeScale, latestTransform) {
|
|
|
5524
5531
|
transform2 += `scale(${1 / treeScale.x}, ${1 / treeScale.y}) `;
|
|
5525
5532
|
}
|
|
5526
5533
|
if (latestTransform) {
|
|
5527
|
-
const { rotate, rotateX, rotateY, skewX, skewY, } = latestTransform;
|
|
5534
|
+
const { transformPerspective, rotate, rotateX, rotateY, skewX, skewY, } = latestTransform;
|
|
5535
|
+
if (transformPerspective) {
|
|
5536
|
+
transform2 = `perspective(${transformPerspective}px) ${transform2}`;
|
|
5537
|
+
}
|
|
5528
5538
|
if (rotate) {
|
|
5529
5539
|
transform2 += `rotate(${rotate}deg) `;
|
|
5530
5540
|
}
|
|
@@ -7007,7 +7017,10 @@ var SVGVisualElement = class extends DOMVisualElement {
|
|
|
7007
7017
|
var createDomVisualElement = (Component23, options) => {
|
|
7008
7018
|
return isSVGComponent(Component23)
|
|
7009
7019
|
? new SVGVisualElement(options, { enableHardwareAcceleration: false, })
|
|
7010
|
-
: new HTMLVisualElement(options, {
|
|
7020
|
+
: new HTMLVisualElement(options, {
|
|
7021
|
+
enableHardwareAcceleration: true,
|
|
7022
|
+
allowProjection: Component23 !== react_19.default.Fragment,
|
|
7023
|
+
});
|
|
7011
7024
|
};
|
|
7012
7025
|
var layout = {
|
|
7013
7026
|
layout: {
|
|
@@ -7025,7 +7038,7 @@ exports.createDomMotionComponent = createDomMotionComponent;
|
|
|
7025
7038
|
var m = createMotionProxy(createDomMotionConfig);
|
|
7026
7039
|
exports.m = m;
|
|
7027
7040
|
function useIsMounted() {
|
|
7028
|
-
const isMounted = (0,
|
|
7041
|
+
const isMounted = (0, react_21.useRef)(false);
|
|
7029
7042
|
useIsomorphicLayoutEffect(() => {
|
|
7030
7043
|
isMounted.current = true;
|
|
7031
7044
|
return () => {
|
|
@@ -7036,16 +7049,16 @@ function useIsMounted() {
|
|
|
7036
7049
|
}
|
|
7037
7050
|
function useForceUpdate() {
|
|
7038
7051
|
const isMounted = useIsMounted();
|
|
7039
|
-
const [forcedRenderCount, setForcedRenderCount,] = (0,
|
|
7040
|
-
const forceRender = (0,
|
|
7052
|
+
const [forcedRenderCount, setForcedRenderCount,] = (0, react_20.useState)(0);
|
|
7053
|
+
const forceRender = (0, react_20.useCallback)(() => {
|
|
7041
7054
|
isMounted.current && setForcedRenderCount(forcedRenderCount + 1);
|
|
7042
7055
|
}, [forcedRenderCount,]);
|
|
7043
|
-
const deferredForceRender = (0,
|
|
7056
|
+
const deferredForceRender = (0, react_20.useCallback)(() => frame.postRender(forceRender), [forceRender,]);
|
|
7044
7057
|
return [deferredForceRender, forcedRenderCount,];
|
|
7045
7058
|
}
|
|
7046
7059
|
exports.useForceUpdate = useForceUpdate;
|
|
7047
7060
|
function useUnmountEffect(callback) {
|
|
7048
|
-
return (0,
|
|
7061
|
+
return (0, react_22.useEffect)(() => () => callback(), []);
|
|
7049
7062
|
}
|
|
7050
7063
|
exports.useUnmountEffect = useUnmountEffect;
|
|
7051
7064
|
var PopChildMeasure = class extends React2.Component {
|
|
@@ -7070,16 +7083,16 @@ var PopChildMeasure = class extends React2.Component {
|
|
|
7070
7083
|
}
|
|
7071
7084
|
};
|
|
7072
7085
|
function PopChild({ children, isPresent: isPresent2, }) {
|
|
7073
|
-
const id4 = (0,
|
|
7074
|
-
const ref = (0,
|
|
7075
|
-
const size2 = (0,
|
|
7086
|
+
const id4 = (0, react_25.useId)();
|
|
7087
|
+
const ref = (0, react_25.useRef)(null);
|
|
7088
|
+
const size2 = (0, react_25.useRef)({
|
|
7076
7089
|
width: 0,
|
|
7077
7090
|
height: 0,
|
|
7078
7091
|
top: 0,
|
|
7079
7092
|
left: 0,
|
|
7080
7093
|
});
|
|
7081
|
-
const { nonce, } = (0,
|
|
7082
|
-
(0,
|
|
7094
|
+
const { nonce, } = (0, react_25.useContext)(MotionConfigContext);
|
|
7095
|
+
(0, react_25.useInsertionEffect)(() => {
|
|
7083
7096
|
const { width, height, top, left, } = size2.current;
|
|
7084
7097
|
if (isPresent2 || !ref.current || !width || !height) {
|
|
7085
7098
|
return;
|
|
@@ -7109,8 +7122,8 @@ function PopChild({ children, isPresent: isPresent2, }) {
|
|
|
7109
7122
|
}
|
|
7110
7123
|
var PresenceChild = ({ children, initial, isPresent: isPresent2, onExitComplete, custom, presenceAffectsLayout, mode, }) => {
|
|
7111
7124
|
const presenceChildren = useConstant(newChildrenMap);
|
|
7112
|
-
const id4 = (0,
|
|
7113
|
-
const context = (0,
|
|
7125
|
+
const id4 = (0, react_24.useId)();
|
|
7126
|
+
const context = (0, react_24.useMemo)(() => ({
|
|
7114
7127
|
id: id4,
|
|
7115
7128
|
initial,
|
|
7116
7129
|
isPresent: isPresent2,
|
|
@@ -7135,7 +7148,7 @@ var PresenceChild = ({ children, initial, isPresent: isPresent2, onExitComplete,
|
|
|
7135
7148
|
* so they can detect that layout change.
|
|
7136
7149
|
*/
|
|
7137
7150
|
presenceAffectsLayout ? void 0 : [isPresent2,]);
|
|
7138
|
-
(0,
|
|
7151
|
+
(0, react_24.useMemo)(() => {
|
|
7139
7152
|
presenceChildren.forEach((_, key7) => presenceChildren.set(key7, false));
|
|
7140
7153
|
}, [isPresent2,]);
|
|
7141
7154
|
React3.useEffect(() => {
|
|
@@ -7158,8 +7171,8 @@ function updateChildLookup(children, allChildren) {
|
|
|
7158
7171
|
}
|
|
7159
7172
|
function onlyElements(children) {
|
|
7160
7173
|
const filtered = [];
|
|
7161
|
-
|
|
7162
|
-
if ((0,
|
|
7174
|
+
react_23.Children.forEach(children, (child) => {
|
|
7175
|
+
if ((0, react_23.isValidElement)(child)) {
|
|
7163
7176
|
filtered.push(child);
|
|
7164
7177
|
}
|
|
7165
7178
|
});
|
|
@@ -7167,14 +7180,14 @@ function onlyElements(children) {
|
|
|
7167
7180
|
}
|
|
7168
7181
|
var AnimatePresence = ({ children, custom, initial = true, onExitComplete, exitBeforeEnter, presenceAffectsLayout = true, mode = 'sync', }) => {
|
|
7169
7182
|
invariant(!exitBeforeEnter, 'Replace exitBeforeEnter with mode=\'wait\'');
|
|
7170
|
-
const forceRender = (0,
|
|
7183
|
+
const forceRender = (0, react_23.useContext)(LayoutGroupContext).forceRender || useForceUpdate()[0];
|
|
7171
7184
|
const isMounted = useIsMounted();
|
|
7172
7185
|
const filteredChildren = onlyElements(children);
|
|
7173
7186
|
let childrenToRender = filteredChildren;
|
|
7174
|
-
const exitingChildren = (0,
|
|
7175
|
-
const presentChildren = (0,
|
|
7176
|
-
const allChildren = (0,
|
|
7177
|
-
const isInitialRender = (0,
|
|
7187
|
+
const exitingChildren = (0, react_23.useRef)(/* @__PURE__ */ new Map()).current;
|
|
7188
|
+
const presentChildren = (0, react_23.useRef)(childrenToRender);
|
|
7189
|
+
const allChildren = (0, react_23.useRef)(/* @__PURE__ */ new Map()).current;
|
|
7190
|
+
const isInitialRender = (0, react_23.useRef)(true);
|
|
7178
7191
|
useIsomorphicLayoutEffect(() => {
|
|
7179
7192
|
isInitialRender.current = false;
|
|
7180
7193
|
updateChildLookup(filteredChildren, allChildren);
|
|
@@ -7258,27 +7271,27 @@ var AnimatePresence = ({ children, custom, initial = true, onExitComplete, exitB
|
|
|
7258
7271
|
if (false) {
|
|
7259
7272
|
console.warn(`You're attempting to animate multiple children within AnimatePresence, but its mode is set to "wait". This will lead to odd visual behaviour.`);
|
|
7260
7273
|
}
|
|
7261
|
-
return React4.createElement(React4.Fragment, null, exitingChildren.size ? childrenToRender : childrenToRender.map((child) => (0,
|
|
7274
|
+
return React4.createElement(React4.Fragment, null, exitingChildren.size ? childrenToRender : childrenToRender.map((child) => (0, react_23.cloneElement)(child)));
|
|
7262
7275
|
};
|
|
7263
7276
|
exports.AnimatePresence = AnimatePresence;
|
|
7264
7277
|
function MotionConfig(_f) {
|
|
7265
7278
|
var { children, isValidProp } = _f, config = __rest(_f, ["children", "isValidProp"]);
|
|
7266
7279
|
isValidProp && loadExternalIsValidProp(isValidProp);
|
|
7267
|
-
config = Object.assign(Object.assign({}, (0,
|
|
7280
|
+
config = Object.assign(Object.assign({}, (0, react_26.useContext)(MotionConfigContext)), config);
|
|
7268
7281
|
config.isStatic = useConstant(() => config.isStatic);
|
|
7269
|
-
const context = (0,
|
|
7282
|
+
const context = (0, react_26.useMemo)(() => config, [JSON.stringify(config.transition), config.transformPagePoint, config.reducedMotion,]);
|
|
7270
7283
|
return React5.createElement(MotionConfigContext.Provider, { value: context, }, children);
|
|
7271
7284
|
}
|
|
7272
7285
|
exports.MotionConfig = MotionConfig;
|
|
7273
7286
|
function LazyMotion({ children, features, strict = false, }) {
|
|
7274
|
-
const [, setIsLoaded,] = (0,
|
|
7275
|
-
const loadedRenderer = (0,
|
|
7287
|
+
const [, setIsLoaded,] = (0, react_27.useState)(!isLazyBundle(features));
|
|
7288
|
+
const loadedRenderer = (0, react_27.useRef)(void 0);
|
|
7276
7289
|
if (!isLazyBundle(features)) {
|
|
7277
7290
|
const { renderer } = features, loadedFeatures = __rest(features, ["renderer"]);
|
|
7278
7291
|
loadedRenderer.current = renderer;
|
|
7279
7292
|
loadFeatures(loadedFeatures);
|
|
7280
7293
|
}
|
|
7281
|
-
(0,
|
|
7294
|
+
(0, react_27.useEffect)(() => {
|
|
7282
7295
|
if (isLazyBundle(features)) {
|
|
7283
7296
|
features().then((_f) => {
|
|
7284
7297
|
var { renderer } = _f, loadedFeatures = __rest(_f, ["renderer"]);
|
|
@@ -7294,7 +7307,7 @@ exports.LazyMotion = LazyMotion;
|
|
|
7294
7307
|
function isLazyBundle(features) {
|
|
7295
7308
|
return typeof features === 'function';
|
|
7296
7309
|
}
|
|
7297
|
-
var DeprecatedLayoutGroupContext = (0,
|
|
7310
|
+
var DeprecatedLayoutGroupContext = (0, react_28.createContext)(null);
|
|
7298
7311
|
exports.DeprecatedLayoutGroupContext = DeprecatedLayoutGroupContext;
|
|
7299
7312
|
exports.LayoutGroupContext = DeprecatedLayoutGroupContext;
|
|
7300
7313
|
var notify = (node) => !node.isLayoutDirty && node.willUpdate(false);
|
|
@@ -7322,10 +7335,10 @@ function nodeGroup() {
|
|
|
7322
7335
|
var shouldInheritGroup = (inherit) => inherit === true;
|
|
7323
7336
|
var shouldInheritId = (inherit) => shouldInheritGroup(inherit === true) || inherit === 'id';
|
|
7324
7337
|
var LayoutGroup = ({ children, id: id4, inherit = true, }) => {
|
|
7325
|
-
const layoutGroupContext = (0,
|
|
7326
|
-
const deprecatedLayoutGroupContext = (0,
|
|
7338
|
+
const layoutGroupContext = (0, react_29.useContext)(LayoutGroupContext);
|
|
7339
|
+
const deprecatedLayoutGroupContext = (0, react_29.useContext)(DeprecatedLayoutGroupContext);
|
|
7327
7340
|
const [forceRender, key7,] = useForceUpdate();
|
|
7328
|
-
const context = (0,
|
|
7341
|
+
const context = (0, react_29.useRef)(null);
|
|
7329
7342
|
const upstreamId = layoutGroupContext.id || deprecatedLayoutGroupContext;
|
|
7330
7343
|
if (context.current === null) {
|
|
7331
7344
|
if (shouldInheritId(inherit) && upstreamId) {
|
|
@@ -7336,16 +7349,16 @@ var LayoutGroup = ({ children, id: id4, inherit = true, }) => {
|
|
|
7336
7349
|
group: shouldInheritGroup(inherit) ? layoutGroupContext.group || nodeGroup() : nodeGroup(),
|
|
7337
7350
|
};
|
|
7338
7351
|
}
|
|
7339
|
-
const memoizedContext = (0,
|
|
7352
|
+
const memoizedContext = (0, react_29.useMemo)(() => (Object.assign(Object.assign({}, context.current), { forceRender })), [key7,]);
|
|
7340
7353
|
return React7.createElement(LayoutGroupContext.Provider, { value: memoizedContext, }, children);
|
|
7341
7354
|
};
|
|
7342
7355
|
exports.LayoutGroup = LayoutGroup;
|
|
7343
7356
|
function useMotionValue(initial) {
|
|
7344
7357
|
const value = useConstant(() => motionValue(initial));
|
|
7345
|
-
const { isStatic, } = (0,
|
|
7358
|
+
const { isStatic, } = (0, react_30.useContext)(MotionConfigContext);
|
|
7346
7359
|
if (isStatic) {
|
|
7347
|
-
const [, setLatest,] = (0,
|
|
7348
|
-
(0,
|
|
7360
|
+
const [, setLatest,] = (0, react_30.useState)(initial);
|
|
7361
|
+
(0, react_30.useEffect)(() => value.on('change', setLatest), []);
|
|
7349
7362
|
}
|
|
7350
7363
|
return value;
|
|
7351
7364
|
}
|
|
@@ -7407,7 +7420,7 @@ function useListTransform(values, transformer) {
|
|
|
7407
7420
|
return transformer(latest);
|
|
7408
7421
|
});
|
|
7409
7422
|
}
|
|
7410
|
-
var ReorderContext = (0,
|
|
7423
|
+
var ReorderContext = (0, react_32.createContext)(null);
|
|
7411
7424
|
function checkReorder(order, value, offset, velocity) {
|
|
7412
7425
|
if (!velocity) {
|
|
7413
7426
|
return order;
|
|
@@ -7433,7 +7446,7 @@ function ReorderGroup(_f, externalRef) {
|
|
|
7433
7446
|
var { children, as = 'ul', axis = 'y', onReorder, values } = _f, props = __rest(_f, ["children", "as", "axis", "onReorder", "values"]);
|
|
7434
7447
|
const Component23 = useConstant(() => motion(as));
|
|
7435
7448
|
const order = [];
|
|
7436
|
-
const isReordering = (0,
|
|
7449
|
+
const isReordering = (0, react_31.useRef)(false);
|
|
7437
7450
|
invariant(Boolean(values), 'Reorder.Group must be provided a values prop');
|
|
7438
7451
|
const context = {
|
|
7439
7452
|
axis,
|
|
@@ -7458,12 +7471,12 @@ function ReorderGroup(_f, externalRef) {
|
|
|
7458
7471
|
}
|
|
7459
7472
|
},
|
|
7460
7473
|
};
|
|
7461
|
-
(0,
|
|
7474
|
+
(0, react_31.useEffect)(() => {
|
|
7462
7475
|
isReordering.current = false;
|
|
7463
7476
|
});
|
|
7464
7477
|
return React8.createElement(Component23, Object.assign(Object.assign({}, props), { ref: externalRef, ignoreStrict: true }), React8.createElement(ReorderContext.Provider, { value: context, }, children));
|
|
7465
7478
|
}
|
|
7466
|
-
var Group = (0,
|
|
7479
|
+
var Group = (0, react_31.forwardRef)(ReorderGroup);
|
|
7467
7480
|
function getValue(item) {
|
|
7468
7481
|
return item.value;
|
|
7469
7482
|
}
|
|
@@ -7476,7 +7489,7 @@ function useDefaultMotionValue(value, defaultValue = 0) {
|
|
|
7476
7489
|
function ReorderItem(_f, externalRef) {
|
|
7477
7490
|
var { children, style = {}, value, as = 'li', onDrag, layout: layout2 = true } = _f, props = __rest(_f, ["children", "style", "value", "as", "onDrag", "layout"]);
|
|
7478
7491
|
const Component23 = useConstant(() => motion(as));
|
|
7479
|
-
const context = (0,
|
|
7492
|
+
const context = (0, react_33.useContext)(ReorderContext);
|
|
7480
7493
|
const point2 = {
|
|
7481
7494
|
x: useDefaultMotionValue(style.x),
|
|
7482
7495
|
y: useDefaultMotionValue(style.y),
|
|
@@ -7490,7 +7503,7 @@ function ReorderItem(_f, externalRef) {
|
|
|
7490
7503
|
onDrag && onDrag(event, gesturePoint);
|
|
7491
7504
|
}, onLayoutMeasure: (measured) => registerItem(value, measured), ref: externalRef, ignoreStrict: true }), children);
|
|
7492
7505
|
}
|
|
7493
|
-
var Item = (0,
|
|
7506
|
+
var Item = (0, react_33.forwardRef)(ReorderItem);
|
|
7494
7507
|
var Reorder = {
|
|
7495
7508
|
Group,
|
|
7496
7509
|
Item,
|
|
@@ -7517,15 +7530,15 @@ function useMotionTemplate(fragments, ...values) {
|
|
|
7517
7530
|
}
|
|
7518
7531
|
exports.useMotionTemplate = useMotionTemplate;
|
|
7519
7532
|
function useSpring(source, config = {}) {
|
|
7520
|
-
const { isStatic, } = (0,
|
|
7521
|
-
const activeSpringAnimation = (0,
|
|
7533
|
+
const { isStatic, } = (0, react_34.useContext)(MotionConfigContext);
|
|
7534
|
+
const activeSpringAnimation = (0, react_34.useRef)(null);
|
|
7522
7535
|
const value = useMotionValue(isMotionValue(source) ? source.get() : source);
|
|
7523
7536
|
const stopAnimation2 = () => {
|
|
7524
7537
|
if (activeSpringAnimation.current) {
|
|
7525
7538
|
activeSpringAnimation.current.stop();
|
|
7526
7539
|
}
|
|
7527
7540
|
};
|
|
7528
|
-
(0,
|
|
7541
|
+
(0, react_34.useInsertionEffect)(() => {
|
|
7529
7542
|
return value.attach((v, set) => {
|
|
7530
7543
|
if (isStatic) {
|
|
7531
7544
|
return set(v);
|
|
@@ -7548,7 +7561,7 @@ function useSpring(source, config = {}) {
|
|
|
7548
7561
|
}
|
|
7549
7562
|
exports.useSpring = useSpring;
|
|
7550
7563
|
function useMotionValueEvent(value, event, callback) {
|
|
7551
|
-
(0,
|
|
7564
|
+
(0, react_35.useInsertionEffect)(() => value.on(event, callback), [value, event, callback,]);
|
|
7552
7565
|
}
|
|
7553
7566
|
exports.useMotionValueEvent = useMotionValueEvent;
|
|
7554
7567
|
function useVelocity(value) {
|
|
@@ -7975,7 +7988,7 @@ var createScrollMotionValues = () => ({
|
|
|
7975
7988
|
function useScroll(_f = {}) {
|
|
7976
7989
|
var { container, target, layoutEffect = true } = _f, options = __rest(_f, ["container", "target", "layoutEffect"]);
|
|
7977
7990
|
const values = useConstant(createScrollMotionValues);
|
|
7978
|
-
const useLifecycleEffect = layoutEffect ? useIsomorphicLayoutEffect :
|
|
7991
|
+
const useLifecycleEffect = layoutEffect ? useIsomorphicLayoutEffect : react_36.useEffect;
|
|
7979
7992
|
useLifecycleEffect(() => {
|
|
7980
7993
|
refWarning('target', target);
|
|
7981
7994
|
refWarning('container', container);
|
|
@@ -8004,9 +8017,9 @@ function useViewportScroll() {
|
|
|
8004
8017
|
}
|
|
8005
8018
|
exports.useViewportScroll = useViewportScroll;
|
|
8006
8019
|
function useAnimationFrame(callback) {
|
|
8007
|
-
const initialTimestamp = (0,
|
|
8008
|
-
const { isStatic, } = (0,
|
|
8009
|
-
(0,
|
|
8020
|
+
const initialTimestamp = (0, react_37.useRef)(0);
|
|
8021
|
+
const { isStatic, } = (0, react_37.useContext)(MotionConfigContext);
|
|
8022
|
+
(0, react_37.useEffect)(() => {
|
|
8010
8023
|
if (isStatic) {
|
|
8011
8024
|
return;
|
|
8012
8025
|
}
|
|
@@ -8069,7 +8082,7 @@ function useWillChange() {
|
|
|
8069
8082
|
exports.useWillChange = useWillChange;
|
|
8070
8083
|
function useReducedMotion() {
|
|
8071
8084
|
!hasReducedMotionListener.current && initPrefersReducedMotion();
|
|
8072
|
-
const [shouldReduceMotion,] = (0,
|
|
8085
|
+
const [shouldReduceMotion,] = (0, react_38.useState)(prefersReducedMotion.current);
|
|
8073
8086
|
if (false) {
|
|
8074
8087
|
warnOnce(shouldReduceMotion !== true, 'You have Reduced Motion enabled on your device. Animations may not appear as expected.');
|
|
8075
8088
|
}
|
|
@@ -8078,7 +8091,7 @@ function useReducedMotion() {
|
|
|
8078
8091
|
exports.useReducedMotion = useReducedMotion;
|
|
8079
8092
|
function useReducedMotionConfig() {
|
|
8080
8093
|
const reducedMotionPreference = useReducedMotion();
|
|
8081
|
-
const { reducedMotion, } = (0,
|
|
8094
|
+
const { reducedMotion, } = (0, react_39.useContext)(MotionConfigContext);
|
|
8082
8095
|
if (reducedMotion === 'never') {
|
|
8083
8096
|
return false;
|
|
8084
8097
|
}
|
|
@@ -8527,9 +8540,9 @@ exports.useAnimationControls = useAnimationControls;
|
|
|
8527
8540
|
var useAnimation = useAnimationControls;
|
|
8528
8541
|
exports.useAnimation = useAnimation;
|
|
8529
8542
|
function useCycle(...items) {
|
|
8530
|
-
const index = (0,
|
|
8531
|
-
const [item, setItem,] = (0,
|
|
8532
|
-
const runCycle = (0,
|
|
8543
|
+
const index = (0, react_40.useRef)(0);
|
|
8544
|
+
const [item, setItem,] = (0, react_40.useState)(items[index.current]);
|
|
8545
|
+
const runCycle = (0, react_40.useCallback)((next) => {
|
|
8533
8546
|
index.current = typeof next !== 'number' ? wrap(0, items.length, index.current + 1) : next;
|
|
8534
8547
|
setItem(items[index.current]);
|
|
8535
8548
|
},
|
|
@@ -8578,8 +8591,8 @@ function inView(elementOrSelector, onStart, { root, margin: rootMargin, amount =
|
|
|
8578
8591
|
}
|
|
8579
8592
|
exports.inView = inView;
|
|
8580
8593
|
function useInView(ref, { root, margin, amount, once = false, } = {}) {
|
|
8581
|
-
const [isInView, setInView,] = (0,
|
|
8582
|
-
(0,
|
|
8594
|
+
const [isInView, setInView,] = (0, react_41.useState)(false);
|
|
8595
|
+
(0, react_41.useEffect)(() => {
|
|
8583
8596
|
if (!ref.current || once && isInView) {
|
|
8584
8597
|
return;
|
|
8585
8598
|
}
|
|
@@ -8638,7 +8651,7 @@ function useDragControls() {
|
|
|
8638
8651
|
}
|
|
8639
8652
|
exports.useDragControls = useDragControls;
|
|
8640
8653
|
function useDomEvent(ref, eventName, handler, options) {
|
|
8641
|
-
(0,
|
|
8654
|
+
(0, react_42.useEffect)(() => {
|
|
8642
8655
|
const element = ref.current;
|
|
8643
8656
|
if (handler && element) {
|
|
8644
8657
|
return addDomEvent(element, eventName, handler, options);
|
|
@@ -8672,8 +8685,8 @@ function startTransition(callback) {
|
|
|
8672
8685
|
function useInstantTransition() {
|
|
8673
8686
|
const [forceUpdate, forcedRenderCount,] = useForceUpdate();
|
|
8674
8687
|
const startInstantLayoutTransition = useInstantLayoutTransition();
|
|
8675
|
-
const unlockOnFrameRef = (0,
|
|
8676
|
-
(0,
|
|
8688
|
+
const unlockOnFrameRef = (0, react_43.useRef)();
|
|
8689
|
+
(0, react_43.useEffect)(() => {
|
|
8677
8690
|
frame.postRender(() => frame.postRender(() => {
|
|
8678
8691
|
if (forcedRenderCount !== unlockOnFrameRef.current) {
|
|
8679
8692
|
return;
|
|
@@ -8832,16 +8845,16 @@ var useVisualState = makeUseVisualState({
|
|
|
8832
8845
|
createRenderState: createObject,
|
|
8833
8846
|
});
|
|
8834
8847
|
function useAnimatedState(initialState2) {
|
|
8835
|
-
const [animationState, setAnimationState,] = (0,
|
|
8848
|
+
const [animationState, setAnimationState,] = (0, react_44.useState)(initialState2);
|
|
8836
8849
|
const visualState = useVisualState({}, false);
|
|
8837
8850
|
const element = useConstant(() => {
|
|
8838
8851
|
return new StateVisualElement({ props: {}, visualState, presenceContext: null, }, { initialState: initialState2, });
|
|
8839
8852
|
});
|
|
8840
|
-
(0,
|
|
8853
|
+
(0, react_44.useEffect)(() => {
|
|
8841
8854
|
element.mount({});
|
|
8842
8855
|
return () => element.unmount();
|
|
8843
8856
|
}, [element,]);
|
|
8844
|
-
(0,
|
|
8857
|
+
(0, react_44.useEffect)(() => {
|
|
8845
8858
|
element.update({
|
|
8846
8859
|
onUpdate: (v) => {
|
|
8847
8860
|
setAnimationState(Object.assign({}, v));
|
|
@@ -8861,7 +8874,7 @@ var hasWarned = false;
|
|
|
8861
8874
|
function useInvertedScale(scale2) {
|
|
8862
8875
|
let parentScaleX = useMotionValue(1);
|
|
8863
8876
|
let parentScaleY = useMotionValue(1);
|
|
8864
|
-
const { visualElement, } = (0,
|
|
8877
|
+
const { visualElement, } = (0, react_45.useContext)(MotionContext);
|
|
8865
8878
|
invariant(!!(scale2 || visualElement), 'If no scale values are provided, useInvertedScale must be used within a child of another motion component.');
|
|
8866
8879
|
warning(hasWarned, 'useInvertedScale is deprecated and will be removed in 3.0. Use the layout prop instead.');
|
|
8867
8880
|
hasWarned = true;
|
|
@@ -8937,190 +8950,195 @@ var cancelSync = stepsOrder.reduce((acc, key7) => {
|
|
|
8937
8950
|
return acc;
|
|
8938
8951
|
}, {});
|
|
8939
8952
|
exports.cancelSync = cancelSync;
|
|
8940
|
-
// https :https://app.framerstatic.com/framer.
|
|
8941
|
-
const
|
|
8942
|
-
const
|
|
8953
|
+
// https :https://app.framerstatic.com/framer.L736M3IJ.js
|
|
8954
|
+
const react_46 = require("react");
|
|
8955
|
+
const react_47 = __importDefault(require("react"));
|
|
8943
8956
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
8944
|
-
const react_47 = __importStar(require("react"));
|
|
8945
8957
|
const react_48 = __importStar(require("react"));
|
|
8946
|
-
const react_49 =
|
|
8947
|
-
const react_50 = require("react");
|
|
8958
|
+
const react_49 = __importStar(require("react"));
|
|
8959
|
+
const react_50 = __importDefault(require("react"));
|
|
8960
|
+
const react_51 = require("react");
|
|
8948
8961
|
const jsx_runtime_2 = require("react/jsx-runtime");
|
|
8949
|
-
const react_51 = __importDefault(require("react"));
|
|
8950
|
-
const jsx_runtime_3 = require("react/jsx-runtime");
|
|
8951
8962
|
const react_52 = __importDefault(require("react"));
|
|
8963
|
+
const jsx_runtime_3 = require("react/jsx-runtime");
|
|
8952
8964
|
const react_53 = __importDefault(require("react"));
|
|
8965
|
+
const react_54 = __importDefault(require("react"));
|
|
8953
8966
|
const jsx_runtime_4 = require("react/jsx-runtime");
|
|
8954
|
-
const react_54 = require("react");
|
|
8955
|
-
const jsx_runtime_5 = require("react/jsx-runtime");
|
|
8956
8967
|
const react_55 = require("react");
|
|
8957
|
-
const
|
|
8968
|
+
const jsx_runtime_5 = require("react/jsx-runtime");
|
|
8969
|
+
const react_56 = require("react");
|
|
8958
8970
|
const react_57 = __importDefault(require("react"));
|
|
8959
|
-
const react_58 = require("react");
|
|
8971
|
+
const react_58 = __importDefault(require("react"));
|
|
8972
|
+
const react_59 = require("react");
|
|
8960
8973
|
const jsx_runtime_6 = require("react/jsx-runtime");
|
|
8961
|
-
const
|
|
8962
|
-
const react_60 = __importDefault(require("react"));
|
|
8974
|
+
const react_60 = __importStar(require("react"));
|
|
8963
8975
|
const react_61 = __importDefault(require("react"));
|
|
8964
8976
|
const react_62 = __importDefault(require("react"));
|
|
8965
8977
|
const react_63 = __importDefault(require("react"));
|
|
8978
|
+
const react_64 = __importDefault(require("react"));
|
|
8966
8979
|
const jsx_runtime_7 = require("react/jsx-runtime");
|
|
8967
|
-
const react_64 = __importStar(require("react"));
|
|
8968
|
-
const jsx_runtime_8 = require("react/jsx-runtime");
|
|
8969
8980
|
const react_65 = __importStar(require("react"));
|
|
8970
|
-
const
|
|
8981
|
+
const jsx_runtime_8 = require("react/jsx-runtime");
|
|
8982
|
+
const react_66 = __importStar(require("react"));
|
|
8983
|
+
const react_67 = require("react");
|
|
8971
8984
|
const jsx_runtime_9 = require("react/jsx-runtime");
|
|
8972
8985
|
const jsx_runtime_10 = require("react/jsx-runtime");
|
|
8973
|
-
const react_67 = __importDefault(require("react"));
|
|
8974
8986
|
const react_68 = __importDefault(require("react"));
|
|
8975
|
-
const jsx_runtime_11 = require("react/jsx-runtime");
|
|
8976
8987
|
const react_69 = __importDefault(require("react"));
|
|
8977
|
-
const
|
|
8988
|
+
const jsx_runtime_11 = require("react/jsx-runtime");
|
|
8978
8989
|
const react_70 = __importDefault(require("react"));
|
|
8979
|
-
const
|
|
8980
|
-
const
|
|
8990
|
+
const jsx_runtime_12 = require("react/jsx-runtime");
|
|
8991
|
+
const react_71 = __importDefault(require("react"));
|
|
8992
|
+
const react_72 = __importStar(require("react"));
|
|
8981
8993
|
const react_73 = __importDefault(require("react"));
|
|
8994
|
+
const react_74 = __importDefault(require("react"));
|
|
8982
8995
|
const jsx_runtime_13 = require("react/jsx-runtime");
|
|
8983
8996
|
const jsx_runtime_14 = require("react/jsx-runtime");
|
|
8984
|
-
const
|
|
8985
|
-
const react_75 = require("react");
|
|
8997
|
+
const react_75 = __importDefault(require("react"));
|
|
8986
8998
|
const react_76 = require("react");
|
|
8987
8999
|
const react_77 = require("react");
|
|
8988
|
-
const react_78 =
|
|
8989
|
-
const react_79 =
|
|
8990
|
-
const react_80 =
|
|
9000
|
+
const react_78 = require("react");
|
|
9001
|
+
const react_79 = __importDefault(require("react"));
|
|
9002
|
+
const react_80 = __importStar(require("react"));
|
|
9003
|
+
const react_81 = __importDefault(require("react"));
|
|
8991
9004
|
const jsx_runtime_15 = require("react/jsx-runtime");
|
|
8992
|
-
const react_81 = require("react");
|
|
8993
9005
|
const react_82 = require("react");
|
|
9006
|
+
const react_83 = require("react");
|
|
8994
9007
|
const jsx_runtime_16 = require("react/jsx-runtime");
|
|
8995
9008
|
const jsx_runtime_17 = require("react/jsx-runtime");
|
|
8996
|
-
const react_83 = __importStar(require("react"));
|
|
8997
9009
|
const react_84 = __importStar(require("react"));
|
|
9010
|
+
const react_85 = __importStar(require("react"));
|
|
8998
9011
|
const jsx_runtime_18 = require("react/jsx-runtime");
|
|
8999
9012
|
const jsx_runtime_19 = require("react/jsx-runtime");
|
|
9000
|
-
const
|
|
9001
|
-
const
|
|
9002
|
-
const
|
|
9003
|
-
const react_88 = __importDefault(require("react"));
|
|
9013
|
+
const react_86 = __importStar(require("react"));
|
|
9014
|
+
const react_87 = __importDefault(require("react"));
|
|
9015
|
+
const react_88 = require("react");
|
|
9004
9016
|
const react_89 = __importDefault(require("react"));
|
|
9017
|
+
const react_90 = __importDefault(require("react"));
|
|
9005
9018
|
const jsx_runtime_20 = require("react/jsx-runtime");
|
|
9006
9019
|
const jsx_runtime_21 = require("react/jsx-runtime");
|
|
9007
|
-
const
|
|
9020
|
+
const react_91 = __importDefault(require("react"));
|
|
9008
9021
|
const jsx_runtime_22 = require("react/jsx-runtime");
|
|
9009
9022
|
const jsx_runtime_23 = require("react/jsx-runtime");
|
|
9010
9023
|
const jsx_runtime_24 = require("react/jsx-runtime");
|
|
9011
|
-
const react_91 = __importStar(require("react"));
|
|
9012
|
-
const jsx_runtime_25 = require("react/jsx-runtime");
|
|
9013
9024
|
const react_92 = __importStar(require("react"));
|
|
9014
|
-
const
|
|
9025
|
+
const jsx_runtime_25 = require("react/jsx-runtime");
|
|
9026
|
+
const react_93 = __importStar(require("react"));
|
|
9027
|
+
const react_94 = require("react");
|
|
9015
9028
|
const jsx_runtime_26 = require("react/jsx-runtime");
|
|
9016
9029
|
const jsx_runtime_27 = require("react/jsx-runtime");
|
|
9017
|
-
const
|
|
9030
|
+
const react_95 = require("react");
|
|
9018
9031
|
const jsx_runtime_28 = require("react/jsx-runtime");
|
|
9019
|
-
const react_95 = __importDefault(require("react"));
|
|
9020
|
-
const jsx_runtime_29 = require("react/jsx-runtime");
|
|
9021
9032
|
const react_96 = __importDefault(require("react"));
|
|
9022
|
-
const
|
|
9023
|
-
const
|
|
9033
|
+
const jsx_runtime_29 = require("react/jsx-runtime");
|
|
9034
|
+
const react_97 = __importDefault(require("react"));
|
|
9035
|
+
const react_98 = require("react");
|
|
9024
9036
|
const react_99 = __importDefault(require("react"));
|
|
9037
|
+
const react_100 = __importDefault(require("react"));
|
|
9025
9038
|
const jsx_runtime_30 = require("react/jsx-runtime");
|
|
9026
9039
|
const jsx_runtime_31 = require("react/jsx-runtime");
|
|
9027
9040
|
const jsx_runtime_32 = require("react/jsx-runtime");
|
|
9028
|
-
const
|
|
9029
|
-
const react_101 = require("react");
|
|
9041
|
+
const react_101 = __importStar(require("react"));
|
|
9030
9042
|
const react_102 = require("react");
|
|
9043
|
+
const react_103 = require("react");
|
|
9031
9044
|
const jsx_runtime_33 = require("react/jsx-runtime");
|
|
9032
|
-
const
|
|
9033
|
-
const react_104 = __importStar(require("react"));
|
|
9034
|
-
const jsx_runtime_34 = require("react/jsx-runtime");
|
|
9045
|
+
const react_104 = __importDefault(require("react"));
|
|
9035
9046
|
const react_105 = __importStar(require("react"));
|
|
9047
|
+
const jsx_runtime_34 = require("react/jsx-runtime");
|
|
9036
9048
|
const react_106 = __importStar(require("react"));
|
|
9049
|
+
const react_107 = __importStar(require("react"));
|
|
9037
9050
|
const jsx_runtime_35 = require("react/jsx-runtime");
|
|
9038
9051
|
const jsx_runtime_36 = require("react/jsx-runtime");
|
|
9039
|
-
const react_107 = require("react");
|
|
9040
9052
|
const react_108 = require("react");
|
|
9041
|
-
const react_109 =
|
|
9053
|
+
const react_109 = require("react");
|
|
9054
|
+
const react_110 = __importStar(require("react"));
|
|
9042
9055
|
const jsx_runtime_37 = require("react/jsx-runtime");
|
|
9043
|
-
const
|
|
9056
|
+
const react_111 = require("react");
|
|
9044
9057
|
const jsx_runtime_38 = require("react/jsx-runtime");
|
|
9045
|
-
const react_111 = __importDefault(require("react"));
|
|
9046
9058
|
const react_112 = __importDefault(require("react"));
|
|
9047
|
-
const react_113 =
|
|
9048
|
-
const react_114 =
|
|
9049
|
-
const react_115 = require("react");
|
|
9050
|
-
const react_116 =
|
|
9059
|
+
const react_113 = __importDefault(require("react"));
|
|
9060
|
+
const react_114 = __importStar(require("react"));
|
|
9061
|
+
const react_115 = __importDefault(require("react"));
|
|
9062
|
+
const react_116 = require("react");
|
|
9051
9063
|
const react_117 = __importDefault(require("react"));
|
|
9052
9064
|
const react_118 = __importDefault(require("react"));
|
|
9065
|
+
const react_119 = __importDefault(require("react"));
|
|
9053
9066
|
const jsx_runtime_39 = require("react/jsx-runtime");
|
|
9054
|
-
const
|
|
9067
|
+
const react_120 = require("react");
|
|
9055
9068
|
const jsx_runtime_40 = require("react/jsx-runtime");
|
|
9056
|
-
const
|
|
9069
|
+
const react_121 = __importDefault(require("react"));
|
|
9057
9070
|
const React54 = __importStar(require("react"));
|
|
9058
9071
|
const jsx_runtime_41 = require("react/jsx-runtime");
|
|
9059
9072
|
const jsx_runtime_42 = require("react/jsx-runtime");
|
|
9060
|
-
const react_121 = __importDefault(require("react"));
|
|
9061
9073
|
const react_122 = __importDefault(require("react"));
|
|
9074
|
+
const react_123 = __importDefault(require("react"));
|
|
9062
9075
|
const jsx_runtime_43 = require("react/jsx-runtime");
|
|
9063
9076
|
const jsx_runtime_44 = require("react/jsx-runtime");
|
|
9064
|
-
const
|
|
9065
|
-
const react_124 = __importDefault(require("react"));
|
|
9077
|
+
const react_124 = __importStar(require("react"));
|
|
9066
9078
|
const react_125 = __importDefault(require("react"));
|
|
9079
|
+
const react_126 = __importDefault(require("react"));
|
|
9067
9080
|
const jsx_runtime_45 = require("react/jsx-runtime");
|
|
9068
9081
|
const jsx_runtime_46 = require("react/jsx-runtime");
|
|
9069
|
-
const
|
|
9082
|
+
const react_127 = __importDefault(require("react"));
|
|
9070
9083
|
const react_dom_1 = __importDefault(require("react-dom"));
|
|
9071
9084
|
const jsx_runtime_47 = require("react/jsx-runtime");
|
|
9072
|
-
const react_127 = __importDefault(require("react"));
|
|
9073
9085
|
const react_128 = __importDefault(require("react"));
|
|
9074
9086
|
const react_129 = __importDefault(require("react"));
|
|
9075
|
-
const jsx_runtime_48 = require("react/jsx-runtime");
|
|
9076
9087
|
const react_130 = __importDefault(require("react"));
|
|
9088
|
+
const jsx_runtime_48 = require("react/jsx-runtime");
|
|
9089
|
+
const react_131 = __importDefault(require("react"));
|
|
9077
9090
|
const React65 = __importStar(require("react"));
|
|
9078
9091
|
const jsx_runtime_49 = require("react/jsx-runtime");
|
|
9079
9092
|
const jsx_runtime_50 = require("react/jsx-runtime");
|
|
9080
9093
|
const React67 = __importStar(require("react"));
|
|
9081
|
-
const react_131 = __importDefault(require("react"));
|
|
9082
9094
|
const react_132 = __importDefault(require("react"));
|
|
9083
|
-
const react_133 = require("react");
|
|
9095
|
+
const react_133 = __importDefault(require("react"));
|
|
9084
9096
|
const react_134 = require("react");
|
|
9085
|
-
const react_135 =
|
|
9086
|
-
const react_136 =
|
|
9097
|
+
const react_135 = require("react");
|
|
9098
|
+
const react_136 = __importStar(require("react"));
|
|
9087
9099
|
const react_137 = __importDefault(require("react"));
|
|
9088
9100
|
const react_138 = __importDefault(require("react"));
|
|
9089
9101
|
const react_139 = __importDefault(require("react"));
|
|
9090
9102
|
const react_140 = __importDefault(require("react"));
|
|
9091
|
-
const react_141 = require("react");
|
|
9092
|
-
const react_142 =
|
|
9093
|
-
const jsx_runtime_51 = require("react/jsx-runtime");
|
|
9103
|
+
const react_141 = __importDefault(require("react"));
|
|
9104
|
+
const react_142 = require("react");
|
|
9094
9105
|
const react_143 = __importDefault(require("react"));
|
|
9106
|
+
const jsx_runtime_51 = require("react/jsx-runtime");
|
|
9107
|
+
const react_144 = __importDefault(require("react"));
|
|
9095
9108
|
const jsx_runtime_52 = require("react/jsx-runtime");
|
|
9096
|
-
const react_144 = __importStar(require("react"));
|
|
9097
|
-
const jsx_runtime_53 = require("react/jsx-runtime");
|
|
9098
9109
|
const react_145 = __importStar(require("react"));
|
|
9099
|
-
const
|
|
9100
|
-
const
|
|
9110
|
+
const jsx_runtime_53 = require("react/jsx-runtime");
|
|
9111
|
+
const react_146 = __importStar(require("react"));
|
|
9101
9112
|
const react_147 = __importDefault(require("react"));
|
|
9113
|
+
const jsx_runtime_54 = require("react/jsx-runtime");
|
|
9102
9114
|
const react_148 = __importDefault(require("react"));
|
|
9115
|
+
const react_149 = __importDefault(require("react"));
|
|
9103
9116
|
const jsx_runtime_55 = require("react/jsx-runtime");
|
|
9104
9117
|
const jsx_runtime_56 = require("react/jsx-runtime");
|
|
9105
|
-
const
|
|
9106
|
-
const
|
|
9118
|
+
const react_150 = __importStar(require("react"));
|
|
9119
|
+
const react_151 = __importDefault(require("react"));
|
|
9107
9120
|
const jsx_runtime_57 = require("react/jsx-runtime");
|
|
9108
|
-
const react_151 = require("react");
|
|
9109
|
-
const jsx_runtime_58 = require("react/jsx-runtime");
|
|
9110
9121
|
const react_152 = require("react");
|
|
9122
|
+
const jsx_runtime_58 = require("react/jsx-runtime");
|
|
9123
|
+
const react_153 = require("react");
|
|
9111
9124
|
const jsx_runtime_59 = require("react/jsx-runtime");
|
|
9112
9125
|
const jsx_runtime_60 = require("react/jsx-runtime");
|
|
9113
9126
|
const jsx_runtime_61 = require("react/jsx-runtime");
|
|
9114
9127
|
const jsx_runtime_62 = require("react/jsx-runtime");
|
|
9115
9128
|
const jsx_runtime_63 = require("react/jsx-runtime");
|
|
9116
|
-
const react_153 = __importDefault(require("react"));
|
|
9117
9129
|
const jsx_runtime_64 = require("react/jsx-runtime");
|
|
9118
9130
|
const react_154 = require("react");
|
|
9119
|
-
const React86 = __importStar(require("react"));
|
|
9120
|
-
const react_155 = require("react");
|
|
9121
9131
|
const jsx_runtime_65 = require("react/jsx-runtime");
|
|
9132
|
+
const react_155 = require("react");
|
|
9122
9133
|
const jsx_runtime_66 = require("react/jsx-runtime");
|
|
9123
|
-
const react_156 = require("react");
|
|
9134
|
+
const react_156 = __importDefault(require("react"));
|
|
9135
|
+
const jsx_runtime_67 = require("react/jsx-runtime");
|
|
9136
|
+
const react_157 = require("react");
|
|
9137
|
+
const React86 = __importStar(require("react"));
|
|
9138
|
+
const react_158 = require("react");
|
|
9139
|
+
const jsx_runtime_68 = require("react/jsx-runtime");
|
|
9140
|
+
const jsx_runtime_69 = require("react/jsx-runtime");
|
|
9141
|
+
const react_159 = require("react");
|
|
9124
9142
|
var require_hsluv = __commonJS({
|
|
9125
9143
|
'../../../node_modules/hsluv/hsluv.js'(exports, module) {
|
|
9126
9144
|
var hsluv = hsluv || {};
|
|
@@ -10283,14 +10301,14 @@ var require_fontfaceobserver_standalone = __commonJS({
|
|
|
10283
10301
|
},
|
|
10284
10302
|
});
|
|
10285
10303
|
function renderPage(Page4, defaultPageStyle) {
|
|
10286
|
-
return
|
|
10287
|
-
?
|
|
10288
|
-
:
|
|
10304
|
+
return react_47.default.isValidElement(Page4)
|
|
10305
|
+
? react_47.default.cloneElement(Page4, { style: defaultPageStyle, })
|
|
10306
|
+
: react_47.default.createElement(Page4, { style: defaultPageStyle, });
|
|
10289
10307
|
}
|
|
10290
10308
|
var NotFoundError = class extends Error {
|
|
10291
10309
|
};
|
|
10292
10310
|
exports.NotFoundError = NotFoundError;
|
|
10293
|
-
var ErrorBoundary = class extends
|
|
10311
|
+
var ErrorBoundary = class extends react_46.Component {
|
|
10294
10312
|
constructor(props) {
|
|
10295
10313
|
super(props);
|
|
10296
10314
|
this.state = { error: void 0, forceUpdateKey: props.forceUpdateKey, };
|
|
@@ -10518,15 +10536,15 @@ function isString2(value) {
|
|
|
10518
10536
|
}
|
|
10519
10537
|
var preloadKey = 'preload';
|
|
10520
10538
|
function isLazyComponentType(componentType) {
|
|
10521
|
-
return typeof componentType === 'object' && componentType !== null && !
|
|
10539
|
+
return typeof componentType === 'object' && componentType !== null && !react_50.default.isValidElement(componentType) &&
|
|
10522
10540
|
preloadKey in componentType;
|
|
10523
10541
|
}
|
|
10524
10542
|
function lazy(factory) {
|
|
10525
|
-
const LazyComponent =
|
|
10543
|
+
const LazyComponent = react_50.default.lazy(factory);
|
|
10526
10544
|
let factoryPromise;
|
|
10527
10545
|
let LoadedComponent;
|
|
10528
|
-
const Component15 =
|
|
10529
|
-
return
|
|
10546
|
+
const Component15 = react_50.default.forwardRef(function LazyWithPreload(props, ref) {
|
|
10547
|
+
return react_50.default.createElement(LoadedComponent !== null && LoadedComponent !== void 0 ? LoadedComponent : LazyComponent, Object.assign(ref ? { ref, } : {}, props));
|
|
10530
10548
|
});
|
|
10531
10549
|
Component15.preload = () => {
|
|
10532
10550
|
if (!factoryPromise) {
|
|
@@ -10653,13 +10671,13 @@ function getPageEffectForRoute(currentRouteId, nextRouteId, { global: global2, r
|
|
|
10653
10671
|
return ((_a = routes[currentRouteId]) === null || _a === void 0 ? void 0 : _a[nextRouteId]) || global2;
|
|
10654
10672
|
}
|
|
10655
10673
|
var defaultSitePageEffects = { global: void 0, routes: {}, };
|
|
10656
|
-
var PageEffectsContext =
|
|
10674
|
+
var PageEffectsContext = react_52.default.createContext(defaultSitePageEffects);
|
|
10657
10675
|
function PageEffectsProvider({ children, value, }) {
|
|
10658
10676
|
return (0, jsx_runtime_2.jsx)(PageEffectsContext.Provider, { value, children, });
|
|
10659
10677
|
}
|
|
10660
10678
|
exports.PageEffectsProvider = PageEffectsProvider;
|
|
10661
10679
|
function usePageEffects() {
|
|
10662
|
-
return
|
|
10680
|
+
return react_52.default.useContext(PageEffectsContext);
|
|
10663
10681
|
}
|
|
10664
10682
|
exports.usePageEffects = usePageEffects;
|
|
10665
10683
|
var step = 10;
|
|
@@ -10958,14 +10976,14 @@ function startViewTransition(updateView, effect) {
|
|
|
10958
10976
|
}
|
|
10959
10977
|
function useViewTransition() {
|
|
10960
10978
|
const sitePageEffects = usePageEffects();
|
|
10961
|
-
const resolveHasPainted = (0,
|
|
10962
|
-
(0,
|
|
10979
|
+
const resolveHasPainted = (0, react_51.useRef)(void 0);
|
|
10980
|
+
(0, react_51.useEffect)(() => {
|
|
10963
10981
|
if (resolveHasPainted.current) {
|
|
10964
10982
|
resolveHasPainted.current();
|
|
10965
10983
|
resolveHasPainted.current = void 0;
|
|
10966
10984
|
}
|
|
10967
10985
|
});
|
|
10968
|
-
return (0,
|
|
10986
|
+
return (0, react_51.useCallback)((currentRouteId, nextRouteId, update) => {
|
|
10969
10987
|
const pageEffect = getPageEffectForRoute(currentRouteId, nextRouteId, sitePageEffects);
|
|
10970
10988
|
if (pageEffect) {
|
|
10971
10989
|
const hasPainted = new Promise((resolve) => {
|
|
@@ -11013,7 +11031,7 @@ function pushHistoryState(data2, url) {
|
|
|
11013
11031
|
'', url);
|
|
11014
11032
|
}
|
|
11015
11033
|
function useReplaceInitialState({ disabled, routeId, initialPathVariables, initialLocaleId, }) {
|
|
11016
|
-
|
|
11034
|
+
react_49.default.useLayoutEffect(() => {
|
|
11017
11035
|
if (disabled) {
|
|
11018
11036
|
return;
|
|
11019
11037
|
}
|
|
@@ -11022,8 +11040,8 @@ function useReplaceInitialState({ disabled, routeId, initialPathVariables, initi
|
|
|
11022
11040
|
}
|
|
11023
11041
|
function usePopStateHandler(currentRouteId, setCurrentRouteId) {
|
|
11024
11042
|
const startViewTransition2 = useViewTransition();
|
|
11025
|
-
const viewTransitionReady =
|
|
11026
|
-
const popStateHandler =
|
|
11043
|
+
const viewTransitionReady = react_49.default.useRef(void 0);
|
|
11044
|
+
const popStateHandler = react_49.default.useCallback(({ state, }) => {
|
|
11027
11045
|
var _a, _b, _c;
|
|
11028
11046
|
if (!isObject(state)) {
|
|
11029
11047
|
return;
|
|
@@ -11043,7 +11061,7 @@ function usePopStateHandler(currentRouteId, setCurrentRouteId) {
|
|
|
11043
11061
|
(_c = viewTransitionReady.current) === null || _c === void 0 ? void 0 : _c.resolve();
|
|
11044
11062
|
}
|
|
11045
11063
|
}, [currentRouteId, setCurrentRouteId, startViewTransition2,]);
|
|
11046
|
-
const traversalHandler = (0,
|
|
11064
|
+
const traversalHandler = (0, react_49.useCallback)((event) => {
|
|
11047
11065
|
if (event.navigationType !== 'traverse') {
|
|
11048
11066
|
return;
|
|
11049
11067
|
}
|
|
@@ -11058,7 +11076,7 @@ function usePopStateHandler(currentRouteId, setCurrentRouteId) {
|
|
|
11058
11076
|
scroll: 'after-transition',
|
|
11059
11077
|
});
|
|
11060
11078
|
}, []);
|
|
11061
|
-
|
|
11079
|
+
react_49.default.useEffect(() => {
|
|
11062
11080
|
var _a;
|
|
11063
11081
|
window.addEventListener('popstate', popStateHandler);
|
|
11064
11082
|
(_a = window.navigation) === null || _a === void 0 ? void 0 : _a.addEventListener('navigate', traversalHandler);
|
|
@@ -11173,21 +11191,21 @@ function isSamePage(a, b) {
|
|
|
11173
11191
|
Object.keys(aPathVariables).every((key7) => aPathVariables[key7] === bPathVariables[key7]);
|
|
11174
11192
|
}
|
|
11175
11193
|
function useGetRouteCallback(routes) {
|
|
11176
|
-
return
|
|
11194
|
+
return react_54.default.useCallback((routeId) => routes[routeId], [routes,]);
|
|
11177
11195
|
}
|
|
11178
|
-
var RouterContext =
|
|
11196
|
+
var RouterContext = react_53.default.createContext({});
|
|
11179
11197
|
function RouterAPIProvider({ api, children, }) {
|
|
11180
11198
|
return (0, jsx_runtime_3.jsx)(RouterContext.Provider, { value: api, children, });
|
|
11181
11199
|
}
|
|
11182
11200
|
function useRouter() {
|
|
11183
|
-
return
|
|
11201
|
+
return react_53.default.useContext(RouterContext);
|
|
11184
11202
|
}
|
|
11185
11203
|
exports.useRouter = useRouter;
|
|
11186
11204
|
function RoutesProvider({ routes, children, }) {
|
|
11187
11205
|
const getRoute = useGetRouteCallback(routes);
|
|
11188
11206
|
return (0, jsx_runtime_3.jsx)(RouterContext.Provider, { value: { getRoute, }, children, });
|
|
11189
11207
|
}
|
|
11190
|
-
var SuspenseErrorBoundary = class extends
|
|
11208
|
+
var SuspenseErrorBoundary = class extends react_56.Component {
|
|
11191
11209
|
constructor(props) {
|
|
11192
11210
|
super(props);
|
|
11193
11211
|
this.state = { error: void 0, };
|
|
@@ -11211,7 +11229,7 @@ var SuspenseErrorBoundary = class extends react_55.Component {
|
|
|
11211
11229
|
if (this.state.error === void 0) {
|
|
11212
11230
|
return this.props.children;
|
|
11213
11231
|
}
|
|
11214
|
-
return (0, jsx_runtime_5.jsx)(
|
|
11232
|
+
return (0, jsx_runtime_5.jsx)(react_56.Suspense, { children: this.props.fallbackChildren, });
|
|
11215
11233
|
}
|
|
11216
11234
|
};
|
|
11217
11235
|
var suspendPromise = typeof window !== 'undefined'
|
|
@@ -11227,13 +11245,13 @@ function Suspend() {
|
|
|
11227
11245
|
function SuspenseThatPreservesDom({ children, }) {
|
|
11228
11246
|
return (0, jsx_runtime_4.jsx)(SuspenseErrorBoundary, {
|
|
11229
11247
|
fallbackChildren: children,
|
|
11230
|
-
children: (0, jsx_runtime_4.jsx)(
|
|
11248
|
+
children: (0, jsx_runtime_4.jsx)(react_55.Suspense, { fallback: (0, jsx_runtime_4.jsx)(Suspend, {}), children, }),
|
|
11231
11249
|
});
|
|
11232
11250
|
}
|
|
11233
11251
|
var defaultLocaleId = 'default';
|
|
11234
11252
|
function useForceUpdate2() {
|
|
11235
|
-
const [_, setForcedRenderCount,] =
|
|
11236
|
-
return [_,
|
|
11253
|
+
const [_, setForcedRenderCount,] = react_57.default.useState(0);
|
|
11254
|
+
return [_, react_57.default.useCallback(() => setForcedRenderCount((v) => v + 1), []),];
|
|
11237
11255
|
}
|
|
11238
11256
|
var noopAsync = () => __awaiter(void 0, void 0, void 0, function* () {
|
|
11239
11257
|
});
|
|
@@ -11242,9 +11260,9 @@ var defaultLocaleInfo = {
|
|
|
11242
11260
|
locales: [],
|
|
11243
11261
|
setLocale: noopAsync,
|
|
11244
11262
|
};
|
|
11245
|
-
var LocaleInfoContext = /* @__PURE__ */
|
|
11263
|
+
var LocaleInfoContext = /* @__PURE__ */ react_58.default.createContext(defaultLocaleInfo);
|
|
11246
11264
|
function useLocaleInfo() {
|
|
11247
|
-
return
|
|
11265
|
+
return react_58.default.useContext(LocaleInfoContext);
|
|
11248
11266
|
}
|
|
11249
11267
|
exports.useLocaleInfo = useLocaleInfo;
|
|
11250
11268
|
function useLocalizationInfo() {
|
|
@@ -11268,14 +11286,14 @@ exports.useLocale = useLocale;
|
|
|
11268
11286
|
function useMonitorNextRender(label) {
|
|
11269
11287
|
const startLabel = `start-${label}`;
|
|
11270
11288
|
const endLabel = `end-${label}`;
|
|
11271
|
-
const resolveHasPainted = (0,
|
|
11272
|
-
(0,
|
|
11289
|
+
const resolveHasPainted = (0, react_59.useRef)(void 0);
|
|
11290
|
+
(0, react_59.useEffect)(() => {
|
|
11273
11291
|
if (resolveHasPainted.current) {
|
|
11274
11292
|
resolveHasPainted.current();
|
|
11275
11293
|
resolveHasPainted.current = void 0;
|
|
11276
11294
|
}
|
|
11277
11295
|
});
|
|
11278
|
-
return (0,
|
|
11296
|
+
return (0, react_59.useCallback)(() => {
|
|
11279
11297
|
const hasPainted = new Promise((resolve) => {
|
|
11280
11298
|
resolveHasPainted.current = resolve;
|
|
11281
11299
|
});
|
|
@@ -11299,8 +11317,8 @@ function updateScrollPosition(hash2, smoothScroll, isHistoryTransition) {
|
|
|
11299
11317
|
window.scrollTo(0, 0);
|
|
11300
11318
|
}
|
|
11301
11319
|
function useScheduleRenderSideEffects(dep) {
|
|
11302
|
-
const actions =
|
|
11303
|
-
|
|
11320
|
+
const actions = react_48.default.useRef([]);
|
|
11321
|
+
react_48.default.useLayoutEffect(() => {
|
|
11304
11322
|
var _a;
|
|
11305
11323
|
if (!((_a = actions.current) === null || _a === void 0 ? void 0 : _a.length)) {
|
|
11306
11324
|
return;
|
|
@@ -11308,7 +11326,7 @@ function useScheduleRenderSideEffects(dep) {
|
|
|
11308
11326
|
actions.current.forEach((action) => action());
|
|
11309
11327
|
actions.current = [];
|
|
11310
11328
|
}, [dep,]);
|
|
11311
|
-
return
|
|
11329
|
+
return react_48.default.useCallback((cb) => {
|
|
11312
11330
|
actions.current.push(cb);
|
|
11313
11331
|
}, []);
|
|
11314
11332
|
}
|
|
@@ -11321,11 +11339,11 @@ function Router({ defaultPageStyle, disableHistory, initialPathVariables, initia
|
|
|
11321
11339
|
});
|
|
11322
11340
|
const startViewTransition2 = useViewTransition();
|
|
11323
11341
|
const monitorNextRender = useMonitorNextRender('route-change');
|
|
11324
|
-
const currentRouteRef =
|
|
11325
|
-
const currentPathVariablesRef =
|
|
11326
|
-
const currentLocaleIdRef =
|
|
11342
|
+
const currentRouteRef = react_48.default.useRef(initialRoute);
|
|
11343
|
+
const currentPathVariablesRef = react_48.default.useRef(initialPathVariables);
|
|
11344
|
+
const currentLocaleIdRef = react_48.default.useRef(initialLocaleId);
|
|
11327
11345
|
const currentLocaleId = currentLocaleIdRef.current;
|
|
11328
|
-
const activeLocale =
|
|
11346
|
+
const activeLocale = react_48.default.useMemo(() => {
|
|
11329
11347
|
var _a;
|
|
11330
11348
|
return (_a = locales.find(({ id: id3, }) => {
|
|
11331
11349
|
if (!currentLocaleId) {
|
|
@@ -11337,7 +11355,7 @@ function Router({ defaultPageStyle, disableHistory, initialPathVariables, initia
|
|
|
11337
11355
|
: null;
|
|
11338
11356
|
}, [currentLocaleId, locales,]);
|
|
11339
11357
|
const [dep, forceUpdate,] = useForceUpdate2();
|
|
11340
|
-
const localeInfo =
|
|
11358
|
+
const localeInfo = react_48.default.useMemo(() => {
|
|
11341
11359
|
return {
|
|
11342
11360
|
activeLocale,
|
|
11343
11361
|
locales,
|
|
@@ -11375,7 +11393,7 @@ function Router({ defaultPageStyle, disableHistory, initialPathVariables, initia
|
|
|
11375
11393
|
}
|
|
11376
11394
|
currentPathVariablesRef.current = localeResult.pathVariables;
|
|
11377
11395
|
currentLocaleIdRef.current = nextLocale.id;
|
|
11378
|
-
startViewTransition2(currentRouteRef.current, currentRouteId2, () => (0,
|
|
11396
|
+
startViewTransition2(currentRouteRef.current, currentRouteId2, () => (0, react_48.startTransition)(forceUpdate));
|
|
11379
11397
|
monitorNextRender();
|
|
11380
11398
|
}
|
|
11381
11399
|
catch (_f) {
|
|
@@ -11393,18 +11411,18 @@ function Router({ defaultPageStyle, disableHistory, initialPathVariables, initia
|
|
|
11393
11411
|
preserveQueryParams,
|
|
11394
11412
|
]);
|
|
11395
11413
|
const scheduleSideEffect = useScheduleRenderSideEffects(dep);
|
|
11396
|
-
const setCurrentRouteId =
|
|
11414
|
+
const setCurrentRouteId = react_48.default.useCallback((routeId, localeId, hash2, pathVariables, smoothScroll = false, isHistoryTransition = false) => {
|
|
11397
11415
|
currentRouteRef.current = routeId;
|
|
11398
11416
|
currentPathVariablesRef.current = pathVariables;
|
|
11399
11417
|
currentLocaleIdRef.current = localeId;
|
|
11400
11418
|
scheduleSideEffect(() => {
|
|
11401
11419
|
updateScrollPosition(hash2, smoothScroll, isHistoryTransition);
|
|
11402
11420
|
});
|
|
11403
|
-
(0,
|
|
11421
|
+
(0, react_48.startTransition)(forceUpdate);
|
|
11404
11422
|
monitorNextRender();
|
|
11405
11423
|
}, [forceUpdate, monitorNextRender, scheduleSideEffect,]);
|
|
11406
11424
|
usePopStateHandler(currentRouteRef, setCurrentRouteId);
|
|
11407
|
-
const navigate =
|
|
11425
|
+
const navigate = react_48.default.useCallback((routeId, hash2, pathVariables, smoothScroll) => {
|
|
11408
11426
|
var _a, _b;
|
|
11409
11427
|
const newRoute = routes[routeId];
|
|
11410
11428
|
if (pathVariables) {
|
|
@@ -11462,7 +11480,7 @@ function Router({ defaultPageStyle, disableHistory, initialPathVariables, initia
|
|
|
11462
11480
|
const getRoute = useGetRouteCallback(routes);
|
|
11463
11481
|
const currentRouteId = currentRouteRef.current;
|
|
11464
11482
|
const currentPathVariables = currentPathVariablesRef.current;
|
|
11465
|
-
const api =
|
|
11483
|
+
const api = react_48.default.useMemo(() => ({
|
|
11466
11484
|
navigate,
|
|
11467
11485
|
getRoute,
|
|
11468
11486
|
currentRouteId,
|
|
@@ -11484,7 +11502,7 @@ function Router({ defaultPageStyle, disableHistory, initialPathVariables, initia
|
|
|
11484
11502
|
notFoundPage,
|
|
11485
11503
|
defaultPageStyle,
|
|
11486
11504
|
forceUpdateKey: dep,
|
|
11487
|
-
children: (0, jsx_runtime_1.jsx)(
|
|
11505
|
+
children: (0, jsx_runtime_1.jsx)(react_48.default.Fragment, {
|
|
11488
11506
|
children: pageExistsInCurrentLocale
|
|
11489
11507
|
? renderPage(current.page, defaultPageStyle)
|
|
11490
11508
|
: notFoundPage && renderPage(notFoundPage, defaultPageStyle),
|
|
@@ -11496,7 +11514,7 @@ function Router({ defaultPageStyle, disableHistory, initialPathVariables, initia
|
|
|
11496
11514
|
value: localeInfo,
|
|
11497
11515
|
children: enableSuspenseThatPreservesDom
|
|
11498
11516
|
? (0, jsx_runtime_1.jsx)(SuspenseThatPreservesDom, { children: suspenseChildren, })
|
|
11499
|
-
: (0, jsx_runtime_1.jsx)(
|
|
11517
|
+
: (0, jsx_runtime_1.jsx)(react_48.default.Suspense, { fallback: null, children: suspenseChildren, }),
|
|
11500
11518
|
}),
|
|
11501
11519
|
});
|
|
11502
11520
|
}
|
|
@@ -11622,11 +11640,11 @@ var key = 'page';
|
|
|
11622
11640
|
function isRoute(route) {
|
|
11623
11641
|
return isObject(route) && key in route && route.page !== void 0;
|
|
11624
11642
|
}
|
|
11625
|
-
var CurrentRouteContext =
|
|
11643
|
+
var CurrentRouteContext = react_60.default.createContext(void 0);
|
|
11626
11644
|
function useCurrentRoute() {
|
|
11627
11645
|
var _a;
|
|
11628
11646
|
const router = useRouter();
|
|
11629
|
-
const override = (0,
|
|
11647
|
+
const override = (0, react_60.useContext)(CurrentRouteContext);
|
|
11630
11648
|
const id3 = override !== null && override !== void 0 ? override : router.currentRouteId;
|
|
11631
11649
|
if (!id3) {
|
|
11632
11650
|
return void 0;
|
|
@@ -11659,7 +11677,7 @@ exports.useRoute = useRoute;
|
|
|
11659
11677
|
var shouldPreloadBasedOnUA = typeof window !== 'undefined' && !isBot(navigator.userAgent);
|
|
11660
11678
|
function useRoutePreloader(routeIds, enabled = true) {
|
|
11661
11679
|
const { getRoute, } = useRouter();
|
|
11662
|
-
|
|
11680
|
+
react_62.default.useEffect(() => {
|
|
11663
11681
|
if (!getRoute || !enabled || !shouldPreloadBasedOnUA) {
|
|
11664
11682
|
return;
|
|
11665
11683
|
}
|
|
@@ -11686,18 +11704,18 @@ function useRouteAnchor(routeId, { elementId, hash: linkHash, } = {}) {
|
|
|
11686
11704
|
const currentRoute = useRoute(currentRouteId !== null && currentRouteId !== void 0 ? currentRouteId : '');
|
|
11687
11705
|
useRoutePreloader([routeId,], true);
|
|
11688
11706
|
const hash2 = linkHash !== null && linkHash !== void 0 ? linkHash : elementId;
|
|
11689
|
-
const href =
|
|
11707
|
+
const href = react_61.default.useMemo(() => getPathForRoute(route, {
|
|
11690
11708
|
currentRoutePath: currentRoute === null || currentRoute === void 0 ? void 0 : currentRoute.path,
|
|
11691
11709
|
currentPathVariables,
|
|
11692
11710
|
hash: hash2,
|
|
11693
11711
|
preserveQueryParams,
|
|
11694
11712
|
}), [currentRoute, currentPathVariables, hash2, preserveQueryParams, route,]);
|
|
11695
|
-
const navigateToRoute =
|
|
11713
|
+
const navigateToRoute = react_61.default.useCallback(() => navigate === null || navigate === void 0 ? void 0 : navigate(routeId, hash2), [
|
|
11696
11714
|
hash2,
|
|
11697
11715
|
navigate,
|
|
11698
11716
|
routeId,
|
|
11699
11717
|
]);
|
|
11700
|
-
const onClick =
|
|
11718
|
+
const onClick = react_61.default.useCallback((event) => {
|
|
11701
11719
|
event.preventDefault();
|
|
11702
11720
|
navigateToRoute();
|
|
11703
11721
|
}, [navigateToRoute,]);
|
|
@@ -11708,7 +11726,7 @@ function useRouteElementId(id3, targetRouteId) {
|
|
|
11708
11726
|
var _a;
|
|
11709
11727
|
const currentRoute = useCurrentRoute();
|
|
11710
11728
|
const route = (_a = useRoute(targetRouteId)) !== null && _a !== void 0 ? _a : currentRoute;
|
|
11711
|
-
return
|
|
11729
|
+
return react_63.default.useMemo(() => {
|
|
11712
11730
|
if (!route) {
|
|
11713
11731
|
return id3;
|
|
11714
11732
|
}
|
|
@@ -11719,7 +11737,7 @@ exports.useRouteElementId = useRouteElementId;
|
|
|
11719
11737
|
function useRouteHandler(routeId, preload = false, elementId) {
|
|
11720
11738
|
const { navigate, } = useRouter();
|
|
11721
11739
|
useRoutePreloader([routeId,], preload);
|
|
11722
|
-
const handler =
|
|
11740
|
+
const handler = react_64.default.useCallback(() => navigate === null || navigate === void 0 ? void 0 : navigate(routeId, elementId), [
|
|
11723
11741
|
navigate,
|
|
11724
11742
|
elementId,
|
|
11725
11743
|
routeId,
|
|
@@ -11964,6 +11982,9 @@ exports.Point = Point;
|
|
|
11964
11982
|
Point2.angle = (a, b) => {
|
|
11965
11983
|
return Math.atan2(b.y - a.y, b.x - a.x) * 180 / Math.PI - 90;
|
|
11966
11984
|
};
|
|
11985
|
+
Point2.angleFromX = (a, b) => {
|
|
11986
|
+
return Math.atan2(b.y - a.y, b.x - a.x) * 180 / Math.PI;
|
|
11987
|
+
};
|
|
11967
11988
|
Point2.isEqual = (a, b) => {
|
|
11968
11989
|
return a.x === b.x && a.y === b.y;
|
|
11969
11990
|
};
|
|
@@ -11993,25 +12014,6 @@ exports.Point = Point;
|
|
|
11993
12014
|
};
|
|
11994
12015
|
}
|
|
11995
12016
|
Point2.center = center;
|
|
11996
|
-
function insidePoints(point2, points) {
|
|
11997
|
-
var _f, _j, _k, _l;
|
|
11998
|
-
var _a, _b, _c, _d;
|
|
11999
|
-
const x = point2.x;
|
|
12000
|
-
const y = point2.y;
|
|
12001
|
-
let isInside = false;
|
|
12002
|
-
for (let i = 0, j = points.length - 1; i < points.length; j = i++) {
|
|
12003
|
-
const xi = (_f = ((_a = points[i]) == null ? void 0 : _a.x)) !== null && _f !== void 0 ? _f : 0;
|
|
12004
|
-
const yi = (_j = ((_b = points[i]) == null ? void 0 : _b.y)) !== null && _j !== void 0 ? _j : 0;
|
|
12005
|
-
const xj = (_k = ((_c = points[j]) == null ? void 0 : _c.x)) !== null && _k !== void 0 ? _k : 0;
|
|
12006
|
-
const yj = (_l = ((_d = points[j]) == null ? void 0 : _d.y)) !== null && _l !== void 0 ? _l : 0;
|
|
12007
|
-
const intersect = yi > y !== yj > y && x < (xj - xi) * (y - yi) / (yj - yi) + xi;
|
|
12008
|
-
if (intersect) {
|
|
12009
|
-
isInside = !isInside;
|
|
12010
|
-
}
|
|
12011
|
-
}
|
|
12012
|
-
return isInside;
|
|
12013
|
-
}
|
|
12014
|
-
Point2.insidePoints = insidePoints;
|
|
12015
12017
|
})(Point || (exports.Point = Point = {}));
|
|
12016
12018
|
var BezierDefaults = {
|
|
12017
12019
|
curve: 'ease',
|
|
@@ -14369,7 +14371,7 @@ function assert(condition, ...msg2) {
|
|
|
14369
14371
|
function assertNever(x, error) {
|
|
14370
14372
|
throw error || new Error(x ? `Unexpected value: ${x}` : 'Application entered invalid state');
|
|
14371
14373
|
}
|
|
14372
|
-
var LayoutIdContext =
|
|
14374
|
+
var LayoutIdContext = react_65.default.createContext({
|
|
14373
14375
|
getLayoutId: (args) => null,
|
|
14374
14376
|
persistLayoutIdCache: () => {
|
|
14375
14377
|
},
|
|
@@ -14378,11 +14380,11 @@ var LayoutIdContext = react_64.default.createContext({
|
|
|
14378
14380
|
});
|
|
14379
14381
|
exports.LayoutIdContext = LayoutIdContext;
|
|
14380
14382
|
function LayoutIdProvider({ children, }) {
|
|
14381
|
-
const context = (0,
|
|
14383
|
+
const context = (0, react_65.useContext)(LayoutIdContext);
|
|
14382
14384
|
if (context.top) {
|
|
14383
14385
|
return /* @__PURE__ */ (0, jsx_runtime_8.jsx)(jsx_runtime_8.Fragment, { children, });
|
|
14384
14386
|
}
|
|
14385
|
-
const cache3 = (0,
|
|
14387
|
+
const cache3 = (0, react_65.useRef)({
|
|
14386
14388
|
// When we provide a layoutId for a node based on it's first
|
|
14387
14389
|
// duplicatedFrom id, we save it's layoutId mapped to it's actual id.
|
|
14388
14390
|
// Future screen's nodes will check this cache first, to see if they've
|
|
@@ -14408,7 +14410,7 @@ function LayoutIdProvider({ children, }) {
|
|
|
14408
14410
|
byName: {},
|
|
14409
14411
|
},
|
|
14410
14412
|
});
|
|
14411
|
-
const screen = (0,
|
|
14413
|
+
const screen = (0, react_65.useRef)({
|
|
14412
14414
|
byId: {},
|
|
14413
14415
|
byName: {},
|
|
14414
14416
|
byLastId: {},
|
|
@@ -14416,8 +14418,8 @@ function LayoutIdProvider({ children, }) {
|
|
|
14416
14418
|
byLastName: {},
|
|
14417
14419
|
byLayoutId: {},
|
|
14418
14420
|
});
|
|
14419
|
-
const usedIds = (0,
|
|
14420
|
-
const getLayoutId = (0,
|
|
14421
|
+
const usedIds = (0, react_65.useRef)(/* @__PURE__ */ new Set()).current;
|
|
14422
|
+
const getLayoutId = (0, react_65.useCallback)(({ id: id3, name, duplicatedFrom, }) => {
|
|
14421
14423
|
var _f;
|
|
14422
14424
|
if (!id3) {
|
|
14423
14425
|
return null;
|
|
@@ -14510,7 +14512,7 @@ function LayoutIdProvider({ children, }) {
|
|
|
14510
14512
|
usedIds.add(layoutId);
|
|
14511
14513
|
return layoutId;
|
|
14512
14514
|
}, []);
|
|
14513
|
-
const persistLayoutIdCache = (0,
|
|
14515
|
+
const persistLayoutIdCache = (0, react_65.useCallback)(() => {
|
|
14514
14516
|
cache3.current = {
|
|
14515
14517
|
byId: Object.assign(Object.assign({}, cache3.current.byId), screen.current.byId),
|
|
14516
14518
|
byLastId: Object.assign(Object.assign({}, cache3.current.byLastId), screen.current.byLastId),
|
|
@@ -14539,7 +14541,7 @@ function LayoutIdProvider({ children, }) {
|
|
|
14539
14541
|
};
|
|
14540
14542
|
usedIds.clear();
|
|
14541
14543
|
}, []);
|
|
14542
|
-
const contextValue = (0,
|
|
14544
|
+
const contextValue = (0, react_65.useRef)({
|
|
14543
14545
|
getLayoutId,
|
|
14544
14546
|
persistLayoutIdCache,
|
|
14545
14547
|
top: true,
|
|
@@ -14558,15 +14560,15 @@ function nextLayoutId(identifier, initialValue, usedIds) {
|
|
|
14558
14560
|
}
|
|
14559
14561
|
function AutomaticLayoutIds(_f) {
|
|
14560
14562
|
var { enabled = true } = _f, props = __rest(_f, ["enabled"]);
|
|
14561
|
-
const context = (0,
|
|
14562
|
-
const contextValue = (0,
|
|
14563
|
+
const context = (0, react_65.useContext)(LayoutIdContext);
|
|
14564
|
+
const contextValue = (0, react_65.useMemo)(() => {
|
|
14563
14565
|
return Object.assign(Object.assign({}, context), { enabled });
|
|
14564
14566
|
}, [enabled,]);
|
|
14565
14567
|
return /* @__PURE__ */ (0, jsx_runtime_8.jsx)(LayoutIdContext.Provider, Object.assign(Object.assign({}, props), { value: contextValue }));
|
|
14566
14568
|
}
|
|
14567
14569
|
exports.AutomaticLayoutIds = AutomaticLayoutIds;
|
|
14568
14570
|
function useConstant2(init) {
|
|
14569
|
-
const ref = (0,
|
|
14571
|
+
const ref = (0, react_67.useRef)(null);
|
|
14570
14572
|
if (ref.current === null) {
|
|
14571
14573
|
ref.current = init();
|
|
14572
14574
|
}
|
|
@@ -14658,21 +14660,24 @@ function getColorsFromTheme(theme, type) {
|
|
|
14658
14660
|
screenColor: isDarkTheme ? '#333' : '#eee',
|
|
14659
14661
|
};
|
|
14660
14662
|
}
|
|
14661
|
-
var ErrorBoundary2 = class extends
|
|
14663
|
+
var ErrorBoundary2 = class extends react_66.Component {
|
|
14662
14664
|
constructor() {
|
|
14663
14665
|
super(...arguments);
|
|
14664
14666
|
__publicField(this, 'state', {});
|
|
14665
14667
|
}
|
|
14666
14668
|
componentDidCatch(error, info) {
|
|
14667
|
-
|
|
14669
|
+
var _a;
|
|
14670
|
+
let stack = (_a = info.componentStack) == null ? void 0 : _a.split('\n').filter((line) => line.length !== 0);
|
|
14668
14671
|
let currentIndex = 0;
|
|
14669
|
-
|
|
14670
|
-
|
|
14671
|
-
|
|
14672
|
+
if (stack) {
|
|
14673
|
+
for (const line of stack) {
|
|
14674
|
+
if (line.startsWith(` in ${this.constructor.name}`)) {
|
|
14675
|
+
break;
|
|
14676
|
+
}
|
|
14677
|
+
currentIndex++;
|
|
14672
14678
|
}
|
|
14673
|
-
currentIndex
|
|
14679
|
+
stack = stack.slice(0, currentIndex);
|
|
14674
14680
|
}
|
|
14675
|
-
stack = stack.slice(0, currentIndex);
|
|
14676
14681
|
this.setState({
|
|
14677
14682
|
lastError: {
|
|
14678
14683
|
error,
|
|
@@ -14698,15 +14703,15 @@ var ErrorBoundary2 = class extends react_65.Component {
|
|
|
14698
14703
|
function Device(_f) {
|
|
14699
14704
|
var { canResize = false, children, ResizeObserver: ResizeObserver22 = safeWindow.ResizeObserver } = _f, options = __rest(_f, ["canResize", "children", "ResizeObserver"]);
|
|
14700
14705
|
var _a, _b;
|
|
14701
|
-
const optionsRef =
|
|
14706
|
+
const optionsRef = react_66.default.useRef(void 0);
|
|
14702
14707
|
if (optionsRef.current === void 0) {
|
|
14703
14708
|
optionsRef.current = options;
|
|
14704
14709
|
}
|
|
14705
14710
|
const deviceAppearance = (_a = options.deviceOptions) == null ? void 0 : _a.appearance.type;
|
|
14706
|
-
const scaleDataRef =
|
|
14707
|
-
const containerRef =
|
|
14708
|
-
const deviceRef =
|
|
14709
|
-
const screenRef =
|
|
14711
|
+
const scaleDataRef = react_66.default.useRef();
|
|
14712
|
+
const containerRef = react_66.default.useRef(null);
|
|
14713
|
+
const deviceRef = react_66.default.useRef(null);
|
|
14714
|
+
const screenRef = react_66.default.useRef(null);
|
|
14710
14715
|
const updateImperativeScale = ({ scale: scale2, screenScalePixelFix, }) => {
|
|
14711
14716
|
if (!scaleDataRef.current || !deviceRef.current || !screenRef.current) {
|
|
14712
14717
|
return;
|
|
@@ -14718,14 +14723,14 @@ function Device(_f) {
|
|
|
14718
14723
|
const scale2 = scaleDataRef.current = getScaleData(options.deviceOptions, options.scaleTo);
|
|
14719
14724
|
updateImperativeScale(scale2);
|
|
14720
14725
|
}
|
|
14721
|
-
const invertScale2 =
|
|
14726
|
+
const invertScale2 = react_66.default.useCallback((point2) => {
|
|
14722
14727
|
if (!scaleDataRef.current) {
|
|
14723
14728
|
return point2;
|
|
14724
14729
|
}
|
|
14725
14730
|
const { scale: scale2 = 1, } = scaleDataRef.current;
|
|
14726
14731
|
return { x: point2.x / scale2, y: point2.y / scale2, };
|
|
14727
14732
|
}, [scaleDataRef,]);
|
|
14728
|
-
const updateScale =
|
|
14733
|
+
const updateScale = react_66.default.useCallback(() => {
|
|
14729
14734
|
var _f;
|
|
14730
14735
|
const { deviceOptions, scaleTo, onScaleChange, } = (_f = optionsRef.current) !== null && _f !== void 0 ? _f : {};
|
|
14731
14736
|
if (!deviceOptions || !scaleTo || scaleTo !== 'dynamic' || !containerRef.current) {
|
|
@@ -14747,7 +14752,7 @@ function Device(_f) {
|
|
|
14747
14752
|
}
|
|
14748
14753
|
return new ResizeObserver22(() => updateScale());
|
|
14749
14754
|
});
|
|
14750
|
-
|
|
14755
|
+
react_66.default.useLayoutEffect(() => {
|
|
14751
14756
|
optionsRef.current = {
|
|
14752
14757
|
deviceOptions: options.deviceOptions,
|
|
14753
14758
|
onScaleChange: options.onScaleChange,
|
|
@@ -14755,10 +14760,10 @@ function Device(_f) {
|
|
|
14755
14760
|
scaleTo: options.scaleTo,
|
|
14756
14761
|
};
|
|
14757
14762
|
}, [options.deviceOptions, options.onScaleChange, options.overrideTheme, options.scaleTo,]);
|
|
14758
|
-
|
|
14763
|
+
react_66.default.useLayoutEffect(() => {
|
|
14759
14764
|
updateScale();
|
|
14760
14765
|
}, [updateScale,]);
|
|
14761
|
-
|
|
14766
|
+
react_66.default.useEffect(() => {
|
|
14762
14767
|
if (!observer2 || !containerRef.current) {
|
|
14763
14768
|
return;
|
|
14764
14769
|
}
|
|
@@ -15032,13 +15037,18 @@ var Rect;
|
|
|
15032
15037
|
};
|
|
15033
15038
|
};
|
|
15034
15039
|
Rect2.boundingRectFromPoints = (ps) => {
|
|
15035
|
-
|
|
15036
|
-
|
|
15037
|
-
|
|
15038
|
-
|
|
15039
|
-
|
|
15040
|
-
|
|
15041
|
-
|
|
15040
|
+
let minX2 = Infinity;
|
|
15041
|
+
let maxX2 = -Infinity;
|
|
15042
|
+
let minY2 = Infinity;
|
|
15043
|
+
let maxY2 = -Infinity;
|
|
15044
|
+
for (let i = 0; i < ps.length; i++) {
|
|
15045
|
+
const point2 = ps[i];
|
|
15046
|
+
minX2 = Math.min(minX2, point2.x);
|
|
15047
|
+
maxX2 = Math.max(maxX2, point2.x);
|
|
15048
|
+
minY2 = Math.min(minY2, point2.y);
|
|
15049
|
+
maxY2 = Math.max(maxY2, point2.y);
|
|
15050
|
+
}
|
|
15051
|
+
return { x: minX2, y: minY2, width: maxX2 - minX2, height: maxY2 - minY2, };
|
|
15042
15052
|
};
|
|
15043
15053
|
Rect2.fromPoints = (ps) => {
|
|
15044
15054
|
const [tl, tr, _, bl,] = ps;
|
|
@@ -15811,7 +15821,7 @@ var ParentSizeState = /* @__PURE__ */ ((ParentSizeState2) => {
|
|
|
15811
15821
|
return ParentSizeState2;
|
|
15812
15822
|
})(ParentSizeState || {});
|
|
15813
15823
|
exports.ParentSizeState = ParentSizeState;
|
|
15814
|
-
var ConstraintsContext =
|
|
15824
|
+
var ConstraintsContext = react_69.default.createContext({
|
|
15815
15825
|
parentSize: 0,
|
|
15816
15826
|
/* Unknown */
|
|
15817
15827
|
});
|
|
@@ -15822,7 +15832,7 @@ function deprecatedParentSize(parentSize) {
|
|
|
15822
15832
|
return parentSize;
|
|
15823
15833
|
}
|
|
15824
15834
|
function useParentSize() {
|
|
15825
|
-
return
|
|
15835
|
+
return react_69.default.useContext(ConstraintsContext).parentSize;
|
|
15826
15836
|
}
|
|
15827
15837
|
function isSize(o) {
|
|
15828
15838
|
return typeof o === 'object';
|
|
@@ -15830,7 +15840,7 @@ function isSize(o) {
|
|
|
15830
15840
|
var ProvideParentSize = (props) => {
|
|
15831
15841
|
const currentParentSize = useParentSize();
|
|
15832
15842
|
const { parentSize, children, } = props;
|
|
15833
|
-
const value =
|
|
15843
|
+
const value = react_69.default.useMemo(() => ({ parentSize, }),
|
|
15834
15844
|
// We are generating the memoKeys in runtime and react doesn't like it,
|
|
15835
15845
|
// but it should be safe to ignore.
|
|
15836
15846
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
@@ -15881,6 +15891,8 @@ var ControlType = /* @__PURE__ */ ((ControlType2) => {
|
|
|
15881
15891
|
ControlType2['CustomCursor'] = 'customcursor';
|
|
15882
15892
|
ControlType2['Border'] = 'border';
|
|
15883
15893
|
ControlType2['Cursor'] = 'cursor';
|
|
15894
|
+
ControlType2['Padding'] = 'padding';
|
|
15895
|
+
ControlType2['BorderRadius'] = 'borderradius';
|
|
15884
15896
|
return ControlType2;
|
|
15885
15897
|
})(ControlType || {});
|
|
15886
15898
|
exports.ControlType = ControlType;
|
|
@@ -16833,6 +16845,8 @@ function getControlDefaultValue(control) {
|
|
|
16833
16845
|
case 'date':
|
|
16834
16846
|
case 'link':
|
|
16835
16847
|
case 'boxshadow':
|
|
16848
|
+
case 'padding':
|
|
16849
|
+
case 'borderradius':
|
|
16836
16850
|
return isString22(control.defaultValue) ? control.defaultValue : void 0;
|
|
16837
16851
|
case 'boolean':
|
|
16838
16852
|
return isBoolean(control.defaultValue) ? control.defaultValue : void 0;
|
|
@@ -18009,7 +18023,7 @@ function applyMetaTag(name, props) {
|
|
|
18009
18023
|
}
|
|
18010
18024
|
}
|
|
18011
18025
|
function usePrototypingMetaTags() {
|
|
18012
|
-
|
|
18026
|
+
react_70.default.useEffect(() => {
|
|
18013
18027
|
applyMetaTag('mobile-web-app-capable', { content: 'yes', });
|
|
18014
18028
|
applyMetaTag('apple-mobile-web-app-capable', { content: 'yes', });
|
|
18015
18029
|
applyMetaTag('apple-mobile-web-app-status-bar-style', {
|
|
@@ -18024,7 +18038,7 @@ function DeviceCodeComponentInner(_f) {
|
|
|
18024
18038
|
var { children } = _f, props = __rest(_f, ["children"]);
|
|
18025
18039
|
usePrototypingMetaTags();
|
|
18026
18040
|
const deviceOptions = convertPropsToDeviceOptions(props, { forceOldClay: true, });
|
|
18027
|
-
|
|
18041
|
+
react_68.default.useInsertionEffect(() => {
|
|
18028
18042
|
injectComponentCSSRules();
|
|
18029
18043
|
}, []);
|
|
18030
18044
|
if (!deviceOptions) {
|
|
@@ -18036,8 +18050,8 @@ function DeviceCodeComponentInner(_f) {
|
|
|
18036
18050
|
});
|
|
18037
18051
|
}
|
|
18038
18052
|
const child = Array.isArray(children) ? children[0] : children;
|
|
18039
|
-
const resizedChild = child &&
|
|
18040
|
-
?
|
|
18053
|
+
const resizedChild = child && react_68.default.isValidElement(child)
|
|
18054
|
+
? react_68.default.cloneElement(child, {
|
|
18041
18055
|
width: deviceOptions.screenWidth,
|
|
18042
18056
|
height: deviceOptions.screenHeight,
|
|
18043
18057
|
})
|
|
@@ -18189,11 +18203,11 @@ function memoize(fn) {
|
|
|
18189
18203
|
}
|
|
18190
18204
|
var reactPropsRegex = /^(?:children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|abbr|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|enterKeyHint|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|translate|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|incremental|fallback|inert|itemProp|itemScope|itemType|itemID|itemRef|on|option|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|[dkrxyz]|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y1|y2|yChannelSelector|zoomAndPan|for|class|autofocus|(?:[Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*)$/;
|
|
18191
18205
|
var isPropValid = /* @__PURE__ */ memoize((prop) => reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111 && prop.charCodeAt(1) === 110 && prop.charCodeAt(2) < 91);
|
|
18192
|
-
var LibraryFeaturesContext = /* @__PURE__ */
|
|
18206
|
+
var LibraryFeaturesContext = /* @__PURE__ */ react_74.default.createContext(void 0);
|
|
18193
18207
|
var LibraryFeaturesProvider = LibraryFeaturesContext.Provider;
|
|
18194
18208
|
exports.LibraryFeaturesProvider = LibraryFeaturesProvider;
|
|
18195
18209
|
var useLibraryFeatures = () => {
|
|
18196
|
-
const context =
|
|
18210
|
+
const context = react_74.default.useContext(LibraryFeaturesContext);
|
|
18197
18211
|
return context !== null && context !== void 0 ? context : {};
|
|
18198
18212
|
};
|
|
18199
18213
|
var import_process = __toESM(require_browser(), 1);
|
|
@@ -18488,10 +18502,10 @@ function getImageStyle(image, containerSize) {
|
|
|
18488
18502
|
function StaticImage({ image, containerSize, nodeId, alt, }) {
|
|
18489
18503
|
const source = runtime.useImageSource(image, containerSize, nodeId);
|
|
18490
18504
|
const imageStyle = getImageStyle(image, containerSize);
|
|
18491
|
-
const [measuredSizes, setMeasuredSizes,] =
|
|
18492
|
-
const imageRef =
|
|
18505
|
+
const [measuredSizes, setMeasuredSizes,] = react_73.default.useState();
|
|
18506
|
+
const imageRef = react_73.default.useRef(null);
|
|
18493
18507
|
const libraryFeatures = useLibraryFeatures();
|
|
18494
|
-
|
|
18508
|
+
react_73.default.useEffect(() => {
|
|
18495
18509
|
if (!libraryFeatures.imgSizesWorkaroundEnabled) {
|
|
18496
18510
|
return;
|
|
18497
18511
|
}
|
|
@@ -18532,10 +18546,10 @@ function StaticImage({ image, containerSize, nodeId, alt, }) {
|
|
|
18532
18546
|
});
|
|
18533
18547
|
}
|
|
18534
18548
|
function CanvasImage({ image, containerSize, nodeId, }) {
|
|
18535
|
-
const wrapperRef =
|
|
18549
|
+
const wrapperRef = react_73.default.useRef(null);
|
|
18536
18550
|
const imageElement = runtime.useImageElement(image, containerSize, nodeId);
|
|
18537
18551
|
const imageStyle = getImageStyle(image, containerSize);
|
|
18538
|
-
|
|
18552
|
+
react_73.default.useLayoutEffect(() => {
|
|
18539
18553
|
const wrapper = wrapperRef.current;
|
|
18540
18554
|
if (wrapper === null) {
|
|
18541
18555
|
return;
|
|
@@ -18549,9 +18563,9 @@ function CanvasImage({ image, containerSize, nodeId, }) {
|
|
|
18549
18563
|
return /* @__PURE__ */ (0, jsx_runtime_13.jsx)('div', { ref: wrapperRef, style: { display: 'contents', borderRadius: 'inherit', }, });
|
|
18550
18564
|
}
|
|
18551
18565
|
function OptimizedCanvasImage({ nodeId, image, containerSize, }) {
|
|
18552
|
-
const wrapperRef =
|
|
18566
|
+
const wrapperRef = react_73.default.useRef(null);
|
|
18553
18567
|
const source = runtime.useImageSource(image, containerSize, nodeId);
|
|
18554
|
-
|
|
18568
|
+
react_73.default.useLayoutEffect(() => {
|
|
18555
18569
|
const wrapper = wrapperRef.current;
|
|
18556
18570
|
if (wrapper === null) {
|
|
18557
18571
|
return;
|
|
@@ -18753,11 +18767,11 @@ function processOverrideForwarding(props, children) {
|
|
|
18753
18767
|
if (!_forwardedOverrides) {
|
|
18754
18768
|
return { props, children, };
|
|
18755
18769
|
}
|
|
18756
|
-
children =
|
|
18757
|
-
if (!
|
|
18770
|
+
children = react_75.default.Children.map(children, (child) => {
|
|
18771
|
+
if (!react_75.default.isValidElement(child)) {
|
|
18758
18772
|
return child;
|
|
18759
18773
|
}
|
|
18760
|
-
return
|
|
18774
|
+
return react_75.default.cloneElement(child, { _forwardedOverrides, });
|
|
18761
18775
|
});
|
|
18762
18776
|
return { props, children, };
|
|
18763
18777
|
}
|
|
@@ -18780,8 +18794,8 @@ function transformTemplate(center) {
|
|
|
18780
18794
|
exports.transformTemplate = transformTemplate;
|
|
18781
18795
|
function useLayoutId2(props, { specificLayoutId, postfix, } = {}) {
|
|
18782
18796
|
const { name, layoutIdKey, duplicatedFrom, __fromCodeComponentNode = false, drag: drag2, } = props;
|
|
18783
|
-
const { getLayoutId, enabled, } = (0,
|
|
18784
|
-
return (0,
|
|
18797
|
+
const { getLayoutId, enabled, } = (0, react_76.useContext)(LayoutIdContext);
|
|
18798
|
+
return (0, react_76.useMemo)(() => {
|
|
18785
18799
|
if (!enabled) {
|
|
18786
18800
|
return props.layoutId;
|
|
18787
18801
|
}
|
|
@@ -18798,8 +18812,8 @@ function useLayoutId2(props, { specificLayoutId, postfix, } = {}) {
|
|
|
18798
18812
|
return postfix ? `${layoutIdCandidate}-${postfix}` : layoutIdCandidate;
|
|
18799
18813
|
}, [enabled,]);
|
|
18800
18814
|
}
|
|
18801
|
-
var useIsomorphicLayoutEffect2 = typeof document !== 'undefined' ?
|
|
18802
|
-
var ComponentContainerContext =
|
|
18815
|
+
var useIsomorphicLayoutEffect2 = typeof document !== 'undefined' ? react_78.useLayoutEffect : react_78.useEffect;
|
|
18816
|
+
var ComponentContainerContext = react_79.default.createContext(false);
|
|
18803
18817
|
exports.ComponentContainerContext = ComponentContainerContext;
|
|
18804
18818
|
var resizeObservers = [];
|
|
18805
18819
|
var hasActiveObservations = function () {
|
|
@@ -19317,8 +19331,8 @@ var ResizeObserver2 = function () {
|
|
|
19317
19331
|
return ResizeObserver22;
|
|
19318
19332
|
}();
|
|
19319
19333
|
function useForceUpdate3() {
|
|
19320
|
-
const [_, setForcedRenderCount,] =
|
|
19321
|
-
return
|
|
19334
|
+
const [_, setForcedRenderCount,] = react_81.default.useState(0);
|
|
19335
|
+
return react_81.default.useCallback(() => setForcedRenderCount((v) => v + 1), []);
|
|
19322
19336
|
}
|
|
19323
19337
|
var DEFAULT_SIZE = 200;
|
|
19324
19338
|
var _sharedResizeObserver;
|
|
@@ -19353,7 +19367,7 @@ _callbacks = /* @__PURE__ */ new WeakMap();
|
|
|
19353
19367
|
var sharedResizeObserver = isBrowser2() ? new SharedObserver() : void 0;
|
|
19354
19368
|
function useRerenderOnResize(ref) {
|
|
19355
19369
|
const update = useForceUpdate3();
|
|
19356
|
-
(0,
|
|
19370
|
+
(0, react_80.useEffect)(() => {
|
|
19357
19371
|
const element = ref == null ? void 0 : ref.current;
|
|
19358
19372
|
if (!element) {
|
|
19359
19373
|
return;
|
|
@@ -19366,7 +19380,7 @@ function useRerenderOnResize(ref) {
|
|
|
19366
19380
|
}
|
|
19367
19381
|
function useMeasuredSize(ref) {
|
|
19368
19382
|
const forceUpdate = useForceUpdate3();
|
|
19369
|
-
const size2 =
|
|
19383
|
+
const size2 = react_80.default.useRef(null);
|
|
19370
19384
|
function updateSize(newSize) {
|
|
19371
19385
|
if (newSize.width === 0 && newSize.height === 0) {
|
|
19372
19386
|
return;
|
|
@@ -19398,7 +19412,7 @@ function useMeasuredSize(ref) {
|
|
|
19398
19412
|
var SIZE_COMPATIBILITY_WRAPPER_ATTRIBUTE = 'data-framer-size-compatibility-wrapper';
|
|
19399
19413
|
var withMeasuredSize = (Component15) => (props) => {
|
|
19400
19414
|
var _f, _j, _k, _l;
|
|
19401
|
-
const ref =
|
|
19415
|
+
const ref = react_80.default.useRef(null);
|
|
19402
19416
|
const size2 = useMeasuredSize(ref);
|
|
19403
19417
|
const dataProps = { [SIZE_COMPATIBILITY_WRAPPER_ATTRIBUTE]: true, };
|
|
19404
19418
|
const shouldRender = Boolean(size2);
|
|
@@ -19441,7 +19455,7 @@ function unwrapInlinedDisplayContents(element) {
|
|
|
19441
19455
|
function useMeasureLayout(props, ref, getChildren = () => [], options = {}) {
|
|
19442
19456
|
const { id: id3, visible, _needsMeasure, } = props;
|
|
19443
19457
|
const { skipHook = false, } = options;
|
|
19444
|
-
const inCodeComponent = Boolean((0,
|
|
19458
|
+
const inCodeComponent = Boolean((0, react_77.useContext)(ComponentContainerContext));
|
|
19445
19459
|
const onCanvas = RenderTarget.current() === 'CANVAS';
|
|
19446
19460
|
useIsomorphicLayoutEffect2(() => {
|
|
19447
19461
|
if (!onCanvas || inCodeComponent || skipHook) {
|
|
@@ -19678,7 +19692,7 @@ function setTranslateZHack(style, enabled) {
|
|
|
19678
19692
|
if (!useTranslateZHack || !onCanvas) {
|
|
19679
19693
|
return;
|
|
19680
19694
|
}
|
|
19681
|
-
const transform2 = style.transform || '';
|
|
19695
|
+
const transform2 = isString22(style.transform) ? style.transform || '' : '';
|
|
19682
19696
|
if (enabled) {
|
|
19683
19697
|
const hasTranslateZ = transform2.includes(translateZ);
|
|
19684
19698
|
if (!hasTranslateZ) {
|
|
@@ -19706,7 +19720,7 @@ function resetSetStyle(element, key7, toValue, microtask2 = true) {
|
|
|
19706
19720
|
setTimeout(reset, 0);
|
|
19707
19721
|
}
|
|
19708
19722
|
}
|
|
19709
|
-
var Layer = class extends
|
|
19723
|
+
var Layer = class extends react_82.Component {
|
|
19710
19724
|
constructor() {
|
|
19711
19725
|
super(...arguments);
|
|
19712
19726
|
__publicField(this, 'layerElement', null);
|
|
@@ -20156,10 +20170,10 @@ function unwrapFrameProps(frameProps) {
|
|
|
20156
20170
|
var defaultFrameRect = { x: 0, y: 0, width: 200, height: 200, };
|
|
20157
20171
|
function useStyleAndRect(props) {
|
|
20158
20172
|
var _f, _j, _k;
|
|
20159
|
-
|
|
20173
|
+
react_72.default.useInsertionEffect(() => {
|
|
20160
20174
|
injectComponentCSSRules();
|
|
20161
20175
|
}, []);
|
|
20162
|
-
const inCodeComponent = Boolean((0,
|
|
20176
|
+
const inCodeComponent = Boolean((0, react_72.useContext)(ComponentContainerContext));
|
|
20163
20177
|
const { style, _initialStyle, __fromCanvasComponent, size: size2, } = props;
|
|
20164
20178
|
const unwrappedProps = unwrapFrameProps(props);
|
|
20165
20179
|
const constraintsRect = useConstraints(unwrappedProps);
|
|
@@ -20176,7 +20190,7 @@ function useStyleAndRect(props) {
|
|
|
20176
20190
|
if (shouldDisablePointerEvents && safeToEditPointerEvents) {
|
|
20177
20191
|
defaultStyle.pointerEvents = 'none';
|
|
20178
20192
|
}
|
|
20179
|
-
const addTextCentering =
|
|
20193
|
+
const addTextCentering = react_72.default.Children.count(props.children) > 0 && react_72.default.Children.toArray(props.children).every((child) => {
|
|
20180
20194
|
return typeof child === 'string' || typeof child === 'number';
|
|
20181
20195
|
});
|
|
20182
20196
|
const centerTextStyle = addTextCentering && {
|
|
@@ -20288,14 +20302,14 @@ function getMotionProps(props) {
|
|
|
20288
20302
|
function hasDataFramerName(props) {
|
|
20289
20303
|
return 'data-framer-name' in props;
|
|
20290
20304
|
}
|
|
20291
|
-
var VisibleFrame = /* @__PURE__ */ (0,
|
|
20305
|
+
var VisibleFrame = /* @__PURE__ */ (0, react_72.forwardRef)(function VisibleFrame2(props, forwardedRef) {
|
|
20292
20306
|
var _f;
|
|
20293
20307
|
const { name, center, border, _border, __portal, } = props;
|
|
20294
20308
|
const { props: propsWithOverrides, children, } = processOverrideForwarding(props);
|
|
20295
20309
|
const motionProps = getMotionProps(propsWithOverrides);
|
|
20296
20310
|
const layoutId = useLayoutId2(props);
|
|
20297
20311
|
const cursor = getCursorFromEvents(props);
|
|
20298
|
-
const fallbackRef = (0,
|
|
20312
|
+
const fallbackRef = (0, react_72.useRef)(null);
|
|
20299
20313
|
const ref = forwardedRef !== null && forwardedRef !== void 0 ? forwardedRef : fallbackRef;
|
|
20300
20314
|
const dataProps = {
|
|
20301
20315
|
'data-framer-component-type': 'Frame',
|
|
@@ -20321,7 +20335,7 @@ var VisibleFrame = /* @__PURE__ */ (0, react_71.forwardRef)(function VisibleFram
|
|
|
20321
20335
|
}
|
|
20322
20336
|
useMeasureLayout(props, ref);
|
|
20323
20337
|
const backgroundImage = backgroundImageFromProps(props);
|
|
20324
|
-
const inCodeComponent = Boolean((0,
|
|
20338
|
+
const inCodeComponent = Boolean((0, react_72.useContext)(ComponentContainerContext));
|
|
20325
20339
|
const parentSize = resolveParentSize(propsWithOverrides, unwrappedProps, rect, inCodeComponent);
|
|
20326
20340
|
const wrappedContent = useProvideParentSize(
|
|
20327
20341
|
/* @__PURE__ */ (0, jsx_runtime_16.jsxs)(jsx_runtime_16.Fragment, {
|
|
@@ -20363,7 +20377,7 @@ var VisibleFrame = /* @__PURE__ */ (0, react_71.forwardRef)(function VisibleFram
|
|
|
20363
20377
|
__portal,
|
|
20364
20378
|
] }));
|
|
20365
20379
|
});
|
|
20366
|
-
var FrameWithMotion = /* @__PURE__ */ (0,
|
|
20380
|
+
var FrameWithMotion = /* @__PURE__ */ (0, react_72.forwardRef)(function FrameWithMotion2(props, ref) {
|
|
20367
20381
|
countNodeRender();
|
|
20368
20382
|
const { visible = true, } = props;
|
|
20369
20383
|
if (!visible) {
|
|
@@ -20395,7 +20409,7 @@ function isAutoSized({ width, height, }) {
|
|
|
20395
20409
|
}
|
|
20396
20410
|
function EmptyState({ title = '', description = 'Click and drag the connector to any frame on the canvas \u2192', children, size: size2, hide, insideUserCodeComponent = false, position = 'absolute', }) {
|
|
20397
20411
|
const { target, } = RenderEnvironment;
|
|
20398
|
-
const childCount =
|
|
20412
|
+
const childCount = react_71.default.Children.count(children);
|
|
20399
20413
|
if (insideUserCodeComponent && childCount === 0) {
|
|
20400
20414
|
return /* @__PURE__ */ (0, jsx_runtime_17.jsx)(FrameWithMotion, Object.assign(Object.assign({}, size2), { 'data-name': 'placeholder' }));
|
|
20401
20415
|
}
|
|
@@ -20472,7 +20486,7 @@ function Description({ children, }) {
|
|
|
20472
20486
|
});
|
|
20473
20487
|
}
|
|
20474
20488
|
var TREE_ROOT_ID = '__LAYOUT_TREE_ROOT';
|
|
20475
|
-
var SharedLayoutContext = /* @__PURE__ */
|
|
20489
|
+
var SharedLayoutContext = /* @__PURE__ */ react_85.default.createContext({
|
|
20476
20490
|
schedulePromoteTree: () => {
|
|
20477
20491
|
},
|
|
20478
20492
|
scheduleProjectionDidUpdate: () => {
|
|
@@ -20480,7 +20494,7 @@ var SharedLayoutContext = /* @__PURE__ */ react_84.default.createContext({
|
|
|
20480
20494
|
initLead: () => {
|
|
20481
20495
|
},
|
|
20482
20496
|
});
|
|
20483
|
-
var SharedLayoutRoot = class extends
|
|
20497
|
+
var SharedLayoutRoot = class extends react_85.Component {
|
|
20484
20498
|
constructor() {
|
|
20485
20499
|
super(...arguments);
|
|
20486
20500
|
__publicField(this, 'shouldAnimate', false);
|
|
@@ -20601,15 +20615,15 @@ var SharedIntersectionObserver = class {
|
|
|
20601
20615
|
};
|
|
20602
20616
|
_sharedIntersectionObserver = /* @__PURE__ */ new WeakMap();
|
|
20603
20617
|
_callbacks2 = /* @__PURE__ */ new WeakMap();
|
|
20604
|
-
var SharedIntersectionObserverContext = /* @__PURE__ */
|
|
20618
|
+
var SharedIntersectionObserverContext = /* @__PURE__ */ react_87.default.createContext(/* @__PURE__ */ new Map());
|
|
20605
20619
|
function useSharedIntersectionObserver(ref, callback, options) {
|
|
20606
20620
|
if (typeof IntersectionObserver === 'undefined') {
|
|
20607
20621
|
return;
|
|
20608
20622
|
}
|
|
20609
20623
|
const key7 = useConstant2(() => `${options.rootMargin}`);
|
|
20610
|
-
const observers2 =
|
|
20624
|
+
const observers2 = react_87.default.useContext(SharedIntersectionObserverContext);
|
|
20611
20625
|
const { enabled, } = options;
|
|
20612
|
-
|
|
20626
|
+
react_87.default.useEffect(() => {
|
|
20613
20627
|
var _a;
|
|
20614
20628
|
const element = ref.current;
|
|
20615
20629
|
if (!enabled || !element) {
|
|
@@ -20626,14 +20640,14 @@ function useSharedIntersectionObserver(ref, callback, options) {
|
|
|
20626
20640
|
}, [enabled,]);
|
|
20627
20641
|
}
|
|
20628
20642
|
var thresholds2 = /* @__PURE__ */ new Array(100).fill(void 0).map((_, i) => i * 0.01);
|
|
20629
|
-
var ViewportContext = /* @__PURE__ */
|
|
20643
|
+
var ViewportContext = /* @__PURE__ */ react_87.default.createContext(null);
|
|
20630
20644
|
function useAppearEffect(ref, appearCallback, options) {
|
|
20631
|
-
const internalState =
|
|
20645
|
+
const internalState = react_87.default.useRef({
|
|
20632
20646
|
isInView: false,
|
|
20633
20647
|
hasAnimatedOnce: false,
|
|
20634
20648
|
});
|
|
20635
20649
|
const { enabled, animateOnce, threshold, rootMargin = `0px 0px 0px 0px`, } = options;
|
|
20636
|
-
const callback =
|
|
20650
|
+
const callback = react_87.default.useCallback(([entry,]) => {
|
|
20637
20651
|
var _f;
|
|
20638
20652
|
if (!entry) {
|
|
20639
20653
|
return;
|
|
@@ -20796,9 +20810,9 @@ var clamp2 = (value, a, b) => {
|
|
|
20796
20810
|
}
|
|
20797
20811
|
return value;
|
|
20798
20812
|
};
|
|
20799
|
-
var DraggingContext =
|
|
20813
|
+
var DraggingContext = react_90.default.createContext({ dragging: false, });
|
|
20800
20814
|
function WithDragging(Component15) {
|
|
20801
|
-
const _WithDraggingHOC = class extends
|
|
20815
|
+
const _WithDraggingHOC = class extends react_90.default.Component {
|
|
20802
20816
|
constructor(props, defaultProps) {
|
|
20803
20817
|
super(props, defaultProps);
|
|
20804
20818
|
__publicField(this, 'state', {
|
|
@@ -21375,13 +21389,13 @@ var eventHandlerMapping = {
|
|
|
21375
21389
|
var tapEventKeys = /* @__PURE__ */ new Set(['tapstart', 'tap', 'tapend',]);
|
|
21376
21390
|
function WithEvents(BaseComponent) {
|
|
21377
21391
|
var _a;
|
|
21378
|
-
const withEvents = (_a = class extends
|
|
21392
|
+
const withEvents = (_a = class extends react_89.default.Component {
|
|
21379
21393
|
constructor() {
|
|
21380
21394
|
super(...arguments);
|
|
21381
21395
|
__publicField(this, 'shouldCancelTap', false);
|
|
21382
21396
|
__publicField(this, 'activeEventListeners', /* @__PURE__ */ new Map());
|
|
21383
21397
|
__publicField(this, 'hasFramerEventListener', false);
|
|
21384
|
-
__publicField(this, 'component',
|
|
21398
|
+
__publicField(this, 'component', react_89.default.createRef());
|
|
21385
21399
|
}
|
|
21386
21400
|
get element() {
|
|
21387
21401
|
return this.component.current && this.component.current.element;
|
|
@@ -22368,15 +22382,15 @@ var DeprecatedFrame = /* @__PURE__ */ (() => {
|
|
|
22368
22382
|
_forwardedOverrides = void 0;
|
|
22369
22383
|
}
|
|
22370
22384
|
}
|
|
22371
|
-
let children =
|
|
22385
|
+
let children = react_91.default.Children.map(this.props.children, (child) => {
|
|
22372
22386
|
if (isConstraintSupportingChild(child)) {
|
|
22373
|
-
return
|
|
22387
|
+
return react_91.default.cloneElement(child, {
|
|
22374
22388
|
parentSize: this.state.size,
|
|
22375
22389
|
_forwardedOverrides,
|
|
22376
22390
|
});
|
|
22377
22391
|
}
|
|
22378
22392
|
else if (_forwardedOverrides && child) {
|
|
22379
|
-
return
|
|
22393
|
+
return react_91.default.cloneElement(child, { _forwardedOverrides, });
|
|
22380
22394
|
}
|
|
22381
22395
|
else {
|
|
22382
22396
|
return child;
|
|
@@ -22482,7 +22496,7 @@ function isDeprecatedFrameProps(props) {
|
|
|
22482
22496
|
var DeprecatedFrameWithEvents = /* @__PURE__ */ WithEvents(DeprecatedFrame);
|
|
22483
22497
|
exports.DeprecatedFrameWithEvents = DeprecatedFrameWithEvents;
|
|
22484
22498
|
var Frame = /* @__PURE__ */ (() => {
|
|
22485
|
-
const FrameInner = (0,
|
|
22499
|
+
const FrameInner = (0, react_88.forwardRef)(function FrameInner2(props, ref) {
|
|
22486
22500
|
const parentSize = useParentSize();
|
|
22487
22501
|
if (isDeprecatedFrameProps(props)) {
|
|
22488
22502
|
const currentParentSize = props.parentSize || deprecatedParentSize(parentSize);
|
|
@@ -22494,7 +22508,7 @@ var Frame = /* @__PURE__ */ (() => {
|
|
|
22494
22508
|
return FrameInner;
|
|
22495
22509
|
})();
|
|
22496
22510
|
exports.Frame = Frame;
|
|
22497
|
-
var LayoutTree = class extends
|
|
22511
|
+
var LayoutTree = class extends react_92.Component {
|
|
22498
22512
|
constructor() {
|
|
22499
22513
|
super(...arguments);
|
|
22500
22514
|
__publicField(this, 'layoutMaybeMutated');
|
|
@@ -22570,12 +22584,12 @@ var LayoutTree = class extends react_91.Component {
|
|
|
22570
22584
|
}
|
|
22571
22585
|
};
|
|
22572
22586
|
var SharedLayoutTree = (props) => {
|
|
22573
|
-
const sharedLayoutContext =
|
|
22587
|
+
const sharedLayoutContext = react_92.default.useContext(SharedLayoutContext);
|
|
22574
22588
|
return /* @__PURE__ */ (0, jsx_runtime_25.jsx)(LayoutTree, Object.assign(Object.assign({}, props), { sharedLayoutContext }));
|
|
22575
22589
|
};
|
|
22576
|
-
var NavigationContainerContext =
|
|
22590
|
+
var NavigationContainerContext = react_93.default.createContext(true);
|
|
22577
22591
|
function useIsInCurrentNavigationTarget() {
|
|
22578
|
-
const isInCurrentNavigationTarget = (0,
|
|
22592
|
+
const isInCurrentNavigationTarget = (0, react_93.useContext)(NavigationContainerContext);
|
|
22579
22593
|
return isInCurrentNavigationTarget;
|
|
22580
22594
|
}
|
|
22581
22595
|
exports.useIsInCurrentNavigationTarget = useIsInCurrentNavigationTarget;
|
|
@@ -22585,7 +22599,7 @@ function newMap() {
|
|
|
22585
22599
|
function useMap() {
|
|
22586
22600
|
return useConstant2(newMap);
|
|
22587
22601
|
}
|
|
22588
|
-
var NavigationTargetContext = /* @__PURE__ */ (0,
|
|
22602
|
+
var NavigationTargetContext = /* @__PURE__ */ (0, react_94.createContext)({
|
|
22589
22603
|
register: () => {
|
|
22590
22604
|
},
|
|
22591
22605
|
deregister: () => {
|
|
@@ -22593,7 +22607,7 @@ var NavigationTargetContext = /* @__PURE__ */ (0, react_93.createContext)({
|
|
|
22593
22607
|
});
|
|
22594
22608
|
var NavigationTargetWrapper = ({ isCurrent, isOverlayed, children, }) => {
|
|
22595
22609
|
const callbacks2 = useMap();
|
|
22596
|
-
const register = (0,
|
|
22610
|
+
const register = (0, react_94.useCallback)((fn) => {
|
|
22597
22611
|
if (callbacks2.has(fn)) {
|
|
22598
22612
|
console.warn('NavigationTargetWrapper: already registered');
|
|
22599
22613
|
return;
|
|
@@ -22603,7 +22617,7 @@ var NavigationTargetWrapper = ({ isCurrent, isOverlayed, children, }) => {
|
|
|
22603
22617
|
callbacks2,
|
|
22604
22618
|
/* constant, so should never change */
|
|
22605
22619
|
]);
|
|
22606
|
-
const deregister = (0,
|
|
22620
|
+
const deregister = (0, react_94.useCallback)((fn) => {
|
|
22607
22621
|
const cleanup = callbacks2.get(fn);
|
|
22608
22622
|
cleanup == null ? void 0 : cleanup();
|
|
22609
22623
|
callbacks2.delete(fn);
|
|
@@ -22611,8 +22625,8 @@ var NavigationTargetWrapper = ({ isCurrent, isOverlayed, children, }) => {
|
|
|
22611
22625
|
callbacks2,
|
|
22612
22626
|
/* constant, so should never change */
|
|
22613
22627
|
]);
|
|
22614
|
-
const value = (0,
|
|
22615
|
-
(0,
|
|
22628
|
+
const value = (0, react_94.useRef)({ register, deregister, }).current;
|
|
22629
|
+
(0, react_94.useEffect)(() => {
|
|
22616
22630
|
callbacks2.forEach((_, cb) => {
|
|
22617
22631
|
const newCleanup = cb(isCurrent, isOverlayed);
|
|
22618
22632
|
callbacks2.set(cb, isFunction(newCleanup) ? newCleanup : void 0);
|
|
@@ -22635,8 +22649,8 @@ var NavigationTargetWrapper = ({ isCurrent, isOverlayed, children, }) => {
|
|
|
22635
22649
|
return /* @__PURE__ */ (0, jsx_runtime_26.jsx)(NavigationTargetContext.Provider, { value, children, });
|
|
22636
22650
|
};
|
|
22637
22651
|
function useOnCurrentTargetChange(callback, deps = []) {
|
|
22638
|
-
const { register, deregister, } = (0,
|
|
22639
|
-
(0,
|
|
22652
|
+
const { register, deregister, } = (0, react_94.useContext)(NavigationTargetContext);
|
|
22653
|
+
(0, react_94.useEffect)(() => {
|
|
22640
22654
|
if (!callback) {
|
|
22641
22655
|
return;
|
|
22642
22656
|
}
|
|
@@ -22645,23 +22659,23 @@ function useOnCurrentTargetChange(callback, deps = []) {
|
|
|
22645
22659
|
}, [register, deregister, ...deps,]);
|
|
22646
22660
|
}
|
|
22647
22661
|
exports.useOnCurrentTargetChange = useOnCurrentTargetChange;
|
|
22648
|
-
var NavigationContainer = /* @__PURE__ */
|
|
22662
|
+
var NavigationContainer = /* @__PURE__ */ react_86.default.memo(function NavigationContainer2({ isLayeredContainer, isCurrent, isPrevious, isOverlayed = false, visible, transitionProps, children, backdropColor, onTapBackdrop, backfaceVisible, exitBackfaceVisible, animation, exitAnimation, instant, initialProps, exitProps, position = { top: 0, right: 0, bottom: 0, left: 0, }, withMagicMotion, index, areMagicMotionLayersPresent, id: id3, isInitial, }) {
|
|
22649
22663
|
const animate3 = useAnimation();
|
|
22650
|
-
const presence = (0,
|
|
22651
|
-
const { persistLayoutIdCache, } = (0,
|
|
22652
|
-
const previousState = (0,
|
|
22664
|
+
const presence = (0, react_86.useContext)(PresenceContext);
|
|
22665
|
+
const { persistLayoutIdCache, } = (0, react_86.useContext)(LayoutIdContext);
|
|
22666
|
+
const previousState = (0, react_86.useRef)({
|
|
22653
22667
|
wasCurrent: void 0,
|
|
22654
22668
|
wasPrevious: false,
|
|
22655
22669
|
wasBeingRemoved: false,
|
|
22656
22670
|
wasReset: true,
|
|
22657
22671
|
origins: getOriginProps({}, initialProps, transitionProps),
|
|
22658
22672
|
});
|
|
22659
|
-
const viewportRef = (0,
|
|
22673
|
+
const viewportRef = (0, react_86.useRef)(null);
|
|
22660
22674
|
const isBeingRemoved = presence !== null && !presence.isPresent;
|
|
22661
22675
|
if (isCurrent && previousState.current.wasCurrent === void 0) {
|
|
22662
22676
|
persistLayoutIdCache();
|
|
22663
22677
|
}
|
|
22664
|
-
(0,
|
|
22678
|
+
(0, react_86.useEffect)(() => {
|
|
22665
22679
|
if (isLayeredContainer || !animate3) {
|
|
22666
22680
|
return;
|
|
22667
22681
|
}
|
|
@@ -22875,7 +22889,7 @@ var NavigatorMock = class {
|
|
|
22875
22889
|
}
|
|
22876
22890
|
};
|
|
22877
22891
|
var navigatorMock = new NavigatorMock();
|
|
22878
|
-
var NavigationContext = (0,
|
|
22892
|
+
var NavigationContext = (0, react_95.createContext)(navigatorMock);
|
|
22879
22893
|
var TransitionDefaults = {
|
|
22880
22894
|
Fade: {
|
|
22881
22895
|
exit: { opacity: 0, },
|
|
@@ -23280,11 +23294,11 @@ function sequence(direction, transition, animation) {
|
|
|
23280
23294
|
}
|
|
23281
23295
|
var NavigationConsumer = NavigationContext.Consumer;
|
|
23282
23296
|
exports.NavigationConsumer = NavigationConsumer;
|
|
23283
|
-
var NavigationCallbackContext =
|
|
23297
|
+
var NavigationCallbackContext = react_84.default.createContext(void 0);
|
|
23284
23298
|
var NavigationCallbackProvider = NavigationCallbackContext.Provider;
|
|
23285
23299
|
exports.NavigationCallbackProvider = NavigationCallbackProvider;
|
|
23286
|
-
var IsInitialNavigationContext =
|
|
23287
|
-
var Navigation = class extends
|
|
23300
|
+
var IsInitialNavigationContext = react_84.default.createContext(void 0);
|
|
23301
|
+
var Navigation = class extends react_84.Component {
|
|
23288
23302
|
constructor(props) {
|
|
23289
23303
|
var _a;
|
|
23290
23304
|
super(props);
|
|
@@ -23698,7 +23712,7 @@ function containerIsVisible(containerIndex, stackState) {
|
|
|
23698
23712
|
return false;
|
|
23699
23713
|
}
|
|
23700
23714
|
function containerContent(item) {
|
|
23701
|
-
const content =
|
|
23715
|
+
const content = react_84.default.Children.map(item.component, (child) => {
|
|
23702
23716
|
var _f;
|
|
23703
23717
|
var _a;
|
|
23704
23718
|
if (!isReactChild(child) || !isReactElement(child) || !child.props) {
|
|
@@ -23729,7 +23743,7 @@ function containerContent(item) {
|
|
|
23729
23743
|
props.style.height = '100%';
|
|
23730
23744
|
}
|
|
23731
23745
|
}
|
|
23732
|
-
return
|
|
23746
|
+
return react_84.default.cloneElement(child, props);
|
|
23733
23747
|
});
|
|
23734
23748
|
return content;
|
|
23735
23749
|
}
|
|
@@ -23739,7 +23753,7 @@ function backdropTapAction(transition, goBackAction) {
|
|
|
23739
23753
|
}
|
|
23740
23754
|
}
|
|
23741
23755
|
function NavigationStyleSheet() {
|
|
23742
|
-
|
|
23756
|
+
react_84.default.useInsertionEffect(() => {
|
|
23743
23757
|
injectComponentCSSRules();
|
|
23744
23758
|
}, []);
|
|
23745
23759
|
return null;
|
|
@@ -23772,7 +23786,7 @@ var NavigationTransitionType = /* @__PURE__ */ ((NavigationTransitionType2) => {
|
|
|
23772
23786
|
})(NavigationTransitionType || {});
|
|
23773
23787
|
exports.NavigationTransitionType = NavigationTransitionType;
|
|
23774
23788
|
function WithNavigator(BaseComponent, navigationTransition, navigationTransitionDirection, NavigationTarget, navigationTransitionOptions) {
|
|
23775
|
-
const InternalWithNavigator = class extends
|
|
23789
|
+
const InternalWithNavigator = class extends react_96.default.Component {
|
|
23776
23790
|
render() {
|
|
23777
23791
|
return /* @__PURE__ */ (0, jsx_runtime_29.jsx)(NavigationContext.Consumer, {
|
|
23778
23792
|
children: (navigation) => {
|
|
@@ -23860,8 +23874,8 @@ function debounce(fn, time22) {
|
|
|
23860
23874
|
}
|
|
23861
23875
|
exports.debounce = debounce;
|
|
23862
23876
|
function useWheelScroll(ref, { enabled, initial, prev, direction, constraints, offsetX, offsetY, onScrollStart, onScroll, onScrollEnd, }) {
|
|
23863
|
-
const isWheelScrollActive = (0,
|
|
23864
|
-
const getPointData = (0,
|
|
23877
|
+
const isWheelScrollActive = (0, react_98.useRef)(false);
|
|
23878
|
+
const getPointData = (0, react_98.useCallback)(() => {
|
|
23865
23879
|
const point2 = getPoint(offsetX, offsetY);
|
|
23866
23880
|
const data2 = {
|
|
23867
23881
|
point: point2,
|
|
@@ -23962,11 +23976,11 @@ function useSafariGapFix(gap, ref, display) {
|
|
|
23962
23976
|
if (!requiresPolyfill) {
|
|
23963
23977
|
return void 0;
|
|
23964
23978
|
}
|
|
23965
|
-
const isInitialRender =
|
|
23966
|
-
const hasTriggeredReflow =
|
|
23967
|
-
const prevGapValue =
|
|
23979
|
+
const isInitialRender = react_100.default.useRef(true);
|
|
23980
|
+
const hasTriggeredReflow = react_100.default.useRef(false);
|
|
23981
|
+
const prevGapValue = react_100.default.useRef(gap);
|
|
23968
23982
|
hasTriggeredReflow.current = false;
|
|
23969
|
-
|
|
23983
|
+
react_100.default.useLayoutEffect(() => {
|
|
23970
23984
|
prevGapValue.current = gap;
|
|
23971
23985
|
if (isInitialRender.current) {
|
|
23972
23986
|
isInitialRender.current = false;
|
|
@@ -23977,7 +23991,7 @@ function useSafariGapFix(gap, ref, display) {
|
|
|
23977
23991
|
hasTriggeredReflow.current = true;
|
|
23978
23992
|
}
|
|
23979
23993
|
}, [gap, ref, prevGapValue, display,]);
|
|
23980
|
-
return
|
|
23994
|
+
return react_100.default.useCallback(() => {
|
|
23981
23995
|
if (prevGapValue.current === gap) {
|
|
23982
23996
|
return;
|
|
23983
23997
|
}
|
|
@@ -23988,11 +24002,11 @@ function useSafariGapFix(gap, ref, display) {
|
|
|
23988
24002
|
}, [gap, ref,]);
|
|
23989
24003
|
}
|
|
23990
24004
|
var Stack = /* @__PURE__ */ (() => {
|
|
23991
|
-
const StackInner =
|
|
24005
|
+
const StackInner = react_99.default.forwardRef(function StackInner2(stackProps, forwardedRef) {
|
|
23992
24006
|
var _f, _j;
|
|
23993
24007
|
const { as = 'div', direction = 'vertical', distribution = 'start', alignment = 'center', gap = 10, wrap: wrap2 = false, useFlexboxGap: externalUseFlexboxGap = true, children, style: styleProp, className, willChangeTransform, __fromCodeComponentNode, parentSize, __contentWrapperStyle } = stackProps, containerProps = __rest(stackProps, ["as", "direction", "distribution", "alignment", "gap", "wrap", "useFlexboxGap", "children", "style", "className", "willChangeTransform", "__fromCodeComponentNode", "parentSize", "__contentWrapperStyle"]);
|
|
23994
24008
|
const useFlexboxGap = Boolean(externalUseFlexboxGap || wrap2);
|
|
23995
|
-
const stackRef =
|
|
24009
|
+
const stackRef = react_99.default.useRef(null);
|
|
23996
24010
|
const onBeforeLayoutMeasure = useSafariGapFix(gap, stackRef, 'flex');
|
|
23997
24011
|
const flexDirection = toFlexDirection(direction);
|
|
23998
24012
|
const isReverse = isReverseDirection(flexDirection);
|
|
@@ -24115,7 +24129,7 @@ function fraction(dimension) {
|
|
|
24115
24129
|
}
|
|
24116
24130
|
exports.fraction = fraction;
|
|
24117
24131
|
function handleFraction(children, direction, widthType, heightType) {
|
|
24118
|
-
return
|
|
24132
|
+
return react_99.default.Children.map(children, (child) => {
|
|
24119
24133
|
if (!isReactChild(child) || !isReactElement(child)) {
|
|
24120
24134
|
return;
|
|
24121
24135
|
}
|
|
@@ -24175,7 +24189,7 @@ function handleFraction(children, direction, widthType, heightType) {
|
|
|
24175
24189
|
return child;
|
|
24176
24190
|
}
|
|
24177
24191
|
const nextStyle = Object.assign(Object.assign({}, propsStyle), style);
|
|
24178
|
-
return
|
|
24192
|
+
return react_99.default.cloneElement(child, {
|
|
24179
24193
|
width: newWidth,
|
|
24180
24194
|
height: newHeight,
|
|
24181
24195
|
style: nextStyle,
|
|
@@ -24308,12 +24322,12 @@ function PageContainer({ children, effect, dragEnabled, direction, contentHeight
|
|
|
24308
24322
|
}, effect ? Object.keys(effect).join('') : ''),
|
|
24309
24323
|
});
|
|
24310
24324
|
}
|
|
24311
|
-
var Page = /* @__PURE__ */
|
|
24325
|
+
var Page = /* @__PURE__ */ react_97.default.forwardRef(function Page2(props, forwardedRef) {
|
|
24312
24326
|
var _a;
|
|
24313
24327
|
const { direction = 'horizontal', contentWidth = 'stretch', contentHeight = 'stretch', alignment = 'start', currentPage = 0, animateCurrentPageUpdate = true, gap: gapValue = 10, padding = 0, momentum = false, dragEnabled = true, defaultEffect = 'none', background = 'transparent', overflow = 'hidden', __fromCodeComponentNode, effect, children, contentOffsetX, contentOffsetY, onChangePage, onScrollStart, onScroll, onDragStart, onDrag, onDragEnd, directionLock, onScrollEnd, onDirectionLock, onUpdate, wheelEnabled = false, layoutId: specificLayoutId } = props, rest = __rest(props, ["direction", "contentWidth", "contentHeight", "alignment", "currentPage", "animateCurrentPageUpdate", "gap", "padding", "momentum", "dragEnabled", "defaultEffect", "background", "overflow", "__fromCodeComponentNode", "effect", "children", "contentOffsetX", "contentOffsetY", "onChangePage", "onScrollStart", "onScroll", "onDragStart", "onDrag", "onDragEnd", "directionLock", "onScrollEnd", "onDirectionLock", "onUpdate", "wheelEnabled", "layoutId"]);
|
|
24314
24328
|
const layoutId = useLayoutId2(props, { specificLayoutId, postfix: 'page', });
|
|
24315
24329
|
const containerProps = Object.assign(Object.assign({}, rest), { background });
|
|
24316
|
-
const hasMountedRef =
|
|
24330
|
+
const hasMountedRef = react_97.default.useRef(false);
|
|
24317
24331
|
const hasFixedSize = RenderTarget.hasRestrictions() && props.__fromCodeComponentNode && isFiniteNumber(containerProps.width) &&
|
|
24318
24332
|
isFiniteNumber(containerProps.height);
|
|
24319
24333
|
if (!hasFixedSize && __fromCodeComponentNode && !containerProps.__fromCanvasComponent) {
|
|
@@ -24321,7 +24335,7 @@ var Page = /* @__PURE__ */ react_96.default.forwardRef(function Page2(props, for
|
|
|
24321
24335
|
containerProps.height = '100%';
|
|
24322
24336
|
containerProps._constraints = { enabled: true, };
|
|
24323
24337
|
}
|
|
24324
|
-
const { initial, prev, } =
|
|
24338
|
+
const { initial, prev, } = react_97.default.useRef({
|
|
24325
24339
|
initial: { x: 0, y: 0, },
|
|
24326
24340
|
prev: { x: 0, y: 0, },
|
|
24327
24341
|
}).current;
|
|
@@ -24331,41 +24345,41 @@ var Page = /* @__PURE__ */ react_96.default.forwardRef(function Page2(props, for
|
|
|
24331
24345
|
warnOnce2(`The 'gap' property of Page component can not be negative, but is ${gapValue}.`);
|
|
24332
24346
|
gap = 0;
|
|
24333
24347
|
}
|
|
24334
|
-
|
|
24348
|
+
react_97.default.useInsertionEffect(() => {
|
|
24335
24349
|
injectComponentCSSRules();
|
|
24336
24350
|
}, []);
|
|
24337
|
-
const pageCount =
|
|
24338
|
-
const maxOffsetRef =
|
|
24339
|
-
const constraints =
|
|
24340
|
-
const fallbackContainerRef =
|
|
24351
|
+
const pageCount = react_97.default.Children.count(children);
|
|
24352
|
+
const maxOffsetRef = react_97.default.useRef(0);
|
|
24353
|
+
const constraints = react_97.default.useRef({ top: 0, left: 0, right: 0, bottom: 0, });
|
|
24354
|
+
const fallbackContainerRef = react_97.default.useRef(null);
|
|
24341
24355
|
const containerRef = forwardedRef || fallbackContainerRef;
|
|
24342
|
-
const scrollableRef =
|
|
24343
|
-
const pageEffectValuesRef =
|
|
24344
|
-
const pageRectsRef =
|
|
24356
|
+
const scrollableRef = react_97.default.useRef(null);
|
|
24357
|
+
const pageEffectValuesRef = react_97.default.useRef([]);
|
|
24358
|
+
const pageRectsRef = react_97.default.useRef([]);
|
|
24345
24359
|
const internalX = useMotionValue(isMotionValue2(contentOffsetX) ? 0 : contentOffsetX !== null && contentOffsetX !== void 0 ? contentOffsetX : 0);
|
|
24346
24360
|
const internalY = useMotionValue(isMotionValue2(contentOffsetY) ? 0 : contentOffsetY !== null && contentOffsetY !== void 0 ? contentOffsetY : 0);
|
|
24347
|
-
const contentOffsetRef =
|
|
24361
|
+
const contentOffsetRef = react_97.default.useRef({
|
|
24348
24362
|
x: isMotionValue2(contentOffsetX) ? contentOffsetX : internalX,
|
|
24349
24363
|
y: isMotionValue2(contentOffsetY) ? contentOffsetY : internalY,
|
|
24350
24364
|
});
|
|
24351
|
-
const currentContentPageRef =
|
|
24352
|
-
const propsBoundedCurrentPageRef =
|
|
24353
|
-
const latestPropsRef =
|
|
24365
|
+
const currentContentPageRef = react_97.default.useRef(currentPage);
|
|
24366
|
+
const propsBoundedCurrentPageRef = react_97.default.useRef(currentPage);
|
|
24367
|
+
const latestPropsRef = react_97.default.useRef(props);
|
|
24354
24368
|
latestPropsRef.current = props;
|
|
24355
|
-
const lastDirectionRef =
|
|
24369
|
+
const lastDirectionRef = react_97.default.useRef(props.direction);
|
|
24356
24370
|
const snapToPage = useSnapToPage(currentContentPageRef, contentOffsetRef, isHorizontal);
|
|
24357
|
-
const [_, setForceUpdateCount,] =
|
|
24358
|
-
const containerSizeRef =
|
|
24371
|
+
const [_, setForceUpdateCount,] = react_97.default.useState(0);
|
|
24372
|
+
const containerSizeRef = react_97.default.useRef({ width: 200, height: 200, });
|
|
24359
24373
|
if (hasFixedSize && isFiniteNumber(containerProps.width) && isFiniteNumber(containerProps.height)) {
|
|
24360
24374
|
containerSizeRef.current.width = containerProps.width;
|
|
24361
24375
|
containerSizeRef.current.height = containerProps.height;
|
|
24362
24376
|
}
|
|
24363
|
-
const updateOnResize =
|
|
24377
|
+
const updateOnResize = react_97.default.useCallback(() => {
|
|
24364
24378
|
if (!hasFixedSize) {
|
|
24365
24379
|
setForceUpdateCount((v) => v + 1);
|
|
24366
24380
|
}
|
|
24367
24381
|
}, [hasFixedSize,]);
|
|
24368
|
-
|
|
24382
|
+
react_97.default.useEffect(() => {
|
|
24369
24383
|
if (RenderTarget.current() !== 'PREVIEW') {
|
|
24370
24384
|
return;
|
|
24371
24385
|
}
|
|
@@ -24447,7 +24461,7 @@ var Page = /* @__PURE__ */ react_96.default.forwardRef(function Page2(props, for
|
|
|
24447
24461
|
updateAndSnapToPage(currentContentPageRef.current, true);
|
|
24448
24462
|
});
|
|
24449
24463
|
}, []);
|
|
24450
|
-
|
|
24464
|
+
react_97.default.useEffect(() => {
|
|
24451
24465
|
if (currentPage !== currentContentPageRef.current) {
|
|
24452
24466
|
updateAndSnapToPage(currentPage);
|
|
24453
24467
|
}
|
|
@@ -24541,7 +24555,7 @@ var Page = /* @__PURE__ */ react_96.default.forwardRef(function Page2(props, for
|
|
|
24541
24555
|
});
|
|
24542
24556
|
});
|
|
24543
24557
|
pageEffectValuesRef.current = [];
|
|
24544
|
-
const childComponents =
|
|
24558
|
+
const childComponents = react_97.default.Children.map(children, (child, index) => {
|
|
24545
24559
|
var _f;
|
|
24546
24560
|
if (!isReactChild(child) || !isReactElement(child)) {
|
|
24547
24561
|
return child;
|
|
@@ -24597,7 +24611,7 @@ var Page = /* @__PURE__ */ react_96.default.forwardRef(function Page2(props, for
|
|
|
24597
24611
|
onDrag: onDragHandler,
|
|
24598
24612
|
onDragEnd: onDragEndHandler,
|
|
24599
24613
|
layoutId: layoutId ? `${layoutId}-${index}` : void 0,
|
|
24600
|
-
children:
|
|
24614
|
+
children: react_97.default.cloneElement(child, update),
|
|
24601
24615
|
}, index);
|
|
24602
24616
|
});
|
|
24603
24617
|
useWheelScroll(scrollableRef, {
|
|
@@ -25423,7 +25437,7 @@ var FramerEventSession = class {
|
|
|
25423
25437
|
}
|
|
25424
25438
|
};
|
|
25425
25439
|
exports.FramerEventSession = FramerEventSession;
|
|
25426
|
-
var MouseEventListener = class extends
|
|
25440
|
+
var MouseEventListener = class extends react_102.Component {
|
|
25427
25441
|
constructor() {
|
|
25428
25442
|
super(...arguments);
|
|
25429
25443
|
__publicField(this, 'domMouseDown', (originalEvent) => {
|
|
@@ -25475,7 +25489,7 @@ var MouseEventListener = class extends react_101.Component {
|
|
|
25475
25489
|
safeWindow.removeEventListener('wheel', this.domMouseWheel);
|
|
25476
25490
|
}
|
|
25477
25491
|
};
|
|
25478
|
-
var TouchEventListener = class extends
|
|
25492
|
+
var TouchEventListener = class extends react_103.Component {
|
|
25479
25493
|
constructor() {
|
|
25480
25494
|
super(...arguments);
|
|
25481
25495
|
__publicField(this, 'domTouchStart', (originalEvent) => {
|
|
@@ -25527,8 +25541,8 @@ function convertScrollDirectionToDrag(scrollDirection) {
|
|
|
25527
25541
|
return scrollDirection ? directionMap[scrollDirection] : scrollDirection;
|
|
25528
25542
|
}
|
|
25529
25543
|
var useUpdateChildSize = ({ dragDirection, children, fromCanvasComponent, }) => {
|
|
25530
|
-
return (0,
|
|
25531
|
-
return
|
|
25544
|
+
return (0, react_105.useMemo)(() => {
|
|
25545
|
+
return react_105.default.Children.map(children, (child) => {
|
|
25532
25546
|
if (child === null || typeof child !== 'object' || typeof child.type === 'string') {
|
|
25533
25547
|
return child;
|
|
25534
25548
|
}
|
|
@@ -25544,25 +25558,25 @@ var useUpdateChildSize = ({ dragDirection, children, fromCanvasComponent, }) =>
|
|
|
25544
25558
|
return child;
|
|
25545
25559
|
}
|
|
25546
25560
|
const update = fromCanvasComponent ? { style: Object.assign({}, child.props.style, updatedSize), } : updatedSize;
|
|
25547
|
-
return
|
|
25561
|
+
return react_105.default.cloneElement(child, update);
|
|
25548
25562
|
});
|
|
25549
25563
|
}, [dragDirection, children,]);
|
|
25550
25564
|
};
|
|
25551
25565
|
var numberFromOptionalMotionValue = (value) => {
|
|
25552
25566
|
return typeof value === 'number' ? value : value.get();
|
|
25553
25567
|
};
|
|
25554
|
-
var EmulatedScroll = /* @__PURE__ */
|
|
25568
|
+
var EmulatedScroll = /* @__PURE__ */ react_105.default.forwardRef(function EmulatedScroll2(props, forwardedRef) {
|
|
25555
25569
|
const { direction = 'vertical', directionLock = false, dragEnabled = true, dragElastic, dragMomentum, dragTransition, wheelEnabled = true, contentOffsetX = 0, contentOffsetY = 0, contentWidth, contentHeight, onScrollStart, onScroll, onScrollEnd, onDragStart, onDrag, onDragEnd, onUpdate, onDirectionLock, style, children, scrollAnimate, resetOffset, overdragEnabled = true, layoutId: specificLayoutId, native } = props, containerProps = __rest(props, ["direction", "directionLock", "dragEnabled", "dragElastic", "dragMomentum", "dragTransition", "wheelEnabled", "contentOffsetX", "contentOffsetY", "contentWidth", "contentHeight", "onScrollStart", "onScroll", "onScrollEnd", "onDragStart", "onDrag", "onDragEnd", "onUpdate", "onDirectionLock", "style", "children", "scrollAnimate", "resetOffset", "overdragEnabled", "layoutId", "native"]);
|
|
25556
25570
|
const layoutId = useLayoutId2(props, { specificLayoutId, postfix: 'scroll', });
|
|
25557
25571
|
const defaultX = useMotionValue(typeof contentOffsetX === 'number' ? contentOffsetX : 0);
|
|
25558
25572
|
const defaultY = useMotionValue(typeof contentOffsetY === 'number' ? contentOffsetY : 0);
|
|
25559
25573
|
const x = isMotionValue2(contentOffsetX) ? contentOffsetX : defaultX;
|
|
25560
25574
|
const y = isMotionValue2(contentOffsetY) ? contentOffsetY : defaultY;
|
|
25561
|
-
const measuredConstraints = (0,
|
|
25575
|
+
const measuredConstraints = (0, react_105.useRef)(null);
|
|
25562
25576
|
const dragControls = useDragControls();
|
|
25563
25577
|
const isInTarget = useIsInCurrentNavigationTarget();
|
|
25564
|
-
const wasInTargetRef = (0,
|
|
25565
|
-
(0,
|
|
25578
|
+
const wasInTargetRef = (0, react_105.useRef)(true);
|
|
25579
|
+
(0, react_105.useInsertionEffect)(() => {
|
|
25566
25580
|
injectComponentCSSRules();
|
|
25567
25581
|
}, []);
|
|
25568
25582
|
function setMeasureDragConstraints(constraints) {
|
|
@@ -25575,15 +25589,15 @@ var EmulatedScroll = /* @__PURE__ */ react_104.default.forwardRef(function Emula
|
|
|
25575
25589
|
}
|
|
25576
25590
|
return measuredConstraints.current = constraints;
|
|
25577
25591
|
}
|
|
25578
|
-
const { initial, prev, } = (0,
|
|
25592
|
+
const { initial, prev, } = (0, react_105.useRef)({
|
|
25579
25593
|
initial: { x: 0, y: 0, },
|
|
25580
25594
|
prev: { x: 0, y: 0, },
|
|
25581
25595
|
}).current;
|
|
25582
25596
|
const isPreview = RenderTarget.current() === 'PREVIEW';
|
|
25583
|
-
const containerFallbackRef = (0,
|
|
25597
|
+
const containerFallbackRef = (0, react_105.useRef)(null);
|
|
25584
25598
|
const containerRef = forwardedRef || containerFallbackRef;
|
|
25585
|
-
const contentRef = (0,
|
|
25586
|
-
const lastOffsetRef = (0,
|
|
25599
|
+
const contentRef = (0, react_105.useRef)(null);
|
|
25600
|
+
const lastOffsetRef = (0, react_105.useRef)(null);
|
|
25587
25601
|
function shouldResetScroll(inTarget) {
|
|
25588
25602
|
const hasEnteredTarget = inTarget && wasInTargetRef.current === false;
|
|
25589
25603
|
return resetOffset && hasEnteredTarget;
|
|
@@ -25636,7 +25650,7 @@ var EmulatedScroll = /* @__PURE__ */ react_104.default.forwardRef(function Emula
|
|
|
25636
25650
|
}
|
|
25637
25651
|
measureAndUpdateScrollOffset();
|
|
25638
25652
|
}, []);
|
|
25639
|
-
|
|
25653
|
+
react_105.default.useEffect(() => {
|
|
25640
25654
|
if (shouldResetScroll(isInTarget)) {
|
|
25641
25655
|
measureAndUpdateScrollOffset();
|
|
25642
25656
|
}
|
|
@@ -25645,14 +25659,14 @@ var EmulatedScroll = /* @__PURE__ */ react_104.default.forwardRef(function Emula
|
|
|
25645
25659
|
}
|
|
25646
25660
|
}, [isInTarget,]);
|
|
25647
25661
|
const getLatestPoint = () => ({ x: x.get(), y: y.get(), });
|
|
25648
|
-
const resetInitialPoint = (0,
|
|
25662
|
+
const resetInitialPoint = (0, react_105.useCallback)(() => {
|
|
25649
25663
|
const point2 = getLatestPoint();
|
|
25650
25664
|
initial.x = point2.x;
|
|
25651
25665
|
initial.y = point2.y;
|
|
25652
25666
|
prev.x = point2.x;
|
|
25653
25667
|
prev.y = point2.y;
|
|
25654
25668
|
}, []);
|
|
25655
|
-
const getPointData = (0,
|
|
25669
|
+
const getPointData = (0, react_105.useCallback)(() => {
|
|
25656
25670
|
const point2 = getLatestPoint();
|
|
25657
25671
|
const data2 = {
|
|
25658
25672
|
point: point2,
|
|
@@ -25664,11 +25678,11 @@ var EmulatedScroll = /* @__PURE__ */ react_104.default.forwardRef(function Emula
|
|
|
25664
25678
|
prev.y = point2.y;
|
|
25665
25679
|
return data2;
|
|
25666
25680
|
}, [x, y,]);
|
|
25667
|
-
const updateScrollListeners = (0,
|
|
25681
|
+
const updateScrollListeners = (0, react_105.useCallback)(() => {
|
|
25668
25682
|
onUpdate && onUpdate({ x: x.get(), y: y.get(), });
|
|
25669
25683
|
onScroll && onScroll(getPointData());
|
|
25670
25684
|
}, [onScroll, onUpdate, getPointData, x, y,]);
|
|
25671
|
-
const scheduleUpdateScrollListeners = (0,
|
|
25685
|
+
const scheduleUpdateScrollListeners = (0, react_105.useCallback)(() => {
|
|
25672
25686
|
frame.update(updateScrollListeners, false, true);
|
|
25673
25687
|
}, [updateScrollListeners,]);
|
|
25674
25688
|
const onMotionDragStart = (event, info) => {
|
|
@@ -25746,7 +25760,7 @@ var EmulatedScroll = /* @__PURE__ */ react_104.default.forwardRef(function Emula
|
|
|
25746
25760
|
}
|
|
25747
25761
|
return y.on('change', setScrollY);
|
|
25748
25762
|
}, [y, overdragY, scheduleUpdateScrollListeners, overdragEnabled,]);
|
|
25749
|
-
const nativeOnScroll =
|
|
25763
|
+
const nativeOnScroll = react_105.default.useCallback(() => {
|
|
25750
25764
|
const element = containerRef.current;
|
|
25751
25765
|
if (!(element instanceof HTMLDivElement)) {
|
|
25752
25766
|
return;
|
|
@@ -25760,7 +25774,7 @@ var EmulatedScroll = /* @__PURE__ */ react_104.default.forwardRef(function Emula
|
|
|
25760
25774
|
y.set(-element.scrollTop);
|
|
25761
25775
|
}
|
|
25762
25776
|
}, [x, y,]);
|
|
25763
|
-
const isEmpty2 =
|
|
25777
|
+
const isEmpty2 = react_105.default.Children.count(children) === 0;
|
|
25764
25778
|
const width = direction !== 'vertical' && !isEmpty2 ? 'auto' : '100%';
|
|
25765
25779
|
const height = direction !== 'horizontal' && !isEmpty2 ? 'auto' : '100%';
|
|
25766
25780
|
const size2 = !containerProps.__fromCanvasComponent
|
|
@@ -25989,8 +26003,8 @@ function useEmulateTouchScroll(ref, direction, enabled) {
|
|
|
25989
26003
|
if (RenderTarget.current() !== 'PREVIEW') {
|
|
25990
26004
|
return emptyObject;
|
|
25991
26005
|
}
|
|
25992
|
-
const scrollAnimationControlsRef =
|
|
25993
|
-
(0,
|
|
26006
|
+
const scrollAnimationControlsRef = react_107.default.useRef(null);
|
|
26007
|
+
(0, react_107.useEffect)(() => {
|
|
25994
26008
|
if (!ref.current) {
|
|
25995
26009
|
return;
|
|
25996
26010
|
}
|
|
@@ -26144,7 +26158,7 @@ function useEmulateTouchScroll(ref, direction, enabled) {
|
|
|
26144
26158
|
(_a = scrollAnimationControlsRef.current) == null ? void 0 : _a.stop();
|
|
26145
26159
|
};
|
|
26146
26160
|
}, [ref, direction, enabled,]);
|
|
26147
|
-
return
|
|
26161
|
+
return react_107.default.useMemo(() => {
|
|
26148
26162
|
return {
|
|
26149
26163
|
cancelEmulatedTouchScrollAnimation: () => {
|
|
26150
26164
|
var _a;
|
|
@@ -26203,21 +26217,21 @@ function useUpdateScrollOffset(ref, side, offset, cancelEmulatedTouchScrollAnima
|
|
|
26203
26217
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
26204
26218
|
[offset,]);
|
|
26205
26219
|
}
|
|
26206
|
-
var NativeScroll = /* @__PURE__ */
|
|
26220
|
+
var NativeScroll = /* @__PURE__ */ react_106.default.forwardRef(function NativeScroll2(props, forwardedRef) {
|
|
26207
26221
|
const { direction = 'vertical', scrollBarVisible = false, dragEnabled = true, contentOffsetX = 0, contentOffsetY = 0, contentWidth, contentHeight, children, resetOffset, onScroll, className,
|
|
26208
26222
|
// Not (yet) supported
|
|
26209
26223
|
directionLock = false, wheelEnabled = true, scrollAnimate, dragTransition, dragMomentum, dragElastic, overdragEnabled = true, onScrollStart, onScrollEnd, onDragStart, onDrag, onDragEnd, onUpdate, onDirectionLock, layoutId: specificLayoutId, native } = props,
|
|
26210
26224
|
// Rest
|
|
26211
26225
|
containerProps = __rest(props, ["direction", "scrollBarVisible", "dragEnabled", "contentOffsetX", "contentOffsetY", "contentWidth", "contentHeight", "children", "resetOffset", "onScroll", "className", "directionLock", "wheelEnabled", "scrollAnimate", "dragTransition", "dragMomentum", "dragElastic", "overdragEnabled", "onScrollStart", "onScrollEnd", "onDragStart", "onDrag", "onDragEnd", "onUpdate", "onDirectionLock", "layoutId", "native"]);
|
|
26212
26226
|
const layoutId = useLayoutId2(props, { specificLayoutId, postfix: 'scroll', });
|
|
26213
|
-
const fallbackRef =
|
|
26227
|
+
const fallbackRef = react_106.default.useRef(null);
|
|
26214
26228
|
const ref = forwardedRef || fallbackRef;
|
|
26215
26229
|
const { cancelEmulatedTouchScrollAnimation, } = useEmulateTouchScroll(ref, direction, dragEnabled);
|
|
26216
|
-
(0,
|
|
26230
|
+
(0, react_106.useInsertionEffect)(() => {
|
|
26217
26231
|
injectComponentCSSRules();
|
|
26218
26232
|
}, []);
|
|
26219
26233
|
const isInTarget = useIsInCurrentNavigationTarget();
|
|
26220
|
-
const previousIsInTargetRef =
|
|
26234
|
+
const previousIsInTargetRef = react_106.default.useRef(isInTarget);
|
|
26221
26235
|
const updateScrollOffsetHandler = () => {
|
|
26222
26236
|
if (!resetOffset) {
|
|
26223
26237
|
return;
|
|
@@ -26266,7 +26280,7 @@ var NativeScroll = /* @__PURE__ */ react_105.default.forwardRef(function NativeS
|
|
|
26266
26280
|
] }));
|
|
26267
26281
|
});
|
|
26268
26282
|
var Scroll = /* @__PURE__ */ (() => {
|
|
26269
|
-
const ScrollInner =
|
|
26283
|
+
const ScrollInner = react_104.default.forwardRef(function ScrollInner2(props, forwardedRef) {
|
|
26270
26284
|
if (props.native) {
|
|
26271
26285
|
return /* @__PURE__ */ (0, jsx_runtime_36.jsx)(NativeScroll, Object.assign({ ref: forwardedRef }, props));
|
|
26272
26286
|
}
|
|
@@ -26356,7 +26370,7 @@ var Scroll = /* @__PURE__ */ (() => {
|
|
|
26356
26370
|
})();
|
|
26357
26371
|
exports.Scroll = Scroll;
|
|
26358
26372
|
function useNavigation() {
|
|
26359
|
-
return (0,
|
|
26373
|
+
return (0, react_108.useContext)(NavigationContext);
|
|
26360
26374
|
}
|
|
26361
26375
|
exports.useNavigation = useNavigation;
|
|
26362
26376
|
var data = /* @__PURE__ */ (() => {
|
|
@@ -26425,22 +26439,22 @@ function createStore(initialState2, unboundActions) {
|
|
|
26425
26439
|
};
|
|
26426
26440
|
}
|
|
26427
26441
|
var defaultId = /* @__PURE__ */ Symbol('default');
|
|
26428
|
-
var DataContext = /* @__PURE__ */ (0,
|
|
26442
|
+
var DataContext = /* @__PURE__ */ (0, react_109.createContext)(defaultId);
|
|
26429
26443
|
exports.DataContext = DataContext;
|
|
26430
26444
|
function createData(defaultState2, actions) {
|
|
26431
26445
|
const stores = /* @__PURE__ */ new Map();
|
|
26432
26446
|
const useData2 = (id3, initialState2) => {
|
|
26433
|
-
const contextId = (0,
|
|
26447
|
+
const contextId = (0, react_109.useContext)(DataContext);
|
|
26434
26448
|
id3 = id3 || contextId;
|
|
26435
|
-
const store = (0,
|
|
26449
|
+
const store = (0, react_109.useMemo)(() => {
|
|
26436
26450
|
if (!stores.has(id3)) {
|
|
26437
26451
|
stores.set(id3, createStore(initialState2 || defaultState2, actions));
|
|
26438
26452
|
}
|
|
26439
26453
|
return stores.get(id3);
|
|
26440
26454
|
}, [id3,]);
|
|
26441
|
-
const [, notifyUpdates,] = (0,
|
|
26442
|
-
const storeValueAtHookCallTime = (0,
|
|
26443
|
-
(0,
|
|
26455
|
+
const [, notifyUpdates,] = (0, react_109.useState)(store.getVersion());
|
|
26456
|
+
const storeValueAtHookCallTime = (0, react_109.useMemo)(() => store.get(), [store,]);
|
|
26457
|
+
(0, react_109.useEffect)(() => {
|
|
26444
26458
|
const unsubscribe = store.subscribe(notifyUpdates);
|
|
26445
26459
|
if (storeValueAtHookCallTime !== store.get()) {
|
|
26446
26460
|
notifyUpdates(store.getVersion());
|
|
@@ -26453,14 +26467,14 @@ function createData(defaultState2, actions) {
|
|
|
26453
26467
|
}
|
|
26454
26468
|
exports.createData = createData;
|
|
26455
26469
|
var initialState = { update: 0, };
|
|
26456
|
-
var DataObserverContext = /* @__PURE__ */
|
|
26470
|
+
var DataObserverContext = /* @__PURE__ */ react_110.default.createContext({ update: NaN, });
|
|
26457
26471
|
exports.DataObserverContext = DataObserverContext;
|
|
26458
26472
|
function useObserveData() {
|
|
26459
|
-
const context =
|
|
26473
|
+
const context = react_110.default.useContext(DataObserverContext);
|
|
26460
26474
|
return !isNaN(context.update);
|
|
26461
26475
|
}
|
|
26462
26476
|
exports.useObserveData = useObserveData;
|
|
26463
|
-
var DataObserver = class extends
|
|
26477
|
+
var DataObserver = class extends react_110.Component {
|
|
26464
26478
|
constructor() {
|
|
26465
26479
|
super(...arguments);
|
|
26466
26480
|
__publicField(this, 'observers', []);
|
|
@@ -26528,7 +26542,7 @@ function WithOverride(Component15, override) {
|
|
|
26528
26542
|
? (props) => override(convertColorProps(props))
|
|
26529
26543
|
: () => convertColorProps(override);
|
|
26530
26544
|
const ComponentWithOverride = function (props) {
|
|
26531
|
-
(0,
|
|
26545
|
+
(0, react_111.useContext)(DataObserverContext);
|
|
26532
26546
|
const overrideProps = useOverride(props);
|
|
26533
26547
|
const { style } = props, rest = __rest(props, ["style"]);
|
|
26534
26548
|
return /* @__PURE__ */ (0, jsx_runtime_38.jsx)(Component15, Object.assign(Object.assign(Object.assign({}, rest), overrideProps), { _initialStyle: style }));
|
|
@@ -26606,7 +26620,7 @@ function isFXValuesKey(key7) {
|
|
|
26606
26620
|
}
|
|
26607
26621
|
function useFXValues(values, enabled) {
|
|
26608
26622
|
const effect = useConstant2(() => ({ values: makeFXValues(enabled ? values : void 0), }));
|
|
26609
|
-
|
|
26623
|
+
react_113.default.useEffect(() => {
|
|
26610
26624
|
if (enabled) {
|
|
26611
26625
|
return;
|
|
26612
26626
|
}
|
|
@@ -26628,8 +26642,8 @@ var loopOptionsKeys = /* @__PURE__ */ new Set([
|
|
|
26628
26642
|
'loopRepeatDelay',
|
|
26629
26643
|
]);
|
|
26630
26644
|
var useDelay = () => {
|
|
26631
|
-
const timeoutRef = (0,
|
|
26632
|
-
(0,
|
|
26645
|
+
const timeoutRef = (0, react_114.useRef)();
|
|
26646
|
+
(0, react_114.useEffect)(() => {
|
|
26633
26647
|
return () => {
|
|
26634
26648
|
clearTimeout(timeoutRef.current);
|
|
26635
26649
|
};
|
|
@@ -26645,7 +26659,7 @@ var useDelay = () => {
|
|
|
26645
26659
|
function useLoop({ loopEffectEnabled, loopRepeatDelay, loopTransition, loopRepeatType, loop, }) {
|
|
26646
26660
|
const shouldReduceMotion = useReducedMotionConfig();
|
|
26647
26661
|
const effect = useConstant2(() => ({ values: makeFXValues(), }));
|
|
26648
|
-
const mirrorStateRef =
|
|
26662
|
+
const mirrorStateRef = react_114.default.useRef(false);
|
|
26649
26663
|
const delay2 = useDelay();
|
|
26650
26664
|
const animateValues = () => __awaiter(this, void 0, void 0, function* () {
|
|
26651
26665
|
if (!loop) {
|
|
@@ -26677,7 +26691,7 @@ function useLoop({ loopEffectEnabled, loopRepeatDelay, loopTransition, loopRepea
|
|
|
26677
26691
|
yield delay2(loopRepeatDelay !== null && loopRepeatDelay !== void 0 ? loopRepeatDelay : 0);
|
|
26678
26692
|
yield start();
|
|
26679
26693
|
});
|
|
26680
|
-
const stop = (0,
|
|
26694
|
+
const stop = (0, react_114.useCallback)(() => {
|
|
26681
26695
|
effectValuesKeys.forEach((key7) => {
|
|
26682
26696
|
effect.values[key7].stop();
|
|
26683
26697
|
});
|
|
@@ -26686,7 +26700,7 @@ function useLoop({ loopEffectEnabled, loopRepeatDelay, loopTransition, loopRepea
|
|
|
26686
26700
|
});
|
|
26687
26701
|
mirrorStateRef.current = false;
|
|
26688
26702
|
}, [effect,]);
|
|
26689
|
-
|
|
26703
|
+
react_114.default.useEffect(() => {
|
|
26690
26704
|
if (loopEffectEnabled && loop) {
|
|
26691
26705
|
start();
|
|
26692
26706
|
}
|
|
@@ -26711,9 +26725,9 @@ var parallaxOptionsKeys = /* @__PURE__ */ new Set([
|
|
|
26711
26725
|
]);
|
|
26712
26726
|
function useParallax(options, ref, visibilityStyle) {
|
|
26713
26727
|
const { speed = 100, offset = 0, adjustPosition = false, parallaxTransformEnabled, } = options;
|
|
26714
|
-
const originalPosition =
|
|
26728
|
+
const originalPosition = react_115.default.useRef(null);
|
|
26715
26729
|
const shouldReduceMotion = useReducedMotionConfig();
|
|
26716
|
-
const transform2 =
|
|
26730
|
+
const transform2 = react_115.default.useCallback((yValue) => {
|
|
26717
26731
|
if (originalPosition.current === null) {
|
|
26718
26732
|
return 0;
|
|
26719
26733
|
}
|
|
@@ -26722,7 +26736,7 @@ function useParallax(options, ref, visibilityStyle) {
|
|
|
26722
26736
|
}
|
|
26723
26737
|
return parallaxTransform(yValue, originalPosition.current, speed, offset, adjustPosition);
|
|
26724
26738
|
}, [originalPosition, speed, offset, adjustPosition,]);
|
|
26725
|
-
|
|
26739
|
+
react_115.default.useLayoutEffect(() => {
|
|
26726
26740
|
frame.read(() => {
|
|
26727
26741
|
var _f;
|
|
26728
26742
|
var _a, _b;
|
|
@@ -26756,7 +26770,7 @@ function getTransition(value) {
|
|
|
26756
26770
|
}
|
|
26757
26771
|
return value == null ? void 0 : value.transition;
|
|
26758
26772
|
}
|
|
26759
|
-
function runEffectAnimation(target, effect, shouldReduceMotion, ref, appearId) {
|
|
26773
|
+
function runEffectAnimation(target, effect, shouldReduceMotion, ref, appearId, instant) {
|
|
26760
26774
|
return __awaiter(this, void 0, void 0, function* () {
|
|
26761
26775
|
const transition = getTransition(target);
|
|
26762
26776
|
return Promise.all(effectValuesKeys.map((key7) => {
|
|
@@ -26783,8 +26797,12 @@ function runEffectAnimation(target, effect, shouldReduceMotion, ref, appearId) {
|
|
|
26783
26797
|
elapsed: safeWindow.HandoffAppearAnimations(appearId, key7, motionValue2, frame),
|
|
26784
26798
|
}
|
|
26785
26799
|
: void 0;
|
|
26786
|
-
|
|
26787
|
-
|
|
26800
|
+
if (instant) {
|
|
26801
|
+
motionValue2.set(value);
|
|
26802
|
+
}
|
|
26803
|
+
else {
|
|
26804
|
+
animate(motionValue2, value, Object.assign(Object.assign(Object.assign(Object.assign({}, transition), { velocity: 0, elapsed: 0 }), handoff), { onComplete: () => resolve() }));
|
|
26805
|
+
}
|
|
26788
26806
|
});
|
|
26789
26807
|
}));
|
|
26790
26808
|
});
|
|
@@ -26794,21 +26812,14 @@ var presenceOptionsKeys = /* @__PURE__ */ new Set([
|
|
|
26794
26812
|
'presenceAnimate',
|
|
26795
26813
|
'presenceExit',
|
|
26796
26814
|
]);
|
|
26797
|
-
function getVisualElementBase(visualElement, style) {
|
|
26798
|
-
const ctx = visualElement.getVariantContext();
|
|
26799
|
-
const base = Object.assign({}, style);
|
|
26800
|
-
if (Array.isArray(ctx == null ? void 0 : ctx.animate)) {
|
|
26801
|
-
for (const variant of ctx.animate) {
|
|
26802
|
-
Object.assign(base, visualElement.getVariant(variant));
|
|
26803
|
-
}
|
|
26804
|
-
}
|
|
26805
|
-
return base;
|
|
26806
|
-
}
|
|
26807
26815
|
function usePresenceAnimation({ initial: motionInitial, animate: motionAnimate, exit: motionExit, presenceInitial, presenceAnimate, presenceExit, }, ref, enabled, style, appearId) {
|
|
26808
26816
|
const initial = presenceInitial !== null && presenceInitial !== void 0 ? presenceInitial : motionInitial;
|
|
26809
26817
|
const animateConfig = presenceAnimate !== null && presenceAnimate !== void 0 ? presenceAnimate : motionAnimate;
|
|
26810
26818
|
const exit = presenceExit !== null && presenceExit !== void 0 ? presenceExit : motionExit;
|
|
26811
|
-
const hasMounted = (0,
|
|
26819
|
+
const hasMounted = (0, react_116.useRef)(false);
|
|
26820
|
+
const lastAnimate = (0, react_116.useRef)(animateConfig);
|
|
26821
|
+
const [isPresent2, safeToRemove,] = usePresence();
|
|
26822
|
+
const lastPresence = (0, react_116.useRef)(false);
|
|
26812
26823
|
const effect = useConstant2(() => {
|
|
26813
26824
|
var _a;
|
|
26814
26825
|
const base = initial !== null && initial !== void 0 ? initial : style;
|
|
@@ -26825,45 +26836,54 @@ function usePresenceAnimation({ initial: motionInitial, animate: motionAnimate,
|
|
|
26825
26836
|
}
|
|
26826
26837
|
return { values: makeFXValues(defaults), };
|
|
26827
26838
|
});
|
|
26828
|
-
|
|
26829
|
-
|
|
26830
|
-
(0, react_115.useLayoutEffect)(() => {
|
|
26831
|
-
hasMounted.current = true;
|
|
26832
|
-
if (!enabled) {
|
|
26833
|
-
safeToRemove == null ? void 0 : safeToRemove();
|
|
26834
|
-
return;
|
|
26835
|
-
}
|
|
26836
|
-
if (isPresent2) {
|
|
26837
|
-
if (initial && animateConfig) {
|
|
26838
|
-
runEffectAnimation(animateConfig, effect, shouldReduceMotion, ref, appearId);
|
|
26839
|
-
}
|
|
26840
|
-
}
|
|
26841
|
-
else {
|
|
26842
|
-
if (exit) {
|
|
26843
|
-
runEffectAnimation(exit, effect, shouldReduceMotion, ref).then(() => safeToRemove());
|
|
26844
|
-
}
|
|
26845
|
-
else {
|
|
26846
|
-
safeToRemove();
|
|
26847
|
-
}
|
|
26848
|
-
}
|
|
26849
|
-
}, [isPresent2,]);
|
|
26850
|
-
(0, react_115.useLayoutEffect)(() => {
|
|
26851
|
-
if (!hasMounted.current) {
|
|
26839
|
+
(0, react_116.useLayoutEffect)(() => {
|
|
26840
|
+
if (hasMounted.current && animateConfig) {
|
|
26852
26841
|
return;
|
|
26853
26842
|
}
|
|
26854
26843
|
const visualElement = visualElementStore.get(ref.current);
|
|
26855
26844
|
if (!visualElement) {
|
|
26856
26845
|
return;
|
|
26857
26846
|
}
|
|
26858
|
-
|
|
26847
|
+
hasMounted.current = true;
|
|
26859
26848
|
for (const key7 in effect.values) {
|
|
26860
26849
|
if (!isFXValuesKey(key7)) {
|
|
26861
26850
|
continue;
|
|
26862
26851
|
}
|
|
26863
|
-
const value =
|
|
26852
|
+
const value = style == null ? void 0 : style[key7];
|
|
26864
26853
|
visualElement.setBaseTarget(key7, isNumber2(value) ? value : defaultFXValues[key7]);
|
|
26865
26854
|
}
|
|
26866
|
-
}, [
|
|
26855
|
+
}, [animateConfig,]);
|
|
26856
|
+
const shouldReduceMotion = useReducedMotionConfig();
|
|
26857
|
+
(0, react_116.useLayoutEffect)(() => {
|
|
26858
|
+
if (!enabled) {
|
|
26859
|
+
safeToRemove == null ? void 0 : safeToRemove();
|
|
26860
|
+
return;
|
|
26861
|
+
}
|
|
26862
|
+
if (isPresent2 !== lastPresence.current) {
|
|
26863
|
+
lastPresence.current = isPresent2;
|
|
26864
|
+
if (isPresent2) {
|
|
26865
|
+
if (initial && animateConfig) {
|
|
26866
|
+
runEffectAnimation(animateConfig, effect, shouldReduceMotion, ref, appearId);
|
|
26867
|
+
}
|
|
26868
|
+
}
|
|
26869
|
+
else {
|
|
26870
|
+
if (exit) {
|
|
26871
|
+
runEffectAnimation(exit, effect, shouldReduceMotion, ref, appearId).then(() => safeToRemove());
|
|
26872
|
+
}
|
|
26873
|
+
else {
|
|
26874
|
+
safeToRemove();
|
|
26875
|
+
}
|
|
26876
|
+
}
|
|
26877
|
+
}
|
|
26878
|
+
else {
|
|
26879
|
+
const hasAnimateChanged = !isEqual(animateConfig, lastAnimate.current);
|
|
26880
|
+
if (!hasAnimateChanged || !animateConfig) {
|
|
26881
|
+
return;
|
|
26882
|
+
}
|
|
26883
|
+
lastAnimate.current = animateConfig;
|
|
26884
|
+
runEffectAnimation(animateConfig, effect, shouldReduceMotion, ref, appearId, true);
|
|
26885
|
+
}
|
|
26886
|
+
});
|
|
26867
26887
|
return effect;
|
|
26868
26888
|
}
|
|
26869
26889
|
function calcOffsetTop(element, container) {
|
|
@@ -26910,7 +26930,7 @@ var scrollDirectionThreshold = 4;
|
|
|
26910
26930
|
function useScrollDirectionChange(scrollDirection, cb, options = {}) {
|
|
26911
26931
|
const { direction, target, } = scrollDirection !== null && scrollDirection !== void 0 ? scrollDirection : {};
|
|
26912
26932
|
const { repeat = true, enabled = true, } = options;
|
|
26913
|
-
|
|
26933
|
+
react_118.default.useEffect(() => {
|
|
26914
26934
|
if (!direction || !enabled) {
|
|
26915
26935
|
return;
|
|
26916
26936
|
}
|
|
@@ -27014,7 +27034,7 @@ function makeStyle(defaults) {
|
|
|
27014
27034
|
}
|
|
27015
27035
|
function useAnimationVariants(_f) {
|
|
27016
27036
|
var { opacity, targetOpacity, perspective: transformPerspective, enter, exit, animate: animateVariant2 } = _f, defaultStyles = __rest(_f, ["opacity", "targetOpacity", "perspective", "enter", "exit", "animate"]);
|
|
27017
|
-
return
|
|
27037
|
+
return react_117.default.useMemo(() => {
|
|
27018
27038
|
var _f;
|
|
27019
27039
|
return ({
|
|
27020
27040
|
initial: enter !== null && enter !== void 0 ? enter : makeStyle(Object.assign(Object.assign({}, defaultStyles), { opacity: (_f = opacity !== null && opacity !== void 0 ? opacity : targetOpacity) !== null && _f !== void 0 ? _f : 1, transformPerspective })),
|
|
@@ -27030,13 +27050,13 @@ function useStyleAppearEffect(options, ref) {
|
|
|
27030
27050
|
const variants = useAnimationVariants(options);
|
|
27031
27051
|
const enabled = options.styleAppearEffectEnabled;
|
|
27032
27052
|
const effect = useFXValues(enabled ? variants.initial : variants.animate, enabled);
|
|
27033
|
-
const playState =
|
|
27053
|
+
const playState = react_117.default.useRef({
|
|
27034
27054
|
isPlaying: false,
|
|
27035
27055
|
scheduledAppearState: void 0,
|
|
27036
27056
|
lastAppearState: !options.styleAppearEffectEnabled,
|
|
27037
27057
|
});
|
|
27038
|
-
const animation =
|
|
27039
|
-
const runAnimation =
|
|
27058
|
+
const animation = react_117.default.useRef();
|
|
27059
|
+
const runAnimation = react_117.default.useCallback((_f, fromInitial) => __awaiter(this, void 0, void 0, function* () {
|
|
27040
27060
|
var _j;
|
|
27041
27061
|
var { transition } = _f, target = __rest(_f, ["transition"]);
|
|
27042
27062
|
const transitionWithFallback = (_j = transition !== null && transition !== void 0 ? transition : variants.animate.transition) !== null && _j !== void 0 ? _j : options.transition;
|
|
@@ -27088,7 +27108,7 @@ function useStyleAppearEffect(options, ref) {
|
|
|
27088
27108
|
},
|
|
27089
27109
|
});
|
|
27090
27110
|
const animateWithScrollInfo = options.targets && enabled && !options.scrollDirection;
|
|
27091
|
-
|
|
27111
|
+
react_117.default.useEffect(() => {
|
|
27092
27112
|
if (!animateWithScrollInfo) {
|
|
27093
27113
|
return;
|
|
27094
27114
|
}
|
|
@@ -27155,8 +27175,8 @@ var defaultRanges2 = () => ({
|
|
|
27155
27175
|
transformPerspective: [],
|
|
27156
27176
|
});
|
|
27157
27177
|
function useAttachOptionalSpring(values, spring2) {
|
|
27158
|
-
const springs =
|
|
27159
|
-
|
|
27178
|
+
const springs = react_119.default.useRef({});
|
|
27179
|
+
react_119.default.useEffect(() => {
|
|
27160
27180
|
if (spring2 === void 0) {
|
|
27161
27181
|
return;
|
|
27162
27182
|
}
|
|
@@ -27208,7 +27228,7 @@ var pageInputRange = [0, 1,];
|
|
|
27208
27228
|
function useStyleTransform({ transformTrigger, styleTransformEffectEnabled, transformTargets, spring: spring2, transformViewportThreshold = 0, }, ref) {
|
|
27209
27229
|
const shouldReduceMotion = useReducedMotionConfig();
|
|
27210
27230
|
const effect = useFXValues(defaultValues(transformTargets, shouldReduceMotion), styleTransformEffectEnabled);
|
|
27211
|
-
|
|
27231
|
+
react_119.default.useLayoutEffect(() => {
|
|
27212
27232
|
var _f;
|
|
27213
27233
|
if (!styleTransformEffectEnabled || !transformTargets) {
|
|
27214
27234
|
return;
|
|
@@ -27331,7 +27351,7 @@ function addMotionValueStyle(style, values) {
|
|
|
27331
27351
|
function isVariantOrVariantList(value) {
|
|
27332
27352
|
return isString22(value) || Array.isArray(value);
|
|
27333
27353
|
}
|
|
27334
|
-
var withFX = (Component15) =>
|
|
27354
|
+
var withFX = (Component15) => react_112.default.forwardRef((props, forwardedRef) => {
|
|
27335
27355
|
if (props.__withFX) {
|
|
27336
27356
|
return /* @__PURE__ */ (0, jsx_runtime_39.jsx)(Component15, Object.assign(Object.assign({}, props), { animate: void 0, initial: void 0, exit: void 0, ref: forwardedRef }));
|
|
27337
27357
|
}
|
|
@@ -27340,7 +27360,7 @@ var withFX = (Component15) => react_111.default.forwardRef((props, forwardedRef)
|
|
|
27340
27360
|
const initial2 = isVariantOrVariantList(props.initial) ? props.initial : void 0;
|
|
27341
27361
|
return /* @__PURE__ */ (0, jsx_runtime_39.jsx)(Component15, Object.assign(Object.assign({}, props), { animate: animate4, initial: initial2, exit: void 0, ref: forwardedRef }));
|
|
27342
27362
|
}
|
|
27343
|
-
const fallbackRef =
|
|
27363
|
+
const fallbackRef = react_112.default.useRef(null);
|
|
27344
27364
|
const ref = forwardedRef !== null && forwardedRef !== void 0 ? forwardedRef : fallbackRef;
|
|
27345
27365
|
const { parallax = {}, styleAppear = {}, styleTransform = {}, presence = {}, loop = {}, forwardedProps, } = extractFXOptions(props);
|
|
27346
27366
|
const { __targetOpacity: targetOpacityValue, __perspectiveFX: withPerspective, __smartComponentFX: inSmartComponent = false, } = props;
|
|
@@ -27350,7 +27370,7 @@ var withFX = (Component15) => react_111.default.forwardRef((props, forwardedRef)
|
|
|
27350
27370
|
const { values: transformValues2, } = useStyleTransform(styleTransform, ref);
|
|
27351
27371
|
const { values: appearEffectValues, } = useStyleAppearEffect(styleAppear, ref);
|
|
27352
27372
|
const { values: loopValues, } = useLoop(loop);
|
|
27353
|
-
const fxValues =
|
|
27373
|
+
const fxValues = react_112.default.useMemo(() => {
|
|
27354
27374
|
return {
|
|
27355
27375
|
scale: [appearEffectValues.scale, loopValues.scale, presenceEffectValues.scale, transformValues2.scale,],
|
|
27356
27376
|
opacity: [
|
|
@@ -27431,9 +27451,9 @@ var withParallaxTransform = withFX;
|
|
|
27431
27451
|
exports.withParallaxTransform = withParallaxTransform;
|
|
27432
27452
|
var withStyleAppearEffect = withFX;
|
|
27433
27453
|
exports.withStyleAppearEffect = withStyleAppearEffect;
|
|
27434
|
-
var Context = /* @__PURE__ */ (0,
|
|
27454
|
+
var Context = /* @__PURE__ */ (0, react_120.createContext)({});
|
|
27435
27455
|
function ComponentPresetsProvider({ presets, children, }) {
|
|
27436
|
-
const lastPresets = (0,
|
|
27456
|
+
const lastPresets = (0, react_120.useRef)(presets);
|
|
27437
27457
|
if (!isEqual(presets, lastPresets.current, false)) {
|
|
27438
27458
|
lastPresets.current = presets;
|
|
27439
27459
|
}
|
|
@@ -27442,7 +27462,7 @@ function ComponentPresetsProvider({ presets, children, }) {
|
|
|
27442
27462
|
exports.ComponentPresetsProvider = ComponentPresetsProvider;
|
|
27443
27463
|
function ComponentPresetsConsumer({ componentIdentifier, children, }) {
|
|
27444
27464
|
var _f;
|
|
27445
|
-
const componentPresets = (0,
|
|
27465
|
+
const componentPresets = (0, react_120.useContext)(Context);
|
|
27446
27466
|
const presetProps = (_f = componentPresets[componentIdentifier]) !== null && _f !== void 0 ? _f : {};
|
|
27447
27467
|
return children(presetProps);
|
|
27448
27468
|
}
|
|
@@ -27539,14 +27559,14 @@ function setRef(ref, value) {
|
|
|
27539
27559
|
function isMutableRef(ref) {
|
|
27540
27560
|
return isObject2(ref) && 'current' in ref;
|
|
27541
27561
|
}
|
|
27542
|
-
var ComponentViewportContext = /* @__PURE__ */
|
|
27562
|
+
var ComponentViewportContext = /* @__PURE__ */ react_121.default.createContext({});
|
|
27543
27563
|
function useComponentViewport() {
|
|
27544
|
-
return
|
|
27564
|
+
return react_121.default.useContext(ComponentViewportContext);
|
|
27545
27565
|
}
|
|
27546
27566
|
exports.useComponentViewport = useComponentViewport;
|
|
27547
|
-
var ComponentViewportProvider = /* @__PURE__ */
|
|
27567
|
+
var ComponentViewportProvider = /* @__PURE__ */ react_121.default.forwardRef((_f, ref) => {
|
|
27548
27568
|
var { width, children } = _f, rest = __rest(_f, ["width", "children"]);
|
|
27549
|
-
const componentViewport =
|
|
27569
|
+
const componentViewport = react_121.default.useMemo(() => {
|
|
27550
27570
|
return { width, };
|
|
27551
27571
|
}, [width,]);
|
|
27552
27572
|
const cloneWithPropsAndRef = useCloneChildrenWithPropsAndRef(ref);
|
|
@@ -27556,12 +27576,12 @@ var ComponentViewportProvider = /* @__PURE__ */ react_120.default.forwardRef((_f
|
|
|
27556
27576
|
});
|
|
27557
27577
|
});
|
|
27558
27578
|
exports.ComponentViewportProvider = ComponentViewportProvider;
|
|
27559
|
-
var withGeneratedLayoutId = (Component15) =>
|
|
27579
|
+
var withGeneratedLayoutId = (Component15) => react_123.default.forwardRef((props, ref) => {
|
|
27560
27580
|
const layoutId = useLayoutId2(props);
|
|
27561
27581
|
return /* @__PURE__ */ (0, jsx_runtime_43.jsx)(Component15, Object.assign(Object.assign({ layoutId }, props), { layoutIdKey: void 0, duplicatedFrom: void 0, ref }));
|
|
27562
27582
|
});
|
|
27563
27583
|
exports.withGeneratedLayoutId = withGeneratedLayoutId;
|
|
27564
|
-
var Providers = /* @__PURE__ */
|
|
27584
|
+
var Providers = /* @__PURE__ */ react_122.default.forwardRef((_f, ref) => {
|
|
27565
27585
|
var { children, layoutId } = _f, props = __rest(_f, ["children", "layoutId"]);
|
|
27566
27586
|
const outerLayoutId = useConstant2(() => layoutId ? `${layoutId}-container` : void 0);
|
|
27567
27587
|
return /* @__PURE__ */ (0, jsx_runtime_44.jsx)(motion.div, Object.assign(Object.assign({ layoutId: outerLayoutId }, props), { ref, children: /* @__PURE__ */ (0, jsx_runtime_44.jsx)(ComponentContainerContext.Provider, {
|
|
@@ -27571,8 +27591,8 @@ var Providers = /* @__PURE__ */ react_121.default.forwardRef((_f, ref) => {
|
|
|
27571
27591
|
children: /* @__PURE__ */ (0, jsx_runtime_44.jsx)(LayoutGroup, {
|
|
27572
27592
|
id: layoutId !== null && layoutId !== void 0 ? layoutId : '',
|
|
27573
27593
|
inherit: 'id',
|
|
27574
|
-
children:
|
|
27575
|
-
return
|
|
27594
|
+
children: react_122.default.Children.map(children, (child) => {
|
|
27595
|
+
return react_122.default.isValidElement(child) ? react_122.default.cloneElement(child, { layoutId, }) : child;
|
|
27576
27596
|
}),
|
|
27577
27597
|
}),
|
|
27578
27598
|
}),
|
|
@@ -27580,7 +27600,7 @@ var Providers = /* @__PURE__ */ react_121.default.forwardRef((_f, ref) => {
|
|
|
27580
27600
|
});
|
|
27581
27601
|
var Container = /* @__PURE__ */ withGeneratedLayoutId(Providers);
|
|
27582
27602
|
exports.Container = Container;
|
|
27583
|
-
var StyleSheetContext = /* @__PURE__ */
|
|
27603
|
+
var StyleSheetContext = /* @__PURE__ */ react_126.default.createContext(void 0);
|
|
27584
27604
|
exports.StyleSheetContext = StyleSheetContext;
|
|
27585
27605
|
if (isBrowser2()) {
|
|
27586
27606
|
for (const node of document.querySelectorAll('style[data-framer-css-ssr]')) {
|
|
@@ -27601,9 +27621,9 @@ var componentsWithServerRenderedStyles = /* @__PURE__ */ (() => {
|
|
|
27601
27621
|
return new Set(componentsWithSSRStylesAttr.split(' '));
|
|
27602
27622
|
})();
|
|
27603
27623
|
var styleTagSSRMarker = { 'data-framer-css-ssr': true, };
|
|
27604
|
-
var withCSS = (Component15, escapedCSS, componentSerializationId) =>
|
|
27624
|
+
var withCSS = (Component15, escapedCSS, componentSerializationId) => react_125.default.forwardRef((props, ref) => {
|
|
27605
27625
|
var _f;
|
|
27606
|
-
const { sheet, cache: cache3, } = (_f =
|
|
27626
|
+
const { sheet, cache: cache3, } = (_f = react_125.default.useContext(StyleSheetContext)) !== null && _f !== void 0 ? _f : {};
|
|
27607
27627
|
if (!isBrowser2()) {
|
|
27608
27628
|
const concatenatedCSS = Array.isArray(escapedCSS) ? escapedCSS.join('\n') : escapedCSS;
|
|
27609
27629
|
return /* @__PURE__ */ (0, jsx_runtime_45.jsxs)(jsx_runtime_45.Fragment, {
|
|
@@ -27613,7 +27633,7 @@ var withCSS = (Component15, escapedCSS, componentSerializationId) => react_124.d
|
|
|
27613
27633
|
],
|
|
27614
27634
|
});
|
|
27615
27635
|
}
|
|
27616
|
-
|
|
27636
|
+
react_125.default.useInsertionEffect(() => {
|
|
27617
27637
|
if (componentSerializationId && componentsWithServerRenderedStyles.has(componentSerializationId)) {
|
|
27618
27638
|
return;
|
|
27619
27639
|
}
|
|
@@ -27623,7 +27643,7 @@ var withCSS = (Component15, escapedCSS, componentSerializationId) => react_124.d
|
|
|
27623
27643
|
return /* @__PURE__ */ (0, jsx_runtime_45.jsx)(Component15, Object.assign(Object.assign({}, props), { ref }));
|
|
27624
27644
|
});
|
|
27625
27645
|
exports.withCSS = withCSS;
|
|
27626
|
-
var CustomCursorContext = /* @__PURE__ */
|
|
27646
|
+
var CustomCursorContext = /* @__PURE__ */ react_124.default.createContext({
|
|
27627
27647
|
onRegisterCursors: () => () => {
|
|
27628
27648
|
},
|
|
27629
27649
|
registerCursors: () => {
|
|
@@ -27631,7 +27651,7 @@ var CustomCursorContext = /* @__PURE__ */ react_123.default.createContext({
|
|
|
27631
27651
|
});
|
|
27632
27652
|
var replaceCursorClassName = 'framer-cursor-none';
|
|
27633
27653
|
var cursorComponentClassName = 'framer-pointer-events-none';
|
|
27634
|
-
var CustomCursorContextProvider = /* @__PURE__ */
|
|
27654
|
+
var CustomCursorContextProvider = /* @__PURE__ */ react_124.default.memo(function CustomCursorList({ children, }) {
|
|
27635
27655
|
const value = useConstant2(() => {
|
|
27636
27656
|
const events2 = /* @__PURE__ */ new Set();
|
|
27637
27657
|
let allCursors = {};
|
|
@@ -27745,17 +27765,17 @@ function isEmptyObject(object) {
|
|
|
27745
27765
|
}
|
|
27746
27766
|
return true;
|
|
27747
27767
|
}
|
|
27748
|
-
var CustomCursorComponent = /* @__PURE__ */
|
|
27768
|
+
var CustomCursorComponent = /* @__PURE__ */ react_124.default.memo(function CustomCursorComponent2() {
|
|
27749
27769
|
var _f;
|
|
27750
|
-
const { onRegisterCursors, } = (0,
|
|
27770
|
+
const { onRegisterCursors, } = (0, react_124.useContext)(CustomCursorContext);
|
|
27751
27771
|
const pointerX = useMotionValue(0);
|
|
27752
27772
|
const pointerY = useMotionValue(0);
|
|
27753
27773
|
const opacity = useMotionValue(0);
|
|
27754
|
-
const cursorRef =
|
|
27755
|
-
const internalState =
|
|
27774
|
+
const cursorRef = react_124.default.useRef(null);
|
|
27775
|
+
const internalState = react_124.default.useRef({ cursors: {}, cursorHash: void 0, });
|
|
27756
27776
|
const forceRender = useForceUpdate3();
|
|
27757
27777
|
const hasCursors = !isEmptyObject(internalState.current.cursors);
|
|
27758
|
-
|
|
27778
|
+
react_124.default.useEffect(() => {
|
|
27759
27779
|
let x2 = 0;
|
|
27760
27780
|
let y2 = 0;
|
|
27761
27781
|
function updateValues() {
|
|
@@ -27811,7 +27831,7 @@ var CustomCursorComponent = /* @__PURE__ */ react_123.default.memo(function Cust
|
|
|
27811
27831
|
cancelFrame(updateVariant);
|
|
27812
27832
|
};
|
|
27813
27833
|
}, [opacity, pointerX, pointerY, hasCursors, forceRender,]);
|
|
27814
|
-
|
|
27834
|
+
react_124.default.useEffect(() => {
|
|
27815
27835
|
function hideCursor() {
|
|
27816
27836
|
animate(opacity, 0, { type: 'tween', duration: 0.2, });
|
|
27817
27837
|
}
|
|
@@ -27822,7 +27842,7 @@ var CustomCursorComponent = /* @__PURE__ */ react_123.default.memo(function Cust
|
|
|
27822
27842
|
safeWindow.removeEventListener('blur', hideCursor);
|
|
27823
27843
|
};
|
|
27824
27844
|
}, [opacity,]);
|
|
27825
|
-
|
|
27845
|
+
react_124.default.useLayoutEffect(() => {
|
|
27826
27846
|
function updateCursors(newCursors) {
|
|
27827
27847
|
internalState.current.cursors = newCursors;
|
|
27828
27848
|
internalState.current.cursorHash = getCursorHash(pointerX.get(), pointerY.get());
|
|
@@ -27837,7 +27857,7 @@ var CustomCursorComponent = /* @__PURE__ */ react_123.default.memo(function Cust
|
|
|
27837
27857
|
const { cursors, cursorHash, } = internalState.current;
|
|
27838
27858
|
const cursor = cursorHash ? cursors[cursorHash] : null;
|
|
27839
27859
|
const replaceNativeCursor = customCursorReplacesNativeCursor(cursor);
|
|
27840
|
-
|
|
27860
|
+
react_124.default.useLayoutEffect(() => {
|
|
27841
27861
|
document.body.classList.toggle(replaceCursorClassName, replaceNativeCursor);
|
|
27842
27862
|
}, [replaceNativeCursor,]);
|
|
27843
27863
|
const Cursor = cursor == null ? void 0 : cursor.component;
|
|
@@ -27856,7 +27876,7 @@ var CustomCursorComponent = /* @__PURE__ */ react_123.default.memo(function Cust
|
|
|
27856
27876
|
});
|
|
27857
27877
|
const alignment = cursor == null ? void 0 : cursor.alignment;
|
|
27858
27878
|
const placement = cursor == null ? void 0 : cursor.placement;
|
|
27859
|
-
const transformTemplate2 =
|
|
27879
|
+
const transformTemplate2 = react_124.default.useCallback((_, t) => `translate(${getCenteringTransform(placement, alignment)}) ${t}`, [alignment, placement,]);
|
|
27860
27880
|
if (!cursor || !Cursor) {
|
|
27861
27881
|
return null;
|
|
27862
27882
|
}
|
|
@@ -27872,13 +27892,189 @@ var CustomCursorComponent = /* @__PURE__ */ react_123.default.memo(function Cust
|
|
|
27872
27892
|
});
|
|
27873
27893
|
});
|
|
27874
27894
|
function useCustomCursors(webPageCursors) {
|
|
27875
|
-
const { registerCursors, } = (0,
|
|
27895
|
+
const { registerCursors, } = (0, react_124.useContext)(CustomCursorContext);
|
|
27876
27896
|
const cursors = useConstant2(() => webPageCursors);
|
|
27877
|
-
|
|
27897
|
+
react_124.default.useLayoutEffect(() => {
|
|
27878
27898
|
registerCursors(cursors);
|
|
27879
27899
|
}, [cursors, registerCursors,]);
|
|
27880
27900
|
}
|
|
27881
27901
|
exports.useCustomCursors = useCustomCursors;
|
|
27902
|
+
function degreesToRadians(degrees2) {
|
|
27903
|
+
return degrees2 * (Math.PI / 180);
|
|
27904
|
+
}
|
|
27905
|
+
exports.degreesToRadians = degreesToRadians;
|
|
27906
|
+
var Line = /* @__PURE__ */ (() => {
|
|
27907
|
+
function Line2(a, b) {
|
|
27908
|
+
return { a, b, };
|
|
27909
|
+
}
|
|
27910
|
+
Line2.offset = (line, offset) => {
|
|
27911
|
+
const angle = Point.angleFromX(line.a, line.b);
|
|
27912
|
+
const rad = degreesToRadians(angle);
|
|
27913
|
+
const x = offset * Math.sin(rad);
|
|
27914
|
+
const y = offset * Math.cos(rad);
|
|
27915
|
+
return Line2({ x: line.a.x + x, y: line.a.y - y, }, {
|
|
27916
|
+
x: line.b.x + x,
|
|
27917
|
+
y: line.b.y - y,
|
|
27918
|
+
});
|
|
27919
|
+
};
|
|
27920
|
+
Line2.intersection = (lineA, lineB) => {
|
|
27921
|
+
const x1 = lineA.a.x;
|
|
27922
|
+
const y1 = lineA.a.y;
|
|
27923
|
+
const x2 = lineA.b.x;
|
|
27924
|
+
const y2 = lineA.b.y;
|
|
27925
|
+
const x3 = lineB.a.x;
|
|
27926
|
+
const y3 = lineB.a.y;
|
|
27927
|
+
const x4 = lineB.b.x;
|
|
27928
|
+
const y4 = lineB.b.y;
|
|
27929
|
+
const d = (x1 - x2) * (y3 - y4) - (y1 - y2) * (x3 - x4);
|
|
27930
|
+
if (d === 0) {
|
|
27931
|
+
return null;
|
|
27932
|
+
}
|
|
27933
|
+
const xi = ((x3 - x4) * (x1 * y2 - y1 * x2) - (x1 - x2) * (x3 * y4 - y3 * x4)) / d;
|
|
27934
|
+
const yi = ((y3 - y4) * (x1 * y2 - y1 * x2) - (y1 - y2) * (x3 * y4 - y3 * x4)) / d;
|
|
27935
|
+
return { x: xi, y: yi, };
|
|
27936
|
+
};
|
|
27937
|
+
Line2.intersectionAngle = (lineA, lineB) => {
|
|
27938
|
+
const deltaAX = lineA.b.x - lineA.a.x;
|
|
27939
|
+
const deltaAY = lineA.b.y - lineA.a.y;
|
|
27940
|
+
const deltaBX = lineB.b.x - lineB.a.x;
|
|
27941
|
+
const deltaBY = lineB.b.y - lineB.a.y;
|
|
27942
|
+
const angle = Math.atan2(deltaAX * deltaBY - deltaAY * deltaBX, deltaAX * deltaBX + deltaAY * deltaBY);
|
|
27943
|
+
return angle * (180 / Math.PI);
|
|
27944
|
+
};
|
|
27945
|
+
Line2.isOrthogonal = (line) => {
|
|
27946
|
+
return line.a.x === line.b.x || line.a.y === line.b.y;
|
|
27947
|
+
};
|
|
27948
|
+
Line2.perpendicular = (line, pointOnLine) => {
|
|
27949
|
+
const deltaX = line.a.x - line.b.x;
|
|
27950
|
+
const deltaY = line.a.y - line.b.y;
|
|
27951
|
+
const pointB = Point(pointOnLine.x - deltaY, pointOnLine.y + deltaX);
|
|
27952
|
+
return Line2(pointB, pointOnLine);
|
|
27953
|
+
};
|
|
27954
|
+
Line2.projectPoint = (line, point2) => {
|
|
27955
|
+
const perp = Line2.perpendicular(line, point2);
|
|
27956
|
+
return Line2.intersection(line, perp);
|
|
27957
|
+
};
|
|
27958
|
+
Line2.pointAtPercentDistance = (line, distance2) => {
|
|
27959
|
+
const hypotenuse = Line2.distance(line);
|
|
27960
|
+
const r = distance2 * hypotenuse / hypotenuse;
|
|
27961
|
+
return {
|
|
27962
|
+
x: r * line.b.x + (1 - r) * line.a.x,
|
|
27963
|
+
y: r * line.b.y + (1 - r) * line.a.y,
|
|
27964
|
+
};
|
|
27965
|
+
};
|
|
27966
|
+
Line2.distance = (line) => {
|
|
27967
|
+
return Point.distance(line.a, line.b);
|
|
27968
|
+
};
|
|
27969
|
+
return Line2;
|
|
27970
|
+
})();
|
|
27971
|
+
exports.Line = Line;
|
|
27972
|
+
var Polygon = {
|
|
27973
|
+
/**
|
|
27974
|
+
* Determine if the vertices are ordered clockwise or counter-clockwise. This works for simple
|
|
27975
|
+
* (non-self-intersecting) convex polygons. If the polygon is collapsed into a line (signedArea = 0), we consider it
|
|
27976
|
+
* clockwise for it works with how Framer draws the polygons.
|
|
27977
|
+
* See: https://paulbourke.net/geometry/polygonmesh/
|
|
27978
|
+
* @internal */
|
|
27979
|
+
isClockwise: (points) => {
|
|
27980
|
+
return Polygon.signedArea(points) <= 0;
|
|
27981
|
+
},
|
|
27982
|
+
/**
|
|
27983
|
+
* Calculate the signed area to determine if the vertices go clockwise or counter clockwise. We flip all the y
|
|
27984
|
+
* values because the y axis in our canvas coordinate is fipped.
|
|
27985
|
+
* See: https://mathworld.wolfram.com/PolygonArea.html
|
|
27986
|
+
* @internal */
|
|
27987
|
+
signedArea: (points) => {
|
|
27988
|
+
let sum = 0;
|
|
27989
|
+
const len = points.length;
|
|
27990
|
+
for (let i = 0; i < len; i++) {
|
|
27991
|
+
const pointA = points[i];
|
|
27992
|
+
const pointB = points[(i + 1) % len];
|
|
27993
|
+
if (!pointA || !pointB) {
|
|
27994
|
+
continue;
|
|
27995
|
+
}
|
|
27996
|
+
sum += pointA.x * -pointB.y - pointB.x * -pointA.y;
|
|
27997
|
+
}
|
|
27998
|
+
return 1 / 2 * sum;
|
|
27999
|
+
},
|
|
28000
|
+
/**
|
|
28001
|
+
* Determine if some Point lies inside the polygon formed by other Points.
|
|
28002
|
+
* The other points must be provided in a clockwise/counter clockwise order.
|
|
28003
|
+
*
|
|
28004
|
+
* Ray-casting algorithm based on
|
|
28005
|
+
* https://wrf.ecse.rpi.edu/Research/Short_Notes/pnpoly.html
|
|
28006
|
+
*
|
|
28007
|
+
* @internal */
|
|
28008
|
+
containsPoint: (polygonPoints2, point2) => {
|
|
28009
|
+
var _f, _j, _k, _l;
|
|
28010
|
+
var _a, _b, _c, _d;
|
|
28011
|
+
const x = point2.x;
|
|
28012
|
+
const y = point2.y;
|
|
28013
|
+
let isInside = false;
|
|
28014
|
+
for (let i = 0, j = polygonPoints2.length - 1; i < polygonPoints2.length; j = i++) {
|
|
28015
|
+
const xi = (_f = ((_a = polygonPoints2[i]) == null ? void 0 : _a.x)) !== null && _f !== void 0 ? _f : 0;
|
|
28016
|
+
const yi = (_j = ((_b = polygonPoints2[i]) == null ? void 0 : _b.y)) !== null && _j !== void 0 ? _j : 0;
|
|
28017
|
+
const xj = (_k = ((_c = polygonPoints2[j]) == null ? void 0 : _c.x)) !== null && _k !== void 0 ? _k : 0;
|
|
28018
|
+
const yj = (_l = ((_d = polygonPoints2[j]) == null ? void 0 : _d.y)) !== null && _l !== void 0 ? _l : 0;
|
|
28019
|
+
const intersect = yi > y !== yj > y && x < (xj - xi) * (y - yi) / (yj - yi) + xi;
|
|
28020
|
+
if (intersect) {
|
|
28021
|
+
isInside = !isInside;
|
|
28022
|
+
}
|
|
28023
|
+
}
|
|
28024
|
+
return isInside;
|
|
28025
|
+
},
|
|
28026
|
+
/** @internal */
|
|
28027
|
+
intersect: (pointsA, pointsB) => {
|
|
28028
|
+
if (pointsA.length < 1 || pointsB.length < 1) {
|
|
28029
|
+
return false;
|
|
28030
|
+
}
|
|
28031
|
+
const boundingRectA = Rect.boundingRectFromPoints(pointsA);
|
|
28032
|
+
const boundingRectB = Rect.boundingRectFromPoints(pointsB);
|
|
28033
|
+
if (!Rect.intersects(boundingRectA, boundingRectB)) {
|
|
28034
|
+
return false;
|
|
28035
|
+
}
|
|
28036
|
+
const edgesA = [];
|
|
28037
|
+
const pointsALength = pointsA.length;
|
|
28038
|
+
pointsA.forEach((point2, index) => {
|
|
28039
|
+
const nextPoint = pointsA[(index + 1) % pointsALength];
|
|
28040
|
+
if (!nextPoint) {
|
|
28041
|
+
return;
|
|
28042
|
+
}
|
|
28043
|
+
edgesA.push(Line(point2, nextPoint));
|
|
28044
|
+
});
|
|
28045
|
+
const edgesB = [];
|
|
28046
|
+
const pointsBLength = pointsB.length;
|
|
28047
|
+
pointsB.forEach((point2, index) => {
|
|
28048
|
+
const nextPoint = pointsB[(index + 1) % pointsBLength];
|
|
28049
|
+
if (!nextPoint) {
|
|
28050
|
+
return;
|
|
28051
|
+
}
|
|
28052
|
+
edgesB.push(Line(point2, nextPoint));
|
|
28053
|
+
});
|
|
28054
|
+
for (const edgeA of edgesA) {
|
|
28055
|
+
for (const edgeB of edgesB) {
|
|
28056
|
+
const intersection2 = segmentsIntersect(edgeA, edgeB);
|
|
28057
|
+
if (intersection2) {
|
|
28058
|
+
return true;
|
|
28059
|
+
}
|
|
28060
|
+
}
|
|
28061
|
+
}
|
|
28062
|
+
if (Polygon.containsPoint(pointsB, pointsA[0])) {
|
|
28063
|
+
return true;
|
|
28064
|
+
}
|
|
28065
|
+
if (Polygon.containsPoint(pointsA, pointsB[0])) {
|
|
28066
|
+
return true;
|
|
28067
|
+
}
|
|
28068
|
+
return false;
|
|
28069
|
+
},
|
|
28070
|
+
};
|
|
28071
|
+
exports.Polygon = Polygon;
|
|
28072
|
+
function segmentsIntersect(segmentA, segmentB) {
|
|
28073
|
+
const { a, b, } = segmentA;
|
|
28074
|
+
const { a: c, b: d, } = segmentB;
|
|
28075
|
+
return Polygon.isClockwise([a, c, d,]) !== Polygon.isClockwise([b, c, d,]) &&
|
|
28076
|
+
Polygon.isClockwise([a, b, c,]) !== Polygon.isClockwise([a, b, d,]);
|
|
28077
|
+
}
|
|
27882
28078
|
function invertPlacement(placement) {
|
|
27883
28079
|
switch (placement) {
|
|
27884
28080
|
case 'top':
|
|
@@ -27968,7 +28164,7 @@ function getSafePlacementFloatingPositionRect(anchor, element, placement, alignm
|
|
|
27968
28164
|
];
|
|
27969
28165
|
}
|
|
27970
28166
|
function preferredPoint(a, b, points) {
|
|
27971
|
-
if (
|
|
28167
|
+
if (Polygon.containsPoint([b, ...points,], a)) {
|
|
27972
28168
|
return b;
|
|
27973
28169
|
}
|
|
27974
28170
|
return a;
|
|
@@ -28120,12 +28316,12 @@ function updatePosition(floatingPositionRef, position, rect) {
|
|
|
28120
28316
|
top: ((_j = (rect == null ? void 0 : rect.y)) !== null && _j !== void 0 ? _j : 0) + (position === 'fixed' ? 0 : safeWindow.scrollY) + 'px',
|
|
28121
28317
|
});
|
|
28122
28318
|
}
|
|
28123
|
-
var FloatingStackingContext = /* @__PURE__ */
|
|
28319
|
+
var FloatingStackingContext = /* @__PURE__ */ react_127.default.createContext(/* @__PURE__ */ new Set());
|
|
28124
28320
|
function useDismissFloatingLayer(anchorRef, floatingPositionRef, safeAreaRef, { safeArea, onDismiss, }) {
|
|
28125
28321
|
const descendantStackingContext = useConstant2(() => /* @__PURE__ */ new Set());
|
|
28126
|
-
const ancestorStackingContext =
|
|
28322
|
+
const ancestorStackingContext = react_127.default.useContext(FloatingStackingContext);
|
|
28127
28323
|
const [isPresent2, safeToRemove,] = usePresence();
|
|
28128
|
-
|
|
28324
|
+
react_127.default.useEffect(() => {
|
|
28129
28325
|
if (isPresent2) {
|
|
28130
28326
|
if (!floatingPositionRef.current) {
|
|
28131
28327
|
return;
|
|
@@ -28142,7 +28338,7 @@ function useDismissFloatingLayer(anchorRef, floatingPositionRef, safeAreaRef, {
|
|
|
28142
28338
|
safeToRemove();
|
|
28143
28339
|
}
|
|
28144
28340
|
}, [isPresent2, floatingPositionRef, ancestorStackingContext,]);
|
|
28145
|
-
|
|
28341
|
+
react_127.default.useEffect(() => {
|
|
28146
28342
|
if (!safeArea) {
|
|
28147
28343
|
const handleEscape = (e) => {
|
|
28148
28344
|
if (e.key !== 'Escape') {
|
|
@@ -28211,16 +28407,16 @@ function childrenWithOrigin(child, { x, y, }) {
|
|
|
28211
28407
|
return null;
|
|
28212
28408
|
}
|
|
28213
28409
|
const style = Object.assign(Object.assign({}, child.props.style), { originX: x, originY: y });
|
|
28214
|
-
return
|
|
28410
|
+
return react_127.default.cloneElement(child, { style, });
|
|
28215
28411
|
}
|
|
28216
28412
|
function Floating(_f) {
|
|
28217
28413
|
var _j;
|
|
28218
28414
|
var { alignment, placement, safeArea, offsetX, offsetY, anchorRef, className, children, portalSelector, zIndex, collisionDetection = false, collisionDetectionPadding, onDismiss } = _f, rest = __rest(_f, ["alignment", "placement", "safeArea", "offsetX", "offsetY", "anchorRef", "className", "children", "portalSelector", "zIndex", "collisionDetection", "collisionDetectionPadding", "onDismiss"]);
|
|
28219
|
-
const floatingPositionRef =
|
|
28220
|
-
const safeAreaRef =
|
|
28221
|
-
const contentRef =
|
|
28415
|
+
const floatingPositionRef = react_127.default.useRef(null);
|
|
28416
|
+
const safeAreaRef = react_127.default.useRef(null);
|
|
28417
|
+
const contentRef = react_127.default.useRef(null);
|
|
28222
28418
|
const [origin, updateOrigin,] = useDynamicMotionOrigin(placement, alignment);
|
|
28223
|
-
|
|
28419
|
+
react_127.default.useLayoutEffect(() => {
|
|
28224
28420
|
if (!isRef(anchorRef) || !contentRef.current || !placement || !alignment) {
|
|
28225
28421
|
return;
|
|
28226
28422
|
}
|
|
@@ -28303,7 +28499,7 @@ function Floating(_f) {
|
|
|
28303
28499
|
] })), (_j = document.querySelector(portalSelector)) !== null && _j !== void 0 ? _j : document.body);
|
|
28304
28500
|
}
|
|
28305
28501
|
exports.Floating = Floating;
|
|
28306
|
-
var GeneratedComponentContext = /* @__PURE__ */
|
|
28502
|
+
var GeneratedComponentContext = /* @__PURE__ */ react_128.default.createContext(void 0);
|
|
28307
28503
|
exports.GeneratedComponentContext = GeneratedComponentContext;
|
|
28308
28504
|
var LazyValue = class {
|
|
28309
28505
|
constructor(resolver) {
|
|
@@ -28538,11 +28734,11 @@ function linkFromFramerPageLink(link) {
|
|
|
28538
28734
|
};
|
|
28539
28735
|
}
|
|
28540
28736
|
var pathVariablesRegExp2 = /:([a-z]\w*)/gi;
|
|
28541
|
-
var PathVariablesContext =
|
|
28737
|
+
var PathVariablesContext = react_129.default.createContext(void 0);
|
|
28542
28738
|
exports.PathVariablesContext = PathVariablesContext;
|
|
28543
28739
|
function useImplicitPathVariables() {
|
|
28544
28740
|
var _a;
|
|
28545
|
-
const contextPathVariables =
|
|
28741
|
+
const contextPathVariables = react_129.default.useContext(PathVariablesContext);
|
|
28546
28742
|
const currentPathVariables = (_a = useCurrentRoute()) == null ? void 0 : _a.pathVariables;
|
|
28547
28743
|
const pathVariables = contextPathVariables || currentPathVariables;
|
|
28548
28744
|
return pathVariables;
|
|
@@ -28569,7 +28765,7 @@ function linkMatchesRoute(route, { webPageId, hash: hash2, pathVariables, }, imp
|
|
|
28569
28765
|
}
|
|
28570
28766
|
function useLinkMatchesRoute(link) {
|
|
28571
28767
|
const route = useCurrentRoute();
|
|
28572
|
-
const contextPathVariables =
|
|
28768
|
+
const contextPathVariables = react_129.default.useContext(PathVariablesContext);
|
|
28573
28769
|
if (!route) {
|
|
28574
28770
|
return false;
|
|
28575
28771
|
}
|
|
@@ -28703,14 +28899,14 @@ function resolveSlugsWithSuspense(unresolvedPathSlugs, unresolvedHashSlugs, coll
|
|
|
28703
28899
|
}
|
|
28704
28900
|
return result;
|
|
28705
28901
|
}
|
|
28706
|
-
var Link = /* @__PURE__ */
|
|
28902
|
+
var Link = /* @__PURE__ */ react_129.default.forwardRef((_f, forwardedRef) => {
|
|
28707
28903
|
var { children, href, openInNewTab, smoothScroll } = _f, restProps = __rest(_f, ["children", "href", "openInNewTab", "smoothScroll"]);
|
|
28708
28904
|
const router = useRouter();
|
|
28709
28905
|
const currentRoute = useCurrentRoute();
|
|
28710
28906
|
const implicitPathVariables = useImplicitPathVariables();
|
|
28711
28907
|
const { activeLocale, } = useLocaleInfo();
|
|
28712
28908
|
const clone = useCloneChildrenWithPropsAndRef(forwardedRef);
|
|
28713
|
-
const props =
|
|
28909
|
+
const props = react_129.default.useMemo(() => {
|
|
28714
28910
|
var _a;
|
|
28715
28911
|
if (!href) {
|
|
28716
28912
|
return {};
|
|
@@ -28796,13 +28992,13 @@ function resolvePageScope(pageLink, router) {
|
|
|
28796
28992
|
}
|
|
28797
28993
|
exports.resolvePageScope = resolvePageScope;
|
|
28798
28994
|
function PageRoot({ RootComponent, isWebsite, routeId, pathVariables, routes, collectionUtils, notFoundPage, isReducedMotion = false, includeDataObserver = false, localeId, locales, preserveQueryParams, enableSuspenseThatPreservesDom, shouldMarkHydrationEnd = false, }) {
|
|
28799
|
-
|
|
28995
|
+
react_130.default.useLayoutEffect(() => {
|
|
28800
28996
|
if (shouldMarkHydrationEnd) {
|
|
28801
28997
|
performance.mark('framer-hydration-end');
|
|
28802
28998
|
performance.measure('framer-hydration', 'framer-hydration-start', 'framer-hydration-end');
|
|
28803
28999
|
}
|
|
28804
29000
|
}, []);
|
|
28805
|
-
|
|
29001
|
+
react_130.default.useEffect(() => {
|
|
28806
29002
|
if (isWebsite) {
|
|
28807
29003
|
return;
|
|
28808
29004
|
}
|
|
@@ -28828,12 +29024,12 @@ function PageRoot({ RootComponent, isWebsite, routeId, pathVariables, routes, co
|
|
|
28828
29024
|
});
|
|
28829
29025
|
}
|
|
28830
29026
|
else {
|
|
28831
|
-
const Wrapper = includeDataObserver ? DataObserver :
|
|
29027
|
+
const Wrapper = includeDataObserver ? DataObserver : react_130.default.Fragment;
|
|
28832
29028
|
return /* @__PURE__ */ (0, jsx_runtime_48.jsx)(Wrapper, {
|
|
28833
29029
|
children: /* @__PURE__ */ (0, jsx_runtime_48.jsx)(RoutesProvider, {
|
|
28834
29030
|
routes,
|
|
28835
29031
|
children: /* @__PURE__ */ (0, jsx_runtime_48.jsx)(NavigationWrapper, {
|
|
28836
|
-
children:
|
|
29032
|
+
children: react_130.default.isValidElement(RootComponent) ? RootComponent : react_130.default.createElement(
|
|
28837
29033
|
// @ts-expect-error to figure out how to type this properly, as tests are using different
|
|
28838
29034
|
// $$typeof symbol and isValidElement fails
|
|
28839
29035
|
RootComponent, { key: routeId, }),
|
|
@@ -28855,15 +29051,15 @@ function cloneChildrenWithProps(children, props, asNode) {
|
|
|
28855
29051
|
}
|
|
28856
29052
|
return /* @__PURE__ */ (0, jsx_runtime_49.jsx)(jsx_runtime_49.Fragment, { children: cloned, });
|
|
28857
29053
|
}
|
|
28858
|
-
var SSRParentVariantsContext = /* @__PURE__ */
|
|
29054
|
+
var SSRParentVariantsContext = /* @__PURE__ */ react_131.default.createContext(void 0);
|
|
28859
29055
|
var SSRVariantClassName = 'ssr-variant';
|
|
28860
29056
|
function renderBranchedChildrenFromPropertyOverridesOnServer(overrides, children, props, variantClassNames, primaryVariantId, parentVariants, type) {
|
|
28861
29057
|
if (isBrowser2()) {
|
|
28862
29058
|
throw new Error('This should not be called on the client');
|
|
28863
29059
|
}
|
|
28864
|
-
const childrenArray =
|
|
29060
|
+
const childrenArray = react_131.default.Children.toArray(children);
|
|
28865
29061
|
const child = childrenArray[0];
|
|
28866
|
-
if (childrenArray.length !== 1 || !
|
|
29062
|
+
if (childrenArray.length !== 1 || !react_131.default.isValidElement(child)) {
|
|
28867
29063
|
console.warn(type + ': expected exactly one React element for a child', children);
|
|
28868
29064
|
return cloneChildrenWithProps(children, props);
|
|
28869
29065
|
}
|
|
@@ -28920,20 +29116,20 @@ function renderBranchedChildrenFromPropertyOverridesOnServer(overrides, children
|
|
|
28920
29116
|
],
|
|
28921
29117
|
});
|
|
28922
29118
|
}
|
|
28923
|
-
var SSRVariants = /* @__PURE__ */
|
|
29119
|
+
var SSRVariants = /* @__PURE__ */ react_131.default.forwardRef(function SSRVariants2(_f, ref) {
|
|
28924
29120
|
var { id: nodeId, children } = _f, props = __rest(_f, ["id", "children"]);
|
|
28925
29121
|
const cloneWithRefs = useCloneChildrenWithPropsAndRef(ref);
|
|
28926
29122
|
if (isBrowser2()) {
|
|
28927
29123
|
return cloneWithRefs(children, props);
|
|
28928
29124
|
}
|
|
28929
|
-
const generatedComponentContext =
|
|
29125
|
+
const generatedComponentContext = react_131.default.useContext(GeneratedComponentContext);
|
|
28930
29126
|
if (!generatedComponentContext || !generatedComponentContext.variantProps) {
|
|
28931
29127
|
console.warn('SSRVariants is missing GeneratedComponentContext');
|
|
28932
29128
|
return cloneWithRefs(children, props);
|
|
28933
29129
|
}
|
|
28934
|
-
const parentVariants =
|
|
29130
|
+
const parentVariants = react_131.default.useContext(SSRParentVariantsContext);
|
|
28935
29131
|
const { primaryVariantId, variantClassNames, variantProps: variantProps2, } = generatedComponentContext;
|
|
28936
|
-
const overrides =
|
|
29132
|
+
const overrides = react_131.default.useMemo(() => {
|
|
28937
29133
|
const nextOverrides = {};
|
|
28938
29134
|
for (const [variant, values,] of Object.entries(variantProps2)) {
|
|
28939
29135
|
nextOverrides[variant] = values[nodeId];
|
|
@@ -28975,19 +29171,19 @@ function propsForBreakpoint(variant, props, overrides) {
|
|
|
28975
29171
|
}
|
|
28976
29172
|
return Object.assign(Object.assign({}, props), overrides[variant]);
|
|
28977
29173
|
}
|
|
28978
|
-
var PropertyOverrides = /* @__PURE__ */
|
|
29174
|
+
var PropertyOverrides = /* @__PURE__ */ react_131.default.forwardRef(function PropertyOverrides2(_f, ref) {
|
|
28979
29175
|
var { breakpoint, overrides, children } = _f, props = __rest(_f, ["breakpoint", "overrides", "children"]);
|
|
28980
29176
|
const cloneWithRefs = useCloneChildrenWithPropsAndRef(ref);
|
|
28981
29177
|
if (isBrowser2()) {
|
|
28982
29178
|
return cloneWithRefs(children, propsForBreakpoint(breakpoint, props, overrides));
|
|
28983
29179
|
}
|
|
28984
|
-
const generatedComponentContext =
|
|
29180
|
+
const generatedComponentContext = react_131.default.useContext(GeneratedComponentContext);
|
|
28985
29181
|
if (!generatedComponentContext) {
|
|
28986
29182
|
console.warn('PropertyOverrides is missing GeneratedComponentContext');
|
|
28987
29183
|
return cloneWithRefs(children, props);
|
|
28988
29184
|
}
|
|
28989
29185
|
const { primaryVariantId, variantClassNames, } = generatedComponentContext;
|
|
28990
|
-
const parentVariants =
|
|
29186
|
+
const parentVariants = react_131.default.useContext(SSRParentVariantsContext);
|
|
28991
29187
|
return renderBranchedChildrenFromPropertyOverridesOnServer(overrides, children, props, variantClassNames, primaryVariantId, parentVariants, 'PropertyOverrides');
|
|
28992
29188
|
});
|
|
28993
29189
|
exports.PropertyOverrides = PropertyOverrides;
|
|
@@ -31151,13 +31347,13 @@ function useActiveVariantCallback(baseVariant) {
|
|
|
31151
31347
|
useOnCurrentTargetChange(() => {
|
|
31152
31348
|
return () => rejectPending(pendingTimers, pendingPromises);
|
|
31153
31349
|
});
|
|
31154
|
-
|
|
31350
|
+
react_132.default.useEffect(() => {
|
|
31155
31351
|
return () => rejectPending(pendingTimers, pendingPromises);
|
|
31156
31352
|
}, [pendingPromises, pendingTimers,]);
|
|
31157
|
-
|
|
31353
|
+
react_132.default.useEffect(() => {
|
|
31158
31354
|
rejectPending(pendingTimers, pendingPromises);
|
|
31159
31355
|
}, [baseVariant, pendingPromises, pendingTimers,]);
|
|
31160
|
-
return
|
|
31356
|
+
return react_132.default.useRef({
|
|
31161
31357
|
/**
|
|
31162
31358
|
* Create a callback that can be cancelled if the base variant changes.
|
|
31163
31359
|
*/
|
|
@@ -31182,14 +31378,14 @@ function useActiveVariantCallback(baseVariant) {
|
|
|
31182
31378
|
exports.useActiveVariantCallback = useActiveVariantCallback;
|
|
31183
31379
|
function useActiveTargetCallback() {
|
|
31184
31380
|
const value = useActiveVariantCallback(void 0);
|
|
31185
|
-
return
|
|
31381
|
+
return react_132.default.useRef({
|
|
31186
31382
|
activeTargetCallback: value.activeVariantCallback,
|
|
31187
31383
|
delay: value.delay,
|
|
31188
31384
|
}).current;
|
|
31189
31385
|
}
|
|
31190
31386
|
exports.useActiveTargetCallback = useActiveTargetCallback;
|
|
31191
31387
|
function useAddVariantProps(baseVariant, gestureVariant, variantProps2) {
|
|
31192
|
-
return
|
|
31388
|
+
return react_133.default.useCallback((id3) => {
|
|
31193
31389
|
var _a, _b, _c;
|
|
31194
31390
|
if (!variantProps2) {
|
|
31195
31391
|
return {};
|
|
@@ -31231,16 +31427,16 @@ function activeMediaQueryFromWindow(mediaQueries) {
|
|
|
31231
31427
|
}
|
|
31232
31428
|
function useHydratedBreakpointVariants(initial, mediaQueries, hydratedWithInitial = true) {
|
|
31233
31429
|
var _f;
|
|
31234
|
-
const isInitialNavigation = (0,
|
|
31235
|
-
const baseVariant = (0,
|
|
31236
|
-
const basePropsVariant = (0,
|
|
31430
|
+
const isInitialNavigation = (0, react_134.useContext)(IsInitialNavigationContext);
|
|
31431
|
+
const baseVariant = (0, react_134.useRef)(isBrowser2() ? (_f = activeMediaQueryFromWindow(mediaQueries)) !== null && _f !== void 0 ? _f : initial : initial);
|
|
31432
|
+
const basePropsVariant = (0, react_134.useRef)(hydratedWithInitial && isInitialNavigation ? initial : baseVariant.current);
|
|
31237
31433
|
const forceUpdate = useForceUpdate3();
|
|
31238
31434
|
const instantTransition = useInstantTransition();
|
|
31239
|
-
const setActiveVariantInstant = (0,
|
|
31435
|
+
const setActiveVariantInstant = (0, react_134.useCallback)((variant) => {
|
|
31240
31436
|
if (variant !== baseVariant.current || variant !== basePropsVariant.current) {
|
|
31241
31437
|
instantTransition(() => {
|
|
31242
31438
|
baseVariant.current = basePropsVariant.current = variant;
|
|
31243
|
-
(0,
|
|
31439
|
+
(0, react_134.startTransition)(() => {
|
|
31244
31440
|
forceUpdate();
|
|
31245
31441
|
});
|
|
31246
31442
|
});
|
|
@@ -31252,7 +31448,7 @@ function useHydratedBreakpointVariants(initial, mediaQueries, hydratedWithInitia
|
|
|
31252
31448
|
}
|
|
31253
31449
|
setActiveVariantInstant(baseVariant.current);
|
|
31254
31450
|
}, []);
|
|
31255
|
-
(0,
|
|
31451
|
+
(0, react_134.useEffect)(() => {
|
|
31256
31452
|
const callbacks2 = [];
|
|
31257
31453
|
for (const [variant, query,] of Object.entries(mediaQueries)) {
|
|
31258
31454
|
const mql = safeWindow.matchMedia(query);
|
|
@@ -31295,7 +31491,7 @@ function removeHiddenBreakpointLayers(_initial, _mediaQueries, _variantClassName
|
|
|
31295
31491
|
}
|
|
31296
31492
|
exports.removeHiddenBreakpointLayers = removeHiddenBreakpointLayers;
|
|
31297
31493
|
function useDataRecord(collection, variables) {
|
|
31298
|
-
return (0,
|
|
31494
|
+
return (0, react_135.useMemo)(() => {
|
|
31299
31495
|
if (!Array.isArray(collection)) {
|
|
31300
31496
|
return null;
|
|
31301
31497
|
}
|
|
@@ -31317,12 +31513,12 @@ function useDataRecord(collection, variables) {
|
|
|
31317
31513
|
exports.useDataRecord = useDataRecord;
|
|
31318
31514
|
function useDynamicRefs() {
|
|
31319
31515
|
const map = useConstant2(() => /* @__PURE__ */ new Map());
|
|
31320
|
-
return
|
|
31516
|
+
return react_136.default.useCallback((key7) => {
|
|
31321
31517
|
const existing = map.get(key7);
|
|
31322
31518
|
if (existing) {
|
|
31323
31519
|
return existing;
|
|
31324
31520
|
}
|
|
31325
|
-
const ref = (0,
|
|
31521
|
+
const ref = (0, react_136.createRef)();
|
|
31326
31522
|
map.set(key7, ref);
|
|
31327
31523
|
return ref;
|
|
31328
31524
|
}, [map,]);
|
|
@@ -31417,7 +31613,7 @@ function createGamepadPoller() {
|
|
|
31417
31613
|
};
|
|
31418
31614
|
}
|
|
31419
31615
|
var gamepadPoller = /* @__PURE__ */ createGamepadPoller();
|
|
31420
|
-
var GamepadContext = /* @__PURE__ */
|
|
31616
|
+
var GamepadContext = /* @__PURE__ */ react_137.default.createContext(gamepadPoller);
|
|
31421
31617
|
exports.GamepadContext = GamepadContext;
|
|
31422
31618
|
function getGamepadInputs() {
|
|
31423
31619
|
let firstConnectedGamepad = null;
|
|
@@ -31467,16 +31663,16 @@ function isButtonPressed(button) {
|
|
|
31467
31663
|
return button.pressed === true || button.value > 0;
|
|
31468
31664
|
}
|
|
31469
31665
|
function useGamepad(input, callback, { mapping, on, } = {}) {
|
|
31470
|
-
const context =
|
|
31666
|
+
const context = react_137.default.useContext(GamepadContext);
|
|
31471
31667
|
const settings = useConstant2(() => ({
|
|
31472
31668
|
mapping: mapping !== null && mapping !== void 0 ? mapping : 'standard',
|
|
31473
31669
|
on: on !== null && on !== void 0 ? on : 'keydown',
|
|
31474
31670
|
}));
|
|
31475
|
-
const stateRef =
|
|
31671
|
+
const stateRef = react_137.default.useRef({
|
|
31476
31672
|
pressed: false,
|
|
31477
31673
|
handler: callback,
|
|
31478
31674
|
});
|
|
31479
|
-
const cb =
|
|
31675
|
+
const cb = react_137.default.useCallback((gamepad) => {
|
|
31480
31676
|
const { pressed, handler, } = stateRef.current;
|
|
31481
31677
|
if (gamepad.inputs.includes(input) && settings.mapping === gamepad.mapping) {
|
|
31482
31678
|
settings.on === 'keydown' && handler();
|
|
@@ -31497,10 +31693,10 @@ function useGamepad(input, callback, { mapping, on, } = {}) {
|
|
|
31497
31693
|
}
|
|
31498
31694
|
return () => context.unregister(cb);
|
|
31499
31695
|
}, []);
|
|
31500
|
-
|
|
31696
|
+
react_137.default.useEffect(() => {
|
|
31501
31697
|
return () => context.unregister(cb);
|
|
31502
31698
|
}, [cb, context,]);
|
|
31503
|
-
|
|
31699
|
+
react_137.default.useEffect(() => {
|
|
31504
31700
|
stateRef.current.handler = callback;
|
|
31505
31701
|
}, [callback,]);
|
|
31506
31702
|
}
|
|
@@ -31524,13 +31720,13 @@ function createShortcutDefinition(shortcut) {
|
|
|
31524
31720
|
return Object.assign(Object.assign(Object.assign({}, modifierDefaults), modifiers), { key: key7 });
|
|
31525
31721
|
}
|
|
31526
31722
|
function useHotkey(shortcut, callback) {
|
|
31527
|
-
const inTarget =
|
|
31723
|
+
const inTarget = react_138.default.useRef(true);
|
|
31528
31724
|
const shortcutDefinition = useConstant2(() => createShortcutDefinition(shortcut));
|
|
31529
31725
|
useOnCurrentTargetChange((isCurrentTarget, isOverlayed) => {
|
|
31530
31726
|
inTarget.current = isCurrentTarget && !isOverlayed;
|
|
31531
31727
|
return () => inTarget.current = false;
|
|
31532
31728
|
});
|
|
31533
|
-
const eventHandler =
|
|
31729
|
+
const eventHandler = react_138.default.useCallback((event) => {
|
|
31534
31730
|
if (!shortcutDefinition) {
|
|
31535
31731
|
return;
|
|
31536
31732
|
}
|
|
@@ -31543,7 +31739,7 @@ function useHotkey(shortcut, callback) {
|
|
|
31543
31739
|
event.preventDefault();
|
|
31544
31740
|
callback();
|
|
31545
31741
|
}, [shortcutDefinition, callback,]);
|
|
31546
|
-
|
|
31742
|
+
react_138.default.useEffect(() => {
|
|
31547
31743
|
document.addEventListener('keydown', eventHandler);
|
|
31548
31744
|
return () => document.removeEventListener('keydown', eventHandler);
|
|
31549
31745
|
}, [eventHandler,]);
|
|
@@ -31583,8 +31779,8 @@ function useOnVariantChange(variant, callbackMap) {
|
|
|
31583
31779
|
if (isOnFramerCanvas) {
|
|
31584
31780
|
return;
|
|
31585
31781
|
}
|
|
31586
|
-
const isActiveScreenRef =
|
|
31587
|
-
const callbackMapRef =
|
|
31782
|
+
const isActiveScreenRef = react_139.default.useRef(true);
|
|
31783
|
+
const callbackMapRef = react_139.default.useRef(callbackMap);
|
|
31588
31784
|
useOnCurrentTargetChange((isCurrent, isOverlayed) => {
|
|
31589
31785
|
const isActiveScreen = isCurrent && !isOverlayed;
|
|
31590
31786
|
if (!isActiveScreenRef.current && isActiveScreen) {
|
|
@@ -31595,7 +31791,7 @@ function useOnVariantChange(variant, callbackMap) {
|
|
|
31595
31791
|
}
|
|
31596
31792
|
isActiveScreenRef.current = isActiveScreen;
|
|
31597
31793
|
}, []);
|
|
31598
|
-
|
|
31794
|
+
react_139.default.useEffect(() => {
|
|
31599
31795
|
if (isActiveScreenRef.current) {
|
|
31600
31796
|
const callback = callbackForVariant(callbackMapRef.current, variant);
|
|
31601
31797
|
if (callback) {
|
|
@@ -31610,8 +31806,8 @@ function useOnAppear(callback) {
|
|
|
31610
31806
|
}
|
|
31611
31807
|
exports.useOnAppear = useOnAppear;
|
|
31612
31808
|
function useOverlayState({ blockDocumentScrolling = true, } = {}) {
|
|
31613
|
-
const [showOverlay, setShowOverlay,] =
|
|
31614
|
-
const callback =
|
|
31809
|
+
const [showOverlay, setShowOverlay,] = react_140.default.useState(false);
|
|
31810
|
+
const callback = react_140.default.useCallback((show) => {
|
|
31615
31811
|
setShowOverlay(show);
|
|
31616
31812
|
if (blockDocumentScrolling === false) {
|
|
31617
31813
|
return;
|
|
@@ -31623,7 +31819,7 @@ function useOverlayState({ blockDocumentScrolling = true, } = {}) {
|
|
|
31623
31819
|
document.documentElement.style.removeProperty('overflow');
|
|
31624
31820
|
}
|
|
31625
31821
|
}, [blockDocumentScrolling,]);
|
|
31626
|
-
|
|
31822
|
+
react_140.default.useEffect(() => () => {
|
|
31627
31823
|
if (blockDocumentScrolling === false) {
|
|
31628
31824
|
return;
|
|
31629
31825
|
}
|
|
@@ -31641,13 +31837,13 @@ function componentForRoute(route) {
|
|
|
31641
31837
|
if (!routeComponent) {
|
|
31642
31838
|
return;
|
|
31643
31839
|
}
|
|
31644
|
-
if (
|
|
31840
|
+
if (react_141.default.isValidElement(routeComponent)) {
|
|
31645
31841
|
return routeComponent;
|
|
31646
31842
|
}
|
|
31647
31843
|
if (withPreload(routeComponent)) {
|
|
31648
31844
|
yield routeComponent.preload();
|
|
31649
31845
|
}
|
|
31650
|
-
return
|
|
31846
|
+
return react_141.default.createElement(routeComponent, { key: route.path, });
|
|
31651
31847
|
});
|
|
31652
31848
|
}
|
|
31653
31849
|
var preloadKey2 = 'preload';
|
|
@@ -31658,7 +31854,7 @@ function usePrototypeNavigate({ preload, } = {}) {
|
|
|
31658
31854
|
const navigation = useNavigation();
|
|
31659
31855
|
const { getRoute, } = useRouter();
|
|
31660
31856
|
const onCanvas = useIsOnFramerCanvas();
|
|
31661
|
-
|
|
31857
|
+
react_141.default.useEffect(() => {
|
|
31662
31858
|
if (!navigation || onCanvas) {
|
|
31663
31859
|
return;
|
|
31664
31860
|
}
|
|
@@ -31693,7 +31889,7 @@ function usePrototypeNavigate({ preload, } = {}) {
|
|
|
31693
31889
|
const Component15 = typeof target === 'string'
|
|
31694
31890
|
? yield componentForRoute(getRoute == null ? void 0 : getRoute(target)).catch(() => {
|
|
31695
31891
|
})
|
|
31696
|
-
:
|
|
31892
|
+
: react_141.default.isValidElement(target)
|
|
31697
31893
|
? target
|
|
31698
31894
|
: null;
|
|
31699
31895
|
if (!Component15) {
|
|
@@ -32005,7 +32201,7 @@ function useQueryData(query) {
|
|
|
32005
32201
|
if (isDatabaseCollectionModule(query.from.data)) {
|
|
32006
32202
|
return useQueryDataWithQueryEngine(query);
|
|
32007
32203
|
}
|
|
32008
|
-
const queryRef = (0,
|
|
32204
|
+
const queryRef = (0, react_142.useRef)();
|
|
32009
32205
|
if (queryRef.current && isEqual(queryRef.current, query)) {
|
|
32010
32206
|
query = queryRef.current;
|
|
32011
32207
|
}
|
|
@@ -32022,6 +32218,11 @@ function useQueryData(query) {
|
|
|
32022
32218
|
return result;
|
|
32023
32219
|
}
|
|
32024
32220
|
exports.useQueryData = useQueryData;
|
|
32221
|
+
function useQueryCount(query) {
|
|
32222
|
+
const collection = useQueryData(query);
|
|
32223
|
+
return collection.length;
|
|
32224
|
+
}
|
|
32225
|
+
exports.useQueryCount = useQueryCount;
|
|
32025
32226
|
function evaluateExpression(expression, context) {
|
|
32026
32227
|
switch (expression.type) {
|
|
32027
32228
|
case 'Identifier':
|
|
@@ -32317,7 +32518,7 @@ exports.CycleVariantState = CycleVariantState;
|
|
|
32317
32518
|
function useVariantState({ variant, defaultVariant: externalDefaultVariant, transitions: externalTransitions, enabledGestures: externalEnabledGestures, cycleOrder: externalCycleOrder = [], variantProps: variantProps2 = {}, variantClassNames = {}, }) {
|
|
32318
32519
|
const forceUpdate = useForceUpdate3();
|
|
32319
32520
|
const validBaseVariants = useConstant2(() => new Set(externalCycleOrder));
|
|
32320
|
-
const internalState =
|
|
32521
|
+
const internalState = react_143.default.useRef({
|
|
32321
32522
|
isHovered: false,
|
|
32322
32523
|
isPressed: false,
|
|
32323
32524
|
baseVariant: safeBaseVariant(variant, externalDefaultVariant, validBaseVariants),
|
|
@@ -32331,14 +32532,14 @@ function useVariantState({ variant, defaultVariant: externalDefaultVariant, tran
|
|
|
32331
32532
|
cycleOrder: externalCycleOrder,
|
|
32332
32533
|
transitions: externalTransitions,
|
|
32333
32534
|
});
|
|
32334
|
-
const resolveNextVariant =
|
|
32535
|
+
const resolveNextVariant = react_143.default.useCallback((targetBaseVariant) => {
|
|
32335
32536
|
const { isHovered: isHovered2, isPressed: isPressed2, enabledGestures: enabledGestures2, defaultVariant: defaultVariant2, } = internalState.current;
|
|
32336
32537
|
const nextBaseVariant = safeBaseVariant(targetBaseVariant, defaultVariant2, validBaseVariants);
|
|
32337
32538
|
const gesture = getGesture(enabledGestures2 == null ? void 0 : enabledGestures2[nextBaseVariant], isHovered2, isPressed2);
|
|
32338
32539
|
const nextGestureVariant = gesture ? createGestureVariant(nextBaseVariant, gesture) : void 0;
|
|
32339
32540
|
return [nextBaseVariant, nextGestureVariant,];
|
|
32340
32541
|
}, [validBaseVariants,]);
|
|
32341
|
-
const setGestureState =
|
|
32542
|
+
const setGestureState = react_143.default.useCallback(({ isHovered: isHovered2, isPressed: isPressed2, }) => {
|
|
32342
32543
|
if (isHovered2 !== void 0) {
|
|
32343
32544
|
internalState.current.isHovered = isHovered2;
|
|
32344
32545
|
}
|
|
@@ -32353,7 +32554,7 @@ function useVariantState({ variant, defaultVariant: externalDefaultVariant, tran
|
|
|
32353
32554
|
forceUpdate();
|
|
32354
32555
|
}
|
|
32355
32556
|
}, [resolveNextVariant, forceUpdate,]);
|
|
32356
|
-
const setVariant =
|
|
32557
|
+
const setVariant = react_143.default.useCallback((proposedVariant) => {
|
|
32357
32558
|
const { defaultVariant: defaultVariant2, cycleOrder, baseVariant: baseVariant2, gestureVariant: gestureVariant2, } = internalState.current;
|
|
32358
32559
|
const nextBaseVariant = proposedVariant === CycleVariantState
|
|
32359
32560
|
? nextVariant(cycleOrder || [], baseVariant2 || defaultVariant2)
|
|
@@ -32375,7 +32576,7 @@ function useVariantState({ variant, defaultVariant: externalDefaultVariant, tran
|
|
|
32375
32576
|
}
|
|
32376
32577
|
const { baseVariant, gestureVariant, defaultVariant, enabledGestures, isHovered, isPressed, } = internalState.current;
|
|
32377
32578
|
const addVariantProps = useAddVariantProps(internalState.current.baseVariant, internalState.current.gestureVariant, variantProps2);
|
|
32378
|
-
return
|
|
32579
|
+
return react_143.default.useMemo(() => {
|
|
32379
32580
|
const variants = [];
|
|
32380
32581
|
if (baseVariant !== defaultVariant) {
|
|
32381
32582
|
variants.push(baseVariant);
|
|
@@ -32463,16 +32664,16 @@ function createInputOutputRanges2(transformTargets, threshold, exitTarget) {
|
|
|
32463
32664
|
}
|
|
32464
32665
|
return { inputRange: [0, Math.max(firstItem - 1, 0), ...inputRange,], outputRange: [-1, -1, ...outputRange,], };
|
|
32465
32666
|
}
|
|
32466
|
-
var withVariantAppearEffect = (Component15) =>
|
|
32667
|
+
var withVariantAppearEffect = (Component15) => react_144.default.forwardRef((props, forwardedRef) => {
|
|
32467
32668
|
if (RenderTarget.current() === 'CANVAS') {
|
|
32468
32669
|
return /* @__PURE__ */ (0, jsx_runtime_52.jsx)(Component15, Object.assign(Object.assign({}, props), { ref: forwardedRef }));
|
|
32469
32670
|
}
|
|
32470
|
-
const fallbackRef =
|
|
32671
|
+
const fallbackRef = react_144.default.useRef(null);
|
|
32471
32672
|
const ref = forwardedRef !== null && forwardedRef !== void 0 ? forwardedRef : fallbackRef;
|
|
32472
32673
|
const [options, rest,] = extractPrefixedProps(props, keys2);
|
|
32473
32674
|
const { visibleVariantId, obscuredVariantId, animateOnce, threshold, variantAppearEffectEnabled, targets, exitTarget, scrollDirection, } = options;
|
|
32474
|
-
const [activeVariant, setVariant,] =
|
|
32475
|
-
const animateState =
|
|
32675
|
+
const [activeVariant, setVariant,] = react_144.default.useState(obscuredVariantId);
|
|
32676
|
+
const animateState = react_144.default.useRef(false);
|
|
32476
32677
|
useAppearEffect(ref, (appears) => {
|
|
32477
32678
|
if (options.targets) {
|
|
32478
32679
|
return;
|
|
@@ -32500,7 +32701,7 @@ var withVariantAppearEffect = (Component15) => react_143.default.forwardRef((pro
|
|
|
32500
32701
|
y: threshold,
|
|
32501
32702
|
},
|
|
32502
32703
|
});
|
|
32503
|
-
|
|
32704
|
+
react_144.default.useEffect(() => {
|
|
32504
32705
|
if (scrollDirection) {
|
|
32505
32706
|
return;
|
|
32506
32707
|
}
|
|
@@ -32544,9 +32745,9 @@ var withVariantAppearEffect = (Component15) => react_143.default.forwardRef((pro
|
|
|
32544
32745
|
}
|
|
32545
32746
|
});
|
|
32546
32747
|
exports.withVariantAppearEffect = withVariantAppearEffect;
|
|
32547
|
-
var withVariantFX = (Component15) =>
|
|
32748
|
+
var withVariantFX = (Component15) => react_145.default.forwardRef((_f, forwardedRef) => {
|
|
32548
32749
|
var { initial, animate: animate3, exit } = _f, props = __rest(_f, ["initial", "animate", "exit"]);
|
|
32549
|
-
const ref = (0,
|
|
32750
|
+
const ref = (0, react_145.useRef)();
|
|
32550
32751
|
const effect = usePresenceAnimation({
|
|
32551
32752
|
initial,
|
|
32552
32753
|
animate: animate3,
|
|
@@ -32581,15 +32782,18 @@ var DeprecatedComponentContainer = /* @__PURE__ */ (() => {
|
|
|
32581
32782
|
});
|
|
32582
32783
|
}
|
|
32583
32784
|
componentDidCatch(error, info) {
|
|
32584
|
-
|
|
32785
|
+
var _a2;
|
|
32786
|
+
let stack = (_a2 = info.componentStack) == null ? void 0 : _a2.split('\n').filter((line) => line.length !== 0);
|
|
32585
32787
|
let currentIndex = 0;
|
|
32586
|
-
|
|
32587
|
-
|
|
32588
|
-
|
|
32788
|
+
if (stack) {
|
|
32789
|
+
for (const line of stack) {
|
|
32790
|
+
if (line.startsWith(` in ${this.constructor.name}`)) {
|
|
32791
|
+
break;
|
|
32792
|
+
}
|
|
32793
|
+
currentIndex++;
|
|
32589
32794
|
}
|
|
32590
|
-
currentIndex
|
|
32795
|
+
stack = stack.slice(0, currentIndex);
|
|
32591
32796
|
}
|
|
32592
|
-
stack = stack.slice(0, currentIndex);
|
|
32593
32797
|
this.setState({
|
|
32594
32798
|
lastError: {
|
|
32595
32799
|
children: this.props.children,
|
|
@@ -32627,7 +32831,7 @@ var DeprecatedComponentContainer = /* @__PURE__ */ (() => {
|
|
|
32627
32831
|
const { left, right, top, bottom, center, centerX, centerY, aspectRatio: aspectRatio2, parentSize, width, height, rotation, opacity, visible, _constraints, _initialStyle, name, positionSticky, positionStickyTop, positionStickyRight, positionStickyBottom, positionStickyLeft,
|
|
32628
32832
|
// Remove the children and the componentIdentifier from the props passed into the component
|
|
32629
32833
|
componentIdentifier: originalComponentIdentifier, children: originalChildren, style, duplicatedFrom, widthType, heightType } = frameProps, childProps = __rest(frameProps, ["left", "right", "top", "bottom", "center", "centerX", "centerY", "aspectRatio", "parentSize", "width", "height", "rotation", "opacity", "visible", "_constraints", "_initialStyle", "name", "positionSticky", "positionStickyTop", "positionStickyRight", "positionStickyBottom", "positionStickyLeft", "componentIdentifier", "children", "style", "duplicatedFrom", "widthType", "heightType"]);
|
|
32630
|
-
children =
|
|
32834
|
+
children = react_147.default.Children.map(originalChildren, (child) => {
|
|
32631
32835
|
if (!isReactChild(child) || !isReactElement(child)) {
|
|
32632
32836
|
return child;
|
|
32633
32837
|
}
|
|
@@ -32635,10 +32839,10 @@ var DeprecatedComponentContainer = /* @__PURE__ */ (() => {
|
|
|
32635
32839
|
return /* @__PURE__ */ (0, jsx_runtime_54.jsx)(LayoutGroup, {
|
|
32636
32840
|
inherit: false,
|
|
32637
32841
|
id: this.props.__layoutId,
|
|
32638
|
-
children: /* @__PURE__ */ (0, jsx_runtime_54.jsx)(AutomaticLayoutIds, { enabled: false, children:
|
|
32842
|
+
children: /* @__PURE__ */ (0, jsx_runtime_54.jsx)(AutomaticLayoutIds, { enabled: false, children: react_147.default.cloneElement(child, childProps), }),
|
|
32639
32843
|
});
|
|
32640
32844
|
}
|
|
32641
|
-
return
|
|
32845
|
+
return react_147.default.cloneElement(child, childProps);
|
|
32642
32846
|
});
|
|
32643
32847
|
frameProps = {
|
|
32644
32848
|
style,
|
|
@@ -32705,62 +32909,6 @@ function isPageOrScroll(identifier) {
|
|
|
32705
32909
|
}
|
|
32706
32910
|
return false;
|
|
32707
32911
|
}
|
|
32708
|
-
var Line = /* @__PURE__ */ (() => {
|
|
32709
|
-
function Line2(a, b) {
|
|
32710
|
-
return { a, b, };
|
|
32711
|
-
}
|
|
32712
|
-
Line2.intersection = (lineA, lineB) => {
|
|
32713
|
-
const x1 = lineA.a.x;
|
|
32714
|
-
const y1 = lineA.a.y;
|
|
32715
|
-
const x2 = lineA.b.x;
|
|
32716
|
-
const y2 = lineA.b.y;
|
|
32717
|
-
const x3 = lineB.a.x;
|
|
32718
|
-
const y3 = lineB.a.y;
|
|
32719
|
-
const x4 = lineB.b.x;
|
|
32720
|
-
const y4 = lineB.b.y;
|
|
32721
|
-
const d = (x1 - x2) * (y3 - y4) - (y1 - y2) * (x3 - x4);
|
|
32722
|
-
if (d === 0) {
|
|
32723
|
-
return null;
|
|
32724
|
-
}
|
|
32725
|
-
const xi = ((x3 - x4) * (x1 * y2 - y1 * x2) - (x1 - x2) * (x3 * y4 - y3 * x4)) / d;
|
|
32726
|
-
const yi = ((y3 - y4) * (x1 * y2 - y1 * x2) - (y1 - y2) * (x3 * y4 - y3 * x4)) / d;
|
|
32727
|
-
return { x: xi, y: yi, };
|
|
32728
|
-
};
|
|
32729
|
-
Line2.intersectionAngle = (lineA, lineB) => {
|
|
32730
|
-
const deltaAX = lineA.b.x - lineA.a.x;
|
|
32731
|
-
const deltaAY = lineA.b.y - lineA.a.y;
|
|
32732
|
-
const deltaBX = lineB.b.x - lineB.a.x;
|
|
32733
|
-
const deltaBY = lineB.b.y - lineB.a.y;
|
|
32734
|
-
const angle = Math.atan2(deltaAX * deltaBY - deltaAY * deltaBX, deltaAX * deltaBX + deltaAY * deltaBY);
|
|
32735
|
-
return angle * (180 / Math.PI);
|
|
32736
|
-
};
|
|
32737
|
-
Line2.isOrthogonal = (line) => {
|
|
32738
|
-
return line.a.x === line.b.x || line.a.y === line.b.y;
|
|
32739
|
-
};
|
|
32740
|
-
Line2.perpendicular = (line, pointOnLine) => {
|
|
32741
|
-
const deltaX = line.a.x - line.b.x;
|
|
32742
|
-
const deltaY = line.a.y - line.b.y;
|
|
32743
|
-
const pointB = Point(pointOnLine.x - deltaY, pointOnLine.y + deltaX);
|
|
32744
|
-
return Line2(pointB, pointOnLine);
|
|
32745
|
-
};
|
|
32746
|
-
Line2.projectPoint = (line, point2) => {
|
|
32747
|
-
const perp = Line2.perpendicular(line, point2);
|
|
32748
|
-
return Line2.intersection(line, perp);
|
|
32749
|
-
};
|
|
32750
|
-
Line2.pointAtPercentDistance = (line, distance2) => {
|
|
32751
|
-
const hypotenuse = Line2.distance(line);
|
|
32752
|
-
const r = distance2 * hypotenuse / hypotenuse;
|
|
32753
|
-
return {
|
|
32754
|
-
x: r * line.b.x + (1 - r) * line.a.x,
|
|
32755
|
-
y: r * line.b.y + (1 - r) * line.a.y,
|
|
32756
|
-
};
|
|
32757
|
-
};
|
|
32758
|
-
Line2.distance = (line) => {
|
|
32759
|
-
return Point.distance(line.a, line.b);
|
|
32760
|
-
};
|
|
32761
|
-
return Line2;
|
|
32762
|
-
})();
|
|
32763
|
-
exports.Line = Line;
|
|
32764
32912
|
function linearGradientLine(angle) {
|
|
32765
32913
|
var _a, _b;
|
|
32766
32914
|
const rad = angle * Math.PI / 180;
|
|
@@ -32917,9 +33065,9 @@ function imagePatternPropsForFill(fill, frame2, id3, includeTransform) {
|
|
|
32917
33065
|
return { id: imageId, path: (_l = fill.src) !== null && _l !== void 0 ? _l : '', transform: transform2, width, height, offsetX, offsetY, };
|
|
32918
33066
|
}
|
|
32919
33067
|
exports.imagePatternPropsForFill = imagePatternPropsForFill;
|
|
32920
|
-
var WindowContext = /* @__PURE__ */
|
|
33068
|
+
var WindowContext = /* @__PURE__ */ react_149.default.createContext(void 0);
|
|
32921
33069
|
exports.WindowContext = WindowContext;
|
|
32922
|
-
var useProvidedWindow = () =>
|
|
33070
|
+
var useProvidedWindow = () => react_149.default.useContext(WindowContext);
|
|
32923
33071
|
exports.useProvidedWindow = useProvidedWindow;
|
|
32924
33072
|
var mediaType2 = 'framer/asset-reference,';
|
|
32925
33073
|
function isAssetReference(value) {
|
|
@@ -33209,7 +33357,7 @@ function getSVGSize(svg) {
|
|
|
33209
33357
|
function SVG(props) {
|
|
33210
33358
|
const parentSize = useParentSize();
|
|
33211
33359
|
const layoutId = useLayoutId2(props);
|
|
33212
|
-
const layoutRef =
|
|
33360
|
+
const layoutRef = react_148.default.useRef(null);
|
|
33213
33361
|
const providedWindow = useProvidedWindow();
|
|
33214
33362
|
useMeasureLayout(props, layoutRef);
|
|
33215
33363
|
return /* @__PURE__ */ (0, jsx_runtime_56.jsx)(SVGComponent, Object.assign(Object.assign({}, props), { innerRef: layoutRef, parentSize,
|
|
@@ -33266,7 +33414,7 @@ function sizeSVG(container, props) {
|
|
|
33266
33414
|
svg.setAttribute('height', '100%');
|
|
33267
33415
|
}
|
|
33268
33416
|
function SVGStyleSheet() {
|
|
33269
|
-
|
|
33417
|
+
react_148.default.useInsertionEffect(() => {
|
|
33270
33418
|
injectComponentCSSRules();
|
|
33271
33419
|
}, []);
|
|
33272
33420
|
return null;
|
|
@@ -33276,7 +33424,7 @@ var SVGComponent = /* @__PURE__ */ (() => {
|
|
|
33276
33424
|
return _a = class extends Layer {
|
|
33277
33425
|
constructor() {
|
|
33278
33426
|
super(...arguments);
|
|
33279
|
-
__publicField(this, 'container',
|
|
33427
|
+
__publicField(this, 'container', react_148.default.createRef());
|
|
33280
33428
|
__publicField(this, 'svgElement', null);
|
|
33281
33429
|
__publicField(this, 'setSVGElement', (element) => {
|
|
33282
33430
|
this.svgElement = element;
|
|
@@ -34758,8 +34906,8 @@ exports.fontStore = fontStore;
|
|
|
34758
34906
|
Promise.allSettled = Promise.allSettled || ((promises) => Promise.all(promises.map((p) => p.then((v) => ({ status: 'fulfilled', value: v, })).catch((e) => ({ status: 'rejected', reason: e, })))));
|
|
34759
34907
|
function useFontLoadStatus(fontSelectors = [], timeout = 5e3) {
|
|
34760
34908
|
const missingFontSelectors = fontSelectors.filter((s) => !fontStore.isSelectorLoaded(s));
|
|
34761
|
-
const [fontLoadStatus, setFontLoadStatus,] =
|
|
34762
|
-
|
|
34909
|
+
const [fontLoadStatus, setFontLoadStatus,] = react_151.default.useState(missingFontSelectors.length ? 'loading' : 'done');
|
|
34910
|
+
react_151.default.useEffect(() => {
|
|
34763
34911
|
if (!missingFontSelectors.length) {
|
|
34764
34912
|
return;
|
|
34765
34913
|
}
|
|
@@ -34779,16 +34927,16 @@ function isShallowEqualArray(a, b) {
|
|
|
34779
34927
|
}
|
|
34780
34928
|
exports.isShallowEqualArray = isShallowEqualArray;
|
|
34781
34929
|
function TextStyleSheet() {
|
|
34782
|
-
|
|
34930
|
+
react_150.default.useInsertionEffect(() => {
|
|
34783
34931
|
injectComponentCSSRules();
|
|
34784
34932
|
}, []);
|
|
34785
34933
|
return null;
|
|
34786
34934
|
}
|
|
34787
|
-
var Text = /* @__PURE__ */
|
|
34935
|
+
var Text = /* @__PURE__ */ react_150.default.forwardRef(function Text2(props, forwardedRef) {
|
|
34788
34936
|
var _f, _j;
|
|
34789
34937
|
const parentSize = useParentSize();
|
|
34790
34938
|
const layoutId = useLayoutId2(props);
|
|
34791
|
-
const fallbackLayoutRef = (0,
|
|
34939
|
+
const fallbackLayoutRef = (0, react_150.useRef)(null);
|
|
34792
34940
|
const layoutRef = forwardedRef !== null && forwardedRef !== void 0 ? forwardedRef : fallbackLayoutRef;
|
|
34793
34941
|
const { navigate, getRoute, } = useRouter();
|
|
34794
34942
|
const currentRoute = useCurrentRoute();
|
|
@@ -34798,10 +34946,10 @@ var Text = /* @__PURE__ */ react_149.default.forwardRef(function Text2(props, fo
|
|
|
34798
34946
|
const fontLoadStatus = useFontLoadStatus(props.fonts);
|
|
34799
34947
|
useMeasureLayout(props, layoutRef);
|
|
34800
34948
|
const { fonts, __fromCanvasComponent, } = props;
|
|
34801
|
-
const prevFontsRef = (0,
|
|
34949
|
+
const prevFontsRef = (0, react_150.useRef)([]);
|
|
34802
34950
|
const fontsDidChange = !isShallowEqualArray((_j = prevFontsRef.current) !== null && _j !== void 0 ? _j : [], fonts !== null && fonts !== void 0 ? fonts : []);
|
|
34803
34951
|
prevFontsRef.current = fonts;
|
|
34804
|
-
(0,
|
|
34952
|
+
(0, react_150.useEffect)(() => {
|
|
34805
34953
|
if (!fontsDidChange || !fonts) {
|
|
34806
34954
|
return;
|
|
34807
34955
|
}
|
|
@@ -34816,7 +34964,7 @@ var Text = /* @__PURE__ */ react_149.default.forwardRef(function Text2(props, fo
|
|
|
34816
34964
|
});
|
|
34817
34965
|
}, [fonts,]);
|
|
34818
34966
|
const implicitPathVariables = useImplicitPathVariables();
|
|
34819
|
-
const interceptPageLinks =
|
|
34967
|
+
const interceptPageLinks = react_150.default.useCallback((event) => {
|
|
34820
34968
|
const anchorElement = findAnchorElement(event.target, layoutRef.current);
|
|
34821
34969
|
if (event.metaKey || !navigate || !anchorElement) {
|
|
34822
34970
|
return;
|
|
@@ -34826,13 +34974,13 @@ var Text = /* @__PURE__ */ react_149.default.forwardRef(function Text2(props, fo
|
|
|
34826
34974
|
event.preventDefault();
|
|
34827
34975
|
}
|
|
34828
34976
|
}, [navigate, implicitPathVariables,]);
|
|
34829
|
-
(0,
|
|
34977
|
+
(0, react_150.useEffect)(() => {
|
|
34830
34978
|
var _a;
|
|
34831
34979
|
(_a = layoutRef.current) == null ? void 0 : _a.addEventListener('click', interceptPageLinks);
|
|
34832
34980
|
const ref = layoutRef.current;
|
|
34833
34981
|
return () => ref == null ? void 0 : ref.removeEventListener('click', interceptPageLinks);
|
|
34834
34982
|
}, [interceptPageLinks,]);
|
|
34835
|
-
const rawHTML =
|
|
34983
|
+
const rawHTML = react_150.default.useMemo(() => {
|
|
34836
34984
|
if (!props.rawHTML || onCanvas || !getRoute || !currentRoute) {
|
|
34837
34985
|
return props.rawHTML;
|
|
34838
34986
|
}
|
|
@@ -35343,7 +35491,7 @@ function transformString(transform2) {
|
|
|
35343
35491
|
return result;
|
|
35344
35492
|
}
|
|
35345
35493
|
exports.transformString = transformString;
|
|
35346
|
-
var LinearGradientElement = class extends
|
|
35494
|
+
var LinearGradientElement = class extends react_152.Component {
|
|
35347
35495
|
render() {
|
|
35348
35496
|
const { id: id3, stops, x1, x2, y1, y2, } = this.props;
|
|
35349
35497
|
return /* @__PURE__ */ (0, jsx_runtime_58.jsx)('linearGradient', {
|
|
@@ -35358,7 +35506,7 @@ var LinearGradientElement = class extends react_151.Component {
|
|
|
35358
35506
|
});
|
|
35359
35507
|
}
|
|
35360
35508
|
};
|
|
35361
|
-
var RadialGradientElement = class extends
|
|
35509
|
+
var RadialGradientElement = class extends react_152.Component {
|
|
35362
35510
|
render() {
|
|
35363
35511
|
const { centerAnchorX, centerAnchorY, id: id3, widthFactor, heightFactor, stops, } = this.props;
|
|
35364
35512
|
return /* @__PURE__ */ (0, jsx_runtime_58.jsx)('radialGradient', {
|
|
@@ -35373,7 +35521,7 @@ var RadialGradientElement = class extends react_151.Component {
|
|
|
35373
35521
|
});
|
|
35374
35522
|
}
|
|
35375
35523
|
};
|
|
35376
|
-
var SVGRoot = class extends
|
|
35524
|
+
var SVGRoot = class extends react_153.Component {
|
|
35377
35525
|
render() {
|
|
35378
35526
|
const { children, frame: frame2, innerRef, } = this.props;
|
|
35379
35527
|
const { width, height, } = frame2;
|
|
@@ -35753,7 +35901,7 @@ var CanvasStore = _CanvasStore;
|
|
|
35753
35901
|
exports.CanvasStore = CanvasStore;
|
|
35754
35902
|
__publicField(CanvasStore, '__shared', null);
|
|
35755
35903
|
var builtInComponents = { Frame, Vector, Stack, VectorGroup, SVG, Text, DeprecatedComponentContainer, };
|
|
35756
|
-
var DesignComponent = class extends
|
|
35904
|
+
var DesignComponent = class extends react_146.Component {
|
|
35757
35905
|
_typeForName(name) {
|
|
35758
35906
|
const builtIn = asRecord(builtInComponents)[name];
|
|
35759
35907
|
if (builtIn) {
|
|
@@ -35801,7 +35949,7 @@ var DesignComponent = class extends react_145.Component {
|
|
|
35801
35949
|
}
|
|
35802
35950
|
const c = children && children.map((child) => this._renderData(child, componentProps, void 0));
|
|
35803
35951
|
children = children ? c : [];
|
|
35804
|
-
return
|
|
35952
|
+
return react_146.default.createElement(type, props, children);
|
|
35805
35953
|
}
|
|
35806
35954
|
render() {
|
|
35807
35955
|
asRecord(safeWindow)['__checkBudget__']();
|
|
@@ -35863,8 +36011,8 @@ function createDesignComponent(canvasStore, id3, propertyControls, width = 200,
|
|
|
35863
36011
|
if (!this.state.data && renderNode) {
|
|
35864
36012
|
asRecord(safeWindow)['__checkBudget__']();
|
|
35865
36013
|
const el = renderNode(nodeId);
|
|
35866
|
-
if (el &&
|
|
35867
|
-
return
|
|
36014
|
+
if (el && react_146.default.isValidElement(el) && typeof el.type !== 'string') {
|
|
36015
|
+
return react_146.default.createElement(WithOverride(el.type, this.props), el.props);
|
|
35868
36016
|
}
|
|
35869
36017
|
}
|
|
35870
36018
|
return super.render();
|
|
@@ -35887,7 +36035,7 @@ function createDesignComponent(canvasStore, id3, propertyControls, width = 200,
|
|
|
35887
36035
|
_a;
|
|
35888
36036
|
}
|
|
35889
36037
|
exports.createDesignComponent = createDesignComponent;
|
|
35890
|
-
var RenderNodeContext =
|
|
36038
|
+
var RenderNodeContext = react_146.default.createContext(null);
|
|
35891
36039
|
var RenderNodeProvider = RenderNodeContext.Provider;
|
|
35892
36040
|
exports.RenderNodeProvider = RenderNodeProvider;
|
|
35893
36041
|
var localPackageFallbackIdentifier = '|local|';
|
|
@@ -35896,16 +36044,58 @@ function CustomProperties({ children, customProperties, }) {
|
|
|
35896
36044
|
return /* @__PURE__ */ (0, jsx_runtime_63.jsx)('div', { style: customProperties, children, });
|
|
35897
36045
|
}
|
|
35898
36046
|
exports.CustomProperties = CustomProperties;
|
|
35899
|
-
var
|
|
36047
|
+
var FormContainer = (props) => {
|
|
36048
|
+
return /* @__PURE__ */ (0, jsx_runtime_64.jsx)(FrameWithMotion, Object.assign(Object.assign({}, props), { as: 'form' }));
|
|
36049
|
+
};
|
|
36050
|
+
exports.FormContainer = FormContainer;
|
|
36051
|
+
var FormButton = (props) => {
|
|
36052
|
+
var _f;
|
|
36053
|
+
const { __fromCanvasComponent, style: baseStyle2, } = props;
|
|
36054
|
+
const layoutId = useLayoutId2(props);
|
|
36055
|
+
const ref = (0, react_154.useRef)(null);
|
|
36056
|
+
const style = mergeWithDefaultStyle(baseStyle2 !== null && baseStyle2 !== void 0 ? baseStyle2 : {});
|
|
36057
|
+
const dataProps = {
|
|
36058
|
+
'data-layoutid': layoutId,
|
|
36059
|
+
};
|
|
36060
|
+
const isDisabled = Boolean(__fromCanvasComponent);
|
|
36061
|
+
useMeasureLayout(props, ref);
|
|
36062
|
+
return /* @__PURE__ */ (0, jsx_runtime_65.jsx)(motion.input, Object.assign(Object.assign({ type: props.type, disabled: isDisabled }, dataProps), { layoutId,
|
|
36063
|
+
ref, style: Object.assign(Object.assign({}, baseStyle2), style), value: (_f = props.value) !== null && _f !== void 0 ? _f : 'Submit' }));
|
|
36064
|
+
};
|
|
36065
|
+
exports.FormButton = FormButton;
|
|
36066
|
+
function mergeWithDefaultStyle(style) {
|
|
36067
|
+
return Object.assign({ display: 'block', padding: '12px', width: '100%', background: '#222', color: '#fff', borderRadius: '10px', border: '1px solid rgba(0,0,0,0.05)' }, style);
|
|
36068
|
+
}
|
|
36069
|
+
var FormPlainTextInput = (props) => {
|
|
36070
|
+
const { __fromCanvasComponent, } = props;
|
|
36071
|
+
const layoutId = useLayoutId2(props);
|
|
36072
|
+
const ref = (0, react_155.useRef)(null);
|
|
36073
|
+
const dataProps = {
|
|
36074
|
+
'data-layoutid': layoutId,
|
|
36075
|
+
};
|
|
36076
|
+
const isDisabled = Boolean(__fromCanvasComponent);
|
|
36077
|
+
useMeasureLayout(props, ref);
|
|
36078
|
+
const baseStyle2 = {
|
|
36079
|
+
padding: '12px',
|
|
36080
|
+
width: '100%',
|
|
36081
|
+
background: '#f5f5f5',
|
|
36082
|
+
borderRadius: '10px',
|
|
36083
|
+
border: '1px solid rgba(0,0,0,0.05)',
|
|
36084
|
+
};
|
|
36085
|
+
return /* @__PURE__ */ (0, jsx_runtime_66.jsx)(motion.input, Object.assign(Object.assign({ disabled: isDisabled }, dataProps), { layoutId,
|
|
36086
|
+
ref, style: Object.assign(Object.assign({}, baseStyle2), props.style), placeholder: props.placeholder }));
|
|
36087
|
+
};
|
|
36088
|
+
exports.FormPlainTextInput = FormPlainTextInput;
|
|
36089
|
+
var Image2 = /* @__PURE__ */ react_156.default.forwardRef(function Image3(props, ref) {
|
|
35900
36090
|
const { background, children, alt } = props, rest = __rest(props, ["background", "children", "alt"]);
|
|
35901
36091
|
const style = Object.assign({}, rest.style);
|
|
35902
36092
|
if (background) {
|
|
35903
36093
|
delete style.background;
|
|
35904
36094
|
}
|
|
35905
36095
|
const MotionComponent = htmlElementAsMotionComponent(props.as);
|
|
35906
|
-
return /* @__PURE__ */ (0,
|
|
36096
|
+
return /* @__PURE__ */ (0, jsx_runtime_67.jsxs)(MotionComponent, Object.assign(Object.assign({}, rest), { style,
|
|
35907
36097
|
ref, children: [
|
|
35908
|
-
background && /* @__PURE__ */ (0,
|
|
36098
|
+
background && /* @__PURE__ */ (0, jsx_runtime_67.jsx)(BackgroundImageComponent, { image: background, alt, }),
|
|
35909
36099
|
children,
|
|
35910
36100
|
] }));
|
|
35911
36101
|
});
|
|
@@ -36002,7 +36192,7 @@ var DeprecatedRichText = /* @__PURE__ */ React86.forwardRef(function Text3(props
|
|
|
36002
36192
|
const { id: id3, name, html, htmlFromDesign, text, textFromDesign, fonts = [], width, height, left, right, top, bottom, center, className, stylesPresetsClassName, visible = true, opacity, rotation = 0, verticalAlignment = 'top', isEditable = false, willChangeTransform, environment: environment2 = RenderTarget.current, withExternalLayout = false, positionSticky, positionStickyTop, positionStickyRight, positionStickyBottom, positionStickyLeft, __htmlStructure, __fromCanvasComponent = false, _forwardedOverrideId, _forwardedOverrides, _usesDOMRect, children } = props, rest = __rest(props, ["id", "name", "html", "htmlFromDesign", "text", "textFromDesign", "fonts", "width", "height", "left", "right", "top", "bottom", "center", "className", "stylesPresetsClassName", "visible", "opacity", "rotation", "verticalAlignment", "isEditable", "willChangeTransform", "environment", "withExternalLayout", "positionSticky", "positionStickyTop", "positionStickyRight", "positionStickyBottom", "positionStickyLeft", "__htmlStructure", "__fromCanvasComponent", "_forwardedOverrideId", "_forwardedOverrides", "_usesDOMRect", "children"]);
|
|
36003
36193
|
const parentSize = useParentSize();
|
|
36004
36194
|
const layoutId = useLayoutId2(props);
|
|
36005
|
-
const fallbackLayoutRef = (0,
|
|
36195
|
+
const fallbackLayoutRef = (0, react_158.useRef)(null);
|
|
36006
36196
|
const layoutRef = forwardedRef !== null && forwardedRef !== void 0 ? forwardedRef : fallbackLayoutRef;
|
|
36007
36197
|
const { navigate, getRoute, } = useRouter();
|
|
36008
36198
|
const currentRoute = useCurrentRoute();
|
|
@@ -36119,7 +36309,7 @@ var DeprecatedRichText = /* @__PURE__ */ React86.forwardRef(function Text3(props
|
|
|
36119
36309
|
forceLayerBackingWithCSSProperties(style);
|
|
36120
36310
|
}
|
|
36121
36311
|
Object.assign(style, props.style);
|
|
36122
|
-
return /* @__PURE__ */ (0,
|
|
36312
|
+
return /* @__PURE__ */ (0, jsx_runtime_68.jsx)(motion.div, Object.assign(Object.assign({ id: id3, ref: layoutRef }, rest), { style,
|
|
36123
36313
|
layoutId, 'data-framer-name': name, 'data-framer-component-type': 'DeprecatedRichText', 'data-center': center, className: cx(className, stylesPresetsClassName, richTextWrapperClassName), transformTemplate: template, dangerouslySetInnerHTML: { __html: innerHTMLWithReplacedFramerPageLinks, } }));
|
|
36124
36314
|
});
|
|
36125
36315
|
function convertVerticalAlignment2(verticalAlignment) {
|
|
@@ -36133,7 +36323,7 @@ function convertVerticalAlignment2(verticalAlignment) {
|
|
|
36133
36323
|
}
|
|
36134
36324
|
}
|
|
36135
36325
|
function useLoadFonts(fonts, fromCanvasComponent, containerRef) {
|
|
36136
|
-
const prevFontsRef = (0,
|
|
36326
|
+
const prevFontsRef = (0, react_158.useRef)([]);
|
|
36137
36327
|
if (!isShallowEqualArray(prevFontsRef.current, fonts)) {
|
|
36138
36328
|
prevFontsRef.current = fonts;
|
|
36139
36329
|
fontStore.loadFonts(fonts).then(({ newlyLoadedFontCount, }) => {
|
|
@@ -36146,9 +36336,9 @@ function useLoadFonts(fonts, fromCanvasComponent, containerRef) {
|
|
|
36146
36336
|
});
|
|
36147
36337
|
}
|
|
36148
36338
|
}
|
|
36149
|
-
var FitText = /* @__PURE__ */ (0,
|
|
36339
|
+
var FitText = /* @__PURE__ */ (0, react_157.forwardRef)((_f, ref) => {
|
|
36150
36340
|
var { viewBoxScale, viewBox, children } = _f, props = __rest(_f, ["viewBoxScale", "viewBox", "children"]);
|
|
36151
|
-
return /* @__PURE__ */ (0,
|
|
36341
|
+
return /* @__PURE__ */ (0, jsx_runtime_69.jsx)(motion.svg, Object.assign(Object.assign({ ref }, props), { viewBox, children: /* @__PURE__ */ (0, jsx_runtime_69.jsx)(motion.foreignObject, {
|
|
36152
36342
|
width: '100%',
|
|
36153
36343
|
height: '100%',
|
|
36154
36344
|
className: 'framer-fit-text',
|
|
@@ -36157,18 +36347,18 @@ var FitText = /* @__PURE__ */ (0, react_154.forwardRef)((_f, ref) => {
|
|
|
36157
36347
|
children,
|
|
36158
36348
|
}) }));
|
|
36159
36349
|
});
|
|
36160
|
-
var RichTextContainer = /* @__PURE__ */ (0,
|
|
36350
|
+
var RichTextContainer = /* @__PURE__ */ (0, react_157.forwardRef)((props, ref) => {
|
|
36161
36351
|
var _f;
|
|
36162
36352
|
const { __fromCanvasComponent = false, _forwardedOverrideId, _forwardedOverrides, _usesDOMRect, as, bottom, center, children, environment: environment2 = RenderTarget.current, fonts = [], height, isEditable = false, left, name, opacity, positionSticky, positionStickyBottom, positionStickyLeft, positionStickyRight, positionStickyTop, right, rotation = 0, style, _initialStyle, stylesPresetsClassNames, text: plainText, top, verticalAlignment = 'top', visible = true, width, willChangeTransform, withExternalLayout = false, viewBox, viewBoxScale = 1 } = props, rest = __rest(props, ["__fromCanvasComponent", "_forwardedOverrideId", "_forwardedOverrides", "_usesDOMRect", "as", "bottom", "center", "children", "environment", "fonts", "height", "isEditable", "left", "name", "opacity", "positionSticky", "positionStickyBottom", "positionStickyLeft", "positionStickyRight", "positionStickyTop", "right", "rotation", "style", "_initialStyle", "stylesPresetsClassNames", "text", "top", "verticalAlignment", "visible", "width", "willChangeTransform", "withExternalLayout", "viewBox", "viewBoxScale"]);
|
|
36163
36353
|
const parentSize = useParentSize();
|
|
36164
36354
|
const isOnCanvas = useIsOnFramerCanvas();
|
|
36165
|
-
const inCodeComponent = (0,
|
|
36355
|
+
const inCodeComponent = (0, react_157.useContext)(ComponentContainerContext);
|
|
36166
36356
|
const layoutId = useLayoutId2(props);
|
|
36167
|
-
const fallbackRef = (0,
|
|
36357
|
+
const fallbackRef = (0, react_157.useRef)(null);
|
|
36168
36358
|
const containerRef = ref !== null && ref !== void 0 ? ref : fallbackRef;
|
|
36169
36359
|
useMeasureLayout(props, containerRef);
|
|
36170
36360
|
useLoadFonts(fonts, __fromCanvasComponent, containerRef);
|
|
36171
|
-
(0,
|
|
36361
|
+
(0, react_157.useInsertionEffect)(() => {
|
|
36172
36362
|
injectComponentCSSRules();
|
|
36173
36363
|
}, []);
|
|
36174
36364
|
if (!visible) {
|
|
@@ -36190,8 +36380,9 @@ var RichTextContainer = /* @__PURE__ */ (0, react_154.forwardRef)((props, ref) =
|
|
|
36190
36380
|
const template = hasTransformTemplate ? (_f = props.transformTemplate) !== null && _f !== void 0 ? _f : transformTemplate(center) : void 0;
|
|
36191
36381
|
if (!withExternalLayout) {
|
|
36192
36382
|
if (frame2 && restrictedRenderTarget && !isAutoSized2) {
|
|
36193
|
-
|
|
36194
|
-
containerStyle.
|
|
36383
|
+
containerStyle.x = frame2.x;
|
|
36384
|
+
containerStyle.y = frame2.y;
|
|
36385
|
+
containerStyle.rotate = Animatable.getNumber(rotation);
|
|
36195
36386
|
containerStyle.width = frame2.width;
|
|
36196
36387
|
containerStyle.minWidth = frame2.width;
|
|
36197
36388
|
containerStyle.height = frame2.height;
|
|
@@ -36232,7 +36423,7 @@ var RichTextContainer = /* @__PURE__ */ (0, react_154.forwardRef)((props, ref) =
|
|
|
36232
36423
|
const Component15 = htmlElementAsMotionComponent(props.as);
|
|
36233
36424
|
if (isString22(props.viewBox)) {
|
|
36234
36425
|
if (props.as !== void 0) {
|
|
36235
|
-
return /* @__PURE__ */ (0,
|
|
36426
|
+
return /* @__PURE__ */ (0, jsx_runtime_69.jsx)(Component15, Object.assign(Object.assign({}, rest), { ref: containerRef, style: containerStyle, layoutId, transformTemplate: template, 'data-framer-name': name, 'data-framer-component-type': 'RichTextContainer', children: /* @__PURE__ */ (0, jsx_runtime_69.jsx)(FitText, {
|
|
36236
36427
|
viewBox,
|
|
36237
36428
|
viewBoxScale,
|
|
36238
36429
|
style: { width: '100%', height: '100%', },
|
|
@@ -36240,20 +36431,20 @@ var RichTextContainer = /* @__PURE__ */ (0, react_154.forwardRef)((props, ref) =
|
|
|
36240
36431
|
}) }));
|
|
36241
36432
|
}
|
|
36242
36433
|
else {
|
|
36243
|
-
return /* @__PURE__ */ (0,
|
|
36434
|
+
return /* @__PURE__ */ (0, jsx_runtime_69.jsx)(FitText, Object.assign(Object.assign({}, rest), { ref: containerRef, style: containerStyle, layoutId,
|
|
36244
36435
|
viewBox,
|
|
36245
36436
|
viewBoxScale, transformTemplate: template, 'data-framer-name': name, 'data-framer-component-type': 'RichTextContainer', children: children && styleRichTextChildren(children, stylesPresetsClassNames, plainText) }));
|
|
36246
36437
|
}
|
|
36247
36438
|
}
|
|
36248
|
-
return /* @__PURE__ */ (0,
|
|
36439
|
+
return /* @__PURE__ */ (0, jsx_runtime_69.jsx)(Component15, Object.assign(Object.assign({}, rest), { ref: containerRef, style: containerStyle, layoutId, transformTemplate: template, 'data-framer-name': name, 'data-framer-component-type': 'RichTextContainer', children: children && styleRichTextChildren(children, stylesPresetsClassNames, plainText) }));
|
|
36249
36440
|
});
|
|
36250
36441
|
function styleRichTextChildren(element, stylesPresetsClassNames, plainText) {
|
|
36251
|
-
let children =
|
|
36442
|
+
let children = react_157.Children.toArray(element.props.children);
|
|
36252
36443
|
if (isString22(plainText)) {
|
|
36253
36444
|
children = children.slice(0, 1);
|
|
36254
36445
|
}
|
|
36255
36446
|
children = children.map((child) => {
|
|
36256
|
-
if ((0,
|
|
36447
|
+
if ((0, react_157.isValidElement)(child)) {
|
|
36257
36448
|
return styleRichTextChildren(child, stylesPresetsClassNames, plainText);
|
|
36258
36449
|
}
|
|
36259
36450
|
if (isString22(plainText)) {
|
|
@@ -36267,9 +36458,9 @@ function styleRichTextChildren(element, stylesPresetsClassNames, plainText) {
|
|
|
36267
36458
|
const stylesPresetClassName = isString22(tag) ? stylesPresetsClassNames == null ? void 0 : stylesPresetsClassNames[tag] : void 0;
|
|
36268
36459
|
props.className = cx('framer-text', props.className, stylesPresetClassName);
|
|
36269
36460
|
}
|
|
36270
|
-
return (0,
|
|
36461
|
+
return (0, react_157.cloneElement)(element, props, ...children);
|
|
36271
36462
|
}
|
|
36272
|
-
var RichText = /* @__PURE__ */ (0,
|
|
36463
|
+
var RichText = /* @__PURE__ */ (0, react_157.forwardRef)((_f, ref) => {
|
|
36273
36464
|
var { children, html, htmlFromDesign } = _f, props = __rest(_f, ["children", "html", "htmlFromDesign"]);
|
|
36274
36465
|
const content = html || children || htmlFromDesign;
|
|
36275
36466
|
if (isString22(content)) {
|
|
@@ -36280,7 +36471,7 @@ var RichText = /* @__PURE__ */ (0, react_154.forwardRef)((_f, ref) => {
|
|
|
36280
36471
|
// We need to use the original prop name.
|
|
36281
36472
|
[isString22(html) ? 'html' : 'htmlFromDesign']: content,
|
|
36282
36473
|
};
|
|
36283
|
-
return /* @__PURE__ */ (0,
|
|
36474
|
+
return /* @__PURE__ */ (0, jsx_runtime_69.jsx)(DeprecatedRichText, Object.assign(Object.assign(Object.assign({}, props), contentProp), { ref }));
|
|
36284
36475
|
}
|
|
36285
36476
|
if (!props.stylesPresetsClassNames && isString22(props.stylesPresetsClassName)) {
|
|
36286
36477
|
const [h1, h2, h3, p, a,] = props.stylesPresetsClassName.split(' ');
|
|
@@ -36291,7 +36482,7 @@ var RichText = /* @__PURE__ */ (0, react_154.forwardRef)((_f, ref) => {
|
|
|
36291
36482
|
props.stylesPresetsClassNames = { h1, h2, h3, p, a, };
|
|
36292
36483
|
}
|
|
36293
36484
|
}
|
|
36294
|
-
return /* @__PURE__ */ (0,
|
|
36485
|
+
return /* @__PURE__ */ (0, jsx_runtime_69.jsx)(RichTextContainer, Object.assign(Object.assign({}, props), { ref, children: (0, react_157.isValidElement)(content) ? content : void 0 }));
|
|
36295
36486
|
});
|
|
36296
36487
|
exports.RichText = RichText;
|
|
36297
36488
|
var key6 = 'calculatedPaths';
|
|
@@ -36669,8 +36860,8 @@ function initialRouteComponent(component) {
|
|
|
36669
36860
|
function useInitialRouteComponent(routes, homeNodeId) {
|
|
36670
36861
|
var _a;
|
|
36671
36862
|
const InitialRouteComponent = (_a = routes[homeNodeId]) == null ? void 0 : _a.page;
|
|
36672
|
-
const [RouteComponent, setRouteComponent,] = (0,
|
|
36673
|
-
(0,
|
|
36863
|
+
const [RouteComponent, setRouteComponent,] = (0, react_159.useState)(initialRouteComponent(InitialRouteComponent));
|
|
36864
|
+
(0, react_159.useEffect)(() => {
|
|
36674
36865
|
if (withPreload(InitialRouteComponent)) {
|
|
36675
36866
|
InitialRouteComponent.preload().then(setRouteComponent);
|
|
36676
36867
|
}
|
|
@@ -36724,8 +36915,8 @@ var package_default = {
|
|
|
36724
36915
|
'@types/google.fonts': '1.0.3',
|
|
36725
36916
|
'@types/hsluv': 'https://github.com/framer/typed_hsluv#bump',
|
|
36726
36917
|
'@types/node': '^18.17.15',
|
|
36727
|
-
'@types/react': '^18.
|
|
36728
|
-
'@types/react-dom': '^18.
|
|
36918
|
+
'@types/react': '^18.2.67',
|
|
36919
|
+
'@types/react-dom': '^18.2.22',
|
|
36729
36920
|
'@types/yargs': '^17.0.19',
|
|
36730
36921
|
'@typescript-eslint/eslint-plugin': '^6.16.0',
|
|
36731
36922
|
'@typescript-eslint/parser': '^6.16.0',
|
|
@@ -36741,7 +36932,7 @@ var package_default = {
|
|
|
36741
36932
|
yargs: '^17.6.2',
|
|
36742
36933
|
},
|
|
36743
36934
|
peerDependencies: {
|
|
36744
|
-
'framer-motion': '11.0.
|
|
36935
|
+
'framer-motion': '11.0.11-sync.4',
|
|
36745
36936
|
react: '^18.2.0',
|
|
36746
36937
|
'react-dom': '^18.2.0',
|
|
36747
36938
|
},
|