group { name: "elm/colorselector/palette/default";
   data.item: "horizontal_pad" 0;
   data.item: "vertical_pad" 0;
   images.image: "bevel_dark_in.png" COMP;
   parts {
      part { name: "elm.picker"; type: SWALLOW;
         description { state: "default" 0.0;
            fixed: 0 1;
            align: 0.5 0.0;
            rel2.relative: 1.0 0.0;
         }
      }
      part { name: "sep1";
         description { state: "default" 0.0;
            fixed: 1 1;
            rel1.to_y: "elm.picker";
            rel1.offset: 4 4;
            rel1.relative: 0.0 1.0;
            rel2.to_y: "elm.picker";
            rel2.offset: -5 5;
            min: 2 2;
            max: 99999 2;
            image.normal: "bevel_dark_in.png";
            image.border: 2 2 2 2;
            fill.smooth: 0;
         }
         description { state: "off" 0.0;
            inherit: "default" 0.0;
            rel1.offset: 4 -2;
            rel2.offset: -5 -1;
            visible: 0;
         }
      }
      part { name: "elm.palette"; type: SWALLOW;
         description { state: "default" 0.0;
            align: 0.5 0.0;
            rel1.to_y: "sep1";
            rel1.relative: 0.0 1.0;
            rel1.offset: 0 4;
            rel2.to_y: "sep2";
            rel2.relative: 1.0 0.0;
            rel2.offset: -1 -5;
         }
         description { state: "off" 0.0;
            inherit: "default" 0.0;
            rel1.offset: 0 0;
            rel2.offset: -1 -1;
         }
      }
      part { name: "sep2";
         description { state: "default" 0.0;
            fixed: 1 1;
            rel1.to_y: "elm.selector";
            rel1.offset: 4 -6;
            rel2.to_y: "elm.selector";
            rel2.offset: -5 -5;
            rel2.relative: 1.0 0.0;
            min: 2 2;
            max: 99999 2;
            image.normal: "bevel_dark_in.png";
            image.border: 2 2 2 2;
            fill.smooth: 0;
         }
         description { state: "off" 0.0;
            inherit: "default" 0.0;
            rel1.offset: 4 0;
            rel2.offset: -5 1;
            visible: 0;
         }
      }
      part { name: "elm.selector"; type: SWALLOW;
         description { state: "default" 0.0;
            fixed: 0 1;
            align: 0.0 1.0;
            rel1.relative: 0.0 1.0;
         }
      }
   }
   programs {
      program {
         source: "elm"; signal: "elm,state,palette";
         action: STATE_SET "off" 0.0;
         target: "sep1";
         target: "sep2";
      }
      program {
         source: "elm"; signal: "elm,state,palette";
         action: STATE_SET "default" 0.0;
         target: "elm.palette";
      }
      
      program {
         source: "elm"; signal: "elm,state,components";
         action: STATE_SET "off" 0.0;
         target: "sep1";
         target: "sep2";
         target: "elm.palette";
      }
      
      program {
         source: "elm"; signal: "elm,state,both";
         action: STATE_SET "off" 0.0;
         target: "sep1";
      }
      program {
         source: "elm"; signal: "elm,state,both";
         action: STATE_SET "default" 0.0;
         target: "elm.palette";
         target: "sep2";
      }
      
      program {
         source: "elm"; signal: "elm,state,picker";
         action: STATE_SET "off" 0.0;
         target: "sep1";
         target: "sep2";
         target: "elm.palette";
      }
      
      program {
         source: "elm"; signal: "elm,state,all";
         action: STATE_SET "default" 0.0;
         target: "sep1";
         target: "sep2";
         target: "elm.palette";
      }
   }
}

group { name: "elm/colorselector/picker/default";
   images.image: "inset_shadow.png" COMP;
   images.image: "bevel_in.png" COMP;
   images.image: "dot_pattern.png" COMP;
   parts {
      part { name: "bg"; type: RECT;
         scale: 1;
         description { state: "default" 0.0;
            min: 20 20;
            rel1.to: "elm.picker";
            rel2.to: "elm.picker";
            color: 48 48 48 255;
         }
      }
      part { name: "pat";
         description { state: "default" 0.0;
            rel1.to: "bg";
            rel2.to: "bg";
            image.normal: "dot_pattern.png";
            TILED_PATTERN(256, 256)
         }
      }
      part { name: "clipper"; type: RECT;
         description { state: "default" 0.0;
            rel1.to: "elm.picker";
            rel2.to: "elm.picker";
         }
      }
      part { name: "elm.picker"; type: SWALLOW;
         clip_to: "clipper";
         description { state: "default" 0.0;
            rel1.offset: 3 3;
            rel2.offset: -4 -4;
         }
      }
      part { name: "shadow"; mouse_events: 0;
         description { state: "default" 0.0;
            image.normal: "inset_shadow.png";
            image.border: 5 5 7 3;
            image.middle: 0;
            rel1.to: "bg";
            rel2.to: "bg";
            fill.smooth: 0;
            color: 255 255 255 128;
         }
      }
      part { name: "inset"; mouse_events: 0;
         description { state: "default" 0.0;
            image.normal: "bevel_in.png";
            image.border: 1 1 1 1;
            image.middle: 0;
            rel1.to: "bg";
            rel1.offset: -1 -1;
            rel2.to: "bg";
            rel2.offset: 0 0;
            fill.smooth: 0;
         }
      }
   }
}

