@qwickapps/react-framework 1.8.1 → 1.9.1

package/dist/palettes/manifest.json

@@ -1,6 +1,6 @@
 {
   "$schema": "./manifest.schema.json",
-  "version": "1.8.1",
+  "version": "1.9.1",
   "palettes": [
     {
       "id": "default",
@@ -8,11 +8,11 @@
       "description": "Classic blue and neutral color scheme - the original QwickApps palette",
       "author": "QwickApps",
       "license": "PolyForm-Shield-1.0.0",
-      "version": "1.8.1",
-      "file": "palette-default.1.8.1.css",
+      "version": "1.9.1",
+      "file": "palette-default.1.9.1.css",
       "primaryColor": "#007bff",
       "inlined": true,
-      "fileMinified": "palette-default.1.8.1.min.css",
+      "fileMinified": "palette-default.1.9.1.min.css",
       "fileLatest": "palette-default.latest.css",
       "fileLatestMinified": "palette-default.latest.min.css"
     },
@@ -22,11 +22,11 @@
       "description": "Warm oranges, golden yellows, and earthy browns - inspired by fall foliage",
       "author": "QwickApps",
       "license": "PolyForm-Shield-1.0.0",
-      "version": "1.8.1",
-      "file": "palette-autumn.1.8.1.css",
+      "version": "1.9.1",
+      "file": "palette-autumn.1.9.1.css",
       "primaryColor": "#ea580c",
       "inlined": false,
-      "fileMinified": "palette-autumn.1.8.1.min.css",
+      "fileMinified": "palette-autumn.1.9.1.min.css",
       "fileLatest": "palette-autumn.latest.css",
       "fileLatestMinified": "palette-autumn.latest.min.css"
     },
@@ -36,11 +36,11 @@
       "description": "Sophisticated teal, bronze, and navy - perfect for premium retail and fashion brands",
       "author": "QwickApps",
       "license": "PolyForm-Shield-1.0.0",
-      "version": "1.8.1",
-      "file": "palette-boutique.1.8.1.css",
+      "version": "1.9.1",
+      "file": "palette-boutique.1.9.1.css",
       "primaryColor": "#3ca6b6",
       "inlined": false,
-      "fileMinified": "palette-boutique.1.8.1.min.css",
+      "fileMinified": "palette-boutique.1.9.1.min.css",
       "fileLatest": "palette-boutique.latest.css",
       "fileLatestMinified": "palette-boutique.latest.min.css"
     },
@@ -50,11 +50,11 @@
       "description": "Modern purple gradient for creative and tech brands - inspired by cosmic nebulae",
       "author": "QwickApps",
       "license": "PolyForm-Shield-1.0.0",
-      "version": "1.8.1",
-      "file": "palette-cosmic.1.8.1.css",
+      "version": "1.9.1",
+      "file": "palette-cosmic.1.9.1.css",
       "primaryColor": "#8b5cf6",
       "inlined": false,
-      "fileMinified": "palette-cosmic.1.8.1.min.css",
+      "fileMinified": "palette-cosmic.1.9.1.min.css",
       "fileLatest": "palette-cosmic.latest.css",
       "fileLatestMinified": "palette-cosmic.latest.min.css"
     },
@@ -64,11 +64,11 @@
       "description": "Deep blues, aqua teals, and seafoam greens - inspired by ocean depths",
       "author": "QwickApps",
       "license": "PolyForm-Shield-1.0.0",
-      "version": "1.8.1",
-      "file": "palette-ocean.1.8.1.css",
+      "version": "1.9.1",
+      "file": "palette-ocean.1.9.1.css",
       "primaryColor": "#0891b2",
       "inlined": false,
-      "fileMinified": "palette-ocean.1.8.1.min.css",
+      "fileMinified": "palette-ocean.1.9.1.min.css",
       "fileLatest": "palette-ocean.latest.css",
       "fileLatestMinified": "palette-ocean.latest.min.css"
     },
@@ -78,11 +78,11 @@
       "description": "Fresh greens, soft pinks, and bright yellows - inspired by spring blooms",
       "author": "QwickApps",
       "license": "PolyForm-Shield-1.0.0",
-      "version": "1.8.1",
-      "file": "palette-spring.1.8.1.css",
+      "version": "1.9.1",
+      "file": "palette-spring.1.9.1.css",
       "primaryColor": "#16a34a",
       "inlined": false,
