From 928a2125275512450125cf8c7b2651294777160e Mon Sep 17 00:00:00 2001
From: Insality <insality@gmail.com>
Date: Sat, 9 May 2020 12:45:09 +0300
Subject: [PATCH 1/2] Add on_style_change to every component

Empty default style is now valid. Every component have their default style values. Removed style function checks
---
 druid/base/button.lua          | 68 ++++++++++++++++++----------------
 druid/base/checkbox.lua        | 19 ++++++++--
 druid/base/drag.lua            | 12 +++++-
 druid/base/input.lua           | 37 ++++++++++++------
 druid/base/progress.lua        | 13 ++++++-
 druid/base/scroll.lua          | 41 +++++++++++++++-----
 druid/base/swipe.lua           | 14 ++++++-
 druid/component.lua            | 24 +++++-------
 druid/druid.lua                |  2 +-
 druid/styles/default/style.lua |  4 --
 druid/styles/empty/style.lua   | 52 +-------------------------
 druid/styles/sprites/style.lua | 42 +--------------------
 12 files changed, 157 insertions(+), 171 deletions(-)

diff --git a/druid/base/button.lua b/druid/base/button.lua
index 2f6410b..3c89b46 100644
--- a/druid/base/button.lua
+++ b/druid/base/button.lua
@@ -50,27 +50,18 @@ end
 
 
 local function on_button_hover(self, hover_state)
-	if not self._style.on_hover then
-		return
-	end
-
-	self._style.on_hover(self, self.anim_node, hover_state)
+	self.style.on_hover(self, self.anim_node, hover_state)
 end
 
 
 local function on_button_mouse_hover(self, hover_state)
-	if not self._style.on_mouse_hover then
-		return
-	end
-
-	self._style.on_mouse_hover(self, self.anim_node, hover_state)
+	self.style.on_mouse_hover(self, self.anim_node, hover_state)
 end
 
 
 local function on_button_click(self)
-	if self._style.on_click then
-		self._style.on_click(self, self.anim_node)
-	end
+	self.style.on_click(self, self.anim_node)
+
 	self.click_in_row = 1
 	self.on_click:trigger(self:get_context(), self.params, self)
 end
@@ -82,18 +73,16 @@ local function on_button_repeated_click(self)
 		self.is_repeated_started = true
 	end
 
-	if self._style.on_click then
-		self._style.on_click(self, self.anim_node)
-	end
+	self.style.on_click(self, self.anim_node)
+
 	self.click_in_row = self.click_in_row + 1
 	self.on_repeated_click:trigger(self:get_context(), self.params, self, self.click_in_row)
 end
 
 
 local function on_button_long_click(self)
-	if self._style.on_click then
-		self._style.on_click(self, self.anim_node)
-	end
+	self.style.on_click(self, self.anim_node)
+
 	self.click_in_row = 1
 	local time = socket.gettime() - self.last_pressed_time
 	self.on_long_click:trigger(self:get_context(), self.params, self, time)
@@ -101,9 +90,8 @@ end
 
 
 local function on_button_double_click(self)
-	if self._style.on_click then
-		self._style.on_click(self, self.anim_node)
-	end
+	self.style.on_click(self, self.anim_node)
+
 	self.click_in_row = self.click_in_row + 1
 	self.on_double_click:trigger(self:get_context(), self.params, self, self.click_in_row)
 end
@@ -124,10 +112,10 @@ local function on_button_release(self)
 			self.can_action = false
 
 			local time = socket.gettime()
-			local is_long_click = (time - self.last_pressed_time) > self._style.LONGTAP_TIME
+			local is_long_click = (time - self.last_pressed_time) > self.style.LONGTAP_TIME
 			is_long_click = is_long_click and self.on_long_click:is_exist()
 
-			local is_double_click = (time - self.last_released_time) < self._style.DOUBLETAP_TIME
+			local is_double_click = (time - self.last_released_time) < self.style.DOUBLETAP_TIME
 			is_double_click = is_double_click and self.on_double_click:is_exist()
 
 			if is_long_click then
@@ -142,14 +130,32 @@ local function on_button_release(self)
 		end
 		return true
 	else
-		if self._style.on_click_disabled then
-			self._style.on_click_disabled(self, self.anim_node)
-		end
+		self.style.on_click_disabled(self, self.anim_node)
 		return false
 	end
 end
 
 