group { name: "elm/colorselector/bg/default";
   parts {
      part { name: "elm.colorbar_0"; type: SWALLOW;
         description { state: "default" 0.0;
            rel2.relative: 1.0 0.0;
            align: 0.5 0.0;
            fixed: 0 1;
         }
      }
      part { name: "elm.colorbar_1"; type: SWALLOW;
         description { state: "default" 0.0;
            rel1.to_y: "elm.colorbar_0";
            rel1.relative: 0.0 1.0;
            rel2.to_y: "elm.colorbar_0";
            rel2.relative: 1.0 1.0;
            align: 0.5 0.0;
            fixed: 0 1;
         }
      }
      part { name: "elm.colorbar_2"; type: SWALLOW;
         description { state: "default" 0.0;
            rel1.to_y: "elm.colorbar_1";
            rel1.relative: 0.0 1.0;
            rel2.to_y: "elm.colorbar_1";
            rel2.relative: 1.0 1.0;
            align: 0.5 0.0;
            fixed: 0 1;
         }
      }
      part { name: "elm.colorbar_3"; type: SWALLOW;
         description { state: "default" 0.0;
            rel1.to_y: "elm.colorbar_2";
            rel1.relative: 0.0 1.0;
            align: 0.5 0.0;
         }
      }
   }
}

