UNPKG

@workday/canvas-kit-react

Version:

The parent module that contains all Workday Canvas Kit React components

21 lines (20 loc) 1.4 kB
import React from 'react'; import { createSubcomponent } from '@workday/canvas-kit-react/common'; import { createStencil, calc, px2rem, handleCsProp } from '@workday/canvas-kit-styling'; import { brand, system } from '@workday/canvas-tokens-web'; import { useFormFieldModel } from './hooks'; const formFieldGroupListStencil = createStencil({ base: { name: "d5h44w", styles: "box-sizing:border-box;display:flex;flex-direction:column;border-radius:var(--cnvs-sys-shape-x1);gap:var(--cnvs-sys-space-x2);padding:0.625rem var(--cnvs-sys-space-x3) var(--cnvs-sys-space-x2);margin:0 calc(var(--cnvs-sys-space-x3) * -1);transition:100ms box-shadow;width:fit-content;" }, modifiers: { error: { error: { name: "d5h44x", styles: "box-shadow:inset 0 0 0 0.125rem var(--cnvs-brand-error-base);" }, alert: { name: "d5h44y", styles: "box-shadow:inset 0 0 0 0.0625rem var(--cnvs-brand-alert-darkest), inset 0 0 0 0.1875rem var(--cnvs-brand-alert-base);" } } } }, "form-field-group-list-ea1ca7"); export const FormFieldGroupList = createSubcomponent('div')({ displayName: 'FormFieldGroup.List', modelHook: useFormFieldModel, })(({ children, ...elemProps }, Element, model) => { return (React.createElement(Element, { "data-width": "ck-formfield-width", ...handleCsProp(elemProps, formFieldGroupListStencil({ error: model.state.error })) }, children)); });