@pyreon/elements 0.15.0 → 0.16.0

package/src/helpers/Wrapper/styled.ts

@@ -23,31 +23,25 @@ const parentFixCSS = `
   flex-direction: column;
 `
 
-const fullHeightCSS = `
-  height: 100%;
-`
-
-const blockCSS = `
-  align-self: stretch;
-  flex: 1;
-  min-width: 0;
-`
-
-const childFixPosition = (isBlock?: boolean) => `display: ${isBlock ? 'flex' : 'inline-flex'};`
-
-const styles: ResponsiveStylesCallback = ({ theme: t, css: cssFn }) => cssFn`
-  ${t.alignY === 'block' && fullHeightCSS};
-
+export const styles: ResponsiveStylesCallback = ({ theme: t, css: cssFn }) => cssFn`
   ${alignContent({
     direction: t.direction,
     alignX: t.alignX,
     alignY: t.alignY,
   })};
 
-  ${t.block && blockCSS};
-  ${t.alignY === 'block' && t.block && fullHeightCSS};
+  /*
+   * Always emit a value for the block-related properties so a responsive
+   * theme that flips from \`block: true\` at one breakpoint to \`block: false\`
+   * at another resets cleanly. Previously \`align-self\` / \`width\` / \`height\`
+   * were only set when the truthy branch matched, which left the prior
+   * breakpoint's values cascading through.
+   */
+  ${`align-self: ${t.block ? 'stretch' : 'auto'};
+     width: ${t.block ? '100%' : 'auto'};
+     height: ${t.alignY === 'block' ? '100%' : 'auto'};`};
 
-  ${!t.childFix && childFixPosition(t.block)};
+  ${!t.childFix && `display: ${t.block ? 'flex' : 'inline-flex'};`};
   ${t.parentFix && parentFixCSS};
 
   ${t.extraStyles && extendCss(t.extraStyles as Parameters<typeof extendCss>[0])};

package/src/index.ts

@@ -3,12 +3,16 @@ import { Provider } from '@pyreon/unistyle'
 export type { ElementProps, PyreonElement } from './Element'
 export { Element } from './Element'
 export type {
+  ChildrenProps as IteratorChildrenProps,
   ElementType,
   ExtendedProps,
+  LooseProps as IteratorLooseProps,
   MaybeNull,
+  ObjectProps as IteratorObjectProps,
   ObjectValue,
   Props as IteratorProps,
   PropsCallback,
+  SimpleProps as IteratorSimpleProps,
   SimpleValue,
 } from './helpers/Iterator'
 export { default as Iterator } from './helpers/Iterator'

package/src/types.ts

@@ -69,8 +69,39 @@ export type Responsive =
 
 export type ExtendCss = Css | Css[] | Partial<Record<BreakpointKeys, Css>>
 
-export type ExtractProps<TComponentOrTProps> =
-  TComponentOrTProps extends ComponentFn<infer TProps> ? TProps : TComponentOrTProps
+/**
+ * Extracts the props type from a Pyreon component function — multi-overload
+ * aware. Matches up to 4 call signatures and produces the UNION of their
+ * first-argument types. Iterator / List ship 3-overload primitives whose
+ * LAST overload is `ChildrenProps` (the loosest); without overload-aware
+ * extraction, `ExtractProps<Iterator>` returned just `ChildrenProps` and
+ * lost `SimpleProps<T>` / `ObjectProps<T>` shapes. Mirrors vitus-labs
+ * PR #222.
+ *
+ * Kept in sync with the copies in `@pyreon/core` / `@pyreon/attrs` /
+ * `@pyreon/rocketstyle`.
+ */
+export type ExtractProps<TComponentOrTProps> = TComponentOrTProps extends {
+  (props: infer P1, ...args: any): any
+  (props: infer P2, ...args: any): any
+  (props: infer P3, ...args: any): any
+  (props: infer P4, ...args: any): any
+}
+  ? P1 | P2 | P3 | P4
+  : TComponentOrTProps extends {
+        (props: infer P1, ...args: any): any
+        (props: infer P2, ...args: any): any
+        (props: infer P3, ...args: any): any
+      }
+    ? P1 | P2 | P3
+    : TComponentOrTProps extends {
+          (props: infer P1, ...args: any): any
+          (props: infer P2, ...args: any): any
+        }
+      ? P1 | P2
+      : TComponentOrTProps extends ComponentFn<infer TProps>
+        ? TProps
+        : TComponentOrTProps
 
 export type PyreonComponent<P extends Record<string, any> = {}> = ComponentFn<P> & PyreonStatic