Commit Graph

12 Commits

Author SHA1 Message Date
Vasu Bhog
bf9fd5a3b8 UI Component for Parameterized Notebook (#13021)
* Backend work for  Parameterization + Tests

* address comments

* Add Parameters Tag upon state change

* Edit CSS Styling for accessibility

* more generic tag names
2020-10-23 19:51:03 -05:00
Hale Rankin
6670289057 Hackathon - Better Markdown Editor (#11540)
* Hackathon - better markdown editor - modified Bold to wrap selection in HTML. Split Image button into two new options: embed and link. Made preview container contentEditable.

* Removed the new dropdown from Image button -- it is not necessary since we are adding a context panel instead.

* Modified preview icons

* Set code-component dimensions so it is not visible. It is still being used to pass markdown changes to however.

* add turndown and save markdown

* update model on UI when source changes

* Added conditional that sets element attribute contentEditable when it is in edit mode.

* Added textView component that can be used for editing.

* update source on MD view not on every keystroke

* Added markdown editor buttons that allow user to swap editor, preview views.

* Cleaning up implementation

* Setting base value of _showPreview to false.

* don't allow html edit on split view

* Update editor automagically

* Add an image picking dialog to notebook toolbar.

* Await transformText()

* revert pushEditOperations to fix cursor issue

* Implemented radio buttons for three view toggles.

* Added new, optional properties to radioButton: name, icon class and tooltip. This allows for display as toggleable icon. Updated styles and theme accordingly.

* Style tweaks.

* Added new ViewAction file where the RadioButton action will reside.

* Removed radio button implementation in exchange for native button instantiation. Adjusted CSS and theme accordingly.

* Styles, component and template changes to handle view toggle between text, markdownn an splitview. Includes reverting of radioButton as this is no longer used.

* WYSIWYG 3 Modes

* Ensure one action active at a time

* Setting Text View button active by default. Cleaned up styles. Moved toolbar element to prevent code cell layout overflow.

* Ensure we respect editMode, add showMarkdown

* hiding overflow on code-cell

* Empty text container needs 100% width. Eliminates weird selection border too.

* Initialize _previewMode

* Actions Compatibility

* Further toolbar enhancements

* Update yarn lock after merge

* Slim down changes

* Remove commented out code

* Added margins around notebook-preview container for more visual space for text

* Add turndown to workbench html

* Tweak import

* Add types/turndown

* Remove workbench.html fix

* Import cjs modules directly for turndown

* Leverage solution from github

* browser umd

* non browser umd

* welp dependency

* Modified updatePreview to insert a p tag only when text cell is empty.

* add listener for undo

* add turndown to remote and web

* Fix workbench, check in plugin

* PR comment

Co-authored-by: maddydev <makoripa@microsoft.com>
Co-authored-by: chlafreniere <hichise@gmail.com>
Co-authored-by: Cory Rivera <corivera@microsoft.com>
Co-authored-by: Lucy Zhang <luczhan@microsoft.com>
2020-09-11 00:22:07 -07:00
Laura Jiang
84d21b1e76 adjust css to pin toolbar (#11894) 2020-08-20 17:11:53 -07:00
Vasu Bhog
71fbe2ed53 Fix markdown cell toolbar focus not being visible (#11386)
* Markdown Toolbar focus fix

* Fixed sizing issues of icons

* Fixed spacing
2020-07-17 11:04:17 -05:00
Hale Rankin
7ef8acf04e Markdown toolbar > Preview toggle feature (#10963)
* Added toggle preview button to Markdown toolbar. Revised components, theme and styles to present the preview as a second column beside the markdown.

* Added showPreview to model and began working on togglePreview.

* Uncommented use of cellModel.showPreview

* add cell model event for onPreviewChange

* Renamed my showPreview boolean to prevent confusion with local boolean used in toogglePreview.

* Added CSS class when preview is enabled. Adjusted styles accordingly.

* Swapped icon show/hide references for correct sequence. Modified updatePreview to include state of doShowPreview.

* Added check for isEditMode so we can run togglePreview and show it once editor closes.

* Added listener to code.component that triggers layoutEmitter on changes to peview.

* Renamed local boolean doShowPreview. Removed unneeded code. Fixed ambiguity in my use of booleans, adding a getter and setter to textCell.

* Cleaned up implementation of new get/set for toggling preview.

Co-authored-by: chlafreniere <hichise@gmail.com>
2020-06-26 13:47:17 -07:00
Hale Rankin
eafe659ec9 10712, 10677 - Fixed focus indicators for both main toolbar and cell … (#10756)
* 10712, 10677 - Fixed focus indicators for both main toolbar and cell toolbar.

* Removed duplicated line
2020-06-05 17:46:19 -07:00
Hale Rankin
b2e0291a95 10551 - Notebook UI: Added cell toolbar component (#10558)
* 10551 - Notebook UI: Added cell toolbar component, actions scaffolding, styles and theme colors. Removed markup for legacy, hidden hover buttons. Updated instaces of icon class: mask to masked-icon.

* Uncommented lines for CellToggleMoreActions so we can see how the ellipses currently work.

* Added EditCellAction which toggles between two icons.

* Cleaned up comments and removed some unused code.

* Copied DeleteCellAction into celltoolbarActions

* Connecting model and cell model to toolbar component for necessary context.

* Pass in cell + nb model from notebook component

* Adding context for EditCellAction so we can activate a cell via icon.

* Removed my copy of AddCellAction and simply referred to the existing one.

* Fixes to propogate cell model edit mode changes

* Added onCellModeChanged event registration to code.component.

* Moved cellToggleMoreActions into cellToolbarActions. Suppressing ellipses in code and textCell components.

* Fix adding cells

* Copied and modified ToggleMoreWidgetAction for use in cellToolbarActions. Instantiating cellToggleMoreActions and adding to toolbar.

* Removed unused markup, code and styles. Moved cell toolbar template into compoent.

* Removed double-click from textCell. Changed message to indicate where content goes - without it the cell does not have dimension and cannot be found by the user.

* Removed unused code file.

* Fixing my boo boo

* Updated AddCellAction with null coalescer. Set Promise to type: void.

Co-authored-by: chlafreniere <hichise@gmail.com>
2020-05-29 18:27:36 -07:00
Hale Rankin
47687ff6b2 Notebook main toolbar additions (#10271)
* Reworking notebook action bar functionality and appearance.

* added separator

* Revised notebookActions for collapse, clear and trusted such that they can be implemented with a boolean set to T of F and show labels or shift them into tooltip for accessibility. Updated styles for select boxes. Added toolbar icons to common icon location. Split icon definition for use as masked or background-image.

* Completed styles for action icons: collapse, clear and trusted. Added theme colors. Simplified icon behavior styles.

* Made maskedIconClass optional. Added theme colors for toolbar icons, select box border and dropdown arrow. Experimenting with adding masked icon to pseudo element so I can pull out label text from icons.

* Added icons styles to handle masked SVG elements as pseudo element beside button text. Added icons using this method to respect the color theming system.

* Adjusted styles for the cell and run all icons in notebook toolbar.

* Prepped notebook toolbar with placeholder icon for Underline action. Implemented Underline action. Added custom --wip-- ButtonMenu control, a modified copy of DropDown.

* Revised colorRegistry and corresponding notebook styles. Removed unused code from new custom control: buttonMneu. Revised icon styles to create a dropdown arrow for buttonMenu.

* Added new icon for Underline action.

* Removed comment from needed markup.

* Replaced actionItemProvider with optional undefined per DropdownMenuActionViewItem constructor.

* Cleaned up new control, removing unneeded code and referencing what the class needs. Corrected style declaration for overriding input box padding. Removed unused notebook color styles. Scoped element styles to the toolbar so others outside the toolbar are not affected.

* Removed unnecessary !important from style override.

* Removed reference to unused color entry.

* Syntax cleanup.

* Put notebook toolbar improvements behind the preview flag. This involves some conditionals and CSS classes.

* Updated icon used for Manage Packages. Created and updated styles for notebook toolbar icon spacing. Modified notebook.component contributed actions so that the label text is shifted into the title attribute. Added new icon for Not Trusted toggle.

* Replaced SVG code for not-trusted icon.

* Addressed PR feedback: changed masked classname. Revised component and CSS accordingly. Removed unnecessary instance of in-preview class. Fixed code logic that assigns label text to tooltip on incoming contributed action
2020-05-15 19:13:31 -07:00
Hale Rankin
4e69eabf52 UI feature - Notebook markdown toolbar (#9853)
* Markdown editor toolbar - initial commit

* Moved icons. Refactored new toolbar component to include markup.

* Edited markdown toolbar component and referencing in textCell component markup.

* Completed UI updates for selected cell toolbar and markdown toolbar. 

* Modified import path to Event class. Changed EventEmitter to Emitter.

* Cleaned up newly added toolbar components

* Works sometimes sometimes editor is null

* Removed commented out code and styles. CellToolbar and MarkdownToolbar: moved component markup into html file.

* Added icon for highlight. Removed more commented code. Re-scoped two styles to their parent components. Corrected templateUrl reference for the new toolbars.

* Adjusted paths to SVG icons from toolbar stylesheet.

* Add lists and links

* Refactor out of component, add actionbar

* Support for nothing selected, quick bug fix

* Updated split view icons. Added markdown tool backgrounds and cell border colors to color registry and parent components. Updated toolbar icons to use mask as this allows the SVG icon colors to be adjusted on theme change.

* Added colorRegistry entries for code cell. Removed colors from styles. Running registerThemingParticipant from code.component.

* Revised code component style rules and corrected syntax.

* Merged in Chris' working branch and removed unused markup.

* Corrected styles and moved another color into colorRegistry for use in new markdown toolbar.

* Corrected style error. Overrode left position of content inside textCell and codeCell. Added more entries to colorRegistry.

* Moved toolbar and editor icons to common-icons location. Updated related stylesheet. Revised color theming rules for markdown and code cells.

* Added themed border between markdown and preview. Moved all notebook themes into notebookStyles.ts

* Merged in latest from origin/master and included a small but significant style tweak to light theme code cell toolbar.

* Add Undo Support for Markdown Toolbar (#9915)

* Remove comment

* Renamed registered notebook colors and prefixed with notebook. Moved markdown component theme colors into notebookStyles.ts. Removed colors from cellToolbar styles. Revised icon class names to generic names for better re-use. Removed commented markup.

Co-authored-by: chlafreniere <hichise@gmail.com>
Co-authored-by: Chris LaFreniere <40371649+chlafreniere@users.noreply.github.com>
2020-04-14 14:13:00 -07:00
ADS Merger
4c3e48773d Merge from vscode cfc1ab4c5f816765b91fb7ead3c3427a7c8581a3 2020-03-11 04:19:23 +00:00
Cory Rivera
412214e193 Add charting functionality to SQL notebooks. (#9306) 2020-02-26 10:52:19 -08:00
Anthony Dresser
7a2c30e159 move code from parts to contrib (#8319) 2019-11-14 12:23:11 -08:00