Skip to content

Commit

Permalink
Merge pull request #25 from AnswerDotAI/add-daisyui-alerts-and-toasts
Browse files Browse the repository at this point in the history 
Add daisyui alerts and toasts
  • Loading branch information
@Isaac-Flath
Isaac-Flath authored Dec 17, 2024
2 parents c029283 + c609675 commit 2fe39d7
Show file tree
Hide file tree
Showing 6 changed files with 408 additions and 56 deletions.
51 changes: 40 additions & 11 deletions docs/api_reference/api_reference.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -156,24 +156,15 @@ def ex_other():
CodeSpan("This is a CodeSpan element"),
Blockquote("This is a blockquote element"))

def ex_alerts1():
return Alert("This is a sample alert")

def ex_alerts2():
return Alert(
AlertCloseButton(uk_close=True),
DivLAligned(UkIcon('triangle-alert'), AlertTitle("Sample alert")),
AlertDescription("Lorem ipsum dolor sit amet consectetur adipiscing elit"),
cls='uk-alert-danger')


docs_typography = create_doc_section(
PLarge("High Level Options"),
P("Ready to go typographic options that cover most of what you need",cls=TextFont.muted_sm),
fn2code_string(ex_headings),
fn2code_string(ex_ps),
fn2code_string(ex_other),
fn2code_string(ex_alerts1),
fn2code_string(ex_alerts2),
PLarge("Lower Level Options (enums)"),
"Styling text is possibly the most common style thing to do, so we have a couple of helpers for discoverability inside python. `TextFont` is intended to be combinations are are widely applicable and used often, where `TextT` is intended to be more flexible options for you to combine together yourself.",
fn2code_string(ex_textfont),
Expand All @@ -183,9 +174,47 @@ def ex_alerts2():
H1, H2, H3, H4, Titled,
P, PParagraph, PLarge, PLead, PSmall, PMuted,
CodeSpan, Blockquote,
Alert, AlertCloseButton, AlertTitle, AlertDescription,
title="Text Style")


# Notifications
def ex_alerts1(): return Alert("This is a plain alert")

def ex_alerts2():
return Alert("Your purchase has been confirmed!",
cls=AlertT.success)

def ex_alerts3():
return Alert(
DivLAligned(UkIcon('triangle-alert'),
P("Please enter a valid email.")),
cls=AlertT.error)


def ex_toasts1():
return Toast("First Example Toast", cls=(ToastHT.start, ToastVT.bottom))

def ex_toasts2():
return Toast("Second Example Toast", alert_cls=AlertT.info)

docs_notifications = create_doc_section(
H3("Alerts"),
P("The simplest alert is a div wrapped with a span:"),
fn2code_string(ex_alerts1),
P("Alert colors are defined by the alert styles:"),
fn2code_string(ex_alerts2),
P("It often looks nice to use icons in alerts: "),
fn2code_string(ex_alerts3),
Alert, AlertT,
DividerLine(),
H3("Toasts"),
P("To define a toast with a particular location, add horizontal or vertical toast type classes:"),
fn2code_string(ex_toasts1),
P("To define toast colors, set the class of the alert wrapped by the toast:"),
fn2code_string(ex_toasts2),
Toast, ToastHT, ToastVT,
title="Alerts & Toasts")

# Containers

