@descope/web-components-ui 1.0.276 → 1.0.277

package/dist/index.esm.js

@@ -2316,17 +2316,27 @@ customElements.define(componentName$B, TextClass);
 
 customElements.define(componentName$A, DividerClass);
 
-const { host: host$c, label: label$9, placeholder: placeholder$3, requiredIndicator: requiredIndicator$9, inputField: inputField$6, input, helperText: helperText$7, errorMessage: errorMessage$9 } =
-  {
-    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$c,
+  label: label$9,
+  placeholder: placeholder$3,
+  requiredIndicator: requiredIndicator$9,
+  inputField: inputField$6,
+  input,
+  helperText: helperText$7,
+  errorMessage: errorMessage$9,
+  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
@@ -2342,6 +2352,8 @@ var textFieldMappings = {
   labelTextColor: [
     { ...label$9, property: 'color' },
     { ...requiredIndicator$9, property: 'color' },
+    { ...label$9, property: '-webkit-text-fill-color' },
+    { ...requiredIndicator$9, property: '-webkit-text-fill-color' },
   ],
   errorMessageTextColor: { ...errorMessage$9, property: 'color' },
 
@@ -2368,7 +2380,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 componentName$z = getComponentName('email-field');