2021-01-28 07:25:57 +13:00
|
|
|
<script>
|
|
|
|
import { getContext, setContext } from "svelte"
|
|
|
|
|
|
|
|
export let labelPosition = "above"
|
|
|
|
|
|
|
|
const { styleable } = getContext("sdk")
|
|
|
|
const component = getContext("component")
|
|
|
|
setContext("fieldGroup", { labelPosition })
|
|
|
|
</script>
|
|
|
|
|
2021-02-11 08:23:53 +13:00
|
|
|
<div class="wrapper" use:styleable={$component.styles}>
|
2021-02-03 02:50:46 +13:00
|
|
|
<div
|
2021-01-28 07:25:57 +13:00
|
|
|
class="spectrum-Form"
|
2021-05-04 22:04:42 +12:00
|
|
|
class:spectrum-Form--labelsAbove={labelPosition === "above"}
|
|
|
|
>
|
2021-01-28 07:25:57 +13:00
|
|
|
<slot />
|
2021-02-03 02:50:46 +13:00
|
|
|
</div>
|
2021-01-28 07:25:57 +13:00
|
|
|
</div>
|
2021-02-11 08:23:53 +13:00
|
|
|
|
|
|
|
<style>
|
|
|
|
.wrapper {
|
|
|
|
width: 100%;
|
|
|
|
position: relative;
|
|
|
|
}
|
|
|
|
.spectrum-Form {
|
|
|
|
width: 100%;
|
|
|
|
}
|
|
|
|
</style>
|