+--- Change style of component.
+-- This function can be called before component:init. This callback
+-- only for store component style params inside self context
+-- @function button:on_style_change
+-- @tparam table style The component style table
+function M.on_style_change(self, style)
+	self.style = {}
+	self.style.HOVER_SCKCOLOR = style.HOVER_SCKCOLOR or vmath.vector4(1)
+	self.style.LONGTAP_TIME = style.LONGTAP_TIME or 0.4
+	self.style.AUTOHOLD_TRIGGER = style.AUTOHOLD_TRIGGER or 0.8
+	self.style.DOUBLETAP_TIME = style.DOUBLETAP_TIME or 0.4
+
+	self.style.on_hover = style.on_hover or function(self, node, state) end
+	self.style.on_mouse_hover = style.on_mouse_hover or function(self, node, state) end
+	self.style.on_click = style.on_click or function(self, node) end
+	self.style.on_click_disabled = style.on_click_disabled or function(self, node) end
+	self.style.on_set_enabled = style.on_set_enabled or function(self, node, state) end
+end
+
+
 --- Component init function
 -- @function button:init
 -- @tparam node node Gui node
@@ -237,12 +243,12 @@ function M.on_input(self, action_id, action)
 	if not self.disabled and self.can_action and self.on_long_click:is_exist() then
 		local press_time = socket.gettime() - self.last_pressed_time
 
-		if self._style.AUTOHOLD_TRIGGER and self._style.AUTOHOLD_TRIGGER <= press_time then
+		if self.style.AUTOHOLD_TRIGGER <= press_time then
 			on_button_release(self)
 			return true
 		end
 
-		if press_time >= self._style.LONGTAP_TIME then
+		if press_time >= self.style.LONGTAP_TIME then
 			on_button_hold(self, press_time)
 			return true
 		end
@@ -262,9 +268,7 @@ end
 -- @tparam bool state Enabled state
 function M.set_enabled(self, state)
 	self.disabled = not state
-	if self._style.on_set_enabled then
-		self._style.on_set_enabled(self, self.node, state)
-	end
+	self.style.on_set_enabled(self, self.node, state)
 end
 
 
diff --git a/druid/base/checkbox.lua b/druid/base/checkbox.lua
index 7770be9..b651dd7 100644
--- a/druid/base/checkbox.lua
+++ b/druid/base/checkbox.lua
@@ -26,13 +26,26 @@ local function on_click(self)
 end
 
 
+--- Change style of component.
+-- This function can be called before component:init. This callback
+-- only for store component style params inside self context
+-- @function checkbox:on_style_change
+-- @tparam table style The component style table
+function M.on_style_change(self, style)
+	self.style = {}
+
+	self.style.on_change_state = style.on_change_state or function(self, node, state)
+		gui.set_enabled(node, state)
+	end
+end
+
+
 --- Component init function
 -- @function checkbox:init
 -- @tparam node node Gui node
 -- @tparam function callback Checkbox callback
 -- @tparam[opt=node] node click node Trigger node, by default equals to node
 function M.init(self, node, callback, click_node)
-	self.style = self:get_style()
 	self.druid = self:get_druid()
 	self.node = self:get_node(node)
 	self.click_node = self:get_node(click_node)
@@ -54,9 +67,7 @@ function M.set_state(self, state, is_silent)
 	end
 
 	self.state = state
-	if self.style.on_change_state then
-		self.style.on_change_state(self, self.node, state)
-	end
+	self.style.on_change_state(self, self.node, state)
 
 	if not is_silent then
 		self.on_change_state:trigger(self:get_context(), state)
diff --git a/druid/base/drag.lua b/druid/base/drag.lua
index 8e1199a..fbf1dd7 100644
--- a/druid/base/drag.lua
+++ b/druid/base/drag.lua
@@ -128,12 +128,22 @@ local function on_touch_release(self, action_id, action)
 end
 
 
+--- Change style of component.
+-- This function can be called before component:init. This callback
+-- only for store component style params inside self context
+-- @function drag:on_style_change
+-- @tparam table style The component style table
+function M.on_style_change(self, style)
+	self.style = {}
+	self.style.DRAG_DEADZONE = style.DRAG_DEADZONE or 10
+end
+
+
 --- Drag component constructor
 -- @tparam node node GUI node to detect dragging
 -- @tparam function on_drag_callback Callback for on_drag_event(self, dx, dy)
 -- @function drag:init
 function M.init(self, node, on_drag_callback)
-	self.style = self:get_style()
 	self.node = self:get_node(node)
 
 	self.dx = 0
diff --git a/druid/base/input.lua b/druid/base/input.lua
index 6e8ef8e..c4af9da 100644
--- a/druid/base/input.lua
+++ b/druid/base/input.lua
@@ -25,7 +25,6 @@
 --- Component style params
 -- @table Style
 -- @tfield bool IS_LONGTAP_ERASE Is long tap will erase current input data
--- @tfield number BUTTON_SELECT_INCREASE Button scale multiplier on selecting input field
 -- @tfield string MASK_DEFAULT_CHAR Default character mask for password input
 -- @tfield function on_select (self, button_node) Callback on input field selecting
 -- @tfield function on_unselect (self, button_node) Callback on input field unselecting
@@ -67,9 +66,7 @@ local function select(self)
 		gui.show_keyboard(self.keyboard_type, false)
 		self.on_input_select:trigger(self:get_context())
 
