diff --git a/docs/source/examples/Widget Styling.ipynb b/docs/source/examples/Widget Styling.ipynb index e4163e4cdd..e58bafce8d 100644 --- a/docs/source/examples/Widget Styling.ipynb +++ b/docs/source/examples/Widget Styling.ipynb @@ -645,6 +645,29 @@ "s1" ] }, + { + "cell_type": "markdown", + "metadata": {}, + "source": [ + "Styles can be given when a widget is constructed, either as a specific Style instance or as a dictionary." + ] + }, + { + "cell_type": "code", + "execution_count": null, + "metadata": {}, + "outputs": [], + "source": [ + "b3 = Button(description='Styled button', style=dict(\n", + " font_style='italic',\n", + " font_weight='bold',\n", + " font_variant=\"small-caps\",\n", + " text_color='red',\n", + " text_decoration='underline'\n", + "))\n", + "b3" + ] + }, { "cell_type": "markdown", "metadata": {}, diff --git a/ipywidgets/widgets/widget_bool.py b/ipywidgets/widgets/widget_bool.py index 189890bfd2..9b4d5e3edf 100644 --- a/ipywidgets/widgets/widget_bool.py +++ b/ipywidgets/widgets/widget_bool.py @@ -6,13 +6,34 @@ Represents a boolean using a widget. """ -from .widget_description import DescriptionWidget +from .widget_description import DescriptionStyle, DescriptionWidget from .widget_core import CoreWidget from .valuewidget import ValueWidget -from .widget import register +from .widget import register, widget_serialization +from .trait_types import Color, InstanceDict from traitlets import Unicode, Bool, CaselessStrEnum +@register +class CheckboxStyle(DescriptionStyle, CoreWidget): + """Checkbox widget style.""" + _model_name = Unicode('CheckboxStyleModel').tag(sync=True) + background = Unicode(None, allow_none=True, help="Background specifications.").tag(sync=True) + + +@register +class ToggleButtonStyle(DescriptionStyle, CoreWidget): + """ToggleButton widget style.""" + _model_name = Unicode('ToggleButtonStyleModel').tag(sync=True) + font_family = Unicode(None, allow_none=True, help="Toggle button text font family.").tag(sync=True) + font_size = Unicode(None, allow_none=True, help="Toggle button text font size.").tag(sync=True) + font_style = Unicode(None, allow_none=True, help="Toggle button text font style.").tag(sync=True) + font_variant = Unicode(None, allow_none=True, help="Toggle button text font variant.").tag(sync=True) + font_weight = Unicode(None, allow_none=True, help="Toggle button text font weight.").tag(sync=True) + text_color = Color(None, allow_none=True, help="Toggle button text color").tag(sync=True) + text_decoration = Unicode(None, allow_none=True, help="Toggle button text decoration.").tag(sync=True) + + class _Bool(DescriptionWidget, ValueWidget, CoreWidget): """A base class for creating widgets that represent booleans.""" value = Bool(False, help="Bool value").tag(sync=True) @@ -42,6 +63,8 @@ class Checkbox(_Bool): _view_name = Unicode('CheckboxView').tag(sync=True) _model_name = Unicode('CheckboxModel').tag(sync=True) indent = Bool(True, help="Indent the control to align with other controls with a description.").tag(sync=True) + style = InstanceDict(CheckboxStyle, help="Styling customizations").tag(sync=True, **widget_serialization) + @register @@ -69,6 +92,7 @@ class ToggleButton(_Bool): button_style = CaselessStrEnum( values=['primary', 'success', 'info', 'warning', 'danger', ''], default_value='', help="""Use a predefined styling for the button.""").tag(sync=True) + style = InstanceDict(ToggleButtonStyle, help="Styling customizations").tag(sync=True, **widget_serialization) @register diff --git a/ipywidgets/widgets/widget_button.py b/ipywidgets/widgets/widget_button.py index 3316e8a7a4..cdd51aabee 100644 --- a/ipywidgets/widgets/widget_button.py +++ b/ipywidgets/widgets/widget_button.py @@ -22,7 +22,13 @@ class ButtonStyle(Style, CoreWidget): """Button style widget.""" _model_name = Unicode('ButtonStyleModel').tag(sync=True) button_color = Color(None, allow_none=True, help="Color of the button").tag(sync=True) - font_weight = Unicode(help="Button text font weight.").tag(sync=True) + font_family = Unicode(None, allow_none=True, help="Button text font family.").tag(sync=True) + font_size = Unicode(None, allow_none=True, help="Button text font size.").tag(sync=True) + font_style = Unicode(None, allow_none=True, help="Button text font style.").tag(sync=True) + font_variant = Unicode(None, allow_none=True, help="Button text font variant.").tag(sync=True) + font_weight = Unicode(None, allow_none=True, help="Button text font weight.").tag(sync=True) + text_color = Unicode(None, allow_none=True, help="Button text color.").tag(sync=True) + text_decoration = Unicode(None, allow_none=True, help="Button text decoration.").tag(sync=True) @register diff --git a/ipywidgets/widgets/widget_string.py b/ipywidgets/widgets/widget_string.py index 8c54cfcb01..5056931f17 100644 --- a/ipywidgets/widgets/widget_string.py +++ b/ipywidgets/widgets/widget_string.py @@ -6,15 +6,50 @@ Represents a unicode string using a widget. """ -from .widget_description import DescriptionWidget +from .widget_description import DescriptionStyle, DescriptionWidget from .valuewidget import ValueWidget -from .widget import CallbackDispatcher, register +from .widget import CallbackDispatcher, register, widget_serialization from .widget_core import CoreWidget -from .trait_types import TypedTuple +from .trait_types import Color, InstanceDict, TypedTuple from traitlets import Unicode, Bool, Int from warnings import warn +class _StringStyle(DescriptionStyle, CoreWidget): + """Text input style widget.""" + _model_name = Unicode('StringStyleModel').tag(sync=True) + background = Unicode(None, allow_none=True, help="Background specifications.").tag(sync=True) + font_size = Unicode(None, allow_none=True, help="Text font size.").tag(sync=True) + text_color = Color(None, allow_none=True, help="Text color").tag(sync=True) + + +@register +class LabelStyle(_StringStyle): + """Label style widget.""" + _model_name = Unicode('LabelStyleModel').tag(sync=True) + font_family = Unicode(None, allow_none=True, help="Label text font family.").tag(sync=True) + font_style = Unicode(None, allow_none=True, help="Label text font style.").tag(sync=True) + font_variant = Unicode(None, allow_none=True, help="Label text font variant.").tag(sync=True) + font_weight = Unicode(None, allow_none=True, help="Label text font weight.").tag(sync=True) + text_decoration = Unicode(None, allow_none=True, help="Label text decoration.").tag(sync=True) + + +@register +class TextStyle(_StringStyle): + """Text input style widget.""" + _model_name = Unicode('TextStyleModel').tag(sync=True) + +@register +class HTMLStyle(_StringStyle): + """HTML style widget.""" + _model_name = Unicode('HTMLStyleModel').tag(sync=True) + +@register +class HTMLMathStyle(_StringStyle): + """HTML with math style widget.""" + _model_name = Unicode('HTMLMathStyleModel').tag(sync=True) + + class _String(DescriptionWidget, ValueWidget, CoreWidget): """Base class used to create widgets that represent a string.""" @@ -24,7 +59,7 @@ class _String(DescriptionWidget, ValueWidget, CoreWidget): # the text, not the bottom margin. See the last paragraph of # https://www.w3.org/TR/CSS2/visudet.html#leading placeholder = Unicode('\u200b', help="Placeholder text to display when nothing has been typed").tag(sync=True) - + style = InstanceDict(_StringStyle).tag(sync=True, **widget_serialization) def __init__(self, value=None, **kwargs): if value is not None: @@ -33,18 +68,19 @@ def __init__(self, value=None, **kwargs): _model_name = Unicode('StringModel').tag(sync=True) - @register class HTML(_String): """Renders the string `value` as HTML.""" _view_name = Unicode('HTMLView').tag(sync=True) _model_name = Unicode('HTMLModel').tag(sync=True) + style = InstanceDict(HTMLStyle).tag(sync=True, **widget_serialization) @register class HTMLMath(_String): """Renders the string `value` as HTML, and render mathematics.""" _view_name = Unicode('HTMLMathView').tag(sync=True) _model_name = Unicode('HTMLMathModel').tag(sync=True) + style = InstanceDict(HTMLMathStyle).tag(sync=True, **widget_serialization) @register @@ -56,6 +92,7 @@ class Label(_String): """ _view_name = Unicode('LabelView').tag(sync=True) _model_name = Unicode('LabelModel').tag(sync=True) + style = InstanceDict(LabelStyle).tag(sync=True, **widget_serialization) @register @@ -66,6 +103,7 @@ class Textarea(_String): rows = Int(None, allow_none=True, help="The number of rows to display.").tag(sync=True) disabled = Bool(False, help="Enable or disable user changes").tag(sync=True) continuous_update = Bool(True, help="Update the value as the user types. If False, update on submission, e.g., pressing Enter or navigating away.").tag(sync=True) + style = InstanceDict(TextStyle).tag(sync=True, **widget_serialization) @register class Text(_String): @@ -74,6 +112,7 @@ class Text(_String): _model_name = Unicode('TextModel').tag(sync=True) disabled = Bool(False, help="Enable or disable user changes").tag(sync=True) continuous_update = Bool(True, help="Update the value as the user types. If False, update on submission, e.g., pressing Enter or navigating away.").tag(sync=True) + style = InstanceDict(TextStyle).tag(sync=True, **widget_serialization) def __init__(self, *args, **kwargs): super().__init__(*args, **kwargs) diff --git a/packages/base/src/widget_style.ts b/packages/base/src/widget_style.ts index 18ab2c990e..64370d0e01 100644 --- a/packages/base/src/widget_style.ts +++ b/packages/base/src/widget_style.ts @@ -5,6 +5,11 @@ import { assign } from './utils'; import { WidgetModel, WidgetView, DOMWidgetView } from './widget'; +/** + * Three functions to deal with some CSS attributes + * to make them easier to use. + */ + export class StyleModel extends WidgetModel { defaults(): Backbone.ObjectHash { const Derived = this.constructor as typeof StyleModel; diff --git a/packages/controls/src/widget_bool.ts b/packages/controls/src/widget_bool.ts index 6f58446c92..8a21f6018c 100644 --- a/packages/controls/src/widget_bool.ts +++ b/packages/controls/src/widget_bool.ts @@ -1,11 +1,77 @@ // Copyright (c) Jupyter Development Team. // Distributed under the terms of the Modified BSD License. +import { DOMWidgetView } from '@jupyter-widgets/base'; + import { CoreDescriptionModel } from './widget_core'; -import { DescriptionView } from './widget_description'; +import { DescriptionStyleModel, DescriptionView } from './widget_description'; -import { DOMWidgetView } from '@jupyter-widgets/base'; +export class CheckboxStyleModel extends DescriptionStyleModel { + defaults(): Backbone.ObjectHash { + return { + ...super.defaults(), + _model_name: 'CheckboxStyleModel', + }; + } + + public static styleProperties = { + ...DescriptionStyleModel.styleProperties, + background: { + selector: '', + attribute: 'background', + default: null as any, + }, + }; +} + +export class ToggleButtonStyleModel extends DescriptionStyleModel { + defaults(): Backbone.ObjectHash { + return { + ...super.defaults(), + _model_name: 'ToggleButtonStyleModel', + }; + } + + public static styleProperties = { + ...DescriptionStyleModel.styleProperties, + font_family: { + selector: '', + attribute: 'font-family', + default: '', + }, + font_size: { + selector: '', + attribute: 'font-size', + default: '', + }, + font_style: { + selector: '', + attribute: 'font-style', + default: '', + }, + font_variant: { + selector: '', + attribute: 'font-variant', + default: '', + }, + font_weight: { + selector: '', + attribute: 'font-weight', + default: '', + }, + text_color: { + selector: '', + attribute: 'color', + default: '', + }, + text_decoration: { + selector: '', + attribute: 'text-decoration', + default: '', + }, + }; +} export class BoolModel extends CoreDescriptionModel { defaults(): Backbone.ObjectHash { @@ -23,6 +89,7 @@ export class CheckboxModel extends CoreDescriptionModel { return { ...super.defaults(), indent: true, + style: null, _view_name: 'CheckboxView', _model_name: 'CheckboxModel', }; @@ -183,6 +250,7 @@ export class ToggleButtonModel extends BoolModel { tooltip: '', icon: '', button_style: '', + style: null, }; } } diff --git a/packages/controls/src/widget_button.ts b/packages/controls/src/widget_button.ts index a1d0e75a64..df1ef1c340 100644 --- a/packages/controls/src/widget_button.ts +++ b/packages/controls/src/widget_button.ts @@ -23,11 +23,41 @@ export class ButtonStyleModel extends StyleModel { attribute: 'background-color', default: null as any, }, + font_family: { + selector: '', + attribute: 'font-family', + default: '', + }, + font_size: { + selector: '', + attribute: 'font-size', + default: '', + }, + font_style: { + selector: '', + attribute: 'font-style', + default: '', + }, + font_variant: { + selector: '', + attribute: 'font-variant', + default: '', + }, font_weight: { selector: '', attribute: 'font-weight', default: '', }, + text_color: { + selector: '', + attribute: 'color', + default: '', + }, + text_decoration: { + selector: '', + attribute: 'text-decoration', + default: '', + }, }; } diff --git a/packages/controls/src/widget_string.ts b/packages/controls/src/widget_string.ts index 5168c749b5..43e7e50e3d 100644 --- a/packages/controls/src/widget_string.ts +++ b/packages/controls/src/widget_string.ts @@ -3,15 +3,147 @@ import { CoreDescriptionModel } from './widget_core'; -import { DescriptionView } from './widget_description'; +import { DescriptionStyleModel, DescriptionView } from './widget_description'; import { uuid } from './utils'; +import { JUPYTER_CONTROLS_VERSION } from './version'; + /** * Class name for a combobox with an invalid value. */ const INVALID_VALUE_CLASS = 'jpwidgets-invalidComboValue'; +class StringStyleModel extends DescriptionStyleModel { + defaults(): Backbone.ObjectHash { + return { + ...super.defaults(), + _model_name: 'StringStyleModel', + _model_module: '@jupyter-widgets/controls', + _model_module_version: JUPYTER_CONTROLS_VERSION, + }; + } + + public static styleProperties = { + ...DescriptionStyleModel.styleProperties, + background: { + selector: '', + attribute: 'background', + default: null as any, + }, + font_size: { + selector: '', + attribute: 'font-size', + default: '', + }, + text_color: { + selector: '', + attribute: 'color', + default: '', + }, + }; +} + +export class HTMLStyleModel extends StringStyleModel { + defaults(): Backbone.ObjectHash { + return { + ...super.defaults(), + _model_name: 'HTMLStyleModel', + _model_module: '@jupyter-widgets/controls', + _model_module_version: JUPYTER_CONTROLS_VERSION, + }; + } + + public static styleProperties = { + ...StringStyleModel.styleProperties, + }; +} + +export class HTMLMathStyleModel extends StringStyleModel { + defaults(): Backbone.ObjectHash { + return { + ...super.defaults(), + _model_name: 'HTMLMathStyleModel', + _model_module: '@jupyter-widgets/controls', + _model_module_version: JUPYTER_CONTROLS_VERSION, + }; + } + + public static styleProperties = { + ...StringStyleModel.styleProperties, + }; +} + +export class LabelStyleModel extends StringStyleModel { + defaults(): Backbone.ObjectHash { + return { + ...super.defaults(), + _model_name: 'LabelStyleModel', + _model_module: '@jupyter-widgets/controls', + _model_module_version: JUPYTER_CONTROLS_VERSION, + }; + } + + public static styleProperties = { + ...StringStyleModel.styleProperties, + font_family: { + selector: '', + attribute: 'font-family', + default: '', + }, + font_style: { + selector: '', + attribute: 'font-style', + default: '', + }, + font_variant: { + selector: '', + attribute: 'font-variant', + default: '', + }, + font_weight: { + selector: '', + attribute: 'font-weight', + default: '', + }, + text_decoration: { + selector: '', + attribute: 'text-decoration', + default: '', + }, + }; +} + +export class TextStyleModel extends DescriptionStyleModel { + defaults(): Backbone.ObjectHash { + return { + ...super.defaults(), + _model_name: 'TextStyleModel', + _model_module: '@jupyter-widgets/controls', + _model_module_version: JUPYTER_CONTROLS_VERSION, + }; + } + + public static styleProperties = { + ...DescriptionStyleModel.styleProperties, + background: { + selector: '.widget-input', + attribute: 'background', + default: null as any, + }, + font_size: { + selector: '.widget-input', + attribute: 'font-size', + default: '', + }, + text_color: { + selector: '.widget-input', + attribute: 'color', + default: '', + }, + }; +} + export class StringModel extends CoreDescriptionModel { defaults(): Backbone.ObjectHash { return { @@ -193,6 +325,7 @@ export class TextareaView extends StringView { this.textbox = document.createElement('textarea'); this.textbox.setAttribute('rows', '5'); this.textbox.id = this.label.htmlFor = uuid(); + this.textbox.classList.add('widget-input'); this.el.appendChild(this.textbox); this.update(); // Set defaults. @@ -338,6 +471,7 @@ export class TextView extends StringView { this.textbox = document.createElement('input'); this.textbox.setAttribute('type', this.inputType); this.textbox.id = this.label.htmlFor = uuid(); + this.textbox.classList.add('widget-input'); this.el.appendChild(this.textbox); this.update(); // Set defaults. diff --git a/packages/schema/jupyterwidgetmodels.latest.json b/packages/schema/jupyterwidgetmodels.latest.json index a8b2f51874..d7f0dc2edd 100644 --- a/packages/schema/jupyterwidgetmodels.latest.json +++ b/packages/schema/jupyterwidgetmodels.latest.json @@ -1108,7 +1108,7 @@ "type": "string" }, { - "default": "@jupyter-widgets/base", + "default": "@jupyter-widgets/controls", "help": "", "name": "_view_module", "type": "string" @@ -1120,7 +1120,7 @@ "type": "string" }, { - "default": "StyleView", + "default": "ButtonStyleView", "help": "", "name": "_view_name", "type": "string" @@ -1133,10 +1133,53 @@ "type": "string" }, { - "default": "", + "allow_none": true, + "default": null, + "help": "Button text font family.", + "name": "font_family", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Button text font size.", + "name": "font_size", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Button text font style.", + "name": "font_style", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Button text font variant.", + "name": "font_variant", + "type": "string" + }, + { + "allow_none": true, + "default": null, "help": "Button text font weight.", "name": "font_weight", "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Button text color.", + "name": "text_color", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Button text decoration.", + "name": "text_decoration", + "type": "string" } ], "model": { @@ -1145,8 +1188,8 @@ "version": "2.0.0" }, "view": { - "module": "@jupyter-widgets/base", - "name": "StyleView", + "module": "@jupyter-widgets/controls", + "name": "ButtonStyleView", "version": "2.0.0" } }, @@ -1233,7 +1276,7 @@ "help": "Styling customizations", "name": "style", "type": "reference", - "widget": "DescriptionStyle" + "widget": "_BoolStyle" }, { "allow_none": true, @@ -1602,10 +1645,10 @@ }, { "default": "reference to new instance", - "help": "Styling customizations", + "help": "", "name": "style", "type": "reference", - "widget": "DescriptionStyle" + "widget": "TextStyle" }, { "allow_none": true, @@ -3761,6 +3804,19 @@ "type": "reference", "widget": "Layout" }, + { + "default": "\u200b", + "help": "Placeholder text to display when nothing has been typed", + "name": "placeholder", + "type": "string" + }, + { + "default": "reference to new instance", + "help": "", + "name": "style", + "type": "reference", + "widget": "_StringStyle" + }, { "allow_none": true, "default": null, @@ -3972,10 +4028,10 @@ }, { "default": "reference to new instance", - "help": "Styling customizations", + "help": "", "name": "style", "type": "reference", - "widget": "DescriptionStyle" + "widget": "_StringStyle" }, { "allow_none": true, @@ -5031,10 +5087,10 @@ }, { "default": "reference to new instance", - "help": "Styling customizations", + "help": "", "name": "style", "type": "reference", - "widget": "DescriptionStyle" + "widget": "LabelStyle" }, { "allow_none": true, @@ -5068,6 +5124,118 @@ "version": "2.0.0" } }, + { + "attributes": [ + { + "default": "@jupyter-widgets/controls", + "help": "", + "name": "_model_module", + "type": "string" + }, + { + "default": "2.0.0", + "help": "", + "name": "_model_module_version", + "type": "string" + }, + { + "default": "LabelStyleModel", + "help": "", + "name": "_model_name", + "type": "string" + }, + { + "default": "@jupyter-widgets/base", + "help": "", + "name": "_view_module", + "type": "string" + }, + { + "default": "2.0.0", + "help": "", + "name": "_view_module_version", + "type": "string" + }, + { + "default": "StyleView", + "help": "", + "name": "_view_name", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Background specifications.", + "name": "background", + "type": "string" + }, + { + "default": "", + "help": "Width of the description to the side of the control.", + "name": "description_width", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Label text font family.", + "name": "font_family", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Text font size.", + "name": "font_size", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Label text font style.", + "name": "font_style", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Label text font variant.", + "name": "font_variant", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Label text font weight.", + "name": "font_weight", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Text color", + "name": "text_color", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Label text decoration.", + "name": "text_decoration", + "type": "string" + } + ], + "model": { + "module": "@jupyter-widgets/controls", + "name": "LabelStyleModel", + "version": "2.0.0" + }, + "view": { + "module": "@jupyter-widgets/base", + "name": "StyleView", + "version": "2.0.0" + } + }, { "attributes": [ { @@ -5337,10 +5505,10 @@ }, { "default": "reference to new instance", - "help": "Styling customizations", + "help": "", "name": "style", "type": "reference", - "widget": "DescriptionStyle" + "widget": "TextStyle" }, { "allow_none": true, @@ -6534,6 +6702,83 @@ "version": "2.0.0" } }, + { + "attributes": [ + { + "default": "@jupyter-widgets/controls", + "help": "", + "name": "_model_module", + "type": "string" + }, + { + "default": "2.0.0", + "help": "", + "name": "_model_module_version", + "type": "string" + }, + { + "default": "StringStyleModel", + "help": "", + "name": "_model_name", + "type": "string" + }, + { + "default": "@jupyter-widgets/base", + "help": "", + "name": "_view_module", + "type": "string" + }, + { + "default": "2.0.0", + "help": "", + "name": "_view_module_version", + "type": "string" + }, + { + "default": "StyleView", + "help": "", + "name": "_view_name", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Background specifications.", + "name": "background", + "type": "string" + }, + { + "default": "", + "help": "Width of the description to the side of the control.", + "name": "description_width", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Text font size.", + "name": "font_size", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Text color", + "name": "text_color", + "type": "string" + } + ], + "model": { + "module": "@jupyter-widgets/controls", + "name": "StringStyleModel", + "version": "2.0.0" + }, + "view": { + "module": "@jupyter-widgets/base", + "name": "StyleView", + "version": "2.0.0" + } + }, { "attributes": [ { @@ -6744,10 +6989,10 @@ }, { "default": "reference to new instance", - "help": "Styling customizations", + "help": "", "name": "style", "type": "reference", - "widget": "DescriptionStyle" + "widget": "TextStyle" }, { "allow_none": true, @@ -6781,6 +7026,83 @@ "version": "2.0.0" } }, + { + "attributes": [ + { + "default": "@jupyter-widgets/controls", + "help": "", + "name": "_model_module", + "type": "string" + }, + { + "default": "2.0.0", + "help": "", + "name": "_model_module_version", + "type": "string" + }, + { + "default": "TextStyleModel", + "help": "", + "name": "_model_name", + "type": "string" + }, + { + "default": "@jupyter-widgets/base", + "help": "", + "name": "_view_module", + "type": "string" + }, + { + "default": "2.0.0", + "help": "", + "name": "_view_module_version", + "type": "string" + }, + { + "default": "StyleView", + "help": "", + "name": "_view_name", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Background specifications.", + "name": "background", + "type": "string" + }, + { + "default": "", + "help": "Width of the description to the side of the control.", + "name": "description_width", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Text font size.", + "name": "font_size", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Text color", + "name": "text_color", + "type": "string" + } + ], + "model": { + "module": "@jupyter-widgets/controls", + "name": "TextStyleModel", + "version": "2.0.0" + }, + "view": { + "module": "@jupyter-widgets/base", + "name": "StyleView", + "version": "2.0.0" + } + }, { "attributes": [ { @@ -6874,10 +7196,10 @@ }, { "default": "reference to new instance", - "help": "Styling customizations", + "help": "", "name": "style", "type": "reference", - "widget": "DescriptionStyle" + "widget": "TextStyle" }, { "allow_none": true, @@ -7136,7 +7458,7 @@ "help": "Styling customizations", "name": "style", "type": "reference", - "widget": "DescriptionStyle" + "widget": "ToggleButtonStyle" }, { "allow_none": true, @@ -7170,6 +7492,118 @@ "version": "2.0.0" } }, + { + "attributes": [ + { + "default": "@jupyter-widgets/controls", + "help": "", + "name": "_model_module", + "type": "string" + }, + { + "default": "2.0.0", + "help": "", + "name": "_model_module_version", + "type": "string" + }, + { + "default": "ToggleButtonStyleModel", + "help": "", + "name": "_model_name", + "type": "string" + }, + { + "default": "@jupyter-widgets/base", + "help": "", + "name": "_view_module", + "type": "string" + }, + { + "default": "2.0.0", + "help": "", + "name": "_view_module_version", + "type": "string" + }, + { + "default": "StyleView", + "help": "", + "name": "_view_name", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Background specifications.", + "name": "background", + "type": "string" + }, + { + "default": "", + "help": "Width of the description to the side of the control.", + "name": "description_width", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Toggle button text font family.", + "name": "font_family", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Toggle button text font size.", + "name": "font_size", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Toggle button text font style.", + "name": "font_style", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Toggle button text font variant.", + "name": "font_variant", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Toggle button text font weight.", + "name": "font_weight", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Toggle button text color", + "name": "text_color", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Toggle button text decoration.", + "name": "text_decoration", + "type": "string" + } + ], + "model": { + "module": "@jupyter-widgets/controls", + "name": "ToggleButtonStyleModel", + "version": "2.0.0" + }, + "view": { + "module": "@jupyter-widgets/base", + "name": "StyleView", + "version": "2.0.0" + } + }, { "attributes": [ { @@ -7565,7 +7999,7 @@ "help": "Styling customizations", "name": "style", "type": "reference", - "widget": "DescriptionStyle" + "widget": "_BoolStyle" }, { "allow_none": true, @@ -7815,5 +8249,68 @@ "name": "OutputView", "version": "1.0.0" } + }, + { + "attributes": [ + { + "default": "@jupyter-widgets/controls", + "help": "", + "name": "_model_module", + "type": "string" + }, + { + "default": "2.0.0", + "help": "", + "name": "_model_module_version", + "type": "string" + }, + { + "default": "BoolStyleModel", + "help": "", + "name": "_model_name", + "type": "string" + }, + { + "default": "@jupyter-widgets/base", + "help": "", + "name": "_view_module", + "type": "string" + }, + { + "default": "2.0.0", + "help": "", + "name": "_view_module_version", + "type": "string" + }, + { + "default": "StyleView", + "help": "", + "name": "_view_name", + "type": "string" + }, + { + "allow_none": true, + "default": null, + "help": "Background specifications.", + "name": "background", + "type": "string" + }, + { + "default": "", + "help": "Width of the description to the side of the control.", + "name": "description_width", + "type": "string" + } + ], + "model": { + "module": "_", + "name": "o", + "version": "B" + }, + "view": { + "module": "o", + "name": "S", + "version": "l" + } } ] diff --git a/packages/schema/jupyterwidgetmodels.latest.md b/packages/schema/jupyterwidgetmodels.latest.md index 3eb36670e3..26838ee0fe 100644 --- a/packages/schema/jupyterwidgetmodels.latest.md +++ b/packages/schema/jupyterwidgetmodels.latest.md @@ -201,7 +201,13 @@ Attribute | Type | Default | Help `_view_module_version` | string | `'2.0.0'` | `_view_name` | string | `'StyleView'` | `button_color` | `null` or string | `null` | Color of the button -`font_weight` | string | `''` | Button text font weight. +`font_family` | `null` or string | `null` | Button text font family. +`font_size` | `null` or string | `null` | Button text font size. +`font_style` | `null` or string | `null` | Button text font style. +`font_variant` | `null` or string | `null` | Button text font variant. +`font_weight` | `null` or string | `null` | Button text font weight. +`text_color` | `null` or string | `null` | Button text color. +`text_decoration` | `null` or string | `null` | Button text decoration. ### CheckboxModel (@jupyter-widgets/controls, 2.0.0); CheckboxView (@jupyter-widgets/controls, 2.0.0) @@ -219,11 +225,24 @@ Attribute | Type | Default | Help `disabled` | boolean | `false` | Enable or disable user changes. `indent` | boolean | `true` | Indent the control to align with other controls with a description. `layout` | reference to Layout widget | reference to new instance | -`style` | reference to DescriptionStyle widget | reference to new instance | Styling customizations +`style` | reference to CheckboxStyle widget | reference to new instance | Styling customizations `tabbable` | `null` or boolean | `null` | Is widget tabbable? `tooltip` | `null` or string | `null` | A tooltip caption. `value` | boolean | `false` | Bool value +### CheckboxStyleModel (@jupyter-widgets/controls, 2.0.0); StyleView (@jupyter-widgets/base, 2.0.0) + +Attribute | Type | Default | Help +-----------------|------------------|------------------|---- +`_model_module` | string | `'@jupyter-widgets/controls'` | +`_model_module_version` | string | `'2.0.0'` | +`_model_name` | string | `'CheckboxStyleModel'` | +`_view_module` | string | `'@jupyter-widgets/base'` | +`_view_module_version` | string | `'2.0.0'` | +`_view_name` | string | `'StyleView'` | +`background` | `null` or string | `null` | Background specifications. +`description_width` | string | `''` | Width of the description to the side of the control. + ### ColorPickerModel (@jupyter-widgets/controls, 2.0.0); ColorPickerView (@jupyter-widgets/controls, 2.0.0) Attribute | Type | Default | Help @@ -285,7 +304,7 @@ Attribute | Type | Default | Help `layout` | reference to Layout widget | reference to new instance | `options` | array of string | `[]` | Dropdown options for the combobox `placeholder` | string | `'\u200b'` | Placeholder text to display when nothing has been typed -`style` | reference to DescriptionStyle widget | reference to new instance | Styling customizations +`style` | reference to TextStyle widget | reference to new instance | `tabbable` | `null` or boolean | `null` | Is widget tabbable? `tooltip` | `null` or string | `null` | A tooltip caption. `value` | string | `''` | String value @@ -678,11 +697,26 @@ Attribute | Type | Default | Help `description_allow_html` | boolean | `false` | Accept HTML in the description. `layout` | reference to Layout widget | reference to new instance | `placeholder` | string | `'\u200b'` | Placeholder text to display when nothing has been typed -`style` | reference to DescriptionStyle widget | reference to new instance | Styling customizations +`style` | reference to HTMLMathStyle widget | reference to new instance | `tabbable` | `null` or boolean | `null` | Is widget tabbable? `tooltip` | `null` or string | `null` | A tooltip caption. `value` | string | `''` | String value +### HTMLMathStyleModel (@jupyter-widgets/controls, 2.0.0); StyleView (@jupyter-widgets/base, 2.0.0) + +Attribute | Type | Default | Help +-----------------|------------------|------------------|---- +`_model_module` | string | `'@jupyter-widgets/controls'` | +`_model_module_version` | string | `'2.0.0'` | +`_model_name` | string | `'HTMLMathStyleModel'` | +`_view_module` | string | `'@jupyter-widgets/base'` | +`_view_module_version` | string | `'2.0.0'` | +`_view_name` | string | `'StyleView'` | +`background` | `null` or string | `null` | Background specifications. +`description_width` | string | `''` | Width of the description to the side of the control. +`font_size` | `null` or string | `null` | Text font size. +`text_color` | `null` or string | `null` | Text color + ### HTMLModel (@jupyter-widgets/controls, 2.0.0); HTMLView (@jupyter-widgets/controls, 2.0.0) Attribute | Type | Default | Help @@ -698,11 +732,26 @@ Attribute | Type | Default | Help `description_allow_html` | boolean | `false` | Accept HTML in the description. `layout` | reference to Layout widget | reference to new instance | `placeholder` | string | `'\u200b'` | Placeholder text to display when nothing has been typed -`style` | reference to DescriptionStyle widget | reference to new instance | Styling customizations +`style` | reference to HTMLStyle widget | reference to new instance | `tabbable` | `null` or boolean | `null` | Is widget tabbable? `tooltip` | `null` or string | `null` | A tooltip caption. `value` | string | `''` | String value +### HTMLStyleModel (@jupyter-widgets/controls, 2.0.0); StyleView (@jupyter-widgets/base, 2.0.0) + +Attribute | Type | Default | Help +-----------------|------------------|------------------|---- +`_model_module` | string | `'@jupyter-widgets/controls'` | +`_model_module_version` | string | `'2.0.0'` | +`_model_name` | string | `'HTMLStyleModel'` | +`_view_module` | string | `'@jupyter-widgets/base'` | +`_view_module_version` | string | `'2.0.0'` | +`_view_name` | string | `'StyleView'` | +`background` | `null` or string | `null` | Background specifications. +`description_width` | string | `''` | Width of the description to the side of the control. +`font_size` | `null` or string | `null` | Text font size. +`text_color` | `null` or string | `null` | Text color + ### ImageModel (@jupyter-widgets/controls, 2.0.0); ImageView (@jupyter-widgets/controls, 2.0.0) Attribute | Type | Default | Help @@ -861,11 +910,31 @@ Attribute | Type | Default | Help `description_allow_html` | boolean | `false` | Accept HTML in the description. `layout` | reference to Layout widget | reference to new instance | `placeholder` | string | `'\u200b'` | Placeholder text to display when nothing has been typed -`style` | reference to DescriptionStyle widget | reference to new instance | Styling customizations +`style` | reference to LabelStyle widget | reference to new instance | `tabbable` | `null` or boolean | `null` | Is widget tabbable? `tooltip` | `null` or string | `null` | A tooltip caption. `value` | string | `''` | String value +### LabelStyleModel (@jupyter-widgets/controls, 2.0.0); StyleView (@jupyter-widgets/base, 2.0.0) + +Attribute | Type | Default | Help +-----------------|------------------|------------------|---- +`_model_module` | string | `'@jupyter-widgets/controls'` | +`_model_module_version` | string | `'2.0.0'` | +`_model_name` | string | `'LabelStyleModel'` | +`_view_module` | string | `'@jupyter-widgets/base'` | +`_view_module_version` | string | `'2.0.0'` | +`_view_name` | string | `'StyleView'` | +`background` | `null` or string | `null` | Background specifications. +`description_width` | string | `''` | Width of the description to the side of the control. +`font_family` | `null` or string | `null` | Label text font family. +`font_size` | `null` or string | `null` | Text font size. +`font_style` | `null` or string | `null` | Label text font style. +`font_variant` | `null` or string | `null` | Label text font variant. +`font_weight` | `null` or string | `null` | Label text font weight. +`text_color` | `null` or string | `null` | Text color +`text_decoration` | `null` or string | `null` | Label text decoration. + ### LinkModel (@jupyter-widgets/controls, 2.0.0); None (@jupyter-widgets/controls, 2.0.0) Attribute | Type | Default | Help @@ -918,7 +987,7 @@ Attribute | Type | Default | Help `disabled` | boolean | `false` | Enable or disable user changes `layout` | reference to Layout widget | reference to new instance | `placeholder` | string | `'\u200b'` | Placeholder text to display when nothing has been typed -`style` | reference to DescriptionStyle widget | reference to new instance | Styling customizations +`style` | reference to TextStyle widget | reference to new instance | `tabbable` | `null` or boolean | `null` | Is widget tabbable? `tooltip` | `null` or string | `null` | A tooltip caption. `value` | string | `''` | String value @@ -1166,11 +1235,26 @@ Attribute | Type | Default | Help `disabled` | boolean | `false` | Enable or disable user changes `layout` | reference to Layout widget | reference to new instance | `placeholder` | string | `'\u200b'` | Placeholder text to display when nothing has been typed -`style` | reference to DescriptionStyle widget | reference to new instance | Styling customizations +`style` | reference to TextStyle widget | reference to new instance | `tabbable` | `null` or boolean | `null` | Is widget tabbable? `tooltip` | `null` or string | `null` | A tooltip caption. `value` | string | `''` | String value +### TextStyleModel (@jupyter-widgets/controls, 2.0.0); StyleView (@jupyter-widgets/base, 2.0.0) + +Attribute | Type | Default | Help +-----------------|------------------|------------------|---- +`_model_module` | string | `'@jupyter-widgets/controls'` | +`_model_module_version` | string | `'2.0.0'` | +`_model_name` | string | `'TextStyleModel'` | +`_view_module` | string | `'@jupyter-widgets/base'` | +`_view_module_version` | string | `'2.0.0'` | +`_view_name` | string | `'StyleView'` | +`background` | `null` or string | `null` | Background specifications. +`description_width` | string | `''` | Width of the description to the side of the control. +`font_size` | `null` or string | `null` | Text font size. +`text_color` | `null` or string | `null` | Text color + ### TextareaModel (@jupyter-widgets/controls, 2.0.0); TextareaView (@jupyter-widgets/controls, 2.0.0) Attribute | Type | Default | Help @@ -1189,7 +1273,7 @@ Attribute | Type | Default | Help `layout` | reference to Layout widget | reference to new instance | `placeholder` | string | `'\u200b'` | Placeholder text to display when nothing has been typed `rows` | `null` or number (integer) | `null` | The number of rows to display. -`style` | reference to DescriptionStyle widget | reference to new instance | Styling customizations +`style` | reference to TextStyle widget | reference to new instance | `tabbable` | `null` or boolean | `null` | Is widget tabbable? `tooltip` | `null` or string | `null` | A tooltip caption. `value` | string | `''` | String value @@ -1234,11 +1318,30 @@ Attribute | Type | Default | Help `disabled` | boolean | `false` | Enable or disable user changes. `icon` | string | `''` | Font-awesome icon. `layout` | reference to Layout widget | reference to new instance | -`style` | reference to DescriptionStyle widget | reference to new instance | Styling customizations +`style` | reference to ToggleButtonStyle widget | reference to new instance | Styling customizations `tabbable` | `null` or boolean | `null` | Is widget tabbable? `tooltip` | `null` or string | `null` | A tooltip caption. `value` | boolean | `false` | Bool value +### ToggleButtonStyleModel (@jupyter-widgets/controls, 2.0.0); StyleView (@jupyter-widgets/base, 2.0.0) + +Attribute | Type | Default | Help +-----------------|------------------|------------------|---- +`_model_module` | string | `'@jupyter-widgets/controls'` | +`_model_module_version` | string | `'2.0.0'` | +`_model_name` | string | `'ToggleButtonStyleModel'` | +`_view_module` | string | `'@jupyter-widgets/base'` | +`_view_module_version` | string | `'2.0.0'` | +`_view_name` | string | `'StyleView'` | +`description_width` | string | `''` | Width of the description to the side of the control. +`font_family` | `null` or string | `null` | Toggle button text font family. +`font_size` | `null` or string | `null` | Toggle button text font size. +`font_style` | `null` or string | `null` | Toggle button text font style. +`font_variant` | `null` or string | `null` | Toggle button text font variant. +`font_weight` | `null` or string | `null` | Toggle button text font weight. +`text_color` | `null` or string | `null` | Toggle button text color +`text_decoration` | `null` or string | `null` | Toggle button text decoration. + ### ToggleButtonsModel (@jupyter-widgets/controls, 2.0.0); ToggleButtonsView (@jupyter-widgets/controls, 2.0.0) Attribute | Type | Default | Help