diff --git a/components/checkbox-field/style.scss b/components/checkbox-field/style.scss
new file mode 100644
index 0000000..7dc7670
--- /dev/null
+++ b/components/checkbox-field/style.scss
@@ -0,0 +1,27 @@
+.checkbox-field {
+ position: relative;
+ display: flex;
+ align-items: center;
+ border: none;
+ cursor: pointer;
+
+ & input {
+ z-index: 2;
+ width: 20px;
+ height: 20px;
+
+ &:checked {
+ accent-color: #2c2e30;
+ }
+ }
+ & label {
+ font-size: rem(14);
+ font-weight: normal;
+ width: 100%;
+ height: 100%;
+ display: flex;
+ align-items: center;
+ cursor: pointer;
+ gap: rem(16);
+ }
+}
diff --git a/components/checkbox-field/view.blade.php b/components/checkbox-field/view.blade.php
new file mode 100644
index 0000000..188f524
--- /dev/null
+++ b/components/checkbox-field/view.blade.php
@@ -0,0 +1,16 @@
+
+
+
+
diff --git a/components/form-field/Component.php b/components/form-field/Component.php
index ef0d6bb..c39b2f2 100644
--- a/components/form-field/Component.php
+++ b/components/form-field/Component.php
@@ -14,12 +14,12 @@ class FormField extends Component
/**
* The for attribute of the label
*/
- public string $for;
+ public ?string $for;
/**
* The label for the input
*/
- public string $label;
+ public ?string $label;
/**
* The text to tell the input is optional
@@ -36,21 +36,52 @@ class FormField extends Component
*/
public ?string $icon;
+ /**
+ * The view used to render the component
+ */
+ public ?string $view;
+
+ /**
+ * The name used in the checkbox
+ */
+ public ?string $name;
+
+ /**
+ * The view used in the checkbox
+ */
+ public ?string $value;
+
/**
* Create a new component instance.
*/
public function __construct(
- string $for,
- string $label,
+ ?string $for,
+ ?string $label,
?string $optional = null,
?string $helper = null,
?string $icon = null,
+ ?string $view = 'form-field',
+ ?string $name = null,
+ ?string $value = null,
) {
$this->for = $for;
$this->label = $label;
$this->optional = $optional;
$this->helper = $helper;
$this->icon = $icon;
+ $this->view = $view;
+ $this->name = $name;
+ $this->value = $value;
+
+ if ($view !== 'checkbox-field') {
+ if (! $for) {
+ throw new \InvalidArgumentException('The "for" attribute is required fields.');
+ }
+
+ if (! $label) {
+ throw new \InvalidArgumentException('The "label" attribute is required fields.');
+ }
+ }
}
/**
@@ -58,6 +89,6 @@ public function __construct(
*/
public function render(): View|Closure|string
{
- return view('components.form-field');
+ return view('components.'.$this->view);
}
}
diff --git a/src/Components/Publishers/FormField.php b/src/Components/Publishers/FormField.php
index d258806..ccd4713 100644
--- a/src/Components/Publishers/FormField.php
+++ b/src/Components/Publishers/FormField.php
@@ -22,15 +22,24 @@ public function label(): string
*/
public function handle(): FilesCollection
{
- $style = File::makeFromStub(
+ $baseStyle = File::makeFromStub(
stub: 'components/form-field/style.scss',
destination: resource_path('sass/parts/_form-field.scss'),
);
- $view = File::makeFromStub(
+ $baseView = File::makeFromStub(
stub: 'components/form-field/view.blade.php',
destination: resource_path('views/components/form-field.blade.php'),
);
+ $checkboxStyle = File::makeFromStub(
+ stub: 'components/checkbox-field/style.scss',
+ destination: resource_path('sass/parts/_checkbox-field.scss'),
+ );
+
+ $checkboxView = File::makeFromStub(
+ stub: 'components/checkbox-field/view.blade.php',
+ destination: resource_path('views/components/checkbox-field.blade.php'),
+ );
$component = File::makeFromStub(
stub: 'components/form-field/Component.php',
@@ -38,8 +47,10 @@ public function handle(): FilesCollection
);
return FilesCollection::make([
- $style,
- $view,
+ $baseStyle,
+ $baseView,
+ $checkboxStyle,
+ $checkboxView,
$component,
]);
}