-		if self.style.on_select then
-			self.style.on_select(self, self.button.node)
-		end
+		self.style.on_select(self, self.button.node)
 	end
 end
 
@@ -85,9 +82,7 @@ local function unselect(self)
 		gui.hide_keyboard()
 		self.on_input_unselect:trigger(self:get_context())
 
-		if self.style.on_unselect then
-			self.style.on_unselect(self, self.button.node)
-		end
+		self.style.on_unselect(self, self.button.node)
 	end
 end
 
@@ -101,9 +96,31 @@ local function clear_and_select(self)
 end
 
 
+--- Change style of component.
+-- This function can be called before component:init. This callback
+-- only for store component style params inside self context
+-- @function input:on_style_change
+-- @tparam table style The component style table
+function M.on_style_change(self, style)
+	self.style = {}
+
+	self.style.IS_LONGTAP_ERASE = style.IS_LONGTAP_ERASE or false
+	self.style.MASK_DEFAULT_CHAR = style.MASK_DEFAULT_CHAR or "*"
+
+	self.style.on_select = style.on_select or function(self, button_node) end
+	self.style.on_unselect = style.on_unselect or function(self, button_node) end
+	self.style.on_input_wrong = style.on_input_wrong or function(self, button_node) end
+
+	self.style.button_style = style.button_style or {
+		LONGTAP_TIME = 0.4,
+		AUTOHOLD_TRIGGER = 0.8,
+		DOUBLETAP_TIME = 0.4
+	}
+end
+
+
 function M.init(self, click_node, text_node, keyboard_type)
 	self.druid = self:get_druid(self)
-	self.style = self:get_style(self)
 	self.text = self.druid:new_text(text_node)
 
 	self.selected = false
@@ -158,9 +175,7 @@ function M.on_input(self, action_id, action)
 					end
 				else
 					self.on_input_wrong:trigger(self:get_context(), action.text)
-					if self.style.on_input_wrong then
-						self.style.on_input_wrong(self, self.button.node)
-					end
+					self.style.on_input_wrong(self, self.button.node)
 				end
 				self.marked_value = ""
 			end
diff --git a/druid/base/progress.lua b/druid/base/progress.lua
index 4b3d58b..2390aa0 100644
--- a/druid/base/progress.lua
+++ b/druid/base/progress.lua
@@ -70,6 +70,18 @@ local function set_bar_to(self, set_to, is_silent)
 end
 
 
+--- Change style of component.
+-- This function can be called before component:init. This callback
+-- only for store component style params inside self context
+-- @function progress:on_style_change
+-- @tparam table style The component style table
+function M.on_style_change(self, style)
+	self.style = {}
+	self.style.SPEED = style.SPEED or 5
+	self.style.MIN_DELTA = style.MIN_DELTA or 0.005
+end
+
+
 --- Component init function
 -- @function progress:init
 -- @tparam string|node node Progress bar fill node or node name
@@ -81,7 +93,6 @@ function M.init(self, node, key, init_value)
 	self.prop = hash("scale."..key)
 	self.key = key
 
-	self.style = self:get_style()
 	self.node = self:get_node(node)
 	self.scale = gui.get_scale(self.node)
 	self.size = gui.get_size(self.node)
diff --git a/druid/base/scroll.lua b/druid/base/scroll.lua
index d3215da..fb92d1a 100644
--- a/druid/base/scroll.lua
+++ b/druid/base/scroll.lua
@@ -302,17 +302,18 @@ local function update_size(self)
 	-- We add extra size only if scroll is available
 	-- Even the content zone size less than view zone size
 	local content_border_extra = helper.get_border(self.content_node)
+	local stretch_size = self.style.EXTRA_STRECH_SIZE
 
 	if self.drag.can_x then
 		local sign = content_size.x > view_size.x and 1 or -1
-		content_border_extra.x = content_border_extra.x - self.extra_stretch_size * sign
-		content_border_extra.z = content_border_extra.z + self.extra_stretch_size * sign
+		content_border_extra.x = content_border_extra.x - stretch_size * sign
+		content_border_extra.z = content_border_extra.z + stretch_size * sign
 	end
 
 	if self.drag.can_y then
 		local sign = content_size.y > view_size.y and 1 or -1
-		content_border_extra.y = content_border_extra.y + self.extra_stretch_size * sign
-		content_border_extra.w = content_border_extra.w - self.extra_stretch_size * sign
+		content_border_extra.y = content_border_extra.y + stretch_size * sign
+		content_border_extra.w = content_border_extra.w - stretch_size * sign
 	end
 
 	if not self.style.SMALL_CONTENT_SCROLL then
@@ -325,13 +326,37 @@ local function update_size(self)
 end
 
 
