carbon-react/esm/components/form/form.style.js

A library of reusable React components for easily building user interfaces.

import t,{css as i}from"styled-components";import{padding as o,space as e}from"styled-system";import l from"../../__internal__/form-field/form-field.style.js";import s from"../../style/themes/apply-base-theme.js";import r from"../inline-inputs/inline-inputs.style.js";import n from"../select/select.style.js";import{StyledSelectMultiSelect as m}from"../select/multi-select/multi-select.style.js";import a from"../switch/switch.style.js";const d=t.div.withConfig({displayName:"form.style__StyledFormContent",componentId:"sc-24b70795-0"})(["height:100%;"," ",""],(({stickyFooter:t,isInModal:o})=>t&&o&&i(["flex-grow:1;min-height:0;overflow-y:auto;"])),(({fieldSpacing:t})=>t&&i(["--fieldSpacing:",";","{margin-top:var(--spacing000);}"," ",","," ",","," ",","," ","{margin-bottom:var(--spacing000);}"],t,l,r,l,r,n,r,m,a,l))),p=t.div.attrs(s).withConfig({displayName:"form.style__StyledFormFooter",componentId:"sc-24b70795-1"})([""," "," "," ",""],(({hasFooterChildren:t})=>!t&&i(["align-items:center;display:flex;flex-wrap:wrap;gap:var(--sizing200);"])),(({buttonAlignment:t})=>"right"===t&&i(["justify-content:flex-end;"])),(({stickyFooter:t,stickyFooterVariant:o,fullWidthButtons:e})=>i([""," "," ",""],!t&&i(["margin-top:48px;"]),t&&i(["background-color:",";box-shadow:var(--boxShadow150);box-sizing:border-box;"," padding:16px 32px;width:100%;z-index:1000;position:sticky;bottom:0;"],"light"===o?"var(--colorsUtilityYang100)":"var(--colorsUtilityMajor025)","grey"===o&&"border-top: 1px solid var(--colorsUtilityMajor050);"),e&&i(["flex-direction:column;align-items:stretch;"]))),o),f=t.form.attrs(s).withConfig({displayName:"form.style__StyledForm",componentId:"sc-24b70795-2"})([""," "," ",""],e,(({height:t})=>t&&i(["height:",";"],t)),(({stickyFooter:t,isInModal:o})=>t&&i(["display:flex;flex-direction:column;position:relative;",""],o&&i(["flex-grow:1;min-height:0;height:100%;"])))),g=t.div.withConfig({displayName:"form.style__StyledRightButtons",componentId:"sc-24b70795-3"})(["display:flex;gap:var(--sizing200);",""],(({buttonAlignment:t})=>"left"===t&&"flex-grow: 1;")),c=t.div.withConfig({displayName:"form.style__StyledLeftButtons",componentId:"sc-24b70795-4"})(["display:flex;justify-content:flex-end;gap:var(--sizing200);",""],(({buttonAlignment:t})=>"right"===t&&"flex-grow: 1;"));export{f as StyledForm,d as StyledFormContent,p as StyledFormFooter,c as StyledLeftButtons,g as StyledRightButtons};