TASK: Add button component for workspace ui

neos · Jul 25, 2024 · e489b84 · e489b84
1 parent 4ef2b60
commit e489b84
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 0 deletions.
diff --git a/Neos.Workspace.Ui/Resources/Private/Fusion/Components/Presentationals/Button.fusion b/Neos.Workspace.Ui/Resources/Private/Fusion/Components/Presentationals/Button.fusion
@@ -0,0 +1,27 @@
+prototype(Neos.Workspace.Ui:Component.Button) < prototype(Neos.Fusion:Component) {
+  /// string
+  title = ''
+  /// string
+  label = ''
+  /// boolean
+  isDanger = false
+  /// boolean
+  isWarning = false
+  /// boolean
+  isPrimary = false
+  /// boolean
+  disabled = false
+  /// string
+  icon = ''
+
+  renderer = afx`
+    <button
+      type="button"
+      class={['neos-button', props.isDanger && 'neos-button-danger', props.isWarning && 'neos-button-warning', props.isPrimary && 'neos-button-primary']}
+      @apply.props={props}
+    >
+      <Neos.Workspace.Ui:Component.Icon icon={props.icon} @if={props.icon}/>
+      {props.label}
+    </button>
+  `
+}
diff --git a/Neos.Workspace.Ui/Resources/Public/Styles/Module.css b/Neos.Workspace.Ui/Resources/Public/Styles/Module.css
@@ -89,6 +89,11 @@ td.workspace-action-column {
   text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.4);
 }
 
+/* Add space after icon in button if there is a label */
+button .icon:not(:last-child) {
+  margin-right: 1ch;
+}
+
 /**
  * Workspace entry states and types
  */