Skip to content
This repository has been archived by the owner on Dec 11, 2023. It is now read-only.

Commit

Permalink
fix: driver component
Browse files Browse the repository at this point in the history
  • Loading branch information
ankit-tailor committed Oct 5, 2023
1 parent 963317d commit 116c304
Show file tree
Hide file tree
Showing 2 changed files with 39 additions and 36 deletions.
14 changes: 8 additions & 6 deletions packages/animation-resolver/src/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -172,7 +172,7 @@ export class AnimationResolver implements IStyledPlugin {
AnimatedComponent.isAnimatedComponent = true;
}
if (!AnimatedComponent) {
AnimatedComponent = React.Fragment;
AnimatedComponent = Component;
}

// this.#childrenExitPropsMap = deepClone(styledObj);
Expand All @@ -186,12 +186,13 @@ export class AnimationResolver implements IStyledPlugin {
resolvedAnimatedProps
);

if (shouldUpdateConfig) {
// @ts-ignore
return [styledObj, shouldUpdateConfig, _, AnimatedComponent];
}
// if (shouldUpdateConfig) {
// // @ts-ignore
// return [styledObj, shouldUpdateConfig, _, AnimatedComponent];
// }

// @ts-ignore

return [
resolvedStyledObjectWithAnimatedProps,
shouldUpdateConfig,
Expand Down Expand Up @@ -245,7 +246,7 @@ export class AnimationResolver implements IStyledPlugin {
setObjectKeyValue(resolvedStyledObject, keyPath, value);
keyPath.pop();
keyPath.pop();
delete styledObject[prop];
// delete styledObject[prop];
}

if (animatedPropMap && animatedPropMap[prop]) {
Expand Down Expand Up @@ -332,6 +333,7 @@ export class AnimationResolver implements IStyledPlugin {
? // @ts-ignore
resolvedAnimatedStyledWithStyledObject?.props
: {};

return (
<Component
{...animatedProps}
Expand Down
61 changes: 31 additions & 30 deletions packages/react/src/styled.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -974,6 +974,7 @@ export function verboseStyled<P, Variants, ComCon>(

let CONFIG: any = {};
let isInjected = false;
let plugins: any = [];

const containsDescendant =
componentStyleConfig?.descendantStyle &&
Expand Down Expand Up @@ -1052,6 +1053,8 @@ export function verboseStyled<P, Variants, ComCon>(
EXTENDED_THEME
);

// const resolvedComponentExtendedTheme = EXTENDED_THEME;

theme = deepMerge(theme, resolvedComponentExtendedTheme.theme);

// @ts-ignore
Expand All @@ -1072,6 +1075,7 @@ export function verboseStyled<P, Variants, ComCon>(
styleIds,
resolvedComponentExtendedTheme?.verbosedStyleIds
);

const extendedStylesToBeInjected = GluestackStyleSheet.resolve(
resolvedComponentExtendedTheme?.styledIds,
CONFIG,
Expand All @@ -1082,23 +1086,21 @@ export function verboseStyled<P, Variants, ComCon>(
}

if (CONFIG.plugins) {
// move inside stylehash created
// let plugins = [...getInstalledPlugins()];

// merge compnent plugins

// console.log(EXTENDED_THEME, '>>>>>');

// if (CONFIG?.plugins) {
// // @ts-ignore
// plugins = [...plugins, ...CONFIG?.plugins];
// }
plugins.push(...CONFIG.plugins);
}
if (ExtendedConfig?.plugins) {
plugins.push(...ExtendedConfig?.plugins);
}

for (const pluginName in CONFIG.plugins) {
if (plugins) {
for (const pluginName in plugins) {
// @ts-ignore
[theme, , , Component] = CONFIG.plugins[
pluginName
]?.inputMiddleWare<P>(theme, true, true, Component);
[theme, , , Component] = plugins[pluginName]?.inputMiddleWare<P>(
theme,
true,
true,
Component
);
}
}

Expand Down Expand Up @@ -1910,36 +1912,35 @@ export function verboseStyled<P, Variants, ComCon>(
</Component>
);
}

if (containsDescendant) {
return (
<AncestorStyleContext.Provider value={descendantCSSIds}>
{component}
</AncestorStyleContext.Provider>
);
}
// }

if (CONFIG.plugins) {
let StyledComponent = component;
let styledComponent = component;
if (plugins) {
// plugins?.reverse();
for (const pluginName in CONFIG.plugins) {
plugins.reverse();
for (const pluginName in plugins) {
// @ts-ignore
if (CONFIG.plugins[pluginName]?.componentMiddleWare) {
if (plugins[pluginName]?.componentMiddleWare) {
// @ts-ignore
StyledComponent = CONFIG.plugins[pluginName]?.componentMiddleWare({
styledComponent = plugins[pluginName]?.componentMiddleWare({
Component: component,
theme,
componentStyleConfig,
ExtendedConfig,
});
}
}
}

return StyledComponent;
if (containsDescendant) {
return (
<AncestorStyleContext.Provider value={descendantCSSIds}>
{styledComponent}
</AncestorStyleContext.Provider>
);
}

return component;
return styledComponent;
};

const StyledComp = React.forwardRef(StyledComponent);
Expand Down

0 comments on commit 116c304

Please sign in to comment.