# WebifyPy
WebifyPy is a versatile Python module designed to simplify HTML form and component creation. It offers a comprehensive set of classes that enable effortless development of common web elements.
## Installation
Get started with WebifyPy by installing it via pip:
```bash
pip install WebifyPy
```
## Usage
### Components for Easy UI Building
```python
from WebifyPy.components import Div, Header, Paragraph
# Create a div with a header and a paragraph
content = Div(
content=[Header(level=2, text="Welcome to WebifyPy"), Paragraph(content="WebifyPy is a Python module for generating HTML forms and components.")]
)
# Render the content
content_html = content.render()
```
### Streamlined Form Creation
```python
from WebifyPy.forms import Form, InputField
from WebifyPy.components import Button
# Create a form
form = Form(action="/submit", method="POST")
# Add fields to the form
username_field = InputField(name="username", type="text")
password_field = InputField(name="password", type="password")
submit_button = Button(label="Submit")
form.add_field(username_field)
form.add_field(password_field)
form.add_field(submit_button)
# Render the form
form_html = form.render()
```
### Pre-Styled Components for Quick Design
```python
from WebifyPy.pre_components import Alert, Card
# Create an alert
alert = Alert(message="This is a sample alert.", alert_type="success")
# Create a card with content
card = Card(title="Sample Card", content="This is a sample card.")
# Render the alert and card
alert_html = alert.render()
card_html = card.render()
```
### Style Elements with Ease
```python
from WebifyPy.styled_components import StyledButton
# Create a styled button
styled_button = StyledButton(label="Click me")
# Render the styled button
styled_button_html = styled_button.render()
```
### Interactive JavaScript Components
```python
from WebifyPy.js_components import CounterComponent
# Create a counter component
counter = CounterComponent()
# Render the counter component
counter_html = counter.render()
```
### Styling
```python
from WebifyPy.styling import CSS
# Define the styles you want to apply
styles = '''
.button {
background-color: #007bff;
color: #fff;
padding: 10px 20px;
border: none;
border-radius: 5px;
cursor: pointer;
}
'''
# Create a CSS instance with the styles
css_styles = CSS(styles)
# Apply the styles to a component (for example, a ButtonComponent)
button_component = ButtonComponent()
css_styles.apply(button_component)
```
## Classes Reference
### components
| Class Name | Description |
|------------------|----------------------------------------------------|
| FormComponent | Renders a form element with custom action and method. |
| InputField | Renders an input field with custom name and type. |
| Button | Renders a button with custom label. |
| TextArea | Renders a text area with custom name, rows, and columns. |
| Image | Renders an image with custom source and alt text. |
| Link | Renders a hyperlink with custom href and text. |
| Header | Renders a header with custom level and text. |
| List | Renders an unordered list with custom items. |
| Dropdown | Renders a dropdown menu with custom options. |
| Checkbox | Renders a checkbox with custom name and value. |
| Radio | Renders a radio button with custom name and value. |
| Table | Renders a table with custom headers and rows. |
| Div | Renders a div element with custom content. |
| Span | Renders a span element with custom content. |
| Paragraph | Renders a paragraph with custom content. |
| Heading | Renders a heading with custom level and content. |
| Strong | Renders a strong (bold) text element with custom content. |
| Emphasis | Renders an emphasis (italic) text element with custom content. |
| Anchor | Renders an anchor (link) with custom href and text. |
| ImageLink | Renders an image within a link with custom href, source, and alt text. |
| UnorderedList | Renders an unordered list with custom items. |
| OrderedList | Renders an ordered list with custom items. |
| Blockquote | Renders a blockquote element with custom content. |
| Code | Renders a code element with custom content. |
| Preformatted | Renders preformatted text with custom content. |
| HorizontalRule | Renders a horizontal rule (line). |
| Navigation | Renders a navigation bar with custom links. |
| Section | Renders a section element with custom content. |
| Article | Renders an article element with custom content. |
| Footer | Renders a footer element with custom content. |
### forms
| Class Name | Description |
|-----------------|---------------------------------------------------------|
| FormComponent | A component that renders a form with specified action and method. |
| InputField | A component that renders an input field with specified attributes. |
| ToggleSwitchField | A component that renders a toggle switch as an input field. |
| CheckboxField | A component that renders a checkbox input field with specified attributes. |
| RadioField | A component that renders a radio button input field with specified attributes. |
| SelectField | A component that renders a select input field with specified options. |
| TextAreaField | A component that renders a text area input field with specified attributes. |
| FileUploadField | A component that renders a file upload input field with specified attributes. |
| HiddenField | A component that renders a hidden input field with specified attributes. |
| SubmitButtonField| A component that renders a submit button input field with specified label. |
| RangeInputField | A component that renders a range input field with specified attributes. |
| ColorInputField | A component that renders a color input field with specified attributes. |
| DateInputField | A component that renders a date input field with specified attributes. |
| EmailInputField | A component that renders an email input field with specified attributes. |
| PasswordInputField | A component that renders a password input field with specified attributes. |
| TelephoneInputField | A component that renders a telephone input field with specified attributes. |
| URLInputField | A component that renders a URL input field with specified attributes. |
| SearchInputField | A component that renders a search input field with specified attributes. |
| CheckboxGroupField | A component that renders a group of checkboxes with specified attributes. |
| RadioGroupField | A component that renders a group of radio buttons with specified attributes. |
### pre_components
| Class Name | Description |
|----------------------|--------------------------------------------------------------------|
| BootstrapComponents | Provides methods to render Bootstrap components like buttons and modals. |
| Alert | Renders an alert message with customizable type and message. |
| Modal | Renders a modal with custom title and content. |
| Card | Renders a card element with custom title and content. |
| Navbar | Renders a navigation bar with custom brand and links. |
| Pagination | Renders a pagination component with total pages and current page. |
| Progress | Renders a progress bar with customizable value and maximum. |
| Badge | Renders a badge with custom text and badge type. |
| Jumbotron | Renders a jumbotron with custom title and content. |
| AlertDismissable | Renders a dismissable alert message with customizable type and message. |
| ListGroup | Renders a list group with custom items. |
| Carousel | Renders a carousel with a list of images. |
| Breadcrumb | Renders a breadcrumb navigation with custom links. |
| Toast | Renders a toast notification with customizable type and message. |
| Popover | Renders a popover with custom title and content. |
| Tooltip | Renders a tooltip with custom title. |
| Collapse | Renders a collapsible element with custom button text and content. |
| Accordion | Renders an accordion with collapsible items. |
| Tab | Renders a tab element with multiple content panes. |
| Dropdown | Renders a dropdown menu with custom options. |
| InputGroup | Renders an input element with custom type and placeholder. |
| NavbarBrand | Renders a navbar brand with custom brand text. |
| CardDeck | Renders a card deck with a list of cards. |
| CardGroup | Renders a card group with a list of cards. |
| Tabs | Renders tabs with multiple content panes. |
| Form | Renders a form element with custom action and method. |
### styled_components
| Class Name | Description |
|--------------------|--------------------------------------------------------------------|
| StyledButton | Renders a styled button element with custom CSS. |
| StyledInput | Renders a styled input element with custom CSS. |
| StyledCard | Renders a styled card element with custom title and content. |
| StyledNavbar | Renders a styled navigation bar with custom brand and links. |
| StyledAlert | Renders a styled alert message with customizable type and message. |
| StyledModal | Renders a styled modal with custom title and content. |
| StyledForm | Renders a styled form element with custom action and method. |
| StyledAccordion | Renders a styled accordion with collapsible sections. |
| StyledTabs | Renders styled tabs with multiple content panes. |
| StyledDropdown | Renders a styled dropdown menu with custom options. |
| StyledCheckbox | Renders a styled checkbox input with custom label. |
| StyledRadio | Renders a styled radio button input with custom label. |
| StyledTextarea | Renders a styled textarea element with custom placeholder. |
| StyledImage | Renders an image with custom source and alternate text. |
| StyledProgressBar | Renders a styled progress bar with customizable progress value. |
| StyledTooltip | Renders a styled tooltip with custom text and content. |
| StyledBadge | Renders a styled badge with custom text. |
### js_components
| Class Name | Description |
|---------------------------|------------------------------------------|
| CounterComponent | Renders a counter with increment and decrement buttons. |
| ToggleSwitchComponent | Renders a toggle switch with an optional default state. |
| TooltipComponent | Renders a tooltip with specified text and content. |
| DropdownComponent | Renders a dropdown with specified options. |
| AlertComponent | Renders an alert with a specified message and type. |
| CopyToClipboardComponent | Renders a button to copy specified content to the clipboard. |
| ScrollToTopComponent | Renders a button to scroll to the top of the page. |
| DarkModeToggleComponent | Renders a dark mode toggle switch. |
| HTTPRequestComponent | Base class for making HTTP requests with specified URL and method. |
| GETRequestComponent | Renders a button to make a GET request to a specified URL. Inherits from HTTPRequestComponent. |
| POSTRequestComponent | Renders a button to make a POST request to a specified URL. Inherits from HTTPRequestComponent. |
| PUTRequestComponent | Renders a button to make a PUT request to a specified URL. Inherits from HTTPRequestComponent. |
| DELETERequestComponent | Renders a button to make a DELETE request to a specified URL. Inherits from HTTPRequestComponent. |
| ImageSliderComponent | Renders an image slider with specified images. |
| AccordionComponent | Renders an accordion with specified sections. |
| CountdownTimerComponent | Renders a countdown timer to a specified target date. |
| RandomQuoteComponent | Renders a random quote from a specified list of quotes. |
| InteractiveMapComponent | Renders an interactive map with specified latitude, longitude, zoom level, and API key. |
| ModalComponent | Renders a modal window with specified content. |
| LightboxComponent | Renders a lightbox gallery with specified images. |
| ImageZoomComponent | Renders an image with zoom functionality. |
| CarouselComponent | Renders a carousel with specified images. |
| ProgressBarComponent | Renders a progress bar with specified maximum value. |
### styling
| Class Name | Description |
|-----------------|--------------------------------------------------------------|
| `CSS` | Represents a set of CSS styles to be applied to a component. |
| `Theme` | Represents a theme to be applied to a component. |
| `CSSInJS` | Represents a CSS-in-JS library to be used with a component. |
| `StyledComponent` | Represents a component with specific styles applied. |
| `SASS` | Represents SASS code to be applied to a component. |
| `Less` | Represents Less code to be applied to a component. |
| `TailwindCSS` | Represents Tailwind CSS classes to be applied. |
| `Bootstrap` | Represents a specific version of Bootstrap to be used. |
## Author
[Ishan Oshada](https://github.com/ishanoshada)
## License
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
Raw data
{
"_id": null,
"home_page": "https://github.com/ishanoshada/WebifyPy",
"name": "WebifyPy",
"maintainer": "",
"docs_url": null,
"requires_python": "",
"maintainer_email": "",
"keywords": "web development,Python package",
"author": "Ishan Oshada",
"author_email": "ic31908@gmail.com",
"download_url": "https://files.pythonhosted.org/packages/d7/f3/1f358f2bbd343212d6b850a320737b0f8c66e6070a6fa476e9c7256bb5ab/WebifyPy-0.3.0.tar.gz",
"platform": null,
"description": "# WebifyPy\n\nWebifyPy is a versatile Python module designed to simplify HTML form and component creation. It offers a comprehensive set of classes that enable effortless development of common web elements.\n\n## Installation\n\nGet started with WebifyPy by installing it via pip:\n\n```bash\npip install WebifyPy\n```\n\n## Usage\n\n\n### Components for Easy UI Building\n\n```python\nfrom WebifyPy.components import Div, Header, Paragraph\n\n# Create a div with a header and a paragraph\ncontent = Div(\n content=[Header(level=2, text=\"Welcome to WebifyPy\"), Paragraph(content=\"WebifyPy is a Python module for generating HTML forms and components.\")]\n)\n\n# Render the content\ncontent_html = content.render()\n```\n\n### Streamlined Form Creation\n\n```python\nfrom WebifyPy.forms import Form, InputField\nfrom WebifyPy.components import Button\n\n\n# Create a form\nform = Form(action=\"/submit\", method=\"POST\")\n\n# Add fields to the form\nusername_field = InputField(name=\"username\", type=\"text\")\npassword_field = InputField(name=\"password\", type=\"password\")\nsubmit_button = Button(label=\"Submit\")\n\nform.add_field(username_field)\nform.add_field(password_field)\nform.add_field(submit_button)\n\n# Render the form\nform_html = form.render()\n```\n\n### Pre-Styled Components for Quick Design\n\n```python\nfrom WebifyPy.pre_components import Alert, Card\n\n# Create an alert\nalert = Alert(message=\"This is a sample alert.\", alert_type=\"success\")\n\n# Create a card with content\ncard = Card(title=\"Sample Card\", content=\"This is a sample card.\")\n\n# Render the alert and card\nalert_html = alert.render()\ncard_html = card.render()\n```\n\n### Style Elements with Ease\n\n```python\nfrom WebifyPy.styled_components import StyledButton\n\n# Create a styled button\nstyled_button = StyledButton(label=\"Click me\")\n\n# Render the styled button\nstyled_button_html = styled_button.render()\n\n```\n\n### Interactive JavaScript Components\n\n```python\nfrom WebifyPy.js_components import CounterComponent\n\n# Create a counter component\ncounter = CounterComponent()\n\n# Render the counter component\ncounter_html = counter.render()\n\n```\n\n### Styling\n\n```python\nfrom WebifyPy.styling import CSS\n\n# Define the styles you want to apply\nstyles = '''\n .button {\n background-color: #007bff;\n color: #fff;\n padding: 10px 20px;\n border: none;\n border-radius: 5px;\n cursor: pointer;\n }\n'''\n\n# Create a CSS instance with the styles\ncss_styles = CSS(styles)\n\n# Apply the styles to a component (for example, a ButtonComponent)\nbutton_component = ButtonComponent()\ncss_styles.apply(button_component)\n```\n\n## Classes Reference\n\n\n### components\n\n\n| Class Name | Description |\n|------------------|----------------------------------------------------|\n| FormComponent | Renders a form element with custom action and method. |\n| InputField | Renders an input field with custom name and type. |\n| Button | Renders a button with custom label. |\n| TextArea | Renders a text area with custom name, rows, and columns. |\n| Image | Renders an image with custom source and alt text. |\n| Link | Renders a hyperlink with custom href and text. |\n| Header | Renders a header with custom level and text. |\n| List | Renders an unordered list with custom items. |\n| Dropdown | Renders a dropdown menu with custom options. |\n| Checkbox | Renders a checkbox with custom name and value. |\n| Radio | Renders a radio button with custom name and value. |\n| Table | Renders a table with custom headers and rows. |\n| Div | Renders a div element with custom content. |\n| Span | Renders a span element with custom content. |\n| Paragraph | Renders a paragraph with custom content. |\n| Heading | Renders a heading with custom level and content. |\n| Strong | Renders a strong (bold) text element with custom content. |\n| Emphasis | Renders an emphasis (italic) text element with custom content. |\n| Anchor | Renders an anchor (link) with custom href and text. |\n| ImageLink | Renders an image within a link with custom href, source, and alt text. |\n| UnorderedList | Renders an unordered list with custom items. |\n| OrderedList | Renders an ordered list with custom items. |\n| Blockquote | Renders a blockquote element with custom content. |\n| Code | Renders a code element with custom content. |\n| Preformatted | Renders preformatted text with custom content. |\n| HorizontalRule | Renders a horizontal rule (line). |\n| Navigation | Renders a navigation bar with custom links. |\n| Section | Renders a section element with custom content. |\n| Article | Renders an article element with custom content. |\n| Footer | Renders a footer element with custom content. |\n\n\n### forms\n\n| Class Name | Description |\n|-----------------|---------------------------------------------------------|\n| FormComponent | A component that renders a form with specified action and method. |\n| InputField | A component that renders an input field with specified attributes. |\n| ToggleSwitchField | A component that renders a toggle switch as an input field. |\n| CheckboxField | A component that renders a checkbox input field with specified attributes. |\n| RadioField | A component that renders a radio button input field with specified attributes. |\n| SelectField | A component that renders a select input field with specified options. |\n| TextAreaField | A component that renders a text area input field with specified attributes. |\n| FileUploadField | A component that renders a file upload input field with specified attributes. |\n| HiddenField | A component that renders a hidden input field with specified attributes. |\n| SubmitButtonField| A component that renders a submit button input field with specified label. |\n| RangeInputField | A component that renders a range input field with specified attributes. |\n| ColorInputField | A component that renders a color input field with specified attributes. |\n| DateInputField | A component that renders a date input field with specified attributes. |\n| EmailInputField | A component that renders an email input field with specified attributes. |\n| PasswordInputField | A component that renders a password input field with specified attributes. |\n| TelephoneInputField | A component that renders a telephone input field with specified attributes. |\n| URLInputField | A component that renders a URL input field with specified attributes. |\n| SearchInputField | A component that renders a search input field with specified attributes. |\n| CheckboxGroupField | A component that renders a group of checkboxes with specified attributes. |\n| RadioGroupField | A component that renders a group of radio buttons with specified attributes. |\n\n### pre_components\n\n\n| Class Name | Description |\n|----------------------|--------------------------------------------------------------------|\n| BootstrapComponents | Provides methods to render Bootstrap components like buttons and modals. |\n| Alert | Renders an alert message with customizable type and message. |\n| Modal | Renders a modal with custom title and content. |\n| Card | Renders a card element with custom title and content. |\n| Navbar | Renders a navigation bar with custom brand and links. |\n| Pagination | Renders a pagination component with total pages and current page. |\n| Progress | Renders a progress bar with customizable value and maximum. |\n| Badge | Renders a badge with custom text and badge type. |\n| Jumbotron | Renders a jumbotron with custom title and content. |\n| AlertDismissable | Renders a dismissable alert message with customizable type and message. |\n| ListGroup | Renders a list group with custom items. |\n| Carousel | Renders a carousel with a list of images. |\n| Breadcrumb | Renders a breadcrumb navigation with custom links. |\n| Toast | Renders a toast notification with customizable type and message. |\n| Popover | Renders a popover with custom title and content. |\n| Tooltip | Renders a tooltip with custom title. |\n| Collapse | Renders a collapsible element with custom button text and content. |\n| Accordion | Renders an accordion with collapsible items. |\n| Tab | Renders a tab element with multiple content panes. |\n| Dropdown | Renders a dropdown menu with custom options. |\n| InputGroup | Renders an input element with custom type and placeholder. |\n| NavbarBrand | Renders a navbar brand with custom brand text. |\n| CardDeck | Renders a card deck with a list of cards. |\n| CardGroup | Renders a card group with a list of cards. |\n| Tabs | Renders tabs with multiple content panes. |\n| Form | Renders a form element with custom action and method. |\n\n\n### styled_components\n\n\n| Class Name | Description |\n|--------------------|--------------------------------------------------------------------|\n| StyledButton | Renders a styled button element with custom CSS. |\n| StyledInput | Renders a styled input element with custom CSS. |\n| StyledCard | Renders a styled card element with custom title and content. |\n| StyledNavbar | Renders a styled navigation bar with custom brand and links. |\n| StyledAlert | Renders a styled alert message with customizable type and message. |\n| StyledModal | Renders a styled modal with custom title and content. |\n| StyledForm | Renders a styled form element with custom action and method. |\n| StyledAccordion | Renders a styled accordion with collapsible sections. |\n| StyledTabs | Renders styled tabs with multiple content panes. |\n| StyledDropdown | Renders a styled dropdown menu with custom options. |\n| StyledCheckbox | Renders a styled checkbox input with custom label. |\n| StyledRadio | Renders a styled radio button input with custom label. |\n| StyledTextarea | Renders a styled textarea element with custom placeholder. |\n| StyledImage | Renders an image with custom source and alternate text. |\n| StyledProgressBar | Renders a styled progress bar with customizable progress value. |\n| StyledTooltip | Renders a styled tooltip with custom text and content. |\n| StyledBadge | Renders a styled badge with custom text. |\n\n\n### js_components\n\n\n| Class Name | Description |\n|---------------------------|------------------------------------------|\n| CounterComponent | Renders a counter with increment and decrement buttons. |\n| ToggleSwitchComponent | Renders a toggle switch with an optional default state. |\n| TooltipComponent | Renders a tooltip with specified text and content. |\n| DropdownComponent | Renders a dropdown with specified options. |\n| AlertComponent | Renders an alert with a specified message and type. |\n| CopyToClipboardComponent | Renders a button to copy specified content to the clipboard. |\n| ScrollToTopComponent | Renders a button to scroll to the top of the page. |\n| DarkModeToggleComponent | Renders a dark mode toggle switch. |\n| HTTPRequestComponent | Base class for making HTTP requests with specified URL and method. |\n| GETRequestComponent | Renders a button to make a GET request to a specified URL. Inherits from HTTPRequestComponent. |\n| POSTRequestComponent | Renders a button to make a POST request to a specified URL. Inherits from HTTPRequestComponent. |\n| PUTRequestComponent | Renders a button to make a PUT request to a specified URL. Inherits from HTTPRequestComponent. |\n| DELETERequestComponent | Renders a button to make a DELETE request to a specified URL. Inherits from HTTPRequestComponent. |\n| ImageSliderComponent | Renders an image slider with specified images. |\n| AccordionComponent | Renders an accordion with specified sections. |\n| CountdownTimerComponent | Renders a countdown timer to a specified target date. |\n| RandomQuoteComponent | Renders a random quote from a specified list of quotes. |\n| InteractiveMapComponent | Renders an interactive map with specified latitude, longitude, zoom level, and API key. |\n| ModalComponent | Renders a modal window with specified content. |\n| LightboxComponent | Renders a lightbox gallery with specified images. |\n| ImageZoomComponent | Renders an image with zoom functionality. |\n| CarouselComponent | Renders a carousel with specified images. |\n| ProgressBarComponent | Renders a progress bar with specified maximum value. |\n\n\n\n### styling \n\n| Class Name | Description |\n|-----------------|--------------------------------------------------------------|\n| `CSS` | Represents a set of CSS styles to be applied to a component. |\n| `Theme` | Represents a theme to be applied to a component. |\n| `CSSInJS` | Represents a CSS-in-JS library to be used with a component. |\n| `StyledComponent` | Represents a component with specific styles applied. |\n| `SASS` | Represents SASS code to be applied to a component. |\n| `Less` | Represents Less code to be applied to a component. |\n| `TailwindCSS` | Represents Tailwind CSS classes to be applied. |\n| `Bootstrap` | Represents a specific version of Bootstrap to be used. |\n\n\n\n## Author\n\n[Ishan Oshada](https://github.com/ishanoshada)\n\n## License\n\nThis project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.",
"bugtrack_url": null,
"license": "MIT",
"summary": "A Python package for web development",
"version": "0.3.0",
"project_urls": {
"Bug Reports": "https://github.com/ishanoshada/WebifyPy/issues",
"Homepage": "https://github.com/ishanoshada/WebifyPy",
"Source": "https://github.com/ishan oshada/WebifyPy"
},
"split_keywords": [
"web development",
"python package"
],
"urls": [
{
"comment_text": "",
"digests": {
"blake2b_256": "d7f31f358f2bbd343212d6b850a320737b0f8c66e6070a6fa476e9c7256bb5ab",
"md5": "e7c6e0dacb9dfbf915d8390a08fe2175",
"sha256": "411fa9594828b626d16adf880c81c6cf0a14beac9ef55084403e3abcc114a404"
},
"downloads": -1,
"filename": "WebifyPy-0.3.0.tar.gz",
"has_sig": false,
"md5_digest": "e7c6e0dacb9dfbf915d8390a08fe2175",
"packagetype": "sdist",
"python_version": "source",
"requires_python": null,
"size": 19379,
"upload_time": "2023-10-26T12:09:30",
"upload_time_iso_8601": "2023-10-26T12:09:30.652679Z",
"url": "https://files.pythonhosted.org/packages/d7/f3/1f358f2bbd343212d6b850a320737b0f8c66e6070a6fa476e9c7256bb5ab/WebifyPy-0.3.0.tar.gz",
"yanked": false,
"yanked_reason": null
}
],
"upload_time": "2023-10-26 12:09:30",
"github": true,
"gitlab": false,
"bitbucket": false,
"codeberg": false,
"github_user": "ishanoshada",
"github_project": "WebifyPy",
"travis_ci": false,
"coveralls": false,
"github_actions": false,
"lcname": "webifypy"
}
JSON