group { name: "elm/colorselector/base/default";
   images.image: "inset_shadow.png" COMP;
   images.image: "bevel_in.png" COMP;
   images.image: "ring_shadow.png" COMP;
   images.image: "ring_white_blue_glow.png" COMP;
   images.image: "col_sel_end_bottom.png" COMP;
   images.image: "col_sel_end_top.png" COMP;
   parts {
      part { name: "elm.bar_bg"; type: SWALLOW; mouse_events: 0;
         description { state: "default" 0.0;
            min: 32 15;
            rel1.offset: 0 10;
            rel1.to_x: "elm.arrow_bg";
            rel2.offset: -1 -11;
            rel2.to_x: "elm.arrow_bg";
         }
      }
      part { name: "elm.bar"; type: SWALLOW; mouse_events: 0;
         description { state: "default" 0.0;
            rel1.to: "elm.bar_bg";
            rel2.to: "elm.bar_bg";
         }
      }
      part { name: "clipper"; type: RECT;
         description { state: "default" 0.0;
            rel1.to: "shadow";
            rel2.to: "shadow";
         }
      }
      part { name: "shadow"; mouse_events: 0;
         description { state: "default" 0.0;
            image.normal: "inset_shadow.png";
            image.border: 5 5 7 3;
            image.middle: 0;
            rel1.to: "elm.bar_bg";
            rel2.to: "elm.bar_bg";
            fill.smooth: 0;
            color: 255 255 255 128;
         }
      }
      part { name: "inset"; mouse_events: 0;
         description { state: "default" 0.0;
            image.normal: "bevel_in.png";
            image.border: 1 1 1 1;
            image.middle: 0;
            rel1.to: "shadow";
            rel1.offset: -1 -1;
            rel2.to: "shadow";
            rel2.offset: 0 0;
            fill.smooth: 0;
         }
      }
      part { name: "elm.arrow_bg"; type: SWALLOW;
         description { state: "default" 0.0;
            rel1 {
               relative: 1.0 0.0;
               offset: 3 0;
               to_x: "elm.l_button";
            }
            rel2 {
               relative: 0.0 1.0;
               offset: -4 0;
               to_x: "elm.r_button";
            }
         }
      }
      part { name: "elm.arrow"; type: RECT;
         description { state: "default" 0.0;
            fixed: 1 1;
            min: 1 1;
            rel1.to_x: "elm.arrow_bg";
            rel2.to_x: "elm.arrow_bg";
            visible: 0;
         }
         dragable {
            confine: "elm.arrow_bg";
            x: 1 1 0;
            y: 0 0 0;
         }
      }
      part { name: "event"; type: RECT;
         description { state: "default" 0.0;
            rel1.to: "elm.arrow_icon";
            rel2.to_x: "elm.arrow_icon";
            rel2.to_y: "elm.arrow_bg";
            color: 0 0 0 0;
         }
         dragable.events: "elm.arrow";
      }
      part { name: "arrow_under"; mouse_events: 0;
         description { state: "default" 0.0;
            image.normal: "ring_shadow.png";
            rel1.to: "elm.arrow_icon";
            rel2.to: "elm.arrow_icon";
         }
      }
      part { name: "elm.arrow_icon"; type: SWALLOW; mouse_events: 0;
         scale: 1;
         description { state: "default" 0.0;
            fixed: 1 1;
            min: 16 16;
            max: 16 16;
            align: 0.5 (28/32);
            rel1.to_x: "elm.arrow";
            rel1.to_y: "shadow";
            rel2.relative: 1.0 0.0;
            rel2.to_x: "elm.arrow";
            rel2.to_y: "shadow";
         }
      }
      part { name: "end1"; mouse_events: 0;
         clip_to: "clipper";
         description { state: "default" 0.0;
            image.normal: "col_sel_end_top.png";
            FIXED_SIZE(11, 8)
            align: 0.5 0.0;
            rel1.to_x: "cursor";
            rel2.to_x: "cursor";
            rel1.to_y: "shadow";
            rel2.to_y: "shadow";
         }
      }
      part { name: "end2"; mouse_events: 0;
         clip_to: "clipper";
         description { state: "default" 0.0;
            image.normal: "col_sel_end_bottom.png";
            FIXED_SIZE(11, 8)
            align: 0.5 1.0;
            rel1.to_x: "cursor";
            rel2.to_x: "cursor";
            rel1.to_y: "shadow";
            rel2.to_y: "shadow";
         }
      }
      part { name: "arrow_over"; mouse_events: 0;
         description { state: "default" 0.0;
            image.normal: "ring_white_blue_glow.png";
            rel1.to: "elm.arrow_icon";
            rel2.to: "elm.arrow_icon";
         }
      }
      part { name: "cursor"; type: RECT;
         description { state: "default" 0.0;
            fixed: 1 1;
            min: 1 1;
            rel1.to_x: "elm.arrow_icon";
            rel1.to_y: "shadow";
            rel1.relative: 0.5 0.0;
            rel2.to_x: "elm.arrow_icon";
            rel2.to_y: "shadow";
            rel2.relative: 0.5 1.0;
            rel2.offset: 0 -1;
            color: 255 255 255 255;
         }
         dragable.events: "elm.arrow";
      }
      part { name: "elm.arrow_bg_access"; type: RECT;
         repeat_events: 1;
         description { state: "default" 0.0;
            rel1.to: "elm.arrow_bg";
            rel2.to: "elm.arrow_bg";
            color: 0 0 0 0;
         }
      }
      part { name: "elm.l_button"; type: SWALLOW;
         scale: 1;
         description { state: "default" 0.0;
            fixed: 1 1;
            min: 17 17;
            rel1.relative: 0.0 0.0;
            rel1.to_y: "elm.bar_bg";
            rel2.relative: 0.0 1.0;
            rel2.to_y: "elm.bar_bg";
            align: 0.0 0.5;
         }
      }
      part { name: "elm.r_button"; type: SWALLOW;
         scale: 1;
         description { state: "default" 0.0;
            fixed: 1 1;
            min: 17 17;
            rel1.relative: 1.0 0.0;
            rel1.to_y: "elm.bar_bg";
            rel2.relative: 1.0 1.0;
            rel2.to_y: "elm.bar_bg";
            align: 1.0 0.5;
         }
      }
   }
}

group { name: "elm/colorselector/arrow/default";
   images.image: "ring_white_middle.png" COMP;
   parts {
      part { name: "base";
         description { state: "default" 0.0;
            aspect: 1.0 1.0; aspect_preference: BOTH;
            image.normal: "ring_white_middle.png";
         }
      }
   }
}

group{ name: "elm/colorselector/image/colorbar_0/default";
   images {
      image: "color_picker_color.png" COMP;
   }
   parts {
      part { name: "colorbar_0_image";
         type: IMAGE;
         description { state: "default" 0.0;
            rel2.offset: -1 -1;
            image.normal: "color_picker_color.png";
         }
      }
   }
}

group { name: "elm/colorselector/image/colorbar_1/default";
   images.image: "color_picker_opacity.png" COMP;
   parts {
      part { name: "colorbar_1_image";
         description { state: "default" 0.0;
            image.normal: "color_picker_opacity.png";
         }
      }
   }
}