-      "fileMinified": "palette-spring.1.8.1.min.css",
+      "fileMinified": "palette-spring.1.9.1.min.css",
       "fileLatest": "palette-spring.latest.css",
       "fileLatestMinified": "palette-spring.latest.min.css"
     },
@@ -92,11 +92,11 @@
       "description": "Cool blues, icy whites, and frosty grays - inspired by winter landscapes",
       "author": "QwickApps",
       "license": "PolyForm-Shield-1.0.0",
-      "version": "1.8.1",
-      "file": "palette-winter.1.8.1.css",
+      "version": "1.9.1",
+      "file": "palette-winter.1.9.1.css",
       "primaryColor": "#0077be",
       "inlined": false,
-      "fileMinified": "palette-winter.1.8.1.min.css",
+      "fileMinified": "palette-winter.1.9.1.min.css",
       "fileLatest": "palette-winter.latest.css",
       "fileLatestMinified": "palette-winter.latest.min.css"
     }

package/dist/schemas/FormFieldSchema.d.ts

@@ -18,6 +18,7 @@ export declare class FormFieldModel extends ViewSchema {
     multiline?: boolean;
     rows?: number;
     placeholder?: string;
+    name?: string;
 }
 export default FormFieldModel;
 //# sourceMappingURL=FormFieldSchema.d.ts.map

