Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

updated style prop and added chip shadow #138

Merged
merged 1 commit into from
Oct 16, 2024
Merged

updated style prop and added chip shadow #138

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion react/css/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@egovernments/digit-ui-components-css",
"version": "0.0.2-beta.38",
"version": "0.0.2-beta.39",
"license": "MIT",
"main": "dist/index.css",
"author": "Jagankumar <jagan.kumar@egovernments.org>",
Expand Down
4 changes: 4 additions & 0 deletions react/css/src/digitv2/components/buttonsV2.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -155,6 +155,10 @@
color: theme(digitv2.lightTheme.primary-1);
}

.digit-button-label{
color: theme(digitv2.lightTheme.primary-1);
}

&.disabled {
@apply opacity-50;
border: 0.063rem solid theme(digitv2.lightTheme.text-disabled);
Expand Down
4 changes: 4 additions & 0 deletions react/css/src/digitv2/components/chipV2.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,10 @@
}


&.clickable:hover{
box-shadow: 0.125rem 0.125rem 0.25rem 0rem #36363633;
}

svg{
flex-shrink: 0;
}
Expand Down
2 changes: 1 addition & 1 deletion react/example/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
"build": "webpack --mode production"
},
"dependencies": {
"@egovernments/digit-ui-components": "0.0.2-beta.47",
"@egovernments/digit-ui-components": "0.0.2-beta.48",
"@egovernments/digit-ui-libraries": "1.8.2-beta.1",
"@egovernments/digit-ui-module-common": "1.7.10",
"@egovernments/digit-ui-module-core": "1.8.1-beta.6",
Expand Down
2 changes: 1 addition & 1 deletion react/example/public/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
rel='stylesheet' type='text/css'>
<link
rel="stylesheet"
href="https://unpkg.com/@egovernments/digit-ui-components-css@0.0.2-beta.38/dist/index.css"
href="https://unpkg.com/@egovernments/digit-ui-components-css@0.0.2-beta.39/dist/index.css"
/>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#00bcd1" />
Expand Down
2 changes: 1 addition & 1 deletion react/modules/core/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
"prepublish": "yarn build"
},
"dependencies": {
"@egovernments/digit-ui-components": "0.0.2-beta.47",
"@egovernments/digit-ui-components": "0.0.2-beta.48",
"@egovernments/digit-ui-react-components": "1.8.1-beta.4",
"react": "17.0.2",
"react-dom": "17.0.2",
Expand Down
2 changes: 1 addition & 1 deletion react/modules/sample/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@
},
"dependencies": {
"@egovernments/digit-ui-react-components": "1.8.1-beta.4",
"@egovernments/digit-ui-components": "0.0.2-beta.47",
"@egovernments/digit-ui-components": "0.0.2-beta.48",
"react": "17.0.2",
"react-date-range": "^1.4.0",
"react-dom": "17.0.2",
Expand Down
4 changes: 2 additions & 2 deletions react/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -79,13 +79,13 @@
"@babel/plugin-syntax-jsx": "^7.24.1",
"@babel/preset-react": "^7.24.1",
"@egovernments/digit-ui-libraries": "1.8.2-beta.1",
"@egovernments/digit-ui-components-css":"0.0.2-beta.38",
"@egovernments/digit-ui-components-css":"0.0.2-beta.39",
"@egovernments/digit-ui-module-core": "1.8.1-beta.6",
"@egovernments/digit-ui-module-project": "0.3.4",
"@egovernments/digit-ui-module-sample": "0.0.1",
"@egovernments/digit-ui-react-components": "1.7.10",
"@egovernments/digit-ui-svg-components": "1.0.12",
"@egovernments/digit-ui-components": "0.0.2-beta.47",
"@egovernments/digit-ui-components": "0.0.2-beta.48",
"babel-loader": "8.1.0",
"clean-webpack-plugin": "4.0.0",
"css-loader": "5.2.6",
Expand Down
2 changes: 1 addition & 1 deletion react/ui-components/.storybook/preview-head.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<head>
<!-- .storybook/preview-head.html -->
<link rel="stylesheet" href="https://unpkg.com/@egovernments/digit-ui-components-css@0.0.2-beta.38/dist/index.css"/>
<link rel="stylesheet" href="https://unpkg.com/@egovernments/digit-ui-components-css@0.0.2-beta.39/dist/index.css"/>
<!-- Pull in static files served from your Static directory or the internet -->
<!-- Example: `main.js|ts` is configured with staticDirs: ['../public'] and your font is located in the `fonts` directory inside your `public` directory -->
<link rel="preload" href="/fonts/my-font.woff2" />
Expand Down
4 changes: 2 additions & 2 deletions react/ui-components/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@egovernments/digit-ui-components",
"version": "0.0.2-beta.47",
"version": "0.0.2-beta.48",
"license": "MIT",
"main": "dist/index.js",
"module": "dist/index.modern.js",
Expand Down Expand Up @@ -52,7 +52,7 @@
"dist"
],
"dependencies": {
"@egovernments/digit-ui-components-css": "0.0.2-beta.38",
"@egovernments/digit-ui-components-css": "0.0.2-beta.39",
"@egovernments/digit-ui-libraries": "1.8.1-beta.1",
"@egovernments/digit-ui-svg-components": "1.0.12",
"@googlemaps/js-api-loader": "1.13.10",
Expand Down
2 changes: 1 addition & 1 deletion react/ui-components/public/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta name="description" content="Web site created using create-react-app" />
<link rel="stylesheet" href="https://unpkg.com/@egovernments/digit-ui-components-css@0.0.2-beta.38/dist/index.css"/>
<link rel="stylesheet" href="https://unpkg.com/@egovernments/digit-ui-components-css@0.0.2-beta.39/dist/index.css"/>
<link rel="icon" href="https://egov-dev-assets.s3.ap-south-1.amazonaws.com/browser-icon.png" />
<style>
.custom-class path {
Expand Down
2 changes: 1 addition & 1 deletion react/ui-components/src/atoms/Chip.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@ const Chip = ({
onClick={disabled ? null : onTagClick}
>
<div
className={`digit-tag ${isErrorTag ? "errortag" : ""} ${hideClose ? "noClose" : ""} ${!iconReq ? "noIcon" : ""} ${
className={`digit-tag ${isErrorTag ? "errortag" : ""} ${hideClose ? "noClose" : ""} ${!iconReq ? "noIcon" : ""} ${onTagClick || onClick ? "clickable" : ""} ${
className ? className : ""
}`}
style={tagStyles}
Comment on lines +45 to 48
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Enhance accessibility with ARIA attributes

To improve the accessibility of the Chip component, consider adding appropriate ARIA attributes. For instance, you could add role="button" and aria-disabled={disabled} when the chip is clickable.

Example:

<div
  className={`digit-tag ${isErrorTag ? "errortag" : ""} ${hideClose ? "noClose" : ""} ${!iconReq ? "noIcon" : ""} ${onTagClick || onClick ? "clickable" : ""} ${
    className ? className : ""
  }`}
  style={tagStyles}
  role={onTagClick || onClick ? "button" : undefined}
  aria-disabled={disabled}
>
  {/* ... rest of the component ... */}
</div>

Expand Down
4 changes: 2 additions & 2 deletions react/ui-components/src/hoc/FormComposerV2.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -344,8 +344,8 @@ export const FormComposer = (props) => {
const renderFormFields = (props, section, index, array, sectionFormCategory) => (
<React.Fragment key={index}>
{!props.childrenAtTheBottom && props.children}
{props.heading && <Header style={{ ...props.headingStyle }}> {props.heading} </Header>}
{props.description && <Header> {props.description} </Header>}
{props.heading && <Header styles={{ ...props.headingStyle }}> {props.heading} </Header>}
{props.description && <Header styles={{ ...props.descriptionStyles }}> {props.description} </Header>}
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

Ensure consistent prop naming for styling across components

Similar to the previous line, the prop name has been changed from style to styles. This change should be applied consistently across all components that accept styling props.

To maintain consistency and prevent potential styling issues, consider the following options:

  1. If the Header component is designed to accept a styles prop, update all other component instances in the file to use styles instead of style.
  2. If this change was unintentional, revert both lines 347 and 348 to use style instead of styles.

Example of option 1:

-{props.heading && <Header styles={{ ...props.headingStyle }}> {props.heading} </Header>}
-{props.description && <Header styles={{ ...props.descriptionStyles }}> {props.description} </Header>}
+{props.heading && <Header style={{ ...props.headingStyle }}> {props.heading} </Header>}
+{props.description && <Header style={{ ...props.descriptionStyles }}> {props.description} </Header>}

Please review and apply the appropriate change to ensure consistency throughout the codebase.

Committable suggestion was skipped due to low confidence.

{props.text && <p>{props.text}</p>}
{formFields(section, index, array, sectionFormCategory)}
{props.childrenAtTheBottom && props.children}
Expand Down