genesys-spark-components 4.157.6 → 4.159.0

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-checkbox/tests/gux-form-field-checkbox.common.js

@@ -0,0 +1,34 @@
+export const renderConfigs = [
+    `
+  <gux-form-field-checkbox>
+    <input slot="input" type="checkbox" name="food-1[]" value="pizza"/>
+    <label slot="label">Pizza</label>
+  </gux-form-field-checkbox>
+`,
+    `
+  <gux-form-field-checkbox>
+    <input slot="input" type="checkbox" name="food-1[]" value="pizza" disabled/>
+    <label slot="label">Pizza</label>
+  </gux-form-field-checkbox>
+`,
+    `
+  <gux-form-field-checkbox>
+    <input slot="input" type="checkbox" name="food-1[]" value="pizza"/>
+    <label slot="label">Pizza</label>
+    <span slot="error">This is an error message</span>
+  </gux-form-field-checkbox>
+`,
+    `
+  <gux-form-field-checkbox>
+    <input slot="input" type="checkbox" name="food-1[]" value="pizza" checked/>
+    <label slot="label">Pizza</label>
+  </gux-form-field-checkbox>
+`,
+    `
+  <gux-form-field-checkbox>
+    <input slot="input" type="checkbox" name="food-1[]" value="pizza"/>
+    <label slot="label">Pizza</label>
+    <span slot="help">This is a help message</span>
+  </gux-form-field-checkbox>
+`
+].map(html => ({ html }));

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-checkbox-group/tests/gux-form-field-checkbox-group.common.js

@@ -0,0 +1,123 @@
+export const renderConfigs = [
+    `
+  <gux-form-field-checkbox-group-beta>
+    <label slot="group-label">Food</label>
+    <gux-form-field-checkbox>
+      <input slot="input" type="checkbox" name="food-1" value="pizza"/>
+      <label slot="label">Pizza</label>
+    </gux-form-field-checkbox>
+  </gux-form-field-checkbox-group-beta>
+  `,
+    `
+  <gux-form-field-checkbox-group-beta>
+  <label slot="group-label">Food</label>
+
+  <gux-form-field-checkbox>
+    <input slot="input" type="checkbox" name="food-1" value="pizza" />
+    <label slot="label">Pizza</label>
+  </gux-form-field-checkbox>
+
+  <gux-form-field-checkbox>
+    <input
+      slot="input"
+      type="checkbox"
+      name="food-1"
+      value="sandwich"
+      disabled
+    />
+    <label slot="label">Sandwich</label>
+  </gux-form-field-checkbox>
+
+  <gux-form-field-checkbox>
+    <input slot="input" type="checkbox" name="food-1" value="spaghetti" />
+    <label slot="label">Spaghetti</label>
+    <span slot="help">This is a help message</span>
+  </gux-form-field-checkbox>
+  <span slot="group-error">Subject to availibility</span>
+</gux-form-field-checkbox-group-beta>
+  `,
+    `<gux-form-field-checkbox-group-beta>
+  <label slot="group-label">Food</label>
+
+  <gux-form-field-checkbox>
+    <input slot="input" type="checkbox" name="food-1" value="pizza" />
+    <label slot="label">Pizza</label>
+  </gux-form-field-checkbox>
+
+  <gux-form-field-checkbox>
+    <input
+      slot="input"
+      type="checkbox"
+      name="food-1"
+      value="sandwich"
+      disabled
+    />
+    <label slot="label">Sandwich</label>
+  </gux-form-field-checkbox>
+
+  <gux-form-field-checkbox>
+    <input slot="input" type="checkbox" name="food-1" value="sushi" />
+    <label slot="label">Sushi</label>
+    <span slot="error">Subject to availibility</span>
+  </gux-form-field-checkbox>
+
+  <gux-form-field-checkbox>
+    <input slot="input" type="checkbox" name="food-1" value="spaghetti" />
+    <label slot="label">Spaghetti</label>
+    <span slot="help">This is a help message</span>
+  </gux-form-field-checkbox>
+  <span slot="group-help">This is a group help message</span>
+</gux-form-field-checkbox-group-beta>
+`,
+    `
+  <gux-form-field-checkbox-group-beta disabled>
+    <label slot="group-label">Food</label>
+
+    <gux-form-field-checkbox>
+      <input slot="input" type="checkbox" name="food-1" value="pizza" />
+      <label slot="label">Pizza</label>
+    </gux-form-field-checkbox>
+
+    <gux-form-field-checkbox>
+      <input
+        slot="input"
+        type="checkbox"
+        name="food-1"
+        value="sandwich"
+        disabled
+      />
+      <label slot="label">Sandwich</label>
+    </gux-form-field-checkbox>
+
+    <gux-form-field-checkbox>
+      <input slot="input" type="checkbox" name="food-1" value="sushi" />
+      <label slot="label">Sushi</label>
+      <span slot="error">Subject to availibility</span>
+    </gux-form-field-checkbox>
+
+    <gux-form-field-checkbox>
+      <input slot="input" type="checkbox" name="food-1" value="spaghetti" />
+      <label slot="label">Spaghetti</label>
+      <span slot="help">This is a help message</span>
+    </gux-form-field-checkbox>
+  </gux-form-field-checkbox-group-beta>
+  `,
+    `
+  <gux-form-field-checkbox-group-beta required>
+    <label slot="group-label">Food</label>
+    <gux-form-field-checkbox>
+      <input slot="input" type="checkbox" name="food-1" value="pizza"/>
+      <label slot="label">Pizza</label>
+    </gux-form-field-checkbox>
+  </gux-form-field-checkbox-group-beta>
+  `,
+    `
+  <gux-form-field-checkbox-group-beta indicator-mark="optional">
+    <label slot="group-label">Food</label>
+    <gux-form-field-checkbox>
+      <input slot="input" type="checkbox" name="food-1" value="pizza"/>
+      <label slot="label">Pizza</label>
+    </gux-form-field-checkbox>
+  </gux-form-field-checkbox-group-beta>
+  `
+].map(html => ({ html }));

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-color/tests/gux-form-field-color.common.js