package/dist/schemas/FormFieldSchema.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FormFieldSchema.d.ts","sourceRoot":"","sources":["../../src/schemas/FormFieldSchema.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAGH,OAAO,kBAAkB,CAAC;AAE1B,OAAO,UAAU,MAAM,cAAc,CAAC;AAEtC,qBACa,cAAe,SAAQ,UAAU;IAS5C,KAAK,EAAG,MAAM,CAAC;IAUf,KAAK,EAAG,MAAM,GAAG,MAAM,CAAC;IAUxB,IAAI,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,UAAU,GAAG,OAAO,GAAG,KAAK,CAAC;IAWxD,UAAU,CAAC,EAAE,MAAM,CAAC;IAUpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAUnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAUnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAWnB,aAAa,CAAC,EAAE,MAAM,CAAC;IAUvB,SAAS,CAAC,EAAE,OAAO,CAAC;IAUpB,SAAS,CAAC,EAAE,OAAO,CAAC;IAYpB,IAAI,CAAC,EAAE,MAAM,CAAC;IAWd,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,eAAe,cAAc,CAAC"}
+{"version":3,"file":"FormFieldSchema.d.ts","sourceRoot":"","sources":["../../src/schemas/FormFieldSchema.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAGH,OAAO,kBAAkB,CAAC;AAE1B,OAAO,UAAU,MAAM,cAAc,CAAC;AAEtC,qBACa,cAAe,SAAQ,UAAU;IAS5C,KAAK,EAAG,MAAM,CAAC;IAUf,KAAK,EAAG,MAAM,GAAG,MAAM,CAAC;IAUxB,IAAI,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,UAAU,GAAG,OAAO,GAAG,KAAK,CAAC;IAWxD,UAAU,CAAC,EAAE,MAAM,CAAC;IAUpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAUnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAUnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAWnB,aAAa,CAAC,EAAE,MAAM,CAAC;IAUvB,SAAS,CAAC,EAAE,OAAO,CAAC;IAUpB,SAAS,CAAC,EAAE,OAAO,CAAC;IAYpB,IAAI,CAAC,EAAE,MAAM,CAAC;IAWd,WAAW,CAAC,EAAE,MAAM,CAAC;IAWrB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,eAAe,cAAc,CAAC"}

package/dist/schemas/FormSelectSchema.d.ts

@@ -15,6 +15,7 @@ export declare class FormSelectModel extends ViewSchema {
     fullWidth?: boolean;
     size?: 'small' | 'medium';
     placeholder?: string;
+    name?: string;
 }
 export default FormSelectModel;
 //# sourceMappingURL=FormSelectSchema.d.ts.map

package/dist/schemas/FormSelectSchema.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FormSelectSchema.d.ts","sourceRoot":"","sources":["../../src/schemas/FormSelectSchema.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAGH,OAAO,kBAAkB,CAAC;AAE1B,OAAO,UAAU,MAAM,cAAc,CAAC;AAEtC,qBACa,eAAgB,SAAQ,UAAU;IAU7C,KAAK,CAAC,EAAE,MAAM,CAAC;IAUf,KAAK,EAAG,MAAM,GAAG,MAAM,CAAC;IAUxB,OAAO,EAAG,MAAM,CAAC;IAWjB,UAAU,CAAC,EAAE,MAAM,CAAC;IAUpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAUnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAUnB,SAAS,CAAC,EAAE,OAAO,CAAC;IAUpB,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAW1B,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,eAAe,eAAe,CAAC"}
+{"version":3,"file":"FormSelectSchema.d.ts","sourceRoot":"","sources":["../../src/schemas/FormSelectSchema.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAGH,OAAO,kBAAkB,CAAC;AAE1B,OAAO,UAAU,MAAM,cAAc,CAAC;AAEtC,qBACa,eAAgB,SAAQ,UAAU;IAU7C,KAAK,CAAC,EAAE,MAAM,CAAC;IAUf,KAAK,EAAG,MAAM,GAAG,MAAM,CAAC;IAUxB,OAAO,EAAG,MAAM,CAAC;IAWjB,UAAU,CAAC,EAAE,MAAM,CAAC;IAUpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAUnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAUnB,SAAS,CAAC,EAAE,OAAO,CAAC;IAUpB,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAW1B,WAAW,CAAC,EAAE,MAAM,CAAC;IAWrB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,eAAe,eAAe,CAAC"}

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@qwickapps/react-framework",
-  "version": "1.8.1",
+  "version": "1.9.1",
   "description": "Complete React framework with responsive navigation, flexible layouts, theming system, and reusable components for building modern applications.",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",
   "types": "dist/index.d.ts",
   "bin": {
-    "create": "./scripts/create-qwickapps-project.js"
+    "create": "scripts/create-qwickapps-project.js"
   },
   "exports": {
     ".": {
@@ -37,6 +37,24 @@
     "scripts",
     "QUICK_START_GUIDE.md"
   ],
+  "scripts": {
+    "build": "rollup -c && npm run build-palettes",
+    "build-palettes": "node scripts/build-palettes.cjs",
+    "build:dev": "NODE_ENV=development rollup -c && npm run build-palettes",
+    "build:prod": "NODE_ENV=production STRIP_LOGS=true rollup -c && npm run build-palettes",
+    "dev": "rollup -c -w",
+    "test": "jest",
+    "test:watch": "jest --watch",
+    "test:coverage": "jest --coverage",
+    "clean": "rm -rf dist node_modules .rollup.cache storybook-static",
+    "create-project": "node scripts/create-qwickapps-project.js",
+    "validate:clean-install": "./qa/clean-install/validate.sh",
+    "prepublishOnly": "npm run build && npm run validate:clean-install",
+    "publish": "npm publish",
+    "publish:palettes": "../../products/qwickapps/anvil/publish-palettes.sh",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build"
+  },
   "keywords": [
     "react",
     "framework",
@@ -162,23 +180,7 @@
   },
   "repository": {
     "type": "git",
-    "url": "https://github.com/qwickapps/react-framework.git"
+    "url": "git+https://github.com/qwickapps/react-framework.git"
   },
-  "homepage": "https://github.com/qwickapps/react-framework#readme",
-  "scripts": {
-    "build": "rollup -c && npm run build-palettes",
-    "build-palettes": "node scripts/build-palettes.cjs",
-    "build:dev": "NODE_ENV=development rollup -c && npm run build-palettes",
-    "build:prod": "NODE_ENV=production STRIP_LOGS=true rollup -c && npm run build-palettes",
-    "dev": "rollup -c -w",
-    "test": "jest",
-    "test:watch": "jest --watch",
-    "test:coverage": "jest --coverage",
-    "clean": "rm -rf dist node_modules .rollup.cache storybook-static",
-    "create-project": "node scripts/create-qwickapps-project.js",
-    "validate:clean-install": "./qa/clean-install/validate.sh",
-    "publish:palettes": "../../products/qwickapps/anvil/publish-palettes.sh",
-    "storybook": "storybook dev -p 6006",
-    "build-storybook": "storybook build"
-  }
-}
+  "homepage": "https://github.com/qwickapps/react-framework#readme"
+}

package/src/components/Html.tsx

@@ -137,7 +137,13 @@ function HtmlView({
           ...styleProps.sx
         }}
       >
-        {components}
+        {Array.isArray(components)
+          ? components.map((child, idx) =>
+              React.isValidElement(child) && child.key == null
+                ? React.cloneElement(child as ReactElement, { key: `html-child-${idx}` })
+                : child
+            )
+          : components}
       </Box>
     );
 

