{"id":16254322,"url":"https://github.com/celer/laces","last_synced_at":"2025-06-13T11:07:35.532Z","repository":{"id":8072104,"uuid":"9484853","full_name":"celer/laces","owner":"celer","description":"A utility for twitter's bootstrap to create forms and menus","archived":false,"fork":false,"pushed_at":"2013-04-17T02:08:36.000Z","size":128,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-06-13T11:06:20.130Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/celer.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2013-04-16T23:18:12.000Z","updated_at":"2014-01-30T05:33:40.000Z","dependencies_parsed_at":"2022-08-06T08:00:03.373Z","dependency_job_id":null,"html_url":"https://github.com/celer/laces","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/celer/laces","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/celer%2Flaces","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/celer%2Flaces/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/celer%2Flaces/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/celer%2Flaces/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/celer","download_url":"https://codeload.github.com/celer/laces/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/celer%2Flaces/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":259634348,"owners_count":22887697,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-10T15:21:06.267Z","updated_at":"2025-06-13T11:07:35.503Z","avatar_url":"https://github.com/celer.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"Build Status: [![Build Status](https://travis-ci.org/celer/laces.png)](https://travis-ci.org/celer/laces)\n\nIntroduction\n============\n\nLaces is a simple client side and server side library for generating forms and menus for Bootstrap. It tries to generate mostly nicely formated HTML which can directly be used in a browser or converted to the template language of your choosing. \n\n\nForms\n=====\n\nPretty much you pass it a javascript object like so:\n\n```javascript\n\n\tLaces.form({\n\t\tfields: {\n\t\t\tusername:{\n\t\t\t\ttype: \"text\",\n\t\t\t\tplaceholder:\"username...\"\n\t\t\t\tlabel:\"Username\",\n\t\t\t\tdesc:\"The username for this user\",\n\t\t\t\tprepend:{ \n\t\t\t\t\tinput:\"@\"\n\t\t\t\t}\n\t\t\t},\n\t\t\tpassword:{ \n\t\t\t\ttype:\"password\",\n\t\t\t\tplaceholder:\"password...\",\n\t\t\t\tlabel:\"Password\",\n\t\t\t\tdesc:\"The password for the user\",\n\t\t\t}\n\t\t},\n\t\tformType: \"inline\"\n\t})\n\n\n```\n\nand it will generate the html for a form for you. \n\n * fields\n  * field\n    * type - text,password,textarea,hidden,checkbox,radio,select\n    * placeholder - the placeholder to use \n    * label - the label for the field \n    * desc - the description of the field \n    * prepend or append - prepend or append fields to the control (only works on input/password)\n      * button - the label to use on a button\n      * input - the label to use on an input\n    * menu\n      * title - the title for a menu\n      * items - see the section below for menu\n    * values - values to use for a select box\n    * multiple - use a multiple select\n * formType - the type of form to generate, inline, horizontal or vertical - will default to vertical\n\nMenus\n=====\n\nIf you supply a javascript object to Laces.menu it will generate a menu for you:\n\n```Javascript\n\tLaces.menu({items: [\n\t\t\"bar\",\n\t\t\"----\", \n\t\t{ href:\"href\", id:\"wolf\", title:\"wolf\" }\n\t]});\n```\nHere is the [example](http://htmlpreview.github.io/?https://github.com/celer/laces/blob/master/test/menu.html)\n\n\n * items (string or /^-+$/ or object)\n\t* href - the href for the menu item\n  * id - the id for the menu item\n  * title - the title for the menu item\n\n - If it finds a string that matches the regex /^-+$/ it will create a divider otherwise it will create a menu item with the string value\n\nHow to use it\n=============\n\nIn a browser:\n\n```html\n\t\u003cscript src=\"laces.min.js\"\u003e\u003c/script\u003e\n\t\u003cscript\u003e\n\t\tLaces.menu({...});\n\t\u003c/script\u003e\n```\n\nIn NodeJS:\n\n```Javascript\n\tvar Laces = require('laces');\n\n\tLaces.menu({...});\n```\t\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fceler%2Flaces","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fceler%2Flaces","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fceler%2Flaces/lists"}