MaterialComponents: select_tag Komponente
authorSven Schöling <s.schoeling@googlemail.com>
Fri, 19 Mar 2021 17:59:52 +0000 (18:59 +0100)
committerSven Schöling <s.schoeling@googlemail.com>
Fri, 25 Jun 2021 13:51:32 +0000 (15:51 +0200)
SL/Presenter/MaterialComponents.pm
js/kivi.Materialize.js

index 9b69847..a4eacc8 100644 (file)
@@ -3,9 +3,11 @@ package SL::Presenter::MaterialComponents;
 use strict;
 
 use SL::HTML::Restrict;
+use SL::MoreCommon qw(listify);
 use SL::Presenter::EscapedText qw(escape);
 use SL::Presenter::Tag qw(html_tag);
 use Scalar::Util qw(blessed);
+use List::UtilsBy qw(partition_by);
 
 use Exporter qw(import);
 our @EXPORT_OK = qw(
@@ -49,6 +51,13 @@ my %optional_classes = (
     small  => SMALL,
     tiny   => TINY,
   },
+  size => {
+    map { $_ => $_ }
+      qw(col row),
+      (map { "s$_" } 1..12),
+      (map { "m$_" } 1..12),
+      (map { "l$_" } 1..12),
+  },
 );
 
 use Carp;
@@ -95,6 +104,17 @@ sub _extract_attribute_classes {
   @classes;
 }
 
+# used to extract material classes that are passed directly as classes
+sub _extract_classes {
+  my ($attributes, $type) = @_;
+
+  my @classes = map { split / / } listify($attributes->{class});
+  my %classes = partition_by { !!$optional_classes{$type}{$_} } @classes;
+
+  $attributes->{class} = $classes{''};
+  $classes{1};
+}
+
 sub _set_id_attribute {
   my ($attributes, $name, $unique) = @_;
 
@@ -239,8 +259,30 @@ sub date_tag {
     $label,
     class => [ grep $_, @classes, INPUT_FIELD ],
   );
+}
 
+sub select_tag {
+  my ($name, $collection, %attributes) = @_;
 
+
+  _set_id_attribute(\%attributes, $name);
+  my @size_classes   = _extract_classes(\%attributes, "size");
+
+
+  my $icon  = $attributes{icon}
+    ? icon(delete $attributes{icon}, class => 'prefix')
+    : '';
+
+  my $label = $attributes{label}
+    ? html_tag('label', delete $attributes{label}, for => $attributes{id})
+    : '';
+
+  my $select_html = SL::Presenter::Tag::select_tag($name, $collection, %attributes);
+
+  html_tag('div',
+    $icon . $select_html . $label,
+    class => [ INPUT_FIELD, @size_classes ],
+  );
 }
 
 
index 8232d5b..83e4efb 100644 (file)
@@ -68,6 +68,7 @@ namespace("kivi.Materialize", function(ns) {
 
   ns.reinit_widgets = function() {
     $('.sidenav').sidenav();
+    $('select').formSelect();
     $('.datepicker').datepicker({
       firstDay: 1,
       format: kivi.myconfig.dateformat,