package/src/components/Logo.tsx

@@ -233,7 +233,7 @@ function LogoView({
       setCalculatedBadgePosition(badgePos);
       setSvgWidth(requiredWidth);
     }
-  }, [name, badge, badgeOffset, calculateBadgePosition, fontSize, height, parseNameParts, svgWidth]);
+  }, [name, badge, badgeOffset, calculateBadgePosition, fontSize, height, parseNameParts]);
   
   // Determine CSS class for variant
   let variantClass = '';

package/src/components/Scaffold.css

@@ -458,6 +458,9 @@
   background: var(--scaffold-background);
   transition: padding 0.3s ease;
   box-sizing: border-box;
+  /* Establish stacking context below app bar to prevent content bleed-through on scroll (GH-1) */
+  position: relative;
+  z-index: 1;
 }
 
 /* =================== ANIMATIONS =================== */

package/src/components/forms/FormField.tsx

@@ -40,6 +40,8 @@ export interface FormFieldProps extends ViewProps, SchemaProps<typeof FormFieldM
   endAdornment?: React.ReactNode;
   /** Additional input props */
   inputProps?: unknown;
+  /** Show error state styling */
+  error?: boolean;
 }
 
 /**
@@ -60,9 +62,11 @@ function FormFieldView({
   multiline = false,
   rows,
   placeholder,
+  name,
   startAdornment,
   endAdornment,
   inputProps,
+  error,
   // Exclude ViewProps that conflict with MUI FormControl types
   margin: _margin,
   marginTop: _marginTop,
@@ -128,6 +132,7 @@ function FormFieldView({
   return (
     <FormControl
       fullWidth={fullWidth}
+      error={error}
       {...restProps}
     >
       <InputLabel htmlFor={fieldId} sx={labelStyles} shrink>
@@ -136,6 +141,7 @@ function FormFieldView({
 
       <Input
         id={fieldId}
+        name={name}
         type={type}
         value={value}
         onChange={handleChange}

package/src/components/forms/FormSelect.tsx

@@ -38,6 +38,8 @@ export interface FormSelectProps extends ViewProps, SchemaProps<typeof FormSelec
   onChange: (value: string | number) => void;
   /** Options array (runtime prop, overrides schema) */
   options: FormSelectOption[];
+  /** Show error state styling */
+  error?: boolean;
 }
 
 /**
@@ -54,6 +56,8 @@ function FormSelectView({
   fullWidth = true,
   size = 'small',
   placeholder,
+  name,
+  error,
   // Exclude ViewProps that conflict with MUI FormControl types
   margin: _margin,
   marginTop: _marginTop,
@@ -99,6 +103,7 @@ function FormSelectView({
     <FormControl
       fullWidth={fullWidth}
       size={size}
+      error={error}
       {...restProps}
     >
       {label && (
@@ -108,6 +113,7 @@ function FormSelectView({
       )}
 
       <Select
+        name={name}
         value={value}
         onChange={handleChange}
         disabled={disabled}

package/src/schemas/FormFieldSchema.ts

@@ -135,6 +135,17 @@ export class FormFieldModel extends ViewSchema {
   @IsOptional()
   @IsString()
   placeholder?: string;
+
+  @Field()
+  @Editor({
+    field_type: FieldType.TEXT,
+    label: 'Name',
+    description: 'Name attribute for the input (for forms and accessibility)',
+    placeholder: 'Enter name...'
+  })
+  @IsOptional()
+  @IsString()
+  name?: string;
 }
 
 export default FormFieldModel;

package/src/schemas/FormSelectSchema.ts

@@ -103,6 +103,17 @@ export class FormSelectModel extends ViewSchema {
   @IsOptional()
   @IsString()
   placeholder?: string;
+
+  @Field()
+  @Editor({
+    field_type: FieldType.TEXT,
+    label: 'Name',
+    description: 'Name attribute for the select (for forms and accessibility)',
+    placeholder: 'Enter name...'
+  })
+  @IsOptional()
+  @IsString()
+  name?: string;
 }
 
 export default FormSelectModel;