@plumeria/core 19.15.0 → 21.0.0

package/README.md

@@ -124,16 +124,18 @@ Explore the [documentation](https://plumeria.dev/) for the core principles, full
 
 Plumeria publishes frequently. To make that legible, every public API is rated for **future** change likelihood — not past churn. The rating is a commitment about what will happen next, not a description of what already has.
 
-| API                    | Stability |        |
-| ---------------------- | --------- | ------ |
-| `css.create`           | ★★★★★     | Frozen |
-| `css.createTheme`      | ★★★★★     | Frozen |
-| `css.createStatic`     | ★★★★★     | Frozen |
-| `css.keyframes`        | ★★★★★     | Frozen |
-| `css.viewTransition`   | ★★★★★     | Frozen |
-| `css.marker`           | ★★★★☆     | Stable |
-| `css.extended`         | ★★★★☆     | Stable |
-| `css.use`/`classStyle` | ★★★★★     | Frozen |
+| API                       | Stability |        |
+| ------------------------- | --------- | ------ |
+| `css.create`              | ★★★★★     | Frozen |
+| `css.createTheme`         | ★★★★★     | Frozen |
+| `css.createStatic`        | ★★★★★     | Frozen |
+| `css.keyframes`           | ★★★★★     | Frozen |
+| `css.viewTransitionClass` | ★★★★★     | Frozen |
+| `css.positionTry`         | ★★★★☆     | Stable |
+| `css.varType`             | ★★★★☆     | Stable |
+| `css.marker`              | ★★★★☆     | Stable |
+| `css.extended`            | ★★★★☆     | Stable |
+| `css.use`/`classStyle`    | ★★★★★     | Frozen |
 
 > The **`classStyle`** can be renamed via configuration
 

package/lib/css.d.ts

@@ -6,7 +6,8 @@
  * type createTheme = <const T extends CreateTheme>(themeSelector: CreateThemeSelector, rule: T) => CreateThemeReturnType<T>;
  * type createStatic = <const T extends CreateStatic>(rule: T)=> T;
  * type keyframes = <const T extends Keyframes>(rule: T) => string;
- * type viewTransition = <const T extends ViewTransition>(rule: T) => string;
+ * type viewTransitionClass = <const T extends ViewTransition>(rule: T) => string;
+ * type positionTry = <const T extends PositionTry>(rule: T) => CSSVariableKey;
  * type varType = <const T extends VarType>(rule: T) => CSSVariableKey;
  * type marker = (id: string, pseudo: string) => Marker;
  * type extended = <I extends string, P extends string>(id: I, pseudo: P) => Extended<I, P>;
@@ -32,6 +33,7 @@ declare module '@plumeria/core' {
     CreateStatic,
     Keyframes,
     ViewTransition,
+    PositionTry,
     VarType,
     CSSVariableKey,
     Marker,
@@ -67,11 +69,16 @@ declare module '@plumeria/core' {
   export const keyframes: keyframes;
   export type keyframes = <const T extends Keyframes>(rule: T) => string;
 
-  export const viewTransition: viewTransition;
-  export type viewTransition = <const T extends ViewTransition>(
+  export const viewTransitionClass: viewTransitionClass;
+  export type viewTransitionClass = <const T extends ViewTransition>(
     rule: T,
   ) => string;
 
+  export const positionTry: positionTry;
+  export type positionTry = <const T extends PositionTry>(
+    rule: T,
+  ) => CSSVariableKey;
+
   export const varType: varType;
   export type varType = <const T extends VarType>(rule: T) => CSSVariableKey;
 

package/lib/types.d.ts

@@ -24,8 +24,11 @@ type ColonSelector = {
   [key in ColonString]: CommonProperties | CSSVariableProperty;
 };
 
-type AtKeyword = '@media' | '@container' | '@supports' | '@layer' | '@scope';
-type AtRule = `${AtKeyword} ${string}` | `${AtKeyword}(${string}`;
+type AtKeyword = '@media' | '@container' | '@supports';
+type AtRule =
+  | `${AtKeyword} ${string}`
+  | `${AtKeyword}(${string}`
+  | '@starting-style';
 
 type StyleKey = keyof CSSTypes;
 type NestedKey = ColonString | ArrayString | AtRule;
@@ -152,6 +155,49 @@ type ViewTransition = {
   old?: CSSProperties;
 };
 
+type PositionTryProperty =
+  | 'positionAnchor'
+  | 'positionArea'
+  | 'inset'
+  | 'insetBlock'
+  | 'insetBlockStart'
+  | 'insetBlockEnd'
+  | 'insetInline'
+  | 'insetInlineStart'
+  | 'insetInlineEnd'
+  | 'top'
+  | 'right'
+  | 'bottom'
+  | 'left'
+  | 'placeSelf'
+  | 'alignSelf'
+  | 'justifySelf'
+  | 'inlineSize'
+  | 'minInlineSize'
+  | 'maxInlineSize'
+  | 'width'
+  | 'minWidth'
+  | 'maxWidth'
+  | 'blockSize'
+  | 'minBlockSize'
+  | 'maxBlockSize'
+  | 'height'
+  | 'minHeight'
+  | 'maxHeight'
+  | 'margin'
+  | 'marginBlock'
+  | 'marginBlockStart'
+  | 'marginBlockEnd'
+  | 'marginInline'
+  | 'marginInlineStart'
+  | 'marginInlineEnd'
+  | 'marginTop'
+  | 'marginRight'
+  | 'marginBottom'
+  | 'marginLeft';
+
+type PositionTry = Pick<CommonProperties, PositionTryProperty>;
+
 type VarTypeSyntax =
   | '<angle>'
   | '<color>'
@@ -209,6 +255,7 @@ export type {
   CreateStatic,
   Keyframes,
   ViewTransition,
+  PositionTry,
   VarType,
   CSSVariableKey,
   Marker,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plumeria/core",
-  "version": "19.15.0",
+  "version": "21.0.0",
   "description": "Zero-cost abstraction layer for styling React components.",
   "author": "Refirst 11",
   "license": "MIT",