fiboui 1.0.0 → 1.0.2

package/README.md

@@ -1,101 +1,172 @@
-# FiboUI
+# 🏗️ FiboUI v1.0.0
 
-A Flutter/SwiftUI-inspired React UI framework with builder pattern and theme system.
+**A Flutter & SwiftUI-inspired React UI framework featuring a powerful Assembly Pattern and high-fidelity reactivity.**
 
-## Installation
+FiboUI brings the expressive, chainable syntax of modern mobile frameworks to React. Build complex, beautiful, and highly-performant UIs with **zero boilerplate** and **maximum readability**.
+
+---
+
+## ✨ Features
+
+- 🏗️ **The Assembly Pattern** - Components return builders for endless chaining.
+- ⚡ **Zero-Build Children** - Pass builders directly to `.children()`; they build implicitly.
+- 🔬 **Fine-Grained Reactivity** - Native support for Signals, Computed, and Observables.
+- 🎭 **Dynamic Multi-Theme** - Material, Cupertino, and Web themes with instant global switching.
+- 🎨 **Premium Aesthetics** - Built-in glassmorphism, micro-animations, and sleek dark modes.
+- 🔷 **100% Type-Safe** - Built with TypeScript for the best developer experience.
+
+---
+
+## 🚀 Installation
 
 ```bash
 npm install fiboui
 ```
 
-## Quick Start
+Import the styles in your main entry file:
 
 ```tsx
-import { FiboThemeProvider, Container, Text, Button, Row } from 'fiboui';
 import 'fiboui/dist/style.css';
+```
 
-function App() {
-  return (
-    <FiboThemeProvider theme="material">
-      {Container()
-        .padding("8")
-        .children([
-          Text("Hello FiboUI!")
-            .type("h1")
-            .fontSize(32)
-            .fontWeight("bold"),
-          
-          Row()
-            .spacing("4")
-            .children([
-              Button("Click me")
-                .variant("elevated")
-                .onPress(() => console.log("Clicked!")),
-              
-              Button("Outlined")
-                .variant("outlined")
-            ])
-        ])
-        .build()}
-    </FiboThemeProvider>
-  );
-}
+---
+
+## 🏗️ The Assembly Pattern
+
+### 1. Components as Builders
+Components return builder instances, allowing customization before rendering.
+
+```tsx
+StakentCard()
+  .className("p-8 hover:border-indigo-500/50")
+  .style({ backgroundColor: '#111' })
+  .children([ ... ])
+  .build()
 ```
 
-## Features
+### 2. Implicit Construction
+Builders in `.children()` are automatically finalized.
 
-- 🎨 **SwiftUI-Style Builder Pattern** - Chainable, expressive component composition
-- 🎭 **Multi-Theme System** - Material, Cupertino, and Web themes with dynamic switching
-- ⚡ **Tailwind CSS Integration** - Native Tailwind support with theme consistency
-- 📱 **Responsive Design** - Built-in responsive styling system
-- 🔷 **TypeScript-First** - Full type safety and IntelliSense support
+```tsx
+Column().children([
+  Text("Title").variant("h1"), 
+  Button("Action").onClick(handlePress)
+]).build()
+```
 
-## Themes
+---
 
-Switch between themes dynamically:
+## ⚡ Reactivity & State
 
+### Signals (Primitives)
 ```tsx
-import { useFiboTheme } from 'fiboui';
+const count = signal(0);
+
+Box()
+  .bindSignal(count)
+  .children([
+    Text(`Count: ${count.value}`),
+    Button("+").onPress(() => count.value++)
+  ])
+  .build()
+```
 
