Skip to content

Commit

Permalink
update code
Browse files Browse the repository at this point in the history
  • Loading branch information
Shadi Abu Hilal authored and Shadi Abu Hilal committed Jan 4, 2024
1 parent f6f8128 commit a366e74
Show file tree
Hide file tree
Showing 19 changed files with 1,210 additions and 68 deletions.
7 changes: 7 additions & 0 deletions .eslintignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
node_modules
coverage
docs
.editorconfig
.DS_Store
.gitignore
index.cjs
16 changes: 16 additions & 0 deletions .github/workflows/pull_request-workflows.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
# This workflow will do a clean installation of node dependencies, cache/restore them, build the source code and run tests across different versions of node
# For more information see: https://docs.github.com/en/actions/automating-builds-and-tests/building-and-testing-nodejs

name: pull_request job

on:
pull_request:
branches: '*'

jobs:
call-resuable-workflows:
uses: ./.github/workflows/resuable-workflows.yml
with:
node-version: '["16.x", "18.x", "20.x"]'
# secrets:
# envPAT: ${{ secrets.envPAT }}
48 changes: 48 additions & 0 deletions .github/workflows/push-workflows.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,48 @@
# This workflow will do a clean installation of node dependencies, cache/restore them, build the source code and run tests across different versions of node
# For more information see: https://docs.github.com/en/actions/automating-builds-and-tests/building-and-testing-nodejs

name: push job

on:
push:
branches: [ "main" ]

jobs:
call-resuable-workflows:
uses: ./.github/workflows/resuable-workflows.yml
with:
node-version: '["20.x"]'

Publish:
needs: call-resuable-workflows
runs-on: ubuntu-latest
permissions:
contents: write # to be able to publish a GitHub release
issues: write # to be able to comment on released issues
pull-requests: write # to be able to comment on released pull requests
id-token: write # to enable use of OIDC for npm provenance
strategy:
fail-fast: false
matrix:
node-version: ["20.x"]
# See supported Node.js release schedule at https://nodejs.org/en/about/releases/
steps:
- name: Checkout
uses: actions/checkout@v3
with:
fetch-depth: 0
- name: Setup Node.js ${{ matrix.node-version }}
uses: actions/setup-node@v3
with:
node-version: ${{ matrix.node-version }}
registry-url: https://registry.npmjs.org/
cache: 'npm'
- name: Install dependencies
run: npm clean-install
- name: Verify the integrity of provenance attestations and registry signatures for installed dependencies
run: npm audit signatures
- name: Release
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
NODE_AUTH_TOKEN: ${{ secrets.NPMJS_ACCESS_TOKEN }}
run: npx semantic-release
38 changes: 38 additions & 0 deletions .github/workflows/resuable-workflows.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
name: Reusable workflow

on:
workflow_call:
inputs:
node-version:
required: true
type: string
#secrets:
#token:
#required: true

jobs:
build:

runs-on: ubuntu-latest

strategy:
fail-fast: false
matrix:
node-version: ${{ fromJson(inputs.node-version) }}
# See supported Node.js release schedule at https://nodejs.org/en/about/releases/