@@ -0,0 +1,52 @@
+const labelPositionRenderConfigs = ['above', 'beside', 'screenreader'].map(labelPosition => ({
+    description: `should render component as expected when label-position is ${labelPosition}`,
+    html: `
+    <gux-form-field-color label-position="${labelPosition}">
+      <input slot="input" type="color" value="#cc3ebe"/>
+      <label slot="label">Label</label>
+    </gux-form-field-color>
+  `
+}));
+const inputAttributeRenderConfigs = ['disabled', 'required'].map(inputAttribute => ({
+    description: `should render component as expected when input attribute is "${inputAttribute}"`,
+    html: `
+    <gux-form-field-color>
+      <input slot="input" type="color" value="#cc3ebe" ${inputAttribute}/>
+      <label slot="label">Label</label>
+    </gux-form-field-color>
+  `
+}));
+const indicatorMarkRenderConfigs = ['optional', 'required'].map(indicatorMark => ({
+    description: `should render component as expected when indicator-mark is "${indicatorMark}"`,
+    html: `
+    <gux-form-field-color indicator-mark="${indicatorMark}">
+      <input slot="input" type="color" value="#cc3ebe"/>
+      <label slot="label">Label</label>
+    </gux-form-field-color>
+  `
+}));
+const optionalSlotRenderConfigs = [
+    { name: 'help', html: `<span slot="help">This is a help message</span>` },
+    { name: 'error', html: `<span slot="error">This is an error message</span>` },
+    {
+        name: 'label-info',
+        html: `<gux-label-info-beta slot="label-info">
+      <span slot="content">This is some tooltip text</span>
+    </gux-label-info-beta>`
+    }
+].map(({ name, html }) => ({
+    description: `should render component as expected when an optional "${name}" slot is provided`,
+    html: `
+    <gux-form-field-color>
+      <input slot="input" type="color" value="#cc3ebe"/>
+      <label slot="label">Label</label>
+      ${html}
+    </gux-form-field-color>
+  `
+}));
+export const renderConfigs = [
+    ...labelPositionRenderConfigs,
+    ...inputAttributeRenderConfigs,
+    ...indicatorMarkRenderConfigs,
+    ...optionalSlotRenderConfigs
+];