@plumeria/core 19.14.4 → 20.0.0

package/lib/css.d.ts

@@ -7,6 +7,8 @@
  * 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 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>;
  * type use = (...rules: Style[]) => string;
@@ -31,6 +33,9 @@ declare module '@plumeria/core' {
     CreateStatic,
     Keyframes,
     ViewTransition,
+    PositionTry,
+    VarType,
+    CSSVariableKey,
     Marker,
     Extended,
   } from '#types';
@@ -69,6 +74,14 @@ declare module '@plumeria/core' {
     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;
+
   export const marker: marker;
   export type marker = (id: string, pseudo: string) => Marker;
 

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,79 @@ 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>'
+  | '<custom-ident>'
+  | '<image>'
+  | '<integer>'
+  | '<length>'
+  | '<length-percentage>'
+  | '<number>'
+  | '<percentage>'
+  | '<resolution>'
+  | '<string>'
+  | '<time>'
+  | '<transform-function>'
+  | '<transform-list>'
+  | '<url>'
+  | (string & {});
+
+type VarType =
+  | {
+      syntax: '*';
+      inherits?: boolean;
+      initialValue?: string;
+    }
+  | {
+      syntax: VarTypeSyntax;
+      inherits?: boolean;
+      initialValue: string;
+    };
+
 type StripColon<T extends string> = T extends `:${infer R}` ? StripColon<R> : T;
 
 type Extended<
@@ -179,6 +255,9 @@ export type {
   CreateStatic,
   Keyframes,
   ViewTransition,
+  PositionTry,
+  VarType,
+  CSSVariableKey,
   Marker,
   Extended,
 };

package/package.json

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