steps:
- name: Checkout
uses: actions/checkout@v3
- name: Setup Node.js ${{ matrix.node-version }}
uses: actions/setup-node@v3
with:
node-version: ${{ matrix.node-version }}
registry-url: https://registry.npmjs.org/
cache: 'npm'
- name: Install dependencies
run: npm ci
- name: Build
run: npm run build
- name: Test
run: npm test
13 changes: 13 additions & 0 deletions .npmignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
tests/
stories/
coverage/
docs/
.nyc_output
.jsdoc.json
README.md
.releaserc.json
.github/
.vscode/
jest.config.ts
.storybook/
tsconfig.json
12 changes: 12 additions & 0 deletions .releaserc.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
{
"branches": ["main"],
"plugins": [
"@semantic-release/commit-analyzer",
"@semantic-release/release-notes-generator",
"@semantic-release/changelog",
"@semantic-release/npm",
"@semantic-release/git",
"@semantic-release/github"
]
}

Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions jest.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ const config: Config.InitialOptions = {
setupFilesAfterEnv: ['./tests/setupTests.ts'],
moduleFileExtensions: ['js', 'tsx'],
injectGlobals: true,
collectCoverage: true,
collectCoverageFrom: [
'src/**/*.tsx',
'!**/node_modules/**',
Expand Down
5 changes: 3 additions & 2 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

8 changes: 4 additions & 4 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -12,9 +12,7 @@
"lint": "eslint .",
"p1retest": "npm run lint",
"test": "jest ./tests/index.spec.tsx",
"buildcjs": "npx rollup ./index.js --file ./index.cjs --format cjs",
"build": "npm run buildcjs && npm run document",
"document": "jsdoc ./index.js -c .jsdoc.json -d ./docs -R README.md -p",
"build": "tsc ./src/index.tsx",
"commit": "git-cz",
"install-peer-dep": "npm i react classnames --no-save",
"storybook": "storybook dev -p 6006",
Expand Down Expand Up @@ -63,6 +61,7 @@
"@typescript-eslint/eslint-plugin": "^6.17.0",
"@typescript-eslint/parser": "^6.17.0",
"commitizen": "^4.3.0",
"csstype": "^3.1.3",
"cz-conventional-changelog": "^3.3.0",
"docdash": "^2.0.2",
"eslint": "^8.55.0",
Expand All @@ -79,7 +78,8 @@
"semantic-release": "^22.0.10",
"storybook": "^7.6.7",
"ts-jest": "^29.1.1",
"ts-node": "^10.9.2"
"ts-node": "^10.9.2",
"typescript": "^5.3.3"
},
"config": {
"commitizen": {
Expand Down
95 changes: 95 additions & 0 deletions src/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,95 @@
"use strict";
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
Object.defineProperty(exports, "__esModule", { value: true });
var react_1 = require("react");
var classnames_1 = require("classnames");
var react_2 = require("react");
var CheckIcon = function (_a) {
var style = _a.style, className = _a.className;
return (<svg xmlns="http://www.w3.org/2000/svg" style={style} className={className} fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M5 13l4 4L19 7"/>
</svg>);
};
var WizardStepIndicator = function (_a) {
var id = _a.id, style = _a.style, className = _a.className, _b = _a.canClickOnForwardSteps, canClickOnForwardSteps = _b === void 0 ? false : _b, stepsCount = _a.stepsCount, currentStepIndex = _a.currentStepIndex, _c = _a.useCheckPassedStep, useCheckPassedStep = _c === void 0 ? true : _c, disabled = _a.disabled, btnStepClassName = _a.btnStepClassName, lineBetweenStepsClassName = _a.lineBetweenStepsClassName, activeClassName = _a.activeClassName, inactiveClassName = _a.inactiveClassName, checkIconClassName = _a.checkIconClassName, onClick = _a.onClick;
var stepsArr = new Array(stepsCount).fill(null);
var lastInedx = stepsCount - 1;
var activeBgColor = '#4299e1';
var activeColor = '#ffffff';
var inactiveBgColor = '#edf2f7';
var inactiveColor = '#000000';
var commonStyleObj = {
display: 'inline-block',
width: '1.25rem',
height: '1.25rem',
fontSize: '0.75rem',
};
var btnStepStyleObj = __assign(__assign({}, commonStyleObj), { overflow: 'hidden', appearance: 'none', border: 'none', margin: '0', padding: '0', cursor: 'pointer', outline: 'none', transition: 'all 0.3s ease', borderRadius: '50%' });
if (activeClassName) {
btnStepStyleObj = {
overflow: 'hidden',
margin: '0',
padding: '0',
cursor: 'pointer',
};
}
var lineBetweenStepsStyleObj = __assign(__assign({}, commonStyleObj), { height: '0.2rem' });
if (lineBetweenStepsClassName) {
lineBetweenStepsStyleObj = {
display: 'inline-block',
};
}
if (disabled) {
btnStepStyleObj.opacity = lineBetweenStepsStyleObj.opacity = '0.5';
btnStepStyleObj.cursor = lineBetweenStepsStyleObj.cursor = 'not-allowed';
}
var checkIconStyleObj = __assign(__assign({}, commonStyleObj), { borderRadius: '50%' });
if (checkIconClassName) {
checkIconStyleObj = {
border: 'none'
};
}
return <div id={id} style={__assign(__assign({}, style), { display: 'flex', alignItems: 'center', justifyContent: 'center', transition: 'all 0.3s ease' })} className={className}>
{stepsArr.map(function (_, index) {
var _a, _b;
var isNavBtnDisabled = canClickOnForwardSteps ? false : currentStepIndex < index;
var isLastIndex = index === lastInedx;
var isActive = index <= currentStepIndex;
var isStepBarActive = index < currentStepIndex;
var title = index + 1;
var stepItem = useCheckPassedStep ? <CheckIcon style={checkIconStyleObj} className={(0, classnames_1.default)(checkIconClassName)}/> : title;
var backgroundColor = isActive ?
(activeClassName ? undefined : activeBgColor) :
(inactiveClassName ? undefined : inactiveBgColor);
var color = isActive ?
(activeClassName ? undefined : activeColor) :
(inactiveClassName ? undefined : inactiveColor);
var barBackgroundColor = isStepBarActive ?
(activeClassName ? undefined : activeBgColor) :
(inactiveClassName ? undefined : inactiveBgColor);
var barColor = isStepBarActive ?
(activeClassName ? undefined : activeColor) :
(inactiveClassName ? undefined : inactiveColor);
return <react_2.Fragment key={"wsi-".concat(index)}><button data-testid={"wsi-".concat(index)} disabled={disabled || isNavBtnDisabled} className={(0, classnames_1.default)(btnStepClassName, (_a = {},
_a[activeClassName || ''] = isActive,
_a[inactiveClassName || ''] = !isActive,
_a))} style={__assign(__assign({}, btnStepStyleObj), { backgroundColor: backgroundColor, color: color, cursor: disabled || isNavBtnDisabled ? 'not-allowed' : 'pointer' })} onClick={function () { return onClick(index); }}>{isStepBarActive ? stepItem : title}</button>
{!isLastIndex && <span className={(0, classnames_1.default)(lineBetweenStepsClassName, (_b = {},
_b[activeClassName || ''] = isStepBarActive,
_b[inactiveClassName || ''] = !isStepBarActive,
_b))} style={__assign(__assign({}, lineBetweenStepsStyleObj), { backgroundColor: barBackgroundColor, color: barColor })}/>}
</react_2.Fragment>;
})}
</div>;
};
exports.default = WizardStepIndicator;
Loading

0 comments on commit a366e74

Please sign in to comment.