group { name: "elm/colorselector/image/colorbar_2/default";
   images.image: "color_picker_brightness.png" COMP;
   parts {
      part { name: "colorbar_2_image";
         description { state: "default" 0.0;
            image.normal: "color_picker_brightness.png";
         }
      }
   }
}

group { name: "elm/colorselector/image/colorbar_3/default";
   images.image: "color_picker_alpha.png" COMP;
   parts {
      part { name: "colorbar_3_image";
         description { state: "default" 0.0;
            image.normal: "color_picker_alpha.png";
         }
      }
   }
}

group { name: "elm/colorselector/bg_image/colorbar_3/default";
   images.image: "dot_pattern.png" COMP;
   parts {
      part { name: "bg"; type: RECT;
         description { state: "default" 0.0;
            color: 48 48 48 255;
         }
      }
      part { name: "pat";
         description { state: "default" 0.0;
            rel1.to: "bg";
            rel2.to: "bg";
            image.normal: "dot_pattern.png";
            TILED_PATTERN(256, 256)
         }
      }
   }
}

group { name: "elm/colorselector/item/default";
   images.image: "inset_shadow.png" COMP;
   images.image: "bevel_in.png" COMP;
   images.image: "dot_pattern.png" COMP;
   images.image: "bg_glow_in.png" COMP;
   parts {
      part { name: "bg"; type: RECT;
         scale: 1;
         description { state: "default" 0.0;
            min: 20 20;
            rel1.to: "color_obj";
            rel2.to: "color_obj";
            color: 48 48 48 255;
         }
      }
      part { name: "pat";
         description { state: "default" 0.0;
            rel1.to: "bg";
            rel2.to: "bg";
            image.normal: "dot_pattern.png";
            TILED_PATTERN(256, 256)
         }
      }
      part { name: "clipper"; type: RECT;
         description { state: "default" 0.0;
            rel1.to: "color_obj";
            rel2.to: "color_obj";
         }
         description { state: "disabled" 0.0;
            inherit: "default" 0.0;
            color: 255 255 255 64;
         }
      }
      part { name: "color_obj"; type: SWALLOW;
         clip_to: "clipper";
         description { state: "default" 0.0;
            rel1.offset: 3 3;
            rel2.offset: -4 -4;
         }
      }
      part { name: "shadow"; mouse_events: 0;
         description { state: "default" 0.0;
            image.normal: "inset_shadow.png";
            image.border: 5 5 7 3;
            image.middle: 0;
            rel1.to: "bg";
            rel2.to: "bg";
            fill.smooth: 0;
            color: 255 255 255 128;
         }
      }
      part { name: "dim"; type: RECT; mouse_events: 0;
         description { state: "default" 0.0;
            rel1.to: "bg";
            rel2.to: "bg";
            color: 0 0 0 0;
         }
         description { state: "focused" 0.0;
            inherit: "default" 0.0;
            color: 0 0 0 128;
         }
      }
      part { name: "glow"; mouse_events: 0;
         description { state: "default" 0.0;
            rel1.to: "bg";
            rel2.to: "bg";
            image.normal: "bg_glow_in.png";
            image.border: 7 7 7 7;
            image.middle: 0;
            fill.smooth: 0;
            color: 255 255 255 0;
         }
         description { state: "focused" 0.0;
            inherit: "default" 0.0;
            color: 255 255 255 255;
         }
      }
      part { name: "inset"; mouse_events: 0;
         description { state: "default" 0.0;
            image.normal: "bevel_in.png";
            image.border: 1 1 1 1;
            image.middle: 0;
            rel1.to: "bg";
            rel1.offset: -1 -1;
            rel2.to: "bg";
            rel2.offset: 0 0;
            fill.smooth: 0;
         }
      }
   }
   programs {
      program {
         source: "elm"; signal: "elm,state,selected";
         action: STATE_SET "focused" 0.0;
         transition: DECELERATE 0.1;
         target: "glow";
         target: "dim";
      }
      program {
         source: "elm"; signal: "elm,state,unselected";
         action: STATE_SET "default" 0.0;
         transition: DECELERATE 0.5;
         target: "glow";
         target: "dim";
      }
      program {
         signal: "elm,anim,activate"; source: "elm";
         action: STATE_SET "focused" 0.0;
         transition: DECELERATE 0.1;
         target: "glow";
         target: "dim";
         after: "active2";
      }
      program { name: "active2";
         action: STATE_SET "default" 0.0;
         transition: DECELERATE 0.8;
         target: "glow";
         target: "dim";
      }
   }
}

group { name: "elm/colorselector/item/color/default";
   parts {
      part { name: "color_rect"; type: RECT;
         description{ state: "default" 0.0;
         }
      }
   }
}