@descope/web-components-ui 1.0.276 → 1.0.277

package/dist/cjs/index.cjs.js

@@ -2723,17 +2723,27 @@ var button$1 = /*#__PURE__*/Object.freeze({
   vars: vars$x
 });
 
-const { host: host$g, label: label$9, placeholder: placeholder$3, requiredIndicator: requiredIndicator$b, inputField: inputField$6, input, helperText: helperText$9, errorMessage: errorMessage$b } =
-  {
-    host: { selector: () => ':host' },
-    label: { selector: '::part(label)' },
-    requiredIndicator: { selector: '[required]::part(required-indicator)::after' },
-    placeholder: { selector: '> input:placeholder-shown' },
-    inputField: { selector: '::part(input-field)' },
-    input: { selector: 'input' },
-    helperText: { selector: '::part(helper-text)' },
-    errorMessage: { selector: '::part(error-message)' },
-  };
+const {
+  host: host$g,
+  label: label$9,
+  placeholder: placeholder$3,
+  requiredIndicator: requiredIndicator$b,
+  inputField: inputField$6,
+  input,
+  helperText: helperText$9,
+  errorMessage: errorMessage$b,
+  disabledPlaceholder,
+} = {
+  host: { selector: () => ':host' },
+  label: { selector: '::part(label)' },
+  requiredIndicator: { selector: '[required]::part(required-indicator)::after' },
+  placeholder: { selector: '> input:placeholder-shown' },
+  disabledPlaceholder: { selector: '> input:disabled::placeholder' },
+  inputField: { selector: '::part(input-field)' },
+  input: { selector: 'input' },
+  helperText: { selector: '::part(helper-text)' },
+  errorMessage: { selector: '::part(error-message)' },
+};
 
 var textFieldMappings = {
   // we apply font-size also on the host so we can set its width with em
@@ -2749,6 +2759,8 @@ var textFieldMappings = {
   labelTextColor: [
     { ...label$9, property: 'color' },
     { ...requiredIndicator$b, property: 'color' },
+    { ...label$9, property: '-webkit-text-fill-color' },
+    { ...requiredIndicator$b, property: '-webkit-text-fill-color' },
   ],
   errorMessageTextColor: { ...errorMessage$b, property: 'color' },
 
@@ -2775,7 +2787,10 @@ var textFieldMappings = {
 
   inputTextAlign: { ...input, property: 'text-align' },
 
-  inputPlaceholderColor: { ...placeholder$3, property: 'color' },
+  inputPlaceholderColor: [
+    { ...placeholder$3, property: 'color' },
+    { ...disabledPlaceholder, property: '-webkit-text-fill-color' },
+  ],
 };
 
 const useHostExternalPadding = (cssVarList) => `