app-studio 0.8.1 → 0.8.3

package/dist/web/index.d.mts

@@ -114,6 +114,13 @@ interface CssProps extends CSSProperties {
     _selection?: CSSProperties;
     _backdrop?: CSSProperties;
     _marker?: CSSProperties;
+    _webkitAutofill?: CSSProperties | string;
+    _webkitContactsAutoFillButton?: CSSProperties | string;
+    _webkitInnerSpinButton?: CSSProperties | string;
+    _webkitOuterSpinButton?: CSSProperties | string;
+    _webkitSearchCancelButton?: CSSProperties | string;
+    _mozPlaceholder?: CSSProperties | string;
+    _mozFocusInner?: CSSProperties | string;
     WebkitUserDrag?: CSSProperties['userSelect'];
     webkitUserDrag?: CSSProperties['userSelect'];
 }
@@ -180,6 +187,13 @@ interface ElementProps extends CssProps, Omit<ViewStyleProps, keyof HTMLAttribut
     _selection?: CssProps;
     _backdrop?: CssProps;
     _marker?: CssProps;
+    _webkitAutofill?: CssProps | string;
+    _webkitContactsAutoFillButton?: CssProps | string;
+    _webkitInnerSpinButton?: CssProps | string;
+    _webkitOuterSpinButton?: CssProps | string;
+    _webkitSearchCancelButton?: CssProps | string;
+    _mozPlaceholder?: CssProps | string;
+    _mozFocusInner?: CssProps | string;
 }
 
 declare const Element$1: react__default.MemoExoticComponent<react__default.ForwardRefExoticComponent<ElementProps & react__default.RefAttributes<HTMLElement>>>;

package/dist/web/index.d.ts

@@ -114,6 +114,13 @@ interface CssProps extends CSSProperties {
     _selection?: CSSProperties;
     _backdrop?: CSSProperties;
     _marker?: CSSProperties;
+    _webkitAutofill?: CSSProperties | string;
+    _webkitContactsAutoFillButton?: CSSProperties | string;
+    _webkitInnerSpinButton?: CSSProperties | string;
+    _webkitOuterSpinButton?: CSSProperties | string;
+    _webkitSearchCancelButton?: CSSProperties | string;
+    _mozPlaceholder?: CSSProperties | string;
+    _mozFocusInner?: CSSProperties | string;
     WebkitUserDrag?: CSSProperties['userSelect'];
     webkitUserDrag?: CSSProperties['userSelect'];
 }
@@ -180,6 +187,13 @@ interface ElementProps extends CssProps, Omit<ViewStyleProps, keyof HTMLAttribut
     _selection?: CssProps;
     _backdrop?: CssProps;
     _marker?: CssProps;
+    _webkitAutofill?: CssProps | string;
+    _webkitContactsAutoFillButton?: CssProps | string;
+    _webkitInnerSpinButton?: CssProps | string;
+    _webkitOuterSpinButton?: CssProps | string;
+    _webkitSearchCancelButton?: CssProps | string;
+    _mozPlaceholder?: CssProps | string;
+    _mozFocusInner?: CssProps | string;
 }
 
 declare const Element$1: react__default.MemoExoticComponent<react__default.ForwardRefExoticComponent<ElementProps & react__default.RefAttributes<HTMLElement>>>;

package/dist/web/index.js

@@ -1727,7 +1727,15 @@ var excludedKeys = /* @__PURE__ */ new Set([
   "_firstLine",
   "_selection",
   "_backdrop",
-  "_marker"
+  "_marker",
+  // Browser-specific pseudo-classes for form-control polish
+  "_webkitAutofill",
+  "_webkitContactsAutoFillButton",
+  "_webkitInnerSpinButton",
+  "_webkitOuterSpinButton",
+  "_webkitSearchCancelButton",
+  "_mozPlaceholder",
+  "_mozFocusInner"
   // Add more styling props here if needed
 ]);
 var extraKeys = /* @__PURE__ */ new Set([
@@ -2511,6 +2519,14 @@ var EVENT_TO_PSEUDO = {
   selection: "selection",
   backdrop: "backdrop",
   marker: "marker",
+  // Browser-specific pseudo-classes for form-control polish
+  webkitAutofill: "-webkit-autofill",
+  webkitContactsAutoFillButton: "-webkit-contacts-auto-fill-button",
+  webkitInnerSpinButton: "-webkit-inner-spin-button",
+  webkitOuterSpinButton: "-webkit-outer-spin-button",
+  webkitSearchCancelButton: "-webkit-search-cancel-button",
+  mozPlaceholder: "-moz-placeholder",
+  mozFocusInner: "-moz-focus-inner",
   // Group modifiers
   groupHover: "group-hover",
   groupFocus: "group-focus",
@@ -2523,6 +2539,25 @@ var EVENT_TO_PSEUDO = {
   peerDisabled: "peer-disabled",
   peerChecked: "peer-checked"
 };
+var PSEUDO_ELEMENTS = /* @__PURE__ */ new Set([
+  "before",
+  "after",
+  "first-letter",
+  "first-line",
+  "placeholder",
+  "selection",
+  "backdrop",
+  "marker",
+  "-moz-placeholder",
+  "-moz-focus-inner",
+  "-webkit-contacts-auto-fill-button",
+  "-webkit-inner-spin-button",
+  "-webkit-outer-spin-button",
+  "-webkit-search-cancel-button"
+]);
+var isPseudoElement = (pseudo) => PSEUDO_ELEMENTS.has(pseudo);
+var pseudoPrefix = (pseudo) => isPseudoElement(pseudo) ? "::" : ":";
+var buildPseudoSelector = (chain) => chain.split("::").filter(Boolean).map((part) => `${pseudoPrefix(part)}${part}`).join("");
 var AnimationUtils = {
   parseDuration(duration) {
     const match = duration.match(/^([\d.]+)(ms|s)$/);
@@ -2795,9 +2830,10 @@ var UtilityClassManager = class {
           });
         });
       } else {
+        const colon = pseudoPrefix(modifier);
         cssProperties2.forEach((prefixedProperty) => {
           rules.push({
-            rule: `.${escapedClassName}:${modifier} { ${prefixedProperty}: ${valueForCss}; }`,
+            rule: `.${escapedClassName}${colon}${modifier} { ${prefixedProperty}: ${valueForCss}; }`,
             context: "pseudo"
           });
         });
@@ -3017,9 +3053,9 @@ function processPseudoStyles(styles, parentPseudo = "", getColor, manager) {
         )}-${parentPseudo.replace(/:/g, "-")}`;
         const escapedClassName = pseudoClassName.replace(/[^\w-]/g, "-");
         const processedValue = ValueUtils.formatValue(value, key, getColor);
-        const rule = `.${escapedClassName}::${parentPseudo} { ${propertyToKebabCase(
-          key
-        )}: ${processedValue}; }`;
+        const rule = `.${escapedClassName}${buildPseudoSelector(
+          parentPseudo
+        )} { ${propertyToKebabCase(key)}: ${processedValue}; }`;
         (manager || utilityClassManager).injectRule(rule, "pseudo");
         classes.push(escapedClassName);
       }