-function ThemeSwitcher() {
-  const { theme, setTheme } = useFiboTheme();
-  
-  return Row()
-    .spacing("md")
-    .children([
-      Button("Material").onPress(() => setTheme('material')),
-      Button("Cupertino").onPress(() => setTheme('cupertino')),
-      Button("Web").onPress(() => setTheme('web'))
+### Global Store
+```tsx
+const store = createStore({ theme: 'dark', user: 'John' });
+
+Box().observer().children([
+  Text(store.getState().user)
+])
+```
+
+---
+
+## 📱 Scaffold & Layout Shells
+
+The `Scaffold` and `DashboardLayout` components provide professional-grade app structures.
+
+```tsx
+import { Scaffold, Sidebar, Header, Text, StakentButton } from 'fiboui';
+
+Scaffold()
+  .header(
+    Header().height(80).className("px-6 bg-white shadow-sm").children([
+      Text("App Title").variant("h2"),
+      StakentButton({ text: "Profile", variant: "outline" })
     ])
-    .build();
-}
+  )
+  .sidebar(
+    Sidebar().width(240).children([
+       StakentSidebarItem({ label: "Home", active: true, icon: "home" }),
+       StakentSidebarItem({ label: "Settings", icon: "settings" })
+    ])
+  )
+  .fab(
+    Button("+").variant("fab").onPress(() => console.log("Added!"))
+  )
+  .children([
+    Text("Welcome to the main content area.")
+  ])
+  .build()
 ```
 
-## Components
+---
 
-### Layout
-- `Container` - Flexible container
-- `Row` - Horizontal layout
-- `Column` - Vertical layout
-- `Spacer` - Spacing element
-- `Center` - Centering wrapper
-- `Line` - Custom horizontal container
+## 🛒 Full Example: E-commerce Store
 
-### Content
-- `Text` - Text with typography styles
-- `Image` - Image with SwiftUI-like methods
+Combine **Signals**, **Store**, and **Builders** for a complete reactive application.
 
-### Interactive
-- `Button` - Button with variants
+```tsx
+import { signal, computed, createStore, Scaffold, Box, Text, Button, Badge, Row } from 'fiboui';
+
+// 1. Global Store
+const appStore = createStore({
+  cart: [],
+  products: [
+    { id: '1', name: 'MacBook Pro', price: 2499, image: '💻' },
+    { id: '2', name: 'iPhone 15', price: 999, image: '📱' }
+  ]
+});
+
+// 2. Reactive Computed Values
+const cartTotal = computed(() => {
+  const cart = appStore.getState().cart;
+  return cart.reduce((sum, item) => sum + item.price * item.quantity, 0);
+});
+
+// 3. UI Component
+export function EcommerceApp() {
+  return Scaffold()
+    .header(
+      Header().children([
+        Text('🛒 FiboShop').variant("h2"),
+        Row().children([
+          Text(`Total: $${cartTotal.value.toFixed(2)}`).bindSignal(cartTotal),
+          Badge().text(appStore.getState().cart.length.toString()).observer()
+        ])
+      ])
+    )
+    .children([
+      Grid().columns(2).gap("md").children(
+        appStore.getState().products.map(product => 
+          Card().children([
+            Text(product.image).fontSize(40),
+            Text(product.name).fontWeight("bold"),
+            Button(`Add $${product.price}`).onPress(() => {
+              // Update Store & Watch UI React!
+              appStore.setState(s => ({ cart: [...s.cart, { ...product, quantity: 1 }] }));
+            })
+          ])
+        )
+      )
+    ])
+    .build();
+}
+```
 
-### Structure
-- `Card` - Information card
-- `Banner` - Status banner
-- `List` - Icon-title-subtitle list
-- `Tags` - Badge tags
-- `Box` - Container wrapper
-- `Table` - Data table
+---
 
-## License
+## 📄 License
 
-MIT
+MIT © 2025 FiboUI

package/dist/content/Alert/index.d.ts

@@ -12,6 +12,35 @@ declare class AlertBuilder extends FiboBuilder {
     build(): ReactElement;
 }
 export declare const Alert: () => AlertBuilder & {
+    width: (value: import("csstype").Property.Width<string | number> | undefined) => AlertBuilder & /*elided*/ any;
+    height: (value: import("csstype").Property.Height<string | number> | undefined) => AlertBuilder & /*elided*/ any;
+    padding: (value: import("csstype").Property.Padding<string | number> | undefined) => AlertBuilder & /*elided*/ any;
+    margin: (value: import("csstype").Property.Margin<string | number> | undefined) => AlertBuilder & /*elided*/ any;
+    backgroundColor: (value: import("csstype").Property.BackgroundColor | undefined) => AlertBuilder & /*elided*/ any;
+    all: (value: import('csstype').Globals | undefined) => AlertBuilder & /*elided*/ any;
+    contain: (value: import("csstype").Property.Contain | undefined) => AlertBuilder & /*elided*/ any;
+    color: (value: import("csstype").Property.Color | undefined) => AlertBuilder & /*elided*/ any;
+    overlay: (value: import("csstype").Property.Overlay | undefined) => AlertBuilder & /*elided*/ any;
+    left: (value: import("csstype").Property.Left<string | number> | undefined) => AlertBuilder & /*elided*/ any;
+    right: (value: import("csstype").Property.Right<string | number> | undefined) => AlertBuilder & /*elided*/ any;
+    bottom: (value: import("csstype").Property.Bottom<string | number> | undefined) => AlertBuilder & /*elided*/ any;
+    top: (value: import("csstype").Property.Top<string | number> | undefined) => AlertBuilder & /*elided*/ any;
+    inset: (value: import("csstype").Property.Inset<string | number> | undefined) => AlertBuilder & /*elided*/ any;
+    page: (value: import("csstype").Property.Page | undefined) => AlertBuilder & /*elided*/ any;
+    content: (value: import("csstype").Property.Content | undefined) => AlertBuilder & /*elided*/ any;
+    flex: (value: import("csstype").Property.Flex<string | number> | undefined) => AlertBuilder & /*elided*/ any;
+    grid: (value: import("csstype").Property.Grid | undefined) => AlertBuilder & /*elided*/ any;
+    position: (value: import("csstype").Property.Position | undefined) => AlertBuilder & /*elided*/ any;
+    fill: (value: import("csstype").Property.Fill | undefined) => AlertBuilder & /*elided*/ any;
+    clip: (value: import("csstype").Property.Clip | undefined) => AlertBuilder & /*elided*/ any;
+    stroke: (value: import("csstype").Property.Stroke | undefined) => AlertBuilder & /*elided*/ any;
+    x: (value: import("csstype").Property.X<string | number> | undefined) => AlertBuilder & /*elided*/ any;
+    y: (value: import("csstype").Property.Y<string | number> | undefined) => AlertBuilder & /*elided*/ any;
+    caret: (value: import("csstype").Property.Caret | undefined) => AlertBuilder & /*elided*/ any;
+    zoom: (value: import("csstype").Property.Zoom | undefined) => AlertBuilder & /*elided*/ any;
+    clear: (value: import("csstype").Property.Clear | undefined) => AlertBuilder & /*elided*/ any;
+    border: (value: import("csstype").Property.Border<string | number> | undefined) => AlertBuilder & /*elided*/ any;
+    filter: (value: import("csstype").Property.Filter | undefined) => AlertBuilder & /*elided*/ any;
     accentColor: (value: import("csstype").Property.AccentColor | undefined) => AlertBuilder & /*elided*/ any;
     alignContent: (value: import("csstype").Property.AlignContent | undefined) => AlertBuilder & /*elided*/ any;
     alignItems: (value: import("csstype").Property.AlignItems | undefined) => AlertBuilder & /*elided*/ any;
@@ -39,7 +68,6 @@ export declare const Alert: () => AlertBuilder & {
     backgroundAttachment: (value: import("csstype").Property.BackgroundAttachment | undefined) => AlertBuilder & /*elided*/ any;
     backgroundBlendMode: (value: import("csstype").Property.BackgroundBlendMode | undefined) => AlertBuilder & /*elided*/ any;
     backgroundClip: (value: import("csstype").Property.BackgroundClip | undefined) => AlertBuilder & /*elided*/ any;
-    backgroundColor: (value: import("csstype").Property.BackgroundColor | undefined) => AlertBuilder & /*elided*/ any;
     backgroundImage: (value: import("csstype").Property.BackgroundImage | undefined) => AlertBuilder & /*elided*/ any;
     backgroundOrigin: (value: import("csstype").Property.BackgroundOrigin | undefined) => AlertBuilder & /*elided*/ any;
     backgroundPositionX: (value: import("csstype").Property.BackgroundPositionX<string | number> | undefined) => AlertBuilder & /*elided*/ any;
@@ -87,7 +115,6 @@ export declare const Alert: () => AlertBuilder & {
     borderTopRightRadius: (value: import("csstype").Property.BorderTopRightRadius<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     borderTopStyle: (value: import("csstype").Property.BorderTopStyle | undefined) => AlertBuilder & /*elided*/ any;
     borderTopWidth: (value: import("csstype").Property.BorderTopWidth<string | number> | undefined) => AlertBuilder & /*elided*/ any;
-    bottom: (value: import("csstype").Property.Bottom<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     boxDecorationBreak: (value: import("csstype").Property.BoxDecorationBreak | undefined) => AlertBuilder & /*elided*/ any;
     boxShadow: (value: import("csstype").Property.BoxShadow | undefined) => AlertBuilder & /*elided*/ any;
     boxSizing: (value: import("csstype").Property.BoxSizing | undefined) => AlertBuilder & /*elided*/ any;
@@ -97,10 +124,8 @@ export declare const Alert: () => AlertBuilder & {
     captionSide: (value: import("csstype").Property.CaptionSide | undefined) => AlertBuilder & /*elided*/ any;
     caretColor: (value: import("csstype").Property.CaretColor | undefined) => AlertBuilder & /*elided*/ any;
     caretShape: (value: import("csstype").Property.CaretShape | undefined) => AlertBuilder & /*elided*/ any;
-    clear: (value: import("csstype").Property.Clear | undefined) => AlertBuilder & /*elided*/ any;
     clipPath: (value: import("csstype").Property.ClipPath | undefined) => AlertBuilder & /*elided*/ any;
     clipRule: (value: import("csstype").Property.ClipRule | undefined) => AlertBuilder & /*elided*/ any;
-    color: (value: import("csstype").Property.Color | undefined) => AlertBuilder & /*elided*/ any;
     colorAdjust: (value: import("csstype").Property.PrintColorAdjust | undefined) => AlertBuilder & /*elided*/ any;
     colorInterpolationFilters: (value: import("csstype").Property.ColorInterpolationFilters | undefined) => AlertBuilder & /*elided*/ any;
     colorScheme: (value: import("csstype").Property.ColorScheme | undefined) => AlertBuilder & /*elided*/ any;
@@ -112,14 +137,12 @@ export declare const Alert: () => AlertBuilder & {
     columnRuleWidth: (value: import("csstype").Property.ColumnRuleWidth<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     columnSpan: (value: import("csstype").Property.ColumnSpan | undefined) => AlertBuilder & /*elided*/ any;
     columnWidth: (value: import("csstype").Property.ColumnWidth<string | number> | undefined) => AlertBuilder & /*elided*/ any;
-    contain: (value: import("csstype").Property.Contain | undefined) => AlertBuilder & /*elided*/ any;
     containIntrinsicBlockSize: (value: import("csstype").Property.ContainIntrinsicBlockSize<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     containIntrinsicHeight: (value: import("csstype").Property.ContainIntrinsicHeight<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     containIntrinsicInlineSize: (value: import("csstype").Property.ContainIntrinsicInlineSize<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     containIntrinsicWidth: (value: import("csstype").Property.ContainIntrinsicWidth<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     containerName: (value: import("csstype").Property.ContainerName | undefined) => AlertBuilder & /*elided*/ any;
     containerType: (value: import("csstype").Property.ContainerType | undefined) => AlertBuilder & /*elided*/ any;
-    content: (value: import("csstype").Property.Content | undefined) => AlertBuilder & /*elided*/ any;
     contentVisibility: (value: import("csstype").Property.ContentVisibility | undefined) => AlertBuilder & /*elided*/ any;
     counterIncrement: (value: import("csstype").Property.CounterIncrement | undefined) => AlertBuilder & /*elided*/ any;
     counterReset: (value: import("csstype").Property.CounterReset | undefined) => AlertBuilder & /*elided*/ any;
@@ -133,10 +156,8 @@ export declare const Alert: () => AlertBuilder & {
     dominantBaseline: (value: import("csstype").Property.DominantBaseline | undefined) => AlertBuilder & /*elided*/ any;
     emptyCells: (value: import("csstype").Property.EmptyCells | undefined) => AlertBuilder & /*elided*/ any;
     fieldSizing: (value: import("csstype").Property.FieldSizing | undefined) => AlertBuilder & /*elided*/ any;
-    fill: (value: import("csstype").Property.Fill | undefined) => AlertBuilder & /*elided*/ any;
     fillOpacity: (value: import("csstype").Property.FillOpacity | undefined) => AlertBuilder & /*elided*/ any;
     fillRule: (value: import("csstype").Property.FillRule | undefined) => AlertBuilder & /*elided*/ any;
-    filter: (value: import("csstype").Property.Filter | undefined) => AlertBuilder & /*elided*/ any;
     flexBasis: (value: import("csstype").Property.FlexBasis<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     flexDirection: (value: import("csstype").Property.FlexDirection | undefined) => AlertBuilder & /*elided*/ any;
     flexGrow: (value: import("csstype").Property.FlexGrow | undefined) => AlertBuilder & /*elided*/ any;
@@ -183,7 +204,6 @@ export declare const Alert: () => AlertBuilder & {
     gridTemplateColumns: (value: import("csstype").Property.GridTemplateColumns<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     gridTemplateRows: (value: import("csstype").Property.GridTemplateRows<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     hangingPunctuation: (value: import("csstype").Property.HangingPunctuation | undefined) => AlertBuilder & /*elided*/ any;
-    height: (value: import("csstype").Property.Height<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     hyphenateCharacter: (value: import("csstype").Property.HyphenateCharacter | undefined) => AlertBuilder & /*elided*/ any;
     hyphenateLimitChars: (value: import("csstype").Property.HyphenateLimitChars | undefined) => AlertBuilder & /*elided*/ any;
     hyphens: (value: import("csstype").Property.Hyphens | undefined) => AlertBuilder & /*elided*/ any;
@@ -203,7 +223,6 @@ export declare const Alert: () => AlertBuilder & {
     justifyItems: (value: import("csstype").Property.JustifyItems | undefined) => AlertBuilder & /*elided*/ any;
     justifySelf: (value: import("csstype").Property.JustifySelf | undefined) => AlertBuilder & /*elided*/ any;
     justifyTracks: (value: import("csstype").Property.JustifyTracks | undefined) => AlertBuilder & /*elided*/ any;
-    left: (value: import("csstype").Property.Left<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     letterSpacing: (value: import("csstype").Property.LetterSpacing<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     lightingColor: (value: import("csstype").Property.LightingColor | undefined) => AlertBuilder & /*elided*/ any;
     lineBreak: (value: import("csstype").Property.LineBreak | undefined) => AlertBuilder & /*elided*/ any;
@@ -281,7 +300,6 @@ export declare const Alert: () => AlertBuilder & {
     overflowWrap: (value: import("csstype").Property.OverflowWrap | undefined) => AlertBuilder & /*elided*/ any;
     overflowX: (value: import("csstype").Property.OverflowX | undefined) => AlertBuilder & /*elided*/ any;
     overflowY: (value: import("csstype").Property.OverflowY | undefined) => AlertBuilder & /*elided*/ any;
-    overlay: (value: import("csstype").Property.Overlay | undefined) => AlertBuilder & /*elided*/ any;
     overscrollBehaviorBlock: (value: import("csstype").Property.OverscrollBehaviorBlock | undefined) => AlertBuilder & /*elided*/ any;
     overscrollBehaviorInline: (value: import("csstype").Property.OverscrollBehaviorInline | undefined) => AlertBuilder & /*elided*/ any;
     overscrollBehaviorX: (value: import("csstype").Property.OverscrollBehaviorX | undefined) => AlertBuilder & /*elided*/ any;
@@ -294,12 +312,10 @@ export declare const Alert: () => AlertBuilder & {
     paddingLeft: (value: import("csstype").Property.PaddingLeft<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     paddingRight: (value: import("csstype").Property.PaddingRight<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     paddingTop: (value: import("csstype").Property.PaddingTop<string | number> | undefined) => AlertBuilder & /*elided*/ any;
-    page: (value: import("csstype").Property.Page | undefined) => AlertBuilder & /*elided*/ any;
     paintOrder: (value: import("csstype").Property.PaintOrder | undefined) => AlertBuilder & /*elided*/ any;
     perspective: (value: import("csstype").Property.Perspective<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     perspectiveOrigin: (value: import("csstype").Property.PerspectiveOrigin<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     pointerEvents: (value: import("csstype").Property.PointerEvents | undefined) => AlertBuilder & /*elided*/ any;
-    position: (value: import("csstype").Property.Position | undefined) => AlertBuilder & /*elided*/ any;
     positionAnchor: (value: import("csstype").Property.PositionAnchor | undefined) => AlertBuilder & /*elided*/ any;
     positionArea: (value: import("csstype").Property.PositionArea | undefined) => AlertBuilder & /*elided*/ any;
     positionTryFallbacks: (value: import("csstype").Property.PositionTryFallbacks | undefined) => AlertBuilder & /*elided*/ any;
@@ -309,7 +325,6 @@ export declare const Alert: () => AlertBuilder & {
     quotes: (value: import("csstype").Property.Quotes | undefined) => AlertBuilder & /*elided*/ any;
     r: (value: import("csstype").Property.R<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     resize: (value: import("csstype").Property.Resize | undefined) => AlertBuilder & /*elided*/ any;
-    right: (value: import("csstype").Property.Right<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     rotate: (value: import("csstype").Property.Rotate | undefined) => AlertBuilder & /*elided*/ any;
     rowGap: (value: import("csstype").Property.RowGap<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     rubyAlign: (value: import("csstype").Property.RubyAlign | undefined) => AlertBuilder & /*elided*/ any;
@@ -356,7 +371,6 @@ export declare const Alert: () => AlertBuilder & {
     speakAs: (value: import("csstype").Property.SpeakAs | undefined) => AlertBuilder & /*elided*/ any;
     stopColor: (value: import("csstype").Property.StopColor | undefined) => AlertBuilder & /*elided*/ any;
     stopOpacity: (value: import("csstype").Property.StopOpacity | undefined) => AlertBuilder & /*elided*/ any;
-    stroke: (value: import("csstype").Property.Stroke | undefined) => AlertBuilder & /*elided*/ any;
     strokeColor: (value: import("csstype").Property.StrokeColor | undefined) => AlertBuilder & /*elided*/ any;
     strokeDasharray: (value: import("csstype").Property.StrokeDasharray<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     strokeDashoffset: (value: import("csstype").Property.StrokeDashoffset<string | number> | undefined) => AlertBuilder & /*elided*/ any;
@@ -398,7 +412,6 @@ export declare const Alert: () => AlertBuilder & {
     textWrapMode: (value: import("csstype").Property.TextWrapMode | undefined) => AlertBuilder & /*elided*/ any;
     textWrapStyle: (value: import("csstype").Property.TextWrapStyle | undefined) => AlertBuilder & /*elided*/ any;
     timelineScope: (value: import("csstype").Property.TimelineScope | undefined) => AlertBuilder & /*elided*/ any;
-    top: (value: import("csstype").Property.Top<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     touchAction: (value: import("csstype").Property.TouchAction | undefined) => AlertBuilder & /*elided*/ any;
     transform: (value: import("csstype").Property.Transform | undefined) => AlertBuilder & /*elided*/ any;
     transformBox: (value: import("csstype").Property.TransformBox | undefined) => AlertBuilder & /*elided*/ any;
@@ -423,22 +436,16 @@ export declare const Alert: () => AlertBuilder & {
     whiteSpace: (value: import("csstype").Property.WhiteSpace | undefined) => AlertBuilder & /*elided*/ any;
     whiteSpaceCollapse: (value: import("csstype").Property.WhiteSpaceCollapse | undefined) => AlertBuilder & /*elided*/ any;
     widows: (value: import("csstype").Property.Widows | undefined) => AlertBuilder & /*elided*/ any;
-    width: (value: import("csstype").Property.Width<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     willChange: (value: import("csstype").Property.WillChange | undefined) => AlertBuilder & /*elided*/ any;
     wordBreak: (value: import("csstype").Property.WordBreak | undefined) => AlertBuilder & /*elided*/ any;
     wordSpacing: (value: import("csstype").Property.WordSpacing<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     wordWrap: (value: import("csstype").Property.WordWrap | undefined) => AlertBuilder & /*elided*/ any;
     writingMode: (value: import("csstype").Property.WritingMode | undefined) => AlertBuilder & /*elided*/ any;
-    x: (value: import("csstype").Property.X<string | number> | undefined) => AlertBuilder & /*elided*/ any;
-    y: (value: import("csstype").Property.Y<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     zIndex: (value: import("csstype").Property.ZIndex | undefined) => AlertBuilder & /*elided*/ any;
-    zoom: (value: import("csstype").Property.Zoom | undefined) => AlertBuilder & /*elided*/ any;
-    all: (value: import('csstype').Globals | undefined) => AlertBuilder & /*elided*/ any;
     animation: (value: import("csstype").Property.Animation<string & {}> | undefined) => AlertBuilder & /*elided*/ any;
     animationRange: (value: import("csstype").Property.AnimationRange<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     background: (value: import("csstype").Property.Background<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     backgroundPosition: (value: import("csstype").Property.BackgroundPosition<string | number> | undefined) => AlertBuilder & /*elided*/ any;
-    border: (value: import("csstype").Property.Border<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     borderBlock: (value: import("csstype").Property.BorderBlock<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     borderBlockColor: (value: import("csstype").Property.BorderBlockColor | undefined) => AlertBuilder & /*elided*/ any;
     borderBlockEnd: (value: import("csstype").Property.BorderBlockEnd<string | number> | undefined) => AlertBuilder & /*elided*/ any;
@@ -460,26 +467,21 @@ export declare const Alert: () => AlertBuilder & {
     borderStyle: (value: import("csstype").Property.BorderStyle | undefined) => AlertBuilder & /*elided*/ any;
     borderTop: (value: import("csstype").Property.BorderTop<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     borderWidth: (value: import("csstype").Property.BorderWidth<string | number> | undefined) => AlertBuilder & /*elided*/ any;
-    caret: (value: import("csstype").Property.Caret | undefined) => AlertBuilder & /*elided*/ any;
     columnRule: (value: import("csstype").Property.ColumnRule<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     columns: (value: import("csstype").Property.Columns<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     containIntrinsicSize: (value: import("csstype").Property.ContainIntrinsicSize<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     container: (value: import("csstype").Property.Container | undefined) => AlertBuilder & /*elided*/ any;
-    flex: (value: import("csstype").Property.Flex<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     flexFlow: (value: import("csstype").Property.FlexFlow | undefined) => AlertBuilder & /*elided*/ any;
     font: (value: import("csstype").Property.Font | undefined) => AlertBuilder & /*elided*/ any;
     gap: (value: import("csstype").Property.Gap<string | number> | undefined) => AlertBuilder & /*elided*/ any;
-    grid: (value: import("csstype").Property.Grid | undefined) => AlertBuilder & /*elided*/ any;
     gridArea: (value: import("csstype").Property.GridArea | undefined) => AlertBuilder & /*elided*/ any;
     gridColumn: (value: import("csstype").Property.GridColumn | undefined) => AlertBuilder & /*elided*/ any;
     gridRow: (value: import("csstype").Property.GridRow | undefined) => AlertBuilder & /*elided*/ any;
     gridTemplate: (value: import("csstype").Property.GridTemplate | undefined) => AlertBuilder & /*elided*/ any;
-    inset: (value: import("csstype").Property.Inset<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     insetBlock: (value: import("csstype").Property.InsetBlock<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     insetInline: (value: import("csstype").Property.InsetInline<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     lineClamp: (value: import("csstype").Property.LineClamp | undefined) => AlertBuilder & /*elided*/ any;
     listStyle: (value: import("csstype").Property.ListStyle | undefined) => AlertBuilder & /*elided*/ any;
-    margin: (value: import("csstype").Property.Margin<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     marginBlock: (value: import("csstype").Property.MarginBlock<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     marginInline: (value: import("csstype").Property.MarginInline<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     mask: (value: import("csstype").Property.Mask<string | number> | undefined) => AlertBuilder & /*elided*/ any;
@@ -489,7 +491,6 @@ export declare const Alert: () => AlertBuilder & {
     outline: (value: import("csstype").Property.Outline<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     overflow: (value: import("csstype").Property.Overflow | undefined) => AlertBuilder & /*elided*/ any;
     overscrollBehavior: (value: import("csstype").Property.OverscrollBehavior | undefined) => AlertBuilder & /*elided*/ any;
-    padding: (value: import("csstype").Property.Padding<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     paddingBlock: (value: import("csstype").Property.PaddingBlock<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     paddingInline: (value: import("csstype").Property.PaddingInline<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     placeContent: (value: import("csstype").Property.PlaceContent | undefined) => AlertBuilder & /*elided*/ any;
@@ -767,7 +768,6 @@ export declare const Alert: () => AlertBuilder & {
     boxOrdinalGroup: (value: import("csstype").Property.BoxOrdinalGroup | undefined) => AlertBuilder & /*elided*/ any;
     boxOrient: (value: import("csstype").Property.BoxOrient | undefined) => AlertBuilder & /*elided*/ any;
     boxPack: (value: import("csstype").Property.BoxPack | undefined) => AlertBuilder & /*elided*/ any;
-    clip: (value: import("csstype").Property.Clip | undefined) => AlertBuilder & /*elided*/ any;
     fontStretch: (value: import("csstype").Property.FontStretch | undefined) => AlertBuilder & /*elided*/ any;
     gridColumnGap: (value: import("csstype").Property.GridColumnGap<string | number> | undefined) => AlertBuilder & /*elided*/ any;
     gridGap: (value: import("csstype").Property.GridGap<string | number> | undefined) => AlertBuilder & /*elided*/ any;