+--- Change style of component.
+-- This function can be called before component:init. This callback
+-- only for store component style params inside self context
+-- @function scroll:on_style_change
+-- @tparam table style The component style table
+function M.on_style_change(self, style)
+	self.style = {}
+	self.style.EXTRA_STRECH_SIZE = style.EXTRA_STRECH_SIZE or 0
+	self.style.ANIM_SPEED = style.ANIM_SPEED or 0.2
+	self.style.BACK_SPEED = style.BACK_SPEED or 0.35
+
+	self.style.FRICT = style.FRICT or 0
+	self.style.FRICT_HOLD = style.FRICT_HOLD or 0
+
+	self.style.INERT_THRESHOLD = style.INERT_THRESHOLD or 3
+	self.style.INERT_SPEED = style.INERT_SPEED or 30
+	self.style.POINTS_DEADZONE = style.POINTS_DEADZONE or 20
+	self.style.SMALL_CONTENT_SCROLL = style.SMALL_CONTENT_SCROLL or false
+
+	self._is_inert = not (self.style.FRICT == 0 or
+		self.style.FRICT_HOLD == 0 or
+		self.style.INERT_SPEED == 0)
+end
+
+
 --- Scroll constructor.
 -- @function scroll:init
 -- @tparam node view_node GUI view scroll node
 -- @tparam node content_node GUI content scroll node
 function M.init(self, view_node, content_node)
 	self.druid = self:get_druid()
-	self.style = self:get_style()
 
 	self.view_node = self:get_node(view_node)
 	self.content_node = self:get_node(content_node)
@@ -349,9 +374,7 @@ function M.init(self, view_node, content_node)
 	self.on_point_scroll = Event()
 
 	self.selected = nil
-	self._is_inert = true
 	self.is_animate = false
-	self.extra_stretch_size = self.style.EXTRA_STRECH_SIZE
 
 	update_size(self)
 end
@@ -486,10 +509,10 @@ end
 --- Set extra size for scroll stretching.
 -- Set 0 to disable stretching effect
 -- @function scroll:set_extra_strech_size
--- @tparam number stretch_size Size in pixels of additional scroll area
+-- @tparam[opt=0] number stretch_size Size in pixels of additional scroll area
 -- @treturn druid.scroll Self instance
 function M.set_extra_strech_size(self, stretch_size)
-	self.extra_stretch_size = stretch_size or self.style.EXTRA_STRECH_SIZE
+	self.style.EXTRA_STRECH_SIZE = stretch_size or 0
 	update_size(self)
 
 	return self
diff --git a/druid/base/swipe.lua b/druid/base/swipe.lua
index f725c28..b4d28b3 100644
--- a/druid/base/swipe.lua
+++ b/druid/base/swipe.lua
@@ -67,12 +67,24 @@ local function check_swipe(self, action)
 end
 
 
+--- Change style of component.
+-- This function can be called before component:init. This callback
+-- only for store component style params inside self context
+-- @function swipe:on_style_change
+-- @tparam table style The component style table
+function M.on_style_change(self, style)
+	self.style = {}
+	self.style.SWIPE_THRESHOLD = style.SWIPE_THRESHOLD or 50
+	self.style.SWIPE_TIME = style.SWIPE_TIME or 0.4
+	self.style.SWIPE_TRIGGER_ON_MOVE = style.SWIPE_TRIGGER_ON_MOVE or false
+end
+
+
 --- Component init function
 -- @function swipe:init
 -- @tparam node node Gui node
 -- @tparam function on_swipe_callback Swipe callback for on_swipe_end event
 function M.init(self, node, on_swipe_callback)
-	self.style = self:get_style()
 	self._trigger_on_move = self.style.SWIPE_TRIGGER_ON_MOVE
 	self.node = self:get_node(node)
 
diff --git a/druid/component.lua b/druid/component.lua
index 2b0c9d1..debb3c2 100644
--- a/druid/component.lua
+++ b/druid/component.lua
@@ -9,24 +9,18 @@ local class = require("druid.system.middleclass")
 local Component = class("druid.component")
 
 
---- Get current component style table
--- @function component:get_style
--- @treturn table Component style table
-function Component.get_style(self)
-	if not self._meta.style then
-		return const.EMPTY_TABLE
-	end
-
-	return self._meta.style[self._component.name] or const.EMPTY_TABLE
-end
-
-
---- Set current component style table
+--- Set current component style table.
+-- Invoke `on_style_change` on component, if exist. Component should handle
+-- their style changing and store all style params
 -- @function component:set_style
 -- @tparam table style Druid style module
 function Component.set_style(self, druid_style)
-	self._meta.style = druid_style
-	self._style = self:get_style()
+	self._meta.style = druid_style or const.EMPTY_TABLE
+	local component_style = self._meta.style[self._component.name] or const.EMPTY_TABLE
+
+	if self.on_style_change then
+		self:on_style_change(component_style)
+	end
 end
 
 