def ex_articles():
Expand Down
19 changes: 13 additions & 6 deletions monsterui/_modidx.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,14 +16,25 @@
'monsterui.core._download_resource': ('core.html#_download_resource', 'monsterui/core.py'),
'monsterui.core._headers_theme': ('core.html#_headers_theme', 'monsterui/core.py'),
'monsterui.core.fast_app': ('core.html#fast_app', 'monsterui/core.py')},
'monsterui.daisy': { 'monsterui.daisy.LiStep': ('daisy.html#listep', 'monsterui/daisy.py'),
'monsterui.daisy': { 'monsterui.daisy.Alert': ('daisy.html#alert', 'monsterui/daisy.py'),
'monsterui.daisy.AlertT': ('daisy.html#alertt', 'monsterui/daisy.py'),
'monsterui.daisy.AlertT._generate_next_value_': ( 'daisy.html#alertt._generate_next_value_',
'monsterui/daisy.py'),
'monsterui.daisy.LiStep': ('daisy.html#listep', 'monsterui/daisy.py'),
'monsterui.daisy.StepT': ('daisy.html#stept', 'monsterui/daisy.py'),
'monsterui.daisy.StepT._generate_next_value_': ( 'daisy.html#stept._generate_next_value_',
'monsterui/daisy.py'),
'monsterui.daisy.Steps': ('daisy.html#steps', 'monsterui/daisy.py'),
'monsterui.daisy.StepsT': ('daisy.html#stepst', 'monsterui/daisy.py'),
'monsterui.daisy.StepsT._generate_next_value_': ( 'daisy.html#stepst._generate_next_value_',
'monsterui/daisy.py')},
'monsterui/daisy.py'),
'monsterui.daisy.Toast': ('daisy.html#toast', 'monsterui/daisy.py'),
'monsterui.daisy.ToastHT': ('daisy.html#toastht', 'monsterui/daisy.py'),
'monsterui.daisy.ToastHT._generate_next_value_': ( 'daisy.html#toastht._generate_next_value_',
'monsterui/daisy.py'),
'monsterui.daisy.ToastVT': ('daisy.html#toastvt', 'monsterui/daisy.py'),
'monsterui.daisy.ToastVT._generate_next_value_': ( 'daisy.html#toastvt._generate_next_value_',
'monsterui/daisy.py')},
'monsterui.foundations': { 'monsterui.foundations.VEnum': ('foundation.html#venum', 'monsterui/foundations.py'),
'monsterui.foundations.VEnum.__add__': ('foundation.html#venum.__add__', 'monsterui/foundations.py'),
'monsterui.foundations.VEnum.__radd__': ( 'foundation.html#venum.__radd__',
Expand All @@ -34,10 +45,6 @@
'monsterui.franken': { 'monsterui.franken.AT': ('franken.html#at', 'monsterui/franken.py'),
'monsterui.franken.AT._generate_next_value_': ( 'franken.html#at._generate_next_value_',
'monsterui/franken.py'),
'monsterui.franken.Alert': ('franken.html#alert', 'monsterui/franken.py'),
'monsterui.franken.AlertCloseButton': ('franken.html#alertclosebutton', 'monsterui/franken.py'),
'monsterui.franken.AlertDescription': ('franken.html#alertdescription', 'monsterui/franken.py'),
'monsterui.franken.AlertTitle': ('franken.html#alerttitle', 'monsterui/franken.py'),
'monsterui.franken.Article': ('franken.html#article', 'monsterui/franken.py'),
'monsterui.franken.ArticleMeta': ('franken.html#articlemeta', 'monsterui/franken.py'),
'monsterui.franken.ArticleTitle': ('franken.html#articletitle', 'monsterui/franken.py'),
Expand Down
37 changes: 36 additions & 1 deletion monsterui/daisy.py
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
# AUTOGENERATED! DO NOT EDIT! File to edit: ../nbs/03_daisy.ipynb.

# %% auto 0
__all__ = ['StepsT', 'StepT', 'Steps', 'LiStep']
__all__ = ['AlertT', 'Alert', 'StepsT', 'StepT', 'Steps', 'LiStep', 'ToastHT', 'ToastVT', 'Toast']

# %% ../nbs/03_daisy.ipynb
import fasthtml.common as fh
Expand All @@ -18,6 +18,20 @@
import copy, re, httpx
from pathlib import Path

# %% ../nbs/03_daisy.ipynb
class AlertT(VEnum):
"Alert styles"
def _generate_next_value_(name, start, count, last_values): return f"alert-{name}"
info = auto()
success = auto()
warning = auto()
error = auto()

# %% ../nbs/03_daisy.ipynb
def Alert(*c, cls='', **kwargs):
"Alert informs users about important events."
return Div(Span(*c), cls=('alert', stringify(cls)), role='alert', **kwargs)

# %% ../nbs/03_daisy.ipynb
class StepsT(VEnum):
"Options for Steps"
Expand Down Expand Up @@ -47,3 +61,24 @@ def LiStep(*c, cls='', **kwargs):
"Creates a step list item with optional styling"
"""<li data-content="?" class="step step-neutral">Step 1</li>"""
return Li(*c, cls=('step', stringify(cls)), **kwargs)

# %% ../nbs/03_daisy.ipynb
class ToastHT(VEnum):
"Horizontal position for Toast"
def _generate_next_value_(name, start, count, last_values): return f'toast-{name}'
start = auto()
center = auto()
end = auto()

class ToastVT(VEnum):
"Vertical position for Toast"
def _generate_next_value_(name, start, count, last_values): return f'toast-{name}'
top = auto()
middle = auto()
bottom = auto()

# %% ../nbs/03_daisy.ipynb
def Toast(*c, cls='', alert_cls='', **kwargs):
"Toasts are stacked announcements, positioned on the corner of page."
a = Alert(*c, cls=alert_cls)
return Div(a, cls=('toast', stringify(cls)), **kwargs)
51 changes: 25 additions & 26 deletions monsterui/franken.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,20 +3,19 @@
# %% auto 0
__all__ = ['franken_class_map', 'TextT', 'TextFont', 'PParagraph', 'PLarge', 'PLead', 'PSmall', 'PMuted', 'CodeSpan',
'Blockquote', 'H1', 'H2', 'H3', 'H4', 'ButtonT', 'Button', 'Main', 'ContainerT', 'Container', 'Titled',
'DividerT', 'Divider', 'DividerSplit', 'DividerLine', 'Alert', 'AlertCloseButton', 'AlertTitle',
'AlertDescription', 'Article', 'ArticleTitle', 'ArticleMeta', 'SectionT', 'Section', 'Form', 'Fieldset',
'Legend', 'Input', 'Select', 'Radio', 'CheckboxX', 'Range', 'TextArea', 'Switch', 'FormLabel', 'LabelT',
'Label', 'UkFormSection', 'GenericLabelInput', 'LabelInput', 'LabelRadio', 'LabelCheckboxX', 'LabelRange',
'LabelTextArea', 'LabelSwitch', 'LabelSelect', 'Options', 'UkSelect', 'LabelUkSelect', 'AT', 'ListT',
'UkList', 'ModalContainer', 'ModalDialog', 'ModalHeader', 'ModalBody', 'ModalFooter', 'ModalTitle',
'ModalCloseButton', 'HTMXModalCloseButton', 'Modal', 'PaddingT', 'PositionT', 'Placeholder', 'Progress',
'UkIcon', 'UkIconLink', 'DiceBearAvatar', 'FlexT', 'Grid', 'DivFullySpaced', 'DivCentered', 'DivLAligned',
'DivRAligned', 'DivVStacked', 'DivHStacked', 'NavT', 'NavContainer', 'NavParentLi', 'NavDividerLi',
'NavHeaderLi', 'NavSubtitle', 'NavCloseLi', 'NavBarContainer', 'NavBarLSide', 'NavBarRSide', 'NavBarCenter',
'NavBarNav', 'NavBarSubtitle', 'NavBarNavContainer', 'NavBarParentIcon', 'DropDownNavContainer',
'TabContainer', 'CardT', 'CardTitle', 'CardHeader', 'CardBody', 'CardFooter', 'CardContainer', 'Card',
'TableT', 'Table', 'Td', 'Th', 'Tr', 'Thead', 'Tbody', 'TableFromLists', 'TableFromDicts', 'apply_classes',
'render_md']
'DividerT', 'Divider', 'DividerSplit', 'DividerLine', 'Article', 'ArticleTitle', 'ArticleMeta', 'SectionT',
'Section', 'Form', 'Fieldset', 'Legend', 'Input', 'Select', 'Radio', 'CheckboxX', 'Range', 'TextArea',
'Switch', 'FormLabel', 'LabelT', 'Label', 'UkFormSection', 'GenericLabelInput', 'LabelInput', 'LabelRadio',
'LabelCheckboxX', 'LabelRange', 'LabelTextArea', 'LabelSwitch', 'LabelSelect', 'Options', 'UkSelect',
'LabelUkSelect', 'AT', 'ListT', 'UkList', 'ModalContainer', 'ModalDialog', 'ModalHeader', 'ModalBody',
'ModalFooter', 'ModalTitle', 'ModalCloseButton', 'HTMXModalCloseButton', 'Modal', 'PaddingT', 'PositionT',
'Placeholder', 'Progress', 'UkIcon', 'UkIconLink', 'DiceBearAvatar', 'FlexT', 'Grid', 'DivFullySpaced',
'DivCentered', 'DivLAligned', 'DivRAligned', 'DivVStacked', 'DivHStacked', 'NavT', 'NavContainer',
'NavParentLi', 'NavDividerLi', 'NavHeaderLi', 'NavSubtitle', 'NavCloseLi', 'NavBarContainer', 'NavBarLSide',
'NavBarRSide', 'NavBarCenter', 'NavBarNav', 'NavBarSubtitle', 'NavBarNavContainer', 'NavBarParentIcon',
'DropDownNavContainer', 'TabContainer', 'CardT', 'CardTitle', 'CardHeader', 'CardBody', 'CardFooter',
'CardContainer', 'Card', 'TableT', 'Table', 'Td', 'Th', 'Tr', 'Thead', 'Tbody', 'TableFromLists',
'TableFromDicts', 'apply_classes', 'render_md']

# %% ../nbs/02_franken.ipynb
import fasthtml.common as fh
Expand Down Expand Up @@ -189,21 +188,21 @@ def DividerSplit(*c, cls=(), line_cls=(), text_cls=()):
def DividerLine(lwidth=2, y_space=4): return Hr(cls=f"my-{y_space} h-[{lwidth}px] w-full bg-secondary")

# %% ../nbs/02_franken.ipynb
def Alert(*args, cls=(), **kwargs):
"A styled alert component that can contain a AlertTitle, AlertDescription and AlertCloseButton"
return Div(*args, cls=('uk-alert', stringify(cls)), uk_alert=True, **kwargs)
# def Alert(*args, cls=(), **kwargs):
# "A styled alert component that can contain a AlertTitle, AlertDescription and AlertCloseButton"
# return Div(*args, cls=('uk-alert', stringify(cls)), uk_alert=True, **kwargs)

def AlertCloseButton(*args, cls=(), **kwargs):
"A button component for closing an Alert"
return A(*args, cls=('uk-alert-close', stringify(cls)), **kwargs)
# def AlertCloseButton(*args, cls=(), **kwargs):
# "A button component for closing an Alert"
# return A(*args, cls=('uk-alert-close', stringify(cls)), **kwargs)

def AlertTitle(*args, cls='', **kwargs):
"A title component for use within an Alert"
return Div(*args, cls=('uk-alert-title', stringify(cls)), **kwargs)
# def AlertTitle(*args, cls='', **kwargs):
# "A title component for use within an Alert"
# return Div(*args, cls=('uk-alert-title', stringify(cls)), **kwargs)

def AlertDescription(*args, cls='', **kwargs):
"A description component for use within an Alert"
return Div(*args, cls=('uk-alert-description', stringify(cls)), **kwargs)
# def AlertDescription(*args, cls='', **kwargs):
# "A description component for use within an Alert"
# return Div(*args, cls=('uk-alert-description', stringify(cls)), **kwargs)

# %% ../nbs/02_franken.ipynb
def Article(*c, cls=(), **kwargs):
Expand Down
24 changes: 12 additions & 12 deletions nbs/02_franken.ipynb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -409,21 +409,21 @@
"outputs": [],
"source": [
"#| export\n",
"def Alert(*args, cls=(), **kwargs): \n",
" \"A styled alert component that can contain a AlertTitle, AlertDescription and AlertCloseButton\"\n",
" return Div(*args, cls=('uk-alert', stringify(cls)), uk_alert=True, **kwargs)\n",
"# def Alert(*args, cls=(), **kwargs): \n",
"# \"A styled alert component that can contain a AlertTitle, AlertDescription and AlertCloseButton\"\n",
"# return Div(*args, cls=('uk-alert', stringify(cls)), uk_alert=True, **kwargs)\n",
"\n",
"def AlertCloseButton(*args, cls=(), **kwargs): \n",
" \"A button component for closing an Alert\"\n",
" return A(*args, cls=('uk-alert-close', stringify(cls)), **kwargs)\n",
"# def AlertCloseButton(*args, cls=(), **kwargs): \n",
"# \"A button component for closing an Alert\"\n",
"# return A(*args, cls=('uk-alert-close', stringify(cls)), **kwargs)\n",
"\n",
"def AlertTitle(*args, cls='', **kwargs): \n",
" \"A title component for use within an Alert\"\n",
" return Div(*args, cls=('uk-alert-title', stringify(cls)), **kwargs)\n",
"# def AlertTitle(*args, cls='', **kwargs): \n",
"# \"A title component for use within an Alert\"\n",
"# return Div(*args, cls=('uk-alert-title', stringify(cls)), **kwargs)\n",
"\n",
"def AlertDescription(*args, cls='', **kwargs): \n",
" \"A description component for use within an Alert\"\n",
" return Div(*args, cls=('uk-alert-description', stringify(cls)), **kwargs)"
"# def AlertDescription(*args, cls='', **kwargs): \n",
"# \"A description component for use within an Alert\"\n",
"# return Div(*args, cls=('uk-alert-description', stringify(cls)), **kwargs)"
]
},
{
Expand Down
Loading

0 comments on commit 2fe39d7

Please sign in to comment.