diff --git a/druid/druid.lua b/druid/druid.lua
index c3b4533..707eb28 100644
--- a/druid/druid.lua
+++ b/druid/druid.lua
@@ -69,7 +69,7 @@ end
 -- @function druid.set_default_style
 -- @tparam table style Druid style module
 function M.set_default_style(style)
-	settings.default_style = style
+	settings.default_style = style or {}
 end
 
 
diff --git a/druid/styles/default/style.lua b/druid/styles/default/style.lua
index 9b5e9a1..27248f5 100644
--- a/druid/styles/default/style.lua
+++ b/druid/styles/default/style.lua
@@ -118,10 +118,6 @@ M["input"] = {
 	end,
 
 	button = {
-		BTN_SOUND = "click",
-		BTN_SOUND_DISABLED = "click",
-		DISABLED_COLOR = vmath.vector4(0, 0, 0, 1),
-		ENABLED_COLOR = vmath.vector4(1),
 		LONGTAP_TIME = 0.4,
 		AUTOHOLD_TRIGGER = 0.8,
 		DOUBLETAP_TIME = 0.4,
diff --git a/druid/styles/empty/style.lua b/druid/styles/empty/style.lua
index 137c805..a564707 100644
--- a/druid/styles/empty/style.lua
+++ b/druid/styles/empty/style.lua
@@ -1,51 +1 @@
-local M = {}
-
-
-M["button"] = {
-	BTN_SOUND = "click",
-	BTN_SOUND_DISABLED = "click",
-	DISABLED_COLOR = vmath.vector4(0, 0, 0, 1),
-	ENABLED_COLOR = vmath.vector4(1),
-	LONGTAP_TIME = 0.4,
-	DOUBLETAP_TIME = 0.4,
-}
-
-
-M["scroll"] = {
-	FRICT_HOLD = 0, -- mult. for inert, while touching
-	FRICT = 0, -- mult for free inert
-	INERT_THRESHOLD = 2, -- speed to stop inertion
-	INERT_SPEED = 0, -- koef. of inert speed
-	DEADZONE = 6, -- in px
-	SOFT_ZONE_SIZE = 20, -- size of outside zone (back move)
-	BACK_SPEED = 0, -- lerp speed
-	ANIM_SPEED = 0, -- gui.animation speed to point
-}
-
-
-M["progress"] = {
-	SPEED = 5, -- progress bar fill rate, more faster
-	MIN_DELTA = 1
-}
-
-
-M["progress_rich"] = {
-	DELAY = 0, -- delay in seconds before main fill
-}
-
-
-M["checkbox"] = {
-	on_change_state = function(self, node, state)
-		gui.set_enabled(node, state)
-	end
-}
-
-
-M["swipe"] = {
-	SWIPE_THRESHOLD = 50,
-	SWIPE_TIME = 0.4,
-	SWIPE_TRIGGER_ON_MOVE = false
-}
-
-
-return M
+return {}
diff --git a/druid/styles/sprites/style.lua b/druid/styles/sprites/style.lua
index 9520af2..6840f10 100644
--- a/druid/styles/sprites/style.lua
+++ b/druid/styles/sprites/style.lua
@@ -2,12 +2,9 @@ local M = {}
 
 
 M["button"] = {
-	BTN_SOUND = "click",
-	BTN_SOUND_DISABLED = "click",
-	DISABLED_COLOR = vmath.vector4(0, 0, 0, 1),
-	ENABLED_COLOR = vmath.vector4(1),
 	LONGTAP_TIME = 0.4,
 	DOUBLETAP_TIME = 0.4,
+
 	HOVER_MOUSE_IMAGE = "button_yellow",
 	DEFAULT_IMAGE = "button_blue",
 	HOVER_IMAGE = "button_red",
@@ -24,41 +21,4 @@ M["button"] = {
 }
 
 
-M["scroll"] = {
-	FRICT_HOLD = 0, -- mult. for inert, while touching
-	FRICT = 0, -- mult for free inert
-	INERT_THRESHOLD = 2, -- speed to stop inertion
-	INERT_SPEED = 0, -- koef. of inert speed
-	DEADZONE = 6, -- in px
-	SOFT_ZONE_SIZE = 20, -- size of outside zone (back move)
-	BACK_SPEED = 0, -- lerp speed
-	ANIM_SPEED = 0, -- gui.animation speed to point
-}
-
-
-M["progress"] = {
-	SPEED = 5, -- progress bar fill rate, more faster
-	MIN_DELTA = 1
-}
-
-
-M["progress_rich"] = {
-	DELAY = 0, -- delay in seconds before main fill
-}
-
-
-M["checkbox"] = {
-	on_change_state = function(self, node, state)
-		gui.set_enabled(node, state)
-	end
-}
-
-
-M["swipe"] = {
-	SWIPE_THRESHOLD = 50,
-	SWIPE_TIME = 0.4,
-	SWIPE_TRIGGER_ON_MOVE = false
-}
-
-
 return M

From 7ed7e8e79869f9e73a2e28177937e006b134057d Mon Sep 17 00:00:00 2001
From: Insality <insality@gmail.com>
Date: Sat, 9 May 2020 13:35:30 +0300
Subject: [PATCH 2/2] Update style annotations

---
 druid/base/button.lua   | 35 +++++++++++++++++------------------
 druid/base/checkbox.lua | 16 ++++++----------
 druid/base/drag.lua     | 14 +++++---------
 druid/base/input.lua    | 26 +++++++++++---------------
 druid/base/progress.lua | 16 ++++++----------
 druid/base/scroll.lua   | 30 +++++++++++++-----------------
 druid/base/swipe.lua    | 21 +++++++++------------
 7 files changed, 67 insertions(+), 91 deletions(-)

diff --git a/druid/base/button.lua b/druid/base/button.lua
index 3c89b46..4aeabb3 100644
--- a/druid/base/button.lua
+++ b/druid/base/button.lua
@@ -21,13 +21,6 @@
 -- @tfield druid.hover hover Druid hover logic component
 -- @tfield[opt] node click_zone Restriction zone
 
---- Component style params
--- @table Style
--- @tfield function on_click (self, node)
--- @tfield function on_click_disabled (self, node)
--- @tfield function on_hover (self, node, hover_state)
--- @tfield function on_set_enabled (self, node, enabled_state)
-
 local Event = require("druid.event")
 local const = require("druid.const")
 local helper = require("druid.helper")
@@ -136,23 +129,29 @@ local function on_button_release(self)
 end
 
 
---- Change style of component.
--- This function can be called before component:init. This callback
--- only for store component style params inside self context
--- @function button:on_style_change
--- @tparam table style The component style table
+--- Component style params.
+-- You can override this component styles params in druid styles table
+-- or create your own style
+-- @table Style
+-- @tfield[opt=0.4] number LONGTAP_TIME Minimum time to trigger on_hold_callback
+-- @tfield[opt=0.8] number AUTOHOLD_TRIGGER Maximum hold time to trigger button release while holding
+-- @tfield[opt=0.4] number DOUBLETAP_TIME Time between double taps
+-- @tfield function on_click (self, node)
+-- @tfield function on_click_disabled (self, node)
+-- @tfield function on_hover (self, node, hover_state)
+-- @tfield function on_mouse_hover (self, node, hover_state)
+-- @tfield function on_set_enabled (self, node, enabled_state)
 function M.on_style_change(self, style)
 	self.style = {}
-	self.style.HOVER_SCKCOLOR = style.HOVER_SCKCOLOR or vmath.vector4(1)
 	self.style.LONGTAP_TIME = style.LONGTAP_TIME or 0.4
 	self.style.AUTOHOLD_TRIGGER = style.AUTOHOLD_TRIGGER or 0.8
 	self.style.DOUBLETAP_TIME = style.DOUBLETAP_TIME or 0.4
 
-	self.style.on_hover = style.on_hover or function(self, node, state) end
-	self.style.on_mouse_hover = style.on_mouse_hover or function(self, node, state) end
-	self.style.on_click = style.on_click or function(self, node) end
-	self.style.on_click_disabled = style.on_click_disabled or function(self, node) end
-	self.style.on_set_enabled = style.on_set_enabled or function(self, node, state) end
+	self.style.on_click = style.on_click or function(_, node) end
+	self.style.on_click_disabled = style.on_click_disabled or function(_, node) end
+	self.style.on_mouse_hover = style.on_mouse_hover or function(_, node, state) end
+	self.style.on_hover = style.on_hover or function(_, node, state) end
+	self.style.on_set_enabled = style.on_set_enabled or function(_, node, state) end
 end
 
 
diff --git a/druid/base/checkbox.lua b/druid/base/checkbox.lua
index b651dd7..28307a6 100644
--- a/druid/base/checkbox.lua
+++ b/druid/base/checkbox.lua
@@ -11,10 +11,6 @@
 -- @tfield[opt=node] node click_node Button trigger node
 -- @tfield druid.button button Button component from click_node
 
---- Component style params
--- @table Style
--- @tfield function on_change_state (self, node, state)
-
 local Event = require("druid.event")
 local component = require("druid.component")
 
@@ -26,15 +22,15 @@ local function on_click(self)
 end
 
 
---- Change style of component.
--- This function can be called before component:init. This callback
--- only for store component style params inside self context
--- @function checkbox:on_style_change
--- @tparam table style The component style table
+--- Component style params.
+-- You can override this component styles params in druid styles table
+-- or create your own style
+-- @table Style
+-- @tfield function on_change_state (self, node, state)
 function M.on_style_change(self, style)
 	self.style = {}
 
-	self.style.on_change_state = style.on_change_state or function(self, node, state)
+	self.style.on_change_state = style.on_change_state or function(_, node, state)
 		gui.set_enabled(node, state)
 	end
 end
diff --git a/druid/base/drag.lua b/druid/base/drag.lua
index fbf1dd7..2c7e9a8 100644
--- a/druid/base/drag.lua
+++ b/druid/base/drag.lua
@@ -22,10 +22,6 @@
 -- @tfield number y Current touch y position
 -- @tfield vector3 touch_start_pos Touch start position
 
---- Component style params
--- @table Style
--- @tfield number DRAG_DEADZONE Distance in pixels to start dragging
-
 local Event = require("druid.event")
 local const = require("druid.const")
 local helper = require("druid.helper")
@@ -128,11 +124,11 @@ local function on_touch_release(self, action_id, action)
 end
 
 
---- Change style of component.
--- This function can be called before component:init. This callback
--- only for store component style params inside self context
--- @function drag:on_style_change
--- @tparam table style The component style table
+--- Component style params.
+-- You can override this component styles params in druid styles table
+-- or create your own style
+-- @table Style
+-- @tfield[opt=10] number DRAG_DEADZONE Distance in pixels to start dragging
 function M.on_style_change(self, style)
 	self.style = {}
 	self.style.DRAG_DEADZONE = style.DRAG_DEADZONE or 10
diff --git a/druid/base/input.lua b/druid/base/input.lua
index c4af9da..64ba693 100644
--- a/druid/base/input.lua
+++ b/druid/base/input.lua
@@ -22,15 +22,6 @@
 -- @tfield[opt] string allowerd_characters Pattern matching for user input
 -- @tfield number keyboard_type Gui keyboard type for input field
 
---- Component style params
--- @table Style
--- @tfield bool IS_LONGTAP_ERASE Is long tap will erase current input data
--- @tfield string MASK_DEFAULT_CHAR Default character mask for password input
--- @tfield function on_select (self, button_node) Callback on input field selecting
--- @tfield function on_unselect (self, button_node) Callback on input field unselecting
--- @tfield function on_input_wrong (self, button_node) Callback on wrong user input
--- @tfield table button Custom button style for input node
-
 local Event = require("druid.event")
 local const = require("druid.const")
 local component = require("druid.component")
@@ -96,11 +87,16 @@ local function clear_and_select(self)
 end
 
 
---- Change style of component.
--- This function can be called before component:init. This callback
--- only for store component style params inside self context
--- @function input:on_style_change
--- @tparam table style The component style table
+--- Component style params.
+-- You can override this component styles params in druid styles table
+-- or create your own style
+-- @table Style
+-- @tfield[opt=false] bool IS_LONGTAP_ERASE Is long tap will erase current input data
+-- @tfield[opt=*] string MASK_DEFAULT_CHAR Default character mask for password input
+-- @tfield function on_select (self, button_node) Callback on input field selecting
+-- @tfield function on_unselect (self, button_node) Callback on input field unselecting
+-- @tfield function on_input_wrong (self, button_node) Callback on wrong user input
+-- @tfield table button_style Custom button style for input node
 function M.on_style_change(self, style)
 	self.style = {}
 
@@ -140,7 +136,7 @@ function M.init(self, click_node, text_node, keyboard_type)
 	self.keyboard_type = keyboard_type or gui.KEYBOARD_TYPE_DEFAULT
 
 	self.button = self.druid:new_button(click_node, select)
-	self.button:set_style(self.style)
+	self.button:set_style(self.button_style)
 	self.button.on_click_outside:subscribe(unselect)
 	self.button.on_long_click:subscribe(clear_and_select)
 
diff --git a/druid/base/progress.lua b/druid/base/progress.lua
index 2390aa0..b1f3687 100644
--- a/druid/base/progress.lua
+++ b/druid/base/progress.lua
@@ -15,11 +15,6 @@
 -- @tfield number max_size Maximum size of progress bar
 -- @tfield vector4 slice Progress bar slice9 settings
 
---- Component style params
--- @table Style
--- @tfield number SPEED Progress bas fill rate. More -> faster
--- @tfield number MIN_DELTA Minimum step to fill progress bar
-
 local Event = require("druid.event")
 local const = require("druid.const")
 local helper = require("druid.helper")
@@ -70,11 +65,12 @@ local function set_bar_to(self, set_to, is_silent)
 end
 
 
---- Change style of component.
--- This function can be called before component:init. This callback
--- only for store component style params inside self context
--- @function progress:on_style_change
--- @tparam table style The component style table
+--- Component style params.
+-- You can override this component styles params in druid styles table
+-- or create your own style
+-- @table Style
+-- @tfield[opt=5] number SPEED Progress bas fill rate. More -> faster
+-- @tfield[opt=0.005] number MIN_DELTA Minimum step to fill progress bar
 function M.on_style_change(self, style)
 	self.style = {}
 	self.style.SPEED = style.SPEED or 5
diff --git a/druid/base/scroll.lua b/druid/base/scroll.lua
index fb92d1a..02740f1 100644
--- a/druid/base/scroll.lua
+++ b/druid/base/scroll.lua
@@ -27,18 +27,6 @@
 -- @tfield[opt] selected Current index of points of interests
 -- @tfield bool is_animate Flag, if scroll now animating by gui.animate
 
---- Component style params
--- @table Style
--- @tfield number FRICT_HOLD Multiplier for inertion, while touching
--- @tfield number FRICT Multiplier for free inertion
--- @tfield number INERT_THRESHOLD Scroll speed to stop inertion
--- @tfield number INERT_SPEED Multiplier for inertion speed
--- @tfield number POINTS_DEADZONE Speed to check points of interests in no_inertion mode
--- @tfield number BACK_SPEED Scroll back returning lerp speed
--- @tfield number ANIM_SPEED Scroll gui.animation speed for scroll_to function
--- @tfield number EXTRA_STRECH_SIZE extra size in pixels outside of scroll (stretch effect)
--- @tfield bool SMALL_CONTENT_SCROLL If true, content node with size less than view node size can be scrolled
-
 local Event = require("druid.event")
 local const = require("druid.const")
 local helper = require("druid.helper")
@@ -326,11 +314,19 @@ local function update_size(self)
 end
 
 
---- Change style of component.
--- This function can be called before component:init. This callback
--- only for store component style params inside self context
--- @function scroll:on_style_change
--- @tparam table style The component style table
+--- Component style params.
+-- You can override this component styles params in druid styles table
+-- or create your own style
+-- @table Style
+-- @tfield[opt=0] number FRICT Multiplier for free inertion
+-- @tfield[opt=0] number FRICT_HOLD Multiplier for inertion, while touching
+-- @tfield[opt=3] number INERT_THRESHOLD Scroll speed to stop inertion
+-- @tfield[opt=30] number INERT_SPEED Multiplier for inertion speed
+-- @tfield[opt=20] number POINTS_DEADZONE Speed to check points of interests in no_inertion mode
+-- @tfield[opt=0.35] number BACK_SPEED Scroll back returning lerp speed
+-- @tfield[opt=0.2] number ANIM_SPEED Scroll gui.animation speed for scroll_to function
+-- @tfield[opt=0] number EXTRA_STRECH_SIZE extra size in pixels outside of scroll (stretch effect)
+-- @tfield[opt=false] bool SMALL_CONTENT_SCROLL If true, content node with size less than view node size can be scrolled
 function M.on_style_change(self, style)
 	self.style = {}
 	self.style.EXTRA_STRECH_SIZE = style.EXTRA_STRECH_SIZE or 0
diff --git a/druid/base/swipe.lua b/druid/base/swipe.lua
index b4d28b3..4845216 100644
--- a/druid/base/swipe.lua
+++ b/druid/base/swipe.lua
@@ -12,12 +12,6 @@
 -- @table Events
 -- @tfield druid_event on_swipe Trigger on swipe event
 
---- Component style params
--- @table Style
--- @tfield number SWIPE_TIME Maximum time for swipe trigger
--- @tfield number SWIPE_THRESHOLD Minimum distance for swipe trigger
--- @tfield bool SWIPE_TRIGGER_ON_MOVE If true, trigger on swipe moving, not only release action
-
 local Event = require("druid.event")
 local const = require("druid.const")
 local helper = require("druid.helper")
@@ -48,6 +42,7 @@ local function check_swipe(self, action)
 	if is_swipe then
 		local is_x_swipe = math.abs(dx) >= math.abs(dy)
 		local swipe_side = false
+
 		if is_x_swipe and dx > 0 then
 			swipe_side = const.SWIPE.RIGHT
 		end
@@ -67,15 +62,17 @@ local function check_swipe(self, action)
 end
 
 
---- Change style of component.
--- This function can be called before component:init. This callback
--- only for store component style params inside self context
--- @function swipe:on_style_change
--- @tparam table style The component style table
+--- Component style params.
+-- You can override this component styles params in druid styles table
+-- or create your own style
+-- @table Style
+-- @tfield[opt=0.4] number SWIPE_TIME Maximum time for swipe trigger
+-- @tfield[opt=50] number SWIPE_THRESHOLD Minimum distance for swipe trigger
+-- @tfield[opt=false] bool SWIPE_TRIGGER_ON_MOVE If true, trigger on swipe moving, not only release action
 function M.on_style_change(self, style)
 	self.style = {}
-	self.style.SWIPE_THRESHOLD = style.SWIPE_THRESHOLD or 50
 	self.style.SWIPE_TIME = style.SWIPE_TIME or 0.4
+	self.style.SWIPE_THRESHOLD = style.SWIPE_THRESHOLD or 50
 	self.style.SWIPE_TRIGGER_ON_MOVE = style.SWIPE_TRIGGER_ON_MOVE or false
 end